/* CSS Document */
/**/
#hiiragi, #kodemari, #honkan {
  scroll-margin-top: 60px;
}
/* ===== ページタイトル ===== */
#room-title img {
  /* max-width: 240px; */
  filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.6));
  width: clamp(180px, 14%, 240px);
}
#room-title.rk-page-title {
  background-image: url("https://m-ine.net/ryokan-miki/img/room/Rooms2.jpg");
}

/* ===== 一覧（3カラム） ===== */
.room-list-title1 {
  display: block;
  margin: 0 auto 70px;
}
.room-list-title2 {
  display: block;
  margin: 0 auto 35px;
}
.loom-list-ul {
  max-width: 1136px;
  width: 60%;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 50px;
  margin: 0 auto 75px;
}
.loom-list-ul img { width: 100%; }
.loom-list-hr {
  width: 87%;
  color: #3c2714;
  background-color: #3c2714;
  height: 1px;
}
.hr-bottom { height: 140px; }

/* ===== ルームタイプ共通 ===== */
.room-type { overflow: hidden; }
.room-type-title {
  display: block;
  max-width: 200px;
  width: 10.4%;
  margin: 69px auto;
}
.room-type-title2 {
  display: block;
  max-width: 341px;
  width: 27%;
  margin: 69px auto;
}
.room-type-title3 {
  display: block;
  max-width: 502px;
  width: 26.5%;
  margin: 69px auto;
}

.room-type-img { width: 100%; margin-bottom: 50px; }
.room-type-img img { width: 100%; }

.room-type-img-listbox {
  display: grid;
  gap: 15px;
  grid-template-columns: 1fr 1fr 1fr;
  width: 67%;
  margin: 0 auto 50px;
  max-width: 1300px;
  padding-bottom: 60px;
}
.room-type-img-listbox-b {
  display: grid;
  gap: 35px;
  grid-template-columns: 1fr 1fr;
  width: 67%;
  margin: 0 auto 50px;
  max-width: 1300px;
  padding-bottom: 60px;
}
.room-type-img-listbox div img,
.room-type-img-listbox-b div img { width: 100%; }

.room-type-txt1 {
  display: block;
  margin: auto;
  padding-bottom: 40px;
}
.room-type-txt2 {
  display: block;
  margin: auto;
  padding-bottom: 170px;
  width: 86%;
  max-width: 1149px;
}

/* 本館・旧館の下段画像幅 */
.room-type-img-listbox-b .room-type-img-listbox11,
.room-type-img-listbox-b .room-type-img-listbox22 {
  width: 78%;
  margin: 10px auto;
  display: block;
}
  .room2-wrap {
    width: 100%;
    max-width: 1920px; /* 必要なら上限を設定 */
    margin: 0 auto;
  }
  .room2-wrap img {
    display: block;
    width: 100%;
    height: auto;
  }

/* 縦積み：横幅100%でそのまま表示 */
.room1-stack img{
  display:block;
  width:100%;
  height:auto;
}

/* r5：元幅比そのままで横一列＝合計100%にフィット */
.room1-r5{
  display:grid;
    background-color: #E8E1D9;
  /* 578 / 532 / 64 / 532 / 64 / 532 / 578 の比率 */
  grid-template-columns: 578fr 532fr 64fr 532fr 64fr 532fr 578fr;
  width:100%;
}
.room1-r5 img{
  display:block;
  width:100%;
  height:auto; /* 元の高さが同じなので自然に揃う */
}

/* （必要なら）隙間をつけたいときは gap を指定
.room1-r5{ gap:8px; }
*/

