@charset "utf-8";
/* CSS Document */


/* スライダー本体 */
.slider {
  position: relative;
  overflow: hidden;
    /*height: 100vh;*/
    aspect-ratio: 1920 / 945;
    
}
/* アスペクト比（画像比率に合わせて調整してね） */
.slider::before {
  content: "";
  display: block;
  padding-top: 40%; /* ここを画像の縦横比に合わせて変更 */
}
/* 画像3枚を重ねてフェード */
/* 画像3枚を重ねてクロスフェード */
.slider img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  animation: sliderFade 12s infinite;
}

/* 開始タイミング */
.slider img:nth-child(1) { animation-delay: 0s; }
.slider img:nth-child(2) { animation-delay: 4s; }
.slider img:nth-child(3) { animation-delay: 8s; }

@keyframes sliderFade {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }   /* ゆっくりフェードイン */
  40% {
    opacity: 1;
  }   /* 表示を長めにキープ */
  60% {
    opacity: 0;
  }   /* 次の画像と重なりながらフェードアウト */
  100% {
    opacity: 0;
  }
}
/*sliderココまで*/
            .psi1 img,.psi2 img,.psi3 img{width: 100%;}
            .psi1{
                top: -30.0%;
                left: 15.5%;
                width: 50%;
                z-index: 2;
            }
            
            .psi2{
                width: 17.8%;
                left: 50%;
                transform: translateX(-50%);
            }
            .psi3{
                    top: 76.8%;
    left: 19.9%;
    width: 12.7%;
            }
            .psi4{
                 top: 76.4%;
    left: 52%;
    width: 12.7%;
            }
.psi4 img{
    width: 100%;
}


    /* 共通：画像は1920幅想定。PCは最大1920で中央寄せ、スマホは幅100% */


/* 画像パス（必要なら ../img/index/ とかに調整） */
.top-sec--01{ /*background-image: url("../img/index/top_r1_c1.png");*/  aspect-ratio: 1920 / 945; overflow: hidden;}
.top-sec--02{ background-image: url("../img/index/top_r2_c1.png");  aspect-ratio: 1920 / 283; }
.top-sec--03{ /*background-image: url("../img/index/top_r3_c1.png");*/  aspect-ratio: 1920 / 379; }
.top-sec--04{ /*background-image: url("../img/index/top_r4_c1.png");*/  aspect-ratio: 1920 / 73;  }
.top-sec--05{ background-image: url("../img/index/top_r5_c1.png");  aspect-ratio: 1920 / 871; }
.top-sec--06{ background-image: url("../img/index/top_r6_c1.png");  aspect-ratio: 1920 / 697; }
.top-sec--07{ background-image: url("../img/index/top_r7_c1.png");  aspect-ratio: 1920 / 206; }
.top-sec--08{ background-image: url("../img/index/top_r8_c1.png");  aspect-ratio: 1920 / 1283;}
.top-sec--09{ background-image: url("../img/index/top_r9_c1.png");  aspect-ratio: 1920 / 1275;}
.top-sec--10{ background-image: url("../img/index/top_r10_c1.png"); aspect-ratio: 1920 / 1169;}
.top-sec--11{ background-image: url("../img/index/top_r11_c1.png"); aspect-ratio: 1920 / 718; }
.top-sec--12{ background-image: url("../img/index/top_r12_c1.png"); aspect-ratio: 1920 / 647; }
.top-sec--13{ background-image: url("../img/index/top_r13_c1.png"); aspect-ratio: 1920 / 1519;}
.top-sec--14{ background-image: url("../img/index/top_r14_c1.png"); aspect-ratio: 1920 / 560; }
.top-sec--15{ background-image: url("../img/index/top_r15_c1.png"); aspect-ratio: 1920 / 1035;}
.top-sec--16{ background-image: url("../img/index/top_r16_c1.png"); aspect-ratio: 1920 / 1886;}
.top-sec--17{ background-image: url("../img/index/top_r17_c1.png"); aspect-ratio: 1920 / 1322;}


.room-sec{ position: relative; }
          .gmap{
            width: 100%;
            height: 46%;
              margin-top: 20%;
          }
          .to-access{
              margin-top: 4.3%;
          }
          .to-access a{
              display: block;
              max-width: 245px;
              width: calc(100% * (245 / 1920));
              margin: auto;
          }
          .to-access a img{width: 100%;}

.card-textbox h3{
    font-size:  0.8vw!important;
    line-height: 1.8em!important;
}
.plan-card{
    text-decoration: none;
    
}
.plan-card:hover{
    opacity: 0.6;
}
.card-imgbox{
    margin-bottom: 10px;
}