/* よくある質問のカテゴリのタブ（ol.faq-menu > li.menu-item）の細部の直し（2026-10-04）
   ユーザー：「こういうのも項目ひとつだったら表示させなくていいし、表示させてるのも上の横線伸びてるしで、細かな修正とかもお願い」
   (a) 項目が 1 つだけのときは、タブの列ごと出さない（/corporate/「法人買取について」・/buyshops/ など）。切り替える先が無いため。
   (b) 項目が複数のときも、タブの上の線がタブの無い右側まで伸びないようにする。
       今は列（ol）の上辺に線があり、タブが列の幅に満たない（PC で 3 項目＝幅の半分）と線だけが右端まで伸びる。
       線を各タブの上辺に移し、2 段目のタブは 1px 上へ重ねて、段の境目の線が 2 本にならないようにする。
   店舗一覧（.main.buyshops）のタブは独自の囲み線なので (b) の対象外。 */
.main .faq .faq-menu:has(> .menu-item:only-child){ display:none; }
.main:not(.buyshops) .faq .faq-menu{ border-top:0; padding-top:1px; }
.main:not(.buyshops) .faq .faq-menu > .menu-item{ border-top:1px solid var(--color7); margin-top:-1px; }

/* (c)（2026-10-04 追加）タブの文字の泣き別れ（「初期化の方法・デ／ータ」「査定・入金・キャ／ンセル」など）を止める。
   PC（751px 以上）：タブの幅を文字に合わせ、タブの中は 1 行で収める（3 項目でも 1000px の列に十分収まる）。
   SP（750px 以下）：3 つ並び（2 項目のページは 2 つ並び）のまま、タブの幅を文字の量に合わせて配り、文字を幅に合わせて少し小さくする
   （390px 以上は今と同じ 11px。360px 以下は 10.5px）。374px 以下はタブの左右の余白を詰める。
   （2026-10-04 更新：文字の下限を 9px → 10.5px に上げ、文字は (d) の塊の切れ目でだけ 2 行に折り返す。タブは文字の塊より細くならない） */
@media (min-width: 751px) {
  .main:not(.buyshops) .faq .faq-menu > .menu-item{ width:auto; flex:0 0 auto; white-space:nowrap; }
}
@media (max-width: 750px) {
  .main:not(.buyshops) .faq .faq-menu{ flex-wrap:nowrap; }
  .main:not(.buyshops) .faq .faq-menu > .menu-item{ width:auto; flex:1 1 auto; font-size:clamp(10.5px, 2.82vw, 11px); }
  .main:not(.buyshops) .faq .faq-menu .menu-item .faq-menu-title > .arrow{ flex:0 0 auto; width:6px; }
}
@media (max-width: 374px) {
  .main:not(.buyshops) .faq .faq-menu > .menu-item{ padding-left:4px; padding-right:2px; }
}

/* (d)（2026-10-04 追加）タブの文字は、テンプレートで「・」の後ろごとに区切った塊（.fmt-c）を折り返さない。折り返すのは塊と塊の間だけ。
   全体の包み（.fmt-t）は、.faq-menu-title（display:flex・両端寄せ）の中で 1 つの塊として扱う（塊ごとに左右へ離れないように）。 */
.main .faq .faq-menu-title > .fmt-t{ flex:1 1 auto; min-width:0; }
.main .faq .faq-menu-title .fmt-c{ white-space:nowrap; }

/* (e)（2026-10-04 追加）タブの文字の塊（.fmt-t）と矢印（.arrow）の間に 4px の隙間を取る（/iphone-reset/「売却前の初期化」で文字と ∨ がくっついて見えた）。
   矢印の左の余白（1px）は隙間に含める。374px 以下は隙間を 3px にし、タブの右の余白（2px → 1px）と合わせて、320px でも 3 つ並びのまま、
   今 1 行のタブ（/delivery-purchase/ の「梱包・送料」など）を 1 行のまま収める。 */
.main .faq .faq-menu .menu-item .faq-menu-title{ gap:4px; }
.main .faq .faq-menu .menu-item .faq-menu-title > .arrow{ margin-left:0; }
@media (max-width: 374px) {
  .main .faq .faq-menu .menu-item .faq-menu-title{ gap:3px; }
  .main:not(.buyshops) .faq .faq-menu > .menu-item{ padding-right:1px; }
}
