@charset "utf-8";

/*----------------------------------------------------
    共通css
----------------------------------------------------*/


.img_center {
  font-size: 10px;
  color: #999999;
  margin: 0 auto 30px;
  text-align: center;
  word-break: break-all;
  line-height: 1rem;
}

.box-corner--white.add .vertical-title--deco2:before {
    content: "REAL VOICES";
    display: block;
    color: #47d15d;
    font-weight: bold;
    font-size: 8rem;
    writing-mode: sideways-rl;
    background: unset;
    left: calc(12rem * -1);
}

.box-corner--white.add .vertical-title--deco2:after {
    content: "";
    left: calc(12rem * -1);
    display: block;
    height: 20rem;
    width: 12rem;
    position: absolute;
    background: url(https://www.sokuryo-career.com/wp/wp-content/uploads/pixta_18954256_S.jpg);
    bottom: -16rem;
    background-size: 100%;
    background-repeat: no-repeat;
}

.vbox-content div p br {
    display: none;
}
.vbox-container {
    height: fit-content;
}
.img_center img {
  padding-bottom: 5px;
}
.z100 {
    position: absolute;
    z-index: 1;
}

.z100+.l-grid {
    margin-top: 20rem;
}
.main-area--low .grid-box_lower {
  margin: 60px 0;
}

.main-area--low .grid-box-title_lower {
  font-size: 4rem;
  background: none;
  padding: 0;
  margin: 0 0 40px;
}

.main-area--low .grid-box-title_lower::before {
  content: none;
}

.main-area--low .grid-box-title_lower .txt_color {
  color: #DC9B23;
}

.main-area--low .grid-box_lower .l-grid-three .card-01 {
  padding: var(--s2) var(--s2) 22rem var(--s6);
}

.main-area--low .grid-box_lower .l-grid-three .card-01__title {
  margin: 0;
  padding: 0;
  font-size: 2.4rem;
  border: none;
  color: #000;
}

.main-area--low .grid-box_lower .l-grid-three .card-01__title::before {
    content: "";
    width: 3rem;
    height: 3rem;
    background: url(img/icon-plus.png) no-repeat center / contain;
    position: absolute;
    right: 0;
    bottom: -0.6rem;
}

.l-grid.lg2 .card-03:last-child:before {
    content: "";
    width: 4rem;
    height: 15rem;
    background: url(https://www.sokuryo-career.com/wp/wp-content/uploads/txt-point3.png) no-repeat center top / contain;
    position: absolute;
    right: -4rem;
    top: 0;
}
.card-02:nth-of-type(1) {
    border-radius: 0 var(--s4) 0 var(--s4);
    background: #fff url(https://www.sokuryo-career.com/wp/wp-content/uploads/pixta_29357750_M.jpg) no-repeat center right / 26.6rem auto;
    grid-area: 1 / 1 / 2 / 2;
}

.card-02:nth-of-type(2) {
    border-radius: var(--s4) 0 var(--s4) 0;
    background: #fff url(https://www.sokuryo-career.com/wp/wp-content/uploads/pixta_19613501_M.jpg) no-repeat left bottom / 25rem auto;
    grid-area: 2 / 1 / 3 / 2;
}

.card-02:nth-of-type(3) {
    padding: var(--s3);
    border-radius: var(--s4) 0 var(--s4) 0;
    background: #fff url(https://www.sokuryo-career.com/wp/wp-content/uploads/31907550_s.jpg) no-repeat left bottom / 17rem auto;
}


/*----------------------------------------------------
    PCサイトcss
----------------------------------------------------*/

@media screen and (min-width: 600px) {
  /*/////////////PC用のCSSをここに作成してください。/////////////*/
  /*/////////////必ず中括弧の中に作成してください。/////////////*/
.l-grid.lg2 {
    display: flex;
}
.sec03-title:before {
    right: calc(100% - 30rem);
}
.box-corner--white.add .card-slider__en {
    transform: unset;
    transform-origin: unset;
    position: unset;
    height: unset;
    font-size: 2rem;
    padding: 5px 15px;
    background: #47D15D;
    color: #fff;
}
.box-corner--white.add .l-grid.grid-step {
    margin: 4rem 0;
    grid-gap: var(--s6);
}
.box-corner--white.add .l-grid.grid-step .card-slider {
    width: 100%;
}	
.box-corner--white.add .l-column__main>.card-slider.card-slider--step {
    width: 80%;
    margin: 0 auto 10rem;
    height: fit-content;
}
	
	
}



/*----------------------------------------------------
    SPサイトcss
----------------------------------------------------*/

@media screen and (max-width: 599px) {
  /*/////////////SP用のCSSをここに作成してください。/////////////*/
  /*/////////////必ず中括弧の中に作成してください。/////////////*/

.z100+.l-grid {
    margin-top: 26rem;
}
  .main-area--low .grid-box-title_lower {
    font-size: 2.3rem;
    margin: 0 0 16px;
  }

  .main-area--low .grid-box_lower .l-grid-three .card-01 {
    padding: var(--s3) var(--s5) var(--s3) var(--s6);
    border-radius: 0 var(--s3) var(--s3) var(--s3);
  }

  .main-area--low .grid-box_lower .l-grid-three .card-01__title {
    font-size: 1.9rem;
  }
.l-grid.lg2 .card-03:last-child:before {
    width: 3rem;
    right: -3rem;
}
.card-02:nth-of-type(1) {
    grid-area: 1 / 1 / 2 / 3;
    background-size: 14rem;
}

.card-02:nth-of-type(2) {
    grid-area: 2 / 1 / 3 / 2;
    padding: var(--s3);
    background-size: 10rem auto;
}

.card-02:nth-of-type(3) {
    grid-area: 2 / 2 / 3 / 3;
    background-size: 56% auto;
}
.box-corner--white.add .vertical-title--deco2:before {
    font-size: 2rem;
    left: unset;
}

.box-corner--white.add .vertical-title--deco2:after {
    right: 0;
    left: unset;
    width: 8rem;
    bottom: unset;
    top: -2rem;
}

.box-corner--white.add .card-slider__en {
    transform: unset;
    transform-origin: unset;
    position: unset;
    height: unset;
    font-size: 2rem;
    padding: 5px 15px;
    background: #47D15D;
    color: #fff;
}

.box-corner--white.add .l-grid.grid-step {
    margin: 3rem 0;
}
.box-corner--white.add .l-grid.grid-step .card-slider {
    width: 100%;
}	
.box-corner--white.add .l-column__main>.card-slider.card-slider--step {
    height: fit-content;
}
	
}