@charset "utf-8";
body.home {
  background-color: #adefec;
}

/* ====================================================
mainvisual
==================================================== */
.mainvisual {
  position: relative;
  width: 100%;
}
.mainvisual .mv-img {
  width: 100%;
}
.mainvisual .mainvisual-bg {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  width: 100%;
  height: 102.85vw;
  background: url(../img/home/mv_back.png) no-repeat;
  background-position: top right;
  background-size: cover;
}
.load01-bg {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  width: 100%;
  height: 163.32vw;
  background: url(../img/home/section01_back.png) no-repeat;
  background-position: top right;
  background-size: cover;
}
.mainvisual-txt {
  position: absolute;
  top: 32.8%;
  left: 9.66%;
  z-index: 5;
}
.mainvisual-txt h2 {
  margin-bottom: 10px;
  padding: 14px 20px 9px;
  font-size: min(4.026vw, 80px);
  letter-spacing: normal;
}
.mainvisual-txt h2 span {
  position: relative;
  z-index: 2;
  display: inline-block;
  color: #fff;
}
.mainvisual-txt p {
  margin-top: 21px;
  font-size: 1.46vw;
  font-size: min(1.46vw, 27px);
  font-weight: bold;
  line-height: 1.7;
  text-shadow: 3px 3px #fff;
}
.mainvisual-txt p.fade-up.active {
  animation-delay: 1s;
}
/*メインビジュアル アニメーション*/
.animation-line {
  position: relative;
  display: inline-block;
  line-height: 1;
}
.animation-line span {
  transition: all 0.5s;
  opacity: 0;
}
.animation-line.animation-text-in span {
  opacity: 1;
}
.animation-line::after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0;
  height: 100%;
  background: #f29600;
  content: "";
  transition: width 0.5s cubic-bezier(0.42, 0, 0, 0.99), left 0.35s ease-in-out;
}
.animation-line.animation-line-in::after {
  width: 100%;
}
@media screen and (min-width: 1025px) and (max-width: 1200px) {
  .mainvisual-txt {
    left: 6%;
  }
}
@media (max-width: 1024px) {
  .mainvisual-txt {
    left: 6%;
  }
  .mainvisual-txt p {
    margin-top: 11px;
    font-size: var(--font-size17);
  }
}
@media screen and (max-width: 767px) {
  .load01-bg {
    display: none;
  }
  .mainvisual .mainvisual-bg {
    display: none;
  }
  .mainvisual {
    height: auto;
  }
  .mainvisual-txt {
    position: static;
    margin-top: -108px;
    padding: 0 0 0 8.2%;
  }
  .mainvisual-txt h2 {
    padding: 12px 20px 7px;
    font-size: var(--font-size32);
  }
  .mainvisual-txt p {
    font-size: var(--font-size16);
  }
}

/* ====================================================
topics-contents
==================================================== */
.topics-js.js-animation {
  padding-top: 6.3vw;
}
.topics-contents {
  position: relative;
  z-index: 2;
  width: 79.86%;
  padding: 44px 5.7% 62px 13.39%;
  border-radius: 0 50px 50px 0;
}
.topics-contents > .flex {
  position: relative;
  -webkit-box-align: start;
  align-items: flex-start;
  -ms-flex-align: start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 22px;
}
.topics-contents > .flex .c-tlt h2 {
  width: 11.4vw;
  min-width: 120px;
  max-width: 155.81px;
}
.topics-contents .common-btn_active {
  width: 18.2%;
  min-width: 150px;
  margin-top: 15px;
}
.topics-contents .common-btn_active.c-sp-only {
  display: none;
}
.topics-contents .common-btn_active a {
  padding: 7% 0 4%;
}
.topics-contents article {
  margin-bottom: 20px;
}
.topics-contents article a {
  display: block;
}
.topics-contents article .topics-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-align: center;
}
.topics-contents article .topics-box figure {
  overflow: hidden;
  width: 16.8%;
  margin-right: 30px;
  border: 1px solid #e8e8e8;
  border-radius: 10px;
}
.topics-contents article .topics-box .topics-txt {
  width: 79.5%;
}
.topics-contents article .topics-box .topics-txt time {
  display: inline-block;
  margin-bottom: 6px;
  color: #6c6c6c;
}
.topics-contents article .topics-box .topics-txt p {
  font-weight: bold;
  line-height: 1.5;
}
.topics-contents .illust01 {
  position: absolute;
  top: -74%;
  right: 22%;
  width: 6.78vw;
  min-width: 92.67px;
}
.topics-contents .illust02 {
  position: absolute;
  bottom: -52px;
  left: 7%;
  width: 7.73%;
}
@media (max-width: 1024px) {
  .topics-contents {
    width: 85%;
    padding: 44px 5% 62px 8%;
  }
  .topics-contents .illust01 {
    right: 27%;
  }
  .topics-contents article .topics-box figure {
    width: 20%;
    margin-right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .topics-js.js-animation {
    padding-top: 77px;
  }
  .topics-contents {
    position: relative;
    width: 88%;
    max-width: 500px;
    margin: auto;
    padding: 38px 4.8% 30px;
    border-radius: 18px;
  }
  .topics-contents:after {
    position: absolute;
    right: 0;
    bottom: -63px;
    z-index: -1;
    display: block;
    width: 100%;
    height: 63px;
    background-image: url(../img/home/sp_load_r.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
  }
  .topics-contents > .flex {
    display: block;
  }
  .topics-contents .illust01 {
    top: -68%;
    right: 0;
    width: 67.05px;
    min-width: auto;
  }
  .topics-contents > .flex .c-tlt {
    text-align: center;
  }
  .topics-contents > .flex .c-tlt h2 {
    width: 119.85px;
    margin: auto;
  }
  .topics-contents article {
    margin-bottom: 30px;
  }
  .topics-contents article .topics-box {
    -webkit-box-align: start;
    align-items: flex-start;
    -ms-flex-align: start;
  }
  .topics-contents article .topics-box figure {
    width: 29.1%;
    margin-right: 3.33%;
  }
  .topics-contents article .topics-box .topics-txt {
    width: 67.45%;
  }
  .topics-contents article .topics-box .topics-txt time {
    font-size: var(--font-size14);
  }
  .topics-contents article .topics-box .topics-txt p {
    font-size: var(--font-size14);
  }
  .topics-contents .common-btn_active {
    display: block !important;
    width: 100%;
    margin: 50px auto 0;
  }
  .topics-contents .common-btn_active.c-tab-over {
    display: none !important;
  }
  .topics-contents .common-btn_active a {
    padding: 11px 0 7px;
    font-size: var(--font-size15);
  }
  .topics-contents .illust02 {
    display: none;
  }
}
/* ====================================================
recommend-contents
==================================================== */
.recommend-js {
  padding-top: 7vw;
}
.recommend-contents {
  position: relative;
  z-index: 2;
  width: 79.86%;
  margin-left: auto;
  padding: 45px 13.5% 45px 5.56%;
  border-radius: 50px 0 0 50px;
}
.recommend-contents > .flex {
  -webkit-box-align: start;
  align-items: flex-start;
  -ms-flex-align: start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 21px;
}
.recommend-contents > .flex .c-tlt h2 {
  width: 21.3vw;
  min-width: 262px;
  max-width: 292.27px;
}
.recommend-contents .common-btn_active {
  width: 18.2%;
  min-width: 150px;
  margin-top: 15px;
}
.recommend-contents .common-btn_active a {
  padding: 7% 0 4%;
}
.recommend-contents .recommend-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.recommend-contents .recommend-box article {
  width: 30.8%;
}
.recommend-contents .recommend-box article a {
  display: block;
  width: 100%;
}
.recommend-contents .recommend-box article a[href*=".pdf"]:after {
  display: none;
}

.recommend-contents .recommend-box article figure {
  overflow: hidden;
  width: 100%;
  margin-bottom: 8px;
  border: 1px solid #e8e8e8;
  border-radius: 10px;
}
.recommend-contents .recommend-box article time {
  display: inline-block;
  color: #6c6c6c;
}
.recommend-contents .recommend-box article p {
  font-weight: bold;
  line-height: 1.4;
}
.recommend-contents .recommend-box article:nth-child(2) {
  margin: 0 3.6%;
}
@media (max-width: 1024px) {
  .recommend-contents {
    width: 85%;
    padding: 45px 8% 45px 5%;
  }
  .recommend-contents > .flex {
    margin-bottom: 33px;
  }
}
@media screen and (max-width: 767px) {
  .recommend-js {
    padding-top: 63px;
  }
  .recommend-contents {
    width: 88%;
    max-width: 500px;
    margin: auto;
    padding: 38px 4.8% 30px;
    border-radius: 18px;
  }
  .recommend-contents:after {
    position: absolute;
    right: 0;
    bottom: -63px;
    z-index: -1;
    display: block;
    width: 100%;
    height: 63px;
    background-image: url(../img/home/sp_load_l.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
  }
  .recommend-contents > .flex {
    display: block;
    text-align: center;
  }
  .recommend-contents > .flex .c-tlt h2 {
    width: 224px;
    min-width: auto;
    margin: auto;
  }
  .recommend-contents .recommend-box {
    display: block;
  }
  .recommend-contents .recommend-box article {
    width: 100%;
    margin-bottom: 30px;
  }
  .recommend-contents .recommend-box article:nth-child(2) {
    margin: 0 auto 30px;
  }
  .recommend-contents .recommend-box article time,
  .recommend-contents .recommend-box article p {
    font-size: var(--font-size14);
  }
  .recommend-contents .common-btn_active {
    display: block !important;
    width: 100%;
    margin: 50px auto 0;
  }
  .recommend-contents .common-btn_active a {
    padding: 11px 0 7px;
    font-size: var(--font-size15);
  }
  .recommend-contents .common-btn_active.c-tab-over {
    display: none !important;
  }
}
/* ====================================================
service-contents
==================================================== */
.service-js {
  position: relative;
  padding-top: 13.9vw;
}
.service-contents {
  position: relative;
  z-index: 2;
  width: 86.23%;
  max-width: 1500px;
  margin: 0 auto;
  padding: 60px 0;
  padding: 4.45% 0;
  border-radius: 50px;
}
.service-contents .c-tlt h2 {
  width: 12.7vw;
  min-width: 144px;
  max-width: 174.37px;
  margin: auto;
}
.service-contents .illust03 {
  position: absolute;
  top: -36.5%;
  left: -18%;
  z-index: 3;
  width: 47.7%;
  max-width: 700px;
}
.service-contents .service01-img {
  position: absolute;
  top: 65px;
  left: 16%;
  width: 10.3%;
}
.service-contents .service02-img {
  position: absolute;
  top: 70px;
  right: 6%;
  width: 17.2%;
}
.service-contents .c-tlt {
  margin-bottom: 3.8vw;
  text-align: center;
}
.service-contents .read {
  margin-bottom: 3.5vw;
  font-weight: bold;
  line-height: 1.98;
  text-align: center;
}
.service-contents .read:after {
  display: inline-block;
  width: 35px;
  height: 20px;
  margin: 0 0 2px 5px;
  background-image: url(../img/home/icon_truck.svg);
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  content: "";
}
.service-contents .business-box {
  display: grid;
  width: 88.2%;
  max-width: 1040px;
  margin: auto;

  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 20px;
}
.service-contents .business-box .contents .tlt h3 {
  font-size: var(--font-size34);
  font-weight: bold;
}
.service-contents .business-box .contents .tlt h3 span {
  font-size: var(--font-size28);
}
.service-contents .business-box .contents .tlt p {
  margin-bottom: 26px;
}
.service-contents .business-box .contents {
  padding: 40px 8.8% 20px;
  border-radius: 19px;
}
.service-contents .business-box .contents .common-btn_active a {
  font-size: var(--font-size17);
}
.service-contents .business-box .contents .common-btn_active.comingsoon a {
  border: none;
  background-color: #E8E8E8;
}
.service-contents .business-box .contents .common-btn_active.comingsoon a::before,
.service-contents .business-box .contents .common-btn_active.comingsoon a:hover::before {
  /*width: auto;*/
  display: none;
}
.service-contents .business-box .contents .common-btn_active.comingsoon a::after,
.service-contents .business-box .contents .common-btn_active.comingsoon a:hover::after {
  display: none;
}
.service-contents .business-box .contents .common-btn_active.comingsoon a .btn-animation_text {
  color: #9B9B9B;
}

/* first */
.service-contents .business-box .contents:first-child {
  background-color: rgb(253 240 156 / 71%);

  grid-area: 1 / 1 / 3 / 2;
}
.service-contents .business-box .contents:first-child .tlt {
  text-align: center;
}
.service-contents .business-box .contents:first-child .tlt p {
  margin-bottom: 0;
}
.service-contents .business-box .contents:first-child figure {
  width: 68.9%;
  margin: 9px auto 15px;
}
.service-contents .business-box .contents:first-child .flex {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.service-contents .business-box .contents:first-child .flex .common-btn_active {
  width: 48.4%;
  margin-bottom: 12px;
}
.service-contents .business-box .contents:first-child .flex .common-btn_active a {
  padding: 11px 0 8px;
  border-radius: 33px;
}

/* Second */
.service-contents .business-box .contents:nth-child(2) {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 40px 6.2% 16px;
  background-color: #cff7f5;

  grid-area: 1 / 2 / 2 / 3;
}
.service-contents .business-box .contents:nth-child(2) .tlt {
  width: 268px;
  margin-right: 18px;
}
.service-contents .business-box .contents:nth-child(2) .tlt h3 {
  font-size: var(--font-size28);
}
.service-contents .business-box .contents:nth-child(2) .tlt h3 span {
  font-size: var(--font-size20);
}
.service-contents .business-box .contents:nth-child(2) .tlt .common-btn_active {
  width: 98%;
  max-width: 254px;
}
.service-contents .business-box .contents:nth-child(2) .tlt .common-btn_active a {
  padding: 13px 0 8px;
}
.service-contents .business-box .contents:nth-child(2) figure {
  -ms-flex-item-align: center;
  align-self: center;
  width: calc(100% - 286px);
  max-width: 159.32px;
  margin-top: 16px;
}

/* third */
.service-contents .business-box .contents:nth-child(3) {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 40px 3.7% 16px 6.2%;
  background-color: #dcfdbb;

  grid-area: 2 / 2 / 3 / 3;
}
.service-contents .business-box .contents:nth-child(3) .tlt {
  width: 268px;
  margin-right: 9px;
}
.service-contents .business-box .contents:nth-child(3) .tlt h3 {
  font-size: var(--font-size28);
}
.service-contents .business-box .contents:nth-child(3) .tlt h3 span {
  font-size: var(--font-size20);
}
.service-contents .business-box .contents:nth-child(3) .tlt .common-btn_active {
  width: 98%;
  max-width: 254px;
}
.service-contents .business-box .contents:nth-child(3) .tlt .common-btn_active a {
  padding: 13px 0 8px;
}
.service-contents .business-box .contents:nth-child(3) figure {
  width: calc(100% - 277px);
  max-width: 181.89px;
  margin-top: 16px;
}
@media (max-width: 1200px) {
  .service-contents .business-box .contents:nth-child(2) .tlt h3 span,
  .service-contents .business-box .contents:nth-child(3) .tlt h3 span {
    display: block;
  }
  .service-contents .business-box .contents:nth-child(2) .tlt,
  .service-contents .business-box .contents:nth-child(3) .tlt {
    width: 58.2%;
    margin-right: 0;
  }
  .service-contents .business-box .contents:nth-child(2) figure {
    width: 35.8%;
  }
  .service-contents .business-box .contents:nth-child(3) figure {
    width: 40.6%;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1200px) {
  .service-contents {
    width: 90%;
  }
  .service-contents .business-box {
    width: 92%;
  }
  .service-contents .business-box .contents {
    padding: 40px 4% 20px;
  }
  .service-contents .business-box .contents:first-child .flex .common-btn_active {
    width: 49%;
  }
  .service-contents .business-box .contents .common-btn_active a {
    font-size: var(--font-size16);
  }
}
@media (max-width: 1024px) {
  .service-contents .illust03 {
    top: -21%;
    width: 42%;
  }
  .service-contents .service01-img {
    left: 10%;
  }
  .service-contents .business-box {
    width: 94%;
  }
  .service-contents .business-box .contents .tlt h3 {
    font-size: var(--font-size26);
  }
  .service-contents .business-box .contents .tlt h3 span {
    font-size: var(--font-size20);
  }
  .service-contents .business-box .contents {
    padding: 20px 4% 20px;
  }
  .service-contents .business-box .contents .common-btn_active a {
    font-size: var(--font-size14);
  }
  .service-contents .business-box .contents:nth-child(2),
  .service-contents .business-box .contents:nth-child(3) {
    padding: 25px 6.2% 16px;
  }
  .service-contents .business-box .contents:nth-child(2) .tlt h3,
  .service-contents .business-box .contents:nth-child(3) .tlt h3 {
    margin-bottom: 4px;
    line-height: 1.4;
  }
  .service-contents .business-box .contents:first-child .flex .common-btn_active {
    width: 49%;
  }
  .service-contents .business-box .contents:nth-child(2) .tlt .common-btn_active a,
  .service-contents .business-box .contents:nth-child(3) .tlt .common-btn_active a {
    padding: 8px 0 8px;
  }
  .service-contents .business-box .contents .common-btn_active a::after {
    right: 11px;
  }
  .service-contents .business-box .contents .tlt p {
    font-size: var(--font-size13);
  }
}
@media screen and (max-width: 767px) {
  .service-js {
    padding-top: 63px;
  }
  .service-contents {
    position: relative;
  }
  .service-contents:after {
    position: absolute;
    right: 0;
    bottom: -63px;
    z-index: -1;
    display: block;
    width: 100%;
    height: 63px;
    background-image: url(../img/home/sp_load_r.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
  }
  .service-contents .illust03 {
    display: none;
  }
  .service-contents {
    width: 88%;
    max-width: 500px;
    margin: auto;
    padding: 38px 4.8% 30px;
    border-radius: 18px;
  }
  .service-contents .service01-img,
  .service-contents .service02-img {
    display: none;
  }
  .service-contents .c-tlt {
    margin-bottom: 28px;
    text-align: center;
  }
  .service-contents .c-tlt h2 {
    width: 134.13px;
    min-width: auto;
    margin: auto;
  }
  .service-contents .read {
    margin-bottom: 28px;
    font-size: var(--font-size15);
    line-height: 1.7;
    text-align: left;
  }
  .service-contents .business-box {
    display: block;
    width: 100%;
  }
  .service-contents .business-box .contents {
    position: relative;
    margin-bottom: 20px;
    padding: 30px 0 33px;
  }
  .service-contents .business-box .contents .tlt h3 span {
    font-size: var(--font-size22);
  }
  .service-contents .business-box .contents .tlt p {
    font-size: var(--font-size15);
  }
  .service-contents .business-box .contents:first-child figure {
    position: absolute;
    bottom: 40px;
    left: -5px;
    width: 44.5%;
    max-width: 165px;
    margin: auto;
  }
  .service-contents .business-box .contents:first-child .flex {
    display: block;
    width: 56%;
    margin: 22px 0 0 auto;
    padding-right: 16px;
  }
  .service-contents .business-box .contents:first-child .flex .common-btn_active {
    width: 100%;
    margin-right: 16px;
    margin-bottom: 5px;
  }
  .service-contents .business-box .contents:first-child .flex .common-btn_active a {
    padding: 7px 0 6px 9px;
    font-size: var(--font-size13);
    text-align: left;
  }
  .service-contents .business-box .contents:nth-child(2) {
    padding: 30px 2.3% 23px 5%;
  }
  .service-contents .business-box .contents:nth-child(3) {
    margin-bottom: 0;
    padding: 30px 2.3% 15px 5%;
  }
  .service-contents .business-box .contents:nth-child(2) .tlt,
  .service-contents .business-box .contents:nth-child(3) .tlt {
    width: 67%;
  }
  .service-contents .business-box .contents:nth-child(2) .tlt h3,
  .service-contents .business-box .contents:nth-child(3) .tlt h3 {
    font-size: var(--font-size24);
  }
  .service-contents .business-box .contents:nth-child(2) .tlt h3 span,
  .service-contents .business-box .contents:nth-child(3) .tlt h3 span {
    font-size: var(--font-size16);
  }
  .service-contents .business-box .contents:nth-child(2) .tlt .common-btn_active,
  .service-contents .business-box .contents:nth-child(3) .tlt .common-btn_active {
    width: 88%;
    max-width: 500px;
  }
  .service-contents .business-box .contents:nth-child(2) .tlt .common-btn_active a,
  .service-contents .business-box .contents:nth-child(3) .tlt .common-btn_active a {
    padding: 6px 0 4px;
  }
  .service-contents .business-box .contents:nth-child(2) figure {
    width: 41%;
    width: 111.3px;
    margin-top: 0;
  }
  .service-contents .business-box .contents:nth-child(3) figure {
    width: 34%;
    width: 92.18px;
    margin-top: 0;
  }
}
/* ====================================================
sustainability-contents
==================================================== */
.sustainability-contents {
  position: relative;
  z-index: 2;
  width: 82.86%;
  padding: 64px 7% 68px 13%;
  border-radius: 0 50px 50px 0;
}
.sustainability-contents .flex .c-tlt h2 {
  width: 26.6vw;
  min-width: 334px;
  max-width: 364.07px;
}
.sustainability-contents .flex .txt-box {
  width: 66%;
}
.sustainability-contents .flex .txt-box .c-tlt {
  margin-bottom: 4.05vw;
}
.sustainability-contents .flex .txt-box p.read {
  line-height: 2;
}
.sustainability-contents .btn_box .flex {
  margin-top: 4.05vw;

  gap: 1.9%;
}
.sustainability-contents .btn_box .flex .common-btn_active {
  width: 100%;
}
.sustainability-contents .btn_box .flex .common-btn_active a {
  padding: 16px 0;
  border-radius: 33px;
  /*font-size: clamp(1.7rem, 1.244vw, 1.95rem);*/
  font-size: var(--font-size17);
}
.sustainability-contents .flex figure {
  width: 34%;
  max-width: 750px;
}
.sustainability-contents .btn_box .flex .common-btn_active a::after {
  right: 25px;
  width: 0.7vw;
  height: 0.7vw;
}
.load02 {
  position: relative;
  padding-top: 12.8vw;
}
.load02-bg {
  position: absolute;
  top: -15.5vw;
  right: 0;
  z-index: 1;
  width: 100%;
  height: 138.28vw;
  background: url(../img/home/section02_back.png) no-repeat;
  background-position: top right;
  background-size: cover;
}
@media screen and (min-width: 1025px) and (max-width: 1200px) {
  .sustainability-contents {
    width: 89%;
    padding: 62px 5% 53px 7%;
  }
}
@media (max-width: 1024px) {
  .sustainability-contents {
    width: 85%;
    padding: 62px 3% 53px 8%;
  }
  .sustainability-contents .flex {
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
  .sustainability-contents .flex figure {
    width: 45%;
  }
  .sustainability-contents .btn_box .flex .common-btn_active {
    width: 100%;
  }

  .sustainability-contents .btn_box .flex .common-btn_active a {
    font-size: var(--font-size14);
  }
  .sustainability-contents .btn_box .flex .common-btn_active a::after {
    right: 18px;
  }
}
@media screen and (max-width: 767px) {
  .load02 {
    padding-top: 63px;
  }
  .load02-bg {
    display: none;
  }
  .sustainability-contents {
    position: relative;
    width: 88%;
    max-width: 500px;
    margin: auto;
    padding: 38px 4.8% 30px;
    border-radius: 18px;
  }
  .sustainability-contents:after {
    position: absolute;
    right: 0;
    bottom: -63px;
    z-index: -1;
    display: block;
    width: 100%;
    height: 63px;
    background-image: url(../img/home/sp_load_l.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
  }
  .sustainability-contents .flex {
    display: block;
  }
  .sustainability-contents .flex .txt-box {
    width: 100%;
  }
  .sustainability-contents .flex .txt-box .c-tlt {
    margin-bottom: 23px;
    text-align: center;
  }
  .sustainability-contents .flex .c-tlt h2 {
    width: 280px;
    min-width: auto;
  }
  .sustainability-contents .flex .txt-box p.read {
    font-size: var(--font-size14);
  }

  .sustainability-contents .btn_box .flex {
    margin-top: 20px;
  }
  .sustainability-contents .btn_box .flex .common-btn_active {
    width: 63%;
  }
  .sustainability-contents .btn_box .flex .common-btn_active:not(:first-of-type) {
    margin-top: 10px;
  }
  .sustainability-contents .btn_box .flex .common-btn_active a {
    padding: 6px 0 4px;
    font-size: var(--font-size13);
  }
  .sustainability-contents .btn_box .flex .common-btn_active a::after {
    right: 8px;
    width: 4px;
    height: 4px;
  }
  .sustainability-contents .flex figure {
    position: absolute;
    right: -5.2%;
    bottom: -9px;
    width: 136px;
  }
}
/* ====================================================
recruit-contents
==================================================== */
.recruit-js {
  padding-top: 13.3vw;
}
.recruit-contents {
  position: relative;
  z-index: 2;
  width: 83.45%;
  margin-left: auto;
  padding: 57px 8.5% 63px 17%;
  border-radius: 50px 0 0 50px;
}
.recruit-contents .flex {
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-align: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.recruit-contents .flex .c-tlt h2 {
  width: 13vw;
  min-width: 148px;
  max-width: 178px;
}
.recruit-contents .flex .txt-box {
  width: 61.55%;
}
.recruit-contents .flex .txt-box .c-tlt {
  margin-bottom: 3.5vw;
}
.recruit-contents .flex .txt-box .c-tlt p {
  margin-top: 11px;
}
.recruit-contents .flex .txt-box p.read {
  margin-bottom: 3vw;
  line-height: 2;
}
.recruit-contents .flex .txt-box .common-btn_active {
  width: 75%;
}
.recruit-contents .flex .txt-box .common-btn_active a {
  padding: 18px 0;
  border-radius: 33px;
  font-size: clamp(1.7rem, 1.244vw, 1.95rem);
}
.recruit-contents .flex .txt-box .common-btn_active a::after {
  right: 32px;
  width: 0.7vw;
  height: 0.7vw;
}
.recruit-contents .flex figure {
  width: 27.7%;
}
.recruit-contents .illust04 {
  position: absolute;
  bottom: 9%;
  left: -8%;
  width: 26.6%;
}
@media (max-width: 1024px) {
  .recruit-contents {
    width: 85%;
    padding: 57px 5% 63px 8%;
  }
  .recruit-contents .flex .txt-box .common-btn_active {
    width: 100%;
  }
  .recruit-contents .illust04 {
    bottom: -50px;
    left: -11%;
    width: 30%;
  }
}
@media screen and (max-width: 767px) {
  .recruit-js {
    padding-top: 63px;
  }
  .recruit-contents {
    width: 88%;
    max-width: 500px;
    margin: auto;
    padding: 38px 4.8% 62px;
    border-radius: 18px;
  }
  .recruit-contents:after {
    position: absolute;
    right: 0;
    bottom: -63px;
    z-index: -1;
    display: block;
    width: 100%;
    height: 63px;
    background-image: url(../img/home/sp_load_r.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
  }
  .recruit-contents .flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .recruit-contents .flex .txt-box {
    width: 100%;
  }
  .recruit-contents .flex .txt-box .c-tlt {
    margin-bottom: 23px;
    text-align: center;
  }
  .recruit-contents .flex .c-tlt h2 {
    width: 136px;
    margin: auto;
  }
  .recruit-contents .flex .txt-box p.read {
    margin-bottom: 60px;
    font-size: var(--font-size14);
    line-height: 1.7;
    letter-spacing: normal;
  }
  .recruit-contents .flex .txt-box .common-btn_active {
    width: 49.5%;
    margin-left: auto;
  }
  .recruit-contents .flex .txt-box .common-btn_active a {
    padding: 6px 0 4px;
    font-size: var(--font-size13);
  }
  .recruit-contents .flex .txt-box .common-btn_active a::after {
    right: 8px;
    width: 4px;
    height: 4px;
  }
  .recruit-contents .illust04 {
    bottom: 19px;
    left: -13%;
    width: 112.4px;
  }
  .recruit-contents .flex figure {
    position: absolute;
    bottom: 25px;
    left: auto;
    width: 25.15%;
    max-width: 90px;
    margin-right: 24%;
  }
}
/* ====================================================
heartful-contents
==================================================== */
.heartful-js {
  position: relative;
  z-index: 2;
  padding-top: 13.9vw;
}
.heartful-contents {
  position: relative;
  z-index: 2;
  max-width: 1000px;
  margin: 0 auto 3.45vw;
  padding: 3.1% 4% 2.9%;
  border-radius: 19px;
}
.heartful-contents .flex {
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-align: center;
}
.heartful-contents .flex figure {
  width: 36.42%;
  margin-right: 9.4%;
}
.heartful-contents .flex p {
  width: 54%;
  line-height: 1.55;
}
.ems-box {
  position: relative;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-align: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-bottom: 5.5vw;
}
.ems-box figure {
  width: 7.6%;
  min-width: 105px;
  margin-right: 23px;
}
.ems-box p {
  font-size: var(--font-size15);
}
@media screen and (min-width: 1025px) and (max-width: 1200px) {
  .heartful-contents {
    max-width: 800px;
  }
  .ems-box {
    padding-bottom: 100px;
  }
}
@media (max-width: 1024px) {
  .heartful-contents {
    width: 80%;
    margin-bottom: 50px;
  }
  .ems-box {
    padding-bottom: 100px;
  }
}
@media screen and (max-width: 767px) {
  .heartful-js {
    padding-top: 63px;
  }
  .heartful-contents {
    width: 88%;
    max-width: 500px;
    margin: 0 auto 50px;
    padding: 38px 4.8% 26px;
    border-radius: 18px;
  }
  .heartful-contents .flex {
    display: block;
  }
  .heartful-contents .flex figure {
    width: 100%;
    max-width: 300px;
    margin: 0 auto 33px;
  }
  .heartful-contents .flex p {
    width: 100%;
    font-size: var(--font-size14);
    line-height: 1.6;
  }
  .ems-box {
    padding-bottom: 50px;
  }
  .ems-box figure {
    width: 25%;
    max-width: 140px;
    margin-right: 4%;
  }
  .ems-box p {
    font-size: var(--font-size14);
  }
}