/* /recruit/faq よくある質問（templates/recruit/faq.mjs）
   色・書体・余白は tokens.css の変数のみ。アコーディオンの基本形は components.css の .acc-card / .acc-q を使い、ここでは並び・寸法（Q 円 40→48、質問 14→15→18px、左右 16→20px）と RECRUIT INFO 面を定義する。
   並び: 〜1079 見出し上・アコーディオン下の 1 列（fold344 / open841 の実測どおり）/ 1080〜 左 248px に見出し 2 行・右にアコーディオン（pc1280。本文は容器の内側 40px＝x 80〜1200）。
   目次ピル: 〜599 縦 5 / 600〜1079 2 列＋最後の 1 個を中央 / 1080〜 3＋2 の 2 行中央。
   折りたたみ規約: 100vh なし・center+overflow-x 併用なし・overflow-x:hidden なし・ch 単位なし。タップ標的は目次ピル 56px・アコーディオン頭 64px 以上・リンクカード 88px 以上。 */

/* ---------- ページ見出し＋目次ピル ---------- */
.page-recruit-faq .faq-head .sec-title { line-height: 1.7; }
/* 〜599: 縦 5（components の 2 列だと 344 で 12 文字が 3 行に折れる） */
.page-recruit-faq .faq-anchors ul { grid-template-columns: minmax(0, 1fr); }
.page-recruit-faq .faq-anchors .anchor-pill { font-size: 15px; }                    /* fold344-ref: ピル文字 15px */
@media (max-width: 599px) { .page-recruit-faq .faq-anchors { padding-inline: 20px; } }   /* fold344-ref: ピルは左右 40px（本文の 20px より内側） */
@media (min-width: 600px) and (max-width: 1079px) {
  .page-recruit-faq .faq-anchors ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-recruit-faq .faq-anchors li:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; width: calc(50% - 8px); }   /* 5 個目を中央に（open841 の実測） */
}
@media (min-width: 768px) {
  .page-recruit-faq .faq-anchors .anchor-pill { font-size: 16px; }                 /* open841-ref / pc1280-ref: 16px */
}
@media (min-width: 768px) and (max-width: 1079px) {
  .page-recruit-faq .faq-anchors ul { max-width: 616px; margin-inline: auto; }      /* open841-ref: 300px × 2 ＋ 16 を中央に */
}
@media (min-width: 1080px) {
  .page-recruit-faq .faq-anchors li { flex: 0 1 300px; min-width: 240px; }   /* 300px × 3 で 1 行 → 3＋2（pc1280） */
}

/* ---------- 本文 ---------- */
.page-recruit-faq .faq-main { padding-top: clamp(48px, 8vw, 120px); }
@media (min-width: 768px) and (max-width: 1079px) {
  .page-recruit-faq .faq-main { padding-top: 48px; }                                /* 841×701 で 1 画面目に本文を出す */
  .page-recruit-faq .faq-main > .container { width: min(100% - var(--gutter) * 2, 82%); }   /* open841-ref: 本文は 76〜765（約 690px）に絞る */
}
.page-recruit-faq .faq-group { display: grid; gap: 24px; scroll-margin-top: 24px; }
.page-recruit-faq .faq-group + .faq-group { margin-top: clamp(96px, 12vw, 200px); }   /* グループ間 PC 200 / 841 約 100 / 344 約 100（fold344-ref: 前カード末〜次見出し 136） */

/* グループ見出し（職種名 = strong がオレンジ。base.css の strong 色）。行は inline-block にして「質｜問」の字中改行を避ける */
.page-recruit-faq .faq-h { font-size: var(--fs-h2); line-height: 1.7; letter-spacing: 0.04em; color: var(--c-ink-deep); }
.page-recruit-faq .faq-h-l { display: inline-block; }
.page-recruit-faq .faq-body { min-width: 0; }

/* アコーディオン（.acc-card の上書き。open841: 左右 20px・Q 48・質問 16px） */
/* 〜599（fold344-ref）: 左右 16px・Q 40 と質問の間 8px・質問 14px・＋ 20px。質問の幅を 190px 前後確保して 12 文字が 1 行に入る */
.page-recruit-faq .faq-list { gap: 16px; }
.page-recruit-faq .faq-list .acc-btn { padding: 14px 16px; gap: 8px; font-size: 14px; line-height: 1.8; letter-spacing: 0.02em; }
.page-recruit-faq .faq-list .acc-btn > .icon { flex: none; width: 20px; height: 20px; }
.page-recruit-faq .faq-list .acc-panel { padding: 0 16px 24px; font-size: 14px; line-height: 2; color: var(--c-ink-deep); letter-spacing: 0.02em; }
.page-recruit-faq .faq-list .acc-a { gap: 8px; padding-top: 4px; }
@media (min-width: 600px) {
  .page-recruit-faq .faq-list .acc-btn { padding: 14px 20px; gap: 12px; font-size: 15px; }
  .page-recruit-faq .faq-list .acc-btn > .icon { width: 24px; height: 24px; }
  .page-recruit-faq .faq-list .acc-panel { padding: 0 20px 24px; font-size: 15px; }
  .page-recruit-faq .faq-list .acc-a { gap: 12px; }
}
@media (min-width: 768px) {
  /* open841-ref / pc1280-ref: 質問 18px・Q 48・カード間 16 */
  .page-recruit-faq .faq-list .acc-btn { padding: 16px 20px; gap: 24px; font-size: 18px; line-height: 1.75; }
  .page-recruit-faq .faq-list .acc-panel { padding: 0 20px 28px; font-size: 16px; }
  .page-recruit-faq .faq-list .acc-a { gap: 24px; }
  /* 質問が 2 行になる幅（768〜1439。Figma 1440 は 1 行）: h3 の balance だけだと「ブランクがあ｜る）」「アポ｜イント」と語の途中で折れる → 文節で折る（対応ブラウザだけ。ほかは従来どおり） */
  .page-recruit-faq .faq-list .acc-title { word-break: auto-phrase; }
}
@media (min-width: 1080px) {
  /* pc1280-ref: 本文は 80〜1200（容器 1200 の内側にさらに 40px）。見出し列 248 ＋ 40 でカードは x=368 から */
  .page-recruit-faq .faq-group { grid-template-columns: 248px minmax(0, 1fr); gap: 0 40px; align-items: start; padding-inline: 40px; }
  .page-recruit-faq .faq-group + .faq-group { margin-top: 200px; }
  .page-recruit-faq .faq-h { line-height: 1.75; }
  .page-recruit-faq .faq-h-l { display: block; }                                  /* titleBreak の位置で 2 行 */
  .page-recruit-faq .faq-list .acc-btn { gap: 32px; font-size: 18px; }
  .page-recruit-faq .faq-list .acc-panel { padding-inline: 20px; }
  .page-recruit-faq .faq-list .acc-a { gap: 32px; }
}

/* ---------- RECRUIT INFO（上辺が楕円に膨らむグラデ面）＋ CTA ＋ ENTRY（data.css と同型） ---------- */
.page-recruit-faq .faq-rinfo { position: relative; margin-top: clamp(96px, 12vw, 200px); padding: clamp(72px, 10vw, 160px) 0 clamp(56px, 6vw, 96px); }
.page-recruit-faq .faq-rinfo::before { content: ""; position: absolute; top: 0; bottom: 0; left: -20%; right: -20%; z-index: 0; background: linear-gradient(180deg, var(--c-hero-yellow) 0%, var(--c-hero-mid) 42%, var(--c-cream) 100%); border-radius: 50% 50% 0 0 / clamp(48px, 10vw, 160px) clamp(48px, 10vw, 160px) 0 0; }
.page-recruit-faq .faq-rinfo > .container { position: relative; z-index: 1; }
.page-recruit-faq .faq-rinfo-grid { display: grid; gap: 24px; align-items: start; }
.page-recruit-faq .faq-rinfo-head { margin-bottom: 0; align-content: start; }      /* グリッド行に引き伸ばされてラベルと見出しが離れないように（pc1280-ref はラベル直下に見出し） */
.page-recruit-faq .faq-rinfo-links { display: grid; gap: 8px; }
.page-recruit-faq .faq-rinfo-ctas { display: grid; gap: 16px; margin-top: clamp(48px, 8vw, 160px); }
.page-recruit-faq .faq-rinfo .cta-photo { border: 0; }
/* ENTRY 帯の高さ: fold344-ref 200 / open841-ref 307 / pc1280-ref 320（募集要項・見学の写真帯は components の 160 / 224 のまま） */
.page-recruit-faq .faq-rinfo .cta-entry { min-height: 200px; }
@media (min-width: 768px) and (max-width: 1079px) {
  /* open841-ref: 見出し→リンクカードの 1 列を 560px 幅で中央に。帯だけ容器いっぱい */
  .page-recruit-faq .faq-rinfo-grid { max-width: 560px; margin-inline: auto; gap: 40px; }
}
@media (min-width: 768px) {
  .page-recruit-faq .faq-rinfo .cta-entry { min-height: 300px; }
  .page-recruit-faq .faq-rinfo-ctas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .page-recruit-faq .faq-rinfo-ctas .cta-entry { grid-column: 1 / -1; }
}
@media (min-width: 1080px) {
  /* pc1280-ref: 見出し列 160〜560（400）・カード列 560〜1120（560）＝ 960px を中央に */
  .page-recruit-faq .faq-rinfo-grid { grid-template-columns: 360px minmax(0, 560px); gap: 40px; max-width: 960px; margin-inline: auto; }
  .page-recruit-faq .faq-rinfo .cta-entry { min-height: 320px; }
}

/* ======================================================================
   SP（〜767）の細部を参照 440/393/344 の実測に合わせる（capture/sp-compare/recruit__faq、2026-09-24）
   768〜 は上の値のまま（ここは max-width の中だけ）
   ====================================================================== */
@media (max-width: 767px) {
  /* 見出し: ラベル 16px・H1 32px。ヘッダー下端→ラベル字頭 57、ラベル→H1 字頭 50、H1 字下→目次ピル 52 */
  .page-recruit-faq .faq-head { padding: 50px 0 32px; }
  .page-recruit-faq .faq-head .sec-head { gap: 15px; }
  .page-recruit-faq .faq-head .sec-label { font-size: 16px; letter-spacing: 0.2em; text-indent: 0.2em; }
  .page-recruit-faq .faq-head h1.sec-title { font-size: 32px; text-wrap: wrap; }
  .page-recruit-faq .faq-anchors { margin-top: 41px; }   /* 最初のピルの上端 259（参照 3 幅） */
  /* 本文・RECRUIT INFO の容器は左右 32（カード 32〜407） */
  .page-recruit-faq :is(.faq-main, .faq-rinfo) > .container { width: calc(100% - 64px); }

  /* グループ: 見出し 24px（歯科医師に関するご質問 幅 276）。最後のピル→最初の見出し字頭 131、見出し字下→カード 50、前のグループの最後のカード→見出し字頭 131 */
  .page-recruit-faq .faq-main { padding-top: 87px; }
  .page-recruit-faq .faq-h { font-size: 24px; text-wrap: wrap; }
  /* 参照 344 は「歯科衛生士に関するご質 / 問」と字で折れる（inline-block の「歯科衛生士に / 関するご質問」だと 1 行ずれて高さが 42 伸びる） */
  .page-recruit-faq .faq-h-l { display: inline; }
  .page-recruit-faq .faq-group { gap: 40px; }   /* 見出しの字下→最初のカード 50（参照 440・344） */
  .page-recruit-faq .faq-group + .faq-group { margin-top: 120px; }
  /* 質問カード: 角丸 16・間 16・上下 16・左 20 / 右 17。Q 円 32（線 1px・Q 14px）→ 間 8 → 質問 14px lh24 字間 0 → 間 16 → ＋ 18px。
     1 行 64・2 行 79.6・3 行 103.4・4 行 127.2（参照 440 の「勤務医として長く働くことはできます / か？」の折れ位置も同じ） */
  .page-recruit-faq .faq-list .acc { border-radius: var(--r-m); }
  /* h3 の text-wrap: balance（base.css）を切る。参照は行を詰めて折る（344「最初から治療を任されます / か？見学や補助だけで終わ…」12 字/行。balance だと 9 字/行で 1 行増える） */
  .page-recruit-faq .faq-list .acc-btn { text-wrap: wrap; min-height: 64px; padding: 16px 17px 16px 20px; gap: 8px; font-size: 14px; line-height: 1.7; letter-spacing: 0; }   /* 行送り 23.8: カードは 1 行 64・2 行 79.6・3 行 103.4・4 行 127.2（参照の白の高さ 64/79〜80/103〜104/127） */
  .page-recruit-faq .faq-list .acc-q { width: 32px; height: 32px; border-width: 1px; font-size: 14px; }
  .page-recruit-faq .faq-list .acc-btn > .icon { width: 18px; height: 18px; margin-left: 8px; }   /* 質問の字は x92〜261（幅 169。flex の間 8＋8 で ＋ は 277〜）: 344 で 12 字・440 で 18 字/行（参照の折れ位置） */
  .page-recruit-faq .faq-list .acc-panel { padding: 0 17px 24px 20px; }
  .page-recruit-faq .faq-list .acc-a { gap: 9px; }

  /* RECRUIT INFO（interviews-index.css の .rinfo と同じ実測）: 最後のカード→弧の頂 125、頂→ラベル字頭 122、H2 字下→カード 48、
     白カード 118（2px のクリーム縁込み）間 10、カード→写真帯 82、帯 160・間 8、ENTRY 200。上辺は半径 ≒1.82W の円弧、グラデは 0.96W でクリームへ */
  .page-recruit-faq .faq-rinfo { margin-top: 125px; padding: 116px 0 50px; }   /* 下 50: ENTRY 帯の下端→フッターの口の上端 81（参照 3 幅。.ft-recruit の margin-top 30 と足す） */
  .page-recruit-faq .faq-rinfo::before {
    left: 0; right: 0; border-radius: 0;
    background: linear-gradient(180deg, var(--c-hero-yellow) 12vw, var(--c-hero-peach) 40vw, var(--c-cream) 96vw);
    -webkit-mask: radial-gradient(circle 182vw at 50% 182vw, #000 calc(182vw - 0.6px), transparent 182vw) top / 100% 12vw no-repeat, linear-gradient(#000 0 0) 0 calc(12vw - 1px) / 100% 100% no-repeat;
            mask: radial-gradient(circle 182vw at 50% 182vw, #000 calc(182vw - 0.6px), transparent 182vw) top / 100% 12vw no-repeat, linear-gradient(#000 0 0) 0 calc(12vw - 1px) / 100% 100% no-repeat;
  }
  .page-recruit-faq .faq-rinfo-head { gap: 15px; }
  .page-recruit-faq .faq-rinfo-head .sec-label { font-size: 16px; letter-spacing: 0.2em; padding-left: 5px; }   /* RECRUIT INFO の字頭 x39（参照 440/393/344） */
  .page-recruit-faq .faq-rinfo-head .sec-title { font-size: 24px; }
  .page-recruit-faq .faq-rinfo-grid { gap: 41px; }
  .page-recruit-faq .faq-rinfo-links { gap: 10px; }
  .page-recruit-faq .faq-rinfo-links .link-card { min-height: 118px; padding: 16px 32px; border: 1px solid var(--c-cream); }   /* 参照: 白 116＋縁 1×2、送り 128 */
  .page-recruit-faq .faq-rinfo-links .btn-ring { width: 24px; height: 24px; }
  .page-recruit-faq .faq-rinfo-links .btn-ring .icon { width: 20px; height: 20px; }
  .page-recruit-faq .faq-rinfo-ctas { gap: 8px; margin-top: 82px; }
  .page-recruit-faq .faq-rinfo .cta { padding: 24px 32px; }
  .page-recruit-faq .faq-rinfo-band .cta-title { font-size: 20px; letter-spacing: 0.02em; }
  .page-recruit-faq .faq-rinfo-ctas .cta-ring .icon { width: 32px; height: 32px; }
  .page-recruit-faq .faq-rinfo-ctas .cta-ring .icon path { stroke-width: 1.1; }
  .page-recruit-faq .faq-rinfo .cta-entry .cta-text { flex-direction: column; align-items: flex-start; gap: 7px; }   /* ENTRY の字下→エントリーの字頭 23（参照） */
  .page-recruit-faq .faq-rinfo .cta-entry .cta-en { font-size: 47px; white-space: nowrap; }   /* 参照: ENTRY の字高 34・x66〜220（48px だと 344 で「ENTR / Y」に折れる） */
  .page-recruit-faq .faq-rinfo .cta-entry .cta-title { font-size: 18px; letter-spacing: 0.04em; }
  .page-recruit-faq .faq-rinfo .cta-entry .smile.cta-smile { width: 160px; left: 40px; top: 19px; }
}
/* 〜599: 目次ピルは縦 5（幅 300 まで・左右 40 以上）、高さ 54・間 15、文字 15px/0.04em は左 27、⌄ 18px は右 29 */
@media (max-width: 599px) {
  .page-recruit-faq .faq-anchors ul { max-width: 300px; margin-inline: auto; gap: 15.5px; }   /* ピルの送り 69.5（参照 259 / 328 / 398 / 467 / 537） */
  .page-recruit-faq .faq-anchors .anchor-pill { min-height: 54px; padding: 8px 29px 8px 27px; letter-spacing: 0.04em; }
  .page-recruit-faq .faq-anchors .anchor-pill .icon { width: 18px; height: 18px; }
  /* 参照 344: 12 字のピル（歯科衛生士／歯科総合職に関するご質問）も 1 行。文字 x66〜254 の後 14 空けて ⌄（インク x272〜281。短いピルの ⌄ は 261〜270）＝右の余白に食い込む */
  .page-recruit-faq .faq-anchors .anchor-pill { white-space: nowrap; gap: 14px; }
}

/* 行頭禁則を参照（STUDIO）に合わせる: base.css の line-break: strict だと小書きの「っ」「ゃ」や「ー」を行頭に置けず、参照より 1 字早く折れて行が増える
   （参照 clinical-training 393「…自分の軸をつく / っていけるよう」、faq 344「症例経験はしっかり積めま / すか？」）。〜767 の本文だけ normal にする */
@media (max-width: 767px) { .page-recruit-faq .main { line-break: normal; } }

/* ======================================================================
   〜767 の 3 周目（2026-09-26。現行プレビューの計算済みスタイルを 344/390/440 で文字ごとに突き合わせ）
   英字が Inter → Roboto に替わった（9/25）あとも Inter 用に詰めた字間（0.2em・0.02em・0.04em）が残っていた → 原本の値に戻す。
   本文の字間は body の 0.06em が px で継承されて字の大きさとずれる（14.7px 基準）ので、要素ごとに 0.06em を当て直す
   ====================================================================== */
@media (max-width: 767px) {
  /* 英字ラベル 16px/0.25em（FAQ 幅 41・RECRUIT INFO 152）。中央寄せは text-indent で相殺。RECRUIT INFO の字頭 x38 */
  .page-recruit-faq :is(.faq-head, .faq-rinfo-head) .sec-label { letter-spacing: 0.25em; }
  .page-recruit-faq .faq-head .sec-label { text-indent: 0.25em; }
  .page-recruit-faq .faq-rinfo-head .sec-label { padding-left: 6px; }
  /* 目次ピル 15px/0.06em（歯科医師に関するご質問 幅 175）・グループ見出し 24px/0.06em */
  .page-recruit-faq .faq-anchors .anchor-pill { letter-spacing: 0.06em; }
  .page-recruit-faq .faq-anchors .anchor-pill .icon path { stroke-width: 1.4; }   /* ⌄ は細線（原本 Material Symbols の keyboard_arrow_down。線 1px 前後） */
  .page-recruit-faq .faq-h { letter-spacing: 0.06em; }
  /* 採用情報の帯: 写真帯の題 20px/0.06em（募集要項 幅 85）、ENTRY は Roboto 400・48px・字間 0.06em（幅 161）、エントリー 18px/0.06em */
  .page-recruit-faq .faq-rinfo-band .cta-title { letter-spacing: 0.06em; }
  .page-recruit-faq .faq-rinfo .cta-entry .cta-en { font-size: 48px; font-weight: 400; letter-spacing: 0.06em; }
  .page-recruit-faq .faq-rinfo .cta-entry .cta-title { letter-spacing: 0.06em; }
  /* 白いリンクカードの縁は 2px（原本 118 = 白 114＋縁 2×2。字頭 x66） */
  .page-recruit-faq .faq-rinfo-links .link-card { border-width: 2px; }
}

/* ======================================================================
   1080〜 Figma「よくある質問」115:4245（採用 1440 幅）に合わせる（2026-09-25）。〜1079 は上の値のまま
   ====================================================================== */
@media (min-width: 1080px) {
  .page-recruit-faq .main { --container: 1280px; }   /* Figma の中身は x 80〜1360 */
  /* 見出し（Frame 174 115:4933: ヘッダー込み 600）: ヘッダー下端 108 → ラベル上端 146（+38）、ラベル → 8 → H1 40px/1.7（181〜249）→ 80 → 目次ピル（329〜455）→ 145 → 最初のグループ 600 */
  .page-recruit-faq .faq-head { padding: 38px 0 145px; }
  .page-recruit-faq .faq-head .sec-head { gap: 8px; }
  /* 目次ピル（Frame 240 115:5034・1000 幅）: 300×51・白・角丸 32・上下 12 左右 24・16px/1.7 字間 6% オレンジ・右に下向き山形 10×6。間 24（横も縦も）で 3＋2 を中央 */
  .page-recruit-faq .faq-anchors { margin-top: 80px; }
  .page-recruit-faq .faq-anchors ul { max-width: 1000px; margin-inline: auto; gap: 24px; }
  .page-recruit-faq .faq-anchors li { flex: 0 0 300px; min-width: 0; }
  .page-recruit-faq .faq-anchors .anchor-pill { min-height: 51px; padding: 12px 24px; border-radius: 32px; font-size: 16px; line-height: 1.7; letter-spacing: 0.06em; }
  .page-recruit-faq .faq-anchors .anchor-pill .icon { width: 20px; height: 20px; margin-right: -5px; }   /* 24 枠の山形（幅 12）→ 20 枠で 10 幅。見えている右端を右余白 24 に */

  /* グループ（Frame 29 115:4953 ほか）: 見出し 236 ＋ 80 ＋ 質問 964。見出し 32px/1.7 字間 6%（職種名オレンジ＋「に関するご質問」#271200・2 行）。グループの間 200 */
  .page-recruit-faq .faq-main { padding-top: 0; }
  .page-recruit-faq .faq-group { grid-template-columns: 236px minmax(0, 1fr); gap: 0 80px; padding-inline: 0; }
  .page-recruit-faq .faq-group + .faq-group { margin-top: 200px; }
  .page-recruit-faq .faq-h { font-size: 32px; line-height: 1.7; letter-spacing: 0.06em; }

  /* 質問カード（Frame 112 115:5108 閉 / 115:5110 開）: 白・角丸 16・間 24。頭は余白 40（閉じて 130 高）：Q 丸 50（線 1px #E56300・Roboto 20 字間 5px）→ 16 → 質問 20px/1.7 字間 6% #271200 → 24 → ＋ 40 枠（腕 24・太さ 2.77）。
     開くと ＋ が 45° 回って ×、中身は左右 40・下 40：上に 1px 点線 #C5B5A8 → 40 → A 丸 50（線 1px #EEAD75・ピーチ）→ 16 → 回答 16px/2.2 字間 6% #271200（A 丸は回答の縦中央） */
  .page-recruit-faq .faq-list { gap: 24px; }
  .page-recruit-faq .faq-list .acc { border-radius: 16px; }
  .page-recruit-faq .faq-list .acc-btn { min-height: 130px; padding: 40px; gap: 16px; font-size: 20px; line-height: 1.7; letter-spacing: 0.06em; }
  .page-recruit-faq .faq-list .acc-q { width: 50px; height: 50px; border: 1px solid var(--c-orange); background: transparent; color: var(--c-orange); font-size: 20px; font-weight: 400; line-height: 1; letter-spacing: 5px; }
  .page-recruit-faq .faq-list .acc-btn > .icon { width: 36px; height: 36px; margin: 2px 2px 2px 10px; transition: transform .25s; }   /* 36 枠の腕 21＋丸端 ≒ 24、外枠 40（左は間 16＋8 ＝ 24） */
  .page-recruit-faq .faq-list .acc-btn > .icon path { stroke-width: 1.85; }   /* ×1.5 で 2.77 */
  .page-recruit-faq .faq-list .acc-btn[aria-expanded="true"] .i-plus { display: block; transform: rotate(45deg); }
  .page-recruit-faq .faq-list .acc-btn[aria-expanded="true"] .i-minus { display: none; }
  .page-recruit-faq .faq-list .acc-panel { padding: 0 40px 40px; font-size: 16px; line-height: 2.2; letter-spacing: 0.06em; color: var(--c-ink-deep); }
  .page-recruit-faq .faq-list .acc-a { gap: 16px; align-items: center; padding-top: 40px; }   /* 上の点線は下の「Q・A の丸」の段で全幅共通に描く */
  .page-recruit-faq .faq-list .acc-q-a { border-color: var(--c-orange-ans); background: var(--c-orange-ans); color: var(--c-white); }   /* 2026-09-29 濃いオレンジの塗り（下の「Q・A の丸」参照） */
  .page-recruit-faq .faq-list .acc-a-body { padding-top: 0; }
  /* 回答の改行（歯科総合職の給与・研修医のメリットなど）: Figma 139:4237 ほかは行ごとの段落を字間 0 で続ける（行送り 2.2 のみ）。components の 0.8em の段落間を消す */
  .page-recruit-faq .faq-list .acc-a-body > * + * { margin-top: 0; }

  /* RECRUIT INFO（Frame 167 → Frame 38 72:1016。interviews-index.css の .rinfo と同じ値）: 面の上端 = 最後のグループの下端 + 200、上辺は楕円 2128×752（上端 +16・端で +115）、
     見出しの行は上から 200・960 幅（320 ＋ 80 ＋ 560）を中央・白カード間 8。CTA は 160 下・写真帯 628×224（間 24）＋ ENTRY 帯 320。ENTRY の下 → フッターの口 200（.ft の margin-top 64 と足して 136） */
  .page-recruit-faq .faq-rinfo { --container: 1280px; margin-top: 200px; padding: 200px 0 136px; }
  .page-recruit-faq .faq-rinfo::before {
    left: 0; right: 0; border-radius: 0;
    background: linear-gradient(180deg, var(--c-hero-yellow) 0%, color-mix(in srgb, var(--c-hero-mid) 70%, var(--c-hero-yellow)) 40%, var(--c-cream) 90%);
    -webkit-mask: radial-gradient(73.889% 26.111vw at 50% 27.222vw, #000 calc(100% - 0.8px), transparent 100%) top / 100% 27.222vw no-repeat, linear-gradient(#000 0 0) 0 calc(27.222vw - 1px) / 100% 100% no-repeat;
            mask: radial-gradient(73.889% 26.111vw at 50% 27.222vw, #000 calc(100% - 0.8px), transparent 100%) top / 100% 27.222vw no-repeat, linear-gradient(#000 0 0) 0 calc(27.222vw - 1px) / 100% 100% no-repeat;
  }
  .page-recruit-faq .faq-rinfo-grid { grid-template-columns: minmax(0, 320px) minmax(0, 560px); justify-content: center; gap: 80px; max-width: none; }
  .page-recruit-faq .faq-rinfo-head { gap: 16px; }
  .page-recruit-faq .faq-rinfo-links { gap: 8px; }
  .page-recruit-faq .faq-rinfo-ctas { margin-top: 160px; gap: 24px; }
  .page-recruit-faq .faq-rinfo-band { min-height: 224px; padding: 40px 80px; }
  .page-recruit-faq .faq-rinfo-band .cta-title { font-size: 32px; }
  .page-recruit-faq .faq-rinfo .cta-entry { min-height: 320px; padding: 40px 80px; }
  .page-recruit-faq .faq-rinfo .cta-entry .cta-smile { width: 273px; left: 120px; top: 36px; }
}
@media (min-width: 1080px) and (hover: hover) and (pointer: fine) {
  .page-recruit-faq .faq-list .acc-btn[aria-expanded="true"]:hover > .i-plus { transform: rotate(45deg) scale(1.15); }   /* hover.css の scale で × が ＋ に戻らないように */
}

/* ---------- 演出（docs/MOTION.md。html.mo の下だけ。静止した見た目は変えない） ----------
   グループ見出し rise・質問カードは部品の stagger・各カードの Q の丸は pop（faq.mjs）。
   開いたとき: 答えの塊が短く上がり、A の丸が pop。パネルは閉じると hidden（display:none）に戻るので、開くたびに頭から再生される */
/* 開いたときの A の動きは motion.css に移した（医院 FAQ と共通。2026-09-28） */

/* ======================================================================
   Q・A の丸（2026-09-28。ユーザー指摘「A の背景はオレンジではなかったか」「Q と A が中央より少し左に寄っている」）
   Figma 115:5108 / 115:5110（Frame 112 の閉と開）で確かめた値に全幅で揃える:
     Q = 線 1px #E56300・字 #E56300・塗りなし／A = 線 1px #EEAD75・字 #EEAD75・塗りなし（橙の塗りではない）。字は Roboto Regular 400。
   〜1079 は components.css の既定（A は橙の塗り＋白字・線 2px・Roboto 500）が残っていたので、ここで Figma の形に揃える。
   左寄りの原因: 1080〜 の字間 5px（Figma の tracking 5px をそのまま移したもの）。CSS の letter-spacing は最後の字の後ろにも付くので、
   1 字だけの丸では字が 2.5px 左へ寄る（実測 Q −2.63px・A −2.50px）。1 字に字間は要らないので 0 にする（Roboto の Q・A は字形の左右の余白がほぼ等しく、字間 0 で中央）。
   開いたときの中身も Figma の形に: 質問の下に 1px の点線 #C5B5A8、A の丸は回答の縦の中央（〜1079 は点線が無く、A が上揃えだった）
   ====================================================================== */
.page-recruit-faq .faq-list .acc-q { border-width: 1px; background: transparent; font-weight: 400; line-height: 1; letter-spacing: 0; text-indent: 0; }
/* 2026-09-29 A の丸の色（ユーザー 2 度目の指摘「A はオレンジだったはず。なぜ薄いのか。背景も濃いオレンジを使っていたはず」）:
   9/28 に Figma 115:5110 と現行プレビュー（PC は線 2px #EEAD75・塗りなし、SP は A の丸なし）に合わせてピーチの線にしたのが「薄い」の原因。
   ユーザーが覚えていたのは 9/28 より前のこのサイト（部品の既定＝橙の塗り＋白字）なので、濃いオレンジの塗り＋白字に戻す。
   色は --c-orange-ans（主色 #E56300。9/28 より前の見た目）。形・大きさ・線 1px・Roboto 400 は Figma のまま */
.page-recruit-faq .faq-list .acc-q-a { border-color: var(--c-orange-ans); background: var(--c-orange-ans); color: var(--c-white); }
/* 点線: Figma の 1px 点線は 3px 描いて 3px 空ける（#C5B5A8）。CSS の dashed は Chrome で 4 描いて 1 空ける密な線になり、ほぼ実線に見えた → グラデで 3/3 を描く */
.page-recruit-faq .faq-list .acc-a { align-items: center; border-top: 0; background: linear-gradient(90deg, var(--c-line-2) 50%, transparent 0) 0 0 / 6px 1px repeat-x; padding-top: 20px; }
.page-recruit-faq .faq-list .acc-a-body { padding-top: 0; }
@media (min-width: 768px) { .page-recruit-faq .faq-list .acc-a { padding-top: 28px; } }
@media (min-width: 1080px) { .page-recruit-faq .faq-list .acc-a { padding-top: 40px; } }
