/* nav2026.css v2 — スマホのハンバーガーメニュー最終版(2026-11-14 指揮官CC・先生とChatGPTの最終デザイン=TCB風)
   白いヘッダー(実ロゴ+×)・白い地(先生のご指示: グレーの下地はやめて白)・均一な高さの一覧・細い罫線・明朝・
   左に細い線のアイコン・濃いグレーの帯(下層カテゴリ)・画面下の固定ボタン(料金表=白／LINEで相談・予約=LINEの緑)。
   開閉の仕組み(main.js の .menu-trigger)と、920px 超で消える仕組み(pc-920 / tab-920)はそのまま使う。
   v1(B案「施術をすぐ探す」・11/12)の大きな施術カードと価格表示は復活させない。 */

/* ---- 面全体(既存の .sp-menu を上書き) ---- */
.sp-menu { background: #fff !important; color: #2c2927; }
/* ⚠️ !important の理由: 料金表・二重専門・鼻・福岡鼻の4ページは /_v6/v6.css をこのファイルより後に読み、
   `.v6 .sp-g-nav{padding:84px 20px 24px}` と `.v6 .sp-menu .menu{position:absolute}` がここの決まりに勝ってしまう
   (写しで実測: 白いヘッダーの上に84pxの灰色の帯・×がスクロールで流れる)。ページ側のCSSは触らず、ここで押し切る */
.sp-menu .sp-g-nav { padding: 0 0 100px !important; max-width: none !important; margin: 0 !important; }
.sp-menu .menu-trigger.active span:nth-of-type(1),
.sp-menu .menu-trigger.active span:nth-of-type(3) { background: #2c2927 !important; }
.sp-menu .sp-nav-text-active { color: #2c2927 !important; }
/* 閉じる(×)は中身をスクロールしても同じ場所に残す(画面に固定)。ヘッダーの白地と同じ高さの中に収める */
.sp-menu .menu { position: fixed !important; top: 16px !important; right: 16px !important; margin: 0 !important; z-index: 32; }

.n26 { font-family: "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Yu Mincho", "YuMincho", "Noto Serif JP", serif; -webkit-font-smoothing: antialiased; }

/* ---- 白いヘッダー(実ロゴ)。スクロールしても上に留まる ---- */
.n26-hd { position: sticky; top: 0; z-index: 30; height: 68px; display: flex; align-items: center; padding: 0 16px; background: #fff; border-bottom: 1px solid #e3e3e3; }
.n26-hd .n26-logo { display: block; line-height: 0; }
.n26-hd .n26-logo img { height: 34px; width: auto; }

/* ---- 一覧(均一な高さ・細い罫線・左にアイコン) ---- */
.n26-ls, .n26-ls ul { list-style: none; margin: 0; padding: 0; }
.n26-ls { border-bottom: 1px solid #e3e3e3; }
.n26-ls > li { border-top: 1px solid #e3e3e3; }
.n26-ls > li:first-child { border-top: 0; }
.n26-row { display: flex; align-items: center; width: 100%; min-height: 62px; padding: 0 18px 0 22px; box-sizing: border-box; background: #fff; border: 0; color: #2c2927; font: inherit; font-size: 15.5px; font-weight: 500; letter-spacing: .08em; line-height: 1.4; text-decoration: none; text-align: left; cursor: pointer; -webkit-appearance: none; appearance: none; }
.n26-row:active { background: #f3f3f3; }
/* 左の細い線のアイコン(22px・くすみ色)。TOP だけはアイコン無しで、文字をアイコンの位置から始める */
.n26-ic { flex: 0 0 24px; width: 24px; height: 24px; margin-right: 16px; color: #6f6862; display: inline-flex; align-items: center; justify-content: center; }
.n26-ic svg { width: 22px; height: 22px; display: block; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.n26-ic svg text { fill: currentColor; stroke: none; font: 700 7.5px "Hiragino Sans", "Noto Sans JP", sans-serif; letter-spacing: 0; }
.n26-lb { flex: 1 1 auto; }
/* 右の矢印: 直接移動する行は右向き(›)、その場で下層が開く行(診療メニュー)だけ下向き(∨) */
.n26-ar { flex: 0 0 auto; width: 8px; height: 8px; margin-left: 12px; border-right: 1.5px solid #7a7571; border-bottom: 1.5px solid #7a7571; transform: rotate(-45deg); }
.n26-acc-btn .n26-ar { transform: rotate(45deg); margin-top: -4px; }
.n26-acc-btn[aria-expanded="true"] .n26-ar { transform: rotate(-135deg); margin-top: 4px; }

/* ---- 下層(診療メニュー)。行は少し詰め、左に小さな ▸ ---- */
.n26-sub[hidden] { display: none; }
.n26-sub { background: #fff; border-top: 1px solid #e3e3e3; }
.n26-sub .n26-row { min-height: 48px; padding-left: 22px; font-size: 14.5px; letter-spacing: .06em; }
.n26-sub .n26-row::before { content: ""; flex: 0 0 auto; width: 0; height: 0; margin-right: 12px; border-style: solid; border-width: 4px 0 4px 5px; border-color: transparent transparent transparent #8a847e; }
.n26-sub .n26-row:active { background: #f3f3f3; }
.n26-sub > ul > li { border-top: 1px solid #ececec; }
.n26-sub > ul > li:first-child { border-top: 0; }
/* 下層カテゴリの帯(濃いグレー) */
.n26-cat { margin: 0; padding: 0 22px; height: 36px; display: flex; align-items: center; background: #5f5c59; color: #fff; font-size: 12.5px; letter-spacing: .14em; }

/* ---- 画面下の固定ボタン(料金表／LINEで相談・予約=LINEの緑・/reserve/ へ)。通常表示でも展開時でも同じ位置 ---- */
.n26-fix { position: fixed; left: 0; right: 0; bottom: 0; z-index: 31; display: grid; grid-template-columns: 1fr 2.1fr; gap: 10px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .97); border-top: 1px solid #e3e3e3; }
.n26-fix a { display: flex; align-items: center; justify-content: center; min-height: 50px; border-radius: 6px; font-size: 14.5px; font-weight: 600; letter-spacing: .04em; text-decoration: none; white-space: nowrap; }
.n26-fix .n26-fix-price { color: #2c2927; background: #fff; border: 1px solid #2c2927; }
.n26-fix .n26-fix-line { color: #fff; background: #06c755; }
.n26-fix .n26-fix-line::before { content: "LINE"; font-size: 10.5px; font-weight: 700; border: 1.5px solid #fff; border-radius: 999px; padding: 1px 7px; margin-right: 8px; font-family: "Hiragino Sans", "Noto Sans JP", sans-serif; }
