@charset "utf-8";

html, body {overflow-x: hidden;}

/*トップページのみのヘッダーの扱い*/
@media screen and (max-width: 767px) {
  .header_wrap,
  .header_wrap #header {
    display: none;
  }
  .header_all.visible .header_wrap,
  .header_all.visible .header_wrap #header {
    display: block;
  }
}


  .header_all {position: fixed;top: 0;left: 0;right: 0;transform: translateY(-100%); transition: transform 0.4s ease;z-index: 999;background: #fff;box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);}
  .header_all.visible {transform: translateY(0); /* 表示される位置に戻す */}
  #g-nav.panelactive .header_all {position: relative;transform: initial;}





.background {position:relative;width: 100vw;display: flex;justify-content: center;align-items: center;pointer-events: none;  }
@media screen and (min-width: 767px) {
  .background {position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;z-index: 0;background: radial-gradient(circle at center, #AD1D22 0%,#6a1b1f 100%);color: #fff;}
}
.viewport {display: flex;justify-content: center;align-items: center;gap: 1vw;}
.box {width:40vw; height:80vh; display:flex; flex-direction:column; justify-content:center; align-items:center; transform-style:preserve-3d; }


@keyframes flyIn {
      to {
        transform: translate3d(0, 0, 0) rotateY(0deg);
      }
    }

    @keyframes slideOut {
      to {
        transform: translateX(110vw);
      }
}

/*トップビジュアル_スマホの時の文字サイズの調整*/
  @media screen and (max-width: 767px) {
    .background {position: relative;width: 100vw;height: 100vh;overflow: hidden;}
    .viewport { position: relative; width: 100vw;height: 100vh;max-width: 100%;display: flex;justify-content: center;align-items: center;perspective: 1000px;overflow: hidden;margin: 0 auto;padding: 0 16px;box-sizing: border-box;}
    .box {display: flex;flex-direction: column;align-items: center;transform-origin: center center;}
    .line {display: flex;justify-content: center;margin: 4px 0;}
    .letter {display: inline-block;white-space: nowrap;word-break: keep-all;backface-visibility: hidden;will-change: transform, opacity;font-size:18vw !important; /* ← 強制的に小さくする */line-height:2em; }
    .black-overlay {position: absolute;inset: 0;background: rgba(0, 0, 0, 0.3);z-index: 1;}
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
 
}
    

@media screen and (min-width: 767px) {
  .black-overlay {position: absolute;top: 0;left: 0;width: 100vw;height: 100vh;background-color: rgba(0, 0, 0, 0);transition: background-color 0.2s ease;pointer-events: none;z-index: 1;}
  .black-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0);
    transition: background-color 0.3s ease;
    pointer-events: none;
    z-index: 1;
  }
}


/*スマホの時はトップ上部全体を囲う*/
@media screen and (max-width:768px) {
  .contents_wrap_all {
    background: radial-gradient(circle at center, #AD1D22 0%, #AD1D22 70%, #6a1b1f 100%);
  }
  .contents_wrap_all .black-overlay{ display:none; }

}

#areyouleadertrigger { height:10px; }
@media screen and (min-width:768px) {
  #areyouleadertrigger { height:100px; }
  .contents_wrap_all .black-overlay{ height:100%; display:block; }
}

.contents_wrap {  width:100%; height:auto; position:relative; z-index:10; }
.content {overflow-x: hidden; }

/*白が広がる動き*/
.next-content {opacity:1;}
.white-overlay { display:none; }
@media screen and (min-width:768px) {
  .white-overlay {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: 100vh;
    background: white;
    transform: translate(-50%, -50%) scaleY(0.01); /* 1pxライン相当 */
    transform-origin: center center;
    z-index: 9999;
    opacity: 0; /* 最初は透明 */
    pointer-events: none;
    display: block;
  }

  .white-overlay.active {
    animation: expandAndFade 0.8s ease-out forwards;
  }

  @keyframes expandAndFade {
    0% {
      transform: translate(-50%, -50%) scaleY(0.01);
      opacity: 1;
    }
    50% {
      transform: translate(-50%, -50%) scaleY(1);
      opacity: 1;
    }
    100% {
      transform: translate(-50%, -50%) scaleY(1);
      opacity: 0;
    }
  }

    /* 次の要素の表示用アニメーション */
    .next-content {opacity: 0;transition: opacity 0.8s ease;}
    .next-content.visible {opacity: 1;}
}






.contents_wrap.top { width:100%; height:auto; text-align:center; padding-top:10vw; color:#fff; background:none; padding-bottom:200px; }
.contents_wrap.top h1 { font-size:32px;letter-spacing:0.05em; text-shadow: 0 4px 12px rgba(0,0,0,0.4); margin-bottom:50vw; margin-left:5%; }
.contents_wrap.top .leadcopy { width:100%; display:inline-block; font-size:20px; line-height:2.5em; margin-bottom:50px; letter-spacing:0.05em;text-shadow: 0 4px 12px rgba(0,0,0,0.4); }
.contents_wrap.top .leadcopy_last { width:100%; display:inline-block; font-size:20px; line-height:2.5em; letter-spacing:0.05em;text-shadow: 0 4px 12px rgba(0,0,0,0.4); }
.contents_wrap.top strong { width:100%; text-align:center; font-size:60px; letter-spacing:0.05em; text-shadow: 0 4px 12px rgba(0,0,0,0.4);}
.contents_wrap.top .areyouleader { width:100%; }
#lead-message-final.inline_sp { font-size:32px; margin:50px 0 0 5%; display:inline-block; }
#lead-message-final.inline_pc { display:none; }
.h1_wrap { height:auto; }
.h1_wrap .inline_pc { display:none; }
.h1_wrap .inline_sp { display:block; }
@media screen and (min-width:768px) {
  .contents_wrap.top { margin-top:100vh; }
  .h1_wrap { height:100vh; }
  .h1_wrap .inline_pc { display:none; }
  .h1_wrap .inline_sp { display:block; }
  .contents_wrap.top h1 { font-size:60px; margin-bottom:400px; margin-left:initial;  }
  .contents_wrap.top .leadcopy { font-size:25px; margin-bottom:70px; }
  .contents_wrap.top .leadcopy_last { font-size:25px; margin-bottom:250px; }
  .contents_wrap.top {clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);}
  #lead-message-final.inline_sp { display:none; }
  #lead-message-final.inline_pc  { font-size:60px; margin-top:initial; margin-bottom:150px; }

}
@media screen and (min-width:1080px) {
  .h1_wrap .inline_pc { display:block; }
  .h1_wrap .inline_sp { display:none; }
}


.message_wrap .inline_sp { width:100%; text-align:center; font-size:60px; letter-spacing:0.05em; text-shadow: 0 4px 12px rgba(0,0,0,0.4); display:inline; }
.message_wrap .text_jinsei.inline_sp  { width:80%; display:inline-block; filter: drop-shadow(2px 4px 8px rgba(0, 0, 0, 0.4)); margin:100px auto 0 auto; display:block; }
.message_wrap .text_jinsei.inline_pc { display:none; } 
@media screen and (min-width:768px) {
  .message_wrap { width:50%; height:200px; overflow:visible; margin:0 auto; display:inline-block;}
  .message_wrap .text_jinsei.inline_pc  { width:100%; margin:0 auto; display:block; }
  .message_wrap .text_jinsei.inline_sp { display:none; } 
  .message_wrap svg {overflow: visible;}
  .message_wrap .inline_sp { display:none; }
}


/*社長メッセージ*/
.section.section--ceo { height:auto; position:relative; padding:30px 0 100px 0; z-index:1; background:#fff; }
.section--ceo .contents { position:relative; }
.section--ceo .contents .button_with_arrow { margin:50px auto 0 auto; }
.section--ceo .contents .title { height:auto; pointer-events: none;}
.section--ceo .title { flex-wrap:wrap; }
.section--ceo .title .title_text { width:100%; }
.section--ceo .title .title_text h2 { margin-left:5%; }
.section--ceo .title_copy { width:95%; text-align:left; margin-left:0; }
.section--ceo .contents .photo_ceo { width:100%; margin:30px 0; }
.section--ceo .section-description { width:90%; color:#000;text-align:left; display:block; margin:0 auto; }
.title_copy_wrap { width:90%; margin-left:5%; display:block; }
@media screen and (min-width:768px) {
  .section--ceo .title_copy { width:100%; text-align:center; margin-bottom:50px; }
  .photo_ceo { width:960px; margin-bottom:80px; }
  .section--ceo .section-description { width:100%; text-align:center; }
  .section--ceo .contents { top:initial; margin-top:0; }
  .section--ceo .contents .photo_ceo { position:relative; margin:50px 0; text-align:center; }
  .section--ceo .title .title_text h2 { margin-left:0; }
  .title_copy_wrap { display:none; }

}





/*数字で見る*/

.section.section--data { height:auto; padding-bottom:50px; }
.section--data .map_sp { position:relative; bottom:initial; }
.section--data .button_with_arrow { position:relative; margin:0 auto 50px auto; left:initial; bottom:initial; transform:initial; }
@media screen and (min-width:768px) {
  .section.section--data { padding-bottom:150px; }

  .slider-container { margin-bottom:100px; }
  .section--data .button_with_arrow { margin:50px 0 0 0;}
  
}
@media screen and (min-width:1080px) {
  .section--data .map_wrap { width:100%; height:50vw; position:relative; overflow:hidden; top:10vw; right:-100px; display:block; }
}

/*職種紹介*/
.section.section--business {  position:relative; display:block; background-image: url('../img/photo_business_sp.jpg');background-size: cover; background-position: center; background-repeat: no-repeat; }
.section--business .title_english { color:rgba(255, 255, 255, 0.14); }
.section--business .section-description { margin-bottom:40px; }
.section--business .button_with_arrow.red { border:2px solid #B3212B; color:#B3212B; }
.section--business .button_with_arrow.red { background:#fff;} 

@media screen and (min-width:768px) {
      .section.section--business {  height:105vh; background-image: url('../img/photo_business.jpg'); display:block; background-attachment:fixed; }
      .section--business .title { /*position:absolute; top:15px;*/ margin-bottom:20px; }
      .section--business .contents { padding-top:50px; }
      .section--business .section-description { margin-top:40px; }
      .section--business .text_button_wrap { display:flex; justify-content: space-between;}
      .section--business .text_button_wrap .button_with_arrow.red { border:2px solid #B3212B;  }

  }
  @media screen and (max-width: 1024px) {
    .section.section--business {
      background-attachment: scroll; /* ← 通常の背景表示に */
    }
  }

@media screen and (min-width:1080px) {
.section.section--business {
   height:105vh;
  background-image: url('../img/photo_business.jpg');
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  display: block;

  /* ↓ これらを削除することで fixed が効くようになる */
  /* will-change: transform; */
  /* backface-visibility: hidden; */
}




}



/*働く環境*/
.section.section--culture { height:auto; display:block; position:relative; padding-bottom:50px; }
.section.section--culture .title { margin-bottom:20px; }
.section--culture .culture_movie.inline_sp { width:100%; height:auto; margin-bottom:30px;display:block; }
.section--culture .culture_movie.inline_sp video { width:100%; height:100%; }
.section--culture .culture_movie.inline_pc { display:none; }
.section--culture p.section-description { color:#000; margin-bottom:20px; }
@media screen and (min-width:768px) {
  .section.section.section--culture { height:auto; padding-bottom:initial; padding-bottom:150px; padding-top:15px; }
  .section.section.section--culture .contents { width:90%; max-width:1080px;  }
  .section--culture .culture_movie.inline_pc { width:50%; display:flex; position:absolute; right:0; top:25vh; display:block; }
  .section--culture .culture_movie.inline_pc video { width:100%; height:100%; object-fit: cover;}
  .section--culture .culture_movie.inline_sp { display:none; }
  .section.section--culture p.section-description { margin:initial; margin:80px 0 ;  }

  .section.section--culture .button_with_arrow { margin-top:0; }
}


/*社員インタビュー*/
.section.section--interview { height:auto; display:block; background: radial-gradient(circle at center, #AD1D22 0%, #6a1b1f 100%); position:relative; z-index:-3; padding:0 0 100px 0; display:block; }
.section.section--interview .title { margin-bottom:0; }
.section--interview .title .title_english { margin-top:-1vh; color: rgba(255, 255, 255, 0.16);} 
.section--interview .section-description { width:100%; text-align:center; color:#fff; }
.section--interview .title_copy { width:100%; text-align:left; position:relative; margin-bottom:20px;}
.section--interview .button_with_arrow { margin:0px auto 0 auto;  border:2px solid #fff; background:none; color:#fff;}
.section--interview .title .title_text h2 {top:5vh;  color:#fff; }
.section--interview p.section-description { text-align:left; text-align:justify;}
.section--interview .title_copy.inline_pc { display:none; }
.section--interview .title_copy.inline_sp { display:inline-block; }
@media screen and (min-width:768px) {
  .section.section--interview { height:auto; display:flex; margin:0 auto; padding-bottom:150px; }
  .section.section--interview .title .title_text { margin-top:50px; }
  .section--interview .title { margin-bottom:initial; }
  .section--interview .title .title_english { margin-top:-35px; }
  .section--interview .title .title_text h2 { bottom:initial; top:7vh; bottom:150px;}
  .section--interview .title_copy.inline_pc { width:100%; text-align:center; margin-bottom:50px; display:block; }
  .section--interview .title_copy.inline_sp { display:none; }
  .section.section--interview p.section-description { width:100%; font-size:18px; text-align:center; padding-bottom:0; display:inline-block; }
  .section--interview .contents { width:90%; }
}
@media screen and (min-width:1280px) {
  .section--interview .contents { width:100%; }
}


.slide {padding: 10px;box-sizing: border-box;}
.slide a { display: block;position: relative;text-align: center;}
.staff_photo {overflow: visible;position: relative;}
.staff_photo img {width: 100%;transition: transform 0.4s ease, opacity 0.4s ease;}

.slide.slick-center .staff_photo img {transform: scale(1);z-index: 2;}
.slide:not(.slick-center) .staff_photo img {transform: scale(1);}
@media screen and (min-width:768px) {
  .slide.slick-center .staff_photo img {transform: scale(1.1);}
  .slide:not(.slick-center) .staff_photo img {transform: scale(0.8);opacity: 0.6;}
}

.staff_copy_wrap {position: absolute; bottom:-3px;left:0;color: white;z-index: 3; text-align:left; }
.staff_copy1 {font-size: 24px;line-height: 1.3;  display:inline-block;}
.staff_name { font-size:14px; color:#B3212B; display:inline-block; margin-left:5px; }
.slide.slick-slide:not(.slick-center) .staff_copy_wrap .headline-md { display:inline-block; }
.slider {width: 100%; margin:30px auto 50px auto; overflow-x:hidden; }
.staff_copy_wrap .staff_copy1 { display:inline-block; font-size:23px; /*padding:5px; */}

@media screen and (min-width:834px) {
  .staff_copy_wrap { left:18%; bottom:10px }
}
@media screen and (min-width:1024px) {
  .slider { margin-top:450px; margin-bottom:100px; }
  .slide.slick-slide:not(.slick-center) a .staff_copy_wrap .staff_copy1 { display:none;  }
  .slide.slick-slide:not(.slick-center) a .staff_copy_wrap .staff_copy2 { display:none;  }
  .slide.slick-slide:not(.slick-center) .staff_copy_wrap .headline-md { display:none; }
  .staff_copy_wrap { left:0; bottom:10px }
  .staff_name { font-size:16px; margin-left:10px; }
  .slide.slick-slide:not(.slick-center) .staff_name { display:none; }
  .staff_copy_wrap .staff_copy1 { font-size:20px; line-height:30px; padding:0 5px 0 5px; }
}
@media screen and (min-width:1025px) {
  .staff_copy_wrap { left:0; bottom:-10px }
  .staff_copy_wrap .staff_copy1 { font-size:25px; line-height:56px; padding:0 5px 15px 5px; }
}




.slide.slick-center .staff_photo img {transition: transform 0.4s ease, filter 0.4s ease; }
.slide:not(.slick-center) .staff_photo img {transition: transform 0.4s ease, opacity 0.4s ease, filter 0.4s ease;}
@media screen and (min-width:1080px) {
  .swiper-slide { position:relative; }
  .swiper-slide .nav_arrow { width:30px; height:30px; position:absolute; right:10px; bottom:10px; border:2px solid #fff; border-radius:25px; display:flex; align-items:center; justify-content: center; overflow:hidden; }
  .swiper-slide .nav_arrow img { width:20px; }
  .swiper-slide a:hover .nav_arrow img {animation: arrowLoop 1s linear infinite;}

}
@media screen and (min-width:1280px) {
  .swiper-slide .nav_arrow { width:40px; height:40px; }
}

@media screen and (max-width:768px) {
.swiper {
  width: 95%;
  margin: 0 auto; /* 中央寄せ */
}
}
@media screen and (min-width:768px) {
  .swiper {
    width: 100%; 
    position: relative;
    left: 50%;
    transform: translateX(-50%); /* ← 中央に寄せる */
    padding: 60px 0;
    margin-bottom:50px; 
  }

  @media screen and (min-width:768px) {
    .swiper {
      width: 120%; /* ← はみ出す幅 */
    }
  }
  
  .swiper-slide {
    transition: transform 0.6s;
    transform: scale(0.7); /* 両端を小さく */
  }
  
  .swiper-slide-active {
    transform: scale(1.3); /* 真ん中を大きく */
    z-index: 2;
  }
}

/*地図*/
/* 初期状態（非表示 + ズラし） */
.map_pin,
.map_price {
  opacity: 0;
  transform: translateY(20px) scale(1);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

/* 表示状態 */
.show {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* バウンスアニメーション */
.bounce {
  animation: bounceIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* バウンスのキーフレーム */
@keyframes bounceIn {
  0% {
    transform: scale(0.5);
    opacity: 0;
  }
  60% {
    transform: scale(1.2);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}









/*山陰 地域の取り組み*/
.section.section--sanin { height:auto; display:block; background:#EFEFEF; position:relative; overflow:hidden; padding-bottom:50px; }

@media screen and (min-width:414px) {
  .section.section--sanin { height:auto; padding-bottom:0; }
}
.section--sanin .section-description { width:100%; text-align:left; color:#000; text-align:justify; }
.section--sanin .title { margin-bottom:20px; }
@media screen and (min-width:768px) {
  .section.section--sanin { display:flex; }
  .section--sanin .title { margin-bottom:initial; }
  .section.section--sanin .contents { width:90%; max-width:1080px; margin:0 auto; }
}

.section--sanin .title_copy.inline_sp { width:100%; text-align:left; position:relative; }
.section--sanin .title_copy.inline_pc { display:none; }
@media screen and (min-width:768px) {
  .section--sanin .title_copy.inline_pc { text-align:center; margin:0 auto 40px auto; display:block; }
  .section--sanin .title_copy.inline_sp { display:none; }
}


.section--sanin .button_with_arrow { margin:0 auto; }
.section--sanin .title_english { margin:0 auto; display:block; }
.section--sanin .title .title_text h2 { left:5%; bottom:150px; }
@media screen and (min-width:768px) {
  .section--sanin .button_with_arrow { margin:0; }
  .section--sanin .title .title_text h2 { top:initial; left:0; bottom:120px; position:relative; }
}
.section--sanin .title_english{ color: rgba(255, 255, 255, 0.62); display:block; }
@media screen and (min-width:768px) {
  .section.section--sanin .contents { margin-top:80px; }
}



@media screen and (min-width:768px) {
  .section--sanin .image-wrapper.left.img1 { width:15%; top:10%; right:10%; bottom:initial;  position:absolute; transition: transform 0.2s ease-out;}/*メガネの女性*/
  .section--sanin .image-wrapper.left.img1 img { width:100%; }

  .section--sanin .image-wrapper.left.img3 { width:15%; top:60%; right:10%;position:absolute; transition: transform 0.5s ease-out; }/*祭りの画像*/
  .section--sanin .image-wrapper.left.img3 img { width:100%; }
  
  .section--sanin .image-wrapper.right.img4 { width:10%; top:35%; right:30%; bottom:initial; position:absolute; transition: transform 0.2s ease-out;}/*お父さんと子供*/
  .section--sanin .image-wrapper.right.img4  img { width:100%; }	

  .section--sanin .image-wrapper.right.img5  { width:20%; top:65%; right:30%; bottom:initial; position:absolute; z-index:2; transition: transform 0.3s ease-out;}/*お絵描き*/
  .section--sanin .image-wrapper.right.img5 img { width:100%; }
  .image-wrapper img {transform-origin: center center;}
}



#smooth-wrapper { display:none; }
@media screen and (min-width:768px) {
  #smooth-wrapper { margin-top:50px; display:block; height: 100%;overflow: hidden;}
  
}
.community_sp { width:100%; margin:50px 0 0 0; display:block;}
@media screen and (min-width:768px) {
  .community_sp { display:none; }
}






/*最後のコンテンツ*/
.section p.section-description { /*margin-bottom:72px;*/ font-family:"Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN","メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; line-height:2em; letter-spacing:0.05; /*text-align:justify;*/ }
.title .title_text h2 { font-size:18px; margin-left:0; top:40px; position:absolute; color:#B3212B; }
.title .title_text h2.center { font-size:18px; margin-left:0; top:40px; position:absolute; color:#B3212B; left: 50%; transform: translateX(-50%);}
.title { height:auto; }

.section--interview .section p.section-description { margin:0;}
.slick-list { margin-bottom:20px; }
@media screen and (min-width:768px) {
  .section p.section-description { margin:0px 0 64px 0; font-size:18px; letter-spacing:0.05em; }
  .slick-list { margin-bottom:0; }
}




.banner_news { display:none; }
.banner-list { margin-top:0; padding:50px 0 0 0;}

@media screen and (min-width:768px) {
  .banner_news { display:flex; }
  .banner_news:link { color:#000; }
.banner_news:hover { opacity:0.7; }
.banner_news:hover .banner_news_item div:nth-child(2) ul.news li strong { font-size:40px; position:relative; }
    .banner_news_item { width:90%; height:170px; display:flex; border:2px solid #E6E6E6; margin-top:56px; }
    .banner_news_item div:nth-child(1){ width:35%; overflow:hidden; }
    .banner_news_item div:nth-child(1) .photo_news { width:100%; height:100%; }
    .banner_news_item div:nth-child(2) { width:65%; display:flex; align-items:center; justify-content: center;}
    .banner_news_item div:nth-child(2) ul.news { display:flex; gap:15px; }
    .banner_news_item div:nth-child(2) ul.news li strong { font-size:40px; color:#000; position:relative; }

    .banner_news_item div:nth-child(2) ul.news li strong::before {content: "NEWS";color: #B3212B;font-weight: bold; font-family: "Oswald"; position:absolute;top:-20px; font-size:18px; }
    .banner_news_item div:nth-child(2) ul.news li p { color:#000; }
    .banner_news_item div:nth-child(2) ul.news li .nav_arrow { width:70px; height:70px; border:2px solid #B3212B; display:flex; align-items:center; border-radius:50%; justify-content: center; overflow:hidden; }
    .banner_news_item div:nth-child(2) ul.news li .nav_arrow img { width:32px; }
    .banner_news:hover .banner_news_item div:nth-child(2) ul.news li .nav_arrow img {animation: arrowLoop 1s linear infinite;}
/* アニメーション定義：右にスライドして左から再登場 */
@keyframes arrowLoop {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  49% {
    transform: translateX(70px);
    opacity: 0;
  }
  50% {
    transform: translateX(-70px);
    opacity: 0;
  }
  51% {
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
}

@media screen and (min-width:1080px) {
  .banner_news_item { width:85%; margin:40px auto 0 auto; }
}

.section.section--last { height:auto; display:block; padding-bottom:80px; }
.section--last .nav_entry_button { margin-top:30px; }
@media screen and (min-width:1080px) {
  .section.section--last { height:auto; display:flex; padding-bottom:10px; background:#fff;}
  .section.section--last .headline-lg { margin:80px auto; }


}






.slide-out {animation: slideOut 0.5s ease forwards;}
.content {position: relative;z-index: 1;}
.section { height:100vh; display:flex; flex-direction: column;justify-content: center;align-items: center;/*padding: 2rem;*/}
.section p { color:#fff; /*display:inline-block; */}
.letter {font-family: 'Oswald', sans-serif;font-size:110px;font-weight: 900; font-style: italic;color: white;opacity: 0;display: inline-block;margin: 0 -0.03em;padding: 0 0.1em;backface-visibility: hidden;overflow: visible;transition: opacity 0.5s ease;}
.line {display: flex;justify-content: center;margin: -30px 0; /* 行間を固定 */}
.section.textanimation1 { position:relative; }
.section.textanimation1 .message_left { font-size:24px; letter-spacing:0.05; line-height:2em; text-align:left; position:absolute; top:0; left:0; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);}
.section.textanimation1 .message_right { font-size:24px; letter-spacing:0.05; line-height:2em; text-align:right; position:absolute; bottom:25vh; right:0; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);}
.textanimation2 { height:auto; }
.textanimation3 { height:auto; padding-bottom:50px; }
.section p.sp_message { font-size:32px; display:block; text-align:center; margin:100px 0 100px 0;}
@media screen and (min-width:768px) {
  .section.textanimation1 .message_left { font-size:40px; top:0; left:0; }
  .section.textanimation1 .message_right { font-size:40px; bottom:0; right:0; }
  .textanimation2 { height:100vh; }
  .textanimation3 { height:100vh; padding-bottom:initial; }
  .section p.sp_message { display:none; }
}


.message_center_middle { width:100%; font-size:24px; text-align:center; color:#fff; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);}
.message_center_middle span { font-size:24px; line-height:2em; display:inline-block;}
@media screen and (min-width:768px) {
  .message_center_middle { font-size:57px; text-align:center; }
  .message_center_middle span { font-size:57px; }
  .message_center_middle_small { font-size:40px; text-align:center; }
  .message_center_middle_big { font-size:69px; text-align:center; }
}


.text_englishbox { width:100%; height:auto; position:relative; padding-bottom:100px; }
@media screen and (min-width:768px) {
  .text_englishbox { height:100vh;}
}
.text_englishbox img.text_english {
  opacity: 0;                         
  transform: translateY(20px);      
  transition: opacity 0.6s ease, transform 0.6s ease;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) translateY(100px); 
  z-index: 1;
}

.text_englishbox img.text_english.visible {
  opacity: 1;                        
  transform: translate(-50%, -50%) translateY(0); 
}



.animate-lines span {
  display: block;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.animate-lines.visible span {
  opacity: 1;
  transform: translateY(0);
}

@media screen and (min-width:768px) {
  .banner-list { margin-top:150px; }
  .section--last .nav_entry_button { margin-bottom:150px; }
}


				/* =============================
				共通スタイル（全デバイス）
				============================= */
				.slider-track {
					display: inline-block;
					white-space: nowrap;
					will-change: transform; /* ← GPUに指示 */
					backface-visibility: hidden; /* Safari対策 */
					transform: translateZ(0); /* GPU合成の強制 */
					}

					.slider-track img {
					display: inline-block;
					height: auto;
					vertical-align: middle;
					aspect-ratio: 3 / 2; /* もしくは適切な比率 */
					object-fit: cover;
					}

				/* =============================
				PC用（768px以上）
				============================= */
				.slider-pc {
				display: none;
				}

				@media screen and (min-width: 768px) {
				.slider-pc {
					display: block;
					overflow: hidden;
					white-space: nowrap;
					width:100%;
          margin-top:100px; 
				}

				.slider-pc .slider-track {
					animation: scroll-left 40s linear infinite;
				}

				.slider-pc .slider-track img {
					height: 23vw; /* PC用サイズ */
				}
				}

        
        @media screen and (width: 834px) {
          .slider .slick-list {
            padding: 0 5% !important; /* スライダー自体に左右余白 */
          }
        
          .slider .slick-track {
            display: flex !important;
            align-items: center;
          }
        
          .slider .slick-slide {
            width: 100% !important; /* Slick内部に任せる */
            margin: 0 !important;   /* スライドに余白を付けない */
          }
        
          .slider .slide {
            width: 90%;
            margin: 0 auto;
          }
        }
        

				/* =============================
				SP用（767px以下）
				============================= */
				.slider-sp {
				display: none;
				}

				@media screen and (max-width: 767px) {
				.slider-sp {
					display: block;
					position: relative;
					width: 100%;
					overflow: hidden;
				}

				.slider-sp .slider-track {
					animation: scroll-left 15s linear infinite;
				}

				.slider-sp .slider-track.reverse {
					animation: scroll-right 15s linear infinite;
					margin-top: -5px;
				}

				.slider-sp .slider-track img {
					height: 120px;
				}
				}

				/* =============================
				アニメーション共通
				============================= */
				@keyframes scroll-left {
				0%   { transform: translateX(0%); }
				100% { transform: translateX(-50%); }
				}
				@keyframes scroll-right {
				0%   { transform: translateX(-50%); }
				100% { transform: translateX(0%); }
				}