/* ================================================================
   FTR トップページ v2 — top-v2.css（第2調整：軽量化・明色化）
   正面玄関：暗い展示室ではなく、明るい美術館のロビー。
   HEROのみ写真上のダーク配色を維持（サイト共通のダークテーマを踏襲）。
   HERO以外の全セクションは、このファイル内だけで完結する独自のライトトークンを使う
   （style.cssのグローバル:root値は変更しない＝他ページへの影響なし）。
   ================================================================ */

.ftrtop {
  position: relative;
  overflow-x: hidden;
  /* ライトトークン（.ftrtop内のみ有効。サイト共通の--bg/--textは不変） */
  --top-bg:       #f7f4ee; /* オフホワイト／アイボリー */
  --top-ink:      #2b2622; /* 暖色寄りのダークグレー（純黒ではない） */
  --top-body:     rgba(43,38,34,0.72);
  --top-sub:      rgba(43,38,34,0.5);
  --top-sub-dim:  rgba(43,38,34,0.36);
  --top-line:     rgba(43,38,34,0.14);
  --top-line-soft:rgba(43,38,34,0.08);
  background: var(--top-bg);
}

/* ENTERから#museumへのスムーズスクロール（HOME=front-page.phpのみに読み込まれるCSSのため、
   他ページのhtml要素には影響しない）。JS不要でアンカーリンクのみで機能する。
   prefers-reduced-motionでは即時ジャンプに戻す。 */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
/* MUSEUMナビ・ENTERの共通遷移先。固定ヘッダー（.is-past-hero時）に隠れないよう余白を確保 */
#museum { scroll-margin-top: 88px; }

/* ---------------------------------------------------------------
   NAV — mobile
   初期表示・HERO表示中は非表示。HEROを抜けたらJS（IntersectionObserver）が
   is-past-heroを付与し、固定ヘッダーとしてフェード表示する。
--------------------------------------------------------------- */
.ftrtop-nav-m {
  position: absolute; top: 0; left: 0; right: 0; z-index: 40;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 22px 0;
  opacity: 0; transform: translateY(-8px); pointer-events: none;
  transition: opacity 280ms ease, transform 280ms ease, background-color 280ms ease, border-color 280ms ease;
}
.ftrtop-nav-m.is-past-hero {
  position: fixed;
  opacity: 1; transform: translateY(0); pointer-events: auto;
  padding: 16px 22px;
  background: var(--top-bg);
  border-bottom: 1px solid var(--top-line-soft);
}
.ftrtop-nav-m__logo {
  font-family: var(--f-serif); font-weight: 300; font-size: 12px;
  color: #f0ebe3; letter-spacing: 0.3em; text-transform: uppercase;
  text-decoration: none;
  transition: color 280ms ease;
}
.ftrtop-nav-m.is-past-hero .ftrtop-nav-m__logo { color: var(--top-ink); }
.ftrtop-nav-m__btn {
  background: none; border: none; cursor: pointer;
  display: flex; flex-direction: column; gap: 5px; padding: 8px;
}
.ftrtop-nav-m__btn span { width: 20px; height: 1px; background: #f0ebe3; display: block; transition: background-color 280ms ease; }
.ftrtop-nav-m.is-past-hero .ftrtop-nav-m__btn span { background: var(--top-ink); }

.ftrtop-drawer {
  display: none;
  position: fixed; inset: 0; z-index: 200;
  background: rgba(247,244,238,0.98); backdrop-filter: blur(16px);
}
.ftrtop-drawer.is-open { display: block; }
.ftrtop-drawer__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 24px 28px; margin-bottom: 32px;
}
.ftrtop-drawer__head span {
  font-family: var(--f-serif); font-weight: 300; font-size: 12px;
  color: var(--top-sub); letter-spacing: 0.32em; text-transform: uppercase;
}
.ftrtop-drawer__head button {
  background: none; border: none; cursor: pointer;
  font-family: var(--f-serif); font-weight: 300; font-size: 22px;
  color: var(--top-sub); line-height: 1; padding: 6px;
}
.ftrtop-drawer__nav { display: flex; flex-direction: column; padding: 0 28px; }
.ftrtop-drawer__nav a {
  display: block; font-family: var(--f-serif); font-weight: 300; font-size: 18px;
  color: var(--top-ink); letter-spacing: 0.22em; text-transform: uppercase;
  text-decoration: none; padding: 22px 0; border-bottom: 1px solid var(--top-line-soft);
}
.ftrtop-drawer__nav a:last-child { border-bottom: none; }
.ftrtop-drawer__nav a.is-accent { color: var(--terra); font-size: 16px; }

/* ---------------------------------------------------------------
   NAV — desktop
   モバイルと同じ考え方：HERO表示中は非表示、HEROを抜けたら固定ヘッダーとして表示。
--------------------------------------------------------------- */
.ftrtop-nav-d {
  display: none;
  position: absolute; top: 0; left: 0; right: 0; z-index: 40;
  align-items: center; justify-content: space-between;
  padding: 36px 64px 0;
  opacity: 0; transform: translateY(-8px); pointer-events: none;
  transition: opacity 280ms ease, transform 280ms ease, background-color 280ms ease, border-color 280ms ease;
}
.ftrtop-nav-d.is-past-hero {
  position: fixed;
  opacity: 1; transform: translateY(0); pointer-events: auto;
  padding: 22px 64px;
  background: var(--top-bg);
  border-bottom: 1px solid var(--top-line-soft);
}
.ftrtop-nav-d__logo {
  font-family: var(--f-serif); font-weight: 300; font-size: 14px;
  color: #f0ebe3; letter-spacing: 0.4em; text-transform: uppercase;
  transition: color 280ms ease;
}
.ftrtop-nav-d.is-past-hero .ftrtop-nav-d__logo { color: var(--top-ink); }
.ftrtop-nav-d__links { display: flex; align-items: center; gap: 30px; }
.ftrtop-nav-d__links a {
  font-family: var(--f-serif); font-weight: 300; font-size: 11px;
  color: rgba(240,230,210,0.7); letter-spacing: 0.3em; text-transform: uppercase;
  text-decoration: none; white-space: nowrap; transition: color .3s;
}
.ftrtop-nav-d__links a:hover { color: #f0ebe3; }
.ftrtop-nav-d__links a.is-accent { color: var(--terra); }
.ftrtop-nav-d__links a.is-accent:hover { color: var(--terra); opacity: .8; }
.ftrtop-nav-d.is-past-hero .ftrtop-nav-d__links a { color: rgba(43,38,34,0.6); }
.ftrtop-nav-d.is-past-hero .ftrtop-nav-d__links a:hover { color: var(--top-ink); }
.ftrtop-nav-d.is-past-hero .ftrtop-nav-d__links a.is-accent { color: var(--terra); }

/* ---------------------------------------------------------------
   1. HERO（写真上のダーク配色は維持。サイト共通ダークテーマの延長） -
--------------------------------------------------------------- */
.ftrtop-hero {
  position: relative;
  min-height: 100vh; min-height: 100svh;
  display: flex; align-items: center;
  background: #000; overflow: hidden;
}
.ftrtop-hero__photo {
  position: absolute; inset: 0;
  background-size: cover; background-position: center center;
  filter: saturate(0.78) contrast(1.04) brightness(0.72);
  transform: scale(1.02);
}
.ftrtop-hero__wash {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(14,12,9,0.55) 0%, rgba(14,12,9,0.18) 32%, rgba(14,12,9,0.34) 60%, rgba(10,9,7,0.96) 100%);
}
.ftrtop-hero__content {
  /* 縦中央〜やや下に配置。padding-top(vh)>padding-bottom(px)の非対称でセンターより下へ寄せる */
  position: relative; z-index: 10;
  width: 100%; padding: 17vh 28px 40px;
}
.ftrtop-hero__wordmark {
  font-family: var(--f-serif); font-weight: 300; font-size: 30px;
  color: #f0ebe3; letter-spacing: 0.14em; line-height: 1.2;
  margin-bottom: 12px;
}
.ftrtop-hero__desc {
  font-family: var(--f-jp); font-weight: 200; font-size: 14px; line-height: 1.8;
  color: rgba(240,230,210,0.78); letter-spacing: 0.05em;
  margin-bottom: 0; max-width: 320px;
}
.ftrtop-hero__scrollcue {
  position: absolute; left: 28px; bottom: 14px; z-index: 10;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.ftrtop-hero__scrollcue span {
  width: 1px; height: 18px; background: var(--terra);
  transform-origin: top; animation: scrollLine 2.4s ease-in-out infinite;
}
.ftrtop-hero__scrollcue i {
  font-style: normal; font-family: var(--f-serif); font-weight: 300; font-size: 9px;
  color: rgba(240,230,210,0.6); letter-spacing: 0.4em; text-transform: uppercase;
}

/* ---------------------------------------------------------------
   1b. ENTRY（入口演出・2026-08-23新規追加／同日3回目の調整）
   独立Entrance Hallの「入館する感覚」だけを吸収する軽いセクション。
   中央に小さな扉アイコンを置く方式はやめ、セクション左右端に縦長の扉が一部見切れる形で
   配置し、「扉の間に立って館内へ入ろうとしている」構図にした。扉は絶対配置＋
   .ftrtop-entryのoverflow:hiddenでクロップするため、セクションの高さには影響しない
   （高さは中央の文字要素だけで決まる＝ENTRY全体を長くしないための構造）。
   カード化・大きなイラスト・強いhover演出・立体感・影・写実表現はしない。
--------------------------------------------------------------- */
.ftrtop-entry {
  position: relative;
  padding: 26px 28px 30px;
  border-top: 1px solid var(--top-line-soft);
  text-align: center;
  overflow: hidden; /* 左右の扉をセクション内でクロップし、横スクロールを発生させない */
}
.ftrtop-entry__inner {
  position: relative; z-index: 2;
  max-width: 400px; margin: 0 auto;
}

/* 左右の扉（建築図面のような薄い線画）。中央には置かず、セクション端から一部見切れさせる。
   内側パネル線は::before/::afterの2本（3パネル構成）。取っ手は中央を向く側にのみ1点、terra色。
   新規画像・SVG・写真は使わない。影・立体感・写実表現もつけない。 */
.ftrtop-entry__side-door {
  position: absolute;
  top: 50%; transform: translateY(-50%);
  width: 34px; height: 148px;
  border: 1px solid var(--top-line);
  z-index: 1;
}
.ftrtop-entry__side-door::before,
.ftrtop-entry__side-door::after {
  content: '';
  position: absolute; left: 0; right: 0;
  height: 1px; background: var(--top-line);
}
.ftrtop-entry__side-door::before { top: 34%; }
.ftrtop-entry__side-door::after  { top: 67%; }
.ftrtop-entry__side-door--l { left: -16px; }
.ftrtop-entry__side-door--r { right: -16px; }

.ftrtop-entry__side-door-handle {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--terra); opacity: 0.6;
}
/* 取っ手は中央（ENTER側）を向く辺にだけ置く */
.ftrtop-entry__side-door--l .ftrtop-entry__side-door-handle { right: 5px; }
.ftrtop-entry__side-door--r .ftrtop-entry__side-door-handle { left: 5px; }

.ftrtop-entry__sub {
  font-family: var(--f-jp); font-weight: 200; font-size: 12px;
  color: var(--top-sub-dim); letter-spacing: 0.04em;
}

.ftrtop-entry__link {
  display: inline-block;
  margin-top: 10px;
  font-family: var(--f-serif); font-weight: 300; font-size: 13px;
  letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--top-ink); text-decoration: none;
  border-bottom: 1px solid var(--terra);
  /* 視覚上の見た目（下線つきテキスト）は変えず、タップ領域だけ上下に広げる */
  padding: 10px 4px 8px;
  margin-bottom: -8px;
  transition: opacity .3s;
}
.ftrtop-entry__link:hover { opacity: 0.62; }

/* ENTER直下の縦線＋点。装飾ではなく「下方向へ進む」ナビゲーション補助として扱う */
.ftrtop-entry__guide {
  margin-top: 14px;
  display: flex; flex-direction: column; align-items: center; gap: 5px;
}
.ftrtop-entry__guide-line { width: 1px; height: 20px; background: var(--top-line); }
.ftrtop-entry__guide-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--terra); opacity: 0.65; }

/* 補助のSCROLL文言。かなり小さく薄く。モバイルでは省略し、ENTRYを長くしない */
.ftrtop-entry__scroll {
  display: none;
  margin-top: 12px;
  font-family: var(--f-serif); font-weight: 300; font-size: 9px;
  letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--top-sub-dim); opacity: 0.65;
}

/* ---------------------------------------------------------------
   CTA — shared（明るいセクション上が基本。terraアクセントは維持）
--------------------------------------------------------------- */
.ftrtop-cta {
  display: inline-block; text-decoration: none;
  font-family: var(--f-serif); font-weight: 300;
  transition: color .3s, border-color .3s, background-color .3s;
}
/* Hero内（写真上）だけは明色文字のまま */
.ftrtop-hero .ftrtop-cta--primary {
  font-size: 12px; letter-spacing: 0.24em; text-transform: uppercase;
  color: #f0ebe3; border: 1px solid var(--terra);
  padding: 14px 24px;
}
.ftrtop-hero .ftrtop-cta--primary:hover { background: rgba(139,74,58,0.22); }

/* 白背景セクション上のprimary CTA */
.ftrtop-cta--primary {
  font-size: 12px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--top-ink); border: 1px solid var(--terra);
  padding: 14px 24px;
}
.ftrtop-cta--primary:hover { background: rgba(139,74,58,0.08); }

.ftrtop-cta--quiet {
  font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--terra); border-bottom: 1px solid transparent;
  padding-bottom: 3px;
}
.ftrtop-cta--quiet:hover { border-bottom-color: var(--terra); }

/* ---------------------------------------------------------------
   2. CURRENT EXHIBITION — 主役。他セクションより明確に大きく残す
--------------------------------------------------------------- */
.ftrtop-exhibit {
  position: relative;
  padding: 58px 28px 64px;
  border-top: 1px solid var(--top-line-soft);
}
.ftrtop-exhibit__inner { max-width: 760px; }
.ftrtop-exhibit__kicker {
  font-family: var(--f-serif); font-weight: 300; font-size: 11px;
  color: var(--top-sub); letter-spacing: 0.4em; text-transform: uppercase;
  margin-bottom: 6px;
}
/* 「01」が単なる連番ではなく企画展番号であることを示す小さなラベル */
.ftrtop-exhibit__label {
  font-family: var(--f-serif); font-weight: 300; font-size: 10px;
  color: var(--top-sub-dim); letter-spacing: 0.32em; text-transform: uppercase;
  margin-bottom: 18px;
}
.ftrtop-exhibit__number {
  font-family: var(--f-num); font-weight: 100; font-size: 58px;
  color: var(--terra); line-height: 1; margin-bottom: 8px;
}
.ftrtop-exhibit__number::after {
  content: ''; display: block; width: 56px; height: 1px;
  background: var(--top-line); margin-top: 8px;
}
.ftrtop-exhibit__title {
  font-family: var(--f-serif); font-weight: 300; font-size: 30px;
  color: var(--top-ink); letter-spacing: 0.03em; line-height: 1.28;
  margin: 16px 0 12px;
}
.ftrtop-exhibit__jp {
  font-family: var(--f-jp); font-weight: 200; font-size: 15px; line-height: 1.9;
  color: var(--top-body); letter-spacing: 0.05em;
  margin-bottom: 14px;
}
/* 「この先は1記事ではなく5作品の企画展」であることを伝える補助表示。タイトルより目立たせない */
.ftrtop-exhibit__works {
  font-family: var(--f-serif); font-weight: 300; font-size: 11px;
  color: var(--top-sub); letter-spacing: 0.3em; text-transform: uppercase;
  margin-bottom: 22px;
}
.ftrtop-exhibit__photo {
  width: 100%; height: 220px; overflow: hidden; margin-bottom: 22px;
}
.ftrtop-exhibit__photo img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  filter: saturate(0.9) contrast(1.02);
}

/* ---------------------------------------------------------------
   3. ROOM 02 / JOURNEY（準備中・2026-08-22新規追加）
   Room 02本体は未実装。CTAボタンは置かず「準備中」を小さく静かに表示する。
   EXHIBITION・ARCHIVEより一段静かな存在感にするため、余白を控えめにしタイトルもARCHIVEよりわずかに小さくする。
--------------------------------------------------------------- */
.ftrtop-journey {
  position: relative;
  padding: 28px 28px 34px;
  border-top: 1px solid var(--top-line-soft);
}
.ftrtop-journey__inner { max-width: 560px; }
.ftrtop-journey__title {
  font-family: var(--f-serif); font-weight: 300; font-size: 24px;
  color: var(--top-ink); letter-spacing: 0.1em; text-transform: uppercase;
  margin: 8px 0 10px;
}
.ftrtop-journey__desc {
  font-family: var(--f-jp); font-weight: 200; font-size: 13px; line-height: 1.8;
  color: rgba(43,38,34,0.5); letter-spacing: 0.04em;
  margin-bottom: 14px;
}
/* 押せそうに見えないよう、枠線・背景を持たない素のテキストステータス表示にする */
.ftrtop-journey__status {
  display: inline-block;
  font-family: var(--f-serif); font-weight: 300; font-size: 11px;
  color: var(--top-sub-dim); letter-spacing: 0.3em; text-transform: uppercase;
}

/* ---------------------------------------------------------------
   4. ROOM 03 / ARCHIVE — Exhibitionより一段静か。カードUIにしない
--------------------------------------------------------------- */
.ftrtop-letters {
  position: relative;
  padding: 34px 28px 40px;
  border-top: 1px solid var(--top-line-soft);
}
.ftrtop-letters__inner { max-width: 560px; }
.ftrtop-letters__kicker {
  font-family: var(--f-serif); font-weight: 300; font-size: 10px;
  color: var(--top-sub-dim); letter-spacing: 0.4em; text-transform: uppercase;
  margin-bottom: 10px;
}
.ftrtop-letters__title {
  font-family: var(--f-serif); font-weight: 300; font-size: 28px;
  color: var(--top-ink); letter-spacing: 0.1em; text-transform: uppercase;
  margin-bottom: 12px;
}
.ftrtop-letters__desc {
  font-family: var(--f-jp); font-weight: 200; font-size: 13.5px; line-height: 1.9;
  color: rgba(43,38,34,0.58); letter-spacing: 0.04em;
  margin-bottom: 16px;
}

/* ---------------------------------------------------------------
   4b. ROOM 04 / ELSEWHERE — ARCHIVEと同じ余白ルールを複製（新しいデザイン言語を作らない）
--------------------------------------------------------------- */
.ftrtop-elsewhere {
  position: relative;
  padding: 34px 28px 40px;
  border-top: 1px solid var(--top-line-soft);
}
.ftrtop-elsewhere__inner { max-width: 560px; }

/* ---------------------------------------------------------------
   4. NEWSLETTER — ARCHIVEとは別の「継続して届く手紙」。かなりコンパクトに
--------------------------------------------------------------- */
.ftrtop-news {
  position: relative;
  padding: 40px 28px 44px;
  border-top: 1px solid var(--top-line-soft);
}
.ftrtop-news__inner { max-width: 480px; }
.ftrtop-news__kicker {
  font-family: var(--f-serif); font-weight: 300; font-size: 10px;
  color: var(--top-sub-dim); letter-spacing: 0.4em; text-transform: uppercase;
  margin-bottom: 12px;
}
.ftrtop-news__title {
  font-family: var(--f-jp); font-weight: 300; font-size: 18px;
  color: var(--top-ink); letter-spacing: 0.08em;
  margin-bottom: 12px;
}
.ftrtop-news__desc {
  font-family: var(--f-jp); font-weight: 200; font-size: 13.5px; line-height: 1.8;
  color: rgba(43,38,34,0.56); letter-spacing: 0.04em;
  margin-bottom: 18px;
}

/* ---------------------------------------------------------------
   5. ABOUT — リンク1行程度。独立セクションとして重くしない
--------------------------------------------------------------- */
.ftrtop-about {
  position: relative;
  padding: 32px 28px 40px;
  border-top: 1px solid var(--top-line-soft);
}

/* ---------------------------------------------------------------
   6. FOOTER
--------------------------------------------------------------- */
.ftrtop-foot {
  background: var(--top-bg); border-top: 1px solid var(--top-line);
  padding: 40px 28px 48px;
  display: flex; flex-direction: column; gap: 20px; align-items: center;
  text-align: center;
}
.ftrtop-foot__brand {
  font-family: var(--f-serif); font-weight: 300; font-size: 11px;
  color: rgba(43,38,34,0.6); letter-spacing: 0.4em; text-transform: uppercase;
}
.ftrtop-foot__nav { display: flex; align-items: center; gap: 22px; }
.ftrtop-foot__nav a {
  font-family: var(--f-serif); font-weight: 300; font-size: 10px;
  color: rgba(43,38,34,0.45); letter-spacing: 0.24em; text-transform: uppercase;
  text-decoration: none; transition: color .3s;
}
.ftrtop-foot__nav a:hover { color: var(--top-ink); }
.ftrtop-foot__meta {
  display: flex; flex-direction: column; gap: 12px; align-items: center;
}
.ftrtop-foot__meta > span:first-child {
  font-family: var(--f-serif); font-weight: 300; font-size: 10px;
  color: rgba(43,38,34,0.45); letter-spacing: 0.3em; text-transform: uppercase;
}
.ftrtop-foot__loc {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--f-jp); font-weight: 200; font-size: 12px;
  color: rgba(43,38,34,0.5); letter-spacing: 0.1em;
}
.ftrtop-foot__loc i {
  width: 6px; height: 6px; border-radius: 50%; background: var(--terra);
  box-shadow: 0 0 8px var(--terra); animation: pulse 2.2s ease-in-out infinite;
  display: block; font-style: normal;
}

/* =================================================================
   DESKTOP（769px以上）
================================================================= */
@media (min-width: 769px) {
  .ftrtop-nav-m { display: none; }
  .ftrtop-drawer { display: none !important; }
  .ftrtop-nav-d { display: flex; }

  .ftrtop-hero { align-items: center; }
  .ftrtop-hero__photo { background-position: center center; }
  .ftrtop-hero__content { padding: 0 88px; max-width: 720px; }
  .ftrtop-hero__wordmark { font-size: 54px; letter-spacing: 0.16em; margin-bottom: 28px; }
  .ftrtop-hero__desc { font-size: 16px; max-width: 400px; margin-bottom: 40px; }
  .ftrtop-hero__desc-br-mobile { display: none; } /* モバイル専用の改行。PCでは無効化しレイアウト無変更を維持 */
  .ftrtop-hero__scrollcue { left: 64px; bottom: 44px; gap: 10px; }
  .ftrtop-hero__scrollcue span { height: 30px; }

  .ftrtop-cta--primary,
  .ftrtop-hero .ftrtop-cta--primary { font-size: 12px; padding: 16px 30px; }

  .ftrtop-entry { padding: 34px 88px 38px; }
  .ftrtop-entry__side-door { width: 46px; height: 220px; }
  .ftrtop-entry__side-door--l { left: -20px; }
  .ftrtop-entry__side-door--r { right: -20px; }
  .ftrtop-entry__link { font-size: 13px; }
  .ftrtop-entry__scroll { display: block; }

  .ftrtop-exhibit { padding: 92px 88px 104px; }
  .ftrtop-exhibit__inner { max-width: 820px; margin: 0 auto; }
  .ftrtop-exhibit__label { font-size: 11px; margin-bottom: 22px; }
  .ftrtop-exhibit__number { font-size: 84px; }
  .ftrtop-exhibit__number::after { margin-top: 10px; }
  .ftrtop-exhibit__title { font-size: 44px; margin: 20px 0 14px; }
  .ftrtop-exhibit__jp { font-size: 17px; margin-bottom: 18px; }
  .ftrtop-exhibit__works { font-size: 12px; margin-bottom: 30px; }
  /* PCではワーゲンの下部が見切れないよう、固定height+coverでの縦クロップをやめ、
     元のアスペクト比のまま全体表示する（横幅の存在感は維持） */
  .ftrtop-exhibit__photo { height: auto; margin-bottom: 28px; }
  .ftrtop-exhibit__photo img { height: auto; object-fit: contain; }

  .ftrtop-journey { padding: 40px 88px 46px; }
  .ftrtop-journey__inner { max-width: 620px; margin: 0 auto; }
  .ftrtop-journey__title { font-size: 32px; }
  .ftrtop-journey__desc { font-size: 14px; }
  .ftrtop-journey__status { font-size: 12px; }

  .ftrtop-letters { padding: 48px 88px 56px; }
  .ftrtop-letters__inner { max-width: 620px; margin: 0 auto; }
  .ftrtop-letters__title { font-size: 38px; }
  .ftrtop-letters__desc { font-size: 14.5px; }

  .ftrtop-elsewhere { padding: 48px 88px 56px; }
  .ftrtop-elsewhere__inner { max-width: 620px; margin: 0 auto; }

  .ftrtop-news { padding: 48px 88px 56px; }
  .ftrtop-news__inner { max-width: 620px; margin: 0 auto; }
  .ftrtop-news__title { font-size: 20px; }

  .ftrtop-about { padding: 40px 88px 48px; }
  .ftrtop-about__inner { max-width: 620px; margin: 0 auto; }

  .ftrtop-foot {
    flex-direction: row; justify-content: space-between; align-items: center;
    padding: 44px 88px 52px; text-align: left;
  }
  .ftrtop-foot__meta { flex-direction: row; gap: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  .ftrtop-hero__scrollcue span { animation: none; }
  .ftrtop-foot__loc i { animation: none; }
}