@charset "UTF-8";
/* ==========================================================================
   the sense of wonder / main.css
   デザインデータ（Claude Design）準拠。デスクトップ値を基準に、
   clamp() とブレイクポイントでモバイルまで破綻なく縮退させています。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. デザイントークン
   -------------------------------------------------------------------------- */
:root {
  /* 配色 */
  --c-bg:            #f4f1ea;   /* ベース（生成りの紙） */
  --c-bg-alt:        #e6e1d4;   /* 一段濃いベージュ面 */
  --c-ink:           #23281f;   /* 基本文字色（深緑黒） */
  --c-dark:          #1c2420;   /* ダークセクション背景 */
  --c-footer:        #23281f;   /* フッター背景 */
  --c-cream:         #f2efe6;   /* 写真上の白文字／CTA地色 */
  --c-on-dark:       #ece7da;   /* ダーク面の文字色 */
  --c-light:         rgb(244, 241, 233);
  --c-accent:        #1c2420;   /* アクセント（モバイル固定の予約ボタンなど） */

  --c-ink-70:  rgba(35, 40, 31, .70);
  --c-ink-60:  rgba(35, 40, 31, .60);
  --c-ink-55:  rgba(35, 40, 31, .55);
  --c-ink-45:  rgba(35, 40, 31, .45);
  --c-ink-30:  rgba(35, 40, 31, .30);
  --c-ink-22:  rgba(35, 40, 31, .22);
  --c-ink-18:  rgba(35, 40, 31, .18);
  --c-ink-14:  rgba(35, 40, 31, .14);

  --c-od-75:   rgba(236, 231, 218, .75);
  --c-od-72:   rgba(236, 231, 218, .72);
  --c-od-70:   rgba(236, 231, 218, .70);
  --c-od-60:   rgba(236, 231, 218, .60);
  --c-od-55:   rgba(236, 231, 218, .55);
  --c-od-50:   rgba(236, 231, 218, .50);
  --c-od-45:   rgba(236, 231, 218, .45);
  --c-od-35:   rgba(236, 231, 218, .35);
  --c-od-28:   rgba(236, 231, 218, .28);
  --c-od-22:   rgba(236, 231, 218, .22);
  --c-od-20:   rgba(236, 231, 218, .20);
  --c-od-14:   rgba(236, 231, 218, .14);

  /* 書体 */
  --f-jp:      "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --f-sans:    "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
  --f-latin:   "Cormorant Garamond", "Times New Roman", serif;

  /* 余白 */
  --gut:       clamp(20px, 4.7vw, 60px);   /* 左右のガター（PC 60px） */
  /* ヒーローの枠。上限を設けず画面幅の 2.4% を保つので、
     幅の広いモニターでも見た目の比率が変わらない */
  --hero-gut:  max(14px, 2.4vw);
  --header-h:  84px;   /* JS で実測値に置き換える（読み込み前の目安） */
  --mcta-h:    0px;    /* モバイルの固定 CTA の高さ */
  --sec-lg:    clamp(88px, 13vw, 200px);   /* 大セクション（PC 200px） */
  --sec-md:    clamp(80px, 11.5vw, 180px); /* 中セクション（PC 180px） */
  --sec-sm:    clamp(72px, 9.8vw, 150px);  /* 小セクション（PC 150px） */
  --gap-col:   clamp(40px, 6.5vw, 100px);  /* 2カラムの間隔（PC 100px） */

  /* 動き */
  --ease:      cubic-bezier(.22, .61, .36, 1);
}

/* --------------------------------------------------------------------------
   2. リセット & ベース
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
/* 慣性スクロールを JS 側で受け持つときは、ブラウザの補間と二重にならないよう切る */
html.sow-smooth { scroll-behavior: auto; }
/* 記事本文の横スクロール領域は、ホイールの横取りをしない */
.sow-tablewrap { overscroll-behavior-x: contain; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

body {
  margin: 0;
  background: var(--c-bg);
  color: var(--c-ink);
  font-family: var(--f-jp);
  font-size: 16px;
  line-height: 2;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.sow-nav-open { overflow: hidden; }

img { max-width: 100%; height: auto; border: 0; }
a  { color: inherit; text-decoration: none; transition: opacity .3s var(--ease); }
a:hover { opacity: .6; }
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

h1, h2, h3, h4, p, figure, blockquote { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; color: inherit; }

::-webkit-scrollbar { width: 0; height: 0; }
body { scrollbar-width: none; }

.sow-skip {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--c-ink); color: var(--c-cream);
  padding: 12px 20px; font-family: var(--f-sans); font-size: 13px;
}
.sow-skip:focus { left: 0; }

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

/* --------------------------------------------------------------------------
   3. レイアウト部品
   -------------------------------------------------------------------------- */
.sow-wrap    { padding-left: var(--gut); padding-right: var(--gut); }
/* ヒーローだけは細い枠にする（ヘッダーの左右余白と揃う） */
.sow-wrap--hero { padding-left: var(--hero-gut); padding-right: var(--hero-gut); }
.sow-sec     { padding-top: var(--sec-lg); padding-bottom: var(--sec-lg); }
.sow-sec--md { padding-top: var(--sec-md); padding-bottom: var(--sec-md); }
.sow-sec--sm { padding-top: var(--sec-sm); padding-bottom: var(--sec-sm); }

.sow-dark { background: var(--c-dark); color: var(--c-on-dark); }
.sow-alt  { background: var(--c-bg-alt); }

.sow-grid2      { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap-col); }
.sow-grid2--mid { align-items: center; }
.sow-grid2--top { align-items: start; }
.sow-grid-t-l   { display: grid; grid-template-columns: 1fr 1.1fr;  gap: var(--gap-col); align-items: start; }
.sow-grid-side  { display: grid; grid-template-columns: 280px 1fr;   gap: var(--gap-col); align-items: start; }
.sow-grid-1-135 { display: grid; grid-template-columns: 1fr 1.35fr;  gap: var(--gap-col); align-items: stretch; }
.sow-grid-135-1 { display: grid; grid-template-columns: 1.35fr 1fr;  gap: var(--gap-col); align-items: stretch; }
.sow-grid-1-115 { display: grid; grid-template-columns: 1fr 1.15fr;  gap: var(--gap-col); align-items: center; }
.sow-grid-115-1 { display: grid; grid-template-columns: 1.15fr 1fr;  gap: var(--gap-col); align-items: center; }
.sow-grid-12-1  { display: grid; grid-template-columns: 1.2fr 1fr;   gap: clamp(36px, 5.2vw, 80px); align-items: center; }
.sow-grid3      { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 2.5vw, 32px); align-items: start; }

/* 背景写真ブロック（デザインの background:url(...) center/cover 相当） */
.sow-ph { background-position: center; background-size: cover; background-repeat: no-repeat; }
/* 遅延読み込みの写真。読み込み前は淡い地色、適用後にふわっと出す */
[data-bg]:not(.is-bg):not([data-hero-fallback]) { background-color: var(--c-bg-alt); }
[data-bg]:not([data-hero-fallback]) { transition: background-color .4s var(--ease); }
/* 視差用の内側レイヤー。枠より上下に 7% ずつ大きく敷き、JS がゆっくり動かす */
.is-plx { position: relative; overflow: hidden; background-image: none !important; }
.sow-plx {
  position: absolute; left: 0; right: 0; top: -7%; height: 114%;
  background-size: cover; background-repeat: no-repeat; background-position: center;
  will-change: transform; pointer-events: none;
}
.sow-movie.is-plx .sow-movie__veil { z-index: 1; }

/* 画面に入ったときの出現。少し小さく・ぼけた状態から通常へ（霧が晴れる語彙）。
   --plx はラベルの視差（JS が更新）。--rv-s は出現時の拡大率。 */
.sow-rv {
  --plx: 0px; --rv-s: .975;
  opacity: 0;
  transform: translate3d(0, var(--plx), 0) scale(var(--rv-s));
  filter: blur(6px);
  transition: opacity 1.1s var(--ease), transform 1.1s var(--ease), filter 1.1s var(--ease);
}
.sow-rv.is-in { --rv-s: 1; opacity: 1; filter: blur(0); }
/* 出現し終えたら transform の transition は視差の追従を邪魔しないよう切る */
.sow-rv.is-in.sow-label { transition: opacity 1.1s var(--ease), filter 1.1s var(--ease); }
@media (prefers-reduced-motion: reduce) {
  .sow-rv { opacity: 1; transform: none; filter: none; transition: none; }
}

.sow-ph--60 { background-position: center 60%; }
.sow-ph--55 { background-position: center 55%; }
.sow-ph--50 { background-position: center 50%; }
.sow-ph--40 { background-position: center 40%; }
.sow-sq  { aspect-ratio: 1 / 1; }
.sow-43  { aspect-ratio: 4 / 3; }
.sow-32  { aspect-ratio: 3 / 2; }
.sow-169 { aspect-ratio: 16 / 9; }

/* --------------------------------------------------------------------------
   4. タイポグラフィ部品
   -------------------------------------------------------------------------- */
.sow-label {
  font-family: var(--f-sans);
  font-size: clamp(12px, 1vw, 14px);
  letter-spacing: .28em;
  line-height: 1.6;
  color: var(--c-ink-45);
}
.sow-dark .sow-label { color: var(--c-od-50); }

.sow-h1 {
  font-family: var(--f-jp); font-weight: 400;
  font-size: clamp(26px, 3.6vw, 52px);
  line-height: 1.55; letter-spacing: .16em;
}
.sow-h2 {
  font-family: var(--f-jp); font-weight: 400;
  font-size: clamp(22px, 2.5vw, 35px);
  line-height: 1.75; letter-spacing: .14em;
}
.sow-h2--c {                     /* 中央寄せ見出し（デザイン 33px） */
  font-family: var(--f-jp); font-weight: 400;
  font-size: clamp(21px, 2.35vw, 33px);
  line-height: 1.75; letter-spacing: .16em;
}
.sow-h2--sm {
  font-family: var(--f-jp); font-weight: 400;
  font-size: clamp(20px, 2.1vw, 30px);
  line-height: 1.75; letter-spacing: .16em;
}
.sow-h3 {
  font-family: var(--f-jp); font-weight: 400;
  font-size: clamp(19px, 1.85vw, 26px);
  line-height: 1.75; letter-spacing: .16em;
}
.sow-h3--sm {
  font-family: var(--f-jp); font-weight: 400;
  font-size: clamp(18px, 1.7vw, 24px);
  line-height: 1.75; letter-spacing: .16em;
}
.sow-lead {
  font-size: clamp(14px, 1.1vw, 16px);
  line-height: 2.25; letter-spacing: .08em; color: var(--c-ink-70);
}
.sow-dark .sow-lead, .sow-lead--od { color: var(--c-od-72); }
.sow-body {
  font-size: clamp(14px, 1.1vw, 16px);
  line-height: 2.1; letter-spacing: .06em; color: var(--c-ink-70);
}
.sow-dark .sow-body { color: var(--c-od-70); }
.sow-note {
  font-size: clamp(13px, 1vw, 15px);
  line-height: 2; letter-spacing: .06em; color: var(--c-ink-60);
}
.sow-dark .sow-note { color: var(--c-od-55); }

.sow-en   { font-family: var(--f-latin); font-weight: 300; }
.sow-en-i { font-family: var(--f-latin); font-weight: 300; font-style: italic; }
.sow-sans { font-family: var(--f-sans); }

/* 見出しの文節（sow_h()）。折り返しは文節の切れ目（句読点の後ろ）だけで起こる */
.sow-cl { display: inline-block; }

/* 下線＋矢印のテキストリンク */
.sow-link {
  display: inline-flex; align-items: center; gap: 16px;
  font-family: var(--f-sans);
  font-size: clamp(12px, 1vw, 13px); letter-spacing: .22em;
  border-bottom: 1px solid var(--c-ink);
  padding-bottom: 10px;
}
.sow-dark .sow-link { border-bottom-color: var(--c-od-50); }
.sow-link--tight { gap: 14px; }
.sow-linkrow { display: flex; flex-wrap: wrap; gap: 24px clamp(24px, 3vw, 44px); }
.sow-linkrow .sow-link { letter-spacing: .2em; }

/* 丸ピルボタン */
.sow-pill {
  display: inline-flex; align-items: center; gap: 20px;
  border-radius: 999px;
  padding: clamp(16px, 1.5vw, 22px) clamp(32px, 3.6vw, 52px);
  font-size: clamp(13px, 1vw, 14px); letter-spacing: .18em;
  background: var(--c-cream); color: var(--c-ink);
}
.sow-pill--ghost {
  background: transparent; color: var(--c-light);
  border: 1px solid var(--c-light);
  font-family: var(--f-sans);
  gap: 16px; letter-spacing: .18em;
  padding: clamp(15px, 1.35vw, 19px) clamp(34px, 3.6vw, 52px);
  font-size: clamp(12px, 1vw, 13px);
}
.sow-pill--ghost .sow-arw { font-family: var(--f-latin); font-size: 15px; }

/* 丸囲みの矢印 */
.sow-circ {
  flex: none; display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--c-ink-30); font-size: 13px;
}
.sow-dark .sow-circ, .sow-circ--od { border-color: var(--c-od-35); }
.sow-circ--44 { width: 44px; height: 44px; font-size: 14px; border-color: var(--c-ink); border-color: rgba(35,40,31,.4); }
.sow-dark .sow-circ--44 { border-color: rgba(236,231,218,.4); }

/* 定義リスト（ROOM DETAIL / ご案内 など） */
.sow-dl {
  display: grid; grid-template-columns: 130px 1fr;
  font-size: clamp(14px, 1vw, 15px); letter-spacing: .08em;
}
.sow-dl--wide { grid-template-columns: 150px 1fr; }
.sow-dl--narrow { grid-template-columns: 110px 1fr; }
.sow-dl dt, .sow-dl dd { margin: 0; padding: clamp(16px, 1.6vw, 22px) 0; }
.sow-dl dt { color: var(--c-ink-55); }
.sow-dl dd { line-height: 2; }
.sow-dl--btm dt, .sow-dl--btm dd { border-bottom: 1px solid var(--c-ink-14); }
.sow-dl--top dt, .sow-dl--top dd { border-top: 1px solid var(--c-ink-18); }
.sow-dl--top > dt:last-of-type, .sow-dl--top > dd:last-of-type { border-bottom: 1px solid var(--c-ink-18); }
.sow-dark .sow-dl dt { color: var(--c-od-55); }
.sow-dark .sow-dl--btm dt, .sow-dark .sow-dl--btm dd { border-bottom-color: var(--c-od-14); }
.sow-dark .sow-dl--top dt, .sow-dark .sow-dl--top dd { border-top-color: var(--c-od-20); }
.sow-dark .sow-dl--top > dt:last-of-type, .sow-dark .sow-dl--top > dd:last-of-type { border-bottom-color: var(--c-od-20); }

/* 小見出し（ROOM DETAIL / MENU / EQUIPMENT） */
.sow-cap {
  font-family: var(--f-sans); font-size: 12px; letter-spacing: .24em;
  color: var(--c-ink-45);
  padding-bottom: 22px; border-bottom: 1px solid var(--c-ink-22);
}
.sow-dark .sow-cap { color: var(--c-od-45); border-bottom-color: var(--c-od-22); }

/* --------------------------------------------------------------------------
   5. ヘッダー / ナビゲーション
   -------------------------------------------------------------------------- */
.sow-header {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between;
  padding: clamp(12px, 1.2vw, 16px) var(--hero-gut);
  /* 既定はライト面（ダークな文字） */
  --nav-fg: var(--c-ink);
  --nav-btn-bg: var(--c-ink);
  --nav-btn-fg: var(--c-light);
  --nav-btn-bd: transparent;
  --logo-d: 1;   /* logo-dark.png の不透明度 */
  --logo-w: 0;   /* logo-white.png の不透明度 */
}
.sow-header[data-state="dark"] {
  --nav-fg: var(--c-light);
  --nav-btn-bg: var(--c-light);
  --nav-btn-fg: var(--c-ink);
  --nav-btn-bd: transparent;
  --logo-d: 0; --logo-w: 1;
}
.sow-header[data-state="hero"] {
  --nav-fg: var(--c-light);
  --nav-btn-bg: transparent;
  --nav-btn-fg: var(--c-light);
  --nav-btn-bd: var(--c-light);
  --logo-d: 0; --logo-w: 1;
}

.sow-logo { position: relative; display: block; height: 34px; flex: none; }
.sow-logo img {
  display: block; height: 34px; width: auto;
  transition: opacity .45s var(--ease);
}
.sow-logo img.is-dark  { opacity: var(--logo-d); }
.sow-logo img.is-white { position: absolute; left: 0; top: 0; opacity: var(--logo-w); }

.sow-nav {
  display: flex; align-items: center; gap: clamp(20px, 2.6vw, 36px);
  font-family: var(--f-sans); font-size: 13px; letter-spacing: .14em;
  color: var(--nav-fg); transition: color .45s var(--ease);
}
.sow-nav__cta {
  border: 1px solid; border-radius: 999px;
  padding: 12px 28px; letter-spacing: .16em;
  border-color: var(--nav-btn-bd);
  background: var(--nav-btn-bg);
  color: var(--nav-btn-fg);
  transition: background-color .45s var(--ease), color .45s var(--ease), border-color .45s var(--ease);
}
.sow-nav__cta:hover { opacity: .78; }
.sow-nav a[aria-current="page"] { opacity: .6; }

/* ハンバーガー（PCでは非表示） */
.sow-burger {
  display: none; position: relative; z-index: 120;
  width: 44px; height: 44px; padding: 0;
  background: none; border: 0; cursor: pointer;
  color: var(--nav-fg); transition: color .45s var(--ease);
}
.sow-burger span {
  position: absolute; left: 10px; width: 24px; height: 1px;
  background: currentColor; transition: transform .35s var(--ease), opacity .25s var(--ease);
}
.sow-burger span:nth-child(1) { top: 17px; }
.sow-burger span:nth-child(2) { top: 26px; }
body.sow-nav-open .sow-burger { color: var(--c-on-dark); }
body.sow-nav-open .sow-burger span:nth-child(1) { transform: translateY(4.5px) rotate(23deg); }
body.sow-nav-open .sow-burger span:nth-child(2) { transform: translateY(-4.5px) rotate(-23deg); }

.sow-drawer {
  position: fixed; inset: 0; z-index: 110;
  background: var(--c-dark); color: var(--c-on-dark);
  display: flex; flex-direction: column; justify-content: center;
  padding: 96px var(--gut) 120px;
  opacity: 0; visibility: hidden; transform: translateY(-12px);
  transition: opacity .4s var(--ease), transform .4s var(--ease), visibility .4s;
}
body.sow-nav-open .sow-drawer { opacity: 1; visibility: visible; transform: none; }
.sow-drawer__head {
  position: absolute; left: 0; right: 0; top: 0;
  display: flex; align-items: center; justify-content: space-between;
  padding: clamp(12px, 1.2vw, 16px) var(--hero-gut);
}
.sow-drawer__logo { display: block; height: 34px; }
.sow-drawer__logo img { display: block; height: 34px; width: auto; }
.sow-drawer__close {
  position: relative; width: 44px; height: 44px; padding: 0;
  background: none; border: 0; cursor: pointer; color: var(--c-on-dark);
}
.sow-drawer__close span:not(.sow-sr) {
  position: absolute; left: 10px; top: 21px; width: 24px; height: 1px;
  background: currentColor;
}
.sow-drawer__close span:nth-child(1) { transform: rotate(45deg); }
.sow-drawer__close span:nth-child(2) { transform: rotate(-45deg); }
.sow-drawer__list { display: grid; gap: 4px; }
.sow-drawer__list a {
  display: flex; align-items: baseline; gap: 18px;
  padding: 16px 0; border-bottom: 1px solid var(--c-od-22);
}
.sow-drawer__en { font-family: var(--f-latin); font-weight: 300; font-size: 26px; letter-spacing: .16em; }
.sow-drawer__jp { font-family: var(--f-sans); font-size: 12px; letter-spacing: .18em; color: var(--c-od-55); }
.sow-drawer__foot { margin-top: 44px; display: grid; gap: 20px; justify-items: start; }
.sow-drawer__tel { font-size: 14px; letter-spacing: .1em; color: var(--c-od-70); }

/* モバイル固定メニュー（電話／予約／アクセス の3分割） */
.sow-mcta {
  display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  grid-auto-flow: column; grid-auto-columns: 1fr;
  background: var(--c-cream); color: var(--c-ink);
  border-top: 1px solid var(--c-ink-14);
  padding-bottom: env(safe-area-inset-bottom);
}
.sow-mcta__btn {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
  min-height: 58px; padding: 8px 6px;
  font-family: var(--f-sans); font-size: 10px; letter-spacing: .16em; line-height: 1;
  border-left: 1px solid var(--c-ink-14);
}
.sow-mcta__btn:first-child { border-left: 0; }
.sow-mcta__btn:hover { opacity: 1; }
.sow-mcta__ico { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.sow-mcta__btn--accent { background: var(--c-accent); color: var(--c-cream); border-left-color: transparent; }
.sow-mcta__btn--accent + .sow-mcta__btn { border-left-color: transparent; }

/* --------------------------------------------------------------------------
   6. ヒーロー
   -------------------------------------------------------------------------- */
.sow-hero {
  position: relative;
  background: var(--c-dark); /* 動画の最初のコマが届くまでの地色（画像は出さない） */
  /* 画面の高さから、ヘッダー・下の余白帯・モバイルの固定 CTA を引く。
     こうすると動画の下端が、画面の下から余白帯ぶんだけ上に来る。 */
  height: calc(100vh - var(--header-h) - var(--hero-gut) - var(--mcta-h));
  height: calc(100svh - var(--header-h) - var(--hero-gut) - var(--mcta-h));
  min-height: 320px;
  color: var(--c-cream);
  overflow: hidden;
}
/* 背景の静止画に重ねて再生する。読み込めないときは静止画がそのまま残る。 */
.sow-hero__video {
  position: absolute; left: 0; top: 0; z-index: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 60%;
  pointer-events: none;
}
/* 再生できない・省データなどのときは JS が外し、下の静止画が見える */
.sow-hero__video.is-off { display: none; }
/* 静止画のフォールバック。通常は透明のまま（画像も読み込まない）。
   再生できないと分かったときだけ .is-on でフェードイン。 */
.sow-hero__fallback {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  opacity: 0; transition: opacity .6s var(--ease);
}
.sow-hero__fallback.is-on { opacity: 1; }
.sow-hero__fallback::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(rgba(15, 20, 16, .24), rgba(15, 20, 16, .44));
}
/* 動画の上に敷くスクリム。
   デザインと同じ全体の落ち込みに加え、動画は明るいカットもあるため、
   コピーが乗る下側だけ少し濃くして可読性を確保する。 */
.sow-hero__veil {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(to top,
      rgba(15, 20, 16, .40) 0%, rgba(15, 20, 16, .12) 38%, rgba(15, 20, 16, 0) 60%),
    linear-gradient(rgba(15, 20, 16, .14), rgba(15, 20, 16, .30));
}
.sow-hero__copy { position: absolute; z-index: 2; left: clamp(20px, 4vw, 64px); bottom: clamp(28px, 4vw, 64px); right: clamp(20px, 4vw, 64px); }
.sow-hero__sub {
  font-family: var(--f-latin); font-style: italic; font-weight: 300;
  font-size: clamp(12px, 1.2vw, 16px); letter-spacing: .24em;
  margin-bottom: clamp(14px, 1.9vw, 26px);
}
.sow-hero__scroll {
  position: absolute; z-index: 2; right: 28px; bottom: 28px;
  font-size: 11px; letter-spacing: .3em;
  writing-mode: vertical-rl;
}
.sow-heroline {
  /* 見た目は「写真の下の余白」だが、実体はキャプションの行。
     行の高さを左右の枠と同じ太さにし、その中に文字を収める。 */
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  min-height: var(--hero-gut);
  padding: 0 4px;
  font-family: var(--f-sans); font-size: clamp(11px, .95vw, 12px);
  line-height: 1.4;
  letter-spacing: .14em; color: var(--c-ink-60);
}
.sow-heroline__en { font-family: var(--f-latin); font-style: italic; letter-spacing: .18em; }

/* 下層ページの共通ヒーロー */
.sow-phero {
  position: relative;
  height: clamp(320px, 42vw, 520px);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  color: var(--c-cream); text-align: center;
  padding: 0 var(--gut);
}
.sow-phero--tall { height: clamp(340px, 45vw, 560px); }
.sow-phero__en {
  font-family: var(--f-latin); font-weight: 300;
  font-size: clamp(26px, 3.4vw, 44px);
  letter-spacing: .34em; padding-left: .34em;
}
.sow-phero__en--lg { font-size: clamp(30px, 4vw, 52px); letter-spacing: .26em; padding-left: .26em; }
.sow-phero__eyebrow {
  font-family: var(--f-latin); font-style: italic; font-weight: 300;
  font-size: clamp(12px, 1.1vw, 15px); letter-spacing: .3em; margin-bottom: 20px;
}
.sow-phero__jp { margin-top: clamp(16px, 2vw, 26px); font-size: clamp(13px, 1.1vw, 15px); letter-spacing: .24em; }

/* --------------------------------------------------------------------------
   7. TOP：CONCEPT
   -------------------------------------------------------------------------- */
.sow-concept { padding-top: var(--sec-lg); padding-bottom: var(--sec-md); }
.sow-concept__label { margin-bottom: clamp(24px, 3.2vw, 44px); }
.sow-concept__h    { margin-bottom: clamp(28px, 3.5vw, 48px); }
.sow-concept__p    { margin-bottom: clamp(32px, 4vw, 56px); }
/* イラスト1枚（横3:2）。トリミングされないよう比率で高さを決める */
.sow-concept__ph { position: relative; }
.sow-concept__ph .a { width: 100%; aspect-ratio: 3 / 2; }
/* 見出しだけ写真より頭一つ上に出す。
   左右を上端で揃え、写真側をラベル＋見出しの高さぶん下げることで、
   本文の書き出しと写真の上端が揃い、見出しが写真の上に抜ける。 */
@media (min-width: 901px) {
  .sow-concept.sow-grid2--mid { align-items: start; }
  .sow-concept__ph { margin-top: clamp(124px, 9.2vw, 176px); }
  /* テキスト列が左端に寄りすぎないよう、少し内側へ（左揃えは維持） */
  .sow-concept > div:first-child { padding-left: clamp(24px, 6.5vw, 130px); }
}

/* --------------------------------------------------------------------------
   8. TOP：STAY
   -------------------------------------------------------------------------- */
.sow-stay__head { margin-bottom: clamp(56px, 8vw, 110px); text-align: center; }
.sow-stay__head .sow-label { margin-bottom: clamp(20px, 2.5vw, 34px); }
.sow-stay__head .sow-h2--c { margin-bottom: clamp(24px, 2.9vw, 40px); }
.sow-stay__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(56px, 3.5vw, 48px); }
.sow-roomhead {
  display: flex; align-items: baseline; gap: clamp(14px, 1.7vw, 24px);
  margin-bottom: clamp(24px, 3.2vw, 44px); flex-wrap: wrap;
}
.sow-roomhead__no { font-family: var(--f-latin); font-size: clamp(24px, 2.4vw, 34px); letter-spacing: .1em; color: var(--c-od-50); }
.sow-roomhead__jp { font-family: var(--f-jp); font-size: clamp(20px, 1.95vw, 27px); letter-spacing: .16em; }
.sow-roomhead__en { font-family: var(--f-latin); font-style: italic; font-size: clamp(15px, 1.4vw, 19px); letter-spacing: .14em; color: var(--c-od-55); }
.sow-stay__ph { height: clamp(240px, 30vw, 420px); }
.sow-stay__cat { margin-top: clamp(24px, 2.9vw, 40px); font-family: var(--f-jp); font-size: clamp(17px, 1.4vw, 19px); line-height: 1.75; letter-spacing: .14em; }
.sow-stay__txt { margin-top: 18px; }
.sow-stay__more { margin-top: 32px; }
.sow-stay__note { margin-top: clamp(72px, 10vw, 140px); }

/* 流れる写真ストリップ
   高さは全枚そろえ、横幅だけを写真ごとに変えて流れに変化をつける。
   寸法は --strip-h から算出するので、画面幅にあわせて素直に伸び縮みする。 */
.sow-strip {
  --strip-h: clamp(220px, 32vw, 440px);
  margin: clamp(48px, 6vw, 80px) calc(var(--gut) * -1) 0;
  display: flex; align-items: center; gap: clamp(12px, 1.6vw, 22px);
  height: var(--strip-h);
  overflow: hidden;
}
.sow-strip > div { flex: none; height: var(--strip-h); }
.sow-strip .s1 { width: calc(var(--strip-h) * 1.48); }
.sow-strip .s2 { width: calc(var(--strip-h) * 0.70); }
.sow-strip .s3 { width: calc(var(--strip-h) * 1.62); }
.sow-strip .s4 { width: calc(var(--strip-h) * 0.80); }
.sow-strip .s5 { width: calc(var(--strip-h) * 1.52); }
.sow-strip .s6 { width: calc(var(--strip-h) * 0.68); }
.sow-strip .s7 { width: calc(var(--strip-h) * 1.57); }
.sow-strip .s8 { width: calc(var(--strip-h) * 0.79); }
.sow-center { display: flex; justify-content: center; margin-top: clamp(52px, 6.5vw, 90px); }

/* --------------------------------------------------------------------------
   9. TOP：SAUNA / DINING（スティッキー列＋写真列）
   -------------------------------------------------------------------------- */
.sow-sauna { padding-top: var(--sec-lg); }
.sow-sauna__grid { padding-bottom: var(--sec-lg); }
.sow-sticky { position: sticky; top: 0; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 40px 0; }
.sow-sticky .sow-label { margin-bottom: clamp(24px, 3.2vw, 44px); }
.sow-sticky .sow-h2    { margin-bottom: clamp(28px, 3.5vw, 48px); }
.sow-sticky .sow-lead  { margin-bottom: clamp(30px, 3.8vw, 56px); }
.sow-phcol { display: grid; gap: clamp(16px, 2vw, 28px); }

/* スクロールで切り替わる写真（TOP の SAUNA / DINING）
   ------------------------------------------------------------------
   既定（JS 無効時）は写真を縦に並べる。JS が動くと .is-seq が付き、
   1枚ぶんの枠に重ねてスクロールで切り替わるスライダーになる。
   切り替えは不透明度のクロスフェードのみ。 */
.sow-seq__col {
  --seq-step: 58vh;   /* 写真1枚あたりの送り量 */
  --seq-view: 100vh;  /* 貼り付く写真パネルの高さ */
  --seq-fade-time: 1.1s;
  --seq-fade-ease: cubic-bezier(.4, 0, .2, 1);
}
.sow-seq__frame { display: grid; gap: clamp(16px, 2vw, 28px); }
.sow-seq__i    { position: relative; aspect-ratio: 1 / 1; overflow: hidden; }
.sow-seq__img  { position: absolute; left: 0; right: 0; top: 0; height: 100%; }

.sow-seq__col.is-seq {
  height: calc(var(--seq-view) + (var(--seq-count) - 1) * var(--seq-step));
}
.sow-seq__col.is-seq .sow-seq__stage {
  position: sticky; top: 0; height: var(--seq-view);
  display: flex; flex-direction: column; justify-content: center;
}
.sow-seq__col.is-seq .sow-seq__frame {
  position: relative; display: block;
  width: 100%; max-width: min(100%, 74vh);
  aspect-ratio: 1 / 1; margin: 0 auto; overflow: hidden;
  background: var(--c-bg-alt);
}

/* 重ねた写真。表示していないものは透明にし、少し奥（小さめ）に置いておく。 */
.sow-seq__col.is-seq .sow-seq__i {
  position: absolute; left: 0; right: 0; top: 0; bottom: 0;
  aspect-ratio: auto; opacity: 0; z-index: 0;
  transform: scale(.94);
  transition: opacity var(--seq-fade-time) var(--seq-fade-ease),
              transform calc(var(--seq-fade-time) * 1.25) var(--seq-fade-ease);
  will-change: transform, opacity;
}

/* 表示中の写真：奥から手前へ寄ってきて等倍で止まる。下に敷かれた側。 */
.sow-seq__col.is-seq .sow-seq__i.is-on {
  opacity: 1; z-index: 2; transform: scale(1);
  /* 上の写真が消えきるまで覆っているので、こちらは即座に不透明にして下地を透けさせない */
  transition: opacity 0s linear, transform calc(var(--seq-fade-time) * 1.25) var(--seq-fade-ease);
}

/* 直前の写真：いちばん手前で、拡大しながら透けて消える（カメラを通り過ぎる）。
   消えきるまで上に重なっているので、入れ替わりの途中で下地は透けない。 */
.sow-seq__col.is-seq .sow-seq__i.is-prev { opacity: 0; z-index: 3; transform: scale(1.08); }

/* --------------------------------------------------------------------------
   10. TOP：EXPERIENCE / NEWS / ACCESS
   -------------------------------------------------------------------------- */
.sow-exp__head { text-align: center; margin-bottom: clamp(52px, 6.5vw, 90px); }
.sow-exp__head .sow-label { margin-bottom: 26px; }
/* マウスオンで写真が傾く（EXPERIENCE）。transform は JS が書き込む。 */
.sow-tilt { transform: perspective(900px); transition: transform .28s ease; will-change: transform; }
.sow-tilt > .sow-ph { backface-visibility: hidden; }
@media (prefers-reduced-motion: reduce) { .sow-tilt { transition: none; } }

.sow-exp__item--a { padding-top: clamp(0px, 5.7vw, 80px); }
.sow-exp__item--c { padding-top: clamp(0px, 10vw, 140px); }
.sow-exp__ph--a { height: clamp(260px, 30vw, 420px); }
.sow-exp__ph--b { height: clamp(300px, 37vw, 520px); }
.sow-exp__ph--c { height: clamp(240px, 27vw, 380px); }
.sow-exp__cap { margin-top: 24px; font-family: var(--f-jp); font-size: clamp(16px, 1.3vw, 18px); letter-spacing: .16em; }

/* 横スワイプ・スライダーの UI（TOP の EXPERIENCE／客室ページの写真セット。SP のみ表示。JS が生成する） */
.sow-expslider__ui { display: none; align-items: center; justify-content: space-between; gap: 20px; margin-top: 24px; }
.sow-expslider__dots { display: flex; gap: 10px; }
.sow-expslider__dot {
  width: 24px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.sow-expslider__dot::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c-ink-22); transition: background-color .3s var(--ease); }
.sow-expslider__dot[aria-current="true"]::before { background: var(--c-ink); }
.sow-dark .sow-expslider__dot::before { background: var(--c-od-35); }
.sow-dark .sow-expslider__dot[aria-current="true"]::before { background: var(--c-on-dark); }
.sow-expslider__arws { display: flex; gap: 10px; }
.sow-expslider__arw { background: none; padding: 0; cursor: pointer; }
.sow-expslider__arw:disabled { opacity: .3; cursor: default; }

.sow-movies { margin-top: clamp(80px, 11vw, 160px); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 3.5vw, 48px); }
.sow-movie { position: relative; display: block; width: 100%; }
.sow-movie__veil { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(20, 24, 20, .18); }
.sow-movie__play {
  width: clamp(56px, 5.4vw, 74px); height: clamp(56px, 5.4vw, 74px);
  border-radius: 50%; border: 1px solid rgba(244, 241, 233, .85);
  display: flex; align-items: center; justify-content: center;
  color: var(--c-light); font-size: 16px; padding-left: 4px;
}
/* YouTube のインライン再生（JS がサムネイルの上に iframe を重ねる） */
.sow-movie__frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; z-index: 2; background: #000; }
.sow-movie.is-playing { cursor: default; }
.sow-movie.is-playing .sow-movie__veil,
.sow-movie.is-playing .sow-plx { display: none; }
.sow-movie__cap { margin-top: 24px; font-family: var(--f-jp); font-size: clamp(16px, 1.3vw, 18px); letter-spacing: .16em; }
.sow-movie__txt { margin-top: 14px; }

/* 新着情報の見出し行：PC は見出しの下に View more（従来どおり 40px あけて）、
   SP では見出しと同じ行で右寄せ（下の 900px 以下の指定） */
.sow-news__headrow .sow-h2--c { margin-bottom: 40px; }

.sow-news__item {
  display: flex; align-items: center; gap: clamp(16px, 3vw, 40px);
  padding: clamp(20px, 2.2vw, 30px) 4px;
  border-top: 1px solid var(--c-ink-18);
}
.sow-news__item:last-child { border-bottom: 1px solid var(--c-ink-18); }
.sow-news__date { font-family: var(--f-latin); font-size: 14px; letter-spacing: .12em; color: var(--c-ink-55); width: 100px; flex: none; }
.sow-news__ttl  { flex: 1; font-size: clamp(14px, 1.1vw, 15px); letter-spacing: .08em; line-height: 1.9; }

.sow-access__ph { height: clamp(300px, 40vw, 560px); }
.sow-access__links { display: flex; flex-wrap: wrap; gap: 24px clamp(20px, 2.6vw, 36px); margin-top: clamp(28px, 3.2vw, 44px); }

/* --------------------------------------------------------------------------
   11. 予約 CTA / フッター
   -------------------------------------------------------------------------- */
.sow-cta { padding: var(--sec-md) var(--gut); color: var(--c-cream); text-align: center; }
.sow-cta__en { font-family: var(--f-latin); font-weight: 300; font-size: clamp(28px, 3.1vw, 40px); letter-spacing: .16em; margin-bottom: clamp(32px, 4vw, 56px); }

.sow-footer { background: var(--c-footer); color: var(--c-on-dark); padding: clamp(72px, 8vw, 110px) var(--gut) 44px; }
.sow-footer__grid { display: grid; grid-template-columns: 1fr auto; gap: clamp(40px, 5vw, 80px); }
.sow-footer__logo { height: 32px; width: auto; display: block; margin-bottom: clamp(24px, 2.5vw, 34px); }
.sow-footer__addr { font-size: 13px; line-height: 2; letter-spacing: .08em; color: var(--c-od-70); }
.sow-footer__ext { display: flex; flex-wrap: wrap; gap: 14px 24px; margin-top: 18px; font-family: var(--f-sans); font-size: 13px; letter-spacing: .08em; color: var(--c-od-70); }
.sow-footer__ext a { white-space: nowrap; border-bottom: 1px solid var(--c-od-35); padding-bottom: 4px; }
.sow-footer__ttl { font-family: var(--f-sans); font-size: 12px; letter-spacing: .22em; color: var(--c-od-45); margin-bottom: 26px; }
.sow-footer__list { display: grid; gap: 15px; font-family: var(--f-sans); font-size: 14px; letter-spacing: .1em; }
.sow-footer__list--2 { grid-template-columns: repeat(2, minmax(140px, max-content)); justify-content: start; gap: 15px clamp(28px, 3.4vw, 56px); }
.sow-footer__btm {
  display: flex; justify-content: center; align-items: center;
  margin-top: clamp(52px, 6.5vw, 90px); padding-top: 28px;
  border-top: 1px solid rgba(236, 231, 218, .15);
  font-size: 12px; letter-spacing: .12em; color: var(--c-od-50); text-align: center;
}
.sow-footer__btm .sow-en { letter-spacing: .16em; }

/* --------------------------------------------------------------------------
   12. 下層ページ共通
   -------------------------------------------------------------------------- */
.sow-crumb {
  display: flex; justify-content: space-between; gap: 16px;
  padding: 20px 4px 0;
  font-family: var(--f-sans); font-size: clamp(11px, .95vw, 12px);
  letter-spacing: .14em; color: var(--c-ink-60);
}
.sow-crumb__en { font-family: var(--f-latin); font-style: italic; letter-spacing: .18em; }

.sow-intro { padding-top: clamp(80px, 11vw, 170px); padding-bottom: var(--sec-sm); }
.sow-intro .sow-lead { margin-bottom: clamp(28px, 3vw, 40px); }

.sow-sechead {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: clamp(20px, 4vw, 60px); flex-wrap: wrap;
  padding-bottom: clamp(28px, 3.2vw, 44px);
  border-bottom: 1px solid var(--c-ink-22);
}
.sow-dark .sow-sechead { border-bottom-color: var(--c-od-22); }
.sow-sechead__l { display: flex; align-items: baseline; gap: clamp(16px, 2.2vw, 30px); flex-wrap: wrap; }
.sow-sechead__no { font-family: var(--f-latin); font-size: clamp(24px, 2.3vw, 32px); letter-spacing: .1em; color: var(--c-ink-55); }
.sow-dark .sow-sechead__no { color: var(--c-od-50); }
.sow-sechead__en { font-family: var(--f-latin); font-weight: 300; font-size: clamp(24px, 2.9vw, 40px); letter-spacing: .26em; }
.sow-sechead__en--sm { font-size: clamp(21px, 2.2vw, 30px); }
.sow-sechead__jp { font-family: var(--f-jp); font-size: clamp(17px, 1.5vw, 20px); letter-spacing: .18em; }
.sow-sechead__jp--lg { font-size: clamp(18px, 1.8vw, 24px); }
.sow-sechead__note { font-family: var(--f-sans); font-size: clamp(12px, 1vw, 13px); letter-spacing: .16em; color: var(--c-ink-60); }
.sow-dark .sow-sechead__note { color: var(--c-od-60); }
.sow-sechead__sub { font-family: var(--f-sans); font-size: 13px; letter-spacing: .18em; color: var(--c-ink-55); }
.sow-dark .sow-sechead__sub { color: var(--c-od-55); }

.sow-cent { text-align: center; }
.sow-cent--mb  { margin-bottom: clamp(56px, 7vw, 100px); }
.sow-cent .sow-label { margin-bottom: 26px; }
.sow-cent .sow-h2--sm { margin-bottom: clamp(24px, 2.6vw, 36px); }
.sow-cent .sow-h2--sm:last-child { margin-bottom: 0; }
.sow-cent .sow-lead { margin-left: auto; margin-right: auto; }

/* 客室・料理ページの写真グループ */
/* 客室の写真セット：大1枚（2段ぶち抜き）＋中2枚（縦）。DOM は 大→中→中 の順（SP スライダーの送り順）。 */
.sow-phset { display: grid; grid-template-columns: 1.6fr 1fr; grid-template-rows: 1fr 1fr; gap: 20px; height: clamp(300px, 40vw, 520px); }
.sow-phset--rev { grid-template-columns: 1fr 1.6fr; }
.sow-phset__main { grid-column: 1; grid-row: 1 / 3; }
.sow-phset__sub  { grid-column: 2; }
.sow-phset--rev .sow-phset__main { grid-column: 2; }
.sow-phset--rev .sow-phset__sub  { grid-column: 1; }
/* 写真セレクター（お食事ページ）：大きな1枚＋サムネイル最大4点 */
.sow-gal { display: block; }
.sow-gal--course { margin-top: clamp(32px, 4vw, 56px); }
.sow-gal__stage { position: relative; overflow: hidden; }
.sow-gal__stage--wide { height: clamp(280px, 40vw, 520px); }
.sow-gal__stage--32 { aspect-ratio: 3 / 2; }
.sow-gal__i { position: absolute; inset: 0; opacity: 0; transition: opacity 1s cubic-bezier(.4, 0, .2, 1); }
.sow-gal__i.is-on { opacity: 1; }
.sow-gal__thumbs { margin-top: 14px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.sow-gal__thumb {
  display: block; width: 100%; aspect-ratio: 3 / 2; padding: 0; border: 0; cursor: pointer;
  background-color: var(--c-ink-18); opacity: .5; transition: opacity .4s var(--ease);
  box-shadow: 0 0 0 1px transparent;
}
.sow-gal__thumb:hover, .sow-gal__thumb:focus-visible { opacity: .85; }
.sow-gal__thumb[aria-selected="true"] { opacity: 1; cursor: default; box-shadow: 0 0 0 1px var(--c-ink-30); }
.sow-dark .sow-gal__thumb[aria-selected="true"] { box-shadow: 0 0 0 1px var(--c-od-35); }
.sow-gal__thumbs:not([data-ready]) .sow-gal__thumb { opacity: 1; }   /* JS 無効時はサムネイルを普通の写真として見せる */
.sow-grid-12-1--top { align-items: start; }

.sow-phrow4 { margin-top: 20px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; height: clamp(110px, 14vw, 190px); }
.sow-phrow3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; height: clamp(160px, 19vw, 260px); }

/* 画像スライダー */
.sow-slider { position: relative; aspect-ratio: 4 / 3; overflow: hidden; }
.sow-slider__i { position: absolute; inset: 0; opacity: 0; transition: opacity .8s ease; }
.sow-slider__i.is-on { opacity: 1; }
.sow-slider__veil { position: absolute; left: 0; right: 0; bottom: 0; height: 110px; background: linear-gradient(rgba(20,26,22,0), rgba(20,26,22,.5)); pointer-events: none; }
.sow-slider__ui { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; }
.sow-slider__dots, .sow-slider__arrows { display: flex; gap: 10px; }
.sow-slider__dot {
  width: 28px; height: 28px; padding: 0; border-radius: 50%; cursor: pointer;
  display: flex; align-items: center; justify-content: center; line-height: 1;
  font-family: var(--f-sans); font-size: 12px; letter-spacing: 0;
  transition: all .4s var(--ease);
  border: 1px solid rgba(236, 231, 218, .5);
  color: rgba(236, 231, 218, .75); background: transparent;
}
.sow-slider__dot[aria-selected="true"] {
  border-color: rgba(236, 231, 218, .9);
  color: rgba(236, 231, 218, 1);
  background: rgba(236, 231, 218, .14);
}
.sow-slider__arrow {
  width: 30px; height: 30px; border: 0; padding: 0; background: transparent;
  color: rgba(236, 231, 218, .9); font-size: 12px; cursor: pointer; transition: color .3s;
}

/* プラン誘導バナー */
.sow-plan {
  margin-top: clamp(48px, 6vw, 90px);
  display: flex; align-items: center; gap: clamp(20px, 3.2vw, 44px);
  padding: clamp(18px, 2vw, 26px) clamp(20px, 2.5vw, 34px);
  border: 1px solid var(--c-ink-30);
}
.sow-dark .sow-plan { border-color: var(--c-od-28); }
.sow-plan__ph { display: block; width: 150px; height: 96px; flex: none; }
.sow-plan__b  { flex: 1; min-width: 0; }
.sow-plan__t  { display: block; font-family: var(--f-jp); font-size: clamp(16px, 1.4vw, 19px); letter-spacing: .16em; line-height: 1.7; }
.sow-plan__s  { display: block; margin-top: 12px; font-family: var(--f-sans); font-size: 13px; letter-spacing: .12em; color: var(--c-ink-60); }
.sow-dark .sow-plan__s { color: var(--c-od-60); }

/* MENU リスト */
.sow-menu { font-size: clamp(14px, 1vw, 15px); line-height: 2.2; letter-spacing: .08em; padding-top: 26px; }
.sow-menu li { padding-bottom: 18px; }
.sow-menu li:last-child { padding-bottom: 0; }

/* アクセスの経路行 */
.sow-routes { display: grid; gap: 26px; }
.sow-route { display: flex; align-items: center; gap: 20px; font-size: clamp(14px, 1vw, 15px); letter-spacing: .08em; }
.sow-route dt { width: 150px; flex: none; padding: 16px 0; border-bottom: 1px solid var(--c-od-20); margin: 0; }
.sow-route dd { flex: 1; padding: 16px 0; border-bottom: 1px solid var(--c-od-20); color: var(--c-od-75); margin: 0; }

/* 地図埋め込み枠 */
.sow-map { min-height: clamp(280px, 34vw, 460px); position: relative; }
.sow-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sow-map--ph {
  border: 1px dashed var(--c-ink-30); background: #eae6dc;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 16px; color: var(--c-ink-55); text-align: center; padding: 24px;
}
.sow-dark .sow-map--ph { border-color: rgba(236,231,218,.3); background: transparent; color: var(--c-od-50); }
.sow-map__lb { font-family: var(--f-sans); font-size: 12px; letter-spacing: .28em; }
.sow-map__tx { font-size: 15px; letter-spacing: .14em; }

/* リンク集 */
.sow-links2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(36px, 5.2vw, 80px); }
.sow-links2 .sow-links__ttl { font-family: var(--f-sans); font-size: 12px; letter-spacing: .24em; color: var(--c-ink-45); padding-bottom: 20px; }
.sow-links2 .sow-links__ttl + a { border-top: 1px solid var(--c-ink-18); }
.sow-links2 .sow-links__ttl:not(:first-child) { padding-top: 44px; }
.sow-links2 a {
  display: flex; justify-content: space-between; gap: 16px;
  padding: 18px 0; border-top: 1px solid var(--c-ink-18);
  font-size: clamp(14px, 1vw, 15px); letter-spacing: .08em;
}
.sow-links2 a:last-child { border-bottom: 1px solid var(--c-ink-18); }
.sow-links2 a span { color: var(--c-ink-45); }

/* --------------------------------------------------------------------------
   13. お問い合わせ / 記事・固定ページ本文
   -------------------------------------------------------------------------- */

.sow-prose { font-size: clamp(14px, 1.1vw, 16px); line-height: 2.15; letter-spacing: .08em; color: var(--c-ink-70); }
.sow-prose > * + * { margin-top: 1.9em; }
.sow-prose h2 { font-family: var(--f-jp); font-weight: 400; font-size: clamp(19px, 1.8vw, 25px); letter-spacing: .14em; line-height: 1.75; color: var(--c-ink); margin-top: 2.6em; padding-bottom: .7em; border-bottom: 1px solid var(--c-ink-18); }
.sow-prose h3 { font-family: var(--f-jp); font-weight: 400; font-size: clamp(17px, 1.5vw, 20px); letter-spacing: .14em; line-height: 1.8; color: var(--c-ink); margin-top: 2.2em; }
.sow-prose h4 { font-family: var(--f-sans); font-size: 15px; letter-spacing: .12em; color: var(--c-ink); margin-top: 2em; }
.sow-prose a { border-bottom: 1px solid var(--c-ink-30); }
.sow-prose ul, .sow-prose ol { padding-left: 1.4em; }
.sow-prose ul { list-style: disc; }
.sow-prose ol { list-style: decimal; }
.sow-prose li { margin-top: .5em; }
.sow-prose li::marker { color: var(--c-ink-45); }
.sow-prose img, .sow-prose .wp-block-image { max-width: 100%; height: auto; }
.sow-prose blockquote { border-left: 1px solid var(--c-ink-30); padding-left: 1.6em; color: var(--c-ink-60); }
.sow-prose table { width: 100%; border-collapse: collapse; font-size: .95em; }
.sow-prose th, .sow-prose td { padding: 14px 12px; border-bottom: 1px solid var(--c-ink-18); text-align: left; vertical-align: top; }
.sow-prose th { color: var(--c-ink-55); font-weight: 400; }
.sow-prose figcaption { font-size: 13px; color: var(--c-ink-55); margin-top: .8em; }
.sow-tablewrap { overflow-x: auto; }

.sow-article__head { padding-bottom: clamp(32px, 4vw, 52px); border-bottom: 1px solid var(--c-ink-18); margin-bottom: clamp(40px, 5vw, 64px); }
.sow-article__date { font-family: var(--f-latin); font-size: 14px; letter-spacing: .12em; color: var(--c-ink-55); }
.sow-article__ttl { margin-top: 18px; font-family: var(--f-jp); font-weight: 400; font-size: clamp(21px, 2.2vw, 30px); line-height: 1.7; letter-spacing: .12em; }
.sow-article__thumb { margin-bottom: clamp(40px, 5vw, 64px); }

.sow-pager { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: clamp(56px, 7vw, 96px); padding-top: 32px; border-top: 1px solid var(--c-ink-18); font-family: var(--f-sans); font-size: 13px; letter-spacing: .14em; }
.sow-pagenav { display: flex; justify-content: center; gap: 10px; margin-top: clamp(56px, 7vw, 90px); font-family: var(--f-sans); font-size: 13px; letter-spacing: .1em; }
.sow-pagenav .page-numbers { display: flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px; border: 1px solid var(--c-ink-18); }
.sow-pagenav .page-numbers.current { background: var(--c-ink); color: var(--c-cream); border-color: var(--c-ink); }

/* フォーム */
.sow-form { display: grid; gap: clamp(20px, 2.4vw, 30px); }
.sow-form label { display: block; font-family: var(--f-sans); font-size: 13px; letter-spacing: .16em; color: var(--c-ink-60); margin-bottom: 12px; }
.sow-form input[type="text"], .sow-form input[type="email"], .sow-form input[type="tel"],
.sow-form input[type="date"], .sow-form input[type="number"], .sow-form select, .sow-form textarea {
  width: 100%; background: transparent; border: 0; border-bottom: 1px solid var(--c-ink-30);
  padding: 12px 2px; font-family: var(--f-jp); font-size: 16px; letter-spacing: .06em; color: var(--c-ink);
  border-radius: 0; -webkit-appearance: none; appearance: none;
}
.sow-form textarea { min-height: 180px; line-height: 2; resize: vertical; }
.sow-form .sow-req { color: #9a5b3d; margin-left: .5em; font-size: 11px; }
.sow-form__submit { justify-self: start; margin-top: 12px; border: 0; cursor: pointer; background: var(--c-ink); color: var(--c-cream); }
.sow-form__recaptcha { font-size: 12px; line-height: 1.9; letter-spacing: .04em; color: var(--c-ink-45); }
.sow-form__recaptcha a { border-bottom: 1px solid var(--c-ink-30); }

/* Contact Form 7 を固定ページ本文に埋め込んだ場合（page-contact.php）。
   プラグインの素の見た目を、テーマ内蔵フォーム（.sow-form）と同じトーンに揃える。
   項目は CF7 側の定義がそのまま使われる。 */
.sow-form--cf7 { display: block; }

/* 文字まわり：CF7 のフォーム編集画面でどんな書き方（<label> の有無、<p> 直書き、<br> など）をしても
   テーマの書体に揃える。項目名＝小さなサンセリフ、入力文字＝本文書体、ブラウザ既定のフォームフォントは使わない。 */
.sow-form--cf7 .wpcf7 form,
.sow-form--cf7 .wpcf7 form label { font-family: var(--f-sans); font-size: 13px; letter-spacing: .16em; line-height: 1.9; color: var(--c-ink-60); }
.sow-form--cf7 input, .sow-form--cf7 textarea, .sow-form--cf7 select, .sow-form--cf7 button,
.sow-form--cf7 option { font-family: var(--f-jp); font-size: 16px; letter-spacing: .06em; line-height: 1.6; color: var(--c-ink); }
.sow-form--cf7 ::placeholder { font-family: var(--f-jp); letter-spacing: .06em; color: var(--c-ink-30); opacity: 1; }
.sow-form--cf7 .wpcf7 form .wpcf7-list-item-label { font-family: var(--f-jp); font-size: 15px; letter-spacing: .06em; color: var(--c-ink); }
.sow-form--cf7 .wpcf7 form .sow-req,
.sow-form--cf7 .wpcf7 form .required { font-family: var(--f-sans); font-size: 11px; letter-spacing: .16em; color: #9a5b3d; margin-left: .5em; }
/* 入力欄を含まない段落（注意書きなど）は本文の注記と同じ扱い */
.sow-form--cf7 .wpcf7 form > p:not(:has(.wpcf7-form-control-wrap, .wpcf7-submit)) {
  font-family: var(--f-jp); font-size: 14px; letter-spacing: .06em; line-height: 2; color: var(--c-ink-60);
}
.sow-form--cf7 .wpcf7 form a { border-bottom: 1px solid var(--c-ink-30); }
.sow-form--cf7 .wpcf7 form > p,
.sow-form--cf7 .wpcf7 form > div:not([style*="display"]):not(.wpcf7-response-output) { margin: 0 0 clamp(20px, 2.4vw, 30px); }
.sow-form--cf7 .wpcf7 form > p:last-of-type { margin-bottom: 0; }
.sow-form--cf7 label { margin-bottom: 0; }
.sow-form--cf7 .wpcf7-form-control-wrap { display: block; margin-top: 12px; }
.sow-form--cf7 label > br,
.sow-form--cf7 .wpcf7 form > p:has(.wpcf7-form-control-wrap) > br { display: none; }   /* CF7 のひな形にある <br> は無視（wrap を block にしているため） */
.sow-form--cf7 .wpcf7-text, .sow-form--cf7 .wpcf7-email, .sow-form--cf7 .wpcf7-tel, .sow-form--cf7 .wpcf7-url,
.sow-form--cf7 .wpcf7-date, .sow-form--cf7 .wpcf7-number, .sow-form--cf7 .wpcf7-select, .sow-form--cf7 .wpcf7-textarea {
  width: 100%; background: transparent; border: 0; border-bottom: 1px solid var(--c-ink-30);
  padding: 12px 2px; font-family: var(--f-jp); font-size: 16px; letter-spacing: .06em; color: var(--c-ink);
  border-radius: 0; -webkit-appearance: none; appearance: none;
}
.sow-form--cf7 .wpcf7-textarea { min-height: 180px; line-height: 2; resize: vertical; }
.sow-form--cf7 .wpcf7-select { cursor: pointer; }
.sow-form--cf7 .wpcf7-list-item { display: inline-block; margin: 8px 1.6em 0 0; font-size: 15px; letter-spacing: .06em; color: var(--c-ink); }
.sow-form--cf7 .wpcf7-list-item input { margin-right: .5em; accent-color: var(--c-ink); }
.sow-form--cf7 .wpcf7-acceptance .wpcf7-list-item { margin-right: 0; }
.sow-form--cf7 .wpcf7 form .wpcf7-submit {
  display: inline-flex; align-items: center; gap: 20px;
  margin-top: 12px; border: 0; border-radius: 999px; cursor: pointer;
  padding: clamp(16px, 1.5vw, 22px) clamp(32px, 3.6vw, 52px);
  font-family: var(--f-sans); font-size: clamp(13px, 1vw, 14px); letter-spacing: .18em;
  background: var(--c-ink); color: var(--c-cream);
  -webkit-appearance: none; appearance: none;
}
.sow-form--cf7 .wpcf7 form .wpcf7-submit:disabled { opacity: .5; cursor: default; }
.sow-form--cf7 .wpcf7-spinner { margin: 0 0 0 16px; vertical-align: middle; }
.sow-form--cf7 .wpcf7-not-valid-tip { display: block; margin-top: 8px; font-family: var(--f-sans); font-size: 12px; letter-spacing: .08em; color: #9a5b3d; }
.sow-form--cf7 .wpcf7 form .wpcf7-response-output {
  margin: 36px 0 0; padding: 22px 26px; border: 1px solid var(--c-ink-30);
  font-family: var(--f-jp); font-size: clamp(14px, 1.1vw, 16px); line-height: 2; letter-spacing: .06em; color: var(--c-ink);
}
.sow-form--cf7 .wpcf7 form.sent .wpcf7-response-output { border-color: var(--c-ink); }
.sow-form--cf7 .wpcf7 form.invalid .wpcf7-response-output,
.sow-form--cf7 .wpcf7 form.unaccepted .wpcf7-response-output,
.sow-form--cf7 .wpcf7 form.failed .wpcf7-response-output,
.sow-form--cf7 .wpcf7 form.aborted .wpcf7-response-output,
.sow-form--cf7 .wpcf7 form.spam .wpcf7-response-output { border-color: #9a5b3d; color: #9a5b3d; }
/* 送信完了後は、テーマ内蔵フォームと同じく完了メッセージだけを残す */
.sow-form--cf7 .wpcf7 form.sent > *:not(.wpcf7-response-output) { display: none; }
.sow-form--cf7 .wpcf7 form.sent .wpcf7-response-output { margin-top: 0; }

/* reCAPTCHA v3 のバッジ（画面右下）を非表示にする。
   Google の規約により、代わりの文言（.sow-form__recaptcha）をお問い合わせフォーム内に表示している。 */
.grecaptcha-badge { visibility: hidden; }

.sow-404 { text-align: center; padding: clamp(100px, 16vw, 200px) var(--gut); }
.sow-404__en { font-family: var(--f-latin); font-weight: 300; font-size: clamp(56px, 9vw, 120px); letter-spacing: .16em; color: var(--c-ink-30); }

.sow-searchform { display: flex; gap: 12px; align-items: flex-end; max-width: 480px; }
.sow-searchform input[type="search"] {
  flex: 1; background: transparent; border: 0; border-bottom: 1px solid var(--c-ink-30);
  padding: 12px 2px; font-family: var(--f-jp); font-size: 16px; color: var(--c-ink); border-radius: 0;
}
.sow-searchform button { border: 0; background: none; cursor: pointer; font-family: var(--f-sans); font-size: 13px; letter-spacing: .18em; padding: 12px 4px; border-bottom: 1px solid var(--c-ink); }

/* WordPress 標準クラス */
.alignleft  { float: left;  margin: .4em 1.6em 1.2em 0; }
.alignright { float: right; margin: .4em 0 1.2em 1.6em; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 100%; }
.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* --------------------------------------------------------------------------
   14. レスポンシブ
   -------------------------------------------------------------------------- */
@media (max-width: 1180px) {
  .sow-nav { gap: 20px; font-size: 12px; }
  .sow-nav__cta { padding: 11px 22px; }
}

@media (max-width: 1024px) {
  .sow-grid-side  { grid-template-columns: 220px 1fr; }
  .sow-plan__ph   { width: 120px; height: 80px; }
  .sow-dl--wide   { grid-template-columns: 120px 1fr; }
  .sow-route dt   { width: 120px; }
}

/* タブレット以下：ナビをドロワーへ、多くの2カラムを1カラムへ */
@media (max-width: 900px) {
  .sow-nav { display: none; }
  .sow-burger { display: block; }
  .sow-mcta { display: grid; }
  body { padding-bottom: 58px; }
  :root { --mcta-h: 58px; }

  .sow-grid2,
  .sow-grid-t-l,
  .sow-grid-side,
  .sow-grid-1-135,
  .sow-grid-135-1,
  .sow-grid-1-115,
  .sow-grid-115-1,
  .sow-grid-12-1,
  .sow-stay__grid,
  .sow-movies,
  .sow-links2,
  .sow-footer__grid { grid-template-columns: 1fr; }

  .sow-grid-135-1 > *:first-child { order: 2; }   /* DINING：写真を下に */
  .sow-grid-115-1 > *:first-child { order: 2; }
  .sow-sticky { position: static; min-height: 0; padding: 0; }

  /* SAUNA / DINING：見出し・キャプション・写真を1画面に収めたパネルを
     ヘッダー直下に貼り付け、セクションをスクロールする間に写真だけ切り替える。
     （JS が .is-seq-m を付ける。JS 無効時は写真が縦に並ぶ既定の表示） */
  .sow-seqwrap.is-seq-m {
    --seq-step: 50vh;   /* 写真1枚あたりの送り量 */
    height: calc(100vh + (var(--seq-count) - 1) * var(--seq-step));
    height: calc(100svh + (var(--seq-count) - 1) * var(--seq-step));
    padding-top: 0; padding-bottom: 0;
  }
  .sow-seqwrap.is-seq-m .sow-seqpin {
    position: sticky; top: var(--header-h);
    height: calc(100vh - var(--header-h) - var(--mcta-h));
    height: calc(100svh - var(--header-h) - var(--mcta-h));
    display: flex; flex-direction: column; justify-content: center;
    gap: clamp(18px, 3.5vh, 32px);
    padding: clamp(20px, 4vh, 40px) 0;
  }
  .sow-seqwrap.is-seq-m .sow-sticky { flex: none; }
  .sow-seqwrap.is-seq-m .sow-sticky .sow-label { margin-bottom: 14px; }
  .sow-seqwrap.is-seq-m .sow-sticky .sow-h2    { margin-bottom: 14px; }
  .sow-seqwrap.is-seq-m .sow-sticky .sow-lead  { margin-bottom: 18px; }
  .sow-seqwrap.is-seq-m .sow-seq__col,
  .sow-seqwrap.is-seq-m .sow-seq__col.is-seq { height: auto; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  .sow-seqwrap.is-seq-m .sow-seq__col.is-seq .sow-seq__stage { position: static; height: auto; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  .sow-seqwrap.is-seq-m .sow-seq__col.is-seq .sow-seq__frame {
    flex: 1 1 auto; min-height: 140px; width: 100%; max-width: none;
    aspect-ratio: auto; margin: 0;
  }
  .sow-concept__ph .a { width: 100%; aspect-ratio: 3 / 2; }

  .sow-grid3 { grid-template-columns: 1fr 1fr; }

  /* EXPERIENCE：写真とキャプションを横スワイプのスライダーに */
  .sow-grid3.sow-expslider {
    display: flex; gap: 14px;
    margin-left: calc(var(--gut) * -1); margin-right: calc(var(--gut) * -1);
    padding-left: var(--gut); padding-right: var(--gut);
    overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory; scroll-padding-left: var(--gut);
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .sow-grid3.sow-expslider::-webkit-scrollbar { display: none; }
  .sow-grid3.sow-expslider > * { flex: 0 0 min(78%, 360px); scroll-snap-align: start; padding-top: 0; }
  .sow-grid3.sow-expslider .sow-ph { height: auto; aspect-ratio: 1 / 1; }
  .sow-expslider__ui.is-on { display: flex; }

  .sow-mapgrid { grid-template-columns: 1fr !important; }
  .sow-exp__item--a, .sow-exp__item--c { padding-top: 0; }
  .sow-exp__ph--a, .sow-exp__ph--b, .sow-exp__ph--c { height: clamp(200px, 34vw, 300px); }

  /* 客室の写真セット：JS 無効時は縦積み、JS が .sow-phset--slider を付けると横スワイプのスライダー */
  .sow-phset, .sow-phset--rev { grid-template-columns: 1fr; grid-template-rows: none; height: auto; }
  .sow-phset > .sow-phset__main, .sow-phset > .sow-phset__sub { grid-column: auto; grid-row: auto; aspect-ratio: 3 / 2; }
  .sow-phset.sow-phset--slider {
    display: flex; gap: 14px;
    margin-left: calc(var(--gut) * -1); margin-right: calc(var(--gut) * -1);
    padding-left: var(--gut); padding-right: var(--gut);
    overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory; scroll-padding-left: var(--gut);
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .sow-phset.sow-phset--slider::-webkit-scrollbar { display: none; }
  .sow-phset.sow-phset--slider > .sow-ph { flex: 0 0 min(84%, 440px); scroll-snap-align: start; aspect-ratio: 3 / 2; }
  .sow-phrow4 { grid-template-columns: repeat(2, 1fr); height: auto; }
  .sow-phrow4 > .sow-ph { aspect-ratio: 3 / 2; }
  .sow-gal__stage--wide { height: auto; aspect-ratio: 3 / 2; }
  .sow-gal__thumbs { gap: 10px; margin-top: 10px; }
  .sow-phrow3 { height: auto; }
  .sow-phrow3 > .sow-ph { aspect-ratio: 3 / 2; }
  .sow-stay__ph, .sow-access__ph { height: clamp(220px, 46vw, 380px); }

  .sow-footer__grid { gap: 44px; }
  .sow-sechead { align-items: flex-start; }
}

@media (max-width: 640px) {
  body { line-height: 1.95; }
  .sow-lead, .sow-body { line-height: 2.05; }
  .sow-h1 { font-size: clamp(21px, 6.3vw, 26px); letter-spacing: .08em; line-height: 1.7; }
  /* 見出しは字間を少し詰め、1文節（句読点まで）が1行に収まりやすくする */
  .sow-h2, .sow-h2--c, .sow-h2--sm, .sow-h3, .sow-h3--sm { letter-spacing: .08em; }
  .sow-h2 { font-size: 20px; }
  .sow-h2--c { font-size: 20px; }

  .sow-hero__scroll { display: none; }
  /* ヒーロー下の文字列は SP では出さず、動画の下にも左右と同じ太さの枠を残す */
  .sow-heroline { display: none; }
  .sow-wrap--hero { padding-bottom: var(--hero-gut); }
  .sow-crumb { flex-direction: column; gap: 6px; }

  /* アンカーリンク集（アクセスページなど）は2列に整列させる */
  .sow-linkrow { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 20px; }
  .sow-linkrow .sow-link { display: flex; justify-content: space-between; padding: 12px 0 10px; letter-spacing: .14em; border-bottom-color: var(--c-ink-30); }

  .sow-grid3 { grid-template-columns: 1fr; }
  .sow-phrow4 { grid-template-columns: 1fr 1fr; gap: 12px; }
  .sow-phcol { gap: 14px; }
  .sow-seq__col {
    --seq-step: 50vh;
    /* 枠は横幅いっぱいの正方形。その高さぶんでステージを組む */
    --seq-view: calc(100vw - var(--gut) * 2 + 32px);
  }
  .sow-seq__col.is-seq .sow-seq__stage { top: clamp(64px, 9vh, 100px); }

  .sow-dl, .sow-dl--wide, .sow-dl--narrow { grid-template-columns: 1fr; }
  .sow-dl dt { padding-bottom: 0; border-bottom: 0 !important; }
  .sow-dl dd { padding-top: 8px; }
  .sow-dl--top dd { border-top: 0; }

  .sow-route { flex-direction: column; align-items: stretch; gap: 0; }
  .sow-route dt { width: auto; padding-bottom: 0; border-bottom: 0; }
  .sow-route dd { padding-top: 6px; }
  .sow-routes { gap: 18px; }

  .sow-plan { flex-wrap: wrap; gap: 16px; }
  .sow-plan__ph { width: 88px; height: 62px; }
  .sow-plan__b { flex: 1 1 60%; }

  .sow-news__item { align-items: flex-start; flex-wrap: wrap; gap: 6px 16px; }
  .sow-news__date { width: auto; }
  .sow-news__ttl { flex: 1 1 100%; }
  /* 新着情報：見出しと View more を同じ行に（右寄せ） */
  .sow-news__headrow { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
  .sow-news__headrow .sow-h2--c { margin-bottom: 0; }
  .sow-news__more { flex: none; padding-bottom: 6px; white-space: nowrap; }
  .sow-footer__list--2 { grid-template-columns: repeat(2, minmax(0, max-content)); gap: 15px 28px; }

}

/* --------------------------------------------------------------------------
   初期ローディング画面
   大きめの円がゆっくり周回し、その中央の Loading が周回に合わせて明滅する。
   html.is-loading の間はスクロールを止め、読み込み完了で .is-done →
   霧が晴れるように（ぼかし＋わずかな拡大＋薄い霞が外へ流れる）消える。
   -------------------------------------------------------------------------- */
html.is-loading { overflow: hidden; }
.sow-loader {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: var(--c-bg);
  color: var(--c-ink);
  opacity: 1; visibility: visible;
  overflow: hidden;
  transition: opacity 1.4s var(--ease), filter 1.4s var(--ease), transform 1.6s var(--ease), visibility 0s linear 0s;
}
/* 霞。2枚の淡い光の層が、明けるときに左右へ流れて薄れる */
.sow-loader::before,
.sow-loader::after {
  content: ""; position: absolute; inset: -20%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(255, 255, 255, .85), rgba(255, 255, 255, 0) 70%);
  filter: blur(40px);
  opacity: .9;
  transition: transform 1.8s var(--ease), opacity 1.6s var(--ease);
}
.sow-loader::before { transform: translate(-22%, -10%) scale(.9); }
.sow-loader::after  { transform: translate(24%, 14%) scale(1.05); }
.sow-loader.is-done {
  opacity: 0; visibility: hidden;
  filter: blur(22px);
  transform: scale(1.06);
  transition: opacity 1.4s var(--ease), filter 1.4s var(--ease), transform 1.6s var(--ease), visibility 0s linear 1.6s;
  pointer-events: none;
}
.sow-loader.is-done::before { transform: translate(-70%, -30%) scale(1.4); opacity: 0; }
.sow-loader.is-done::after  { transform: translate(70%, 40%) scale(1.5); opacity: 0; }

.sow-loader__ring {
  position: relative; z-index: 1;
  display: flex; align-items: center; justify-content: center;
  width: clamp(200px, 26vw, 300px);
  height: clamp(200px, 26vw, 300px);
  border-radius: 50%;
  border: 1.5px solid var(--c-ink-14);
  border-top-color: var(--c-ink);
  animation: sow-spin 1.4s linear infinite;
}
.sow-loader__text {
  position: absolute; z-index: 2;
  left: 50%; top: 50%; transform: translate(-50%, -50%);
  font-family: var(--f-latin);
  font-size: clamp(15px, 1.4vw, 19px);
  letter-spacing: .32em; text-transform: uppercase; white-space: nowrap;
  color: var(--c-ink);
  padding-left: .32em; /* 字間ぶん右に寄るのを打ち消して中央に */
  animation: sow-blink 1.4s ease-in-out infinite; /* 円の1周と同じ周期で明滅 */
}
@keyframes sow-spin  { to { transform: rotate(360deg); } }
@keyframes sow-blink { 0%, 100% { opacity: .18; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .sow-loader__ring { animation: none; border-top-color: var(--c-ink-30); }
  .sow-loader__text { animation: none; opacity: .8; }
  .sow-loader, .sow-loader::before, .sow-loader::after { transition: none; }
}