header {
   position: fixed;
   top: 32px;
   width: 100%;
   z-index: 9999;
}

header .logo img {
   max-width: 269px;
}

header nav {
   display: flex;
   justify-content: space-between;
   width: calc((1270 / 1366) * 100%);
   max-width: 1920px;
   margin: auto;
}

header nav .link-area .inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 32px;
}

header nav .link-area ul.menu {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 24px;
}

header nav .link-area ul li a {
   font-size: 15px;
   font-weight: 900;
   color: var(--main-color);
}


header nav .link-area .hd-btn {
   min-width: 144px;
   min-height: 40px;
   font-size: 15px;
   font-weight: 600;
   color: #fff;
   text-align: center;
   padding: 0 1.25em;
   border-radius: 50px;
   border: solid 1px var(--main-color);
   background-color: var(--main-color);
}

header.change nav .link-area .hd-btn {
   color: var(--main-color);
   background-color: #FFF;
}

@media (any-hover:hover) {
   header nav .link-area .hd-btn:hover {
      color: var(--main-color);
      background-color: #fff;
   }

   header.change nav .link-area .hd-btn:hover {
      opacity: 0.75;
      color: var(--main-color);
      background-color: #FFF;
   }
}

@media (min-width:768px) {
   header.change nav .link-area ul li a {
      color: #FFF;
   }
}

/*tb*/
@media (max-width:1024px) {
   header .logo img {
      max-width: 200px;
   }

   header nav .link-area ul li a {
      font-size: 14px;
   }

   header nav .link-area .hd-btn {
      min-width: 135px;
      min-height: 40px;
      font-size: 14px;
   }
}

/*======================
ハンバーガーメニュー
=======================*/
@media (max-width:767px) {
   header {
      top: 20px;
   }

   header nav {
      padding: 0 12px 0 12px;
   }

   header nav .ham-btn+label {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 50px;
      height: 50px;
      border-radius: 50%;
      background-color: var(--main-color);
      border: solid 1px var(--main-color);
      transition: 0.3s ease-in-out;
   }

   header.change nav .ham-btn+label {
      border: solid 1px #FFF;
   }

   header nav .ham-btn+label .inner {
      position: relative;
      width: 12px;
      height: 10px;
      transition: 0.5s;
   }

   header nav .ham-btn+label .inner span {
      position: absolute;
      display: block;
      width: 100%;
      height: 2px;
      border-radius: 5px;
      background-color: #FFF;
      transition: 0.3s;
   }

   header nav .ham-btn+label .inner span:first-of-type {
      top: 0;
   }

   header nav .ham-btn+label .inner span:nth-of-type(2) {
      top: 50%;
      transform: translateY(-50%);
   }

   header nav .ham-btn+label .inner span:last-of-type {
      bottom: 0;
   }

   header nav input.ham-btn[type="checkbox"]:checked~label .inner {
      rotate: 180deg;
   }

   header nav input.ham-btn[type="checkbox"]:checked~label span:first-of-type {
      transform: translateY(-50%) rotate(45deg);
      top: 50%;
   }

   header nav input.ham-btn[type="checkbox"]:checked~label span:nth-of-type(2) {
      opacity: 0;
   }

   header nav input.ham-btn[type="checkbox"]:checked~label span:last-of-type {
      transform: translateY(-50%) rotate(-45deg);
      top: 50%;
   }

   header nav .link-area {
      display: block;
      position: fixed;
      z-index: -1;
      top: 8px;
      left: 8px;
      width: calc(100% - 16px);
      height: calc(100dvh - 16px);
      background-color: #FFF;
      border-radius: 32px;
      opacity: 0;
      pointer-events: none;
      transition: 0.3s ease-in-out;
   }

   header nav input.ham-btn[type="checkbox"]:checked~.link-area {
      opacity: 1.0;
      pointer-events: auto;
   }

   header nav .link-area .inner {
      display: block;
      position: absolute;
      transform: translateY(-50%);
      top: 50%;
      left: 0;
      width: 100%;
      padding: 0 20px;
   }

   header nav .link-area ul.menu {
      display: block;
      width: 100%;
   }

   header nav .link-area ul.menu li {
      text-align: center;
   }

   header nav .link-area ul.menu li a {
      display: block;
      width: 100%;
      font-size: 15px;
      line-height: 1.0;
      padding: 32px 0;
   }

   header nav .link-area ul.menu li:first-of-type a {
      padding-top: 0;
      border-bottom: 1px solid #BAD6E2;
   }

   header nav .link-area ul.menu li:last-of-type a {
      padding-bottom: 0;
      border-top: 1px solid #BAD6E2;
   }

   header nav .link-area .hd-btn {
      width: 100%;
      height: 56px;
      margin: 32px auto 0;
      font-size: 14px;
   }

   header .sp-bg {
      position: fixed;
      z-index: -1;
      top: 0;
      left: 0;
      width: 100%;
      height: 100dvh;
      opacity: 0;
      pointer-events: none;
      background-color: #E9F4F4;
      transition: 0.3s ease-in-out;
   }

   header nav input.ham-btn[type="checkbox"]:checked~.sp-bg {
      opacity: 1.0;
   }
}

/*======================
*
TOP
*
=======================*/
main.front-page {
   background-color: var(--bg-color);
}

/*======================
*
mv
*
=======================*/
.mv {
   position: relative;
   height: 100dvh;
   background-color: #FFF;
}

@media (min-width:2000px) {

   .mv::before,
   .mv::after {
      content: "";
      position: absolute;
      z-index: var(--layer-bottom);
      top: 0;
      width: calc((100vw - 1920px) / 2);
      height: 100%;
      background-color: var(--bg-color);
   }

   .mv::before {
      left: 0;
   }

   .mv::after {
      right: 0;
   }
}

.mv .cont-wrapper {
   height: 100%;
}

.mv .heading-area {
   position: absolute;
   z-index: var(--layer-top);
   left: 50%;
   bottom: 30px;
   transform: translateX(-50%);
   width: calc((1270 / 1366) * 100%);
   max-width: 1920px;
   margin: auto;
   opacity: 0;
   translate:0 10px;
   animation:mv-anime 0.8s ease-in-out 0.8s forwards;
}

@keyframes mv-anime{
   to{
      opacity: 1.0;
      translate:0 0;
   }
}

.mv .heading-area.active {
   animation: fadeIn var(--duration, 0.5s) ease-in-out forwards var(--delay, 0s);
}

.mv .heading-area .wrapper {
   display: flex;
   justify-content: space-between;
   margin-top: 18px;
}

.mv .heading-area .wrapper p.deco-text {
   font-family: var(--deco-text);
   font-size: 16px;
   font-weight: 400;
   letter-spacing: 0.4em;
   color: #fff;
}

.mv .heading-area .wrapper .scroll-area {
   display: flex;
   align-items: center;
   gap: 16px;
}

.mv .heading-area .wrapper .scroll-area img {
   max-width: 10px;
   transform: translateY(-10px);
   animation: slideDownFade 2.0s ease-out infinite;
}

@keyframes slideDownFade {
   0% {
      opacity: 0;
   }

   45% {
      opacity: 1.0;
   }

   100% {
      opacity: 0;
      transform: translateY(10px);
   }
}

.mv .heading-area .wrapper .scroll-area span {
   font-family: var(--deco-text);
   font-size: 16px;
   font-weight: 400;
   letter-spacing: 0.2em;
   color: #fff;
}

/*スライダー*/
.mv_slider {
   position: relative;
   z-index: 2;
   height: 100%;
}

.mv_slider .splide__track {
   height: 100%;
}

.mv_slider_cont img:nth-of-type(1) {
   position: relative;
   z-index: -1;
}

.mv_slider_cont img.main-img {
   position: absolute;
   z-index: 2;
   width: 100%;
   max-inline-size: initial;
}

.mv_slider ul li:nth-of-type(1) img.main-img {
   bottom: calc((122 / 768) * 100%);
}

.mv_slider ul li:nth-of-type(2) img.main-img {
   bottom: calc((96 / 768) * 100%);
}

.mv_slider ul li:nth-of-type(3) img.main-img {
   bottom: calc((127 / 768) * 100%);
}

.mv_slider ul li:nth-of-type(4) img.main-img {
   bottom: calc((117 / 768) * 100%);
}

.mv_slider ul li img.main-img {
   opacity: 0;
   transform: translateY(10px);
   transition: 3.0s ease-in-out;
}

.mv_slider ul li.is-active img.main-img {
   opacity: 1.0;
   transform: translateY(0);
   transition: 3.0s ease-in-out;
}

.mv .mv-bg {
   position: absolute;
   z-index: var(--layer-bottom);
   width: 100%;
   height: calc((255 / 768)* 100%);
   left: 0;
   bottom: 0;
   background-color: var(--bg-color);
}

.mv .mv-bg img {
   position: absolute;
   left: 0;
   bottom: 100%;
   width: 100%;
}

/*tb*/
@media screen and (min-width:768px) and (max-width:1024px) {
   .mv {
      height: 45dvh;
      min-height: 450px;
   }
}

/*sp*/
@media (max-width:767px) {
   .mv {
      min-height: 667px;
   }

   .mv .mv-bg {
      height: calc((355 / 667)* 100%);
   }

   .mv_slider ul li:nth-of-type(1) img.main-img {
      bottom: calc((250 / 667) * 100%);
   }

   .mv_slider ul li:nth-of-type(2) img.main-img {
      bottom: calc((257 / 667) * 100%);
   }

   .mv_slider ul li:nth-of-type(3) img.main-img {
      bottom: calc((287 / 667) * 100%);
   }

   .mv_slider ul li:nth-of-type(4) img.main-img {
      bottom: calc((266 / 667) * 100%);
   }

   .mv .heading-area {
      width: 100%;
      bottom: 24px;
      min-height: 248px;
   }

   .mv .heading-area img {
      width: calc((310 / 375) * 100%);
      margin: auto;
   }

   .mv .heading-area .wrapper {
      display: block;
      margin-top: 15px;
   }

   .mv .heading-area .wrapper p.deco-text {
      font-size: 11px;
      text-align: center;
      margin-bottom: 22px;
   }

   .mv .heading-area .wrapper .scroll-area {
      flex-direction: column-reverse;
      gap: 9px;
   }

   .mv .heading-area .wrapper .scroll-area span {
      font-size: 12px;
   }

   .mv .heading-area .wrapper .scroll-area img {
      max-width: 14px;
   }


   .mv .heading-area .wrapper .scroll-area img {
      opacity: 0;
      transform: translateY(-25px);
      animation: slideDownFade 2.0s ease-out infinite;
   }

   @keyframes slideDownFade {
      0% {
         opacity: 0;
      }

      40% {
         opacity: 0;
      }

      50% {
         opacity: 1.0;
      }

      100% {
         opacity: 0;
         transform: translateY(5px);
      }
   }

}


/*======================
セクション区切り用画像
=======================*/
.front-page>.deco-img {
   text-align: center;
   position: relative;
   display: flex;
   justify-content: center;
   margin-top: 120px;
}

.front-page .deco-img.active {
   animation: fadeIn var(--duration, 0.5s) ease-in-out forwards var(--delay, 0s);
}

.front-page>.deco-img img {
   width: calc((1724 / 1366) * 100%);
   max-inline-size: initial;
}

/*tb*/
@media (max-width:1024px) {
   .front-page>.deco-img {
      margin-top: 65px;
   }
}

/*sp*/
@media (max-width:767px) {
   .front-page>.deco-img {
      margin-top: 64px;
   }

   .front-page>.deco-img img {
      width: calc((574 / 375) * 100%);
   }
}

/*======================
MESSAGE
=======================*/
.front-page .message_sec {
   position: relative;
   margin-top: calc(((95 / 800) * 100%) * -1);
   padding-bottom: 140px;
}

.front-page .message_sec .deco-text {
   position: absolute;
   z-index: 1;
   transform: translateX(-50%);
   left: 50%;
   bottom: -36px;
   font-family: var(--deco-text);
   font-size: 240px;
   font-weight: 600;
   color: #EBC765;
   letter-spacing: 0.2em;
   line-height: 1.0;
}

@media screen and (min-width:1025px) {
   .front-page .message_sec .deco-text {
      margin-left: 0.1em;
   }
}

.front-page .message_sec .cont-area {
   position: relative;
   display: flex;
   align-items: end;
   justify-content: space-between;
}

.front-page .message_sec .cont-area .text-area {
   position: relative;
   z-index: var(--layer-top);
   width: calc((560 / 1126) * 100%);
   margin-bottom: calc((40 / 900) * 100%);
}

.front-page .message_sec .cont-area .text-area.active {
   animation: fadeIn var(--duration, 0.5s) ease-in-out forwards var(--delay, 0s);
}

.front-page .message_sec .cont-area .text-area h2 {
   display: flex;
   align-items: center;
   gap: 16px;
   font-size: clamp(12px, 1.17vw, 16px);
   font-weight: 500;
   letter-spacing: 0.2em;
   font-family: var(--deco-text);
   color: var(--main-color);
   margin-bottom: 40px;
}

.front-page .message_sec .cont-area .text-area h2::before {
   content: "";
   display: block;
   width: 10px;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
   background-color: var(--main-color);
}

.front-page .message_sec .cont-area .text-area p {
   font-size: clamp(14px, 1.76vw, 20px);
   font-weight: 600;
   color: #FFF;
   text-shadow: 0px 0px 8px #EBC765;
   letter-spacing: 0.12em;
   line-height: calc(48 / 20);
}

.front-page .message_sec .cont-area .img-area {
   position: relative;
   z-index: 2;
   opacity: 0;
   translate: 0 10px;
   width: calc((450 / 1126) * 100%);
}

.front-page .message_sec .img-area.active {
   animation: fadeIn var(--duration, 0.5s) ease-in-out forwards var(--delay, 0s);
}

@media (max-width:1300px) {
   .front-page .message_sec .cont-area .text-area p {
      font-size: 14px;
   }

   .front-page .message_sec .deco-text {
      bottom: -28px;
      font-size: 200px;
   }
}

/*tb*/
@media (max-width:1024px) {
   .front-page .message_sec .deco-text {
      font-size: 180px;
   }
}

@media (max-width:900px) {
   .front-page .message_sec {
      padding-bottom: 74px;
      margin-top: calc(((82 / 800) * 100%) * -1);
   }

   .front-page .message_sec .cont-area {
      width: 90%;
   }

   .front-page .message_sec .cont-area .text-area {
      width: 54%;
   }

   .front-page .message_sec .cont-area .text-area h2 {
      margin-bottom: 20px;
   }

   .front-page .message_sec .deco-text {
      bottom: -17px;
      font-size: 133px;
   }
}

/*sp*/
@media (max-width:767px) {
   .front-page .message_sec {
      margin-top: 25px;
      padding-bottom: 90px;
   }

   .front-page .message_sec .cont-area {
      flex-direction: column;
   }

   .front-page .message_sec .cont-area .text-area {
      width: 100%;
      margin-bottom: 36px;
   }

   .front-page .message_sec .cont-area .text-area h2 {
      gap: 12px;
      font-size: 14px;
      margin-bottom: 24.5px;
   }

   .front-page .message_sec .cont-area .text-area p {
      font-size: 16px;
      line-height: calc(40 / 16);
   }

   .front-page .message_sec .cont-area .img-area {
      width: 100%;
   }

   .front-page .message_sec .deco-text {
      bottom: -9px;
      font-size: 64px;
   }

}

/*======================
about
=======================*/
.front-page .about-sec {
   position: relative;
   translate: initial;
   width: calc((1286 / 1366) * 100%);
   margin: auto;
   padding: 0 0 40px;
   transition: 0.5s ease-in-out;
}

.front-page .about-sec.active {
   opacity: 1.0;
}

.front-page .about-sec::before {
   content: "";
   position: absolute;
   z-index: 2;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   border-radius: 80px;
   background-color: #F5F4F2;
}

@media (min-width:2000px) {
   .front-page .about-sec {
      max-width: 1920px;
   }
}

.front-page .about-sec .wrapper {
   width: calc((1190 / 1286) * 100%);
   margin: auto;
}

.front-page .about-sec .about-cont {
   position: relative;
}

.front-page .about-sec .about-cont .cont {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.front-page .about-sec .about-cont .cont .text-area {
   position: relative;
   z-index: var(--layer-top);
   width: calc((340 / 1158) * 100%);
}

.front-page .about-sec .about-cont .cont .text-area h2 {
   display: flex;
   align-items: center;
   gap: 16px;
   font-size: 16px;
   font-weight: 500;
   letter-spacing: 0.2em;
   font-family: var(--deco-text);
   color: var(--main-color);
   margin-bottom: 11px;
}

.front-page .about-sec .about-cont .cont .text-area h2::before {
   content: "";
   position: relative;
   top: -1px;
   display: block;
   width: 10px;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
   background-color: var(--main-color);
}

.front-page .about-sec .about-cont .text-area .hd img {
   padding-bottom: 8px;
   border-bottom: 4px solid var(--text-color);
}

.front-page .about-sec .about-cont .text-area p {
   font-size: 16px;
   font-weight: 600;
   color: var(--text-color);
   line-height: 2.0;
   letter-spacing: 0.06em;
   margin-top: 28px;
}

.front-page .about-sec .about-cont .text-area a.link-btn {
   display: flex;
   align-items: center;
   gap: 16px;
   font-size: 16px;
   font-weight: 600;
   letter-spacing: 0.06em;
   color: var(--text-color);
   margin-top: 20px;
   transition: 0.3s ease-in-out;
}

.front-page .about-sec .about-cont .text-area a.link-btn span {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 56px;
   aspect-ratio: 1 / 1;
   border: solid 1px #DBD0C2;
   border-radius: 50%;
   transition: 0.3s ease-in-out;
}

.front-page .about-sec .about-cont .text-area a.link-btn span img {
   max-width: 14px;
}

@media (any-hover:hover) {
   .front-page .about-sec .about-cont .text-area a.link-btn:hover {
      opacity: 0.75;
   }

   .front-page .about-sec .about-cont .text-area a.link-btn:hover span {
      transform: translateX(5px);
   }
}

.front-page .about-sec .about-cont .cont>img {
   position: relative;
   z-index: 2;
   width: calc((768 / 1158) * 100%);
   border: 24px solid var(--bg-color);
   border-radius: 500px;
}

/*会社について*/
.front-page .about-sec .about-cont.company {
   padding-top: 13%;
   margin-left: calc((32 / 1190) * 100%);
   opacity: 1.0;
   translate: initial;
}

.front-page .about-sec .about-cont.company .cont .text-area {
   opacity: 0;
   transition: 0.5s ease-in-out 0.7s;
}

.front-page .about-sec .about-cont.company.active .cont .text-area {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.company .cont>img {
   opacity: 0;
   transition: 0.5s ease-in-out 0.5s;
}

.front-page .about-sec .about-cont.company.active .cont>img {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.company .deco-img1 {
   position: absolute;
   top: -5%;
   left: -3%;
   z-index: 2;
   display: flex;
   align-items: end;
   gap: calc((40 / 292) * 100%);
   width: calc((292 / 1190) * 100%);
   opacity: 0;
   translate: 0 20px;
   transition: 0.5s ease-in-out 0.7s;
}

.front-page .about-sec .about-cont.company.active .deco-img1 {
   opacity: 1.0;
   translate: 0 0;
}

.front-page .about-sec .about-cont.company .deco-img1 img:first-of-type {
   width: calc((179 / 292) * 100%);
   margin-bottom: 20px;
}

.front-page .about-sec .about-cont.company .deco-img1 img:last-of-type {
   width: calc((74 / 292) * 100%);
}

.front-page .about-sec .about-cont.company .deco-img2 {
   position: absolute;
   z-index: 2;
   top: 23%;
   right: calc((14 / 1190) * 100%);
   width: calc((155 / 1190) * 100%);
   opacity: 0;
   translate: 0 20px;
   transition: 0.5s ease-in-out 0.7s;
}

.front-page .about-sec .about-cont.company.active .deco-img2 {
   opacity: 1.0;
   translate: 0 0;
}

.front-page .about-sec .about-cont.company .deco-img3 {
   position: absolute;
   z-index: 2;
   width: calc((82 / 1190) * 100%);
   left: calc((45 / 1190) * 100%);
   opacity: 0;
   translate: 0 20px;
   transition: 0.5s ease-in-out 0.7s;
}

.front-page .about-sec .about-cont.company.active .deco-img3 {
   opacity: 1.0;
   translate: 0 0;
}

.front-page .about-sec .about-cont.company img.road {
   position: absolute;
   top: 0;
   left: calc((464 / 1190) * 100%);
   z-index: 2;
   width: calc((420 / 1190) * 100%);
   opacity: 0;
   transition: 0.7s ease-in-out 0.2s;
}

.front-page .about-sec .about-cont.company.active img.road {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.company .text-area .hd img {
   max-width: 238px;
}

.front-page .about-sec .about-cont.company .deco-message {
   position: absolute;
   z-index: 2;
   left: calc((207 / 1190) * 100%);
   bottom: -1.5%;
   display: flex;
   width: calc((220 / 1190) * 100%);
}

.front-page .about-sec .about-cont.company .deco-message img {
   width: calc((104 / 220) * 100%);
}

.front-page .about-sec .about-cont.company .deco-message p {
   position: relative;
   right: -12px;
   top: -11px;
   width: calc((84 / 220) * 100%);
   min-width: fit-content;
   height: fit-content;
   font-size: 12px;
   font-weight: 600;
   line-height: calc(20 / 12);
   color: #1C779F;
   padding: 7px 0;
   margin: 0;
   text-align: center;
   rotate: -10deg;
}

.front-page .about-sec .about-cont.company .deco-message p span {
   position: absolute;
   left: -5px;
   display: inline-block;
   width: calc(100% + 11px);
   height: 1px;
   background-color: #1C779F;
}

.front-page .about-sec .about-cont.company .deco-message p span:nth-of-type(1) {
   top: 0;
   rotate: -4deg;
}

.front-page .about-sec .about-cont.company .deco-message p span:nth-of-type(2) {
   bottom: 0;
   rotate: 5deg
}

/*ここまで*/

/*事業・サービス*/
.front-page .about-sec .about-cont.service {
   margin-right: calc((32 / 1190) * 100%);
   padding-bottom: 16%;
   opacity: 1.0;
   translate: initial;
   overflow: hidden;
}

.front-page .about-sec .about-cont.service .cont .text-area {
   opacity: 0;
   transition: 0.5s ease-in-out 0.7s;
}

.front-page .about-sec .about-cont.service.active .cont .text-area {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.service .cont>img {
   opacity: 0;
   transition: 0.5s ease-in-out 0.5s;
}

.front-page .about-sec .about-cont.service.active .cont>img {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.service .cont {
   flex-direction: row-reverse;
}

.front-page .about-sec .about-cont.service .text-area .hd img {
   max-width: 250px;
}

.front-page .about-sec .about-cont.service .deco-img1 {
   position: absolute;
   z-index: 2;
   bottom: 70%;
   right: 0;
   width: calc((142/1190)* 100%);
   opacity: 0;
   translate: 0 20px;
   transition: 0.5s ease-in-out 0.7s;
}

.front-page .about-sec .about-cont.service.active .deco-img1 {
   opacity: 1.0;
   translate: 0 0;
}

.front-page .about-sec .about-cont.service .deco-img1 img:first-of-type {
   position: absolute;
   right: 0;
   top: -46%;
   z-index: -1;
   width: calc((248/142)* 100%);
   max-inline-size: initial;
}

.front-page .about-sec .about-cont.service .deco-img1 img:last-of-type {
   width: 100%;
}

.front-page .about-sec .about-cont.service .deco-img2 {
   position: absolute;
   z-index: 2;
   left: 0;
   bottom: 20%;
   width: calc((166/1190)* 100%);
   opacity: 0;
   translate: 0 20px;
   transition: 0.5s ease-in-out 0.7s;
}

.front-page .about-sec .about-cont.service.active .deco-img2 {
   opacity: 1.0;
   translate: 0 0;
}

.front-page .about-sec .about-cont.service img.road {
   position: relative;
   z-index: 2;
   width: calc((511 / 1190) * 100%);
   margin: auto;
   opacity: 0;
   transition: 0.7s ease-in-out;
}

.front-page .about-sec .about-cont.service.active img.road {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.service img.road2 {
   position: absolute;
   z-index: 2;
   translate: initial;
   top: 69%;
   left: calc((331/ 1158) * 100%);
   width: calc((741/ 1158) * 100%);
   transition: 0.7s ease-in-out;
}

.front-page .about-sec .about-cont.service img.road2.active {
   opacity: 1.0;
}

/*ここまで*/

/*採用情報*/
.front-page .about-sec .about-cont.recruit {
   width: calc((1206 / 1286) * 100%);
   margin: auto;
   opacity: 1.0;
   translate: initial;
}

.front-page .about-sec .about-cont.recruit img.bg {
   position: relative;
   z-index: 2;
   width: 100%;
   border-radius: 40px;
   opacity: 0;
   transition: 0.5s ease-in-out 0.5s;
}

.front-page .about-sec .about-cont.recruit.active img.bg {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.recruit .cont {
   position: absolute;
   z-index: var(--layer-top);
   transform: translateY(-50%);
   top: 50%;
   left: calc((48 / 1206) * 100%);
   display: block;
   width: calc((516 / 1206) * 100%);
   padding: 48px;
   border-radius: 20px;
   background-color: #F5F4F2;
}

.front-page .about-sec .about-cont.recruit .text-area {
   width: 100%;
   opacity: 0;
   transition: 0.5s ease-in-out 0.5s;
}

.front-page .about-sec .about-cont.recruit.active .text-area {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.recruit .text-area .hd img {
   max-width: 175px;
}

.front-page .about-sec .about-cont.recruit .deco-message {
   position: absolute;
   z-index: 2;
   left: calc((219 / 1206) * 100%);
   bottom: 100%;
   display: flex;
   width: calc((195 / 1206) * 100%);
   opacity: 0;
   transition: 0.5s ease-in-out 0.7s;
}

.front-page .about-sec .about-cont.recruit.active .deco-message {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.recruit .deco-message img {
   width: calc((86 / 195) * 100%);
}

.front-page .about-sec .about-cont.recruit .deco-message p {
   position: relative;
   left: -1px;
   bottom: 21px;
   width: calc((84 / 195) * 100%);
   min-width: fit-content;
   height: fit-content;
   font-size: 12px;
   font-weight: 600;
   line-height: calc(20 / 12);
   color: #1C779F;
   padding: 7px 0;
   margin: 0;
   text-align: center;
   rotate: 15deg;
   opacity: 0;
   transition: 0.5s ease-in-out 1.2s;
}

.front-page .about-sec .about-cont.recruit.active .deco-message p {
   opacity: 1.0;
}

.front-page .about-sec .about-cont.recruit .deco-message p span {
   position: absolute;
   left: -5px;
   display: inline-block;
   width: calc(100% + 11px);
   height: 1px;
   background-color: #1C779F;
}

.front-page .about-sec .about-cont.recruit .deco-message p span:nth-of-type(1) {
   top: 0;
   rotate: 4deg;
}

.front-page .about-sec .about-cont.recruit .deco-message p span:nth-of-type(2) {
   bottom: 0;
   rotate: -5deg
}

.front-page .about-sec .about-cont.recruit .deco-img1 {
   position: absolute;
   z-index: 2;
   top: -30%;
   right: 0;
   display: flex;
   align-items: center;
   width: calc((201/1206)* 100%);
   opacity: 0;
   translate: 0 20px;
   transition: 0.5s ease-in-out 0.7s;
}

.front-page .about-sec .about-cont.recruit.active .deco-img1 {
   opacity: 1.0;
   translate: 0 0;
}

.front-page .about-sec .about-cont.recruit .deco-img1 img:first-of-type {
   position: relative;
   top: -12px;
   width: calc((59/201)* 100%);
}

.front-page .about-sec .about-cont.recruit .deco-img1 img:last-of-type {
   width: calc((136/201)* 100%);
}

/*ここまで*/

@media (max-width:1260px) {
   .front-page .about-sec .about-cont .text-area .hd img {
      transform-origin: top left;
      transform: scale(0.8);
   }

   .front-page .about-sec .about-cont .text-area p {
      font-size: 14px;
      margin-top: 15px;
   }

   .front-page .about-sec .about-cont .text-area a.link-btn span {
      width: 45px;
   }

   /*採用情報*/
   .front-page .about-sec .about-cont.recruit .cont {
      padding: 25px;
   }

   /*ここまで*/
}

/*tb*/
@media (max-width:1024px) {
   .front-page .about-sec {
      padding: 0 0 25px;
   }

   .front-page .about-sec .about-cont .cont .text-area h2 {
      font-size: 12px;
   }

   .front-page .about-sec .about-cont .text-area .hd img {
      transform: scale(0.6);
   }

   .front-page .about-sec .about-cont .text-area p {
      font-size: 12px;
      margin-top: -8px;
   }

   .front-page .about-sec .about-cont .text-area a.link-btn {
      font-size: 13px;
      margin-top: 10px;
   }

   .front-page .about-sec .about-cont .text-area a.link-btn span {
      width: 35px;
   }

   .front-page .about-sec .about-cont .text-area a.link-btn span img {
      max-width: 11px;
   }

   /*会社について*/
   .front-page .about-sec .about-cont.company .deco-message {
      display: none;
   }

   /*ここまで*/
   /*採用情報*/
   .front-page .about-sec .about-cont.recruit .deco-message {
      display: none;
   }

   .front-page .about-sec .about-cont.recruit .cont {
      width: 50%;
      padding: 16px 25px;
   }

   /*ここまで*/
}

/*sp*/
@media (max-width:767px) {
   .front-page .about-sec {
      width: calc((359 / 375) * 100%);
      padding-bottom: 50px;
   }

   .front-page .about-sec::before {
      border-radius: 32px;
   }

   .front-page .about-sec .about-cont {
      margin: 0 !important;
   }

   .front-page .about-sec .about-cont .cont {
      display: flex;
      flex-direction: column-reverse !important;
   }

   .front-page .about-sec .wrapper {
      width: calc((319 / 359) * 100%) !important;
   }

   .front-page .about-sec .about-cont .cont img {
      width: 100% !important;
      border-width: 8px;
   }

   .front-page .about-sec .about-cont .cont .text-area {
      width: calc((255 / 319) * 100%);
      margin-top: 20px;
   }

   .front-page .about-sec .about-cont .cont .text-area h2 {
      font-size: 14px;
   }

   .front-page .about-sec .about-cont .cont .text-area p {
      font-size: 14px;
      margin-top: 22px;
   }

   .front-page .about-sec .about-cont .text-area .hd img {
      transform: initial;
      padding-bottom: 12px;
   }

   .front-page .about-sec .about-cont .text-area a.link-btn {
      font-size: 14px;
   }

   .front-page .about-sec .about-cont .text-area a.link-btn span {
      width: 40px;
   }

   .front-page .about-sec .about-cont .text-area a.link-btn span img {
      max-width: 14px;
   }

   /*会社について*/
   .front-page .about-sec .about-cont.company {
      padding-top: 40%;
      padding-bottom: 17.5%;
   }

   .front-page .about-sec .about-cont.company .text-area .hd img {
      max-width: 189px;
   }

   .front-page .about-sec .about-cont.company img.road {
      position: absolute;
      top: 0;
      left: calc((47 / 319) * 100%);
      width: calc((196 / 319) * 100%);
   }

   .front-page .about-sec .about-cont.company img.road2 {
      position: absolute;
      z-index: 2;
      top: 40%;
      right: calc((22 / 319) * 100%);
      width: calc((262 / 319) * 100%);
      opacity: 0;
      transition: 0.7s ease-in-out;
   }

   .front-page .about-sec .about-cont.company img.road2.active {
      opacity: 1.0;
   }

   .front-page .about-sec .about-cont.company .deco-img1 {
      top: -9%;
      left: calc(((38 / 319) * 100%) * -1);
      gap: calc((17 / 146) * 100%);
      width: calc((146 / 319) * 100%);
   }

   .front-page .about-sec .about-cont.company .deco-img2 {
      top: 20.5%;
      right: calc(((8 / 319) * 100%) * -1);
      width: calc((77 / 319) * 100%);
   }

   /*ここまで*/
   /*事業・サービス*/
   .front-page .about-sec .about-cont.service {
      padding-bottom: 20.5%;
      overflow: initial;
   }

   .front-page .about-sec .about-cont.service .text-area .hd img {
      max-width: 200px;
   }

   .front-page .about-sec .about-cont.service img.road2 {
      position: absolute;
      z-index: 2;
      top: 16%;
      left: calc((10 / 319) * 100%);
      width: calc((140 / 319) * 100%);
   }

   .front-page .about-sec .about-cont.service .deco-img1 {
      display: none;
   }

   .front-page .about-sec .about-cont.service .deco-img2 {
      top: 23%;
      bottom: initial;
      left: calc(((24 / 319) * 100%) * -1);
      width: calc((83 / 319) * 100%);
   }

   /*ここまで*/
   /*採用情報*/
   .front-page .about-sec .about-cont.recruit {
      width: calc((1190 / 1286) * 100%);
      margin: auto !important;
   }

   .front-page .about-sec .about-cont.recruit .cont {
      position: relative;
      top: initial;
      left: initial;
      width: calc((255 / 319) * 100%);
      transform: translate(0, 0);
      padding: 0;
      margin: auto;
   }

   .front-page .about-sec .about-cont.recruit .text-area {
      width: 100%;
      transform: translate(0, 0);
   }

   .front-page .about-sec .about-cont.recruit .text-area .hd img {
      max-width: 140px;
   }

   .front-page .about-sec .about-cont.recruit .deco-img1 {
      display: none;
   }

   /*ここまで*/
}

/*======================
*
TOP_CTA
*
=======================*/
.front-page .top_cta {
   position: relative;
   margin-top: -56px;
   opacity: 1.0;
}

.front-page .top_cta .cont {
   position: absolute;
   z-index: var(--layer-top);
   top: calc((197 / 640) * 100%);
   left: 50%;
   width: 640px;
   transform: translateX(-50%);
}

.front-page .top_cta.active .cont {
   animation: fadeIn var(--duration, 0.5s) ease-in-out forwards var(--delay, 0s);
}

.front-page .top_cta .cont h2 img {
   max-width: 235px;
   margin: auto;
}

.front-page .top_cta .cont p {
   font-size: 16px;
   font-weight: 600;
   color: var(--main-color);
   letter-spacing: 0.06em;
   line-height: 2.0;
   text-align: center;
   margin-top: 30px;
   margin-bottom: 20px;
}

.front-page .top_cta .cont a {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 16px;
   font-size: 16px;
   font-weight: 600;
   letter-spacing: 0.06em;
   color: var(--main-color);
   margin-top: 20px;
   transition: 0.3s ease-in-out;
}

.front-page .top_cta .cont a img {
   max-width: 56px;
   transition: 0.5s ease-in-out;
}

@media (any-hover:hover) {
   .front-page .top_cta .cont a:hover {
      opacity: 0.75;
   }

   .front-page .top_cta .cont a:hover img {
      transform: translateX(5px);
   }
}

.front-page .top_cta .cta-deco {
   display: flex;
   align-items: end;
   position: absolute;
   z-index: 2;
   transform: translateX(-50%);
   left: 50%;
   bottom: 0;
   width: calc((850 / 1366) * 100%);
   opacity: 1.0;
}

.front-page .top_cta .cta-deco>img:nth-of-type(1) {
   width: calc((518 / 850) * 100%);
   margin-bottom: 25px;
   opacity: 0;
   translate: 20px 0;
}

.front-page .top_cta .cta-deco.active>img:nth-of-type(1) {
   animation: car-move2 1.0s ease forwards 1.0s;
}

@keyframes car-move2 {
   to {
      opacity: 1.0;
      translate: 0 0;
   }
}

.front-page .top_cta .cta-deco .wrapper {
   display: flex;
   gap: 17px;
   width: calc((327 / 850) * 100%);
}

.front-page .top_cta .cta-deco .wrapper img {
   width: calc((220 / 327) * 100%);
   opacity: 0;
   translate: -50px 0;
}

.front-page .top_cta .cta-deco.active .wrapper img {
   animation: car-move 1.0s ease forwards;
}

@keyframes car-move {
   to {
      opacity: 1.0;
      translate: 0 0;
   }
}

.front-page .top_cta .cta-deco .wrapper p {
   position: relative;
   min-width: fit-content;
   height: fit-content;
   font-size: 12px;
   font-weight: 600;
   line-height: calc(20 / 12);
   color: #1C779F;
   padding: 11px 0;
   rotate: -10deg;
   opacity: 0;
}

@media (min-width:768px) {
   .front-page .top_cta .cta-deco .wrapper p {
      top: -21px;
      right: 10px;
   }
}

.front-page .top_cta .cta-deco.active .wrapper p {
   animation: car-move3 1.0s ease forwards 1.2s;
}

@keyframes car-move3 {
   to {
      opacity: 1.0;
   }
}


.front-page .top_cta .cta-deco .wrapper p span {
   position: absolute;
   left: 0;
   display: inline-block;
   width: 100%;
   height: 1px;
   background-color: #1C779F;
}

.front-page .top_cta .cta-deco .wrapper p span:nth-of-type(1) {
   top: 0;
   rotate: -4deg;
}

.front-page .top_cta .cta-deco .wrapper p span:nth-of-type(2) {
   bottom: 0;
   rotate: 5deg
}

.front-page .top_cta .cont-bg {
   position: absolute;
   z-index: -1;
   top: calc((68 / 640) * 100%);
   left: 50%;
   transform: translateX(-50%);
   width: 640px;
   aspect-ratio: 1 / 1;
   background: var(--bg-color);
   transition: 0.5s;
}

.front-page .top_cta.active .cont-bg {
   opacity: 1.0;
}

.front-page .top_cta .cont-bg>img {
   mix-blend-mode: screen;
}

.front-page .top_cta .bg {
   position: relative;
   z-index: 1;
   width: 100%;
}

/*tb*/
@media (max-width:1024px) {
   .front-page .top_cta {
      padding-bottom: 120px;
   }

   .front-page .top_cta .cont {
      top: calc(50% - 34px);
      transform: translate(-50%, -50%);
   }

   .front-page .top_cta .cta-deco {
      width: 80%;
   }

   .front-page .top_cta .cont-bg {
      top: calc(50% + 34px);
      transform: translate(-50%, -50%);
   }
}

@media screen and (min-width:768px) and (max-width:1024px) {
   .front-page .top_cta {
      padding-bottom: 120px;
      margin-top: 50px;
   }
}

/*sp*/
@media (max-width:767px) {
   .front-page .top_cta {
      margin-top: 62px;
      padding-bottom: 46px;
   }

   .front-page .top_cta .cont {
      top: 143px;
      transform: translate(-50%, -50%);
   }

   .front-page .top_cta .cont h2 img {
      max-width: 188px;
   }

   .front-page .top_cta .cont-bg {
      top: 0;
      transform: translate(-50%, 0);
      width: 400px;
   }

   .front-page .top_cta .cont p {
      font-size: 14px;
      margin: 22px auto 11px;
   }

   .front-page .top_cta .cont a {
      gap: 12px;
      font-size: 14px;
   }

   .front-page .top_cta .cont a img {
      max-width: 40px;
   }

   .front-page .top_cta .cta-deco {
      width: 366px;
   }

   .front-page .top_cta .cta-deco>img:nth-of-type(1) {
      position: absolute;
      left: -35px;
      bottom: 10px;
      width: 259px;
   }

   .front-page .top_cta .cta-deco .wrapper {
      position: relative;
      display: block;
      width: 110px;
      margin-left: auto;
      right: 27px;
   }

   .front-page .top_cta .cta-deco.active .wrapper p {
      position: absolute;
      left: 5px;
      bottom: 100%;
      rotate: 0deg;
   }

   .front-page .top_cta .cta-deco .wrapper p span {
      bottom: 5px;
      width: 1px;
      height: 44px;
      rotate: 90deg;
   }

   .front-page .top_cta .cta-deco .wrapper p span:nth-of-type(1) {
      left: -8px;
      top: initial;
      bottom: 7px;
      rotate: -11deg;
   }

   .front-page .top_cta .cta-deco .wrapper p span:nth-of-type(2) {
      right: -8px;
      bottom: 5px;
      left: initial;
      rotate: 11deg;
   }

   .front-page .top_cta .cta-deco .wrapper img {
      width: 100%;
   }
}

@media screen and (min-width:500px) and (max-width:767px) {
   .front-page .top_cta.active .cont-bg {
      width: 100%;
   }
}

/*======================
パンくず
=======================*/
.panku {
   display: flex;
   align-items: center;
   gap: 12px;
   position: absolute;
   z-index: var(--layer-top);
   top: 116px;
   right: calc((48 / 1366) * 100%);
}

@media (min-width:2000px) {
   .panku {
      transform: translateX(-50%);
      justify-content: flex-end;
      top: 100px !important;
      left: 50%;
      right: initial;
      width: 100%;
      max-width: 1920px;
   }
}

.panku li {
   font-size: 12px;
   font-weight: 400;
   font-family: var(--deco-text);
   color: #9E9E9F;
}

.panku li:not(:last-of-type) {
   display: flex;
   align-items: center;
   gap: 12px;
}

.panku li a {
   color: var(--main-color);
}

.panku li:not(:last-of-type) span.panku-line {
   display: flex;
   align-items: center;
   gap: 2px;
}

.panku li:not(:last-of-type) span.panku-line span {
   display: block;
   width: 2px;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
   background-color: #9E9E9F;
}

/*sp*/
@media (max-width:767px) {
   .panku {
      top: 82px !important;
   }
}

/*======================
*
under
*
=======================*/
.under .header01 {
   position: relative;
   aspect-ratio: 1711 / 671;
   background: #E9F4F4;
}

@media (min-width:2000px) {
   .under .header01 {
      max-width: 1920px;
      margin: auto;
   }

   .under .header01::before,
   .under .header01::after {
      content: "";
      position: absolute;
      z-index: var(--layer-bottom);
      top: 0;
      width: calc((100vw - 1920px) / 2);
      height: 100%;
      background: #FFF;
   }

   .under .header01::before {
      left: calc(((100vw - 1920px) / 2) * -1);
   }

   .under .header01::after {
      right: calc(((100vw - 1920px) / 2) * -1);
   }
}

.under .header01 .under_mv_deco {
   position: absolute;
   left: 0;
   bottom: 0;
   z-index: 2;
}

.under .header01 .header-cont {
   position: absolute;
   z-index: var(--layer-top);
   transform: translate(-50%, -50%);
   top: 50%;
   left: 50%;
   width: 100%;
   opacity: 0;
}

.under .header01 .header-cont.active {
   animation: fadeIn 0.5s var(--duration) ease-in-out forwards;
}

/*背景*/
.under .header01 img.mv-bg {
   position: fixed;
   top: 0;
}

@media (min-width:2000px) {
   .under .header01 img.mv-bg {
      max-width: 1920px;
   }
}

/*見出し*/
.under .header01 .header-cont .hd-area {
   text-align: center;
}

.under .header01 .header-cont .hd-area h1 {
   max-width: 284px;
   margin: 15px auto 84px;
}

.under .header01 .header-cont .hd-area span {
   font-family: var(--deco-text);
   font-size: 16px;
   font-weight: 400;
   color: var(--main-color);
   letter-spacing: 0.2em;
}

/*ボタン*/
.under .header01 .header-cont .btn-area {
   display: flex;
   justify-content: center;
   gap: 12px;
   width: fit-content;
   margin: auto;
}

.under .header01 .header-cont .btn-area a {
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 14px;
   font-weight: 600;
   color: var(--text-color);
   padding: 15px 24px;
   background-color: #FFF;
   border-radius: 50px;
   transition: 0.3s ease-in-out;
}

.under .header01 .header-cont .btn-area a span {
   position: relative;
   width: 13px;
   aspect-ratio: 13 / 16;
}

.under .header01 .header-cont .btn-area a span img {
   position: absolute;
   top: 0;
   transition: 0.3s ease-in-out;
}

.under .header01 .header-cont .btn-area a span img:nth-of-type(2) {
   opacity: 0;
}

@media (any-hover: hover) {
   .under .header01 .header-cont .btn-area a:hover {
      color: #FFF;
      background-color: var(--text-color);
   }


   .under .header01 .header-cont .btn-area a:hover span img:nth-of-type(1) {
      opacity: 0;
   }

   .under .header01 .header-cont .btn-area a:hover span img:nth-of-type(2) {
      opacity: 1.0;
   }
}

.under a.text-btn {
   display: flex;
   align-items: center;
   gap: 9px;
   width: fit-content;
   font-size: 14px;
   font-weight: 700;
   color: var(--main-color);
   padding-bottom: 10px;
   border-bottom: 1px solid var(--main-color);
   transition: 0.3s ease-in-out;
}

.under a.text-btn img {
   width: 10px;
   transform: rotate(90deg);
   transition: 0.3s ease-in-out;
}

@media (any-hover:hover) {
   .under a.text-btn:hover {
      opacity: 0.75;
   }

   .under a.text-btn:hover img {
      translate: 0 5px;
   }
}

/*テキスト*/
.under .header01 .header-cont p {
   font-size: 16px;
   font-weight: 900;
   letter-spacing: 0.06em;
   line-height: 2.0;
   color: var(--text-color);
   margin-top: -3px;
}

@media (max-width:1260px) {

   /*見出し*/
   .under .header01 .header-cont .hd-area h1 {
      margin: 0 auto 35px;
   }
}

/*tb*/
@media (max-width:1024px) {

   /*見出し*/
   .under .header01 .header-cont .hd-area h1 {
      margin-bottom: 20px;
   }

   .under .header01 .header-cont .hd-area h1 img {
      transform: scale(0.6);
   }
}

/*sp*/
@media (max-width:767px) {
   .under .header01 {
      aspect-ratio: 94 / 101;
   }

   .under .header01 .header-cont {
      transform: translate(-50%, 0);
      top: initial;
      bottom: calc((58 / 403) * 100%);
   }

   /*見出し*/
   .under .header01 .header-cont .hd-area h1 {
      max-width: 237px;
      margin-top: 9px;
      margin-bottom: 30px;
   }

   .under .header01 .header-cont .hd-area h1 img {
      transform: scale(1.0);
   }

   .under .header01 .header-cont .hd-area span {
      font-size: 14px;
   }

   /*ボタン*/
   .under .header01 .header-cont .btn-area {
      flex-wrap: wrap;
      gap: 16px 12px;
   }

   /*テキスト*/
   .under .header01 .header-cont p {
      font-size: 14px;
   }
}

/*======================
another-header
=======================*/
.under .another-header {
   padding-top: 200px;
}

.under .another-header .header-cont {
   position: relative;
   z-index: var(--layer-top);
   width: fit-content;
   margin: auto;
}

.under .another-header .header-cont .hd-area {
   font-size: 48px;
   text-align: center;
}

.under .another-header .header-cont .hd-area h1 {
   font-size: 1.0em;
   font-weight: 900;
   margin-top: 10px;
}

.under .another-header .header-cont .hd-area span {
   font-family: var(--deco-text);
   font-size: calc((16 / 48) * 1.0em);
   font-weight: 400;
   color: var(--main-color);
}

.under .another-header .header-cont .link-area {
   display: flex;
   gap: 24px;
   margin-top: 28px;
}

/*sp*/
@media (max-width:767px) {
   .under .another-header {
      padding-top: 160px;
   }

   .under .another-header .header-cont .hd-area {
      font-size: 32px;
   }

   .under .another-header .header-cont .hd-area h1 {
      margin-top: 11px;
   }

   .under .another-header .header-cont .link-area {
      margin-top: 29px;
   }

}

/*======================
company
=======================*/
/*company common*/
.company-page.under {
   background: #FFF;
}

.company-page.under .hd {
   position: relative;
   z-index: var(--layer-top);
   font-size: 32px;
   color: var(--text-color);
}

.company-page.under .hd.w {
   color: #FFF;
}

.company-page.under .hd h2 {
   font-size: 1.0em;
   font-weight: 600;
   margin-top: 11px;
}

.company-page.under .hd span {
   display: block;
   font-family: var(--deco-text);
   font-size: calc((12 / 32) * 1.0em);
   font-weight: 400;
   color: #aaa;
   letter-spacing: 0.2em;
}

.company-page.under .hd.w span {
   color: inherit;
}

.company-page.under .company-bg {
   position: sticky;
   top: 0;
}

@media (min-width:2000px) {
   .company-page.under .company-bg {
      max-width: 1920px;
      margin: auto;
   }
}

/*sp*/
@media (max-width:767px) {
   .company-page.under .hd {
      font-size: 24px;
   }

   .company-page.under .hd h2 {
      margin-top: 8px;
   }

   .company-page.under .hd span {
      font-size: calc((12 / 24) * 1.0em);
   }
}

/*end*/

/*company message*/
.company-page .company_message_sec {
   position: relative;
   padding: 120px 0 120px;
   background-color: var(--main-color);
}

@media (min-width:2000px) {
   .company-page .company_message_sec {
      max-width: 1920px;
      margin: auto;
   }
}

.company-page .company_message_sec .cont-area {
   display: flex;
   align-items: start;
   width: calc((1266 / 1366) * 100%);
}

.company-page .company_message_sec .cont-area img {
   position: sticky;
   top: 0;
   width: calc((768 / 1266) * 100%);
}

.company-page .company_message_sec .cont-area .text-area {
   position: relative;
   z-index: var(--layer-top);
   width: calc((450 / 1266) * 100%);
   margin-left: auto;
   padding-bottom: 15%;
}

.company-page .company_message_sec .cont-area .text-area.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.company-page .company_message_sec .cont-area .text-area h3 {
   font-size: 24px;
   font-weight: 600;
   line-height: 2.0;
   letter-spacing: 0.06em;
   color: #FFF;
   margin: 48px 0;
}

.company-page .company_message_sec .cont-area .text-area p {
   font-size: 16px;
   font-weight: 600;
   line-height: 2.0;
   letter-spacing: 0.06em;
   color: #FFF;
}

.company-page .company_message_sec .cont-area .text-area p span {
   margin-top: 32px;
}

/*tb*/
@media (max-width:1024px) {
   .company-page .company_message_sec .cont-area {
      display: block;
      width: calc((1166 / 1366) * 100%);
      margin: auto;
   }

   .company-page .company_message_sec .cont-area img {
      position: static;
      width: 100%;
      border-radius: 40px;
      margin-bottom: 25px;
      aspect-ratio: 3 / 2.3;
      object-fit: cover;
   }

   .company-page .company_message_sec .cont-area .text-area {
      width: 100%;
      padding-bottom: 0;
   }
}

/*sp*/
@media (max-width:767px) {
   .company-page .company_message_sec {
      padding: 64px 0;
   }

   .company-page .company_message_sec .cont-area {
      width: 90%;
   }

   .company-page .company_message_sec .cont-area img {
      position: relative;
      left: -5.5%;
      width: 100%;
      margin-bottom: 40px;
      border-radius: 0;
      aspect-ratio: initial;
   }

   .company-page .company_message_sec .cont-area .text-area h3 {
      font-size: 20px;
      margin: 35px 0 20px;
   }

   .company-page .company_message_sec .cont-area .text-area p {
      font-size: 14px;
   }

   .company-page .company_message_sec .cont-area .text-area p span {
      margin-top: 16px;
   }
}

/*end*/

/*company profile*/
.company-page .company_profile_sec {
   position: relative;
   background-color: #FFF;
}

.company-page .company_profile_sec .hd.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.company-page .company_profile_sec .wrapper {
   position: relative;
   padding-top: 80px;
   padding-bottom: 120px;
   background-color: #FFF;
}

.company-page .company_profile_sec .wrapper .profile-table {
   position: relative;
   z-index: var(--layer-top);
   margin-top: 42px;
}

.company-page .company_profile_sec .wrapper .profile-table.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.company-page .company_profile_sec .wrapper .profile-table .table-cont {
   display: flex;
   justify-content: space-between;
   padding: 22px calc((23 / 1166) * 100%);
   border-radius: 12px;
   background-color: #F5F4F2;
}

.company-page .company_profile_sec .wrapper .profile-table .table-cont+.table-cont {
   margin-top: 4px;
}

.company-page .company_profile_sec .wrapper .profile-table .table-cont :is(.th, .td) {
   font-size: 16px;
   letter-spacing: 0.06em;
   line-height: 2.0;
   color: var(--text-color);
}

.company-page .company_profile_sec .wrapper .profile-table .table-cont .th {
   width: calc((70 / 1120) * 100%);
   min-width: fit-content;
   font-weight: 600;
}

.company-page .company_profile_sec .wrapper .profile-table .table-cont .td {
   width: calc((884 / 1120) * 100%);
   font-weight: 400;
}

.company-page .company_profile_sec .wrapper .profile-table .table-cont .td ul li {
   display: flex;
}

.company-page .company_profile_sec .wrapper .profile-table .table-cont .td ul li::before {
   content: "・";
}

/*sp*/
@media (max-width:767px) {
   .company-page .company_profile_sec .wrapper {
      width: 100%;
      padding-top: 64px;
      padding-bottom: 64px;
   }

   .company-page .company_location_sec .cont-area {
      width: 90%;
   }

   .company-page .company_profile_sec .wrapper .profile-table {
      margin-top: 40px;
   }

   .company-page .company_profile_sec .wrapper .profile-table .table-cont {
      flex-direction: column;
      gap: 0px;
      padding: 20px 13px;
   }

   .company-page .company_profile_sec .wrapper .profile-table .table-cont :is(.th, .td) {
      width: 100%;
      font-size: 14px;
   }

}

/*end*/

/*company location*/
.company-page .company_location_sec {
   position: relative;
   background-color: #FFF;
}

.company-page .company_location_sec .wrapper {
   position: relative;
   padding: 80px 0;
   background-color: #FFF;
}

.company-page .company_location_sec .hd.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}


.company-page .company_location_sec .cont-wrapper {
   position: relative;
   z-index: var(--layer-top);
   margin-top: 42px;
}

.company-page .company_location_sec .grid-wrapper.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.company-page .company_location_sec .cont-wrapper {
   display: grid;
   gap: 32px calc((32 / 1166) * 100%);
   grid-template-columns: repeat(2, 1fr);
}

.company-page .company_location_sec .cont-wrapper .cont.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.company-page .company_location_sec .cont-wrapper .cont .top {
   display: flex;
   justify-content: space-between;
}

.company-page .company_location_sec .cont-wrapper .top .left h3 {
   font-size: 22px;
   font-weight: 600;
   letter-spacing: 0.06em;
   color: var(--text-color);
   margin-bottom: 15px;
}

.company-page .company_location_sec .cont-wrapper .top .left p {
   font-size: 16px;
   font-weight: 400;
   color: var(--text-color);
}

.company-page .company_location_sec .cont-wrapper .top .right {
   text-align: center;
   padding-left: 24px;
   border-left: 1px solid #F5F4F2;
}

.company-page .company_location_sec .cont-wrapper .top .right a {
   transition: 0.3s ease-in-out;
}

@media (any-hover:hover) {
   .company-page .company_location_sec .cont-wrapper .top .right a:hover {
      opacity: 0.75;
   }
}

.company-page .company_location_sec .cont-wrapper .top .right a .img-area {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 48px;
   margin: auto;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
   background-color: #F5F4F2;
}

.company-page .company_location_sec .cont-wrapper .top .right a .img-area img {
   max-width: 16px;
}

.company-page .company_location_sec .cont-wrapper .top .right a span {
   display: block;
   font-weight: 600;
   font-size: 12px;
   margin-top: 8px;
   color: var(--main-color);
}

.company-page .company_location_sec .cont-wrapper .bottom {
   margin-top: 15px;
}

.company-page .company_location_sec .cont-wrapper .bottom h4 {
   width: fit-content;
   font-size: 14px;
   font-weight: 600;
   color: var(--text-color);
   padding: 8px 20px;
   margin-bottom: -18px;
   border-radius: 12px 12px 0 0;
   background-color: #F5F4F2;
}

.company-page .company_location_sec .cont-wrapper .bottom ul {
   padding: 20px 16px 16px;
   border-radius: 0 12px 12px 12px;
   background-color: #F5F4F2;
}

.company-page .company_location_sec .cont-wrapper .bottom ul li {
   font-size: 14px;
   font-weight: 400;
   color: var(--text-color);
   padding: 11px 0;
}

.company-page .company_location_sec .cont-wrapper .bottom ul li+li {
   border-top: solid 1px #B3CFD9;
}


/*sp*/
@media (max-width:767px) {
   .company-page .company_location_sec .wrapper {
      width: 100%;
      padding: 62px 0;
   }

   .company-page .company_location_sec .cont-area {
      width: 90%;
   }

   .company-page .company_location_sec .cont-wrapper {
      gap: 32px calc((32 / 1166) * 100%);
      grid-template-columns: repeat(1, 1fr);
      margin-top: 40px;
   }

   .company-page .company_location_sec .cont-wrapper .top {
      margin-bottom: 18px;
   }

   .company-page .company_location_sec .cont-wrapper .top.no-link {
      margin-bottom: 32px;
   }


   .company-page .company_location_sec .cont-wrapper .top .left h3 {
      font-size: 18px;
      margin-bottom: 9px;
   }

   .company-page .company_location_sec .cont-wrapper .top .left p {
      font-size: 14px;
   }

   .company-page .company_location_sec .cont-wrapper .bottom {
      margin-top: 0;
   }

   .company-page .company_location_sec .cont-wrapper .bottom h4 {
      font-size: 12px;
      padding: 9px 20px;
      margin-top: -18px;
   }

   .company-page .company_location_sec .cont-wrapper .bottom ul {
      padding: 10px 16px;
      border-radius: 0 12px 12px 12px;
   }

   .company-page .company_location_sec .cont-wrapper .bottom ul li {
      font-size: 12px;
      padding: 11px 0;
   }
}

/*end*/

/*company history*/
.company-page .company_history_sec {
   position: relative;
   background-color: #FFF;
}

.company-page .company_history_sec .wrapper {
   position: relative;
   padding-top: 80px;
   padding-bottom: 120px;
   background-color: #FFF;
}

.company-page .company_history_sec .hd.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}


.company-page .company_history_sec .cont-wrapper {
   position: relative;
   z-index: var(--layer-top);
   margin-top: 42px;
}

.company-page .company_history_sec .cont-wrapper .cont {
   display: flex;
   align-items: center;
}

.company-page .company_history_sec .cont-wrapper .cont.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.company-page .company_history_sec .cont-wrapper .cont+.cont {
   margin-top: 27px;
}

.company-page .company_history_sec .cont-wrapper .cont h3 {
   display: flex;
   justify-content: end;
   gap: 5px;
   align-items: center;
   width: 108px;
   font-family: var(--deco-text);
   font-size: 32px;
   font-weight: 400;
   color: var(--main-color);
}

.company-page .company_history_sec .cont-wrapper .cont+.cont h3 {
   padding-top: 29px;
}

.company-page .company_history_sec .cont-wrapper .cont h3 span {
   font-size: 16px;
   font-weight: 600;
}

.company-page .company_history_sec .cont-wrapper .cont .circle {
   position: relative;
   width: 16px;
   aspect-ratio: 1 /1;
   margin: 0 32px 0 22px;
   border-radius: 50%;
   background-color: var(--main-color);
}

.company-page .company_history_sec .cont-wrapper .cont .circle img {
   position: absolute;
   transform: translateX(-50%);
   top: 100%;
   left: 50%;
   width: 2px;
   clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
   transition: clip-path 0.5s linear 0.25s;
}

.company-page .company_history_sec .cont-wrapper .cont.active .circle img {
   clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.company-page .company_history_sec .cont-wrapper .cont+.cont .circle {
   margin-top: 29px;
}

.company-page .company_history_sec .cont-wrapper .cont p {
   width: calc(100% - 108px - 16px - 32px - 22px);
   font-size: 16px;
   font-weight: 600;
   color: var(--text-color);
   line-height: 2.0;
   letter-spacing: 0.06em;
}

.company-page .company_history_sec .cont-wrapper .cont+.cont p {
   padding-top: 29px;
   border-top: 1px solid #F5F4F2;
}

/*sp*/
@media (max-width:767px) {
   .company-page .company_history_sec .wrapper {
      width: 100%;
      padding: 62px 0 80px;
   }

   .company-page .company_history_sec .cont-area {
      width: 90%;
   }

   .company-page .company_history_sec .cont-wrapper {
      margin-top: 40px;
   }

   .company-page .company_history_sec .cont-wrapper .cont {
      align-items: flex-start;
   }

   .company-page .company_history_sec .cont-wrapper .cont+.cont {
      margin-top: 22px;
   }

   .company-page .company_history_sec .cont-wrapper .cont .text {
      width: calc(100% - 29px);
   }

   .company-page .company_history_sec .cont-wrapper .cont+.cont .text {
      padding-top: 24px;
      border-top: 1px solid #F5F4F2;
   }

   .company-page .company_history_sec .cont-wrapper .cont h3 {
      gap: 3px;
      justify-content: start;
      width: 100%;
      font-size: 24px;
   }

   .company-page .company_history_sec .cont-wrapper .cont+.cont h3 {
      padding-top: 0;
   }

   .company-page .company_history_sec .cont-wrapper .cont h3 span {
      font-size: 14px;
   }

   .company-page .company_history_sec .cont-wrapper .cont .circle {
      top: 7px;
      width: 16px;
      margin: 0 13px 0 0;
   }

   .company-page .company_history_sec .cont-wrapper .cont .circle img {
      transform: translateX(0);
      top: calc(100% + 2px);
      left: 7px;
      width: 2px;
   }

   .company-page .company_history_sec .cont-wrapper .cont+.cont .circle {
      margin-top: 23px;
   }

   .company-page .company_history_sec .cont-wrapper .cont p {
      width: 100%;
      font-size: 13px;
      margin-top: 6px;
   }

   .company-page .company_history_sec .cont-wrapper .cont+.cont p {
      padding-top: 0;
      border: 0;
   }
}

/*end*/

/*======================
service
=======================*/
.service-page .service_sec {
   position: relative;
   padding-top: 120px;
   background-color: #FFF;
}

.service-page .service_sec+.service_sec {
   padding-top: 80px;
}

.service-page .service_sec:last-of-type {
   padding-bottom: 120px;
}

.service-page .service_sec .cont-area {
   position: relative;
   display: flex;
   justify-content: space-between;
   padding: 40px calc((30 / 1166) * 100%) 40px calc((40 / 1166) * 100%);
   background-color: #F5F4F2;
   border-radius: 80px;
}

.service-page .service_sec .cont-area.animation {
   opacity: 0;
   translate: initial;
   transition: 0.5s ease-in-out;
}

.service-page .service_sec .cont-area.animation.active {
   opacity: 1.0;
}

.service-page .service_sec:nth-of-type(even) .cont-area {
   flex-direction: row-reverse;
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(1) {
   display: flex;
   justify-content: space-between;
   position: relative;
   width: calc((1002 / 1096) * 100%);
}

.service-page .service_sec:nth-of-type(even) .cont-area .flex-cont:nth-of-type(1) {
   flex-direction: row-reverse;
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .img-area {
   width: calc((480 / 1002) * 100%);
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .img-area img {
   border-radius: 50px;
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area {
   position: relative;
   z-index: var(--layer-top);
   width: calc((466 / 1002) * 100%);
   margin-top: 24px;
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area h2 {
   font-size: clamp(22px, 2.34vw, 32px);
   font-weight: 600;
   line-height: 2.0;
   color: var(--main-color);
   margin-bottom: 28px;
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area h2 span {
   display: inline-block;
   font-size: calc((40 / 32) * 1.0em);
   line-height: 1.0;
   color: #FFF;
   padding: calc((18 / 40) * 1.0em) calc((12 / 40) * 1.0em);
   margin-right: 12px;
   background-color: var(--main-color);
   border-radius: calc((4 / 40) * 1.0em);
}

.service-page .service_sec:last-of-type .cont-area .flex-cont:nth-of-type(1) .text-area h2 span {
   margin-left: 12px;
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area p {
   font-size: clamp(16px, 1.46vw, 20px);
   font-weight: 600;
   color: var(--text-color);
   line-height: 2.0;
   letter-spacing: 0.06em;
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(2) {
   position: relative;
   display: flex;
   align-items: center;
   width: calc((46 / 1096) * 100%);
   background-image: radial-gradient(circle at 0.5px 0.5px, #FF6E2E 0.5px, transparent 0.51px);
   background-repeat: repeat-y;
   background-position: 0 0;
   background-size: 1px 5px;
   box-decoration-break: clone;
   -webkit-box-decoration-break: clone;
}

.service-page .service_sec:nth-of-type(even) .cont-area .flex-cont:nth-of-type(2) {
   justify-content: end;
   background-position: 100% 0;
}


.service-page .service_sec .cont-area .flex-cont:nth-of-type(2) .cont {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   transform: translateY(-50%) rotate(90deg);
   position: absolute;
   right: -94px;
   top: 50%;
   width: 200px;
}

.service-page .service_sec:nth-of-type(even) .cont-area .flex-cont:nth-of-type(2) .cont {
   right: initial;
   left: -103px;
   transform-origin: bottom;
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(2) .cont>span:not(.line) {
   font-family: var(--deco-text);
   font-size: 12px;
   color: var(--main-color);
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(2) .cont span.line {
   display: flex;
   align-items: center;
   gap: 2px;
}

.service-page .service_sec .cont-area .flex-cont:nth-of-type(2) .cont span.line span {
   display: block;
   width: 2px;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
   background-color: var(--main-color);
}

.service-page .service_sec .cont-area .service-deco {
   position: absolute;
   z-index: 1;
   bottom: calc(((24 / 560) * 100%) * -1);
}

.service-page .service_sec .cont-area .service-deco1 {
   width: calc((274 / 1166) * 100%);
   right: calc((124 / 1166) * 100%);
}

.service-page .service_sec .cont-area .service-deco2 {
   width: calc((410 / 1166) * 100%);
   left: calc((124 / 1166) * 100%);
}

.service-page .service_sec .cont-area .service-deco3 {
   width: calc((406 / 1166) * 100%);
   right: calc((124 / 1166) * 100%);
}

.service-page .service_sec .cont-area .service-deco4 {
   width: calc((410 / 1166) * 100%);
   left: calc((124 / 1166) * 100%);
}

/*tb*/
@media (max-width:1024px) {
   .service-page .service_sec .cont-area {
      padding: 30px calc((30 / 1166) * 100%) 30px calc((40 / 1166) * 100%);
      border-radius: 45px;
   }

   .service-page .service_sec .cont-area .service-deco {
      bottom: calc(((91 / 560) * 100%) * -1);
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .img-area {
      border-radius: 28px;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area h2 {
      font-size: 18px;
      margin-bottom: 10px;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area p {
      font-size: 14px;
   }
}

/*sp*/
@media (max-width:767px) {
   .service-page .service_sec {
      padding-top: 80px;
   }

   .service-page .service_sec+.service_sec {
      padding-top: 64px;
   }

   .service-page .service_sec:last-of-type {
      padding-bottom: 105px;
   }

   .service-page .service_sec .cont-area {
      width: 90%;
   }

   .service-page .service_sec .cont-area,
   .service-page .service_sec:nth-of-type(even) .cont-area {
      flex-direction: column-reverse;
      padding: 20px 20px 80px;
      border-radius: 32px;
   }

   .service-page .service_sec .cont-area .flex-cont {
      width: 100%;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1),
   .service-page .service_sec:nth-of-type(even) .cont-area .flex-cont:nth-of-type(1) {
      flex-direction: column;
      width: 100%;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .img-area {
      width: 100%;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .img-area img {
      border-radius: 12px;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area {
      width: 100%;
      margin-top: 20px;
   }


   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area h2 {
      font-size: 24px;
      white-space: nowrap;
      margin-bottom: 20px;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area h2 span {
      font-size: calc((28 / 24) * 1.0em);
      padding: calc((13 / 28) * 1.0em) calc((8 / 40) * 1.0em);
      margin-right: 5px;
      border-radius: calc((4 / 28) * 1.0em);
   }

   .service-page .service_sec:last-of-type .cont-area .flex-cont:nth-of-type(1) .text-area h2 span {
      margin-left: 5px;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(1) .text-area p {
      font-size: 16px;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(2),
   .service-page .service_sec:nth-of-type(even) .cont-area .flex-cont:nth-of-type(2) {
      width: 100%;
      margin-bottom: 20px;
      background-image: radial-gradient(circle at 0.5px 0.5px, #FF6E2E 0.5px, transparent 0.51px);
      background-repeat: repeat-x;
      background-position: 0 100%;
      background-size: 5px 1px;
   }

   .service-page .service_sec .cont-area .flex-cont:nth-of-type(2) .cont,
   .service-page .service_sec:nth-of-type(even) .cont-area .flex-cont:nth-of-type(2) .cont {
      transform: initial;
      position: static;
      width: 100%;
      margin-bottom: 20px;
   }

   .service-page .service_sec .cont-area .service-deco {
      transform: translateX(-50%);
      left: 50%;
      bottom: calc(((25 / 774) * 100%) * -1);
   }

   .service-page .service_sec .cont-area .service-deco1 {
      width: calc((138 / 335) * 100%);
      right: initial;
   }

   .service-page .service_sec .cont-area .service-deco2 {
      width: calc((207 / 335) * 100%);
   }

   .service-page .service_sec .cont-area .service-deco3 {
      width: calc((205 / 335) * 100%);
      right: initial;
   }

   .service-page .service_sec .cont-area .service-deco4 {
      width: calc((183 / 335) * 100%);
   }
}

/*======================
*
RECRUIT
*
=======================*/
.recruit-page {
   background-color: #FFF;
   padding-bottom: 120px;
}

/*sp*/
@media (max-width:767px) {
   .recruit-page {
      padding-bottom: 80px;
   }

}

.recruit-page .recruit-header {
   position: relative;
   height: 100svh;
}

@media (min-width:2000px) {
   .recruit-page .recruit-header {
      max-width: 1920px;
      margin: auto;
   }

   .recruit-page .recruit-header .mv6 {
      top: 100%;
   }
}

.recruit-page .recruit-header .hd-area {
   display: flex;
   flex-direction: column-reverse;
   position: absolute;
   z-index: var(--layer-top);
   bottom: calc((114 / 768) * 100%);
   left: calc((48 / 1366) * 100%);
}

.recruit-page .recruit-header .hd-area h1 {
   font-size: 44px;
   font-weight: 900;
   color: #514E4D;
   letter-spacing: 0.12em;
   line-height: calc(66 / 44);
   transition: var(--duration) ease-in-out;
}

.recruit-page .recruit-header .hd-area h1.active {
   opacity: 1.0;
}

.recruit-page .recruit-header .hd-area h1 span {
   color: var(--main-color);
}

.recruit-page .recruit-header .hd-area .sub {
   font-family: var(--deco-text);
   font-size: 12px;
   font-weight: 700;
   letter-spacing: 0.2em;
   line-height: 2.0;
   color: #9E9E9F;
   margin-bottom: 17px;
   transition: var(--duration) ease-in-out var(--delay);
}

.recruit-page .recruit-header .hd-area .sub.active {
   opacity: 1.0;
}

.recruit-page .recruit-header .hd-area :is(h1, .sub).cont-area.animation {
   translate: initial;
}

.recruit-page .recruit-header .scroll {
   position: absolute;
   z-index: var(--layer-top);
   bottom: calc((60 / 768) * 100%);
   left: calc((76 / 1366) * 100%);
   display: flex;
   align-items: center;
   gap: 20px;
   font-family: var(--deco-text);
   font-size: 16px;
   font-weight: 700;
   letter-spacing: 0.2em;
   color: var(--main-color);
   transition: var(--duration) ease-in-out var(--delay);
}

.recruit-page .recruit-header .scroll.active {
   opacity: 1.0;
}

.recruit-page .recruit-header .scroll.animation {
   translate: initial;
}

.recruit-page .recruit-header .scroll span {
   position: relative;
   display: inline-block;
   width: 8px;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
   background-color: var(--main-color);
}

.recruit-page .recruit-header .scroll span::after {
   content: "";
   position: absolute;
   z-index: 3;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 400%;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
   box-shadow: inset 0px 0px 16px #FF6E2E1A;
}

.recruit-page .recruit-header .scroll span::before {
   content: "";
   position: absolute;
   z-index: 2;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%) scale(0);
   width: 800%;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
   box-shadow: inset 0px 0px 16px #FF6E2E1A;
   opacity: 0;
   animation: expansion 5.0s cubic-bezier(0.22, 0.61, 0.36, 1) infinite;
}

@keyframes expansion {
   0% {
      transform: translate(-50%, -50%) scale(0);
      opacity: 0;
   }

   12% {
      transform: translate(-50%, -50%) scale(0.35);
      opacity: 1;
   }

   45% {
      transform: translate(-50%, -50%) scale(0.85);
      opacity: 0.65;
   }

   70% {
      transform: translate(-50%, -50%) scale(1.0);
      opacity: 0.45;
   }

   85% {
      transform: translate(-50%, -50%) scale(1.0);
      opacity: 0;
   }

   100% {
      transform: translate(-50%, -50%) scale(1.0);
      opacity: 0;
   }
}

.recruit-page .recruit-header .fixed-bg {
   position: fixed;
   top: 0;
   left: 0;
   z-index: 1;
   width: 100%;
   height: 100dvh;
   object-fit: cover;
}

.recruit-page .recruit-header .bg {
   position: absolute;
   z-index: 2;
   top: 0;
   left: 0;
   width: 100%;
   mix-blend-mode: multiply;
}

.recruit-page .recruit-header .recruit-mv {
   position: absolute;
   z-index: 2;
   width: calc((200 / 1366) * 100%);
   height: auto;
   aspect-ratio: 1 / 1;
   background: transparent;
}

.recruit-page .recruit-header .recruit-mv.active {
   animation: fadeIn var(--duration) var(--delay) forwards;
}

.recruit-page .recruit-header .mv1 {
   top: calc((151 / 768) * 100%);
   left: calc((459 / 1366) * 100%);
}

.recruit-page .recruit-header .mv2 {
   top: calc((151 / 768) * 100%);
   left: calc((955 / 1366) * 100%);
}

.recruit-page .recruit-header .mv3 {
   top: calc((399 / 768) * 100%);
   left: calc((707 / 1366) * 100%);
}

.recruit-page .recruit-header .mv4 {
   top: calc((399 / 768) * 100%);
   right: calc(((38 / 1366) * 100%) * -1);
   width: calc((448 / 1366) * 100%);
}

.recruit-page .recruit-header .mv5 {
   top: calc(((105 / 768) * 100%) * -1);
   right: calc(((38 / 1366) * 100%) * -1);
}

.recruit-page .recruit-header .mv6 {
   top: calc(100% + ((127 / 768) * 100%));
   right: calc(((38 / 1366) * 100%) * -1);
}

/*tb*/
@media (max-width:1024px) {
   .recruit-page .recruit-header .mv1 {
      top: calc((115 / 768) * 100%);
      left: calc((399 / 1366) * 100%);
   }
}

/*sp*/
@media (max-width:767px) {
   .recruit-page .recruit-header .hd-area {
      bottom: calc((104 / 667) * 100%);
      left: calc((20 / 375) * 100%);
   }

   .recruit-page .recruit-header .hd-area h1 {
      font-size: 24px;
      line-height: calc(36 / 24);
   }

   .recruit-page .recruit-header .hd-area .sub {
      font-size: 9px;
      margin-bottom: 13px;
   }

   .recruit-page .recruit-header .scroll {
      bottom: calc((46 / 667) * 100%);
      left: calc((48 / 375) * 100%);
      font-size: 14px;
   }

   .recruit-page .recruit-header .recruit-mv {
      width: calc((100 / 375) * 100%);
      transition: 0.3s ease-in-out;
   }

   .recruit-page .recruit-header .mv1 {
      top: calc((100 / 667) * 100%);
      left: calc(((48 / 375) * 100%) * -1);
   }

   .recruit-page .recruit-header .mv2 {
      top: calc((100 / 667) * 100%);
      left: calc((200 / 375) * 100%);
   }

   .recruit-page .recruit-header .mv3 {
      top: calc((224 / 667) * 100%);
      left: calc((76 / 375) * 100%);
   }

   .recruit-page .recruit-header .mv4 {
      top: calc((224 / 667) * 100%);
      right: calc(((50 / 375) * 100%) * -1);
      width: calc((224 / 375) * 100%);
   }

   .recruit-page .recruit-header .mv5 {
      top: calc(((24 / 667) * 100%) * -1);
      right: calc(((50 / 375) * 100%) * -1);
   }

   .recruit-page .recruit-header .mv6 {
      top: calc((472 / 667) * 100%);
      right: calc(((50 / 375) * 100%) * -1);
   }
}

/*======================
recruit message
=======================*/
.recruit-page .message {
   position: relative;
   z-index: var(--layer-top);
   font-size: 16px;
   font-weight: 600;
   letter-spacing: 0.06em;
   line-height: calc(40 / 16);
   margin-top: 145px;
   padding-left: calc((110 / 1366) * 100%);
}

.recruit-page .message.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

/*sp*/
@media (max-width:767px) {
   .recruit-page .message {
      width: 90%;
      margin: 120px auto 0;
      padding: 0;
   }
}

/*======================
recruit slider
=======================*/
.recruit-page .recruitSlider-sec {
   position: relative;
   z-index: 2;
   display: flex;
}

@media (min-width:2000px) {
   .recruit-page .recruitSlider-sec {
      max-width: 1920px;
      margin: auto;
      overflow: hidden;
   }
}

.recruit-page .recruitSlider {
   position: relative;
   z-index: var(--layer-mid);
   min-width: calc((1505/ 1366) * 100%);
   height: 295px;
   margin-top: 106px;
   animation: loop-x 16.0s linear infinite 0.5s;
}

@keyframes loop-x {
   0% {
      transform: translateX(0%);
   }

   100% {
      transform: translateX(-100%);
   }
}


.recruit-page .recruitSlider li {
   position: absolute;
}

.recruit-page .recruitSlider li:nth-of-type(1) {
   top: 0;
   left: calc(((62 / 1505) * 100%) * -1);
   width: calc((208 / 1505) * 100%);
}

.recruit-page .recruitSlider li:nth-of-type(2) {
   z-index: 2;
   top: calc((60 / 295) * 100%);
   left: calc((72 / 1505) * 100%);
   width: calc((240 / 1505) * 100%);
}

.recruit-page .recruitSlider li:nth-of-type(3) {
   top: calc((81 / 295) * 100%);
   left: calc((330 / 1505) * 100%);
   width: calc((288 / 1505) * 100%);
}

.recruit-page .recruitSlider li:nth-of-type(4) {
   z-index: 2;
   top: calc((70 / 295) * 100%);
   left: calc((521 / 1505) * 100%);
   width: calc((120 / 1505) * 100%);
}

.recruit-page .recruitSlider li:nth-of-type(5) {
   top: 0;
   left: calc((699 / 1505) * 100%);
   width: calc((320 / 1505) * 100%);
}

.recruit-page .recruitSlider li:nth-of-type(6) {
   z-index: 2;
   top: calc((175 / 295) * 100%);
   left: calc((1095 / 1505) * 100%);
   width: calc((160 / 1505) * 100%);
}

.recruit-page .recruitSlider li:nth-of-type(7) {
   top: calc((16 / 295) * 100%);
   left: calc((1095 / 1505) * 100%);
   width: calc((288 / 1505) * 100%);
}

/*sp*/
@media (max-width:767px) {
   .recruit-page .recruitSlider {
      min-width: calc((739/ 375) * 100%);
      height: 106px;
      margin-top: 80px;
   }
}

/*======================
recruit link
=======================*/
/*共通*/
.recruit-page .recruit-link .text-area .hd-area {
   font-size: 36px;
   font-weight: 600;
   text-align: center;
}

.recruit-page .recruit-link .text-area .hd-area h2 {
   font-size: 1.0em;
   margin-top: -9px;
}

.recruit-page .recruit-link .text-area .hd-area p.sub {
   font-family: var(--deco-text);
   font-weight: 700;
   font-size: calc((88 / 36) * 1.0em);
}

.recruit-page .recruit-link .text-area {
   position: relative;
   z-index: var(--layer-top);
}

.recruit-page .recruit-link .text-area.animation {
   translate: initial;
   transition: var(--duration) ease-in-out var(--delay);
}

.recruit-page .recruit-link .text-area.animation.active {
   opacity: 1.0;
}

.recruit-page .recruit-link .text-area a {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 12px;
   width: fit-content;
   font-size: 16px;
   font-weight: 800;
   color: #FFF;
   margin: auto;
   padding: 11px 24px;
   border-radius: 50px;
   border: solid 1px var(--main-color);
   background-color: var(--main-color);
   transition: 0.3s ease-in-out;
}

.recruit-page .recruit-link .text-area a .arrow-icn {
   position: relative;
   width: 16.5px;
}

.recruit-page .recruit-link .text-area a .arrow-icn img {
   width: 100%;
   transition: 0.3s ease-in-out;
}

.recruit-page .recruit-link .text-area a .arrow-icn img:nth-of-type(2) {
   position: absolute;
   top: 50%;
   left: 0;
   transform: translateY(-50%);
   opacity: 0;
}

@media (any-hover:hover) {
   .recruit-page .recruit-link .text-area a:hover {
      color: var(--main-color);
      background-color: #FFF;
   }

   .recruit-page .recruit-link .text-area a:hover .arrow-icn img:nth-of-type(1) {
      opacity: 0;
   }

   .recruit-page .recruit-link .text-area a:hover .arrow-icn img:nth-of-type(2) {
      opacity: 1.0;
   }
}

@media (max-width:1260px) {
   .recruit-page .recruit-link .text-area .hd-area {
      font-size: 28px;
   }
}

/*tb*/
@media (max-width:1024px) {
   .recruit-page .recruit-link .text-area .hd-area {
      font-size: 20px;
   }
}

/*sp*/
@media (max-width:767px) {
   .recruit-page .recruit-link .text-area .hd-area {
      font-size: 24px;
   }

   .recruit-page .recruit-link .text-area .hd-area h2 {
      margin-top: 1px;
   }

   .recruit-page .recruit-link .text-area .hd-area p.sub {
      font-size: calc((44 / 24) * 1.0em);
   }
}

/*business environment*/
.recruit-page .recruit-link:is(.business, .environment) .cont-area {
   position: relative;
   width: calc((1266 / 1366) * 100%);
}

@media (min-width:2000px) {
   .recruit-page .recruit-link:is(.business, .environment) .cont-area {
      max-width: 1920px;
      margin: auto;
   }
}

.recruit-page .recruit-link:is(.business, .environment) .cont-area img {
   position: relative;
   z-index: 2;
   width: calc((862 / 1266) * 100%);
}

.recruit-page .recruit-link:is(.business, .environment) .cont-area img.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}


.recruit-page .recruit-link:is(.business, .environment) .cont-area .text-area {
   position: absolute;
   top: calc((220 / 570) * 100%);
}

.recruit-page .recruit-link:is(.business, .environment) .cont-area .text-area a {
   margin-top: calc((61 / 631) * 100%);
}

/*tb*/
@media (max-width:1024px) {
   .recruit-page .recruit-link:is(.business, .environment) .cont-area .text-area {
      top: calc((170 / 570) * 100%);
   }
}

/*sp*/
@media (max-width:767px) {
   .recruit-page .recruit-link:is(.business, .environment) .cont-area {
      width: 100%;
   }

   .recruit-page .recruit-link:is(.business, .environment) .cont-area img {
      width: calc((355 / 375) * 100%);
   }


   .recruit-page .recruit-link:is(.business, .environment) .cont-area .text-area {
      position: relative;
      top: initial;
      margin-top: 24px;
   }

   .recruit-page .recruit-link:is(.business, .environment) .cont-area .text-area a {
      margin-top: calc((24 / 412) * 100%);
   }
}

/*business*/
.recruit-page .recruit-link.business {
   margin-top: 109px;
}

.recruit-page .recruit-link.business .cont-area img {
   border-radius: 0 40px 40px 0;
}

@media (min-width:2000px) {
   .recruit-page .recruit-link.business .cont-area img {
      border-radius: 40px;
   }
}

.recruit-page .recruit-link.business .cont-area .text-area {
   right: 0;
}

.recruit-page .recruit-link.business .cont-area .text-area .hd-area {
   text-align: end;
}

.recruit-page .recruit-link.business .cont-area .text-area a {
   margin-left: auto;
   margin-right: initial;
}

/*sp*/
@media (max-width:767px) {
   .recruit-page .recruit-link.business {
      margin-top: 69px;
   }

   .recruit-page .recruit-link.business .cont-area img {
      border-radius: 0 12px 12px 0;
   }

   .recruit-page .recruit-link.business .cont-area .text-area .hd-area {
      text-align: center;
   }

   .recruit-page .recruit-link.business .cont-area .text-area a {
      margin-left: auto;
      margin-right: auto;
   }
}

/*environment*/
.recruit-page .recruit-link.environment {
   margin-top: 120px;
}

.recruit-page .recruit-link.environment .cont-area {
   margin-left: auto;
}

.recruit-page .recruit-link.environment .cont-area img {
   margin-left: auto;
   border-radius: 40px 0 0 40px;
}

@media (min-width:2000px) {
   .recruit-page .recruit-link.environment .cont-area img {
      border-radius: 40px;
   }
}

.recruit-page .recruit-link.environment .cont-area .text-area {
   left: 0;
}

.recruit-page .recruit-link.environment .cont-area .text-area .hd-area {
   text-align: start;
}

.recruit-page .recruit-link.environment .cont-area .text-area a {
   margin-right: auto;
   margin-left: initial;
}

@media (max-width:767px) {
   .recruit-page .recruit-link.environment {
      margin-top: 64px;
   }

   .recruit-page .recruit-link.environment .cont-area img {
      border-radius: 12px 0 0 12px;
   }

   .recruit-page .recruit-link.environment .cont-area .text-area .hd-area {
      text-align: center;
   }

   .recruit-page .recruit-link.environment .cont-area .text-area a {
      margin-right: auto;
      margin-left: auto;
   }
}

/*interview*/
.recruit-page .recruit-link.interview {
   margin-top: 145px;
}

@media (min-width:2000px) {
   .recruit-page .recruit-link.interview {
      max-width: 1920px;
      margin: auto;
   }
}

.recruit-page .recruit-link.interview .cont-area {
   position: relative;
}

.recruit-page .recruit-link.interview .cont-area>img {
   position: relative;
   z-index: 2;
   width: 100%;
   transition: ease-in-out var(--duration);
}

.recruit-page .recruit-link.interview .cont-area>img.animation.active {
   opacity: 1.0;
}

.recruit-page .recruit-link.interview .cont-area .text-area {
   position: absolute;
   top: calc((125 / 451) * 100%);
   left: 50%;
   transform: translateX(-50%);
}

.recruit-page .recruit-link.interview .text-area a {
   margin-top: calc((61 / 451) * 100%);
}

/*tb*/
@media (max-width:1024px) {
   .recruit-page .recruit-link.interview .cont-area .text-area {
      top: calc((80 / 451) * 100%);
   }
}

/*sp*/
@media (max-width:767px) {
   .recruit-page .recruit-link.interview {
      margin-top: 64px;
   }

   .recruit-page .recruit-link.interview .cont-area .text-area {
      position: relative;
      top: initial;
      margin-top: 35px;
   }

   .recruit-page .recruit-link.interview .cont-area .text-area a {
      margin-top: calc((24 / 412) * 100%);
   }

}

/*======================
recruit cta
=======================*/
.recruit-page .recruit-cta {
   position: relative;
   width: calc((1266 / 1366) * 100%);
   margin-top: 144px;
}

.recruit-page .recruit-cta img {
   position: relative;
   z-index: 2;
   width: calc((1160 / 1266) * 100%);
   border-radius: 0 40px 40px 0;
}

.recruit-page .recruit-cta .btn-area {
   position: absolute;
   z-index: var(--layer-top);
   right: 0;
   top: 50%;
   transform: translateY(-50%);
}

.recruit-page .recruit-cta .btn-area .cta-btn {
   display: flex;
   align-items: center;
   justify-content: space-between;
   height: 200px;
   min-width: 567px;
   padding: 0 64px;
   border-radius: 80px;
   transition: 0.3s ease-in-out;
}

@media (any-hover:hover) {
   .recruit-page .recruit-cta .btn-area .cta-btn:hover {
      translate: 8px 0;
   }
}

.recruit-page .recruit-cta .btn-area .cta-btn+.cta-btn {
   margin-top: 16px;
}

.recruit-page .recruit-cta .btn-area .cta-btn.guide {
   background-color: #F5F4F2;
}

.recruit-page .recruit-cta .btn-area .cta-btn.entry {
   background-color: var(--main-color);
}

.recruit-page .recruit-cta .btn-area .cta-btn .text {
   font-size: 16px;
}

.recruit-page .recruit-cta .btn-area .cta-btn.guide .text {
   color: var(--main-color);
}

.recruit-page .recruit-cta .btn-area .cta-btn.entry .text {
   color: #FFF;
}

.recruit-page .recruit-cta .btn-area .cta-btn .text .deco {
   font-family: var(--deco-text);
   font-size: calc((40 / 16) * 1.0em);
   font-weight: 600;
   margin-bottom: 7px;
}

.recruit-page .recruit-cta .btn-area .cta-btn .text .deco+span {
   display: block;
   font-weight: 600;
}

.recruit-page .recruit-cta .btn-area .cta-btn .img-area {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 42px;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
}

.recruit-page .recruit-cta .btn-area .cta-btn.guide .img-area {
   background-color: var(--main-color);
}

.recruit-page .recruit-cta .btn-area .cta-btn.entry .img-area {
   background-color: #FFF;
}

.recruit-page .recruit-cta .btn-area .cta-btn .img-area img {
   max-width: 14px;
}

@media (min-width:2000px) {
   .recruit-page .recruit-cta {
      max-width: 1920px;
      margin: auto;
   }

   .recruit-page .recruit-cta img {
      border-radius: 40px;
   }
}

@media (max-width:1300px) {
   .recruit-page .recruit-cta .btn-area .cta-btn {
      min-width: 410px;
      height: 150px;
      border-radius: 65px;
   }
}

/*tb*/
@media (max-width:1024px) {
   .recruit-page .recruit-cta .btn-area {
      right: -5%;
   }

   .recruit-page .recruit-cta .btn-area .cta-btn {
      min-width: 410px;
      height: 125px;
   }

   .recruit-page .recruit-cta .btn-area .cta-btn .text {
      font-size: 14px;
   }
}

/*tb*/
@media (max-width:767px) {
   .recruit-page .recruit-cta {
      width: 100%;
      margin-top: 64px;
   }

   .recruit-page .recruit-cta img {
      width: 100%;
      border-radius: 0;
   }

   .recruit-page .recruit-cta .btn-area {
      position: relative;
      transform: translate(0, 0);
      right: initial;
      width: 100%;
      margin: -30px auto 0;
   }

   .recruit-page .recruit-cta .btn-area .cta-btn {
      width: 335px;
      min-width: initial;
      height: 117px;
      padding: 0 32px;
      border-radius: 32px;
      margin: auto;
   }

   .recruit-page .recruit-cta .btn-area .cta-btn+.cta-btn {
      margin-top: 8px;
   }

   .recruit-page .recruit-cta .btn-area .cta-btn .text {
      font-size: 14px;
   }

   .recruit-page .recruit-cta .btn-area .cta-btn .text .deco {
      font-size: 24px;
      margin-bottom: 2.5px;
   }
}

/*======================
recruitUnder
=======================*/
.recruitUnder .recruitUnder-header {
   position: relative;
   padding-top: 150px;
}

@media (min-width:1025px) {
   .recruitUnder .recruitUnder-header {
      height: 100dvh;
   }
}

.recruitUnder .recruitUnder-header::before {
   content: "";
   position: absolute;
   z-index: var(--layer-bottom);
   top: 0;
   left: 0;
   width: 100%;
   height: calc((240/ 704) * 100%);
   background-color: #FFF;
}

.recruitUnder .recruitUnder-header .header-cont {
   position: relative;
   display: flex;
   align-items: end;
   width: 100%;
}

@media (min-width:1025px) {
   .recruitUnder .recruitUnder-header .header-cont {
      height: calc(100% - 85px);
   }
}

.recruitUnder .recruitUnder-header .header-cont .text-area {
   position: relative;
   z-index: var(--layer-top);
   width: calc((406 / 1366) * 100%);
}

.recruitUnder .recruitUnder-header .header-cont .text-area.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.recruitUnder .recruitUnder-header .header-cont .text-area .inner {
   width: calc((310 / 406) * 100%);
   margin: auto;
}

@media (min-width:1025px) {
   .recruitUnder .recruitUnder-header .header-cont .text-area {
      height: max(340px, 44vh);
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area .inner {
      width: calc((310 / 406) * 100%);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      height: 100%;
   }
}

@media (min-width:2000px) {
   .recruitUnder .recruitUnder-header {
      position: relative;
      padding-top: 210px;
      margin-bottom: 85px;
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area .inner {
      gap: 40px;
      justify-content: flex-end;
   }
}

.recruitUnder .recruitUnder-header .header-cont .text-area .inner .hd-area {
   font-size: clamp(34px, 3.51vw, 48px);
}

.recruitUnder .recruitUnder-header .header-cont .text-area .inner .hd-area h1 {
   font-size: 1.0em;
   font-weight: 900;
   margin-top: calc((11 / 343) * 100%);
}

.recruitUnder .recruitUnder-header .header-cont .text-area .inner .hd-area span {
   display: block;
   font-family: var(--deco-text);
   font-size: calc((16 / 48) * 1.0em);
   font-weight: 400;
   color: var(--main-color);
}

.recruitUnder .recruitUnder-header .header-cont .text-area p {
   font-size: clamp(14px, 1.17vw, 16px);
   font-weight: 600;
   line-height: 2.0;
}

.recruitUnder .recruitUnder-header .header-cont>img {
   width: calc((960 / 1366) * 100%);
   height: 100%;
   border-radius: 40px 0 0 40px;
   object-fit: cover;
}


.recruitUnder-header .header-cont .text-area .link-area a+a {
   margin-top: calc((24/ 343) * 100%);
}

@media (min-width:2000px) {
   .recruitUnder .recruitUnder-header .header-cont {
      max-width: 1920px;
      margin: auto;
   }

   .recruitUnder .recruitUnder-header .header-cont>img {
      border-radius: 40px;
   }
}

/*tb*/
@media screen and (min-width:768px) and (max-width:1024px) {
   .recruitUnder .recruitUnder-header .header-cont .text-area {
      margin-top: 35px !important;
   }
}

@media (max-width:1024px) {
   .recruitUnder .recruitUnder-header .header-cont {
      flex-direction: column-reverse;
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area {
      width: 88%;
      margin: auto;
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area .inner {
      width: 100%;
      margin: auto;
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area .inner .hd-area {
      margin-bottom: 35px;
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area .inner .hd-area h1 {
      margin-top: 20px;
   }


   .recruitUnder .recruitUnder-header .header-cont>img {
      width: 94%;
   }

   .recruitUnder-header .header-cont .text-area .link-area {
      width: fit-content;
   }
}

/*sp*/
@media (max-width:767px) {
   .recruitUnder .recruitUnder-header {
      padding-top: 115px;
      margin-bottom: 41.5px;
   }

   .recruitUnder .recruitUnder-header::before {
      height: 42%;
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area {
      width: calc(100% - ((100% - ((355 / 375) * 100%)) * 2));
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area .inner .hd-area {
      margin-top: 33px;
      margin-bottom: 31px;
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area .inner .hd-area h1 {
      font-size: 32px;
      margin-top: 12px;
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area .inner .hd-area h1 span {
      font-size: 14px;
   }

   .recruitUnder .recruitUnder-header .header-cont .text-area .inner {
      font-size: 14px;
   }

   .recruitUnder .recruitUnder-header .header-cont>img {
      width: calc((355 / 375) * 100%);
      border-radius: 16px 0 0 16px;
   }

   .recruitUnder-header .header-cont .text-area .link-area a+a {
      margin-top: 24px;
   }
}

/*======================
environment
=======================*/
.environment-page {
   background-color: #F0F7BC;
   padding-bottom: 120px;
}

/*sp*/
@media (max-width:767px) {
   .environment-page {
      padding-bottom: 64px;
   }
}

/*feature*/
.environmentFeature-sec {
   position: relative;
   margin: 36px auto 0;
   max-width: 1166px;
   padding: 75px calc((80 / 1166) * 100%) 75px calc((80 / 1166) * 100%);
}

.environmentFeature-sec::after {
   content: "";
   position: absolute;
   z-index: var(--layer-bottom);
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: #FFF;
   border-radius: 80px;
}

.environmentFeature-sec .cont-area>*+* {
   margin-top: 42px;
   padding-top: 50px;
}

.environmentFeature-sec .cont-area>*+*::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 1px;
   background-color: #F5F4F2;
   border-radius: 16px;
}

.environmentFeature-sec .cont-area .cont>*.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.environmentFeature-sec .cont-area .flex-cont {
   display: flex;
   justify-content: space-between;
   gap: 32px;
}

.environmentFeature-sec .cont-area .flex-cont .cont.has-icn {
   width: calc((447 / 978) * 100%);
}

.environmentFeature-sec .cont-area .flex-cont .cont {
   width: calc((447 / 978) * 100%);
}

.environmentFeature-sec .cont-area .cont.has-icn {
   position: relative;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 27px;
}

.environmentFeature-sec .cont-area .cont.has-icn img:not(.calendar) {
   position: absolute;
   z-index: 2;
   top: 50%;
   transform: translateY(-50%);
   right: calc(100% + 16px);
   max-width: 149px;
}

.environmentFeature-sec .cont-area .cont.has-icn .calendar {
   position: relative;
   z-index: 2;
   width: calc((328 /978) * 100%);
}

.environmentFeature-sec .cont-area .cont.has-icn:has(.calendar) .text-area {
   width: calc((100% - ((328 /978) * 100%)) - 149px);
   margin-bottom: auto;
}

.environmentFeature-sec .cont-area .cont .text-area {
   position: relative;
   z-index: var(--layer-top);
}

.environmentFeature-sec .cont-area .cont .text-area h2 {
   font-size: clamp(20px, 2.34vw, 32px);
   margin-bottom: 21px;
}

.environmentFeature-sec .cont-area .cont .text-area h2 span {
   color: var(--main-color);
}

.environmentFeature-sec .cont-area .cont .text-area p {
   font-size: clamp(14px, 1.17vw, 16px);
   font-weight: 600;
   line-height: 2.0;
}

/*tb*/
@media (max-width:1024px) {
   .environmentFeature-sec {
      width: 88%;
      margin: 36px auto 0;
   }

   .environmentFeature-sec .cont-area>*+* {
      margin-top: 65px;
   }

   .environmentFeature-sec .cont-area .flex-cont {
      display: block;
   }

   .environmentFeature-sec .cont-area .flex-cont .cont.has-icn {
      width: 100%;
      margin-left: 115px;
   }

   .environmentFeature-sec .cont-area .cont.has-icn {
      width: calc(100% - 115px);
      margin-left: auto;
   }

   .environmentFeature-sec .cont-area .flex-cont .cont.has-icn {
      width: calc(100% - 115px);
      margin-left: auto;
   }

   .environmentFeature-sec .cont-area .cont.has-icn img:not(.calendar) {
      max-width: 115px;
   }

   .environmentFeature-sec .flex-cont .cont-area .cont.has-icn .text-area {
      width: calc(100% - 115px);
   }

   .environmentFeature-sec .cont-area .flex-cont .cont+.cont {
      width: 100%;
      margin-top: 65px;
      margin-left: auto;
   }

   .environmentFeature-sec .cont-area .cont.has-icn:has(.calendar) .text-area {
      width: calc((100% - ((170 /768) * 100%)) - 115px);
      margin-bottom: auto;
   }
}

/*sp*/
@media (max-width:767px) {
   .environmentFeature-sec {
      width: 90%;
      margin-top: 80px;
      padding: 70px 20px 40px;
   }

   .environmentFeature-sec::after {
      border-radius: 32px;
   }

   .environmentFeature-sec .cont-area>*+* {
      position: relative;
      margin-top: 30px;
      padding-top: 32px;
   }

   .environmentFeature-sec .cont-area>div:first-of-type {
      margin-top: -80px;
   }


   .environmentFeature-sec .cont-area .cont.has-icn {
      display: block;
      width: 100%;
   }

   .environmentFeature-sec .cont-area .flex-cont .cont.has-icn {
      width: 100%;
      margin-left: initial;
   }

   .environmentFeature-sec .cont-area .cont.has-icn img:not(.calendar) {
      position: relative;
      right: initial;
      top: initial;
      transform: translate(0);
      max-width: 68px;
      margin: auto;
   }

   .environmentFeature-sec .cont-area .cont.has-icn .text-area {
      width: 100%;
   }

   .environmentFeature-sec .cont-area .cont.has-icn:has(.calendar) .text-area {
      width: 100%;
   }

   .environmentFeature-sec .cont-area .cont.has-icn .calendar {
      width: 100%;
      margin-top: 20px;
   }

   .environmentFeature-sec .cont-area .flex-cont .cont+.cont {
      width: 100%;
      margin-top: 30px;
      margin-left: initial;
   }

   .environmentFeature-sec .cont-area .cont .text-area h2 {
      font-size: 24px;
      margin-top: 13px;
      margin-bottom: 12px;
   }

}

/*======================
*
INTERVIEW
*
=======================*/
.interview-page {
   background-color: #FFE7E0;
}

/*======================
interview link
=======================*/
.interview-page .interview-link {
   display: flex;
   justify-content: space-between;
   padding-bottom: 80px;
}

.interview-page .interview-link a.link-cont {
   display: flex;
   justify-content: space-between;
   align-items: end;
   width: calc((567 / 1166) * 100%);
   transition: 0.3s ease-in-out;
}

.interview-page .interview-link a .img-area {
   width: calc((160 / 567) * 100%);
}

.interview-page .interview-link a .text-area {
   position: relative;
   z-index: var(--layer-top);
   width: calc((387 / 567) * 100%);
   padding-right: calc((15 / 567) * 100%);
   border-bottom: solid 1px var(--main-color);
}

.interview-page .interview-link a .text-area span {
   font-family: var(--deco-text);
   font-size: 12px;
   font-weight: 400;
   line-height: 1.0;
   color: #FFF;
   padding: 4.2px 10px;
   background-color: var(--main-color);
   border-radius: 15px;
}

.interview-page .interview-link a .text-area .wrapper {
   display: flex;
   align-items: center;
}

.interview-page .interview-link a .text-area .wrapper h2 {
   font-size: clamp(14px, 20px, 1.46vw);
   font-weight: 600;
   line-height: 2.0;
   color: var(--main-color);
   margin-top: 12px;
   padding-bottom: 18px;
}

.interview-page .interview-link a .text-area .wrapper img {
   max-width: 14px;
   rotate: 90deg;
   transition: 0.3s ease-in-out;
}

@media (any-hover:hover) {
   .interview-page .interview-link a.link-cont:hover {
      opacity: 0.75;
   }

   .interview-page .interview-link a:hover .text-area .wrapper img {
      translate: 0 5px;
   }
}

/*tb*/
@media (max-width:1024px) {
   .interview-page .interview-link {
      width: 90%;
   }

   .interview-page .interview-link a .text-area .wrapper h2 {
      font-size: 12px;
   }
}

/*sp*/
@media (max-width:767px) {
   .interview-page .interview-link {
      position: relative;
      display: block;
      padding-bottom: 64px;
   }

   .interview-page .interview-link a.link-cont {
      width: 100%;
   }

   .interview-page .interview-link a.link-cont+a.link-cont {
      margin-top: 24px;
   }

   .interview-page .interview-link a .img-area {
      position: relative;
      width: calc((80 / 335) * 100%);
      text-align: center;
      padding-bottom: 33px;
   }

   .interview-page .interview-link a .img-area>span {
      position: absolute;
      transform: translateX(-50%);
      left: 50%;
      bottom: 0;
      font-family: var(--deco-text);
      font-size: 12px;
      font-weight: 400;
      line-height: 1.0;
      color: #FFF;
      padding: 4.2px 10px;
      background-color: var(--main-color);
      border-radius: 15px;
   }

   .interview-page .interview-link a .text-area {
      width: calc((228 / 335) * 100%);
   }

   .interview-page .interview-link a .text-area .wrapper h2 {
      font-size: 16px;
      padding-bottom: 12px;
      margin-top: 0;
   }

}

/*======================
interview 内容
=======================*/
.interview-page .interview-sec {
   background-color: #FFF;
}

.interview-page .interview-sec#interview1 {
   padding-bottom: 120px;
}

.interview-page .interview-sec .interview-header {
   position: relative;
}

@media (min-width:2000px) {
   .interview-page .interview-sec .interview-header {
      max-width: 1920px;
      margin: auto;
   }
}

.interview-page .interview-sec .interview-header .deco {
   position: absolute;
   width: calc((687 / 1366) * 100%);
   left: calc(((-1 / 1366) * 100%) * -1);
   top: -7%;
}

.interview-page .interview-sec .interview-header h2 {
   position: absolute;
   z-index: 11;
   right: calc((119 / 1136) * 100%);
   bottom: 64px;
   font-size: clamp(20px, 2.64vw, 36px);
   font-weight: 900;
   color: var(--main-color);
   line-height: calc(56 / 36);
}

.interview-page .interview-sec .interview-header .num {
   position: absolute;
   z-index: 1;
   right: calc((119 / 1136) * 100%);
   top: -7%;
   font-size: clamp(160px, 23.43vw, 320px);
   font-family: var(--deco-text);
   font-weight: 700;
   color: #FFF;
   line-height: 1.0;
}

.interview-page .interview-sec .interview-cont {
   display: flex;
   margin-top: 120px;
}

.interview-page .interview-sec .interview-cont .profile {
   width: calc((321 / 1126) * 100%);
   padding-right: calc((64 / 1126) * 100%);
}

.interview-page .interview-sec .interview-cont .profile .inner {
   position: sticky;
   z-index: var(--layer-top);
   top: 90px;
}

.interview-page .interview-sec .interview-cont .profile .inner h2 {
   font-family: var(--deco-text);
   font-size: 20px;
   font-weight: 400;
   color: var(--main-color);
}

.interview-page .interview-sec .interview-cont .profile .inner .name {
   font-size: 16px;
   margin-bottom: 15px;
}

.interview-page .interview-sec .interview-cont .profile .inner .name p {
   font-weight: 600;
   font-size: 1.0em;
   margin-top: 27px;
   margin-bottom: 7px;
}

.interview-page .interview-sec .interview-cont .profile .inner .name span {
   display: block;
   font-family: var(--deco-text);
   font-weight: 400;
   font-size: calc((12 / 16)* 1.0em);
   color: #9E9E9F;
}

.interview-page .interview-sec .interview-cont .profile .inner .name span {
   font-weight: 400;
   font-size: 14px;
   line-height: 2.0;
   color: #9E9E9F;
}

.interview-page .interview-sec .interview-cont .profile .inner p {
   font-size: 14px;
   line-height: 2.0;
}

.interview-page .interview-sec .interview-cont .cont {
   position: relative;
   z-index: var(--layer-top);
   width: calc((845 / 1126) * 100%);
   padding-left: calc((64 / 1126) * 100%);
   border-left: 1px solid #F5F4F2;
}

.interview-page .interview-sec .interview-cont .cont h2 {
   font-size: 26px;
   font-weight: 900;
   line-height: calc(48 / 26);
   margin-bottom: 31px;
}

.interview-page .interview-sec .interview-cont .cont p+h2 {
   margin-top: 61px;
}

.interview-page .interview-sec .interview-cont .cont h2 span {
   color: var(--main-color);
}

.interview-page .interview-sec .interview-cont .cont p {
   font-size: 16px;
   font-weight: 600;
   line-height: 2.0;
}

/*tb*/
@media (max-width:1024px) {
   .interview-page .interview-sec .interview-cont {
      width: 95%;
   }
}

/*sp*/
@media (max-width:767px) {
   .interview-page .interview-sec#interview1 {
      padding-bottom: 60px;
   }

   .interview-page .interview-sec .interview-header {
      overflow: hidden;
   }

   .interview-page .interview-sec .interview-header .deco {
      z-index: 2;
      left: 50%;
      transform: translateX(-50%);
      width: calc((316 / 375) * 100%);
      top: calc((64 / 388) * 100%);
   }

   .interview-page .interview-sec .interview-header h2 {
      transform: translateX(-50%);
      left: 50%;
      right: initial;
      bottom: calc((32 / 388) * 100%);
      width: 100%;
      font-size: 24px;
      line-height: calc(36 / 24);
      text-align: center;
   }

   .interview-page .interview-sec .interview-header .num {
      right: 0;
      top: -16px;
   }

   .interview-page .interview-sec .interview-cont {
      display: block;
      width: 90%;
      margin-top: 34px;
   }

   .interview-page .interview-sec .interview-cont .profile {
      width: 100%;
      padding: 0;
      padding-bottom: 26px;
   }

   .interview-page .interview-sec .interview-cont .profile .inner h2 {
      font-size: 16px;
   }

   .interview-page .interview-sec .interview-cont .profile .inner .name {
      font-size: 14px;
      margin-bottom: 9px;
   }

   .interview-page .interview-sec .interview-cont .profile .inner .name p {
      margin-top: 17.5px;
      margin-bottom: 8.5px;
   }

   .interview-page .interview-sec .interview-cont .profile .inner .name span {
      font-size: 12px;
   }

   .interview-page .interview-sec .interview-cont .profile .inner .name span {
      font-size: 12px;
   }

   .interview-page .interview-sec .interview-cont .cont {
      width: 100%;
      padding: 0;
      padding-top: 22px;
      border-left: 0;
      border-top: 1px solid #F5F4F2;
   }

   .interview-page .interview-sec .interview-cont .cont h2 {
      font-size: 20px;
      line-height: 2.0;
      margin-bottom: 16px;
   }

   .interview-page .interview-sec .interview-cont .cont p+h2 {
      margin-top: 25px;
   }

   .interview-page .interview-sec .interview-cont .cont p {
      font-size: 14px;
   }
}

/*======================
*
BUSINESS
*
=======================*/
.business-page {
   background-color: #CBEFEC;
}

.business-page section>.hd-area {
   position: relative;
   font-size: 24px;
   text-align: center;
   margin-bottom: 35px;
}

.business-page section>.hd-area h2 {
   position: relative;
   z-index: var(--layer-top);
   font-size: 1.0em;
   font-weight: 900;
   color: var(--main-color);
}

.business-page section>.hd-area h2.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page section>.hd-area .sub {
   position: absolute;
   z-index: var(--layer-bottom);
   transform: translate(-50%, -50%);
   top: 50%;
   left: 50%;
   min-width: 100vw;
   font-family: var(--deco-text);
   font-size: calc((180 / 24) * 1.0em);
   color: #FFF;
   text-align: center;
}

.business-page section>.hd-area .sub.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

/*tb*/
@media (max-width:1300px) {
   .business-page section>.hd-area .sub {
      font-size: 80px;
   }
}

/*sp*/
@media (max-width:767px) {
   .business-page section>.hd-area .sub {
      font-size: 100px;
   }

   .business-page section>.hd-area {
      font-size: 18px;
      margin-bottom: 35px;
   }

   .business-page section>.hd-area .sub {
      font-size: 60px;
      line-height: calc(48 / 60);
   }
}

/*======================
work
=======================*/
.business-page .work-sec {
   padding: 35px 0 120px;
}

/*common*/
.business-page .work-sec .cont-area {
   opacity: 0;
   transition: 0.5s ease-in-out;
}

.business-page .work-sec .cont-area.active {
   opacity: 1.0;
}

@media (max-width:2000px) {
   .business-page .work-sec .cont-area {
      max-width: 1920px;
   }
}


.business-page .work-sec .cont-area .cont {
   position: relative;
   padding: 68px calc((80 / 1166) * 100%) 80px;
   margin-bottom: 60px;
}

.business-page .work-sec .cont-area .cont::after {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   border-radius: 80px;
   background-color: #FFF;
}

.business-page .work-sec .cont-area .cont .hd-area {
   position: relative;
   margin-bottom: 64px;
}

.business-page .work-sec .cont-area .cont .hd-area .text-area {
   position: relative;
   z-index: var(--layer-top);
   width: calc((503 / 1006) * 100%);
   margin-left: auto;
}

.business-page .work-sec .cont-area .cont .hd-area .text-area.active {
   animation: fadeIn var(--duration) ease-in-out 0.3s forwards;
}

.business-page .work-sec .cont-area .cont .hd-area .text-area h3 {
   font-size: clamp(30px, 3.51vw, 48px);
   font-weight: 900;
   color: var(--main-color);
   line-height: calc(72 / 48);
   margin-bottom: 13px;
}

.business-page .work-sec .cont-area .cont .hd-area .text-area p {
   font-size: clamp(14px, 1.16vw, 16px);
   font-weight: 600;
   line-height: 2.0;
}

.business-page .work-sec .cont-area .cont .schedule-cont {
   position: relative;
   z-index: var(--layer-top);
   padding-top: 55px;
}

.business-page .work-sec .cont-area .cont .schedule-cont::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 1px;
   border-radius: 16px;
   background-color: #F5F4F2;
}

.business-page .work-sec .cont-area .cont .schedule-cont h3 {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   font-size: 20px;
   font-weight: 600;
   color: var(--main-color);
   margin-bottom: 47px;
}

.business-page .work-sec .cont-area .cont .schedule-cont h3.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page .work-sec .cont-area .cont .schedule-cont h3 img {
   max-width: 20px;
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont {
   display: flex;
   justify-content: center;
   align-items: start;
   gap: calc((47 / 1006) * 100%);
   margin: auto;
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:not(:last-of-type) {
   position: relative;
   padding-bottom: 40px;
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .time {
   display: flex;
   align-items: center;
   gap: 20px;
   width: calc((91 / 1006) * 100%);
   font-family: var(--deco-text);
   font-size: 20px;
   font-weight: 700;
   color: var(--main-color);
   margin-top: 2px;
}


.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .time span {
   position: relative;
   display: block;
   min-width: 20px;
   aspect-ratio: 1/1;
   background-color: var(--main-color);
   border-radius: 50%;
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:not(:last-of-type) .time span::before {
   content: "";
   position: absolute;
   top: 0;
   left: 9.5px;
   width: 2px;
   background-color: var(--main-color);
   clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
   transition: clip-path 0.5s linear 0.3s;
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:not(:last-of-type).active .time span::before {
   clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .text {
   width: calc((709 / 1006) * 100%);
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .text p {
   font-size: 16px;
   font-weight: 400;
   line-height: 2.0;
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .text .supplement {
   position: relative;
   display: flex;
   margin-top: 2px;
   margin-left: auto;
   width: calc((693 / 709) * 100%);
   padding: 13px calc((16 / 693) * 100%);
   border-radius: 16px;
   background-color: #F5F4F2;
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .text .supplement img {
   position: absolute;
   top: 0;
   left: -9px;
   width: 14px;
}

.business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .text .supplement p {
   font-size: 14px;
   font-weight: 600;
   line-height: 2.0;
}

.business-page .work-sec .cont-area .grid-cont {
   display: grid;
}

.business-page .work-sec .cont-area .grid-cont.three {
   grid-template-columns: repeat(3, 1fr);
   gap: calc((40 / 1166) * 100%);
}

.business-page .work-sec .cont-area .grid-cont.two {
   grid-template-columns: repeat(2, 1fr);
   gap: calc((40 / 1166) * 100%);
}

.business-page .work-sec .cont-area .grid-cont .grid-item span {
   position: relative;
   z-index: var(--layer-top);
   display: block;
   font-family: var(--deco-text);
   font-size: 12px;
   font-weight: 700;
   letter-spacing: 0.2em;
   color: var(--main-color);
   text-align: center;
}

.business-page .work-sec .cont-area .grid-cont .grid-item span.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page .work-sec .cont-area .grid-cont .grid-item:not(:first-of-type) span.active {
   animation: fadeIn var(--duration) var(--delay) ease-in-out forwards;
}

.business-page .work-sec .cont-area .grid-cont .grid-item .img-area {
   display: flex;
   align-items: center;
   width: 40px;
   height: 34px;
   margin: 25px auto 21px;
}

.business-page .work-sec .cont-area .grid-cont .grid-item .img-area.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page .work-sec .cont-area .grid-cont .grid-item:not(:first-of-type) .img-area.active {
   animation: fadeIn var(--duration) var(--delay) ease-in-out forwards;
}

.business-page .work-sec .cont-area .grid-cont .grid-item h3 {
   position: relative;
   z-index: var(--layer-top);
   font-size: 32px;
   font-weight: 900;
   color: var(--main-color);
   line-height: calc(48 / 32);
   text-align: center;
   margin-bottom: 21px;
}

.business-page .work-sec .cont-area .grid-cont .grid-item h3.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page .work-sec .cont-area .grid-cont .grid-item:not(:first-of-type) h3.active {
   animation: fadeIn var(--duration) var(--delay) ease-in-out forwards;
}


.business-page .work-sec .cont-area .grid-cont .grid-item p {
   position: relative;
   z-index: var(--layer-top);
   font-size: 16px;
   font-weight: 600;
   line-height: 2.0;
}

.business-page .work-sec .cont-area .grid-cont .grid-item p.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page .work-sec .cont-area .grid-cont .grid-item:not(:first-of-type) p.active {
   animation: fadeIn var(--duration) ease-in-out var(--delay) forwards;
}

/*driver*/
.business-page #driver.work-sec .cont-area .cont .hd-area img {
   position: absolute;
   z-index: 2;
   bottom: 0;
   left: calc(((593/ 1336) * -1) * 100%);
   width: calc((883 / 1006) * 100%);
   max-width: 1000px;
}

.business-page #driver.work-sec .cont-area .cont .hd-area img.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:first-of-type .time span::before {
   height: calc((80 / 20) * 100%);
}

.business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(2) .time span::before {
   height: calc((166 / 20) * 100%);
}

.business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(3) .time span::before {
   height: calc((166 / 20) * 100%);
}

.business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(4) .time span::before {
   height: calc((166 / 20) * 100%);
}

.business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(5) .time span::before {
   height: calc((166 / 20) * 100%);
}

.business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(6) .time span::before {
   height: calc((138 / 20) * 100%);
}

/*staff*/
.business-page #staff.work-sec .cont-area .cont .hd-area img {
   position: absolute;
   z-index: 2;
   bottom: 0;
   left: calc(((148/ 1336) * -1) * 100%);
   width: calc((529 / 1006) * 100%);
}

.business-page #staff.work-sec .cont-area .cont .hd-area img.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:first-of-type .time span::before {
   height: calc((80 / 20) * 100%);
}

.business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(2) .time span::before {
   height: calc((138 / 20) * 100%);
}

.business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(3) .time span::before {
   height: calc((80 / 20) * 100%);
}

.business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(4) .time span::before {
   height: calc((80 / 20) * 100%);
}

@media (max-width:1300px) {
   .business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:not(:last-of-type) {
      padding-bottom: 28px;
   }

   .business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .text p {
      font-size: 14px;
   }

   .business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .text .supplement p {
      font-size: 13px;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item h3 {
      font-size: 26px;
   }
}

@media (max-width:1299px) and (min-width:1141px) {
   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(6) .time span::before {
      height: 125px;
   }
}

/*tb*/
@media (max-width:1024px) {
   .business-page .work-sec {
      padding: 60px 0;
   }

   .business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .time {
      width: 16%;
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .text {
      width: 75%;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item h3 {
      font-size: 22px;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item p {
      font-size: 12px;
   }

   /*staff*/
   .business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(2) .time span::before {
      height: calc((138 / 20) * 100%);
   }

   .business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(3) .time span::before {
      height: calc((90 / 20) * 100%);
   }

   .business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(4) .time span::before {
      height: calc((90 / 20) * 100%);
   }
}

/*sp*/
@media (max-width:767px) {
   .business-page .work-sec .cont-area .cont {
      margin-top: -5px;
      margin-bottom: 50px;
      padding: 48px 20px 33px;
      border-radius: 32px;
   }

   .business-page .work-sec .cont-area .cont::after {
      border-radius: 32px;
   }

   .business-page .work-sec .cont-area {
      width: 90%;
   }

   .business-page .work-sec .cont-area .cont .hd-area {
      margin-bottom: 28px;
   }

   .business-page .work-sec .cont-area .cont .hd-area .text-area {
      width: 100%;
   }

   .business-page .work-sec .cont-area .cont .hd-area .text-area h3 {
      font-size: 32px;
      line-height: calc(48 / 32);
      margin-bottom: 20px;
   }

   .business-page .work-sec .cont-area .cont .hd-area .text-area p {
      font-size: 14px;
      line-height: 2.0;
   }

   .business-page .work-sec .cont-area .cont .schedule-cont {
      padding-top: 31px;
   }

   .business-page .work-sec .cont-area .cont .schedule-cont h3 {
      font-size: 16px;
      margin-bottom: 16px;
   }

   .business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont {
      display: block;
   }

   .business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:not(:last-of-type) {
      padding-bottom: 17px;
   }

   .business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .time {
      gap: 10px;
      font-size: 16px;
      margin-top: 2px;
   }

   .business-page .cont-area .cont .schedule-cont .schedule-list .list-cont .text {
      width: calc(100% - 30px) !important;
      margin-left: auto;
   }

   .business-page .work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont .text .supplement {
      margin-top: 5px;
      font-size: 12px;
      padding: 17px calc((16 / 257) * 100%);
      border-radius: 16px;
   }

   .business-page .work-sec .cont-area .grid-cont {
      grid-template-columns: repeat(1, 1fr) !important;
      gap: 30px !important;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item .img-area {
      display: flex;
      align-items: center;
      width: 40px;
      height: 34px;
      margin: 23px auto 21px;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item h3 {
      font-size: 24px;
      line-height: calc(36 / 24);
      margin-bottom: 19px;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item p {
      font-size: 14px;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item span.active {
      animation: fadeIn var(--duration) ease-in-out forwards !important;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item .img-area.active {
      animation: fadeIn var(--duration) ease-in-out forwards !important;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item h3.active {
      animation: fadeIn var(--duration) ease-in-out forwards !important;
   }

   .business-page .work-sec .cont-area .grid-cont .grid-item p.active {
      animation: fadeIn var(--duration) ease-in-out forwards !important;
   }

   /*driver*/
   .business-page #driver.work-sec .cont-area .cont .hd-area img {
      position: absolute;
      top: -16px;
      right: -12px;
      bottom: initial;
      left: initial;
      width: 240%;
      width: calc((445 / 295) * 100%);
      max-inline-size: none;
   }

   .business-page #driver.work-sec .cont-area .cont .hd-area .text-area {
      padding-top: calc(73% + 27px);
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:first-of-type .time span::before {
      height: calc((87 / 20) * 100%);
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(2) .time span::before {
      height: calc((216 / 20) * 100%);
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(3) .time span::before {
      height: calc((220 / 20) * 100%);
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(4) .time span::before {
      height: calc((245 / 20) * 100%);
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(5) .time span::before {
      height: calc((217 / 20) * 100%);
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(6) .time span::before {
      height: calc((220 / 20) * 100%);
      max-height: 180px;
   }

   /*staff*/
   .business-page #staff.work-sec {
      padding-top: 145px;
   }

   .business-page #staff.work-sec .cont-area .cont .hd-area img {
      position: relative;
      width: 100%;
      left: initial;
      margin: auto;
   }

   .business-page #staff.work-sec .cont-area .cont .hd-area .text-area {
      margin-top: 24px;
   }

   .business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(2) .time span::before {
      min-height: 200px;
   }

   .business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(3) .time span::before {
      min-height: 100px;
   }

   .business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(4) .time span::before {
      min-height: 100px;
   }
}

@media (max-width:580px) {
   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(2) .time span::before {
      min-height: 272px;
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(3) .time span::before {
      min-height: 272px;
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(4) .time span::before {
      min-height: 272px;
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(5) .time span::before {
      min-height: 272px;
   }

   .business-page #driver.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(6) .time span::before {
      max-height: initial;
   }

   .business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(2) .time span::before {
      min-height: 272px;
   }

   .business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(3) .time span::before {
      min-height: 139px;
   }

   .business-page #staff.work-sec .cont-area .cont .schedule-cont .schedule-list .list-cont:nth-of-type(4) .time span::before {
      min-height: 114px;
   }
}

/*======================
education
=======================*/
.business-page section.education {
   padding: 120px 0;
   background-color: #FFF;
}

.business-page section.education .cont-area {
   position: relative;
   max-width: 1920px;
}

.business-page section.education .hd-area {
   position: relative;
   font-size: 24px;
   margin-bottom: 74px;
}

.business-page section.education .hd-area h2 {
   position: relative;
   z-index: var(--layer-top);
   font-size: 1.0em;
   color: var(--main-color);
}

.business-page section.education .hd-area h2.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page section.education .hd-area .sub {
   position: absolute;
   z-index: var(--layer-bottom);
   transform: translate(0, -50%);
   top: 50%;
   right: 0;
   font-family: var(--deco-text);
   font-size: calc((180 / 24) * 1.0em);
   color: #F5F4F2;
   text-align: center;
}

.business-page section.education .hd-area .sub.active {
   animation: fadeIn var(--duration) ease-in-out forwards;
}

.business-page section.education .education-list {
   position: relative;
   width: calc((953 / 1166) * 100%);
}

.business-page section.education .education-list .list-cont {
   position: relative;
   display: flex;
   align-items: center;
   gap: calc((57 / 953) * 100%);
   padding: 50px calc((80 / 953) * 100%) 50px calc((56 / 953) * 100%);
   border-radius: 80px;
   background-color: #F5F4F2;
   opacity: 0;
   transition: 0.5s ease-in-out 0.4s;
}

.business-page section.education .education-list .list-cont.active {
   opacity: 1.0;
}

.business-page section.education .education-list .list-cont+.list-cont {
   margin-top: 32px;
}


.business-page section.education .education-list .list-cont .img-area {
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 160px;
   height: 100px;
}

.business-page section.education .education-list .list-cont .arrow {
   position: absolute;
   z-index: 2;
   top: 100%;
   left: 50%;
   transform: translateX(-50%);
   width: 100px;
   height: 16px;
   background-color: #F5F4F2;
   opacity: 0;
   transition: 0.5s ease-in-out;
}

.business-page section.education .education-list .list-cont.active .arrow {
   opacity: 1.0;
}

.business-page section.education .education-list .list-cont .arrow::after {
   content: "";
   position: absolute;
   z-index: 2;
   top: 100%;
   left: 50%;
   transform: translateX(-50%);
   width: 160px;
   height: 32px;
   clip-path: polygon(0 0, 100% 0, 50% 100%);
   background-color: #F5F4F2;
}

.business-page section.education .education-list .list-cont .arrow::before {
   content: "";
   position: absolute;
   z-index: 2;
   top: calc(100% + 2px);
   left: 50%;
   transform: translateX(-50%);
   width: 164px;
   height: 34px;
   clip-path: polygon(0 0, 100% 0, 50% 100%);
   background-color: #FFF;
}


.business-page section.education .education-list .list-cont .img-area img {
   position: relative;
   z-index: 2;
   height: 100%;
}

.business-page section.education .education-list .list-cont .img-area .step {
   position: absolute;
   z-index: 3;
   top: -59px;
   left: -57px;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 64px;
   aspect-ratio: 1 / 1;
   font-family: var(--deco-text);
   font-size: 24px;
   font-weight: 700;
   line-height: 1.0;
   color: #FFF;
   text-align: center;
   background-color: var(--main-color);
   border-radius: 50%;
}

.business-page section.education .education-list .list-cont .img-area .step::after {
   content: "";
   position: absolute;
   right: 5px;
   bottom: 5px;
   width: 11px;
   aspect-ratio: 1 / 1;
   background-color: var(--main-color);
}

.business-page section.education .education-list .list-cont .img-area .step span {
   display: block;
   font-size: 10px;
   font-weight: 400;
   margin-bottom: 4px;
}

.business-page section.education .education-list .list-cont .text-area {
   position: relative;
   z-index: var(--layer-top);
   width: calc((600 / 818) * 100%);
}

.business-page section.education .education-list .list-cont .text-area h3 {
   font-size: 16px;
   font-weight: 900;
   color: var(--main-color);
   margin-bottom: 12px;
}

.business-page section.education .education-list .list-cont .text-area p {
   font-size: 16px;
   font-weight: 400;
   line-height: 2.0;
}

.business-page section.education .cont-area .message {
   position: absolute;
   right: 0;
   bottom: 0;
   width: calc((266 / 1166) * 100%);
}

.business-page section.education .cont-area .message p {
   position: relative;
   z-index: var(--layer-top);
   font-size: 32px;
   font-weight: 900;
   line-height: calc(56 / 32);
   writing-mode: vertical-rl;
   margin-left: auto;
   margin-right: calc((60 / 266) * 100%);
   transition: 0.7s ease-in-out;
}

.business-page section.education .cont-area .message p.active {
   opacity: 1.0;
}

.business-page section.education .cont-area .message p span {
   color: var(--main-color);
}

.business-page section.education .cont-area .message img {
   position: relative;
   z-index: 2;
   opacity: 0;
   transition: 0.7s ease-in-out 0.2s;
}

.business-page section.education .cont-area .message p.active+img {
   opacity: 1.0;
}


/*tb*/
@media (max-width:1300px) {
   .business-page section.education .hd-area .sub {
      font-size: 80px;
   }
}

/*sp*/
@media (max-width:767px) {
   .business-page section.education {
      padding: 100px 0 64px;
   }

   .business-page section.education .hd-area .sub {
      font-size: 100px;
   }

   .business-page section.education .hd-area {
      font-size: 18px;
      text-align: center;
      margin-bottom: 35px;
   }

   .business-page section.education .hd-area .sub {
      transform: translate(-50%, -50%);
      left: 50%;
      right: initial;
      top: calc(50% - 19px);
      font-size: 60px;
      line-height: calc(48 / 60);
   }

   .business-page section.education .hd-area .sub {
      font-size: 60px;
      line-height: calc(48 / 60);
   }

   .business-page section.education .cont-area {
      width: 90%;
   }

   .business-page section.education .cont-area .message {
      position: relative;
      right: 0;
      bottom: initial;
      width: calc((233 / 355) * 100%);
      margin-left: auto;
      margin-bottom: 24px;
   }

   .business-page section.education .cont-area .message p {
      font-size: 24px;
      line-height: calc(36 / 24);
      writing-mode: initial;
      margin: auto;
      width: 100%;
   }

   .business-page section.education .cont-area .message img {
      position: absolute;
      top: -6px;
      width: calc((143 / 216) * 100%);
      max-width: 157px;
      right: calc(100% + 12px);
   }

   .business-page section.education .education-list {
      width: 100%;
   }

   .business-page section.education .education-list .list-cont {
      display: block;
      padding: 32px 20px 13px;
      border-radius: 21px;
   }

   .business-page section.education .education-list .list-cont .img-area {
      position: initial;
      margin: auto;
   }

   .business-page section.education .education-list .list-cont .img-area .step {
      top: -10px;
      left: -10px;
   }

   .business-page section.education .education-list .list-cont .text-area {
      width: 100%;
      margin-top: 23px;
   }

   .business-page section.education .education-list .list-cont .text-area h3 {
      font-size: 14px;
      margin-bottom: 12px;
      text-align: center;
      margin-bottom: 14px;
   }

   .business-page section.education .education-list .list-cont .text-area p {
      font-size: 14px;
   }
}

/*======================
guideline
=======================*/
.guideline-page {
   background-color: #FFF;
}

.guideline-page .guideline-sec {
   position: relative;
   max-width: 1920px;
   margin-top: 60px;
}

.guideline-page .guideline-sec+.guideline-sec {
   margin-top: 120px;
}

.guideline-page .guideline-sec h2 {
   position: relative;
   z-index: var(--layer-top);
   font-size: 32px;
   font-weight: 700;
   color: var(--main-color);
   margin: 0 auto 46px;
}

.guideline-page .guideline-sec h2 span {
   display: block;
   font-size: 12px;
   font-family: var(--deco-text);
   font-weight: 400;
   letter-spacing: 0.2em;
   color: #AAAAAA;
   margin-bottom: 10px;
}

.guideline-page .guideline-sec .guideline-cont {
   display: flex;
   gap: calc((100 / 1166) * 100%);
   padding: 20px 32px;
   border-radius: 12px;
   background-color: #F5F4F2;
}

.guideline-page .guideline-sec .guideline-cont+.guideline-cont {
   margin-top: 4px;
}

.guideline-page .guideline-sec .guideline-cont h3 {
   position: relative;
   z-index: var(--layer-top);
   width: 119px;
   font-size: 16px;
   font-weight: 600;
   letter-spacing: 0.06em;
   color: var(--main-color);
}

.guideline-page .guideline-sec .guideline-cont .text-area {
   position: relative;
   z-index: var(--layer-top);
   width: calc(100% - ((100 / 1166) * 100%) - 119px);
}

.guideline-page .guideline-sec .guideline-cont :is(p, li) {
   font-size: 16px;
   font-weight: 400;
   line-height: 2.0;
}

.guideline-page .guideline-sec .guideline-cont li {
   display: flex;
}

.guideline-page .guideline-sec .guideline-cont li::before {
   content: "・";
}

.guideline-page .guideline-sec .guideline-cont p .wrapper {
   display: flex;
}

/*sp*/
@media (max-width:767px) {
   .guideline-page .guideline-sec {
      width: 90%;
      margin-top: 64px;
   }

   .guideline-page .guideline-sec+.guideline-sec {
      margin-top: 64px;
   }

   .guideline-page .guideline-sec h2 {
      font-size: 24px;
      margin: 0 auto 40px;
   }

   .guideline-page .guideline-sec h2 span {
      margin-bottom: 5px;
   }

   .guideline-page .guideline-sec .guideline-cont {
      display: block;
      padding: 20px 16px;
   }

   .guideline-page .guideline-sec .guideline-cont+.guideline-cont {
      margin-top: 4px;
   }

   .guideline-page .guideline-sec .guideline-cont h3 {
      width: 100%;
      font-size: 14px;
      margin-bottom: 7px;
   }

   .guideline-page .guideline-sec .guideline-cont .text-area {
      width: 100%;
   }

   .guideline-page .guideline-sec .guideline-cont :is(p, li) {
      font-size: 14px;
   }
}

/*======================
*
ERNTRY / CONTACT
*
=======================*/
.form-page {
   background-color: #FFF;
}

.form-page .form-sec {
   position: relative;
   width: calc((878 / 1366) * 100%);
   max-width: 1920px;
   margin: 70px auto 0;
   padding: 80px calc((80 / 878) * 100%);
   border-radius: 80px;
   background-color: #F5F4F2;
}

.form-page .form-sec .row+.row {
   margin-top: 32px;
}

.form-page .form-sec form {
   position: relative;
   z-index: var(--layer-top);
}

.form-page .form-sec .row>label {
   display: flex;
   align-items: center;
   gap: 8px;
   font-size: 16px;
   font-weight: 900;
   margin-bottom: 12px;
}

.form-page .form-sec .row label span.required {
   font-size: 12px;
   font-weight: 900;
   line-height: 1.0;
   color: var(--main-color);
   padding: 3px 6px;
   border: solid 1px var(--main-color);
   border-radius: 50px;
}

.form-page .form-sec .row label+ :is(input, textarea):not([name="resume"]) {

   width: 100%;
   height: 60px;
   font-size: 16px;
   line-height: 2.0;
   padding: 0.25em 0.5em;
   border: solid 1px #E5E3E0;
   border-radius: 8px;
   background-color: #FFF;
}

.form-page .form-sec .row label+textarea {
   min-height: 200px;
   resize: none;
   overflow: auto;
}

.form-page .form-sec .row label+textarea::-webkit-scrollbar {
   width: 5px;
}

.form-page .form-sec .row label+textarea::-webkit-scrollbar-track {
   background-color: transparent;
}

.form-page .form-sec .row label+textarea::-webkit-scrollbar-thumb {
   background-color: #b0b2b9;
   border-radius: 8px;
}

.form-page .form-sec .row label+[name="resume"] {
   position: absolute;
   opacity: 0;
   pointer-events: none;
}

/*ファイル選択用ボタン*/
.form-page .form-sec .row label~span.label-wrapper {
   display: flex;
   align-items: center;
   gap: 12px;
}

.form-page .form-sec .row label~span.label-wrapper label {
   display: flex;
   justify-content: space-around;
   align-items: center;
   width: fit-content;
   font-size: 16px;
   font-weight: 900;
   color: var(--main-color);
   padding: 14px 44px;
   border-radius: 30px;
   border: solid 2px var(--main-color);
}

.form-page .form-sec .row label~span.label-wrapper>span {
   font-size: 12px;
   font-weight: 400;
}

/*プライバシーポリシー*/
.form-page .form-sec .privacy-text {
   width: 100%;
   height: 184px;
   font-size: 16px;
   line-height: 2.0;
   padding: 20px 23px;
   overflow: auto;
   margin-top: 48px;
   border: solid 1px #E5E3E0;
   border-radius: 8px;
   background-color: #FFF;
}

.form-page .form-sec .privacy-text::-webkit-scrollbar {
   width: 5px;
}

.form-page .form-sec .privacy-text::-webkit-scrollbar-track {
   background-color: transparent;
}

.form-page .form-sec .privacy-text::-webkit-scrollbar-thumb {
   background-color: #b0b2b9;
   border-radius: 8px;
}

/*チェックボックスの見た目*/
.form-page .form-sec .checkbox {
   margin: 16px 0 0;
}

.form-page .form-sec .checkbox input.cb-input {
   position: absolute;
   opacity: 0;
   pointer-events: none;
}

.form-page .form-sec .row>label.cb-label {
   justify-content: center;
   margin: 0;
}

.form-page .form-sec .checkbox .cb-box {
   position: relative;
   width: 40px;
   height: 40px;
   border: 1px solid #E5E3E0;
   border-radius: 8px;
   background: #fff;
}

.form-page .form-sec .checkbox .cb-input:checked+.cb-label .cb-box::after {
   content: "";
   position: absolute;
   top: calc(50% - 4px);
   left: 50%;
   transform: translate(-50%, -50%) rotate(45deg);
   width: 12px;
   height: 19px;
   border-style: solid;
   border-color: var(--main-color);
   border-width: 0 3px 3px 0;
}

.form-page .form-sec .actions {
   margin-top: 75px;
}

.form-page .form-sec .actions .btn {
   justify-content: center;
   width: fit-content;
   font-size: 16px;
   font-weight: 600;
   color: #FFF;
   margin: auto;
   padding: 26.5px 84px;
   background-color: var(--main-color);
   border: solid var(--main-color) 2px;
   border-radius: 80px;
}

@media (any-hover:hover) {
   .form-page .form-sec .actions .btn:hover {
      color: var(--main-color);
      background-color: #FFF;
   }
}

/*tb*/
@media (max-width:1024px) {
   .form-page .form-sec {
      width: 90%;
   }
}

/*sp*/
@media (max-width:767px) {
   .form-page .form-sec {
      margin: 64px auto 0;
      padding: 40px 20px;
      border-radius: 32px;
   }

   .form-page .form-sec .row label+ :is(input, textarea):not([name="resume"]) {
      height: 48px;
   }

   .form-page .form-sec .row+.row {
      margin-top: 25px;
   }

   .form-page .form-sec .row>label {
      gap: 8px;
      font-size: 14px;
      margin-bottom: 8px;
   }

   .form-page .form-sec .row label~span.label-wrapper {
      flex-direction: column;
      gap: 9px;
   }

   .form-page .form-sec .row label~span.label-wrapper label {
      width: 100%;
      font-size: 14px;
      padding: 14px 0;
   }

   .form-page .form-sec .privacy-text {
      height: 208px;
      font-size: 14px;
      padding: 13px 16px;
      margin-top: 28px;
   }

   .form-page .form-sec .checkbox {
      margin: 15px 0 0;
   }

   .form-page .form-sec .row>label.cb-label {
      justify-content: initial;
   }

   .form-page .form-sec .checkbox .cb-box {
      min-width: 40px;
   }

   .form-page .form-sec .actions {
      margin-top: 30px;
   }

   .form-page .form-sec .actions .btn {
      width: 100%;
      font-size: 14px;
      padding: 27.5px 0;
   }
}

/*サンクスページ*/
.form-sec.thanks {
   padding: 48px calc((80 / 878) * 100%) 80px;
   background-color: var(--main-color);
}

.form-sec.thanks img {
   max-width: 224px;
   margin: auto;
}

.form-sec.thanks h2 {
   font-size: 26px;
   font-weight: 900;
   color: #FFF;
   text-align: center;
   margin: 11px auto 23px;
}

.form-sec.thanks p {
   font-size: 16px;
   font-weight: 400;
   color: #FFF;
   letter-spacing: 0.06em;
   line-height: 2.0;
   text-align: center;
}

.form-sec.thanks a.btn {
   width: 100%;
   max-width: 360px;
   height: 80px;
   font-size: 16px;
   font-weight: 600;
   color: var(--main-color);
   margin: 42px auto 0;
   border-radius: 80px;
   background-color: #FFF;
   border: solid #FFF 2px;
   transition: 0.3s ease-in-out;
}

@media (any-hover:hover) {
   .form-sec.thanks a.btn:hover {
      color: #FFF;
      background-color: var(--main-color);
   }
}

/*sp*/
@media (max-width:767px) {
   .form-page .form-sec {
      margin: 64px auto 0;
      padding: 40px 20px;
      border-radius: 32px;
   }

   .form-sec.thanks img {
      max-width: 224px;
   }

   .form-sec.thanks h2 {
      font-size: 20px;
      line-height: calc(30 / 20);
      margin: 33px auto 20px;
   }

   .form-sec.thanks a.btn {
      height: 80px;
      margin: 30px auto 0;
   }
}

/*error*/
main.error {
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
}

main.error .error-sec h1 {
   font-size: 25px;
   margin-bottom: 30px;
}

main.error .error-sec .btn.error {
   display: flex;
   justify-content: center;
   width: fit-content;
   font-size: 16px;
   font-weight: 600;
   color: #FFF;
   margin: 20px auto 0;
   padding: 26.5px 84px;
   background-color: var(--main-color);
   border: solid var(--main-color) 2px;
   border-radius: 80px;
   transition: 0.3s ease-in-out;
}

@media (any-hover:hover) {
   main.error .error-sec .btn.error:hover {
      color: var(--main-color);
      background-color: #FFF;
   }
}

/*sp*/
@media (max-width:767px) {
   main.error .error-sec .btn.error {
      width: 100%;
      font-size: 14px;
      padding: 27.5px 0px;
   }
}

/*======================
404
=======================*/
:is(.page-404, .page-403, .page-500) {
   display: flex;
   align-items: center;
   justify-content: center;
}

:is(.page-404, .page-403, .page-500) .wrapper {
   position: relative;
   z-index: var(--layer-top);
   width: calc((878 / 1366) * 100%);
   max-width: 1920px;
   margin: 70px auto 0;
   padding: 80px calc((80 / 878) * 100%);
   border-radius: 80px;
   padding: 48px calc((80 / 878) * 100%) 80px;
   background-color: var(--main-color);
}

:is(.page-404, .page-403, .page-500) p {
   font-size: 16px;
   font-weight: 400;
   color: #FFF;
   letter-spacing: 0.06em;
   line-height: 2.0;
   text-align: center;
}

p.flex {
   display: flex;
   justify-content: center;
   flex-direction: column;
   font-size: 50px;
   font-weight: bold;
   line-height: 1.0;
   margin-bottom: 36px;
}

/*tb*/
@media (max-width:767px) {
   :is(.page-404, .page-403, .page-500) .wrapper {
      width: 90%;
   }
}

/*sp*/
@media (max-width:767px) {
   :is(.page-404, .page-403, .page-500) .wrapper {
      margin: 64px auto 0;
      padding: 40px 20px;
      border-radius: 32px;
   }

   p.flex {
      font-size: 33px;
   }
}

/*======================
*
footer
*
=======================*/
footer {
   position: relative;
   background-color: transparent;
}

.front-page+footer {
   background-color: var(--bg-color);
}

:is(.environment-page, .interview-page, .business-page, .guideline-page, .form-page)+footer {
   padding-top: 120px;
}

/*sp*/
@media (max-width:767px) {
   :is(.environment-page, .interview-page, .business-page, .guideline-page)+footer {
      padding-bottom: 80px;
   }
}


footer:not(.front-page + footer) {
   background: #FFF;
}

footer .footer-cont {
   position: relative;
   z-index: var(--layer-top);
   display: flex;
   justify-content: space-between;
   align-items: stretch;
   width: calc((1286 / 1366) * 100%);
   max-width: 1286px;
   margin: auto;
   padding: 80px 0;
   border-radius: 80px;
   background-color: #F5F4F2;
}

footer .footer-cont.active {
   animation: fadeIn var(--duration, 0.5s) ease-in-out forwards var(--delay, 0s);
}

footer .footer-cont .cont {
   position: relative;
   z-index: var(--layer-top);
   width: calc(100% / 3);
   padding: 10px;
}

footer .footer-cont .cont.logo-area a img {
   max-width: 193px;
   margin: auto;
}

footer .footer-cont .cont.logo-area p.address {
   font-size: 12px;
   font-weight: 400;
   color: var(--text-color);
   text-align: center;
   margin-top: 27px;
}

footer .footer-cont .cont.contact-area {
   display: flex;
   justify-content: center;
   align-items: center;
   border-left: solid 1px#B3CED8;
   border-right: solid 1px#B3CED8;
}

footer .footer-cont .cont.contact-area .tel {
   display: flex;
   align-items: center;
   gap: 8px;
   font-family: var(--deco-text);
   font-size: 32px;
   font-weight: 600;
   color: var(--text-color);
}

footer .footer-cont .cont.contact-area .tel img {
   max-width: 20px;
}

footer .footer-cont .cont.contact-area p {
   width: fit-content;
   font-size: 12px;
   font-weight: 400;
   color: var(--text-color);
   margin: 9px auto 31px;
}

footer .footer-cont .cont.contact-area .f_contactBtn {
   min-width: 200px;
   min-height: 56px;
   font-size: 15px;
   font-weight: 600;
   color: #FFF;
   margin: auto;
   border: solid 1px var(--main-color);
   background-color: var(--main-color);
   border-radius: 50px;
}

@media (any-hover:hover) {
   footer .footer-cont .cont.contact-area .f_contactBtn:hover {
      color: var(--main-color);
      background-color: #FFF;
   }
}

/*======================
footerメニュー
=======================*/
footer .footer-cont nav.cont {
   display: flex;
   justify-content: center;
   align-items: center;
}

/*レイアウト*/
footer .footer-cont nav.cont>ul {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   grid-template-rows: auto;
   column-gap: 24px;
}

footer .footer-cont nav.cont>ul>li,
footer .footer-cont nav.cont>ul>li>ul {
   display: contents;
}

footer .footer-cont nav.cont>ul>li>a {
   padding-bottom: 16px;
   border-bottom: solid 1px #B3CED8;
}

footer .footer-cont nav.cont>ul>li:nth-of-type(2)>a {
   grid-row: span 5;
   height: fit-content;
   margin-top: 30px;
}

footer .footer-cont nav.cont>ul>li:nth-of-type(1)>a,
footer .footer-cont nav.cont>ul>li:nth-of-type(2)>a {
   grid-column: 1;
}

footer .footer-cont nav.cont>ul>li:nth-of-type(3)>a {
   grid-column: 2;
   grid-row: 1;
}

/*共通*/
footer .footer-cont nav.cont ul li a {
   display: block;
   color: var(--text-color);
   transition: 0.3s ease-in-out;
}

@media (any-hover:hover) {
   footer .footer-cont nav.cont ul li a:hover {
      opacity: 0.75;
   }
}

/*大項目*/
footer .footer-cont nav.cont>ul>li>a {
   font-size: 15px;
   font-weight: 600;
}

/*小項目*/
footer .footer-cont nav.cont>ul>li>ul>li {
   grid-column: 2;
}

footer .footer-cont nav.cont>ul>li>ul>li:first-of-type a {
   margin-top: 13px;
}

footer .footer-cont nav.cont>ul>li>ul>li {
   font-size: 13px;
   font-weight: 400;
   line-height: 2.0;
}

footer .copyright p {
   position: relative;
   z-index: var(--layer-top);
   font-family: var(--deco-text);
   font-size: 11px;
   font-weight: 400;
   color: var(--text-color);
   padding: 45px 0;
   text-align: center;
}

/*tb*/
@media (max-width:1024px) {
   footer .footer-cont {
      padding: 45px 0;
      border-radius: 45px;
   }

   footer .footer-cont .cont.logo-area p.address {
      font-size: 10px;
      margin-top: 25px;
   }

   footer .footer-cont .cont.contact-area .tel {
      font-size: 22px;
   }

   footer .footer-cont .cont.contact-area p {
      font-size: 11px;
   }

   footer .footer-cont .cont.contact-area .f_contactBtn {
      min-width: 180px;
      min-height: 48px;
   }

   footer .footer-cont nav.cont>ul>li>a {
      font-size: 13px;
   }

   footer .footer-cont nav.cont>ul>li>ul>li a {
      font-size: 10px;
   }
}

/*sp*/
@media (max-width:767px) {
   footer .footer-cont {
      display: flex;
      flex-direction: column;
      width: calc(100% - 16px);
      padding: 32px 20px;
      border-radius: 32px;
   }

   footer .footer-cont .cont {
      width: 100%;
      padding: 0;
   }

   footer .footer-cont .cont.logo-area a img {
      max-width: 150px;
   }

   footer .footer-cont .cont.logo-area p.address {
      font-size: 12px;
      margin-top: 18px;
      margin-bottom: 30px;
   }

   footer .footer-cont .cont.contact-area {
      padding: 33px 0 32px;
      border: 0;
      border-top: solid 1px#B3CED8;
      border-bottom: solid 1px#B3CED8;
   }

   footer .footer-cont .cont.contact-area p {
      font-size: 12px;
      margin: 8px auto 23px;
   }

   footer .footer-cont .cont.contact-area .tel {
      font-size: 24px;
   }

   footer .footer-cont .cont.contact-area .f_contactBtn {
      min-width: 200px;
      min-height: 56px;
      font-size: 14px;
   }

   footer .footer-cont nav.cont {
      padding-top: 33px;
   }

   footer .footer-cont nav.cont>ul {
      column-gap: 21px;
      width: 100%;
   }

   footer .footer-cont nav.cont>ul>li>a {
      font-size: 14px;
   }

   footer .footer-cont nav.cont>ul>li>ul>li a {
      font-size: 13px;
   }

   footer .copyright p {
      padding: 49px 0;
   }
}