/* koso-home.css — 元気酵素風呂トップ(/)専用CSS（左固定サイドバー＋縦書きヒーローのレイアウト）。
   旧名 koso-v2.css。第39回で /v2/ をトップに採用（竜一決定）。クラス名は .v2- の名前空間を継続使用（機能名なので維持）。
   中身は本物コンテンツ（R-3準拠・NG効能コピー不使用）。下層ページの site.css/jp.css とは独立。 */

:root{
  --g:#6A7B66;        /* セージグリーン（統合ブランド brand_primary／主役色） */
  --g-d:#3E4A3C;      /* 深いセージ（フッター下帯） */
  --g-h:#7C8D78;      /* 明るいセージ（ホバー） */
  --cream:#FBF8EF;    /* 左サイドバー */
  --ink:#2b2b2b;
  --tan:#AD7E50;      /* アプリコットベージュ系（「お悩み」帯の地色／brand_secondary系） */
  --line:#e4ddcf;     /* 境界線 */
  --side:190px;       /* サイドバー幅 */
}
.v2, .v2 *{ box-sizing:border-box; }
.v2{ margin:0; padding:0; color:var(--ink); background:#fff;
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif; line-height:1.8; }
.v2 img{ display:block; max-width:100%; }
.v2 a{ color:inherit; }

/* ===== 左固定サイドバー（ロゴ＋縦メニュー） ===== */
.v2-side{ position:fixed; top:0; left:0; width:var(--side); height:100vh; background:var(--cream);
  display:flex; flex-direction:column; align-items:center; padding:30px 14px; z-index:40; border-right:1px solid var(--line); }
.v2-logo{ font-family:"Noto Serif JP",serif; font-weight:600; font-size:1.2rem; line-height:1.55;
  text-align:center; text-decoration:none; color:var(--ink); letter-spacing:0.06em; }
.v2-logo span{ display:block; }
.v2-side nav{ margin:auto 0; width:100%; }
.v2-side nav a{ display:block; text-align:center; text-decoration:none; color:var(--ink);
  font-size:0.85rem; padding:11px 0; letter-spacing:0.06em; }
.v2-side nav a:hover{ color:var(--g); }

/* ===== 右上 縦アクションボタン ===== */
.v2-actions{ position:fixed; top:0; right:0; z-index:41; display:flex; }
.v2-actions a{ width:66px; min-height:74px; background:var(--g); color:#fff; text-decoration:none;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
  font-size:0.68rem; letter-spacing:0.04em; border-left:1px solid rgba(255,255,255,.18); }
.v2-actions a:hover{ background:var(--g-h); }
.v2-actions .ic{ font-size:1.15rem; line-height:1; }

/* ===== メイン（サイドバー分の余白） ===== */
.v2-main{ margin-left:var(--side); }

/* ===== ヒーロー（暗い背景＋縦書き見出し） ===== */
.v2-hero{ position:relative; height:90vh; max-height:760px; min-height:520px; overflow:hidden; background:#111; }
.v2-hero img{ width:100%; height:100%; object-fit:cover; opacity:.62; }
.v2-hero .copy{ position:absolute; inset:0; display:flex; align-items:center; justify-content:flex-end; padding-right:9%; }
.v2-vtitle{ writing-mode:vertical-rl; font-family:"Noto Serif JP",serif; font-weight:600; color:#fff;
  font-size:2.6rem; letter-spacing:0.28em; line-height:1.55; text-shadow:0 2px 16px rgba(0,0,0,.6); margin:0; }
.v2-vsub{ writing-mode:vertical-rl; color:#fff; font-size:1rem; letter-spacing:0.34em; margin:0 22px 0 0;
  align-self:center; text-shadow:0 1px 8px rgba(0,0,0,.7); }

/* ===== 見出し（英字＋和文・中央） ===== */
.v2-head{ text-align:center; margin:0 0 28px; }
.v2-head .en{ display:block; font-family:"Cormorant Garamond",serif; /* css-lint: latin-only */
  color:var(--g); letter-spacing:0.2em; font-size:1.1rem; }
.v2-head .ja{ display:block; font-family:"Noto Serif JP",serif; font-weight:600; color:var(--ink);
  font-size:1.65rem; letter-spacing:0.08em; margin-top:6px; }
.v2-vhead{ writing-mode:vertical-rl; margin:0 auto 24px; font-family:"Noto Serif JP",serif; font-weight:600;
  font-size:1.5rem; letter-spacing:0.18em; line-height:1.7; color:var(--ink); height:9em; }

/* ===== セクション共通 ===== */
.v2-sec{ padding:64px 28px; }
.v2-sec .in{ max-width:1000px; margin:0 auto; }
.v2-sec p{ line-height:1.95; margin:0 0 14px; }
.v2-tan{ background:var(--tan); color:#fff; }
.v2-tan .v2-head .en{ color:#fff; }
.v2-tan .v2-head .ja{ color:#fff; }
.v2-gray{ background:#f4f1ea; }

/* 画像×テキストの2カラム（左画像・右文／交互） */
.v2-split{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
.v2-split.rev .v2-figcol{ order:2; }
.v2-figcol img{ width:100%; height:380px; object-fit:cover; border-radius:6px; box-shadow:0 8px 28px rgba(0,0,0,.08); }
.v2-lead{ font-family:"Noto Serif JP",serif; font-size:1.4rem; line-height:1.7; margin:0 0 16px; color:var(--ink); }

/* クイック情報バー（padding:0 は ul 既定の左インデント除去＝枠内のズレ防止） */
.v2-facts{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--line); padding:0; }
.v2-facts li{ list-style:none; padding:18px 14px; text-align:center; border-right:1px solid var(--line); }
.v2-facts li:last-child{ border-right:0; }
.v2-facts strong{ display:block; color:var(--g); font-size:1.02rem; }
.v2-facts span{ display:block; font-size:0.8rem; color:#6b6b6b; margin-top:4px; }

/* カード3枚（白カード＋緑タイトル帯）
   padding:0 は ul 既定の左インデント(40px)を消す＝モバイル単列でカードが右にズレる不具合の修正 */
.v2-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; padding:0; }
.v2-card{ list-style:none; background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:4px; overflow:hidden;
  box-shadow:0 6px 20px rgba(0,0,0,.05); }
.v2-card img{ width:100%; height:170px; object-fit:cover; }
.v2-card .ttl{ background:var(--g); color:#fff; text-align:center; padding:10px; font-weight:700; font-size:0.95rem; }
.v2-card .bd{ padding:16px; font-size:0.9rem; line-height:1.8; }
.v2-card a{ text-decoration:none; }

/* 店舗情報＋地図 */
.v2-shop{ display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:start; }
.v2-shop img{ width:100%; height:300px; object-fit:cover; border-radius:6px; }
.v2-shop h3{ font-family:"Noto Serif JP",serif; margin:0 0 10px; }
.v2-map iframe{ width:100%; height:320px; border:0; border-radius:6px; }

/* 口コミ */
.v2-reviews{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:8px 0 0; }
.v2-review{ background:#fff; border:1px solid var(--line); border-radius:6px; padding:18px; }
.v2-review .nm{ font-weight:700; font-size:0.9rem; margin:0 0 8px; }
.v2-review .nm span{ display:block; font-weight:400; font-size:0.72rem; color:#8a8a8a; }
.v2-review .bd{ font-size:0.9rem; line-height:1.8; margin:0; }
.v2-count{ text-align:center; font-size:1.05rem; }
.v2-count strong{ color:var(--g); font-size:1.5rem; }

/* ボタン */
.v2-btn{ display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:0 34px;
  border:1px solid var(--ink); text-decoration:none; color:var(--ink); border-radius:2px; margin-top:18px; }
.v2-btn:hover{ background:#fff; }
/* 濃い地（タン等）に置く白ボタン。ホバーで白背景になるので文字を濃色へ戻す */
.v2-btn-light{ border-color:#fff; color:#fff; }
.v2-btn-light:hover{ background:#fff; color:var(--ink); }
.v2-center{ text-align:center; }
.v2-fill{ background:var(--g); color:#fff; border-color:var(--g); }
.v2-fill:hover{ background:var(--g-h); }

/* 緑のCTA／フッター */
.v2-green{ background:var(--g); color:#fff; padding:56px 28px; }
.v2-green .in{ max-width:1000px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:40px; }
.v2-green h2{ font-family:"Noto Serif JP",serif; margin:0 0 14px; font-size:1.4rem; }
.v2-green a.line{ display:block; text-align:center; background:#fff; color:var(--g); text-decoration:none;
  border-radius:4px; padding:14px; font-weight:700; margin:0 0 10px; }
.v2-green a.out{ display:block; text-align:center; border:1px solid #fff; color:#fff; text-decoration:none;
  border-radius:4px; padding:14px; margin:0 0 10px; }
.v2-foot{ background:var(--g-d); color:#fff; text-align:center; padding:26px 20px; font-size:0.84rem; line-height:1.9; }
.v2-foot a{ color:#fff; }
.v2-foot nav{ margin:10px 0; }
.v2-foot nav a{ margin:0 10px; text-decoration:none; }

/* 姉妹店 */
.v2-sister{ background:#ECE4D6; text-align:center; padding:56px 28px; }
.v2-sister .figs{ display:grid; grid-template-columns:1fr 1fr; gap:14px; max-width:560px; margin:14px auto 20px; }
.v2-sister .figs img{ width:100%; height:200px; object-fit:cover; border-radius:8px; }

/* 下スクロール矢印 */
.v2-up{ text-align:center; color:var(--g); padding:18px; font-size:1.4rem; }

/* フルブリードのバナー（背景写真＋左に重ねたテキスト。現行トップの糠バナー相当） */
.v2-band{ position:relative; min-height:440px; display:flex; align-items:center; background-size:cover; background-position:center; }
.v2-band::before{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(251,248,239,.95) 0%, rgba(251,248,239,.78) 38%, rgba(251,248,239,0) 74%); }
.v2-band .band-in{ position:relative; max-width:1000px; margin:0 auto; width:100%; padding:48px 28px; }
.v2-band .box{ max-width:460px; }
.v2-band h2{ font-family:"Noto Serif JP",serif; font-weight:600; font-size:1.9rem; letter-spacing:0.08em; color:var(--ink); margin:0 0 14px; }
.v2-band p{ color:var(--ink); line-height:1.95; margin:0 0 18px; }
.v2-band .v2-btn{ margin-top:0; }

/* ===== レスポンシブ（サイドバー→上部バー、2カラム→1カラム） ===== */
@media (max-width:820px){
  :root{ --side:0px; }
  .v2-side{ position:static; width:100%; height:auto; flex-direction:row; justify-content:space-between;
    align-items:center; padding:8px 14px; border-right:0; border-bottom:1px solid var(--line); flex-wrap:wrap; }
  .v2-logo{ font-size:0.95rem; line-height:1.3; }
  .v2-logo span{ display:inline; }
  .v2-logo span + span{ margin-left:0.2em; }
  .v2-side nav{ margin:6px 0 0; width:100%; display:flex; flex-wrap:wrap; justify-content:center; gap:0 2px; }
  .v2-side nav a{ padding:4px 7px; font-size:0.76rem; }
  .v2-main{ margin-left:0; }
  .v2-actions{ position:static; display:flex; }
  .v2-actions a{ flex:1; min-height:48px; font-size:0.66rem; }
  .v2-hero{ height:70vh; min-height:420px; }
  .v2-vtitle{ font-size:1.9rem; }
  .v2-split, .v2-shop, .v2-cards, .v2-reviews, .v2-green .in{ grid-template-columns:1fr; gap:22px; }
  .v2-figcol img{ height:240px; }
  .v2-shop img{ height:210px; }
  .v2-band{ min-height:360px; }
  .v2-band::before{ background:linear-gradient(180deg, rgba(251,248,239,.92), rgba(251,248,239,.82)); }
  .v2-band .box{ max-width:none; text-align:center; }
  /* モバイルは分割セクションの本文も中央寄せにして見出しと揃える（センターずれ解消） */
  .v2-split > div:not(.v2-figcol){ text-align:center; }
  .v2-split.rev .v2-figcol{ order:0; }
  .v2-facts{ grid-template-columns:1fr 1fr; }
  .v2-facts li:nth-child(2){ border-right:0; }
}