/* ==========================================================================
   Royal Pita Maha — 軽量版スタイル（テンプレート・JS なし）
   基準：html 20px（1rem = 20px）／本文 16px。現行テンプレートの数値に合わせている
   ========================================================================== */

:root {
  --red: #b72619;          /* ブランドカラー（見出し強調・主ボタン・リンク） */
  --red-hover: #9a1f14;
  --reserve: #b72619;      /* ヘッダー「宿泊予約」ボタン */
  --purple: #5f69c0;       /* 「詳しく見る」ボタン（白文字のコントラスト確保のため現行 #747ed1 より少し濃い） */
  --leaf: #7cb798;
  --ink: #343f52;          /* 見出し */
  --text: #60697b;         /* 本文 */
  --muted: #6b6b6b;        /* 補足テキスト */
  --soft-red: #f5e0de;     /* チェックマークの丸背景 */
  --bg: #fefefe;
  --bg-ash: #f4f5f6;
  --bg-gray: #f6f7f9;
  --radius: .4rem;
  --shadow: 0 0 1.25rem rgba(30, 34, 40, .04);
  --shadow-lg: 0 .25rem 1.75rem rgba(30, 34, 40, .07);
  --mincho: "Hiragino Mincho ProN", "Yu Mincho", YuMincho, "Noto Serif JP", "Noto Serif CJK JP", "BIZ UDPMincho", serif;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  font-size: 125%;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--mincho);
  font-size: .8rem;
  font-weight: 500;
  line-height: 2;              /* 本文の行間。リスト・見出し・ボタンは個別に指定 */
  color: var(--text);
  background: var(--bg);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; vertical-align: middle; }
p { margin: 0 0 1rem; }
ul { margin: 0; padding: 0; list-style: none; }
figure { margin: 0; }
a { color: var(--red); text-decoration: none; }
a:hover { color: var(--red-hover); }
a:focus-visible, label:focus-visible, summary:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }

h1, h2, h3, h4 {
  margin: 0;
  font-weight: 500;
  line-height: 1.6;            /* 見出しは文字が大きい分、行間を広めに取る */
  text-wrap: balance;          /* 折り返すときに1文字だけ次の行に残さない */
  color: var(--ink);
}
h3 { font-size: 1.1rem; }
h4 { font-size: .9rem; }

/* 見出しの下の余白ルール
   見出しは行間 1.6 に加えて、必ず下に余白を取る（次の行と詰まらせない）。
   文字が大きい見出しほど余白も大きくする。個別のクラスで 0 に詰めないこと。
   例外はカードの末尾に来る見出しだけ（.card__body > :last-child で 0 になる）。 */
h1 { margin-bottom: 1.2rem; }
h2 { margin-bottom: 1.1rem; }
h3 { margin-bottom: .9rem; }
h4 { margin-bottom: .6rem; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ---------- レイアウト ---------- */
.container {
  width: 100%;
  margin-inline: auto;
  padding-inline: .75rem;
}
@media (min-width: 576px)  { .container { max-width: 540px; } }
@media (min-width: 768px)  { .container { max-width: 720px; } }
@media (min-width: 992px)  { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }

.section { padding-block: 2.5rem; }
.section--tight { padding-block: 1.5rem; }
.section--flush-top { padding-top: 0; }
@media (min-width: 768px) {
  .section { padding-block: 4.5rem; }
  .section--tight { padding-block: 2rem; }
  .section--flush-top { padding-top: 0; }
}
/* 白いボックスが続くセクション：前のボックスとの間を、同じセクション内のボックス同士と同じ間隔（30px）にする。
   前のセクションに .section--flush-bottom、後ろのセクションに .section--stack を付ける */
.section--flush-bottom { padding-bottom: 0; }
.section--stack { padding-top: 1.5rem; }
/* リーフから始まるセクション：前のセクションとの間が空きすぎないよう、上の余白だけ詰める */
.section--leaf { padding-top: 1.25rem; }
@media (min-width: 768px) { .section--leaf { padding-top: 2.25rem; } }
.bg-ash { background: var(--bg-ash); }
.bg-white { background: #fff; }
.bg-gray { background: var(--bg-gray); }
.bg-black { background: #000; }

.narrow { max-width: 66.6667%; margin-inline: auto; }
.narrow-9 { max-width: 75%; margin-inline: auto; }
.narrow-10 { max-width: 83.3333%; margin-inline: auto; }
@media (max-width: 991.98px) { .narrow, .narrow-9, .narrow-10 { max-width: 100%; } }

.intro { text-align: center; margin-bottom: 2rem; }
.intro p:last-child { margin-bottom: 0; }
.intro p a { text-decoration: underline; text-underline-offset: 3px; }   /* 文中リンクは色だけに頼らない */

.center { text-align: center; }
.title { font-size: clamp(1.2rem, 6vw, 1.4rem); }        /* PC 28px。スマホでは画面幅に合わせて少し小さく */
.eyebrow { color: var(--red); font-size: .75rem; margin-bottom: .25rem; }
.muted { color: var(--muted); }
.small { font-size: .75rem; }
.red { color: var(--red); }
.lead { font-size: .9rem; line-height: 2; }
.nowrap { white-space: nowrap; }
.sp { display: none; }
@media (max-width: 767.98px) { .sp { display: inline; } }

.grid { display: grid; gap: 1rem; }
@media (min-width: 768px) {
  .grid--3 { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
  .grid--2 { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
}
/* iPad 縦（768〜991px）：3枚のカードは「1枚目を横幅いっぱい ＋ 残り2枚を2カラム」。1枚目の写真は横長に切り抜く */
@media (min-width: 768px) and (max-width: 991.98px) {
  .grid--3 > :first-child { grid-column: 1 / -1; }
  .grid--3 > :first-child .card__img { aspect-ratio: 2 / 1; }
}
@media (min-width: 992px) { .grid--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) and (max-width: 991.98px) { .grid--venue { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { .grid--venue { grid-template-columns: repeat(3, 1fr); gap: 1.5rem; } }
/* 会場名：マップの番号に合わせた丸囲み数字（白丸＋濃色の縁） */
.venue__name { display: flex; align-items: center; justify-content: center; gap: .45em; margin: 0; font-size: .9rem; }
.num { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1.5em; height: 1.5em; border: 1.5px solid var(--ink); border-radius: 50%; background: #fff; color: var(--ink); font: 700 .8em/1 system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif; }

/* ---------- リーフの飾り ---------- */
.leaf { display: block; width: 6rem; height: auto; aspect-ratio: 480 / 152; margin: 0 auto 1.75rem; }

/* ---------- ボタン ---------- */
.btn {
  display: inline-block;
  padding: .5rem 1.2rem;
  font: inherit;
  font-size: .7rem;            /* 14px：本文（16px）より小さく */
  line-height: 1.7;
  text-align: center;
  border: 2px solid transparent;
  border-radius: var(--radius);
  transition: transform .2s ease-in-out, box-shadow .2s ease-in-out, background-color .2s, color .2s;
}
.btn:hover { transform: translateY(-.15rem); box-shadow: 0 .25rem .75rem rgba(30, 34, 40, .15); }
.btn--pill { border-radius: 50rem; }
.btn--sm { padding: .4rem 1rem; font-size: .65rem; }
.btn--block { display: block; width: 100%; }
.btn--primary { background: var(--red); border-color: var(--red); color: #fff; }
.btn--primary:hover { color: #fff; }
.btn--outline { border-color: var(--red); color: var(--red); background: transparent; }
.btn--outline:hover { background: var(--red); color: #fff; }
.btn--white { background: #fff; border-color: #fff; color: var(--ink); }
.btn--white:hover { color: var(--ink); }
.btn--purple { background: var(--purple); border-color: var(--purple); color: #fff; padding: .3rem 1.4rem; }
.btn--purple:hover { color: #fff; }
.btn-row { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin: 0; }

/* ---------- カード ---------- */
.card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.card--lift { box-shadow: var(--shadow-lg); }
.card__img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.card__media { position: relative; overflow: hidden; }
.card__media img { transition: transform .35s ease; }
.card--lift:hover .card__media img { transform: scale(1.04); }
.card__body { flex: 1; display: flex; flex-direction: column; padding: 1.25rem; }
.card__body--sm { padding: 1rem; }
.card__body--lg { padding: 1.5rem; }
.card__body > :last-child { margin-bottom: 0; }
.card__foot { margin-top: auto; }
.card h3 { font-size: .9rem; }                       /* 18px */
.card h3.h-20 { font-size: 1rem; }
.card h3.h-21 { font-size: 1.05rem; }
@media (min-width: 768px) { .card__body--wide { padding-inline: 1.75rem; } }

/* 横並びカード（テキスト＋写真） */
.feature { padding: .75rem; }
.feature + .feature { margin-top: 1.5rem; }
.feature__grid { display: grid; gap: 1.5rem; align-items: center; }
.feature__img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--radius); }
.feature h3 { font-size: 1.1rem; }                   /* 22px */
@media (min-width: 768px) { .feature { padding: 2rem; } }
/* 2カラム（文章＋写真）は 992px から。iPad 縦（768〜991px）は1カラムで、文章の下に写真 */
@media (min-width: 992px) { .feature__grid { grid-template-columns: 1fr 1fr; } }

/* 白いボックスの中で横に並べる列（料金など）。列の間は細い線で区切る */
.cols { display: grid; text-align: center; }
.cols__item { padding: 1.25rem .5rem; }
.cols__item > :last-child { margin-bottom: 0; }
.cols__item + .cols__item { border-top: 1px solid rgba(30, 34, 40, .08); }
@media (min-width: 768px) {
  .cols { grid-template-columns: repeat(3, 1fr); }
  .cols__item { padding: .5rem 1rem; }
  .cols__item + .cols__item { border-top: 0; border-left: 1px solid rgba(30, 34, 40, .08); }
}

/* ---------- チェックリスト ---------- */
.checks li { position: relative; padding-left: 1.5rem; line-height: 1.7; }
.checks li + li { margin-top: .35rem; }
.checks--loose li + li { margin-top: .75rem; }
.checks li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .2rem;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: var(--soft-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23b72619' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M5.5 10.5l3 3 6-6.5'/%3E%3C/svg%3E") center / 100% no-repeat;
}

/* ---------- ヘッダー ---------- */
/* 常に画面上部に固定。スクロール連動に未対応のブラウザ（少し前の Safari / iPad など）では最初から白背景で表示する */
.header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1020;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 0 1.25rem rgba(30, 34, 40, .06);
}
.header__in { display: flex; align-items: center; min-height: 4.4rem; }
.header__logo { display: block; flex-shrink: 0; line-height: 0; }
.header__logo img { width: 200px; height: 40px; }
.nav { margin-left: auto; }
.nav__list { display: flex; align-items: center; }
.nav__link {
  display: block;
  padding: .3rem 0;
  margin-inline: .7rem;
  color: inherit;
  font-size: .7rem;
  letter-spacing: .1rem;
  white-space: nowrap;                 /* メニュー項目は途中で改行させない */
  transition: opacity .2s;
}
.nav__link:hover { color: inherit; opacity: .7; }
.nav__link--reserve {
  margin-right: 0;
  padding: .45rem .9rem;
  background: var(--reserve);
  color: #fff;
  letter-spacing: .2rem;
}
.nav__link--reserve:hover { color: #fff; opacity: 1; background: var(--red-hover); }
.nav__toggle, .nav__close, .nav__backdrop, .nav__sp { display: none; }

/* iPad 横向きなど幅がせまい PC 表示：メニューを少し詰めて1行に収める */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .header__logo img { width: 170px; height: 34px; }
  .nav__link { margin-inline: .4rem; font-size: .65rem; letter-spacing: .04rem; }
  .nav__link--reserve { padding-inline: .7rem; letter-spacing: .1rem; }
}

/* 対応ブラウザでは、HERO の上では透明、スクロールすると白背景に変わる（JS 不使用） */
@supports (animation-timeline: scroll()) {
  .header {
    background: transparent;
    color: #fff;
    box-shadow: none;
    animation: header-solid linear both;
    animation-timeline: scroll(root);
    animation-range: 0 140px;
  }
  @keyframes header-solid {
    to { background: #fff; color: var(--ink); box-shadow: 0 0 1.25rem rgba(30, 34, 40, .06); }
  }
}

@media (max-width: 991.98px) {
  .header__in { min-height: 3.6rem; }
  .nav__toggle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    width: 44px;
    height: 44px;
    margin-left: auto;
    cursor: pointer;
  }
  .nav__toggle span { display: block; width: 24px; height: 2px; margin-left: auto; background: currentColor; border-radius: 2px; }
  .nav {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1040;
    width: 15rem;
    max-width: 85vw;
    margin: 0;
    padding: 3.5rem 1.5rem 1.5rem;
    background: #1e2228;
    color: #fff;
    overflow-y: auto;
    visibility: hidden;
    transform: translateX(-100%);
    transition: transform .3s ease-in-out, visibility .3s;
  }
  .nav__list { flex-direction: column; align-items: stretch; gap: 1rem; }
  .nav__link { margin: 0; padding: .4rem 0; font-size: .8rem; }
  .nav__link--reserve { padding: .6rem; text-align: center; }
  .nav__pc { display: none; }
  .nav__sp { display: block; }
  .nav__close {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: .5rem;
    right: .5rem;
    width: 44px;
    height: 44px;
    font-size: 1.4rem;
    line-height: 1;
    color: #fff;
    cursor: pointer;
  }
  .nav__backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 1030;
    background: rgba(30, 34, 40, .5);
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s, visibility .3s;
  }
  #nav-open:checked ~ .nav { visibility: visible; transform: none; }
  #nav-open:checked ~ .nav__backdrop { opacity: 1; visibility: visible; }
  #nav-open:focus-visible ~ .nav__toggle { outline: 2px solid currentColor; outline-offset: 2px; }
}

/* ---------- ページ内サブナビ（HERO の直下。スクロールすると上部に固定される。JS なし） ----------
   固定ヘッダーのすぐ下に固定される */
.subnav {
  position: sticky;
  top: 0;
  z-index: 1010;
  background: #fff;
  border-bottom: 1px solid rgba(30, 34, 40, .08);
  box-shadow: 0 .25rem 1.25rem rgba(30, 34, 40, .05);
}
.subnav__track {
  display: flex;
  gap: 0 .25rem;
  max-width: 1320px;
  margin-inline: auto;
  padding-inline: .5rem;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.subnav__track::-webkit-scrollbar { display: none; }
.subnav a, .subnav label {
  flex: 0 0 auto;
  padding: .5rem .6rem;
  color: var(--ink);
  font-size: .7rem;
  letter-spacing: .06rem;
  white-space: nowrap;
}
.subnav a:hover, .subnav label:hover { color: var(--red); }
@media (min-width: 992px) {
  .subnav__track { justify-content: center; gap: 0 1rem; }
}
.subnav { top: 3.6rem; }                 /* 固定ヘッダーのすぐ下に止まる */
@media (min-width: 992px) { .subnav { top: 4.4rem; } }
/* サブナビの移動先：固定ヘッダーとサブナビに隠れない位置で止める */
#news, #about, #villas, #benefits, #home-rate, #dining, #spa, #wedding { scroll-margin-top: 6.9rem; }
/* リーフから始まるセクションは少し手前で止め、リーフがサブナビの飾りではなく区切りに見えるようにする */
#home-rate, #dining, #spa { scroll-margin-top: 8.6rem; }

/* ---------- ヒーロー ---------- */
.hero {
  position: relative;
  display: grid;
  color: #fff;
  text-align: center;
  background: #1e2228;
  isolation: isolate;
}
.hero__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  /* 全体に 40% の暗幕。ロゴとメニューを読みやすくするため上端だけ少し濃くしている */
  background: linear-gradient(rgba(30, 34, 40, .62), rgba(30, 34, 40, .4) 8rem);
}
.hero__in { padding-block: 8rem 6rem; max-width: 43rem; margin-inline: auto; }
.hero h1 { margin: 1.5rem 0 1.2rem; color: #fff; font-size: clamp(1.5rem, 8.6vw, 1.8rem); line-height: 1.7; }
.hero .lead { margin-bottom: 1.5rem; }
.hero .btn-row { margin-bottom: 1.5rem; }
.hero__note { margin: 0; font-size: .75rem; }
@media (min-width: 768px) { .hero__in { padding-block: 12.5rem 8rem; } }

/* ---------- HERO 直下：Special Offers & News（JS なしの横スライド） ----------
   自動では切り替わらない。操作方法は入力機器で2通りに分ける（ブラウザの種類では分けない）。
   ・マウス／トラックパッドの環境：ラジオボタン方式。矢印と丸ボタンは <label>。
     スクロールもアンカーリンクも使わないので、どのブラウザでも同じ動きになる
   ・タッチの環境（スマホ・タブレット）：指で横スワイプ。次のカードが少し見える。丸ボタンは出さない
   ※ CSS のスクロールマーカー（::scroll-marker）は Safari で一部の丸ボタンが効かなかったため使っていない */
.offers { padding-block: 3rem 1.75rem; }
.offers > .container { position: relative; }
.offers__title { margin-bottom: .9rem; text-align: center; color: var(--red); font-size: .7rem; letter-spacing: .18rem; text-transform: uppercase; }
.slider {
  --gap: .75rem;
  display: flex;
  gap: var(--gap);
  margin: 0 -.75rem;
  padding: .5rem .75rem 1.5rem;         /* カードの影が切れないための余白 */
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.slider::-webkit-scrollbar { display: none; }
.slide { flex: 0 0 92%; display: flex; scroll-snap-align: center; }   /* 92%：次のカードが少し見える */
.slide > .card { flex: 1; }
.slider__radio, .slider__arrows, .slider__dots { display: none; }

.offer { text-align: center; }
/* 見出し枠：上に赤の英字ラベル、下に写真 */
.offer__label { padding: 1rem 1.25rem; background: #f9f1ee; line-height: 1.6; }   /* 淡い赤みの地 */
.offer__img { display: block; width: 100%; height: 11.25rem; object-fit: cover; }
.offer__tag { margin-bottom: .4rem; color: var(--red); font-size: .7rem; letter-spacing: .1rem; text-transform: uppercase; }
.offer__name { margin: 0; color: var(--red); font-size: 1rem; letter-spacing: .05rem; white-space: nowrap; }
.offer__main { padding: 1.75rem 1.25rem 1.25rem; }
.offer h3 { font-size: 1.15rem; margin-bottom: .5rem; }
.offer .checks { display: inline-block; margin-top: .25rem; text-align: left; }
.offer__foot { margin-top: 1rem; }
.offer__foot p { margin-bottom: .4rem; }
.offer__cta { display: inline-block; padding: .35rem 0; }

@media (min-width: 768px) {
  /* 左右の余白（padding）の内側いっぱいにカードを置く＝中央に来る。前後のカードは余白部分に少し見える */
  .slide { flex-basis: 100%; }
  .slider { --gap: 1.5rem; padding-inline: calc(8.3333% + .75rem); }
}
@media (min-width: 992px) {
  /* 2カラム：左に英字ラベル、右にキャンペーン内容をすべてまとめる */
  .offer { display: grid; grid-template-columns: 15rem 1fr; align-items: center; text-align: left; }
  /* 左枠：上1/3＝ラベル、下2/3＝写真（写真はカードの高さを押し広げない） */
  .offer__head { position: relative; align-self: stretch; display: flex; border-right: 1px solid rgba(30, 34, 40, .08); }
  .offer__label { display: flex; flex-direction: column; justify-content: center; width: 100%; height: 33.334%; padding: .5rem 1.25rem; }
  .offer__img { position: absolute; left: 0; bottom: 0; height: 66.666%; }
  .offer__main { padding: 2.25rem 2rem 1.75rem; }
  .offer .checks { display: block; }
  .offer__foot { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem 1.5rem; flex-wrap: wrap; }
  .offer__foot p { margin: 0; }
  .offer__cta { margin-left: auto; }
}

/* 矢印ボタン */
.slider__arrow {
  position: absolute;
  top: calc(50% - 1.1rem);
  z-index: 2;
  width: 2.2rem;
  height: 2.2rem;
  border: 0;
  border-radius: 50%;
  background: #fff;
  box-shadow: var(--shadow-lg);
  color: var(--ink);
  font: inherit;
  font-size: .9rem;
  line-height: 2.2rem;
  text-align: center;
  cursor: pointer;
}

/* ---- ラジオボタン方式（マウス／トラックパッドの環境） ---- */
@media (hover: hover) and (pointer: fine) {
  .slider__radio { display: block; position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
  .slider { overflow: hidden; overflow: clip; scroll-snap-type: none; }
  /* 表示中のカードと、その前後のカードだけを見せる（前後は両端に少し見える）。
     それ以外は隠し、画面外のリンクにキーボードのフォーカスが当たらないようにする */
  .slide { visibility: hidden; transition: transform .45s ease, visibility 0s .45s; }
  #offer-r2:checked ~ .slider .slide { transform: translateX(calc(-1 * (100% + var(--gap)))); }
  #offer-r3:checked ~ .slider .slide { transform: translateX(calc(-2 * (100% + var(--gap)))); }
  #offer-r4:checked ~ .slider .slide { transform: translateX(calc(-3 * (100% + var(--gap)))); }
  #offer-r5:checked ~ .slider .slide { transform: translateX(calc(-4 * (100% + var(--gap)))); }
  #offer-r1:checked ~ .slider .slide:nth-child(1),
  #offer-r2:checked ~ .slider .slide:nth-child(2),
  #offer-r3:checked ~ .slider .slide:nth-child(3),
  #offer-r4:checked ~ .slider .slide:nth-child(4),
  #offer-r5:checked ~ .slider .slide:nth-child(5),
  #offer-r1:checked ~ .slider .slide:nth-child(2),
  #offer-r2:checked ~ .slider .slide:nth-child(1),
  #offer-r2:checked ~ .slider .slide:nth-child(3),
  #offer-r3:checked ~ .slider .slide:nth-child(2),
  #offer-r3:checked ~ .slider .slide:nth-child(4),
  #offer-r4:checked ~ .slider .slide:nth-child(3),
  #offer-r4:checked ~ .slider .slide:nth-child(5),
  #offer-r5:checked ~ .slider .slide:nth-child(4) { visibility: visible; transition: transform .45s ease, visibility 0s; }

  .slider__dots { display: flex; justify-content: center; gap: .25rem; }
  .slider__dots label { display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; cursor: pointer; }
  .slider__dots label::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: #b9bec7; }
  .slider__dots label:hover::before { background: var(--red); }
  #offer-r1:checked ~ .slider__dots label:nth-child(1)::before,
  #offer-r2:checked ~ .slider__dots label:nth-child(2)::before,
  #offer-r3:checked ~ .slider__dots label:nth-child(3)::before,
  #offer-r4:checked ~ .slider__dots label:nth-child(4)::before,
  #offer-r5:checked ~ .slider__dots label:nth-child(5)::before { width: .6rem; height: .6rem; background: var(--red); }
  #offer-r1:focus-visible ~ .slider__dots label:nth-child(1),
  #offer-r2:focus-visible ~ .slider__dots label:nth-child(2),
  #offer-r3:focus-visible ~ .slider__dots label:nth-child(3),
  #offer-r4:focus-visible ~ .slider__dots label:nth-child(4),
  #offer-r5:focus-visible ~ .slider__dots label:nth-child(5) { outline: 2px solid var(--red); outline-offset: -2px; }

  .slider__arrows { display: block; }
  .slider__arrow { display: none; }
  #offer-r1:checked ~ .slider__arrows .a1,
  #offer-r2:checked ~ .slider__arrows .a2,
  #offer-r3:checked ~ .slider__arrows .a3,
  #offer-r4:checked ~ .slider__arrows .a4,
  #offer-r5:checked ~ .slider__arrows .a5 { display: block; }
  .slider__arrow--prev { left: .75rem; }
  .slider__arrow--next { right: .75rem; }
  @media (prefers-reduced-motion: reduce) { .slide { transition: none; } }
}

/* ---------- 動画 ---------- */
.video { max-width: 760px; margin-inline: auto; }
.video iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--radius); background: #000; }

/* ---------- 料金 ---------- */
.price { margin: 0; color: var(--ink); font-size: 1.75rem; font-weight: 700; line-height: 1.2; }
.price small { margin-left: .15em; font-size: .8rem; font-weight: 500; color: var(--muted); }
.price__cur { margin-right: .08em; font-size: .68em; }
.price--red { color: var(--red); margin-bottom: .25rem; }
.price-old { margin-bottom: .25rem; color: var(--muted); }
.special { margin-bottom: 1.5rem; }
.special__tag { margin-bottom: .5rem; color: var(--red); font-size: 1.1rem; font-weight: 700; }
.special h2, .special h3 { font-size: 1.3rem; margin-bottom: 1rem; }
.mt-2 { margin-top: 2rem; }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 1.5rem; }

/* ---------- サウザンドキャンドル ---------- */
.tc-price { font-size: 1.1rem; color: var(--ink); margin-bottom: 0; }
.tc-price span { font-size: .9rem; }
.tc-box { margin: 1.5rem 0 0; }
.tc-grid { display: grid; gap: 2rem; align-items: center; }
.tc-map figcaption { margin-top: .6rem; }
@media (min-width: 768px) { .tc-box { margin-top: 2rem; } }
@media (min-width: 992px) { .tc-grid { grid-template-columns: 1fr 1fr; gap: 3rem; } }   /* iPad 縦は1カラム */
.map { display: block; }
.map img { width: 100%; border-radius: var(--radius); }

/* ---------- ウェディング ---------- */
.group { border-top: 1px solid rgba(30, 34, 40, .08); padding-block: 2rem; }
.group__logo { display: block; width: 220px; height: auto; margin: .75rem auto 1rem; }
.group h2 { margin-bottom: 1rem; color: var(--red); font-size: clamp(1.3rem, 5.5vw, 1.6rem); line-height: 1.65; }
.group .lead { font-size: clamp(.85rem, 4vw, 1.1rem); margin-bottom: 1rem; }
.group__intro { margin-bottom: 2.5rem; }
.wed-grid { display: grid; gap: 1.5rem; }
@media (min-width: 768px) {
  .wed-grid { grid-template-columns: 1fr 1fr; }
  .wed-grid > :first-child { grid-column: 1 / -1; }
}
@media (min-width: 1200px) {
  .wed-grid { grid-template-columns: repeat(3, 1fr); }
  .wed-grid > :first-child { grid-column: auto; }
}
.wed h3 { font-size: 1.1rem; margin-bottom: 1rem; }
.wed__block { margin-bottom: 1rem; }
.wed__block p { margin: 0; }
.badge {
  position: absolute;
  top: 1rem;
  left: 1rem;
  padding: .25rem .8rem;
  font-size: .65rem;
  letter-spacing: .08rem;
  color: #fff;
  border-radius: 50rem;
  background: var(--red);
}
.badge--classic { background: #3f7a5c; }
.badge--heritage { background: var(--ink); }

/* ---------- フッター ---------- */
.footer { background: var(--bg-gray); padding: 1.25rem 0 .75rem; font-size: .65rem; color: var(--muted); line-height: 2; }
.footer p { margin-bottom: .5rem; }
.footer a { text-decoration: underline; text-underline-offset: 2px; }
.footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; }
.footer__social { display: flex; flex-wrap: wrap; gap: .25rem 1rem; }
.footer__social a { display: inline-flex; align-items: center; min-height: 44px; color: var(--muted); }
.footer__copy { margin: 0; font-size: .6rem; }
@media (max-width: 575.98px) { .footer__bottom { flex-direction: column-reverse; text-align: center; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}
@media (min-width: 992px) { #nav-open { display: none; } }

/* サウザンドキャンドル：価格の下に6会場、その下に内容ボックス */
.tc-venues { margin-block: 2rem; }

/* ==========================================================
   下層ページ共通
   ========================================================== */
/* HERO 写真のないページ：ヘッダーは最初から白背景（スクロール連動なし） */
.header--solid { background: #fff; color: var(--ink); box-shadow: 0 0 1.25rem rgba(30, 34, 40, .06); animation: none; }
/* ページタイトルの帯（固定ヘッダーの高さぶん下げる） */
.page-head { margin-top: 3.6rem; padding-block: 1.75rem; background: var(--bg-ash); text-align: center; }
.page-head__title { margin: 0; font-size: clamp(1.3rem, 6.5vw, 1.75rem); }
@media (min-width: 768px) { .page-head { padding-block: 2.5rem; } }
@media (min-width: 992px) { .page-head { margin-top: 4.4rem; } }
/* サブナビの移動先（個別指定のない id）。旧 URL 用の空アンカーも同じ位置で止まる */
main [id] { scroll-margin-top: 6.9rem; }
.anchor { display: block; height: 0; }
.leaf + .card { margin-top: 0; }

/* ---------- ヴィラ一覧（villa.html） ---------- */
.villa__name { font-size: 1.1rem; margin-bottom: .9rem; }
/* 写真は拡大なし（.villa__frame）。レイアウト図だけクリックで大きい画像を開く（.villa__link） */
.villa__link, .villa__frame { display: block; overflow: hidden; border-radius: var(--radius); }
.villa__link { cursor: zoom-in; }
.villa__img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .35s ease; }
.villa__link:hover .villa__img { transform: scale(1.04); }
.villa__img--plan { aspect-ratio: auto; height: auto; object-fit: contain; }   /* レイアウト図は切り抜かず全体を見せる */
.villa__photos { display: grid; gap: 1.5rem; margin-block: 1.5rem; }
@media (min-width: 768px) { .villa__photos { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575.98px) { .villa__layout { display: none; } }   /* レイアウト図は小さい画面では出さない（現行どおり） */
.section--leaf > .container > .leaf { margin-bottom: 2rem; }

/* ---------- 比較（どのヴィラがおすすめ？） ---------- */
.compare__btn { margin: .9rem 0 0; }
.table-wrap { margin-block: 2rem 1rem; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table { width: 100%; min-width: 44rem; border-collapse: collapse; text-align: center; white-space: nowrap; font-size: .75rem; }
.table th, .table td { padding: .75rem .9rem; border-bottom: 1px solid rgba(30, 34, 40, .1); }
.table th { color: var(--ink); font-weight: 500; }
.table thead th { border-bottom-color: rgba(30, 34, 40, .25); }
.table tbody th { text-align: left; }
/* 列ごとに文章量が違っても、料金とボタンの高さをそろえる */
.cols--align .cols__item { display: flex; flex-direction: column; }
.cols--align .price { margin-top: auto; }
.link-u { text-decoration: underline; text-underline-offset: 3px; }   /* 文中リンクは色だけに頼らない */

/* ---------- ヴィラ個別ページ（deluxe / royal / ayung） ---------- */
.page-head__sub { margin: .5rem 0 0; font-size: .8rem; }
.villa__wide { margin-bottom: 1.5rem; }
.villa__img--wide { aspect-ratio: 1920 / 1000; }
.villa__row { margin-bottom: 1.5rem; }
.villa__photos--last { margin-bottom: 0; }
/* 写真が奇数枚のときは、最後の1枚を横幅いっぱいにする */
@media (min-width: 768px) {
  .villa__photos > :last-child:nth-child(odd) { grid-column: 1 / -1; }
  .villa__photos > :last-child:nth-child(odd) .villa__img { aspect-ratio: 2 / 1; }
}
.amen { line-height: 2; }
.amen strong { color: var(--ink); }
.h-md { font-size: 1.1rem; margin-bottom: .6rem; }
.h-sm { font-size: .9rem; margin-bottom: .5rem; }
.grid--plain > :first-child { grid-column: auto !important; }      /* 写真のないカードは iPad 縦でも均等に並べる */
@media (min-width: 768px) and (max-width: 991.98px) { .grid--plain { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) and (max-width: 991.98px) { .grid--lg2 { grid-template-columns: 1fr; } }   /* 料金の2枚は 992px から横並び */
.grid--4 { grid-template-columns: 1fr; }
@media (min-width: 768px) { .grid--4 { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; } }
@media (min-width: 992px) { .grid--4 { grid-template-columns: repeat(4, 1fr); } }

/* 宿泊プランのカード */
.plan > p { margin-bottom: .5rem; }
.plan .price { margin-bottom: .4rem; }
.plan__line { color: var(--ink); }
.plan__em { color: var(--red); font-weight: 700; margin-bottom: .25rem !important; }
.plan .small { margin-bottom: 1rem; }
.plan__btns { display: flex; flex-wrap: wrap; gap: .5rem; margin: auto 0 0 !important; padding-top: 1rem; }
.btn--disabled { background: #e3e4e7; border-color: #e3e4e7; color: #6b6b6b; cursor: default; }
.btn--disabled:hover { transform: none; box-shadow: none; }

/* 予約特典のリンクタイル */
.tile { padding: 1.25rem 1rem; text-align: center; color: var(--text); transition: transform .2s; }
.tile:hover { color: var(--text); transform: translateY(-.15rem); }
.tile p { margin: 0; font-size: .75rem; }
.title__link { color: inherit; }
.title__link:hover { color: var(--red); }

/* よくある質問（details 要素。JS なしで開閉） */
.faq__item { border: 1px solid rgba(30, 34, 40, .1); border-radius: var(--radius); background: #fff; }
.faq__item + .faq__item { margin-top: .6rem; }
.faq__item summary { position: relative; padding: .9rem 2.6rem .9rem 1.1rem; color: var(--ink); font-size: .85rem; line-height: 1.6; cursor: pointer; list-style: none; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: ""; position: absolute; right: 1.1rem; top: 50%; width: .5rem; height: .5rem; margin-top: -.4rem; border-right: 2px solid var(--red); border-bottom: 2px solid var(--red); transform: rotate(45deg); transition: transform .2s; }
.faq__item[open] summary::after { margin-top: -.1rem; transform: rotate(-135deg); }
.faq__item[open] summary { color: var(--red); }
.faq__a { padding: 0 1.1rem 1rem; }
.faq__a a { text-decoration: underline; text-underline-offset: 3px; }
#compare .title { margin-bottom: 1.5rem; }

/* ---------- 宿泊料金ページ（rate.html） ---------- */
.pc { display: none; }
@media (min-width: 768px) { .pc { display: inline; } }
.left { text-align: left; }
.rate-intro .lead { text-align: center; }
@media (max-width: 767.98px) { .rate-intro .lead { text-align: left; } }
.rate-top { margin-top: 2rem; }
.rate-card { flex: 1; }
.rate-card .price { margin-block: .25rem 1rem; }
.rate-card__btns { display: grid; gap: .5rem; margin: auto 0 0; }
.btn--block.btn--sm { padding-block: .5rem; }
/* 連泊特典：左に内容、右に写真 */
.split { display: grid; margin-top: 2.5rem; }
.split__body { padding: 1.5rem 1.25rem; }
.split__body .checks { margin-bottom: 1.25rem; }
.split__img { display: block; width: 100%; height: 100%; min-height: 14rem; object-fit: cover; }
@media (min-width: 768px) {
  .split { grid-template-columns: 7fr 5fr; }
  .split__body { padding: 2rem; }
}
.soft { margin-bottom: 1.25rem; padding: 1rem; border-radius: var(--radius); background: var(--bg-ash); }
.soft > :last-child { margin-bottom: 0; }
.plan__em.lg { font-size: .95rem; }
/* ハネムーン */
.honey__img { display: block; width: 100%; aspect-ratio: 2 / 1; object-fit: cover; }
.honey__grid { margin-block: 1.25rem; }
.honey__grid .soft { margin: 0; }
.honey__foot { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 2rem; margin: 0; padding: 1rem 1.25rem; border-top: 1px solid rgba(30, 34, 40, .08); font-size: .75rem; }
/* ご案内（注意書きのカード） */
.info { align-items: start; }
.notes p { margin-bottom: .5rem; color: var(--muted); line-height: 1.9; }
.notes h3 + p { margin-top: 0; }
.notes p + h3 { margin-top: 2rem; }
.notes .red, strong.red { color: var(--red); }
/* ディナー2種 */
.dinner__wide { aspect-ratio: 2 / 1; object-position: center 62%; }   /* 画面に収まるよう高さを抑える（元の比率は 1600:1007） */
@media (min-width: 768px) { .dinner__wide { aspect-ratio: 16 / 5; } }
.dinner { margin-top: 2rem; }
.dinner--line { padding-top: 2rem; border-top: 1px solid rgba(30, 34, 40, .08); }
.dinner .tc-price { margin-bottom: 1.25rem; }
.dinner__list { display: inline-block; margin-bottom: 1.25rem; text-align: left; }
.section--leaf > .container > .leaf { margin-inline: auto; }

/* ---------- コースメニュー（サウザンドキャンドル・ダイニング共通） ---------- */
.menu { margin-top: 2.5rem; }
.menu__item { padding-block: 1rem; }
.menu__item p { margin-bottom: .25rem; }
.menu__ja { color: var(--ink); font-size: .9rem; line-height: 1.8; }
.menu__en { color: var(--muted); font-size: .75rem; line-height: 1.7; }
.menu__or { margin-block: .5rem !important; }
.menu__sep { margin: .25rem 0; }
.menu__sep::before { content: "* * * * * *"; color: #a9adb5; }   /* コース間の区切り（飾り） */

/* ---------- レストラン & ダイニング（dining.html） ---------- */
@media (max-width: 575.98px) { .sp-hide { display: none; } }      /* 小さい画面では写真の枚数を絞る（現行どおり） */
.feature + .feature, .villa + .villa { margin-top: 1.5rem; }
.dining__lead { margin: 1rem 0 1.5rem; }
.dining__links { margin-top: 1.5rem; }
.dining__links p { margin-bottom: .4rem; }
.dining__links a { text-decoration: underline; text-underline-offset: 3px; }
.villa .video { max-width: none; }

/* ---------- 施設のご案内（facility.html） ---------- */
.page-head__title--wide { letter-spacing: .5em; text-indent: .5em; }   /* 「施 設 の ご 案 内」の字間 */
.btn--lg { padding: .6rem 2rem; font-size: .8rem; }
.facility__btn { margin-top: 1.5rem; }

/* ---------- 2列のチェックリスト（サウザンドキャンドル・予約特典で共通。左列から順に埋める） ---------- */
.tc-points { display: grid; gap: .75rem 2rem; max-width: 46rem; margin-inline: auto; text-align: left; }
.tc-points li + li { margin-top: 0; }
@media (min-width: 768px) { .tc-points { grid-template-columns: 1fr 1fr; grid-auto-flow: column; grid-template-rows: repeat(3, auto); } }

/* ---------- 日本語公式サイトから直接予約するメリット（official-booking-benefits.html） ---------- */
@media (min-width: 768px) { .benefit--main .tc-points { grid-template-rows: repeat(4, auto); } }
.benefit--main .tc-points { margin-block: 1.5rem; }
.benefit--main .soft { max-width: 46rem; margin-inline: auto; }
.benefit > p { margin-bottom: .6rem; }
.benefit > :last-child { margin-bottom: 0; }
.benefit-grid { margin-top: 1.5rem; }
.grid--cards > :first-child { grid-column: auto !important; }       /* 写真のないカード：iPad 縦は2列で均等に並べる */

/* ---------- ロイヤルスパ（royal-kirana-spa.html） ---------- */
.spa-pack { margin-top: 2rem; }
.spa-pack .title { margin-bottom: 1.25rem; font-size: 1.05rem; }
.spa-pack__price { color: var(--text); font-size: .75rem; white-space: nowrap; }
@media (min-width: 768px) { .spa-pack__price { margin-left: .75rem; } }
.spa-pack .faq__a p { margin-bottom: .6rem; }
.spa-pack .faq__a > :last-child { margin-bottom: 0; }
.faq__item--sub { margin-top: .75rem; background: var(--bg-ash); border: 0; }
.faq__item--sub summary { font-size: .75rem; }
.spa-pack__notes { margin: 1.25rem 0; }
.spa-fee { margin: 1.25rem 0 .5rem; color: var(--ink); }
/* フォトギャラリー：写真の下端に説明を重ねる */
.gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem; }
@media (min-width: 992px) { .gallery { grid-template-columns: repeat(5, 1fr); gap: .75rem; } }
.gallery__item { position: relative; margin: 0; overflow: hidden; border-radius: var(--radius); }
.gallery__img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.gallery__item figcaption { position: absolute; inset: auto 0 0; padding: 1.5rem .5rem .4rem; background: linear-gradient(transparent, rgba(0, 0, 0, .72)); color: #fff; font-size: .6rem; line-height: 1.5; text-align: center; }

/* ---------- ウェディング＆レセプション（royal-wedding-reception.html） ---------- */
.wed-h { margin-bottom: 1.5rem; }
.wed-video { margin-block: 2rem; padding: .25rem; border-radius: var(--radius); background: #1e2228; }
@media (min-width: 768px) { .wed-video { padding: .5rem; } }
.wed-video .video { max-width: none; }
.rate-intro .wed-text { text-align: left; margin-bottom: 0; }
.wed-leaf { margin-top: 2.5rem; }
.wed-leaf--end { margin-bottom: 0; }
.wed-box { margin-inline: auto; }
.wed-box + .wed-box, .feature + .wed-box { margin-top: 1.5rem; }
.wed-box__title { margin: .75rem 0 1.5rem; font-size: 1.1rem; line-height: 1.8; text-align: center; }
.wed-plans { align-items: stretch; }
.wed-plan__name { margin-bottom: 1rem; color: var(--purple); font-size: 1.05rem; text-align: center; }
.wed-price { text-align: center; font-size: 1.9rem; }
.wed-price + .wed-price { margin-top: .5rem; }
.wed-price__yen { margin-left: .15em; font-size: .58em; font-weight: 500; }
.wed-price small { font-size: .5em; }
.wed-plan__decor { margin: 1.25rem 0 0; color: #2f7a4d; font-weight: 700; line-height: 1.9; text-align: center; }
.wed-plan__head { margin: 1.75rem 0 .75rem; color: var(--ink); font-size: .8rem; }
.wed-plan .checks { margin-bottom: 1.5rem; }
.wed-plan .checks.mb-0 { margin-bottom: 0; }
.wed-cta { margin-top: 1.5rem; padding: 1.25rem 1rem; border-radius: .8rem; background: var(--purple); color: #fff; text-align: center; }
.wed-cta p { margin: 0; color: #fff; }
.wed-cta__lead { font-size: .9rem; line-height: 1.8; }
.wed-cta__lead a { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.wed-cta__note { margin-top: .75rem !important; font-size: .8rem; }
@media (max-width: 767.98px) { .wed-cta__note { text-align: left; } }
.wed-cta-card .wed-cta { margin-top: 0; }
.wed-imgnote { margin: 1rem 0 0; text-align: right; }
.villa__img--9x8 { aspect-ratio: 9 / 8; }
.villa__img--4x5 { aspect-ratio: 4 / 5; }
.rec-grid { display: grid; gap: 1.5rem; }
@media (min-width: 768px) {
  .rec-grid { grid-template-columns: repeat(6, 1fr); }
  .rec-grid__h { grid-column: span 3; }
  .rec-grid__t { grid-column: span 2; }
}
.qa + .qa { margin-top: 1.25rem; }
.qa__q { position: relative; margin: 0; padding: .7rem .9rem .7rem 2.3rem; border-left: 4px solid #c5a46d; background: var(--bg-ash); color: var(--ink); font-size: .8rem; font-weight: 600; line-height: 1.7; }
.qa__a { position: relative; margin: .5rem 0 0; padding-left: 2.3rem; border-left: 3px solid #c5a46d; font-size: .75rem; line-height: 1.9; margin-left: .05rem; }
.qa__q::before, .qa__a::before { position: absolute; left: .8rem; color: #8a6d35; font-weight: 700; }
.qa__q::before { content: "Q"; }
.qa__a::before { content: "A"; top: 0; }
.qa__a a { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.wed-price, .wed-plan__name { white-space: nowrap; }
@media (max-width: 575.98px) {
  .wed-box .wed-plan .card__body--lg { padding: 1.25rem .8rem; }
  .wed-plan__name { font-size: .95rem; }
  .wed-price { font-size: 1.6rem; }
  .wed-plan .small { font-size: .68rem; }
}

/* ---------- ロイヤル デイユース パッケージ（royal-spa-day-use.html） ---------- */
.subnav a.subnav__cta { align-self: center; margin-left: .25rem; padding: .3rem .9rem; border-radius: .25rem; background: var(--red); color: #fff; }
.subnav a.subnav__cta:hover { background: var(--red-hover); color: #fff; }
.du-lead { margin: 1rem 0 0; }
.du-hero { margin-top: 2rem; }
.du-offer { padding: .5rem; }
@media (max-width: 991.98px) { .du-hero .villa__frame { order: -1; } .du-offer { padding-top: 0; } }
.du-offer__name { margin-bottom: .5rem; color: var(--ink); font-size: clamp(1rem, 5vw, 1.2rem); }
.du-price { font-size: 2.2rem; }
.du-price small { display: inline-block; font-size: .38em; }
.du-offer__time { margin: .5rem 0 1.25rem; color: var(--red); font-weight: 700; }
.du-step .h-sm { display: flex; align-items: flex-start; gap: .4rem; line-height: 1.5; }
.du-step .num { margin-top: .1em; }
.du-step .card__body { padding: 1rem 1.1rem 1.25rem; }
.du-notes { margin: 1.75rem 0 0; }
.du-more { margin: 1.25rem 0 0; }
div.qa__a p { margin: 0 0 .6rem; }
.du-exc { color: var(--ink); font-weight: 700; }
.du-exc__list { margin: 0; padding-left: 1.2em; }

/* ---------- ウブドで過ごすハネムーン（honeymoon.html） ---------- */
.hm-photos { margin-top: 2rem; }
.hm-day .card__body { padding: 1.25rem 1.1rem; }
.hm-day .checks li { font-size: .75rem; }
.hm-four { margin-top: 2rem; }
.hm-four .special__tag { margin-bottom: .25rem; }
.bg-ash .qa__q { background: #fff; }

/* ---------- 無料往復送迎・アクセス（airport-transfer.html） ---------- */
.tr-areas { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-block: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .tr-areas { grid-template-columns: repeat(4, 1fr); gap: 1rem; } }
.tr-area { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 4.2rem; padding: .75rem .5rem; border-radius: var(--radius); background: #fff; box-shadow: var(--shadow); color: var(--ink); font-size: .85rem; line-height: 1.5; text-align: center; }
.tr-area:first-child { grid-column: 1 / -1; color: var(--red); font-weight: 700; }
@media (min-width: 768px) { .tr-area:first-child { grid-column: span 2; } }
.tr-area small { font-size: .8em; font-weight: 400; }
.tr-ex { margin: 1.5rem auto 0; background: #fff; }
.tr-step { display: flex; align-items: flex-start; gap: .4rem; line-height: 1.5; }
.tr-step .num { margin-top: .1em; }
@media (max-width: 575.98px) { .tr-area { font-size: .75rem; white-space: nowrap; } }

/* ---------- 最新情報（news/） ---------- */
.breadcrumb { margin-top: 3.6rem; padding-block: 1rem; font-size: .7rem; color: var(--muted); }
@media (min-width: 992px) { .breadcrumb { margin-top: 4.4rem; } }
.breadcrumb a { text-decoration: underline; text-underline-offset: 3px; }
.news-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-bottom: .6rem; color: var(--muted); font-size: .75rem; }
.news-cat { padding: .05rem .6rem; border: 1px solid var(--red); border-radius: 50rem; color: var(--red); font-size: .65rem; }
.news-title { margin-bottom: 1.5rem; font-size: clamp(1.3rem, 6vw, 1.75rem); line-height: 1.6; }
.news-hero { margin-bottom: 2rem; }
.prose h2 { margin: 2.25rem 0 .9rem; padding-left: .75rem; border-left: 3px solid var(--red); font-size: 1.1rem; line-height: 1.6; }
.prose > p { line-height: 2; }
.news-cols { margin-block: 1.5rem; padding-block: .5rem; border-radius: var(--radius); background: var(--bg-ash); }
.news-back { margin: 2.5rem 0 0; }
.news-pager { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; max-width: 75%; margin: 2.5rem auto 0; padding-top: 1.5rem; border-top: 1px solid rgba(30, 34, 40, .1); }
@media (max-width: 991.98px) { .news-pager { max-width: 100%; } }
.news-pager a { display: block; color: var(--ink); }
.news-pager span { display: block; color: var(--red); font-size: .7rem; }
.news-pager strong { font-weight: 500; font-size: .8rem; line-height: 1.6; }
.news-pager__newer { text-align: right; }
.news-related { margin-top: 3.5rem; }
.news-related .title { margin-bottom: 1.5rem; font-size: 1.1rem; }
.news-rel, .news-stay { display: flex; flex-direction: column; color: var(--text); }
.news-rel:hover, .news-stay:hover { color: var(--text); }
.news-rel .card__body, .news-stay .card__body { gap: .25rem; padding: 1rem 1.1rem 1.25rem; }
.news-rel .h-sm, .news-stay .h-sm { margin: 0; color: var(--ink); font-weight: 500; line-height: 1.6; }
.news-rel .eyebrow, .news-stay .eyebrow { margin: 0; }
.news-more { margin-top: auto; padding-top: .5rem; color: var(--red); font-size: .75rem; }
.news-cta .card__body { text-align: center; }
.news-cta .tc-points { margin-block: 1.5rem; }
/* 一覧 */
.news-updated { margin: 0 auto 1.25rem; max-width: 83.3333%; color: var(--muted); font-size: .75rem; text-align: right; }
@media (max-width: 991.98px) { .news-updated { max-width: 100%; } }
.news-list { display: grid; gap: 1.5rem; }
.news-list .offer__title { margin: 0 0 .5rem; color: var(--ink); font-size: 1.15rem; letter-spacing: 0; text-align: inherit; text-transform: none; }
.news-list .news-meta { margin-bottom: .35rem; }
@media (max-width: 767.98px) { .news-list .news-meta { justify-content: center; } }
.news-links { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; }
.offers__all { margin: 1rem 0 0; font-size: .8rem; }

/* 最新情報：絞り込み（JSなし。分類を足すときは下の3つのルールに同じ名前を足す） */
.nf__radio { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.nf label { cursor: pointer; }
#nf-all:checked ~ .nf label[for="nf-all"],
#nf-campaign:checked ~ .nf label[for="nf-campaign"],
#nf-stay:checked ~ .nf label[for="nf-stay"],
#nf-dining:checked ~ .nf label[for="nf-dining"],
#nf-spa:checked ~ .nf label[for="nf-spa"],
#nf-wedding:checked ~ .nf label[for="nf-wedding"] { color: var(--red); box-shadow: inset 0 -2px var(--red); }
#nf-all:focus-visible ~ .nf label[for="nf-all"],
#nf-campaign:focus-visible ~ .nf label[for="nf-campaign"],
#nf-stay:focus-visible ~ .nf label[for="nf-stay"],
#nf-dining:focus-visible ~ .nf label[for="nf-dining"],
#nf-spa:focus-visible ~ .nf label[for="nf-spa"],
#nf-wedding:focus-visible ~ .nf label[for="nf-wedding"] { outline: 2px solid var(--red); outline-offset: -2px; }
#nf-campaign:checked ~ .news-index .news-list > :not([data-cat="campaign"]),
#nf-stay:checked ~ .news-index .news-list > :not([data-cat="stay"]),
#nf-dining:checked ~ .news-index .news-list > :not([data-cat="dining"]),
#nf-spa:checked ~ .news-index .news-list > :not([data-cat="spa"]),
#nf-wedding:checked ~ .news-index .news-list > :not([data-cat="wedding"]) { display: none; }
.news-index > .container > .leaf { margin-inline: auto; }
/* ハネムーン：おすすめの理由・モデルコース・費用の目安 */
.hm-why { padding: 1.75rem .5rem .5rem; }
.hm-why .h-md { margin-bottom: 1.25rem; line-height: 1.7; }
.hm-course { margin-block: 0; padding: 0; list-style: none; }
.hm-course__item { display: grid; gap: .75rem 1.5rem; padding: 1.25rem 0; border-top: 1px solid rgba(30, 34, 40, .1); }
.hm-course__item:last-child { border-bottom: 1px solid rgba(30, 34, 40, .1); }
@media (min-width: 768px) { .hm-course__item { grid-template-columns: 8rem 1fr; padding: 1.5rem 0; } }
.hm-course__day { color: var(--red); font-size: .7rem; letter-spacing: .05rem; line-height: 1.5; }
.hm-course__day span { display: block; color: var(--ink); font-size: 1.15rem; letter-spacing: 0; }
@media (max-width: 767.98px) { .hm-course__day span { display: inline; margin-right: .6rem; } }
.hm-course__body .h-sm { margin-bottom: .6rem; font-size: 1rem; }
.hm-cost__table { width: 100%; margin-bottom: 1.25rem; border-collapse: collapse; }
.hm-cost__table th, .hm-cost__table td { padding: .9rem .5rem; border-bottom: 1px solid rgba(30, 34, 40, .1); vertical-align: top; text-align: left; line-height: 1.8; }
.hm-cost__table th { width: 40%; color: var(--ink); font-weight: 500; }
.hm-cost__table th small { display: block; color: var(--red); font-size: .7rem; }
.hm-cost__table strong { color: var(--ink); font-size: 1.05em; }
@media (max-width: 575.98px) {
  .hm-cost__table, .hm-cost__table tbody, .hm-cost__table tr, .hm-cost__table th, .hm-cost__table td { display: block; width: 100%; }
  .hm-cost__table th { padding-bottom: .15rem; border-bottom: 0; }
  .hm-cost__table td { padding-top: .25rem; }
}
.hm-promo { margin-top: 0; margin-inline: auto; }
.hm-promo .title { margin-bottom: .75rem; }
.section--tight-bottom { padding-bottom: 2rem; }   /* 末尾のリーフと次のブロックの間を詰める */

/* ---------- 評価の帯（トップページ。数字は出典と確認日を必ず添える） ---------- */
.rating { padding-block: 2rem 1.75rem; border-bottom: 1px solid rgba(30, 34, 40, .08); text-align: center; }
.rating__title { margin-bottom: 1.25rem; color: var(--red); font-size: .7rem; letter-spacing: .18rem; }
.rating__list { display: grid; gap: 1.25rem; max-width: 46rem; margin: 0 auto; padding: 0; list-style: none; }
@media (min-width: 768px) {
  .rating__list { grid-template-columns: 1fr 1fr; gap: 0; }
  .rating__item + .rating__item { border-left: 1px solid rgba(30, 34, 40, .1); }
}
.rating__item { padding-inline: 1rem; }
.rating__label { margin: 0 0 .25rem; color: var(--ink); font-size: .8rem; line-height: 1.6; }
.rating__label small { display: block; color: var(--muted); font-size: .7rem; }
.rating__num { margin: 0; color: var(--ink); font-size: 1rem; line-height: 1.2; }
.rating__num strong { margin-inline: .1em; color: var(--red); font-size: 2.4rem; font-weight: 700; }
.rating__num span { color: var(--muted); font-size: .9rem; }
.rating__src { margin: 1.1rem 0 0; color: var(--muted); font-size: .65rem; }
/* 評価：4項目の帯、レビューページ */
.rating__list--4 { grid-template-columns: 1fr 1fr; gap: 1.25rem .5rem; max-width: 60rem; }
@media (min-width: 992px) { .rating__list--4 { grid-template-columns: repeat(4, 1fr); gap: 0; } }
@media (min-width: 768px) and (max-width: 991.98px) { .rating__list--4 { gap: 1.5rem 0; } .rating__list--4 .rating__item:nth-child(odd) { border-left: 0; } }
@media (max-width: 767.98px) { .rating__list--4 .rating__item { padding-inline: .25rem; } .rating__list--4 .rating__label { font-size: .72rem; } .rating__list--4 .rating__num strong { font-size: 2rem; } }
.rating__src a { margin-left: .75rem; text-decoration: underline; text-underline-offset: 3px; }
.rv-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; max-width: 54rem; margin: 0 auto; padding: 0; list-style: none; }
@media (min-width: 768px) { .rv-grid { grid-template-columns: repeat(3, 1fr); gap: 1.5rem; } }
.rv-card { padding: 1.5rem .75rem; text-align: center; }
.rv-card__name { margin-bottom: .5rem; color: var(--ink); font-size: .9rem; }
.rv-card__cnt { margin: .5rem 0 0; color: var(--muted); font-size: .7rem; }
.rv-award { margin-bottom: .5rem; color: var(--red); font-size: 1rem; font-weight: 700; line-height: 1.6; }
#nf-info:checked ~ .nf label[for="nf-info"] { color: var(--red); box-shadow: inset 0 -2px var(--red); }
#nf-info:focus-visible ~ .nf label[for="nf-info"] { outline: 2px solid var(--red); outline-offset: -2px; }
#nf-info:checked ~ .news-index .news-list > :not([data-cat="info"]) { display: none; }
.rating__sub { margin: .35rem 0 0; color: var(--red); font-size: .75rem; font-weight: 700; }
.rv-award--sub { margin: .5rem 0; }
/* 評価の帯を「直接予約するメリット」の中（特典ボタンの上）に置く場合 */
.rating--in { margin-top: 2.5rem; padding-block: 2rem 1.75rem; border-top: 1px solid rgba(30, 34, 40, .08); border-bottom: 1px solid rgba(30, 34, 40, .08); }
.rating--in > .container { max-width: none; padding-inline: 0; }
.rating--in + p { margin-top: 2rem; }
