/* /faq よくある質問（templates/main/faq.mjs）。実測: docs/design-main.md §2-9 §2-10 §3-9 ＋ capture/compare/faq（pc1280 / open841 / fold344）
   現行の実測: H1 → ピル 104（SP 83）／ピル → H2 128（841: 97 / SP 72）／H2 24px（SP）・32px（841〜）／
   カード: 余白 20・Q 丸 48（SP 36）・Q → 文 32（SP 12）・文 16px（SP 14）・閉時 80（SP 60）・間隔 16／区画間 100（841: 76 / SP 60）
   ブレークポイント: 〜599 / 600〜767 / 768〜1079（展開した折りたたみ＝独立した帯）/ 1080〜
   規約: 100vh 禁止・center+overflow-x 併用禁止・body overflow-x:hidden 禁止・タップ標的 44px・ch 単位禁止・色はトークンのみ */

/* ---------- 見出し＋目次ピル ---------- */
/* 〜599: 1 列（344/393 の実物どおり。2 列にすると「補綴 (被せ物・入れ歯・人工歯)に関する質問」が 3 行以上に折れる） */
.page-faq .faq-anchors { margin-top: 72px; }
.page-faq .faq-anchors ul { grid-template-columns: minmax(0, 1fr); gap: 10px; }
.page-faq .faq-anchors .anchor-pill { min-height: 56px; padding: 10px 16px 10px 16px; font-size: 14px; line-height: 1.5; }
.anchor-pill-label { flex: 1 1 auto; min-width: 0; }
.page-faq .faq-pill-sub { font-size: 0.82em; letter-spacing: 0; }
.page-faq .faq-anchors .anchor-pill .icon { width: 16px; height: 16px; flex: none; }

/* 600〜767: 2 列（横広スマホ・展開の狭い側） */
@media (min-width: 600px) {
  .page-faq .faq-anchors ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .page-faq .faq-anchors .anchor-pill { font-size: 15px; padding-left: 24px; }
}
/* 768〜1079: 2 列のまま（841 の実物どおり。auto-fill だと 3 列に化けて長い項目が 3 行になる） */
@media (min-width: 768px) and (max-width: 1079px) {
  .page-faq .faq-anchors { margin-top: 96px; }
  .page-faq .faq-anchors ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .page-faq .faq-anchors .anchor-pill { font-size: 15px; padding-left: 24px; padding-right: 20px; }
}
/* 1080〜: 3 列（各 ≒365×56、間隔 16）。左余白 24・括弧部分 12px で「補綴 (被せ物・入れ歯・人工歯)に関する質問」を 1 行に収める（実物どおり） */
@media (min-width: 1080px) {
  .page-faq .faq-anchors { margin-top: 96px; }
  .page-faq .faq-anchors ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .page-faq .faq-anchors li { min-width: 0; }
  .page-faq .faq-anchors .anchor-pill { font-size: 16px; padding-left: 24px; padding-right: 20px; }
  .page-faq .faq-pill-sub { font-size: 0.75em; }
}

/* ---------- 本文（11 セクション。幅 944 = .container-text） ---------- */
.page-faq .faq-body { padding-block: 40px var(--section-y); }
.page-faq .faq-sec { scroll-margin-top: 24px; }
.page-faq .faq-sec + .faq-sec { margin-top: 60px; }
@media (min-width: 768px) { .page-faq .faq-body { padding-top: 56px; } .page-faq .faq-sec + .faq-sec { margin-top: 76px; } }
/* 1080〜: 参照は最後のカード下端から口の上端まで 40（フッター側の margin-top 64 があるので下余白 0） */
@media (min-width: 1080px) { .page-faq .faq-body { padding-top: 64px; padding-bottom: 0; } .page-faq .faq-sec + .faq-sec { margin-top: 100px; } }
/* 1280〜: 目次ピルの容器は原本の min(100% − 160, 1136)（1280: 80〜1200 ／ 1440: 152〜1288 ／ 1920: 392〜1528）。本文の 944 は変えない */
@media (min-width: 1280px) { .page-faq .container { width: min(100% - 160px, 1136px); } }

/* 左罫線 H2（32 / 24）。〜599 は 24px にして「むし歯治療に関する質問」を 1 行に収める（344 の実物どおり。トークンの 27px だと 2 行に折れる） */
.page-faq .faq-sec-title { font-size: 24px; margin-bottom: 24px; }
@media (min-width: 768px) { .page-faq .faq-sec-title { font-size: 32px; } }
@media (min-width: 1080px) { .page-faq .faq-sec-title { margin-bottom: 28px; } }

/* Q&A アコーディオン 1 列（白カード 角丸 16、閉時 80／SP 60、間隔 16）。基本は components.css の .acc-*。ここは FAQ 固有の値だけ */
.page-faq .faq-list { gap: 16px; }
.page-faq .faq-list .acc-btn { align-items: center; min-height: 60px; padding: 20px; gap: 12px; font-size: 14px; line-height: 1.5; }
.page-faq .faq-list .acc-btn > .icon { align-self: center; width: 16px; height: 16px; }
.page-faq .faq-list .acc-q { width: 36px; height: 36px; font-size: 15px; }
.page-faq .faq-list .acc-panel { padding: 0 20px 24px; }
.page-faq .faq-list .acc-a { gap: 12px; }
.page-faq .faq-list .acc-a-body { padding-top: 4px; }
.page-faq .faq-list .acc-a-body p { margin: 0; }
/* 768〜: PC の値（閉時 80・余白 20・Q 丸 48・Q → 文 32）。841 の実物どおり */
@media (min-width: 768px) {
  .page-faq .faq-list .acc-btn { min-height: 80px; padding: 16px 20px; font-size: 16px; gap: 32px; line-height: 1.6; }
  .page-faq .faq-list .acc-btn > .icon { width: 24px; height: 24px; }
  .page-faq .faq-list .acc-q { width: 48px; height: 48px; font-size: 16px; }
  .page-faq .faq-list .acc-panel { padding: 0 20px 32px; }
  /* 開いた A 行: 質問と同じ左位置に A 丸を揃える（Q 丸 48 ＋ gap 32 ＝ 文字の開始位置） */
  .page-faq .faq-list .acc-a { gap: 32px; }
  .page-faq .faq-list .acc-a-body { padding-top: 8px; }
}

/* ---------- 〜599: 参照 440/393/344 の実測に合わせる（capture/sp-compare/main__faq 2026-09-24） ----------
   見出し: 「FAQ」の字頭 y125（15px/0.23em・中央の字間補正なし）、H1 28px（参照 字高 27・169 幅。--fs-h1 は 440 で 38 になる）、英字の字頭 → H1 の字頭 28。
   目次ピル: H1 の字の下端 → ピル 91、幅は最大 350 で中央（440: 45〜395 ／ 393: 22〜372 ／ 344: 全幅 20〜324）、高さ 50・間隔 16、
   文字 14px は左 4.5%（440/393: 17 ／ 344: 14）、山形 22px（参照 11×7）。最後のピル → H2 の罫 67。
   H2: 左罫線 4×32 を 1 行目（行送り 41）の中央、文字は罫の 16 右、罫 → カード 29。区画間はカード下端 → 罫 56（2026-09-26 静止状態で再測。旧「1 → 2 だけ 137」は出現アニメ前の写り）。
   Q カード: 高さ 64（2 行 80）＝上下 16、Q 丸 32・線 1px、丸 → 文字 8、文字 14px・行送り 24・成り行き改行（balance にしない。参照は 1 行目を詰める）、＋ 19px（右 17）。
   最後のカード下端 → 口の上端 67（2026-09-26 静止状態で再測。旧「口に 18.5 重なる」は出現アニメ前の写り） */
@media (max-width: 599px) {
  .page-faq .faq-head { padding-top: 38px; }
  /* 2 周目: 英字は 16px（参照 344「PRICE」字頭 141〜192・「FAQ」字高 14 ＝ 15px の 1.06 倍）。行の箱は 25.5 に据え置き */
  .page-faq .faq-head .sec-head.center .sec-label { font-size: 16px; line-height: 25.5px; letter-spacing: 0.23em; text-indent: 0; }   /* 共通の body.area-main .sec-head.center .sec-label（0,4,1）より強く */
  .page-faq .faq-head .sec-head > .sec-label + * { margin-top: -10px; }   /* 2 周目: H1 の字頭が参照より 1 上（153 / 152） */
  .page-faq .faq-head h1.sec-title { font-size: 28px; }
  .page-faq .faq-anchors { margin-top: 81px; }   /* 2 周目: 1 つ目のピルの下端が参照より 2 上（440/344: 319 / 317）。H1 の 1 と合わせて 2 下げる */
  .page-faq .faq-anchors ul { max-width: 350px; margin-inline: auto; gap: 16px; }
  /* 2 周目: 行送り 24・上下 13（1 行 50 は同じ）。参照 344 の「補綴 (被せ物・入れ歯・人工歯)に関する質問」は 2 行で高さ 74（行の送り 90）。新は 21 の行送りで 50 に収まり 24 短かった */
  /* 2026-09-28: 行の箱は現行の計算値 23.8（1.7）・1 行 49.8。「補綴」の括弧の小さい字が行の箱を 1 押し広げて 51 になっていたので、小さい字の行の高さを 1 に（ピルの送りが現行 65.8 に対し 67 だった） */
  .page-faq .faq-anchors .anchor-pill { min-height: 49.8px; padding: 13px 3.4% 13px 4.5%; font-size: 14px; line-height: 1.7; }
  .page-faq .faq-anchors .faq-pill-sub { line-height: 1; }
  .page-faq .faq-anchors .anchor-pill .icon { width: 20px; height: 20px; margin-inline: 1px; }   /* 山形は現行 SP の 13×7.4 枠（インク約 11.8×6.8・太さ 1.86）に合わせて 20 枠＋線 2.2。左右 1 で旧 22 枠の場所（字の幅・中心）は変えない */

  .page-faq .faq-body { position: relative; z-index: 2; padding-top: 30px; padding-bottom: 90px; }   /* 2026-09-26 現行を最後までスクロールして出現アニメを終えた状態（静止状態）で実測: 最後のカード下端 → 口の上端 67（＝ 90 − フッターの margin-top 26 ＋ 口の線 3）。旧 8 はカードが口に 18 被さっていた */
  .page-faq .faq-sec + .faq-sec { margin-top: 48px; }
  /* 旧: 1 → 2 だけ 128（出現アニメ前の撮影の写り。2026-09-26 現行を最後までスクロールして出現アニメを終えた状態（静止状態）で実測: どの区画の間も 48） */
  .page-faq .faq-sec-title { position: relative; border-left: 0; padding-left: 20px; line-height: 41px; margin-bottom: 24px; text-wrap: wrap; }
  .page-faq .faq-sec-title::before { content: ""; position: absolute; left: 0; top: 4.5px; width: 4px; height: 32px; background: var(--c-orange); }

  /* 2 周目: 質問は字間 0（参照 393「インプラントのメリットデメリットを」17 字の字頭 82〜306 = 送り 14.0。新は body の 0.02em で 82〜310）。
     文字 → ＋ は 16（丸 → 文字の 8 とは別。参照は 17 字 238 が 1 行に入り、17 字＋  は折れる = 文字の箱 238〜241） */
  .page-faq .faq-list .acc-btn { min-height: 64px; padding: 16px 17px 16px 20px; gap: 8px; font-size: 14px; line-height: 1.7; letter-spacing: 0; text-wrap: wrap; }
  .page-faq .faq-list .acc-title { margin-right: 8px; }
  .page-faq .faq-list .acc-btn > .icon { width: 19px; height: 19px; }
  .page-faq .faq-list .acc-q { width: 32px; height: 32px; border-width: 1px; font-size: 15px; }
  .page-faq .faq-list .acc-a { gap: 8px; }
}

/* ---------- 1080〜: Figma pc/faq 482:916（1366 幅）に合わせる（2026-09-25） ----------
   見出し（catch 505:10930）: ヘッダー 89 の下、英字の上端 y200（Roboto 18px・字間 25%・行 31）→ 間 0 → H1 40px/68（y231〜299）。
   目次ピル（anchor link _btn 482:3173）: y402（H1 の下端 → 103）、368×56・横 16・縦 16 の 3 列、白・角丸 100、左 32 右 18、文字 17px 字間 2% #E36200、
     右に丸 32（白）＋山形 12.7×7.4。最後のピル下端 674 → 最初の見出し 795 = 121。
   見出し（Title 507:11358）: 左の帯 4×54 → 16 → 32px/1.7（54）字間 6% #271200。見出し → カード 32、カード 82・間 16、区画の間 96（1159 → 1255）。
   最後のカード → フッター: Figma は 685 空いているが（6053 → 6738）、他ページ（404・プライバシー）の最後の要素 → フッターは 124 なので 124 にそろえる */
@media (min-width: 1080px) {
  .page-faq .faq-head { padding-top: calc(200px - var(--hd-h, 89px)); padding-bottom: 0; }
  .page-faq .faq-head .sec-head.center .sec-label { font-size: 18px; line-height: 31px; letter-spacing: 0.25em; }
  .page-faq .faq-head .sec-head > .sec-label + * { margin-top: 0; }
  .page-faq .faq-head h1.sec-title { font-size: 40px; line-height: 68px; letter-spacing: 0.06em; }
  .page-faq .faq-anchors { margin-top: 103px; }
  .page-faq .faq-anchors ul { gap: 16px; }
  .page-faq .faq-anchors .anchor-pill { min-height: 56px; padding: 12px 18px 12px 32px; gap: 10px; font-size: 17px; letter-spacing: 0.02em; line-height: 1.7; }
  .page-faq .faq-anchors .anchor-pill .icon { width: 26px; height: 26px; margin-inline: 3px; }   /* 24 枠の山形 12 幅 → 26 で 13 幅（Figma 12.7）。左右 3 で丸 32 の箱ぶん */
  /* 「補綴 (被せ物・入れ歯・人工歯)に関する質問」だけ 17px・左 32 のままだと 7px 溢れて 2 行（高さ 82）になる → この 1 枚だけ字間 0・山形との間 4・括弧 0.7em で 1 行に収める
     （Figma のピルは 11 枚とも仮の「むし歯治療に関する質問」なので長い項目の指定は無い） */
  .page-faq .faq-pill-sub { font-size: 0.7em; }
  .page-faq .faq-anchors .anchor-pill:has(.faq-pill-sub) { gap: 4px; }
  .page-faq .faq-anchors .anchor-pill-label:has(.faq-pill-sub) { letter-spacing: 0; }
  .page-faq .faq-body { padding-top: 121px; padding-bottom: 60px; }   /* 下: フッターの margin-top 64 と足して 124 */
  .page-faq .faq-sec + .faq-sec { margin-top: 96px; }
  .page-faq .faq-sec-title { padding-left: 16px; font-size: 32px; line-height: 54px; letter-spacing: 0.06em; margin-bottom: 32px; }
}
/* 1080〜1279: ピル 1 枚が 323 幅まで縮む → 17px・左 32 のままだと長い項目が 2 行に折れるので、字と左余白だけ詰める（構造は 1366 と同じ） */
@media (min-width: 1080px) and (max-width: 1279px) {
  .page-faq .faq-anchors .anchor-pill { padding-left: 20px; padding-right: 12px; font-size: 15px; letter-spacing: 0; }
  .page-faq .faq-pill-sub { font-size: 0.66em; }
}
/* 1280〜1365: 容器 1120〜1135 でピルが 363〜367 幅（Figma 368 より少し狭い）→ 長い 1 枚だけ括弧をもう一段小さくして 1 行に収める */
@media (min-width: 1280px) and (max-width: 1365px) {
  .page-faq .faq-pill-sub { font-size: 0.6em; }
}

/* ============ 演出（docs/MOTION.md。属性は templates/main/faq.mjs）============
   html.mo の下だけ（JS なし・reduce・Playwright〔?motion=1 なし〕では最初から全部見える・開閉も一瞬）。動かすのは opacity / translate / scale だけ。
   ① 質問カード（components の accordion が stagger で up）が出た 0.15 秒後に Q の丸が小さく弾む（--mo-d はカードの遅れ。motion.js が li に入れ、子に継承される）。
   ② 開いたとき: A の丸が弾み、答えの本文が少し下からふわっと出る（hidden が外れて display が戻るたびに animation が頭から再生される）。高さの開閉は site.js */
@keyframes ml-q-pop { from { opacity: 0; scale: .5; } }
@keyframes ml-answer { from { opacity: 0; translate: 0 8px; } }
html.mo .page-faq .acc.is-in .acc-btn .acc-q { animation: ml-q-pop calc(var(--mo-dur) * .7) var(--mo-ease-pop) calc(var(--mo-d, 0ms) + 150ms) backwards; }
html.mo .page-faq .acc-panel:not([hidden]) .acc-q-a { animation: ml-q-pop .5s var(--mo-ease-pop) .08s backwards; }
html.mo .page-faq .acc-panel:not([hidden]) .acc-a-body { animation: ml-answer .5s var(--mo-ease) .12s backwards; }

/* フッターの口の上の間隔を現行に合わせる（2026-09-26 統合時。最後の中身の下端→口の上端を現行と同じ方法で実測: tools なし・scratchpad の gap.mjs）。
   〜599 は現行 390、768〜1079 は現行 841 の値 */
/* 2026-09-28 測り直し: 旧「現行 -2」は閉じた回答の中の見えない「A」を拾った値だった。最後の質問カードの下端 → 口の上端は現行 673・841 とも 88、1000 は 114
   （フッターの margin-top 14 を足して合わせる） */
@media (min-width: 600px) and (max-width: 1079px) { body.page-faq main > .faq-body { padding-bottom: 74px; } }
@media (min-width: 911px) and (max-width: 1079px) { body.page-faq main > .faq-body { padding-bottom: 100px; } }

/* ============ 2026-09-28 現行 urala.com と Figma の二重照合で直した分（数値は出現アニメの後に実測） ============
   開いた中身（全幅）: 質問と回答の間は点線（現行・Figma の Line 3［破線 2/2・#C5B5A8］とも点線。旧は 1080〜 が実線・〜1079 は線なし）、
   開くと＋が × に回る（旧 〜1079 は −）。回答の字は #271200（旧 #333）。
   〜599（現行 390 実測）: 回答に A の丸は無い（丸は 541〜 だけ）。点線はカードの左右 12 内側で質問の下端に接し、→ 24 → 回答 14px/1.7・字間 0（カードの左 20 から）→ 32 → カードの下端。
   600〜910（現行 541〜910 の 673 / 841 実測）: 左右の余白 40。英字 FAQ の字頭 y200（18px・字間 0.25em）→ すぐ下に H1 40px/68 → 100 → ピル（2 列・各 371×55 まで・間 16・中央・角丸 48・17px 字間 2%・左 26。673 では左 13 に詰まる＝幅に比例）
     → 88 → 見出し 32px/54（帯 4×40 を行の中央）→ 32 → カード（角丸 8・上下 16 左右 20・Q 丸 50・線 2・Q の字 16px → 32 → 質問 20px/34 字間 2% #271200・＋ 24）。
     開くと 点線（カードの左右 27 内側）→ 24 → A 丸 50（線 2 #EEAD75）→ 32 → 回答 20px/34（丸は回答の縦の中央）→ 32。区画の間 64。
   911〜1079（現行 911〜1120 の 1000 実測）: 左右の余白 56。ピルは同じ 2 列 371（中央）。ピル → 見出し 120（帯 4×54）→ 32 → カード（Q の字 20px・質問 17px/1.7 字間 2%）。
     開くと 点線（左右 31 内側）→ 24 → A 丸 50 → 回答 17px。区画の間 96（＝ 1080〜 の Figma と同じ）。 */
@media (max-width: 1079px) {
  .page-faq .faq-list .acc-btn[aria-expanded="true"] .i-plus { display: inline-block; transform: rotate(45deg); }
  .page-faq .faq-list .acc-btn[aria-expanded="true"] .i-minus { display: none; }
  .page-faq .faq-list .acc-panel::before { content: ""; display: block; border-top: var(--dash); }
  .page-faq .faq-list :is(.acc-a-body, .acc-a-body p) { color: var(--c-ink-deep); }
}
@media (min-width: 1080px) { .page-faq .faq-list .acc-panel:has(.acc-a)::before { border-top: var(--dash); } }

@media (max-width: 599px) {
  .page-faq .faq-list .acc-panel { padding: 0 20px 32px; }
  .page-faq .faq-list .acc-panel::before { margin: 0 -8px 24px; }
  .page-faq .faq-list .acc-q-a { display: none; }
  .page-faq .faq-list .acc-a { display: block; }
  .page-faq .faq-list :is(.acc-a-body, .acc-a-body p) { padding-top: 0; font-size: 14px; line-height: 1.7; letter-spacing: 0; }
}

@media (min-width: 600px) and (max-width: 1079px) {
  body.page-faq .main { --gutter: 40px; }
  .page-faq .faq-head { padding-top: 110px; padding-bottom: 0; }   /* main は 90 から始まる（ヘッダー 90）→ 英字の字頭 200 */
  .page-faq .faq-head .sec-head.center .sec-label { font-size: 18px; line-height: 25.2px; letter-spacing: 0.25em; text-indent: 0.25em; }
  .page-faq .faq-head .sec-head { gap: 0; }
  .page-faq .faq-head .sec-head > .sec-label + * { margin-top: 0; }
  .page-faq .faq-head h1.sec-title { font-size: 40px; line-height: 68px; letter-spacing: 0.06em; }
  .page-faq .faq-anchors { margin-top: 100px; }
  .page-faq .faq-anchors ul { grid-template-columns: repeat(2, minmax(0, 371px)); justify-content: center; gap: 16px; }
  .page-faq .faq-anchors .anchor-pill { min-height: 54.9px; padding: 13px clamp(8px, 7.74vw - 45px, 21px) 13px clamp(8px, 7.74vw - 39px, 26px); gap: 8px; border-radius: 48px; font-size: 17px; letter-spacing: 0.02em; line-height: 1.7; }   /* 上下 13（現行 673: 1 行 54.9・「補綴」の 2 行 80.4。旧 12 で 2 行が 78.4） */
  /* 山形は現行と同じ 13×7.4（〜599 と同じ 20 枠＋線 2.2）。山形の中心は旧 24 枠と同じ場所（右 2）。字 → 山形の枠 4（旧は gap 8 ＋ 左 2）で字の入る幅を現行の 241.5（673）に広げ、
     「補綴 (被せ物・入れ歯・人工歯)に関す／る質問」を現行と同じ所で折る（旧は「に関／する質問」） */
  .page-faq .faq-anchors .anchor-pill { gap: 4px; }
  .page-faq .faq-anchors .anchor-pill .icon { width: 20px; height: 20px; margin: 0 2px 0 0; }
  /* 同じ段のピルは高さを揃え、字は上下の中央（現行 673: 右の「補綴（…）に関する質問」が 2 行で 80 高になる段は、左の「訪問診療に関する質問」も 80 高。旧は左が 55 高のまま上に寄っていた） */
  .page-faq .faq-anchors li { display: flex; }
  .page-faq .faq-anchors .anchor-pill { flex: 1 1 auto; }
  .page-faq .faq-anchors .anchor-pill-label:has(.faq-pill-sub) { font-size: 16px; letter-spacing: 0; }
  .page-faq .faq-pill-sub { font-size: 13px; letter-spacing: 0; }

  .page-faq .faq-body { padding-top: 88px; }
  .page-faq .faq-sec + .faq-sec { margin-top: 64px; }
  .page-faq .faq-sec-title { position: relative; border-left: 0; padding-left: 20px; font-size: 32px; line-height: 54px; letter-spacing: 0.06em; margin-bottom: 32px; }
  .page-faq .faq-sec-title::before { content: ""; position: absolute; left: 0; top: 7px; width: 4px; height: 40px; background: var(--c-orange); }

  .page-faq .faq-list .acc { border-radius: 8px; }
  .page-faq .faq-list .acc-btn { min-height: 82px; padding: 16px 20px; gap: 32px; font-size: 20px; line-height: 34px; letter-spacing: 0.02em; }
  .page-faq .faq-list .acc-btn > .icon { width: 24px; height: 24px; }
  .page-faq .faq-list .acc-q { width: 50px; height: 50px; border-width: 2px; font-size: 16px; }
  .page-faq .faq-list .acc-q-a { background: var(--c-orange-ans); border-color: var(--c-orange-ans); color: var(--c-white); }   /* 2026-09-29: 現行のピーチの線 → 濃いオレンジの塗り＋白字（ユーザー指示。採用と同じ色） */
  .page-faq .faq-list .acc-panel { padding: 0 20px 32px; }
  .page-faq .faq-list .acc-panel::before { margin: 0 7px 24px; }
  .page-faq .faq-list .acc-a { align-items: center; gap: 32px; }
  .page-faq .faq-list :is(.acc-a-body, .acc-a-body p) { padding-top: 0; font-size: 20px; line-height: 34px; letter-spacing: 0.02em; }
}
@media (min-width: 911px) and (max-width: 1079px) {
  body.page-faq .main { --gutter: 56px; }
  .page-faq .faq-body { padding-top: 120px; }
  .page-faq .faq-sec + .faq-sec { margin-top: 96px; }
  .page-faq .faq-sec-title::before { top: 0; height: 54px; }
  .page-faq .faq-list .acc-btn { font-size: 17px; line-height: 1.7; }
  .page-faq .faq-list .acc-q { font-size: 20px; }
  .page-faq .faq-list .acc-q-a { font-size: 20px; }
  .page-faq .faq-list .acc-panel::before { margin-inline: 11px; }
  .page-faq .faq-list :is(.acc-a-body, .acc-a-body p) { font-size: 17px; line-height: 1.7; }
}
/* 目次ピルの山形の線（〜1079）: 24 枠で 2.2 → 20 枠で太さ 1.83（現行の 14×8 の山形を 13×7.4 で置いた太さ 1.86） */
@media (max-width: 1079px) { .page-faq .faq-anchors .anchor-pill .icon path { stroke-width: 2.2; } }
/* ＋ / × の大きさ（線の長さと太さ）: 〜599 現行 12×2／600〜1079 現行 24×3／1080〜 Figma 20×2（Group 117）。
   plus の SVG は 24 枠に長さ 14・線 2.2 なので、枠を広げて負の余白で相殺し、線の太さは stroke-width で合わせる */
@media (max-width: 599px) { body.page-faq .faq-list.acc-card .acc-btn:has(.acc-q) > .icon { width: 21px; height: 21px; margin: -1px; } body.page-faq .faq-list.acc-card .acc-btn:has(.acc-q) > .icon path { stroke-width: 2.3; } }
@media (min-width: 600px) and (max-width: 1079px) { body.page-faq .faq-list.acc-card .acc-btn:has(.acc-q) > .icon { width: 41px; height: 41px; margin: -8.5px; } body.page-faq .faq-list.acc-card .acc-btn:has(.acc-q) > .icon path { stroke-width: 1.76; } }
@media (min-width: 1080px) { body.page-faq .faq-list.acc-card .acc-btn:has(.acc-q) > .icon { width: 34px; height: 34px; margin: -5px; } body.page-faq .faq-list.acc-card .acc-btn:has(.acc-q) > .icon path { stroke-width: 1.41; } }

/* ---------- 下部 CTA の見直し案（docs/CTA.md・templates/main/_cta.mjs。旗がオフのときは要素が無い） ----------
   c03 予約の帯 .faq-rsv・c07 文字リンク .faq-more は .faq-body の中の最後（区分の後）。最後の中身 → フッターの口は .faq-body の下の余白のまま。
   区分 → 帯（または文字リンク）は区分どうしの間と同じ（〜767 60・768〜 76・1080〜 100）。帯 → 文字リンク 32 */
.page-faq :is(.faq-rsv, .container-text + .faq-more) { padding-top: 60px; }
.page-faq .faq-rsv { padding-bottom: 0; }
.page-faq .faq-rsv + .faq-more { padding-top: 32px; }
@media (min-width: 768px) { .page-faq :is(.faq-rsv, .container-text + .faq-more) { padding-top: 76px; } }
@media (min-width: 1080px) { .page-faq :is(.faq-rsv, .container-text + .faq-more) { padding-top: 100px; } }