@charset "utf-8";
/* *****************************************************************
スライダー
***************************************************************** */
.slider{
  position:relative;
  width:100%;
  height:100dvh;
  overflow:hidden;
}
.slides{
  width:100%;
  height:100%;
  position:relative;
  will-change:transform;
}
.slide_under .slider{
    height:auto;
    margin-top: 7.812vw;
}
.slide_under .slides::before{
    content: "";
    padding-top: 32.146%;
    display: block;
}
@media screen and (max-width: 850px) {
    .slider{
        height: auto;
    }
    .slides::before{
        content: "";
        padding-top: 60.078%;
        display: block;
    }
    .slide_under .slides::before {
        padding-top: 40%;
    }
}
@media screen and (max-width: 560px) {
    .slide_under .slides::before {
        padding-top: 80%;
    }
}
@media screen and (max-width: 460px) {
    .slide_under .slides::before {
        padding-top: 100%;
    }
}

/* ===============================
   各スライド共通
=============================== */
.slide{
  width:100%;
  height:100%;
  position:relative;
  flex-shrink:0;
}
.slide_under .slide{
    width: 85%;
    height: auto;
    margin: auto;
    border: 1px solid #ed6c00;
    display: flex;
    flex-wrap: wrap;
}

/* ===============================
   画像共通（img / picture 両対応）
=============================== */
.slide picture,
.slide img{
    width:100%;
    height:100%;
}
.slide img{
    object-fit:cover;
    display:block;
}
.slide_under .slide .photo{
    width: 47.8%;
    display: flex;
    align-items: center;
}
.slide_under .slide img{
    height:auto;
}
@media screen and (max-width: 700px) {
    .slide_under .slide .photo{
        width: 40%;
    }
}
@media screen and (max-width: 560px) {
    .slide_under .slide .photo{
        width: 54.794%;
        min-width: 200px;
        height: auto;
        display: block;
        margin: 0 auto;
    }
}

/* ===============================
   テキストレイヤー
=============================== */
.slide-txt{
    width: 52.421%;
    position:absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display:flex;
    align-items:center;
    justify-content:center;
    margin: auto;
    filter: drop-shadow(0 0 7px rgba(0,0,0,1));
    z-index:2;
}
.slide_under .slide .txt_area{
    width: 52.2%;
    display: flex;
    flex-direction: column;
    padding: 50px 40px 50px 0;
}
.slide_under .slide .txt_area h3{
    font-size: clamp(22px, 2.578vw, 33px);
    line-height: 1.4;
}
.slide_under .slide .txt_area h3 span{
    display: block;
    font-size: 58%;
    margin-bottom: 1em;
}
.slide_under .slide .txt_area p{
    font-size: clamp(14px, 1.64vw, 21px);
    line-height: 1.7;
    font-weight: 300;
    letter-spacing: .05em;
}
.slide_under .slide .txt_area .link_btn{
    margin-top: auto;
    margin-left: auto;
}
@media screen and (max-width: 1280px) {
    .slide_under .slide .txt_area{
        padding: 3.906vw 3.125vw 3.906vw 0;
    }
}
@media screen and (max-width: 850px) {
    .slide-txt{
        width: 90%;
        max-width: 500px;
    }
}
@media screen and (max-width: 700px) {
    .slide_under .slide .txt_area{
        width: 60%;
        padding: 1em 1em 1em 0;
    }
}
@media screen and (max-width: 560px) {
    .slide_under .slide .txt_area{
        width: 100%;
        padding: 0 1em 1em;
        margin-top: -8.219vw;
        text-align: center;
    }
    .slide_under .slide .txt_area .link_btn{
        margin-right: auto;
    }
}

/* ===============================
 ナビ関連
=============================== */
.slide-pagination{
  position:absolute;
  bottom:24px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:8px;
  z-index:10;
}
.slide-pagination button{
  width:auto;
  height:30px;
  border:none;
  background:rgba(255,255,255,.2);
  color:#fff;
  padding:0 10px;
  font-size:16px;
  cursor:pointer;
  border-radius:4px;
  transition:.3s;
}
.slide-pagination button.active{
  background:#fff;
  color:#000;
} 
.slide-nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:7.5%;
    height:100%;
    border:none;
    cursor:pointer;
    z-index:9;
    background-color: transparent;
}
.slide-nav img{
    max-width: 20px;
}
.slide-prev{left:0;}
.slide-next{right:0;}
@media screen and (max-width: 460px) {
    .slide-nav img{
        max-width: 12px;
    }
}

/* ===============================
   FADE モード
=============================== */
.slides.fade{
  display:block;
}
.slides.fade .slide{
  position:absolute;
  inset:0;
  opacity:0;
  pointer-events:none;
  transition:opacity 1.2s ease;
}
.slides.fade .slide.is-active{
  opacity:1;
  pointer-events:auto;
  z-index:1;
}
.slide_under .slides.fade .slide{
    transition:opacity .8s ease;
}

/* *****************************************************************
index
***************************************************************** */
.top_main{
    margin-bottom: 4.687vw;
}
@media screen and (max-width: 850px) {
}
@media screen and (max-width: 520px) {

}

/* *****************************************************************
 *スマホ
***************************************************************** */