@charset "UTF-8";
/* 下層ヘッダー */
.low-header{
    margin-top: 64px;
    display: flex;
    align-items: center;
    padding-left: max(20px, calc((100% - 1200px) / 2));;
    height: 300px;
    background: #1a1a1a;
    overflow: hidden;
}
.low-header .low-header-ttl .en{
    display: block;
    font-size: 6rem;
}
.low-header .low-header-ttl .ttl-ja {
    font-size: 1.6rem;
    color: #fff;
}
.l-header-logo{
    width: 700px;
    right: -10%;
    top: 50%;
    transform: translateY(-50%);
    opacity: .05;
}

body.recruit .logo{
  width: 300px;
}


/* パンくず */
.breadcrumb {
    padding-top: 40px;
    font-size: 1.4rem;
    padding-bottom: 100px;
  }
  
  .breadcrumb ol {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4em;
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .breadcrumb li {
    display: flex;
    align-items: center;
  }
  
  .breadcrumb li + li::before {
    content: ">";
    margin: 0 0.4em;
    color: #999;
  }
  
  .breadcrumb a {
    color: #fff;
    text-decoration: none;
    transition: .3s;
  }
  
  .breadcrumb a:hover {
    color: #d7bc75;
  }
  
  .breadcrumb [aria-current="page"] {
    color: #aaa;
  }



  /* お知らせ ------------------------------------------------------------------------------*/
  .low-page #news .list{
    margin-bottom: 50px;
  }
  .d-news-ttl{
    position: relative;
    margin-bottom: 20px;
    border-bottom: solid 1px #898989;
    padding-bottom: 10px;
  }
  .d-news-ttl::after{
    content: "";
    width: 75px;
    height: 1px;
    background: #d7bc75;
    position: absolute;
    bottom: -1px;
    left: 0;
  }
  .d-news-ttl .day{
    font-size: 1.4rem;
    color: #fff;
    display: block;
    margin-bottom: 5px;
  }
  .d-news-ttl h2{
    font-size: 3rem;
    color: #fff;
  }

  .l-news .content{
    margin-bottom: 80px;
  }
  .btn.back{
    left: 50%;
    transform: translateX(-50%);
  }
  .btn.back::after{
    right:inherit;
    left: 20px;
    transform: translateY(-50%) rotate(-180deg);
  }

  .low-page #case_studies .flex li{
    width: 32%;
  }
  .low-page #case_studies{
    overflow: hidden;
    background: transparent;
  }
  .low-page #case_studies .flex .img {
    width: 100%;
    margin-bottom: 10px;
  }
  .low-page #case_studies h3{
    position: relative;
    font-size: 1.8rem;
  }

  .low-page .flex{
    justify-content: space-between;
  }
  .low-page #news .flex{
    justify-content: flex-start;
  }
  .low-page .ttl.flex{
    justify-content: start;
    align-items: end;
  }
  .low-page .ttl.flex .ttl-ja{
    margin-left: 20px;
  }
  .low-page .flex .txt{
    width: 50%;
  }
  .low-page .flex .img{
    width: 45%;
  }


  .low-page #case_studies .gallery {
    display: flex;
    gap: 16px;
}

.low-page #case_studies .gallery.third .gallery-left {
  position: relative;
    flex: 1.8;
    aspect-ratio: 4 / 3;
    opacity: 0;
}
.low-page #case_studies .gallery.second .gallery-left {
  position: relative;
    flex: 1.8;
    aspect-ratio: 1 / 1;
    opacity: 0;
}
.low-page #case_studies .gallery-left.is-active::after{
  content: "";
  position: absolute;
  inset: 0;
  background: #000;
  z-index: 2;

  animation: bandIn 1s cubic-bezier(.19,1,.22,1) forwards;
}

.low-page #case_studies .gallery.third .gallery-right {
  position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
    z-index: 2;
    opacity: 0;
}
.low-page #case_studies .gallery.second .gallery-right {
  position: relative;
    flex: 1.8;
    aspect-ratio: 1 / 1;
    opacity: 0;
}
.low-page #case_studies .gallery-right.is-active::after{
  content: "";
  position: absolute;
  inset: 0;
  background: #000;
  z-index: 2;

  animation: bandIn 1s cubic-bezier(.19,1,.22,1) forwards;
}
.low-page #case_studies .gallery-left.is-active{
  animation: itemFadeIn .3s ease forwards;
    animation-delay: .5s;
}
.low-page #case_studies .gallery-right.is-active{
  animation: itemFadeIn .3s ease forwards;
    animation-delay: .5s;
}

.low-page #case_studies .gallery-left img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.low-page #case_studies .gallery-right img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    flex: 1; 
    min-height: 0;
}
.low-page #case_studies.single-case h2{
  position: relative;
  font-size: 3rem;
  border-bottom: solid 1px #898989;
  margin-bottom: 20px;
  color: #fff;
  padding-bottom: 10px;
}
.low-page #case_studies.single-case h2::after{
  content: "";
  width: 75px;
  height: 1px;
  background: #d7bc75;
  position: absolute;
  bottom: -1px;
  left: 0;
}
.low-page #case_studies.single-case .btn{
  margin-top: 50px;
  margin-bottom: 80px;
}


.low-page #case_studies.single-case .gallery{
margin-bottom: 30px;
}
.low-page #case_studies.single-case .coment{
  padding: 20px;
  background: #FCF6EE;
}
.low-page #case_studies.single-case .coment h3{
  font-size: 2.5rem;
  padding-left: 10px;
  border-left: 3px solid #b48f44;
  border-bottom: none;
  padding-bottom: 0;
  color: #000;
}
.low-page #case_studies.single-case .coment h3::after{
  content: none;
}
.low-page #case_studies.single-case .coment p{
  color: #000;
}

.low-page #case_studies .gallery.single {
  display: block;
}

.low-page #case_studies .gallery.single .gallery-left {
  position: relative;
  width: 45%;
  margin: 0 auto;
  opacity: 0;
}

.low-page #case_studies .gallery.single .gallery-right {
  display: none;
}

.low-page #case_studies .gallery.single .gallery-left img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

  /* our_company-------------------------------------------------------------------------------- */
  /* 社長挨拶 */
  .low-page #greeting .flex .txt p{
    margin-bottom: 20px;
  }
  .low-page #greeting .flex .txt p:last-of-type{
    margin-bottom: 0;
  }

    /*私たちの強み */
    .low-page #our_strengths{
      padding-left: 0;
      padding-right: 0;
    }
  .low-page #our_strengths .flex{
    align-items: center;
    margin-bottom: 50px;
  }
  .low-page #our_strengths .flex:last-of-type{
    margin-bottom: 0px;
  }

  .low-page #our_strengths .flex h3{
    position: relative;
    font-size: 2.5rem;
    margin-bottom: 10px;
    border-bottom: solid 1px #898989;
    padding-bottom: 10px;
    color: #fff;
  }
  .low-page #our_strengths .flex h3::after{
    content: "";
    width: 75px;
    height: 1px;
    background: #d7bc75;
    position: absolute;
    bottom: -1px;
    left: 0;
  }

  /* 各行（Flexコンテナ） */
  .company-profile .flex{
    margin-bottom: 20px;
    opacity: 0;
  }

  /* 左側：項目名 */
  .company-profile dt {
    width: 150px;
    flex-shrink: 0;
    margin: 0;
    padding: 10px 0;
    font-weight: bold;
    letter-spacing: 0.1em; 
    border-bottom: 1px solid #d7bc75;
    color: #fff;
    font-size: 1.6rem;
  }

  /* 右側：内容 */
  .company-profile dd {
    flex-grow: 1;
    margin: 0;
    padding: 10px 0 10px 30px;
    border-bottom: 1px solid #ececec; /* 薄いグレーの下線 */
    letter-spacing: 0.02em;
    color: #fff;
    font-size: 1.6rem;
  }
  .company-profile .tel dd a{
    color: #fff;
    pointer-events: none;
  }

  .low-page #greeting .txt-end{
    text-align: end;
  }

  /* our_business-------------------------------------------------------------------------------- */
  .business-list {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .business-list li {
    margin-bottom: 6px;
  }

  .business-list li:last-child {
    margin-bottom: 0;
  }

  .low-page #our_business .flex{
    align-items: center;
  }

  .low-page #our_business .mask-ttl{
    margin-bottom: 20px;
  }

  .low-page #our_business .flex.intro h3{
    font-size: 3rem;
    color: #fff;
  }


  /* business-------------------------------------------------------------------------------- */
  .low-page #business .link-btn .flex{
    justify-content: space-between;
  }

  .low-page #business .link-btn li{
    position: relative;
    width: 24.5%;
    height: 50px;
}
.low-page #business .link-btn li::after{
    content: "";
    width: 14px;
    height: 14px;
    background-image: url(../images/arrow-gold.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%) rotate(90deg);
    transition: .3s;
    z-index: 1;
}
.low-page #business .link-btn li a{
    width: 100%;
    height: 100%;
    font-size: 1.3rem;
    color: #DBBE6A;
    display: flex;
    justify-content: center;
    align-items: center;
    border: solid 1px #DBBE6A;
    background: #1a1a1a;
    position: relative;
    overflow: hidden;
    transition: color .4s ease;
    z-index: 1;
    text-align: center;
}

/* ゴールド背景 */
.low-page #business .link-btn li a::before{
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        #f0dca0 0%,
        #d7bc75 18%,
        #b48f44 45%,
        #8a6828 75%,
        #6a4d1c 100%
    );
    opacity: 0;
    transition: opacity .4s ease;
    z-index: -2;
}

.low-page #business .link-btn li a::after{
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 60%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.5),
        transparent
    );
    transform: skewX(-25deg);
    transition: left .7s ease;
    z-index: -1;
}

/* Hover */
.low-page #business .link-btn li a:hover{
    color: #fff;
    border-color: #DBBE6A;
}

.low-page #business .business-item{
  padding-top: 80px;
}
.low-page #business .business-item h3{
  position: relative;
  font-size: 2.5rem;
  margin-bottom: 20px;
  padding-bottom: 10px;
  color: #fff;
  border-bottom: solid 1px #898989;
}
.low-page #business .business-item h3::after{
  content: "";
  width: 75px;
  height: 1px;
  background: #d7bc75;
  position: absolute;
  bottom: -1px;
  left: 0;
}

.low-page #business .business-item .flex{
  align-items: center;
}
.low-page #business .business-item .flex p{
  margin-bottom: 20px;
}
.low-page #business .business-item .flex p:last-of-type{
  margin-bottom: 0;
}

/* service_flow-------------------------------------------------------------------------------- */
.low-page #service_flow .flex{
  align-items: center;
  margin-bottom: 50px;
}
.low-page #service_flow .flex:last-of-type{
  margin-bottom: 0;
}
.low-page #service_flow .num{
  display: block;
  font-size: 3rem;
  color: #DBBE6A;
  font-weight: 300;
  margin-bottom: 10px;
}
.low-page #service_flow .num small{
  font-size: 2rem;
}
.low-page #service_flow h3{
  font-size: 2.5rem;
  margin-bottom: 20px;
  color: #fff;
}
.low-page #service_flow .flex .mb{
  margin-bottom: 50px;
}

/* contact---------------------------------------------------- */
.inquiry-step {
  display: flex;
  gap: 40px;
  align-items: flex-start;
  flex-wrap: wrap;
}

/* 左ステップ */
.step-nav {
  width: 80px;
}

.inquiry-flex {
  margin: 0;
  padding: 0;
  list-style: none;
}

.inquiry-flex li {
  position: relative;
  padding-bottom: 25px;
  color: #bdbdbd;
  font-size: 12px;
}

.inquiry-flex li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 40%;
  top: 27px;
  width: 1px;
  height: 20px;
  transform: translateX(-50%);
  background: #ddd;
}


.inquiry-flex p {
  margin: 0;
  color: #aaa;
}
.inquiry-flex li.active p {
  color: #DBBE6A;
}

.inquiry-flex span {
  display: inline-block;
  width: 24px;
}

#inquiry .inquiry-form{
  flex: 1;
}
#inquiry .inquiry-form dl {
  margin: 0;
}

#inquiry .inquiry-form dt {
  margin-bottom: 8px;
  font-size: 1.4rem;
  color: #fff;
}

#inquiry .inquiry-form dd {
  margin-bottom: 30px;
}

#inquiry .required {
  position: relative;
  top: -1px;
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  background: #DBBE6A;
  color: #000;
  font-size: 10px;
  font-weight: 400;
  line-height: 1;
}

#inquiry .inquiry-form input,
#inquiry .inquiry-form select,
#inquiry .inquiry-form textarea {
  width: 100%;
  border: none;
  padding: 8px 12px;
  font-size: 14px;
  font-family: inherit;
  background: #ececec;
}


#inquiry .inquiry-form textarea {
  min-height: 140px;
  resize: vertical;
}

#inquiry .privacy-check {
  margin-top: 40px;
  text-align: center;
  font-size: 1.4rem;
  margin-bottom: 20px;
}
#inquiry .privacy-check label{
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}

#inquiry .privacy-check input{
  width: 15px;
}
#inquiry .privacy-check input {
  margin-right: 6px;
}

#inquiry .btn-area{
  justify-content: center;
}

.inquiry-form p{
  margin-bottom: 20px;
}
.inquiry-form p:nth-of-type(8){
  display: flex;
  justify-content: center;
}
.inquiry-form p:nth-of-type(8) .wpcf7-list-item{
  margin-left: 0;
}
.inquiry-form p .index{
  display: block;
  font-size: 1.4rem;
  margin-bottom: 5px;
}
.inquiry-form p .index .Required{
  position: relative;
  top: -1px;
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  background: #DBBE6A;
  color: #000;
  font-size: 10px;
  font-weight: 400;
  line-height: 1;
}
.inquiry-form p:last-of-type{
  margin-bottom: 0;
}
.wpcf7-list-item label{
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.wpcf7-list-item label input{
  width: auto!important;
  margin-right: 10px;
  cursor: pointer;
}
.date-pp-txt{
  text-align: center;
  margin-bottom: 50px!important;
}
.date-pp-txt a{
  color: #b48f44;
}
.wpcf7-not-valid-tip{
  color: #b48f44;
}
#inquiry .btn{
width: 100%!important;
height: auto!important;
display: flex;
    justify-content: center;
    cursor: pointer;
}
#inquiry .btn::after{
  content: none;
}
#inquiry .btn > div{
  position: relative;
  width: 300px;
  height: 50px;
  display: flex;
justify-content: center;
}
#inquiry .btn > div::after{
  content: "";
  width: 10px;
  height: 10px;
  background-image: url(../images/arrow-gold.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  transition: .3s;
  z-index: 1;
}
#inquiry .btn p{
  width: 100%;
}
#inquiry .btn button{
  width: 100%;
    height: 100%;
    font-size: 1.4rem;
    color: #DBBE6A;
    display: flex!important;
    justify-content: center;
    align-items: center;
    border: solid 1px #DBBE6A;
    background: #1a1a1a;
    position: relative;
    overflow: hidden;
    transition: color .4s ease;
    z-index: 1;
    cursor: pointer;
}
#inquiry .btn button::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #f0dca0 0%, #d7bc75 18%, #b48f44 45%, #8a6828 75%, #6a4d1c 100%);
  opacity: 0;
  transition: opacity .4s ease;
  z-index: -2;
}
#inquiry .btn button::after{
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .5), transparent);
  transform: skewX(-25deg);
  transition: left .7s ease;
  z-index: -1;
}
#inquiry .btn button br{
  display: none;
}
#inquiry #wpcf7-f36-o1 .index{
  font-size: 1.2rem;
  color: #aaa;
}
#inquiry #wpcf7-f36-o1 .inquiry.confirm{
  margin-top: 50px;
}
#inquiry #wpcf7-f36-o1 .inquiry.confirm .submit-wrap{
  margin: 0 10px;
}
#inquiry #wpcf7-f36-o1 .inquiry.confirm .submit-wrap{
  margin: 0 10px;
}
#inquiry .thanks-area h2{
  position: relative;
  font-size: 2.5rem;
  margin-bottom: 20px;
  padding-bottom: 10px;
  color: #fff;
  border-bottom: solid 1px #898989;
}
#inquiry .thanks-area h2::after{
  content: "";
  width: 75px;
  height: 1px;
  background: #d7bc75;
  position: absolute;
  bottom: -1px;
  left: 0;
}
#inquiry .c-area{
  flex: 1;
}


/* 採用ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
body.recruit{
  background-image: url(../images/recruit_bg.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 100svh;
  background-attachment: fixed;
}
body.recruit section{
  background: inherit;
  overflow: hidden;
}

body.recruit #cta{
  display: none;
}



  /* message --------------------------------------------------------------- */
  body.recruit #message h3{
    width: 30%;
    font-size: 3rem;
    color: #fff;
  }
  body.recruit #message .txt-area{
    width: 68%;
  }
  body.recruit #message .txt-area p{
    margin-bottom: 20px;
  }

  /* 各行（Flexコンテナ） */
  #recruitment {padding-bottom: 150px;}
  body.recruit .recruitment-profile{
    margin-bottom: 50px;
  }
  body.recruit .recruitment-profile .flex{
    margin-bottom: 20px;
    opacity: 0;
  }

  /* 左側：項目名 */
  body.recruit .recruitment-profile dt {
    flex: 0 0 150px;
    flex-shrink: 0;
    margin: 0;
    padding: 10px 0;
    font-weight: bold;
    letter-spacing: 0.1em; 
    border-bottom: 1px solid #d7bc75;
    color: #fff;
    font-size: 1.6rem;
  }

  /* 右側：内容 */
  body.recruit .recruitment-profile dd {
    flex: 1;
    margin: 0;
    padding: 10px 0 10px 30px;
    border-bottom: 1px solid #ececec; /* 薄いグレーの下線 */
    letter-spacing: 0.02em;
    color: #fff;
    font-size: 1.6rem;
  }

  body.recruit .recruitment-profile dd {
    flex-grow: 1;
    margin: 0;
    padding: 10px 0 10px 30px;
    border-bottom: 1px solid #ececec; /* 薄いグレーの下線 */
    letter-spacing: 0.02em;
    color: #fff;
    font-size: 1.6rem;
  }

  .recuruit-item.mb{
    margin-bottom: 150px;
  }

  body.recruit .recuruit-item h3{
    position: relative;
    font-size: 2.5rem;
    padding-left: 30px;
    color: #fff;
    margin: 30px 0 20px 0;
  }

  body.recruit .recuruit-item h3::before{
    content: "";
    width: 20px;
    height: 20px;
    background-image: url(../images/arrow-gold.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
  }

  body.recruit .btn-area{
    justify-content: center;
  }
  body.recruit .btn-area .btn{
    margin: 0 10px;
  }

  body.recruit #greeting .flex .img{
    width: 35%;
  }
  body.recruit #greeting .flex .txt{
    width: 60%;
  }
  body.recruit #greeting .flex .txt .name{
    text-align: end;
    font-size: 2.2rem;
  }
  body.recruit #greeting .flex .txt .name span{
    font-size: 1.2rem;
    display: block;
  }

  /* job --------------------------------------------------------------- */
  body.recruit #job .flex .item{
    width: 49%;
  }
  body.recruit #job .flex .item .txt-area h3{
    position: relative;
    font-size: 2.5rem;
    margin-bottom: 8px;
    padding-bottom: 10px;
    border-bottom: solid #898989 1px;
    color: #fff;
  }
  body.recruit #job .flex .item .txt-area h3::after{
    content: "";
    width: 75px;
    height: 1px;
    background: #d7bc75;
    position: absolute;
    bottom: -1px;
    left: 0;
  }
  body.recruit #job .flex .item .txt-area p{
    margin-bottom: 20px;
    font-size: 1.4rem;
  }
  body.recruit #job .flex .item .thum{
    margin-bottom: 10px;
  }
  body.recruit #job .flex .item .thum img{
    aspect-ratio: 2 / 1;
    object-fit: cover;
  }
  body.recruit #job .flex .item .txt-area .btn{
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }

  body.recruit #point .item{
    width: 32%;
  }
  body.recruit #point .item .thum{
    margin-bottom: 10px;
  }
  body.recruit #point .item h3{
    font-size: 2rem;
    background: linear-gradient(
      90deg,
      #FBF2AE 0%,
      #DDA554 10%
    );
    -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 5px;
  }

  /* body.recruit #interview .flex{
    align-items: center;
    margin-bottom: 30px;
  }
  body.recruit #interview .flex:last-of-type{
    margin-bottom: 0;
  }
  body.recruit #interview .flex .img{
    width: 32%;
  }
  body.recruit #interview .flex .txt{
    width: 66%;
  }
  body.recruit #interview .flex .img img{
    aspect-ratio: 3 / 2;
    object-fit: cover;
  }
  body.recruit #interview .flex h3{
    font-size: 2.5rem;
    margin-bottom: 5px;
    background: linear-gradient(
      90deg,
      #FBF2AE 0%,
      #DDA554 10%
    );
    -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 5px;
  } */

/* ========================================
interview
======================================== */

body.recruit #interview .interview-item {
  opacity: 0;
  margin-bottom: 30px;
}

body.recruit #interview .interview-item:last-of-type {
  margin-bottom: 0;
}


/* クリック部分
---------------------------------------- */

body.recruit #interview .interview-question {
  position: relative;
  display: flex;
  align-items: stretch;
  cursor: pointer;
  margin-bottom: 50px;
}

/* 画像
---------------------------------------- */

body.recruit #interview .interview-img {
  width: 32%;
  flex-shrink: 0;
  overflow: hidden;
}

body.recruit #interview .interview-img img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  transition: transform .5s ease;
}

body.recruit #interview .interview-question:hover .interview-img img {
  transform: scale(1.03);
}


/* 見出し
---------------------------------------- */

body.recruit #interview .interview-heading {
  position: relative;
  display: flex;
  align-items: center;
  width: 68%;
  padding: 30px 80px 30px 40px;
}

body.recruit #interview .interview-heading-txt {
  width: 100%;
}

body.recruit #interview .interview-position {
  margin-bottom: 8px;
  color: #d7bc75;
  font-size: 1.4rem;
  letter-spacing: .1em;
}

body.recruit #interview .interview-heading h3 {
  margin-bottom: 10px;
  font-size: 2.5rem;
  line-height: 1.5;
  background: linear-gradient(
      90deg,
      #FBF2AE 0%,
      #DDA554 30%,
      #B47A2C 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

body.recruit #interview .interview-name {
  color: #898989;
  font-size: 1.4rem;
}


/* 開閉アイコン
---------------------------------------- */

body.recruit #interview .interview-toggle {
  position: absolute;
  top: 50%;
  right: 30px;
  width: 28px;
  height: 28px;
  transform: translateY(-50%);
}

body.recruit #interview .interview-toggle::before,
body.recruit #interview .interview-toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: #d7bc75;
  transform: translate(-50%, -50%);
  transition: transform .3s ease, opacity .3s ease;
}

body.recruit #interview .interview-toggle::before {
  width: 28px;
  height: 1px;
}

body.recruit #interview .interview-toggle::after {
  width: 1px;
  height: 28px;
}

body.recruit #interview .interview-item.active .interview-toggle::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(90deg);
}


/* 開閉する内容
---------------------------------------- */

/* body.recruit #interview .interview-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height .5s ease;
} */

/* body.recruit #interview .interview-content {
  opacity: 0;
  transform: translateY(-10px);
  transition:
      padding .5s ease,
      opacity .3s ease,
      transform .3s ease;
} */

/* body.recruit #interview .interview-item.active .interview-content {
  padding-top: 40px;
  padding-bottom: 40px;
  opacity: 1;
  transform: translateY(0);
} */

body.recruit #interview .interview-block {
  margin-bottom: 50px;
}

body.recruit #interview .interview-block:last-child {
  margin-bottom: 0;
}

body.recruit #interview .interview-block h4 {
  position: relative;
  margin-bottom: 15px;
  padding-bottom: 10px;
  padding-left: 35px;
  font-size: 1.8rem;
  line-height: 1.6;
  color: #fff;
  border-bottom: solid 1px #898989;
}

body.recruit #interview .interview-block h4::before {
  content: "";
  width: 25px;
  height: 25px;
  position: absolute;
  top: 1px;
  left: 0;
  background-image: url(../images/fa-q-icon.jpg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

body.recruit #interview .interview-block p {
  position: relative;
  font-size: 1.6rem;
  padding-left: 35px;
  line-height: 2;
}
body.recruit #interview .interview-block p::before{
  content: "";
  width: 25px;
  height: 25px;
  position: absolute;
  top: 1px;
  left: 0;
  background-image: url(../images/fa-a-icon.jpg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}




  body.recruit #our_value .flex{
    align-items: center;
  }
  body.recruit #our_value .txt .item h3{
    position: relative;
    font-size: 2.5rem;
    background: linear-gradient(
      90deg,
      #FBF2AE 0%,
      #DDA554 10%
    );
    -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  padding-left: 30px;
  margin-bottom: 5px;
  }
  body.recruit #our_value .txt .item h3::after{
    content: "";
    width: 20px;
    height: 20px;
    background-image: url(../images/arrow-gold.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
  }
  body.recruit #our_value .txt .item {
    margin-bottom: 30px;
  }
  body.recruit #our_value .txt .item p{
    font-size: 1.4rem;
  }



  body.recruit #personality p:first-of-type{
    margin-bottom: 20px;
  }
  body.recruit #personality .flex{
    margin-bottom: 20px;
  }
  body.recruit #personality .flex li{
    width: 32.5%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    margin-bottom: 15px;
    font-size: 1.8rem;
    color: #fff;
  }
  body.recruit #personality .flex li:nth-child(odd) {
    background: #013D66;
  }
  body.recruit #personality .flex li:nth-child(even) {
    background: #012640;
  }
  body.recruit .sv-text p{
    text-align: center;
    color: #fff;
    font-size: 2rem;
    line-height: 2.5;
  }
  body.recruit .sv-text p br.sp-block{
    display: none;
  }
  body.recruit .nunber-list li{
    width: 49%;
    margin-bottom: 2%;
  }

  .low-page #privacypolicy .item{
    margin-bottom: 50px;
  }
  .low-page #privacypolicy h3{
    position: relative;
    font-size: 2.5rem;
    margin-bottom: 8px;
    padding-bottom: 10px;
    border-bottom: solid #898989 1px;
    color: #fff;
  }
  .low-page #privacypolicy h3::after{
    content: "";
    width: 75px;
    height: 1px;
    background: #d7bc75;
    position: absolute;
    bottom: -1px;
    left: 0;
  }

  .low-page #privacypolicy .item ul {
    margin: 20px 0;
  }

  .low-page #privacypolicy .item ul li{
    font-size: 1.6rem;
    margin-bottom: 5px;
    color: #fff;
  }
  .low-page #privacypolicy .item ul li:last-of-type{
    margin-bottom: 0;
  }
  .low-page #privacypolicy .item .btn{
    margin-top: 20px;
  }

  :root{
    /* ▼ 背景画像URLをここだけ変更してください */
    --bg-image: url(../images/recruit_fv.jpg);;

    --gold:#c9a84c;
    --bg:#03030a;
    --text:#f0ede6;
    --muted:rgba(240,237,230,.52);
  }

  body.recruit .fv{
    overflow: hidden;
    position:relative;height:100vh;width:100vw;
    display:grid;place-items:center;isolation:isolate;
    background:radial-gradient(ellipse 120% 90% at 50% 60%, #0c0c1a 0%, #03030a 65%, #000 100%);
  }

  body.recruit .masked-world{
    position:absolute;inset:0;z-index:1;overflow:hidden;
    -webkit-clip-path: circle(0px at 50% 50%);
    clip-path: circle(0px at 50% 50%);
    animation: bootMask 2s cubic-bezier(.72,0,.1,1) .3s forwards;
    -webkit-animation: bootMask 2s cubic-bezier(.72,0,.1,1) .3s forwards;
  }

  /* 背景画像レイヤー */
  body.recruit .visual{
    position:absolute;inset:-10%;
    background:
      linear-gradient(160deg, rgba(201,168,76,.09) 0%, transparent 25%),
      linear-gradient(220deg,
        rgba(8,10,28,.82) 0%,
        rgba(5,7,20,.72) 50%,
        rgba(8,10,28,.88) 100%
      ),
      var(--bg-image) center/cover no-repeat;
    transform:scale(1.1);
    animation:slowDrift 14s ease-in-out infinite alternate;
  }

  body.recruit .visual::before{
    content:"";position:absolute;inset:0;
    background:
      repeating-linear-gradient(90deg, rgba(201,168,76,.07) 0 1px, transparent 1px 96px),
      repeating-linear-gradient(0deg,  rgba(201,168,76,.04) 0 1px, transparent 1px 96px);
    mix-blend-mode:screen;
    transform:perspective(900px) rotateX(62deg) translateY(16%);
    transform-origin:bottom;
    opacity:.6;
  }

  body.recruit .visual::after{
    content:"";position:absolute;inset:0;
    background:radial-gradient(ellipse 70% 70% at 50% 50%, transparent 40%, rgba(0,0,0,.72) 100%);
  }

  body.recruit .light-streak{
    position:absolute;inset:0;z-index:1;pointer-events:none;
    background:
      linear-gradient(108deg, rgba(201,168,76,.13) 0 1px, transparent 1px),
      linear-gradient(252deg, rgba(180,200,255,.06) 0 1px, transparent 1px);
    animation:streakShift 8s ease-in-out infinite alternate;
  }

  body.recruit .noise{
    position:absolute;inset:0;z-index:2;opacity:.055;pointer-events:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
    mix-blend-mode:overlay;
    animation:noiseDrift .4s steps(2,end) infinite;
  }

  body.recruit .mask-ring{
    position:absolute;left:50%;top:50%;
    width:108px;height:108px;
    border:1.5px solid rgba(201,168,76,.9);
    border-radius:50%;z-index:3;
    transform:translate(-50%,-50%) scale(.1);
    opacity:0;
    animation:ring 2s cubic-bezier(.72,0,.1,1) .3s forwards;
  }
  body.recruit .mask-ring::before{
    content:"";position:absolute;inset:-20px;
    border:1px solid rgba(201,168,76,.22);
    border-radius:50%;
  }
  body.recruit .mask-ring::after{
    content:"";position:absolute;inset:-44px;
    border:1px solid rgba(201,168,76,.1);
    border-radius:50%;
  }

  body.recruit .copy{
    position:relative;z-index:4;
    text-align:center;
    line-height:.92;
    letter-spacing:-.04em;
    font-weight:900;
    font-size:clamp(7rem,9vw,148px);
    pointer-events:none;
  }
  body.recruit .copy .line{display:block;overflow:hidden; color: #fff;}
  body.recruit .copy .line span{
    display:block;opacity:0;
    transform:translateY(60px) skewY(3deg);
    animation:textReveal 1s cubic-bezier(.16,1,.3,1) forwards;
  }
  body.recruit .copy .line:nth-child(1) span{animation-delay:1.15s}
  body.recruit .copy .line:nth-child(2) span{
    animation-delay:1.28s;
    background:linear-gradient(90deg, var(--text) 30%, var(--gold) 55%, var(--text) 80%);
    background-size:200% auto;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    animation:textReveal 1s cubic-bezier(.16,1,.3,1) 1.28s forwards, shimmer 4s linear 2.4s infinite;
  }
  body.recruit .copy .line:nth-child(3) span{animation-delay:1.41s;font-size:.62em;letter-spacing:.05em;font-weight:400}

  body.recruit .rule{
    position:relative;z-index:4;
    width:0;height:1px;
    background:linear-gradient(90deg, transparent, var(--gold), transparent);
    opacity:0;
    animation:ruleExpand 1.2s cubic-bezier(.16,1,.3,1) 1.7s forwards;
    margin:clamp(12px,2vh,28px) auto 0;
  }

  body.recruit .lead{
    position:relative;z-index:4;
    text-align:center;
    font-size:2rem;
    line-height:1.4;letter-spacing:.1em;
    color:#fff;opacity:0;
    animation:fadeUp .9s ease 2.1s forwards;
    margin-top:clamp(18px,3vh,36px);
  }

  body.recruit .lead .sp-block{
    display: none;
  }

  body.recruit .corner-tl,.corner-br{
    position:absolute;z-index:4;
    font-size:10px;letter-spacing:.22em;
    color:rgba(201,168,76,.45);text-transform:uppercase;
    opacity:0;animation:fade .8s ease 2.5s forwards;
  }
  body.recruit .corner-tl{top:36px;left:40px}
  body.recruit .corner-br{bottom:36px;right:40px;text-align:right}

  body.recruit .scroll-hint{
    position:absolute;bottom:38px;left:50%;transform:translateX(-50%);
    z-index:4;display:flex;flex-direction:column;align-items:center;gap:6px;
    opacity:0;animation:fade .8s ease 2.8s forwards;
  }
  body.recruit .scroll-line{width:1px;height:38px;background:linear-gradient(to bottom, var(--gold), transparent);animation:scrollPulse 2s ease-in-out 3.1s infinite}
  body.recruit .scroll-label{font-size:1.6rem;letter-spacing:.28em;color:#b48f44;text-transform:uppercase}

  @-webkit-keyframes bootMask{
    0%  {-webkit-clip-path:circle(0px at 50% 50%)}
    15% {-webkit-clip-path:circle(38px at 50% 50%)}
    42% {-webkit-clip-path:circle(96px at 50% 50%)}
    100%{-webkit-clip-path:circle(150vmax at 50% 50%)}
  }
  
  @keyframes bootMask{
    0%  {clip-path:circle(0px at 50% 50%)}
    15% {clip-path:circle(38px at 50% 50%)}
    42% {clip-path:circle(96px at 50% 50%)}
    100%{clip-path:circle(38vmax at 50% 50%)}
  }
  @keyframes breathe{
    from{clip-path:circle(36vmax at 50% 50%)}
    to  {clip-path:circle(44vmax at 50% 50%)}
  }
  @keyframes ring{
    0%  {opacity:0;transform:translate(-50%,-50%) scale(.1)}
    16% {opacity:1;transform:translate(-50%,-50%) scale(.65)}
    50% {opacity:.8;transform:translate(-50%,-50%) scale(1.7)}
    100%{opacity:0;transform:translate(-50%,-50%) scale(10)}
  }
  @keyframes textReveal{to{opacity:1;transform:translateY(0) skewY(0)}}
  @keyframes shimmer{
    from{background-position:200% center}
    to  {background-position:-200% center}
  }
  @keyframes ruleExpand{
    0%  {width:0;opacity:0}
    20% {opacity:1}
    100%{width:clamp(120px,20vw,260px);opacity:.8}
  }
  @keyframes fadeUp{
    from{opacity:0;transform:translateY(12px)}
    to  {opacity:1;transform:translateY(0)}
  }
  @keyframes fade{to{opacity:1}}
  @keyframes slowDrift{
    from{transform:scale(1.1) translate3d(-1%,1.5%,0)}
    to  {transform:scale(1.2) translate3d(1.5%,-1%,0)}
  }
  @keyframes streakShift{
    from{opacity:.6;transform:translateX(0)}
    to  {opacity:1;transform:translateX(-2%)}
  }
  @keyframes noiseDrift{to{transform:translate3d(-1.5%,1%,0)}}
  @keyframes scrollPulse{
    0%,100%{opacity:.3;transform:scaleY(1)}
    50%{opacity:1;transform:scaleY(1.1)}
  }

  body.recruit .site-header{
    background: transparent;
  }

  .wpcf7 form.sent .wpcf7-response-output{
    border: none;
  }
  body.recruit .header-btns.sp-fixed a{
    width: 100%;
  }


  .pagenation{
    margin-top: 20px;
  }
  .page-numbers {
    display: flex;
    justify-content: center;
  }
  .page-numbers li{
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .page-numbers li span.current{
    color: #b48f44;
  }
  .page-numbers li span{
    display: block;
    color: #fff;
    font-size: 1.8rem;
  }
  .page-numbers li a{
    position: relative;
    display: block;
    color: #fff;
    font-size: 1.8rem;
    transition: .3s;
  }
  .page-numbers li a.next::after{
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    background-image: url(../images/arrow-white.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: .3s;
  }
  .page-numbers li a.prev::after{
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    background-image: url(../images/arrow-white.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transform: rotate(180deg);
    transition: .3s;
  }

  .grecaptcha-badge { visibility: hidden; }
  .reCAPTCHA{
    margin-top: 80px;
  }
  .reCAPTCHA p{
    text-align: center;
    font-size: 1.2rem;
  }
  .reCAPTCHA a{
    color: #B47A2C;
  }


  .contact-detail br{display: none;}
  #office_work h3 br.sp-block{display: none;}