/* ============================================================
   おおかみ美容のクリニック - サイト共通スタイル
   実サイト(sanyokai-clinic.com/beauty/)の「スカイブルーの背景」
   「白いヘッダー」「ゴールドの線装飾」「グリーンの相談ボタン／
   ネイビーのWEB予約ボタン」という雰囲気を参考にしつつ、ロゴや写真は
   実サイトのものをそのまま複製せず独自に作成しています。
   医療広告ガイドラインに配慮し、誇張的な演出(点滅・カウントダウン・
   赤字の割引訴求など)は使わない落ち着いたトーンにしています。
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@500;600;700&family=Noto+Sans+JP:wght@400;500;700&display=swap');

:root{
  --ink:#233241;
  --sub:#5c6c7c;
  --line:#d7e6f0;
  --bg:#eaf5fb;
  --bg-deep:#cfe9f6;
  --panel:#ffffff;
  --panel-alt:#eef7fb;

  --navy:#123a5e;          /* WEB予約ボタン・見出しリンク等の濃色 */
  --navy-deep:#0b2740;
  --sky:#4d9bd6;           /* メインのスカイブルー */
  --sky-soft:#e2f1fa;      /* 淡いブルー背景 */

  --gold:#b8863f;          /* 装飾ラインや強調テキストのゴールド */
  --wine:#7c2c34;          /* 見出しの差し色（ワインレッド） */
  --line-green:#06c26b;    /* LINE相談ボタン風のグリーン */
  --line-green-deep:#039456;

  --notice-bg:#eef6fb;
  --notice-line:#bcdcf0;
  --risk-bg:#f2f8fb;

  --radius:16px;
  --radius-sm:8px;
  --maxw:1060px;
  --shadow:0 10px 30px -14px rgba(18,58,94,.22);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.9;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:var(--navy);text-decoration:none;}
a:hover{text-decoration:underline;}

h1,h2,h3,h4{
  font-family:"Shippori Mincho","Noto Sans JP",serif;
  font-weight:600;
  letter-spacing:.03em;
}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}

/* ---------- Header ---------- */
header.site-header{
  background:#ffffff;
  border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:50;
}
.header-inner{
  max-width:var(--maxw);margin:0 auto;padding:12px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;}
.brand:hover{text-decoration:none;}
.brand-logo{height:46px;width:auto;display:block;}
/* ヘッダーがposition:stickyのため、アンカーリンク着地時に見出しが隠れないよう全セクションにオフセットを付与 */
section[id]{scroll-margin-top:165px;}
@media (max-width:640px){
  section[id]{scroll-margin-top:140px;}
}
.gnav-checkbox{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
/* ヘッダー右上のハンバーガー「MENU」ボタンで開閉するドロップダウン形式のナビ */
nav.gnav{position:relative;margin-left:auto;display:flex;align-items:center;gap:16px;}
nav.gnav .gnav-quicklink{
  color:var(--navy);font-size:.8rem;font-weight:700;white-space:nowrap;
}
nav.gnav .gnav-quicklink:hover{text-decoration:underline;}
nav.gnav .gnav-summary{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  padding:4px 6px;cursor:pointer;color:var(--navy);
  -webkit-tap-highlight-color:transparent;
}
nav.gnav .gnav-hamburger{display:flex;flex-direction:column;justify-content:center;gap:4px;width:22px;height:16px;}
nav.gnav .gnav-hamburger span{
  display:block;height:2px;width:100%;background:var(--navy);border-radius:1px;
  transition:transform .2s ease, opacity .2s ease;
}
nav.gnav .gnav-checkbox:checked ~ .gnav-summary .gnav-hamburger span:nth-child(1){transform:translateY(6px) rotate(45deg);}
nav.gnav .gnav-checkbox:checked ~ .gnav-summary .gnav-hamburger span:nth-child(2){opacity:0;}
nav.gnav .gnav-checkbox:checked ~ .gnav-summary .gnav-hamburger span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
nav.gnav .gnav-label{font-size:.62rem;font-weight:700;letter-spacing:.06em;line-height:1;}
nav.gnav ul{
  display:none;list-style:none;flex-direction:column;gap:8px;
  position:absolute;top:100%;right:0;margin:10px 0 0;padding:12px;
  min-width:210px;max-width:min(280px,90vw);
  background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 16px 32px -10px rgba(20,20,20,.2);
  z-index:60;
}
nav.gnav .gnav-checkbox:checked ~ ul{display:flex;}
nav.gnav li{line-height:1.4;}
nav.gnav ul a{
  display:block;color:var(--navy);font-size:.85rem;line-height:1.4;
  padding:10px 16px;text-align:center;
  background:#fff;border:2px solid var(--navy);border-radius:8px;
}
nav.gnav ul a:hover{background:var(--navy);color:#fff;text-decoration:none;}

/* ヘッダーのボタンは全画面幅で常に「横1列」に統一 */
.header-buttons{
  display:flex;align-items:stretch;gap:10px;flex-wrap:nowrap;
  width:100%;flex-basis:100%;
}
.btn-line{
  flex:1 1 0;min-width:0;
  display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  padding:8px 8px;border-radius:999px;white-space:nowrap;
  border:1px solid transparent;
  background:var(--line-green);color:#fff;
  box-shadow:0 6px 14px -6px rgba(6,194,107,.55);
}
.btn-line:hover{background:var(--line-green-deep);text-decoration:none;}
.btn-loc{
  background:#fff;color:var(--line-green-deep);
  font-size:clamp(.6rem,1.5vw,.74rem);font-weight:700;
  padding:2px 12px;border-radius:999px;line-height:1.5;
}
.btn-cta{
  display:inline-flex;align-items:center;gap:5px;
  font-size:clamp(.6rem,1.6vw,.8rem);font-weight:700;line-height:1.4;
}
.btn-line svg{width:15px;height:15px;flex:none;}
.cta-short{display:none;}

/* ボタンが3つ(新宿院/横浜院/立川院)になったため、狭い画面では文言を短縮して1行を維持する */
@media (max-width:720px){
  .cta-full{display:none;}
  .cta-short{display:inline;}
}
@media (max-width:520px){
  .btn-line svg{display:none;}
  .btn-line{padding:7px 4px;gap:3px;}
}
@media (max-width:370px){
  .btn-cta{font-size:.6rem;}
  .btn-loc{font-size:.56rem;padding:2px 9px;}
}

/* ---------- Hero ---------- */
.hero{
  position:relative;overflow:hidden;
  padding:0 0 40px;
  background:linear-gradient(180deg,var(--sky-soft) 0%, var(--bg) 55%, var(--bg) 100%);
}
.hero-visual{
  position:relative;overflow:hidden;
  padding:56px 0 96px;
  /* 画面が横に広いほど背景が縦に切れるため、最低高さを幅に連動させて
     壁面ロゴ全体が入るようにする（狭い画面では自然な高さのまま） */
  min-height:min(34vw, 900px);
  background:
    linear-gradient(160deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.42) 45%, rgba(255,255,255,.66) 100%),
    url('hero-bg.jpg') 90% 40% / cover no-repeat;
  clip-path:none;
}
.hero-visual::before,
.hero-visual::after{
  content:"";position:absolute;border:1px solid rgba(184,134,63,.45);
}
.hero-visual::before{width:340px;height:340px;right:-90px;top:-90px;transform:rotate(18deg);}
.hero-visual::after{width:220px;height:220px;left:-60px;bottom:-70px;transform:rotate(-12deg);}
.hero-hex{
  display:none;
}
.hero-visual .wrap{position:relative;z-index:2;}
.hero .eyebrow{
  display:inline-block;font-size:.74rem;letter-spacing:.18em;color:var(--wine);
  background:rgba(255,255,255,.7);padding:5px 12px;border-radius:999px;margin-bottom:20px;
}
.hero h1{
  font-size:1.9rem;line-height:1.7;margin:0 0 18px;color:var(--wine);
  max-width:560px;
}
.hero p.lead{color:#4d4436;font-size:.96rem;max-width:520px;background:rgba(255,255,255,.55);
  padding:12px 16px;border-radius:10px;}

/* badge row (frame-corner cards) */
.badge-row{
  position:relative;z-index:3;margin-top:-64px;
  display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:520px;
}
.badge-card{
  background:#fffdf8;border:1px solid rgba(184,134,63,.5);border-radius:6px;
  padding:18px 14px;text-align:center;position:relative;
}
.badge-card::before,.badge-card::after{
  content:"";position:absolute;width:14px;height:14px;border:2px solid var(--gold);
}
.badge-card::before{top:-2px;left:-2px;border-right:none;border-bottom:none;}
.badge-card::after{bottom:-2px;right:-2px;border-left:none;border-top:none;}
.badge-card strong{display:block;font-family:"Shippori Mincho",serif;color:var(--gold);font-size:1.15rem;margin-top:2px;}
.badge-card span.label{font-size:.86rem;color:#5c4f3c;}

.hero-note{
  margin:28px 0 0;font-size:.82rem;color:var(--sub);
  border-left:3px solid var(--sky);padding:2px 0 2px 12px;max-width:640px;
}

/* greeting card */
.greeting{padding:52px 0 40px;}
.greeting-card{
  background:var(--panel);border-radius:var(--radius);box-shadow:var(--shadow);
  max-width:620px;margin:0 auto 26px;padding:14px;display:flex;align-items:center;justify-content:center;
}
.parts-diagram{width:100%;max-width:520px;height:auto;display:block;margin:14px auto;border-radius:var(--radius-sm);box-shadow:var(--shadow);}
.greeting-logo{width:100%;max-width:260px;height:auto;}
.greeting-photo{width:100%;height:auto;border-radius:calc(var(--radius) - 6px);display:block;}
.greeting h2{text-align:center;font-size:1.3rem;color:var(--navy);margin:0 0 16px;}
.greeting p{text-align:center;color:var(--sub);max-width:620px;margin:0 auto 14px;font-size:.94rem;}
.greeting p.greeting-sign{
  text-align:center;color:var(--ink);font-weight:700;font-size:.92rem;
  font-family:"Shippori Mincho",serif;margin-top:18px;
}
.greeting p.greeting-sign span{display:inline-block;white-space:nowrap;margin:0 .5em;}

/* ---------- Section ---------- */
section{padding:56px 0;position:relative;}
section.alt{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
/* 施術メニュー・各施術詳細・料金一覧のセクションは、白／薄青の交互配置をやめて常に白背景に統一 */
section.menu-section{background:var(--panel);border-top:1px solid var(--line);border-bottom:none;}
.sec-eyebrow{font-size:.76rem;letter-spacing:.16em;color:var(--gold);margin:0 0 6px;}
h2.sec-title{font-size:1.5rem;margin:0 0 8px;color:var(--navy);}
h2.sec-title .title-sub{
  display:block;font-family:"Noto Sans JP",sans-serif;font-weight:500;
  font-size:.88rem;color:var(--sub);margin-top:6px;
}
h2.sec-title + .menu-grid{margin-top:28px;}
p.sec-desc{color:var(--sub);margin:0 0 32px;font-size:.94rem;max-width:680px;}

/* ---------- Menu cards ---------- */
.menu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;}
.menu-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 24px;position:relative;overflow:hidden;
  box-shadow:var(--shadow);
  transition:transform .18s ease, box-shadow .18s ease;
}
.menu-card:hover{transform:translateY(-3px);box-shadow:0 16px 34px -16px rgba(18,58,94,.28);}
.menu-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--sky),var(--navy));
}
.card-icon{
  width:42px;height:42px;border-radius:50%;background:var(--sky-soft);
  display:flex;align-items:center;justify-content:center;margin-bottom:14px;
  color:var(--navy);
}
.card-icon svg{width:22px;height:22px;}
.menu-card h3{margin:0 0 14px;font-size:1.08rem;}
.menu-card p{margin:0 0 14px;color:var(--sub);font-size:.9rem;}
.menu-card a.more{font-size:.85rem;font-weight:700;color:var(--navy);}

/* ---------- 院ごとのメニュー切り替えタブ ---------- */
.clinic-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 4px;}
.clinic-tab{
  appearance:none;border:none;cursor:pointer;
  font-family:"Noto Sans JP",sans-serif;font-weight:700;font-size:.85rem;
  padding:10px 20px;border-radius:10px 10px 0 0;
  background:#eef4f9;color:var(--sub);
  transition:background .15s ease,color .15s ease;
}
.clinic-tab[data-clinic="s"]{background:#e4f0fa;color:var(--sky);}
.clinic-tab[data-clinic="y"]{background:#e7f7ec;color:#2ea24c;}
.clinic-tab[data-clinic="t"]{background:#fbf1e2;color:var(--gold);}
.clinic-tab.active[data-clinic="s"]{background:var(--sky);color:#fff;}
.clinic-tab.active[data-clinic="y"]{background:#2ea24c;color:#fff;}
.clinic-tab.active[data-clinic="t"]{background:var(--gold);color:#fff;}
.clinic-tab-note{font-size:.8rem;color:var(--sub);margin:0 0 22px;}
.price-note-banner{
  padding:0;margin:-8px 0 26px;font-size:.9rem;color:var(--ink);line-height:1.85;
}
.price-note-banner .price-list-link{
  display:inline-block;font-weight:700;color:#fff;background:var(--navy);
  padding:2px 12px;border-radius:20px;margin:0 2px;text-decoration:none;
}
.price-note-banner .price-list-link:hover{background:var(--sky);}
.price-block{margin:0;}
@media (max-width:480px){
  .clinic-tab{flex:1 1 auto;text-align:center;padding:9px 8px;font-size:.78rem;}
}

/* ---------- 院切り替え：ラジオボタン＋labelによるCSSのみでの出し分け ----------
   JavaScriptが実行されない環境（一部のファイルプレビュー等）でも動作するよう、
   非表示のラジオボタン（#clinic-s / #clinic-y / #clinic-t）と、見た目上のタブ（labelタグ）
   を組み合わせ、:has() で表示・配色を切り替える。JSはあくまで補助（古いブラウザ向けの保険）。 */
.clinic-switch{position:fixed;top:0;left:0;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

[data-clinics]{display:none;}
body:has(#clinic-s:checked) [data-clinics~="s"]{display:revert;}
body:has(#clinic-y:checked) [data-clinics~="y"]{display:revert;}
body:has(#clinic-t:checked) [data-clinics~="t"]{display:revert;}

body:has(#clinic-s:checked) .clinic-tab[data-clinic="s"]{background:var(--sky);color:#fff;}
body:has(#clinic-y:checked) .clinic-tab[data-clinic="y"]{background:#2ea24c;color:#fff;}
body:has(#clinic-t:checked) .clinic-tab[data-clinic="t"]{background:var(--gold);color:#fff;}

/* 選択中の院タブに合わせて、施術カード・各施術セクション・料金表の配色を切り替える
   新宿=青（既定のスカイブルー）／横浜=緑／立川=茶色
   .menu-section は MENU・各施術詳細・料金一覧の各セクションに付与している共通クラス
   body.clinic-y / body.clinic-t は古いブラウザ向けのJSフォールバック用クラス */
body.clinic-y .menu-card::before, body:has(#clinic-y:checked) .menu-card::before{background:linear-gradient(90deg,#4ecb7a,#1f7a37);}
body.clinic-t .menu-card::before, body:has(#clinic-t:checked) .menu-card::before{background:linear-gradient(90deg,#d9ac5f,#8a6429);}
body.clinic-y .card-icon, body:has(#clinic-y:checked) .card-icon{background:#e7f7ec;color:#1f7a37;}
body.clinic-t .card-icon, body:has(#clinic-t:checked) .card-icon{background:#fbf1e2;color:#8a6429;}

body.clinic-y .menu-section .sec-title, body:has(#clinic-y:checked) .menu-section .sec-title{color:#1f7a37;}
body.clinic-t .menu-section .sec-title, body:has(#clinic-t:checked) .menu-section .sec-title{color:#8a6429;}

body.clinic-y .menu-section table.price-table th, body:has(#clinic-y:checked) .menu-section table.price-table th{background:#dcf3e2;color:#1f7a37;}
body.clinic-t .menu-section table.price-table th, body:has(#clinic-t:checked) .menu-section table.price-table th{background:#f5e6cc;color:#8a6429;}

body.clinic-y .menu-section .disclosure, body:has(#clinic-y:checked) .menu-section .disclosure{background:#e9f7ee;}
body.clinic-t .menu-section .disclosure, body:has(#clinic-t:checked) .menu-section .disclosure{background:#faf2e3;}

/* ---------- Price table ---------- */
table.price-table{width:100%;border-collapse:collapse;margin:14px 0 30px;font-size:.92rem;
  background:var(--panel);border-radius:var(--radius-sm);overflow:hidden;}
table.price-table caption{
  text-align:left;font-weight:700;font-size:1.02rem;margin-bottom:10px;color:var(--navy);
  font-family:"Shippori Mincho",serif;
}
table.price-table caption .cap-sub{
  display:block;font-family:"Noto Sans JP",sans-serif;font-weight:400;
  font-size:.82rem;color:var(--sub);margin-top:3px;
}
table.price-table th,table.price-table td{
  border-bottom:1px solid var(--line);padding:10px 12px;text-align:left;
}
table.price-table th{background:var(--sky-soft);font-weight:700;font-size:.85rem;color:var(--navy);}
table.price-table tr:hover td{background:#f3fafd;}
table.price-table th:last-child,
table.price-table td:last-child{text-align:right;}
table.price-table td.price{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600;text-align:right;}

/* スマホでは3列表（メニュー／内容／費用）を読みやすく圧縮 */
@media (max-width:560px){
  table.price-table{font-size:.8rem;}
  table.price-table th,table.price-table td{padding:8px 7px;}
  table.price-table th{font-size:.74rem;}
  .disclosure table.price-table td:nth-child(2){font-size:.74rem;color:var(--sub);}
}

/* ---------- Disclosure / risk boxes (限定解除要件対応) ---------- */
.disclosure{
  background:var(--risk-bg);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 22px;margin:18px 0 30px;
}
.disclosure h4{margin:0 0 12px;font-size:.98rem;color:var(--ink);}
.disclosure dl{margin:0;}
.disclosure dt{font-weight:700;font-size:.85rem;margin-top:12px;color:var(--navy);}
.disclosure dt:first-child{margin-top:0;}
.disclosure dd{margin:4px 0 0;font-size:.87rem;color:var(--ink);}
.disclosure dd ul{margin:8px 0 0;padding-left:1.2em;}
.disclosure dd li{margin:3px 0;}
.disclosure .placeholder{color:#a15c2c;background:#fff4e8;padding:1px 6px;border-radius:4px;}

.disclosure-detail{margin:0;}
.disclosure-detail dt{font-weight:700;font-size:.85rem;margin-top:14px;color:var(--navy);}
.disclosure-detail dt:first-child{margin-top:0;}
.disclosure-detail dd{margin:4px 0 0;font-size:.87rem;color:var(--ink);line-height:1.85;}

/* ---------- FAQ アコーディオン ---------- */
.faq-list{margin:18px 0 30px;display:flex;flex-direction:column;gap:14px;}
.faq-item{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden;
}
.faq-item summary{
  display:flex;align-items:center;gap:16px;padding:20px 24px;cursor:pointer;
  list-style:none;font-weight:700;font-size:.96rem;color:var(--ink);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::marker{content:"";}
.faq-item summary:focus-visible{outline:2px solid var(--sky);outline-offset:-2px;}
.faq-q{
  flex:none;width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:.82rem;font-weight:700;
  font-family:"Shippori Mincho","Noto Sans JP",serif;
}
.faq-q-text{flex:1 1 auto;}
.faq-toggle{
  flex:none;position:relative;width:20px;height:20px;transition:transform .2s ease;
}
.faq-toggle::before,.faq-toggle::after{
  content:"";position:absolute;background:var(--sky);border-radius:2px;
}
.faq-toggle::before{top:2px;left:9px;width:2px;height:16px;}
.faq-toggle::after{top:9px;left:2px;width:16px;height:2px;}
.faq-item[open] .faq-toggle{transform:rotate(45deg);}
.faq-item[open] summary{border-bottom:1px solid var(--line);}
.faq-answer{padding:16px 24px 22px 68px;font-size:.87rem;color:var(--ink);line-height:1.85;}
@media (max-width:520px){
  .faq-item summary{padding:16px 18px;gap:12px;}
  .faq-answer{padding:14px 18px 18px 18px;}
}

/* ---------- Notice box (未承認医薬品等) ---------- */
.notice-box{
  background:var(--notice-bg);border:1px solid var(--notice-line);border-radius:var(--radius);
  padding:20px 22px;margin:22px 0;font-size:.87rem;
}
.notice-box h4{margin:0 0 8px;font-size:.94rem;color:var(--navy);}
.notice-box ol{margin:0;padding-left:1.2em;}
.notice-box li{margin:5px 0;}

/* ---------- アクセス ---------- */
.access-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;margin-top:28px;}
.access-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:24px 22px;box-shadow:var(--shadow);
}
.access-card h3{margin:0 0 10px;font-size:1.05rem;color:var(--navy);}
.access-card address{font-style:normal;color:var(--sub);font-size:.92rem;line-height:1.7;margin:0 0 16px;}
.access-card a.map-link{
  display:inline-flex;align-items:center;gap:6px;
  font-size:.85rem;font-weight:700;color:var(--navy);
}
.access-card a.map-link svg{width:16px;height:16px;flex:none;}
.access-hours{margin-top:26px;font-size:.92rem;color:var(--sub);}
.access-hours strong{color:var(--navy);}

/* ---------- Contact：各院LINEボタン（ヘッダーのボタンを複製） ---------- */
.contact-line-buttons{display:flex;gap:14px;flex-wrap:wrap;margin:24px 0 28px;}
.contact-line-buttons .btn-line{flex:1 1 200px;padding:14px 12px;}

/* ---------- 別ページへのリンク（キャンセルポリシー等） ---------- */
.policy-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:22px;}
.policy-link{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--panel);border:1px solid var(--sky);border-radius:999px;
  padding:14px 22px;color:var(--navy);font-weight:700;font-size:.92rem;
}
.policy-link:hover{background:var(--sky-soft);text-decoration:none;}
.policy-link span{flex:none;}

/* ---------- サブページ ---------- */
.subpage{padding:44px 0 64px;}
.subpage .crumb{font-size:.82rem;color:var(--sub);margin:0 0 18px;}
.subpage .crumb a{color:var(--navy);}
.subpage .back-row{margin-top:30px;}
.back-link{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--panel);border:1px solid var(--sky);border-radius:999px;
  padding:12px 24px;color:var(--navy);font-weight:700;font-size:.92rem;
}
.back-link:hover{background:var(--sky-soft);text-decoration:none;}

/* ---------- Footer ---------- */
footer{padding:44px 0;border-top:1px solid var(--line);background:var(--panel);}
footer .flinks{display:flex;gap:18px;flex-wrap:wrap;font-size:.82rem;margin-bottom:14px;}
footer .fnote{font-size:.76rem;color:var(--sub);line-height:1.9;}

/* ---------- Breadcrumb ---------- */
.crumb{font-size:.78rem;color:var(--sub);padding:16px 0 0;}

/* ---------- Change-log callout used on rewritten pages ---------- */
.changelog{
  background:#eef4ef;border:1px solid #cfe3d2;border-radius:var(--radius);
  padding:16px 20px;margin:0 0 30px;font-size:.84rem;
}
.changelog summary{cursor:pointer;font-weight:700;color:#3f6b4a;}
.changelog ul{margin:10px 0 0;padding-left:1.2em;}
.changelog li{margin:4px 0;}

@media (max-width:640px){
  .hero h1{font-size:1.5rem;}
  .header-inner{padding:10px 16px;gap:10px;}
  .brand-logo{height:38px;}
  .badge-row{grid-template-columns:repeat(2,1fr);max-width:100%;}
}