@charset "utf-8";
/* =========================================================
   森義利 公式Webサイト  style.css
   2026-09-24 整理版（収蔵先 collections の英語名を含む）
   ① 基準値  ② 全体の基本  ③ 枠  ④ 部品  ⑤ ページ固有
   色・書体・文字の大きさ・行間・余白・幅の基準値は ① に集約する。
   ② 以降に書く数値は、部品の内側の細かな余白だけ。
   ========================================================= */


/* =========================================================
   ① 基準値
   ========================================================= */
:root {
  /* 色 */
  --color-bg: #ffffff;          /* 背景：全ページ */
  --color-logo: #000000;        /* ロゴだけ */
  --color-ink: #1a1a1a;         /* 墨：本文・見出し・罫線 */
  --color-link: #165e83;        /* 藍：リンク文字だけ */
  --color-current: #d3381c;     /* 朱：今いるページの印だけ */
  --color-sub: #595959;         /* 補助文字：読み仮名・ローマ字など */
  --color-frame: #d4d4d4;       /* 作品画像の縁 */

  /* 書体 */
  --font-heading: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --font-body: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --font-latin: "EB Garamond", Garamond, "Times New Roman", serif;
  --font-column: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
  --font-ja: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;  /* 英語版で添える日本語 */
  --weight-heading: 500;

  /* 文字の大きさ（スマホ 375px → PC 1280px でなめらかに） */
  --fs-body: clamp(1rem, 0.974rem + 0.11vw, 1.0625rem);            /* 16 → 17px */
  --fs-page-title: clamp(1.75rem, 1.543rem + 0.884vw, 2.25rem);     /* 28 → 36px */
  --fs-heading-l: clamp(1.375rem, 1.271rem + 0.442vw, 1.625rem);    /* 22 → 26px */
  --fs-heading-s: clamp(1.125rem, 1.073rem + 0.221vw, 1.25rem);     /* 18 → 20px */
  --fs-small: 0.9375rem;                                             /* 補足・フッター（試作値） */
  --fs-xsmall: 0.875rem;                                             /* スマホのヘッダーのコピー（試作値） */

  /* 行間・行長 */
  --lh-body: 2;
  --lh-body-en: 1.7;
  --lh-heading: 1.5;            /* 試作値 */
  --lh-small: 1.9;              /* フッター（試作値） */
  --measure: 38em;              /* 読み物の幅：38字前後（約650px） */
  --measure-footer: 31.2em;     /* フッター概要文：標準の文字サイズで「生まれ。」の後で折り返す幅 */

  /* 余白（縦） */
  --space-paragraph: 1.5em;                               /* 段落間 約26px */
  --space-heading-l: clamp(3.5em, 2em + 4vw, 5em);        /* 大見出しの上 約56 → 85px */
  --space-heading-l-after: 1.5em;                         /* 大見出しと本文の間 */
  --space-heading-s: clamp(2.5em, 1.8em + 2vw, 3em);      /* 小見出しの上 約40 → 50px */
  --space-heading-s-after: 1em;                           /* 小見出しと本文の間（試作値） */
  --space-work: clamp(3.5em, 2.8em + 2vw, 4em);           /* 作品と作品の間 約56 → 70px */

  /* 幅 */
  --width-wide: 1080px;                                   /* 広い幅 */
  --gutter: clamp(1.25rem, 0.73rem + 2.2vw, 2.5rem);      /* 左右の最低余白 20 → 40px */

  /* TOP */
  --hero-max-height: 70vh;      /* ヒーローの高さの上限：画面のおよそ7割 */
  --hero-ratio: 1.338;          /* ヒーロー画像の縦横比（2160×1614） */
  --tile-ratio: 1 / 1;          /* 作品タイルの枠（試作値） */

  /* ロゴ（縦長。高さで指定） */
  --logo-h-top: 10rem;          /* TOP PC（試作値） */
  --logo-h-top-sp: 7rem;        /* TOP スマホ（試作値） */
  --logo-h: 4rem;               /* 下層 PC（試作値） */
  --logo-h-sp: 3rem;            /* 下層 スマホ（試作値） */

  /* 線 */
  --rule: 1px solid var(--color-ink);
  --rule-frame: 1px solid var(--color-frame);
  --current-mark: 2px;          /* 現在地の下線の太さ（試作値） */
}

/* 英語版の基準値（/en/ のページ。html lang="en" で切り替え） */
html[lang="en"] {
  --font-heading: "EB Garamond", "Shippori Mincho B1", Garamond, serif;
  --font-body: "EB Garamond", "Shippori Mincho", Garamond, serif;
  --fs-body: clamp(1.125rem, 1.099rem + 0.11vw, 1.1875rem);         /* 18 → 19px */
  --fs-page-title: clamp(1.875rem, 1.616rem + 1.105vw, 2.5rem);      /* 30 → 40px（試作値） */
  --fs-heading-l: clamp(1.5rem, 1.396rem + 0.442vw, 1.75rem);        /* 24 → 28px（試作値） */
  --fs-heading-s: clamp(1.25rem, 1.198rem + 0.221vw, 1.375rem);      /* 20 → 22px（試作値） */
  --lh-body: var(--lh-body-en);                                      /* 1.7 */
  --measure: 33em;                                                   /* 約70字 */
}


/* =========================================================
   ② 全体の基本
   ========================================================= */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

h1, h2, h3, p, ul, ol, dl, dd, figure {
  margin: 0;
}

ul, ol {
  padding: 0;
  list-style: none;
}

h1, h2, h3 {
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  line-height: var(--lh-heading);
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* リンク */
a {
  color: var(--color-link);
  text-underline-offset: 0.25em;
}

a:hover {
  text-decoration-thickness: 2px;
}

:focus-visible {
  outline: 2px solid var(--color-link);
  outline-offset: 2px;
}

/* 言語の混在 */
:lang(en) {
  font-family: var(--font-latin);
}

/* 英語ページの中の日本語（原語の併記など） */
html[lang="en"] [lang="ja"] {
  font-family: var(--font-ja);
}

/* 本文中の併記だけ、小さめ・灰色にして添え物に見せる
   （ページ題に添えた日本語と、ヘッダーの言語切替は対象外） */
html[lang="en"] .page [lang="ja"]:not(.page-title__ja) {
  font-size: 0.9em;
  color: var(--color-sub);
}

/* 幅の器 */
.l-wide {
  max-width: calc(var(--width-wide) + var(--gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.l-reading {
  max-width: calc(var(--measure) + var(--gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--gutter);
}


/* =========================================================
   ③ 枠（ヘッダー・グローバルナビ・言語切替・グループ内タブ・フッター）
   ========================================================= */

/* ヘッダー */
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
  padding-block: 1.25em;
}

.site-header__brand {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  align-items: center;
  gap: 1.25em;
  color: var(--color-ink);
  text-decoration: none;
}

.site-logo {
  display: block;
  flex: none;
  width: auto;
  height: var(--logo-h);
}

.site-header__tagline {
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--fs-heading-s);
  line-height: var(--lh-heading);
}

.site-header__tagline span {
  display: inline-block;
}

.site-header__tools {
  display: flex;
  flex: none;
  align-items: center;
  gap: 1.25em;
}

/* TOPのヘッダー：ロゴ大＋サイト名＋英名＋招待のコピー */
.site-header--top .site-header__inner {
  align-items: flex-start;
  padding-block: 2em 1.75em;
}

.site-header--top .site-header__brand {
  gap: 1.75em;
}

.site-header--top .site-logo {
  height: var(--logo-h-top);
}

.site-header--top .site-header__tagline {
  margin-top: 0.5em;
}

.site-header__titles {
  display: grid;
  gap: 0.25em;
}

.site-header__name {
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--fs-heading-l);
  line-height: var(--lh-heading);
}

.site-header__name-en,
.site-header__name-ja {
  color: var(--color-sub);
  font-family: var(--font-latin);
  font-size: var(--fs-small);
  line-height: var(--lh-heading);
}

/* 英語版で添える日本語名 */
.site-header__name-ja {
  font-family: var(--font-ja);
}

/* 言語切替 */
.lang-switch {
  display: flex;
  white-space: nowrap;
  font-size: var(--fs-small);
}

.lang-switch li + li::before {
  content: "｜";
  color: var(--color-sub);
}

.lang-switch a {
  color: var(--color-ink);
  text-decoration: none;
}

.lang-switch a:hover {
  text-decoration: underline;
}

/* メニューボタン（スマホ・JSが動くときだけ出す） */
.menu-button {
  display: none;
  padding: 0.25em 0.75em;
  border: var(--rule);
  background: none;
  color: var(--color-ink);
  font: inherit;
  font-size: var(--fs-small);
  white-space: nowrap;
  cursor: pointer;
}

/* グローバルナビ */
.global-nav {
  border-bottom: var(--rule);
}

.global-nav__list {
  display: flex;
  flex-wrap: wrap;
  column-gap: 2.5em;
}

.global-nav__item a {
  display: block;
  padding-block: 0.625em;
  color: var(--color-ink);
  text-decoration: none;
}

.global-nav__item a:hover {
  text-decoration: underline;
}

.global-nav__item.is-current a {
  box-shadow: inset 0 calc(var(--current-mark) * -1) 0 var(--color-current);
}

/* グループ内タブ */
.group-tabs {
  margin-top: 2em;
}

.group-tabs__list {
  display: flex;
  flex-wrap: wrap;
  column-gap: 2em;
  font-size: var(--fs-small);
}

.group-tabs__item a {
  display: block;
  padding-block: 0.25em;
  color: var(--color-ink);
  text-decoration: none;
}

.group-tabs__item a:hover {
  text-decoration: underline;
}

.group-tabs__item.is-current a {
  box-shadow: inset 0 calc(var(--current-mark) * -1) 0 var(--color-current);
}

/* フッター */
.site-footer {
  margin-top: var(--space-heading-l);
  padding-block: 3em 2em;
  border-top: var(--rule);
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

.site-footer__inner {
  display: grid;
  gap: 2.5em;
}

.site-footer__name {
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--fs-heading-s);
}

.site-footer__summary {
  margin-top: 0.5em;
  max-width: var(--measure-footer);
}

.site-footer__credits {
  margin-top: 1em;
}

.site-footer__credits div {
  display: flex;
  flex-wrap: wrap;
  column-gap: 1em;
}

.site-footer__credits dt {
  color: var(--color-sub);
}

.footer-nav__groups {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(9em, 1fr));
  gap: 1.5em 2em;
}

.footer-nav__group {
  display: block;
  color: var(--color-sub);
}

.site-footer__sub {
  display: flex;
  flex-wrap: wrap;
  column-gap: 2em;
}

.site-footer__copyright {
  color: var(--color-sub);
}

/* スマホ：ヘッダーを詰め、グローバルナビを畳む（畳むのはJSが動くときだけ） */
@media (max-width: 47.99em) {
  .site-header__brand {
    gap: 0.75em;
  }

  .site-header__tagline {
    font-size: var(--fs-xsmall);
  }

  .site-logo {
    height: var(--logo-h-sp);
  }

  .site-header__tools {
    gap: 0.75em;
  }

  .site-header--top .site-header__inner {
    flex-wrap: wrap;
  }

  .site-header--top .site-header__brand {
    order: 2;
    flex-basis: 100%;
    gap: 1.25em;
  }

  .site-header--top .site-header__tools {
    order: 1;
    margin-left: auto;
  }

  .site-header--top .site-logo {
    height: var(--logo-h-top-sp);
  }

  .site-header--top .site-header__tagline {
    font-size: var(--fs-small);
  }

  .has-js .menu-button {
    display: block;
  }

  .has-js .global-nav:not(.is-open) .global-nav__list {
    display: none;
  }

  .global-nav.is-open .global-nav__list {
    flex-direction: column;
    padding-bottom: 0.75em;
  }
}


/* =========================================================
   ④ 部品
   並び順に意味があるので、入れ替えるときは注意：
   ④-1 の部品は ④-2 の見出しより前に置く（見出しの直後では、見出し側の余白が勝つ）。
   ④-3 以降の部品は見出しより後に置く（見出しの直後でも、部品側の余白が勝つ）。
   ========================================================= */

/* ---------- ④-1 ページ題と本文の基本 ---------- */

/* ページ題 */
.page-title {
  margin-top: 1.5em;
  font-size: var(--fs-page-title);
}

.page-title__en,
.page-title__ja {
  display: block;
  color: var(--color-sub);
  font-family: var(--font-latin);
  font-weight: 400;
  font-size: var(--fs-heading-s);
  line-height: var(--lh-heading);
}

.page-title__ja {
  font-family: var(--font-ja);
}

/* 基本情報（項目名と内容の2列） */
.facts {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 1.5em;
  margin-top: var(--space-heading-s);
}

.facts__term {
  color: var(--color-sub);
}

/* 本文 */
.prose {
  margin-top: var(--space-heading-s);
}

.prose p + p {
  margin-top: var(--space-paragraph);
}

/* 注意書き */
.note {
  margin-top: var(--space-heading-s);
}

/* 画像の器 */
.figure {
  margin-top: var(--space-heading-s);
}

.image-frame {
  border: var(--rule-frame);
}

.image-frame--portrait {
  width: min(100%, 20em);
}


/* ---------- ④-2 見出し ---------- */

/* 大見出し：上に墨の細罫 */
.heading-l {
  margin-top: var(--space-heading-l);
  padding-top: 0.75em;
  border-top: var(--rule);
  font-size: var(--fs-heading-l);
}

.heading-l + * {
  margin-top: var(--space-heading-l-after);
}

/* 小見出し */
.heading-s {
  margin-top: var(--space-heading-s);
  font-size: var(--fs-heading-s);
}

.heading-s + * {
  margin-top: var(--space-heading-s-after);
}


/* ---------- ④-3 共通の部品 ---------- */

/* 本文の中の箇条書き（privacy の開示の条件、send.php の入力不備など）
   ② で箇条書きの点を消しているので、本文の中だけ点を戻す */
.prose ul {
  margin-top: var(--space-paragraph);
  padding-left: 1.5em;
  list-style: disc;
}

.prose ul + p {
  margin-top: var(--space-paragraph);
}

/* 基本情報の形の応用：用語と長い説明の並び */
.facts--terms {
  row-gap: 1em;
}

/* 基本情報の形の応用：確認画面の入力内容 */
.facts--entry {
  row-gap: 0.75em;
}

.facts--entry dd {
  min-width: 0;
  overflow-wrap: anywhere;
}

.facts__desc--pre {
  white-space: pre-wrap;
}

@media (max-width: 47.99em) {
  .facts--entry {
    grid-template-columns: 1fr;
  }

  .facts--entry dd + dt {
    margin-top: 0.75em;
  }
}

/* 注意書きの囲み（機械翻訳のページの冒頭など） */
.notice-box {
  margin-top: var(--space-heading-s);
  padding: 1em 1.25em;
  border: var(--rule);
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

.notice-box__title {
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
}

.notice-box p + p {
  margin-top: 0.5em;
}

/* 改めた箇所の表（注意書きの囲みの中） */
.change-table {
  width: 100%;
  margin-top: 0.75em;
  border-collapse: collapse;
}

.change-table th,
.change-table td {
  padding: 0.375em 1em 0.375em 0;
  border-top: var(--rule-frame);
  text-align: left;
  vertical-align: top;
}

.change-table th {
  color: var(--color-sub);
  font-weight: 400;
}

/* 文責 */
.byline {
  margin-top: var(--space-heading-s);
  color: var(--color-sub);
  font-size: var(--fs-small);
}

/* 署名（ロゴ＋名前。右に寄せる） */
.signature {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 0.75em 1em;
  margin-top: var(--space-heading-s);
}

.signature__logo {
  width: auto;
  height: 2.75em; /* 名前の文字と釣り合う高さ（試作値） */
}

.signature__name {
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--fs-heading-s);
  line-height: var(--lh-heading);
}

/* 「さらに見る」リンク */
.more-link {
  margin-top: var(--space-paragraph);
}

/* 関連ページへのリンク */
.related-links {
  margin-top: var(--space-heading-s);
}

.related-links__label {
  color: var(--color-sub);
  font-size: var(--fs-small);
}

.related-links__list {
  display: flex;
  flex-wrap: wrap;
  column-gap: 2em;
}

/* よくある質問（クリックで開く） */
.faq {
  border-bottom: var(--rule-frame);
}

.faq__item {
  border-top: var(--rule-frame);
}

.faq__question {
  display: flex;
  justify-content: space-between;
  gap: 1em;
  padding-block: 0.75em;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  line-height: var(--lh-heading);
  list-style: none;
  cursor: pointer;
}

.faq__question::-webkit-details-marker {
  display: none;
}

.faq__question::after {
  content: "+";
  flex: none;
  color: var(--color-sub);
  font-family: var(--font-latin);
}

.faq__item[open] .faq__question::after {
  content: "−";
}

.faq__answer {
  padding-bottom: 1em;
}

/* フォーム */
.form__field + .form__field {
  margin-top: 1.5em;
}

.form__label {
  display: block;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  line-height: var(--lh-heading);
}

.form__required {
  margin-left: 0.75em;
  color: var(--color-sub);
  font-family: var(--font-body);
  font-weight: 400;
  font-size: var(--fs-small);
}

.form__hint {
  margin-top: 0.25em;
  color: var(--color-sub);
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

.form__input,
.form__select,
.form__textarea {
  display: block;
  width: 100%;
  margin-top: 0.5em;
  padding: 0.5em 0.75em;
  border: var(--rule);
  border-radius: 0;
  background: var(--color-bg);
  color: var(--color-ink);
  font: inherit;
  line-height: var(--lh-heading);
}

.form__input--short {
  max-width: 12em;
}

.form__textarea {
  min-height: 14em;
  resize: vertical;
}

.form__check {
  display: flex;
  align-items: baseline;
  gap: 0.5em;
  cursor: pointer;
}

.form__check input {
  flex: none;
}

/* おとり欄：人には見せない */
.form__trap {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
  margin-top: 2em;
}

/* ボタン */
.button {
  display: inline-block;
  padding: 0.625em 1.75em;
  border: var(--rule);
  background: var(--color-ink);
  color: var(--color-bg);
  font: inherit;
  line-height: var(--lh-heading);
  text-decoration: none;
  cursor: pointer;
}

.button:hover {
  text-decoration: underline;
}

.button--secondary {
  background: var(--color-bg);
  color: var(--color-ink);
}

/* 作品画像の拡大表示（ライトボックス）
   画面いっぱいの白地に作品全体を収める。影・額装風はしない */
.lightbox {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: calc(var(--gutter) + 2.5em) var(--gutter) var(--gutter);
  border: 0;
  background: var(--color-bg);
  color: var(--color-ink);
  cursor: zoom-out;
}

.lightbox[open] {
  display: flex;
  align-items: center;
  justify-content: center;
}

.lightbox::backdrop {
  background: var(--color-bg);
}

.lightbox__figure {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 100%;
  max-height: 100%;
}

.lightbox__image {
  width: auto;
  max-width: 100%;
  max-height: calc(100vh - var(--gutter) * 2 - 6em);
  border: var(--rule-frame);
}

.lightbox__caption {
  margin-top: 0.75em;
  color: var(--color-sub);
  font-size: var(--fs-small);
  text-align: center;
}

.lightbox__close {
  position: absolute;
  top: var(--gutter);
  right: var(--gutter);
  padding: 0.25em 0.75em;
  border: var(--rule);
  background: var(--color-bg);
  color: var(--color-ink);
  font: inherit;
  font-size: var(--fs-small);
  cursor: pointer;
}


/* クッキー同意の帯（js/consent.js が作る。ヨーロッパの時刻設定の人にだけ出る）
   白地に墨の罫線（フッターと同じ）。色は使わない。2つのボタンは同じ見た目 */
.consent {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75em 2em;
  padding: 1em var(--gutter) calc(1em + env(safe-area-inset-bottom, 0px));
  border-top: var(--rule);
  background: var(--color-bg);
  color: var(--color-ink);
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

.consent__text {
  max-width: var(--measure);
  margin: 0;
}

.consent__actions {
  display: flex;
  flex-shrink: 0;
  gap: 1em;
}

/* privacy.html の「クッキーの設定を変更する」（JS が動くときだけ表示） */
.consent-settings[hidden] {
  display: none;
}

/* ---------- ④-4 特定のページで使う部品 ---------- */

/* TOP：ヒーロー */
.hero {
  margin-top: var(--space-heading-s);
}

.hero__image {
  width: min(100%, calc(var(--hero-max-height) * var(--hero-ratio)));
  margin-inline: auto;
  border: var(--rule-frame);
}

.hero__caption {
  margin-top: 0.75em;
  color: var(--color-sub);
  font-size: var(--fs-small);
  text-align: center;
}

.hero__lead {
  margin-top: 0.5em;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--fs-heading-s);
  line-height: var(--lh-heading);
  text-align: center;
}

/* TOP：作品タイル */
.work-tiles {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2em 1.25em;
}

.work-tile a {
  display: block;
  color: var(--color-ink);
  text-decoration: none;
}

.work-tile a:hover .work-tile__title {
  text-decoration: underline;
}

.work-tile__image {
  width: 100%;
  aspect-ratio: var(--tile-ratio);
  object-fit: contain;      /* 作品を切らず、枠の中に全体を収める */
  background: var(--color-bg);
}

.work-tile__caption {
  margin-top: 0.5em;
  font-size: var(--fs-small);
  line-height: var(--lh-heading);
}

.work-tile__year {
  margin-left: 0.75em;
  color: var(--color-sub);
}

@media (min-width: 48em) {
  .work-tiles {
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5em 2em;
  }
}

/* 技法（technique）：写真工程 */
.process-steps {
  display: grid;
  gap: 2em;
  margin-top: var(--space-paragraph);
}

.process-step {
  min-width: 0;             /* 画像の本来の幅で列が広がらないように */
}

.process-step img {
  width: 100%;
}

.process-step--text {
  grid-column: 1 / -1;
}

.process-step__caption {
  margin-top: 0.5em;
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

.process-step__num {
  display: block;
  color: var(--color-sub);
}

@media (min-width: 48em) {
  .process-steps {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* 用語集（glossary） */
.glossary__item + .glossary__item {
  margin-top: 1.75em;
}

.glossary__term {
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--fs-heading-s);
  line-height: var(--lh-heading);
}

/* 読み｜ローマ字：補助文字の灰・小さめ */
.glossary__reading {
  margin-top: 0.25em;
  color: var(--color-sub);
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

.glossary__romaji {
  font-family: var(--font-latin);
}

/* 英語：翻訳家の英文にある訳語だけ */
.glossary__en {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

.glossary__desc {
  margin-top: 0.25em;
}

/* 年表（chronology） */
.chronology {
  display: grid;
  grid-template-columns: 5em 1fr;
  column-gap: 1.5em;
  row-gap: 0.5em;
}

.chronology__year {
  color: var(--color-sub);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* 収蔵先（collections） */
.collections__item + .collections__item {
  margin-top: 1.25em;
}

.collections__name {
  line-height: var(--lh-heading);
}

/* 日本語版で館名に添える英語名 */
.collections__en {
  color: var(--color-sub);
  font-size: var(--fs-small);
}

/* 海外の館の国と都市：補助文字の灰・小さめ */
.collections__place {
  color: var(--color-sub);
  font-size: var(--fs-small);
}

/* 根拠の行：館名の下に灰色の小さい1行 */
.collections__source {
  margin-top: 0.25em;
  color: var(--color-sub);
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

/* 代表作品（works）
   広い幅のページ。導入文だけ読み物の幅にそろえる */
.works-page__intro {
  max-width: var(--measure);
}

.works {
  margin-top: var(--space-heading-l);
}

/* 作品1点ブロック：スマホは画像 → 文、PCは左に画像・右に文 */
.work {
  display: grid;
  gap: 1.25em;
}

.work + .work {
  margin-top: var(--space-work);
}

.work__zoom {
  display: inline-block;
  max-width: 100%;
  vertical-align: top;
  cursor: zoom-in;
}

/* 作品は切らない。縦長の作品も画面の高さの8割までに収める */
.work__image {
  width: auto;
  max-width: 100%;
  max-height: 80vh;
}

.work__title {
  font-size: var(--fs-heading-s);
}

/* 読み仮名：補助文字の灰・小さめ */
.work__reading {
  margin-top: 0.25em;
  color: var(--color-sub);
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

.work__title-en {
  line-height: var(--lh-heading);
}

.work__data,
.work__history,
.work__desc {
  margin-top: 0.75em;
}

.work__desc p + p {
  margin-top: var(--space-paragraph);
}

@media (min-width: 48em) {
  .work {
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    column-gap: 3em;
    align-items: start;
  }
}

/* 文献（bibliography） */
.biblio-legend {
  margin-top: var(--space-paragraph);
  color: var(--color-sub);
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

.biblio-list {
  margin-top: var(--space-paragraph);
}

.heading-l + .biblio-legend + .biblio-list,
.biblio-legend + .biblio-list {
  margin-top: 1em;
}

.biblio-list > li {
  padding-left: 1em;
  text-indent: -1em; /* 2行目以降を1字下げて、項目の区切りを見やすく */
  line-height: var(--lh-small);
}

.biblio-list > li + li {
  margin-top: 0.75em;
}

/* 〔 〕で示す補足・追加：補助文字の灰（地色は敷かない） */
.biblio-added {
  color: var(--color-sub);
}

/* 英語版の書名 */
.biblio-list cite {
  font-style: italic;
}


/* =========================================================
   ⑤ ページ固有の微調整（必要な場合だけ）
   ========================================================= */