@charset "UTF-8";
/* ============================================================
   祇をん 玄松 ― よくある質問 /faq/
   MV（背景＋縦書き）＋ カテゴリ別アコーディオン（縦書き見出し左端）
   ※ lp-hero 等は stay.css を継承
   ============================================================ */

body.lower{ background:#fff; color:#3a3530; }
.faq-page .lp-hero__ttl{ font-family:"Zen Old Mincho","游明朝","Yu Mincho",serif; }

/* ---- カテゴリ：縦書き見出し（左端）＋ Q&Aリスト（右） ---- */
.faq-cat{ padding:clamp(52px,8vh,96px) var(--gutter); }
.faq-cat--beige{ background:#ede7df; }
/* 2026-07-29 FB: 白→生成りの交互構成に合わせ、最終カテゴリ(生成り)直後の予約CTAは白 */
.faq-page .reserve-cta{ background:#fff; }
/* MV直後はスナップで最上部に来るためヘッダー分の余白を確保 */
.lp-hero + .faq-cat{ padding-top:calc(var(--header-h) + clamp(28px,5vh,60px)); }
.faq-cat__inner{
  max-width:1040px; margin-inline:auto;
  display:flex; align-items:flex-start; gap:clamp(28px,5vw,76px);
}
.faq-cat__ttl{
  flex:0 0 auto;
  writing-mode:vertical-rl; text-orientation:upright;
  font-family:"Zen Old Mincho","游明朝","Yu Mincho",serif; font-weight:700;
  font-size:clamp(19px,1.9vw,26px); letter-spacing:.14em; line-height:1.5; color:#1d1b1a;
}
.faq-cat__list{ flex:1; min-width:0; max-width:860px; border-top:1px solid #d4cdbf; }

/* ---- アコーディオン ---- */
.faq-item{ border-bottom:1px solid #d4cdbf; }
.faq-q{
  display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%;
  padding:clamp(18px,2.6vh,26px) 2px; background:none; cursor:pointer; text-align:left;
  font-family:var(--font-mincho); font-weight:400; font-size:clamp(14.5px,1.1vw,16.5px);
  letter-spacing:.04em; line-height:1.6; color:#1d1b1a; transition:color .3s;
}
.faq-q:hover{ color:var(--matsu); }
.faq-q__q{ font-family:var(--font-en); font-weight:300; color:var(--matsu); margin-right:14px; font-size:.92em; }
.faq-q__icon{ position:relative; width:15px; height:15px; flex:0 0 auto; }
.faq-q__icon::before,.faq-q__icon::after{ content:""; position:absolute; top:50%; left:50%; background:#6f6a60; transition:transform .35s var(--ease), opacity .35s var(--ease); }
.faq-q__icon::before{ width:15px; height:1px; transform:translate(-50%,-50%); }
.faq-q__icon::after{ width:1px; height:15px; transform:translate(-50%,-50%); }
.faq-item.is-open .faq-q__icon::after{ transform:translate(-50%,-50%) scaleY(0); opacity:0; }
.faq-a{ overflow:hidden; max-height:0; transition:max-height .42s var(--ease); will-change:max-height; }
.faq-a__inner{
  padding:0 2px clamp(20px,2.8vh,28px);
  font-family:var(--font-body); font-size:clamp(13.5px,1vw,15px); line-height:2.15; letter-spacing:.03em; color:#3a3530;
}
.faq-a__inner a{ color:var(--matsu); border-bottom:1px solid currentColor; }
/* 開時の高さはJSが実寸で設定（固定max-heightをやめてカクつきを解消） */

/* ---- SP：見出しは横書きへ ---- */
@media (max-width:820px){
  .faq-cat__inner{ flex-direction:column; gap:14px; }
  .faq-cat__ttl{ writing-mode:horizontal-tb; letter-spacing:.18em; }
  .faq-cat__list{ max-width:none; }
  .faq-q{ font-size:14.5px; }
}