@charset "utf-8";
/* CSS Document */
/*-- 上書き --*/
.tss_footer{
  background-color:#009CA8 !important;
}


.gld26_wrap{
  background-color:#004354;
  background-image:url("../img/golden2026/bg_head01.webp"),url("../img/golden2026/bg_star.svg");
  background-size: contain;
  background-position:center top,center bottom;
  background-repeat:no-repeat;
  padding-bottom:88px;
}


/* TOPロゴ */
.gld26_mainImg{
  max-width:930px;
  margin-inline: auto;
}
.gld26_mainImg img{
  aspect-ratio: 930/650;
  object-fit: contain;
  width: 100%;
}


/* 3人画像のセクション */
.gld26_phbox{
  width:100%;
  max-width: 1000px;
  margin:auto;
  padding: 0 16px;
  position:relative;
}
.gld26_phbox > p{
  background-color:#FFF;
  font-size:1.25em;
  font-weight:bold;
  padding:30px 0;
  text-align:center;
  line-height:1.8;
  border-radius: 0 0 10px 10px;
}
.gld26_phmain{
  position: relative;
}
.gld26_phmain_ph img{
  aspect-ratio: 1000/490;
  object-fit: contain;
  width: 100%;
}
.gld26_phmain_txt{
  position: absolute;
  bottom: -24px;
  left: 50%;
  transform: translateX(-50%);
  width: max(310px,90%);
  max-width: 900px;
}
.gld26_phmain_txt img{
  aspect-ratio: 900/100;
  object-fit: contain;
  width: 100%;
}
.gld26_maincaption {
  background-color: #FAF5BD;
  padding: clamp(0.75rem, -1.284rem + 7.57vw, 2.5rem);/* 12-40 430-800 */
  padding-top: clamp(2.5rem, 1.673rem + 3.08vw, 3rem);/* 40-48 430-690 */
  border-radius: 0 0 8px 8px;
}
.gld26_maincaption_ttl{
  color: #004354;
  font-size: clamp(0.875rem, 0.149rem + 2.7vw, 1.5rem);/* 14-24 430-800 */
  font-weight: bold;
  display: block;
  text-align: center;
}
.gld26_maincaption p{
  color: #004354;
  font-size: clamp(0.875rem, 0.584rem + 1.08vw, 1.125rem);/* 14-18 430-800 */
  font-weight: bold;
  line-height: calc(38/18);
  padding-top: 12px;
}


/* スライダー */
.gld26_slider {
  width: 100vw;
  overflow: hidden;
  margin-top: 32px;
  margin-left: calc(50% - 50vw); 
}
.gld26_slider .slick-slide {
  width: 600px!important;
}
.gld26_slick img {
  width: 600px;
  height: 100%;
  object-fit: cover; 
  display: block;
}


/* コメント */
.gld26_msgbox{
  margin-top: 32px;
  padding: 0 8px;
}
.gld26_msghd{
  max-width: clamp(11.25rem, 0.5rem + 40vw, 17.75rem);/* 180-284 430-690 */
  margin-inline: auto;
}
.gld26_msghd img{
  aspect-ratio: 284/54;
  object-fit: contain;
  width: 100%;
}
.gld26_msgcontent{
  margin-top: 16px;
}
.gld26_comphpc{
  max-width: 946px;
  margin-inline: auto;
  padding-right:48px;
}
.gld26_comphpc img{
  aspect-ratio: 946/250;
  object-fit: contain;
  width: 100%;
}
.gld26_coment_ph_sp{
  display: none;
}
.gld26_msgflxbox {
  max-width: 1154px;
  margin-inline: auto;
  display: flex;
  justify-content: center;
  gap: 12px 16px;
}
.gld26_msgflxbox >* {
  width: calc((100% - 32px)/3);
  display: flex;
}
.gld26_coment_content{
  background-color: #FFFFFF;
  border: 3px solid #F9C67B;
  border-radius: 8px;
  padding: clamp(12px,1.8vw,24px);
}
span.gld26_coment_name{
  color: #A86500;
  font-size: clamp(1.0625rem, 0.9591rem + 0.3846vw, 1.125rem);/* 17-18 430-690 */
  font-weight: bold;
}
.gld26_coment_txt{
  font-size: clamp(0.875rem, 0.668rem + 0.77vw, 1rem);/* 14-16 430-690 */
  line-height: calc(26/16);
  padding-top: 8px;
}


/*--  SNSバナー --*/
.gld26_snsbnr{
  padding:84px 0;
  max-width:780px;
  width:100%;
  margin:auto;
}
.gld26_snsbnr ul{
  display:flex;
  justify-content:space-between;
}
.gld26_snsbnr ul li{
  max-width:370px;
  width:100%;
}
.gld26_snsbnr ul li img{
  width:100%;
}
.gld26_snsbnr ul li img:hover,
.gld26_back img:hover{
  transform: translate(1px,1px);
}
.gld26_back{
  text-align:center;
  width:100%;
  max-width:500px;
  margin:auto;
}
.gld26_back img{
  width:100%;
  max-width:500px;
  display:block;
  margin:auto;
}

.gld26_videoarea{
  width:100%;
  max-width:640px;
  margin-inline: auto;
  margin-top: 32px;
}


@media screen and (max-width: 800px){
  .gld26_wrap{
    background-image: url(../img/golden2026/bg_head01_sp@2x.webp);
    background-position:center top;
    padding-bottom: 200px;
  }


  /* TOPロゴ */
  .gld26_mainImg img{
    width:100%;
  }


  /* 3人画像のセクション */
  .gld26_maincaption p{
    font-weight: normal;
  }


  /* スライダー */
  .gld26_slick .slick-slide,
  .gld26_slick img {
    width: max(160px, 54vw) !important;
  }


  /* コメント */
  .gld26_comphpc{
    display: none;
  }
  .gld26_coment_ph_sp{
    display: block;
    margin-inline: auto;
  }
  .gld26_msgflxbox {
    flex-direction: column;
  }
  .gld26_msgflxbox >*{
    width: 100%;
    margin-inline: auto;
    display: block;
  }
  .gld26_coment_content{
    padding: 24px;
  }
  .gld26_coment_hase {
    order: 1;
  }
  .gld26_coment_hase .gld26_coment_ph_sp{
    max-width: 324px;
  }
  .gld26_coment_hase img{
    aspect-ratio: 324/216;
    object-fit: contain;
    width: 100%;
  }
  .gld26_coment_wata {
    order: 3;
  }
  .gld26_coment_wata .gld26_coment_ph_sp{
    max-width: 292px;
  }
  .gld26_coment_wata img{
    aspect-ratio: 292/240;
    object-fit: contain;
    width: 100%;
  }
  .gld26_coment_nishi {
    order: 0;
  }
  .gld26_coment_nishi .gld26_coment_ph_sp{
    max-width: 372px;
  }
  .gld26_coment_nishi img{
    aspect-ratio: 372/276;
    object-fit: contain;
    width: 100%;
  }
  

  /*--  SNSバナー --*/
  .gld26_snsbnr{
    padding-top:54px;
    padding-bottom:32px;
  }
  .gld26_snsbnr ul{
    display:block;
  }  
  .gld26_snsbnr ul li{
    margin:0 auto 16px;
  }
  .gld26_back{
    width:80%;
    margin:auto;
  }  
  #tss_gototop{ 
    bottom: 100px;
  }
}



