/* blog.css — news.html の<style>をそのまま抽出（ページ単位で分離） */

/* ==========================================================
   トークン：ASPATHブラウン・ゴールド × SOHGO型のやわらかさ
========================================================== */
:root{
  --ink:       #26383F;
  --brown:     #264653;
  --gold:      #3F6A76;
  --gold-deep: #1E3A44;
  --gold-soft: #E7D9C1;
  --paper:     #F4E9D8;
  --card:      #FFFFFF;
  --sun:       #F4A261;
  --leaf:      #3F6A76;
  --line-green:#06C755;
  --line-dark: #05a648;
  --shadow: 0 6px 20px rgba(38,70,83,.10);
  --radius: 20px;
  --maxw: 1200px;
  --font-head:"Kiwi Maru","Zen Maru Gothic",sans-serif;
  --font-body:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:96px; }
body{
  font-family:var(--font-body); font-size:18px; line-height:1.95;
  color:var(--ink); background:var(--paper); -webkit-text-size-adjust:100%;
  overflow-x:hidden;
}

/* ===== 日本語の折り返し（サイト全体の既定） =====
   word-break:auto-phrase … 文節の切れ目で改行する（「お役／立ち情報」のような分断を防ぐ）
   line-break:strict      … 小さい「っ」「ゃ」や句読点が行頭に来ないようにする
   ※text-wrap:balance は auto-phrase を無効化するため使わない            */
body{ word-break:auto-phrase; line-break:strict; }
.nw{ white-space:nowrap; }   /* 途中で切りたくない語句 */
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--gold-deep); }
a:focus-visible, button:focus-visible, summary:focus-visible{ outline:3px solid var(--sun); outline-offset:3px; border-radius:6px; }
h1,h2,h3{ font-family:var(--font-head); font-weight:500; color:var(--brown); line-height:1.55; }
h2{ font-size:clamp(25px,3.8vw,36px); letter-spacing:.04em; }
h3{ font-size:clamp(19px,2.5vw,23px); }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 20px; position:relative; }

/* ==========================================================
   動き（SOHGO移植）：reveal立ち上がり／浮遊装飾／Ken Burns
========================================================== */
.reveal{ opacity:1; transform:none; transition:none; }
.reveal.on{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.12s; } .reveal.d2{ transition-delay:.24s; } .reveal.d3{ transition-delay:.36s; }

@keyframes floaty{ 0%,100%{ transform:translateY(0) rotate(0deg);} 50%{ transform:translateY(-16px) rotate(4deg);} }
@keyframes floaty2{ 0%,100%{ transform:translateY(0) rotate(0deg);} 50%{ transform:translateY(14px) rotate(-5deg);} }
.float-item{ display:none; }
.float-circle{
  border-radius:50%; display:grid; place-items:center;
  background:#fff; box-shadow:var(--shadow);
}

@keyframes kenburns{ 0%{ transform:scale(1);} 100%{ transform:scale(1.09);} }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none!important; transition:none!important; }
  .reveal{ opacity:1; transform:none; }
  /* ヒーローのスライドショーは体験の核なので、緩やかなクロスフェードのみ例外的に維持 */
  .hero-slide{ transition:opacity 2.2s ease!important; }
}

/* ドット柄（SOHGOのbg_dot移植） */
.dots{
  position:absolute; width:220px; height:160px; z-index:0; pointer-events:none; opacity:.55;
  background-image:radial-gradient(var(--gold-soft) 3.5px, transparent 3.5px);
  background-size:22px 22px;
}

/* ==========================================================
   統一画像システム（v6.4）
   使い方：スロット内に <img src="写真URL" alt="..."> を1行入れるだけ。
   仮置きのイラスト・ラベルは自動で非表示になります。
   サイズ違いへの柔軟対応（スロットの style 属性で指定）：
     --ratio:3/4        … 縦横比を変更（例 1/1, 16/9, 3/4）
     --pos:center 20%   … 切り抜き位置（顔写真は上寄せ推奨）
   クラスで挙動変更：
     fit-contain … 切り抜かず全体を表示（資料・ロゴ向き）
     h-auto      … 比率固定をやめ、画像の高さに追従
     plain       … 枠・背景なし（透過イラスト向き）
========================================================== */
.img-slot{
  position:relative; overflow:hidden; border-radius:26px;
  aspect-ratio:var(--ratio, 4/3);
  background:linear-gradient(160deg,#EBDDC6,#DCCBAA);
  box-shadow:var(--shadow); border:1px solid var(--gold-soft);
}
.img-slot > img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:var(--fit, cover); object-position:var(--pos, 50% 40%);
}
.img-slot.fit-contain{ --fit:contain; background:#fff; }
.img-slot.h-auto{ aspect-ratio:auto; }
.img-slot.h-auto > img{ position:static; height:auto; }
.img-slot.plain{ background:none; border:none; box-shadow:none; }
/* 写真が入ったら仮置き（イラスト・ラベル・文字）を自動非表示 */
.img-slot:has(> img) .fallback,
.img-slot:has(> img) .slot-label,
.img-slot.has-photo .fallback,
.img-slot.has-photo .slot-label{ display:none; }
.img-slot .fallback{ position:absolute; inset:0; display:grid; place-items:center; text-align:center; color:#46666F; font-size:15px; font-weight:700; padding:10px; }
.img-slot.plain .fallback{ position:static; display:block; padding:0; }
.img-slot .slot-label{
  position:absolute; inset:auto 10px 10px auto; z-index:2; background:rgba(255,255,255,.85);
  color:#46666F; font-size:14px; font-weight:700; border-radius:8px; padding:4px 10px;
}

/* ==========================================================
   ヘッダー
========================================================== */
.site-header{
  position:absolute; top:0; left:0; right:0; z-index:100;
  background:rgba(251,247,240,.96); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--gold-soft);
}
.header-in{ max-width:100%; margin:0 auto; padding:12px clamp(20px,4vw,56px); display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.brand{ display:flex; align-items:center; gap:14px; text-decoration:none; min-width:0; margin-right:auto; }
.brand > span{ min-width:0; }
.brand-sub{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.brand-logo{ height:48px; width:auto; padding:0; background:none; box-shadow:none; }
@media (max-width:760px){ .brand-logo{ height:64px; } }
.brand-name{ font-family:var(--font-head); font-weight:600; font-size:25px; letter-spacing:.12em; color:var(--gold-deep); }
.brand-sub{ font-size:14px; color:#46666F; }
.header-right{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.gnav{ display:flex; gap:4px 24px; flex-wrap:wrap; justify-content:flex-end; }
.gnav a{ text-decoration:none; color:var(--brown); font-family:var(--font-head); font-size:24px; padding:8px 2px; border-bottom:3px solid transparent; white-space:nowrap; }
.gnav a:hover{ border-bottom-color:var(--sun); }
.header-sns{ display:flex; align-items:center; gap:9px; }
.header-sns a{ width:36px; height:36px; border-radius:50%; display:grid; place-items:center; color:#fff;
  box-shadow:0 3px 8px rgba(30,45,52,.18); transition:transform .22s ease, box-shadow .22s ease, filter .22s ease; }
.header-sns a:hover{ transform:translateY(-2px); box-shadow:0 6px 14px rgba(30,45,52,.28); filter:saturate(1.08); }
.header-sns a[aria-label="Instagram"]{ background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF); }
.header-sns a[aria-label="YouTube"]{ background:#FF0000; }
.header-sns a[aria-label="Facebook"]{ background:#1877F2; }
.header-sns a[aria-label="公式LINE"]{ background:#06C755; }
.header-cta{ display:flex; align-items:center; gap:10px; }
.hbtn{ font-family:var(--font-head); font-weight:700; font-size:17px; line-height:1; padding:13px 20px; border-radius:999px; text-decoration:none; white-space:nowrap; display:inline-flex; align-items:center; gap:6px; transition:transform .2s, box-shadow .2s, filter .2s; }
.hbtn:hover{ transform:translateY(-2px); box-shadow:0 6px 16px rgba(30,45,52,.22); filter:saturate(1.05); }
.hbtn-reserve{ background:var(--sun); color:#fff; box-shadow:0 4px 12px rgba(244,162,97,.28); }
.hbtn-line{ background:#06C755; color:#fff; }
.hbtn-line .hbtn-ico{ width:18px; height:18px; }
@media (max-width:760px){ .hbtn{ font-size:16px; padding:11px 15px; } .header-cta{ gap:8px; } }

.header-sns a.sns-line-hd{ position:relative; margin-left:6px; }
.header-sns a.sns-line-hd::before{ content:""; position:absolute; left:-9px; top:50%; transform:translateY(-50%);
  width:1px; height:20px; background:var(--gold-soft); }
.header-sns svg{ width:18px; height:18px; }

/* ハンバーガー（モバイルのみ表示） */
.hamburger{ display:none; flex-direction:column; justify-content:center; gap:5px; width:44px; height:44px; padding:0 10px; background:none; border:none; cursor:pointer; }
.hamburger span{ display:block; height:3px; border-radius:3px; background:var(--brown); transition:transform .3s, opacity .3s; }
.hamburger[aria-expanded="true"] span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hamburger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

/* ドロワー */
.drawer-overlay{ position:fixed; inset:0; background:rgba(30,45,52,.5); z-index:300; opacity:0; transition:opacity .3s; }
.drawer-overlay.open{ opacity:1; }
.drawer{ position:fixed; top:0; right:0; bottom:0; width:min(82vw,320px); background:var(--paper); z-index:310; box-shadow:-8px 0 30px rgba(30,45,52,.2); transform:translateX(100%); transition:transform .32s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; padding:20px 22px calc(24px + env(safe-area-inset-bottom)); overflow-y:auto; }
.drawer.open{ transform:translateX(0); }
.drawer-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.drawer-head img{ height:50px; width:auto; }
.drawer-close{ width:44px; height:44px; background:none; border:none; font-size:34px; line-height:1; color:var(--brown); cursor:pointer; }
.drawer-links{ list-style:none; display:grid; gap:2px; margin-bottom:20px; }
.drawer-links a{ display:block; padding:15px 8px; font-family:var(--font-head); font-size:17px; color:var(--brown); text-decoration:none; border-bottom:1px solid var(--gold-soft); }
.drawer-links a:hover{ color:var(--sun); }
.drawer-sns{ display:flex; gap:12px; justify-content:center; margin-bottom:20px; }
.drawer-sns a{ width:44px; height:44px; border-radius:50%; display:grid; place-items:center; color:#fff; }
.drawer-sns a[aria-label="Instagram"]{ background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF); }
.drawer-sns a[aria-label="YouTube"]{ background:#FF0000; }
.drawer-sns a[aria-label="Facebook"]{ background:#1877F2; }
.drawer-sns svg{ width:22px; height:22px; }
.drawer-cta{ width:100%; }
/* ドロワー内のLINEボタンは幅が狭いので、1行に収まるよう文字と余白を調整 */
.drawer-cta.btn.big{ padding:17px 12px; font-size:clamp(15.5px,4vw,17px); gap:8px; white-space:nowrap; }
.drawer-cta .line-ico{ width:20px; height:20px; flex:none; }
body.drawer-open{ overflow:hidden; }
@media (max-width:760px){ .gnav{ gap:4px 18px; } .gnav a{ font-size:18px; } .header-right{ gap:12px; } }
@media (max-width:760px){ .gnav{ order:3; width:100%; justify-content:center; padding-top:8px; border-top:1px solid var(--gold-soft); } }
@media (max-width:760px){ .header-right{ display:none; } .hamburger{ display:flex; margin-left:auto; } .brand{ margin-right:auto; } }

/* ボタン（c-btn01移植：丸ピル＋矢印スライド） */
.btn{
  /* inline-flex にすると、ボタン内の span 要素がひとつずつ独立した塊として扱われ、
     幅の狭い端末で「初回体験／を申し込む／（半額／4,400円）」のように
     文字がバラバラに散る。inline-block なら普通の文章として自然に折り返す。
     ※ここを inline-flex に戻さないこと。 */
  display:inline-block; text-align:center; vertical-align:middle;
  font-family:var(--font-head); font-weight:500; text-decoration:none;
  border-radius:999px; transition:transform .25s, box-shadow .25s, background .25s;
  position:relative;
}
/* inline-block では gap が効かないため、アイコンと矢印の余白は margin で取る */
.btn .line-ico{ vertical-align:-0.32em; margin-right:8px; }
.btn .arw{ display:inline-block; margin-left:10px; transition:transform .25s; }
.btn:hover{ transform:translateY(-3px); }
.btn:hover .arw{ transform:translateX(5px); }
.btn-form{ background:linear-gradient(135deg,var(--sun),#DD8236); color:#fff; box-shadow:0 10px 22px rgba(244,162,97,.35); }
.btn-line{ background:var(--line-green); color:#fff; box-shadow:var(--shadow); }
.btn-primary{ background:var(--sun); color:#fff; box-shadow:var(--shadow); }
.btn-line:hover{ background:var(--line-dark); }
.btn-ghost{ background:#fff; color:var(--brown); border:2px solid var(--gold); }
.btn-ghost:hover{ background:var(--gold-soft); }
.btn.big{ padding:19px 42px; font-size:clamp(17px,2.3vw,21px); }
.btn.mid{ padding:13px 30px; font-size:16px; }
.btn.small{ padding:10px 20px; font-size:15.5px; }
.zero{ background:#fff; color:var(--sun); border-radius:8px; padding:1px 10px; font-size:.85em; font-weight:700; }
.line-ico{ width:1.3em; height:1.3em; flex:none; }

/* ==========================================================
   ヒーロー（v6.2：全サイズでフレックス配置＝衝突しない構造）
========================================================== */
.hero{
  position:relative; overflow:hidden;
  min-height:min(86vh,740px);
  display:flex; align-items:center;
  padding:84px 5% 120px;   /* 下120px＝お知らせカードの専用ゾーン */
}
.hero-slides{ position:absolute; inset:0; z-index:0; }
.hero-slide{
  position:absolute; inset:0; opacity:0; transition:opacity 2.2s ease;
  background-size:cover; background-repeat:no-repeat;
  background-position:var(--pos, center);
}
.hero-slide > img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:var(--pos, center);
}
.hero-slide:has(> img) .kb{ display:none; }  /* 写真使用時は装飾グラデ停止 */
.hero-slide:has(> img) .slot-label{ display:none; }
.hero-slide.on{ opacity:1; }
.hero-slide .kb{ position:absolute; inset:0; background:inherit; }
.hero-slide .slot-label{
  position:absolute; left:14px; top:14px;   /* バッジ（右上）と反対側へ */
  background:rgba(255,255,255,.85); color:#46666F; font-size:14px; font-weight:700;
  border-radius:8px; padding:4px 10px; z-index:2;
}
.hero::after{
  content:""; position:absolute; inset:auto 0 0 0; height:110px; z-index:1;
  background:linear-gradient(to bottom, transparent, var(--paper));
}
.hero-copy-box{
  position:relative; z-index:5;
  max-width:640px;
  background:rgba(251,247,240,.85); backdrop-filter:blur(4px);
  border-radius:26px; padding:32px 36px 28px;
  box-shadow:var(--shadow);
}
.hero-copy-box h1{
  font-size:clamp(29px,4.4vw,48px); font-weight:500; color:var(--brown);
  letter-spacing:.05em; line-height:1.45; margin-bottom:14px;
}
.hero-copy-box h1 .accent{ color:var(--sun); }
.hero-sub{
  display:inline-block; background:#fff; border-radius:12px;
  padding:11px 18px; font-family:"Shippori Mincho B1",serif; font-size:clamp(13px,1.6vw,15.5px); font-weight:600; color:var(--brown);
  margin-bottom:16px; box-shadow:var(--shadow); line-height:1.7;
}
.hero-sub-mark{
  display:inline-block; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff;
  font-family:"Shippori Mincho B1",serif; font-weight:800; font-size:.95em;
  padding:2px 12px; border-radius:6px; letter-spacing:.05em; margin-right:8px; vertical-align:middle;
}
.hero-sub strong{ color:var(--sun); font-weight:800; }
.hero-sub-loc{ font-size:.88em; color:#5E7681; white-space:nowrap; }
.hero-sub-loc::before{ content:"｜"; color:var(--gold-soft); margin:0 2px; }
.hero-cta{ display:flex; flex-direction:column; gap:12px; align-items:flex-start; }
.hero-note{ font-size:14.5px; color:#52707A; }
.hero-news{
  position:absolute; z-index:6; right:20px; bottom:22px;
  background:#fff; border-radius:14px; box-shadow:var(--shadow);
  padding:12px 18px; max-width:min(430px,86vw); text-decoration:none;
}
.hero-news .tag{ background:var(--leaf); color:#fff; border-radius:999px; font-size:14px; padding:2px 12px; font-weight:700; margin-right:10px; }
.hero-news .t{ color:var(--ink); font-size:15px; font-weight:500; }
/* （旧モバイル調整は削除済み → 末尾「レスポンシブ強化v6.1」ブロックに統合） */

/* ==========================================================
   セクション共通＋芯ライン（ASPATH独自シグネチャー維持）
========================================================== */
.spine-page{ position:relative; }
.section{ position:relative; padding:92px 0; }
.sec-head{ text-align:center; margin-bottom:46px; position:relative; z-index:1; }
.sec-node{ width:34px; height:34px; margin:0 auto 12px; display:grid; place-items:center; background:var(--paper); border-radius:50%; box-shadow:0 0 0 8px var(--paper); position:relative; z-index:1; }
.sec-node svg{ width:26px; height:26px; }
.eyebrow{ display:inline-block; font-family:var(--font-head); font-size:15px; letter-spacing:.2em; color:var(--sun); margin-bottom:6px; }
.lede{ margin-top:14px; font-size:16.5px; color:#52707A; max-width:780px; margin-left:auto; margin-right:auto; }
.sec-alt{ background:#F4E9D8; }
.wave{ display:block; width:100%; height:44px; position:absolute; top:-43px; left:0; }
@media (max-width:760px){
  .sec-head{ text-align:center; padding-left:0; }
  .sec-node{ margin:0 auto 12px; }
}

/* メッセージ（home-msg移植：丸画像＋テキスト、浮遊ロゴ） */
.msg-set{ display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:center; position:relative; z-index:1; }
.msg-img{ --ratio:1/1; border-radius:46% 54% 52% 48% / 52% 46% 54% 48%; }
.msg-txt h2{ margin-bottom:18px; }
.msg-txt p{ margin-bottom:14px; }
@media (max-width:760px){ .msg-set{ grid-template-columns:1fr; } .msg-img{ max-width:400px; margin:0 auto; } }

/* 円形サービスカード（home-service-list移植） */
.svc-list{ list-style:none; display:grid; grid-template-columns:repeat(3,1fr); gap:26px; position:relative; z-index:1; }
.svc-item{ text-align:center; background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:30px 22px 26px; border-top:6px solid; }
.svc-item.is-gold{ border-color:var(--gold); } .svc-item.is-leaf{ border-color:var(--leaf); } .svc-item.is-sun{ border-color:var(--sun); }
.svc-circle{ width:150px; --ratio:1/1; margin:0 auto 16px; border-radius:50%; --pos:50% 30%; }
.svc-item h3{ margin-bottom:8px; }
.svc-item p{ font-size:15.5px; text-align:left; }
@media (max-width:760px){ .svc-list{ grid-template-columns:1fr; } }

/* 交互配置セクション（home-service-sec / is-reverse移植） */
.zigzag{ display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center; margin-top:58px; position:relative; z-index:1; }
.zigzag .img-slot{ --ratio:4/3; }
.zigzag.is-reverse .z-img{ order:2; } .zigzag.is-reverse .z-txt{ order:1; }
.zigzag h3{ font-size:clamp(21px,2.8vw,26px); margin-bottom:12px; }
.zigzag .z-tag{ display:inline-block; background:var(--gold); color:#fff; font-family:var(--font-head); font-size:14.5px; border-radius:999px; padding:3px 16px; margin-bottom:10px; }
.zigzag.is-reverse .z-tag{ background:var(--leaf); }
@media (max-width:760px){ .zigzag{ grid-template-columns:1fr; gap:22px; } .zigzag.is-reverse .z-img{ order:0; } }

/* お悩み */
.worry-list{ list-style:none; display:grid; gap:14px; max-width:720px; margin:0 auto; position:relative; z-index:1; }
.worry-list li{
  background:#fff; border:1.5px solid var(--gold-soft); border-radius:16px;
  padding:17px 22px 17px 60px; position:relative; font-weight:700;
  font-size:clamp(15.5px,2vw,18px); color:var(--brown); box-shadow:var(--shadow);
}
.worry-list li::before{
  content:"✔"; position:absolute; left:20px; top:50%; transform:translateY(-50%);
  width:28px; height:28px; border-radius:50%; background:var(--sun); color:#fff;
  display:grid; place-items:center; font-size:15px;
}
.worry-close{ text-align:center; margin-top:36px; font-family:var(--font-head); font-size:clamp(19px,2.9vw,26px); color:var(--brown); position:relative; z-index:1; }
.worry-close b{ color:var(--sun); }
.spot-illust{ width:min(330px,78%); margin:0 auto 10px; position:relative; z-index:1; }
.illust{ width:100%; height:auto; display:block; }
.worry-visual{ width:min(200px,50%); margin:0 auto 24px; position:relative; z-index:1; }
.worry-visual .worry-emblem{ width:150px; height:150px; margin:0 auto; }
.worry-visual .worry-emblem svg{ width:100%; height:100%; }
.worry-visual > img{ position:static; width:100%; height:auto; object-fit:contain; }

/* 芯 */
.shin-hero{ display:grid; grid-template-columns:200px 1fr; gap:34px; align-items:center; background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:38px 34px; position:relative; z-index:1; }
.shin-kanji{ font-family:"Kiwi Maru",serif; font-size:110px; line-height:1; color:var(--gold); text-align:center; }
.shin-kanji small{ display:block; font-size:15px; color:var(--brown); letter-spacing:.3em; margin-top:12px; }
.core-label{ display:inline-block; background:var(--gold); color:#fff; font-family:var(--font-head); font-size:14px; letter-spacing:.06em; padding:3px 14px; border-radius:999px; margin-bottom:4px; }
@media (max-width:760px){ .shin-hero{ grid-template-columns:1fr; text-align:center; } }
.sinpla-steps{ counter-reset:step; list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); gap:16px; margin-top:30px; position:relative; z-index:1; }
.sinpla-steps li{ counter-increment:step; background:#fff; border-radius:16px; box-shadow:var(--shadow); padding:20px 18px 16px; font-size:15.5px; border-top:5px solid var(--gold-soft); }
.sinpla-steps li::before{ content:counter(step); display:inline-grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--leaf); color:#fff; font-family:var(--font-head); margin-bottom:8px; }
.sinpla-steps b{ display:block; color:var(--brown); font-size:16.5px; }
.sinpla-note{ text-align:center; margin-top:26px; font-family:var(--font-head); font-size:clamp(18px,2.5vw,23px); color:var(--brown); position:relative; z-index:1; }

/* エビデンス・カード */
.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; position:relative; z-index:1; }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; position:relative; z-index:1; }
@media (max-width:760px){ .grid-2,.grid-3{ grid-template-columns:1fr; } }
.card{ background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:30px 28px; }
.ev-card h3{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.ev-num{ flex:none; width:36px; height:36px; border-radius:12px; background:var(--gold); color:#fff; display:grid; place-items:center; font-family:var(--font-head); font-size:18px; }
.ev-src{ font-size:14.5px; color:#5E7681; margin-top:14px; }
.ev-point{ background:var(--gold-soft); border-radius:12px; padding:10px 16px; font-weight:700; color:var(--brown); margin-top:14px; }
.more-link{ text-align:center; margin-top:34px; position:relative; z-index:1; }

/* Before/After・声 */
.ba{ display:grid; grid-template-columns:1fr 70px 1fr; gap:16px; align-items:center; margin-top:8px; }
.ba .img-slot{ --ratio:3/4; display:grid; place-items:center; color:#46666F; text-align:center; font-size:15px; font-weight:700; }
.ba-arrow{ text-align:center; font-size:34px; color:var(--sun); }
.ba-caption{ text-align:center; font-weight:700; margin-top:12px; color:var(--brown); }
.ba-caption b{ color:var(--sun); font-size:1.2em; }
@media (max-width:640px){ .ba{ grid-template-columns:1fr; } .ba-arrow{ transform:rotate(90deg); } }
.voices{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px 22px; position:relative; z-index:1; }
.voice{ background:#fff; border-radius:22px; box-shadow:var(--shadow); padding:24px 24px 18px; position:relative; border:1.5px solid var(--gold-soft); }
.voice::after{ content:""; position:absolute; bottom:-14px; left:38px; border:14px solid transparent; border-top-color:#fff; border-bottom:0; }
.voice p{ font-size:16px; }
.voice-meta{ display:flex; align-items:center; gap:10px; margin-top:14px; }
.voice-face{ width:38px; height:38px; border-radius:50%; background:var(--gold-soft); display:grid; place-items:center; font-size:19px; }
.voice-meta cite{ font-style:normal; font-size:15px; color:#5E7681; font-weight:700; }
@media (max-width:760px){ .voices{ grid-template-columns:1fr; } }

/* 料金 */
.trial-card{ max-width:760px; margin:0 auto 34px; background:#fff; border:3px solid var(--sun); border-radius:var(--radius); box-shadow:0 12px 30px rgba(244,162,97,.18); padding:34px 30px; text-align:center; position:relative; z-index:1; }
.trial-card::before{ content:"まずはこれから！"; position:absolute; top:-17px; left:50%; transform:translateX(-50%); background:var(--sun); color:#fff; font-family:var(--font-head); font-size:15px; padding:6px 22px; border-radius:999px; white-space:nowrap; }
.price-plan{ font-family:var(--font-head); font-size:20px; color:var(--brown); }
.trial-price{ display:flex; align-items:baseline; justify-content:center; gap:14px; flex-wrap:wrap; margin:10px 0 4px; }
.trial-price .strike{ text-decoration:line-through; color:#6E888F; font-size:clamp(19px,2.5vw,25px); }
.trial-price .z{ font-family:var(--font-head); color:var(--sun); font-size:clamp(42px,6vw,58px); line-height:1; }
.trial-price .z small{ font-size:.4em; }
.price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:stretch; position:relative; z-index:1; }
.price-card{ background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:34px 26px; text-align:center; border:2px solid transparent; display:flex; flex-direction:column; }
.price-card.recommend{ border-color:var(--sun); position:relative; }
.price-card.recommend::before{ content:"いちばん選ばれています"; position:absolute; top:-16px; left:50%; transform:translateX(-50%); background:var(--sun); color:#fff; font-family:var(--font-head); font-size:14.5px; padding:5px 18px; border-radius:999px; white-space:nowrap; }
.price-yen{ font-family:var(--font-head); font-size:clamp(29px,3.3vw,37px); color:var(--gold-deep); margin:12px 0 4px; }
.price-yen small{ font-size:15px; color:var(--ink); }
.single-plan{ max-width:760px; margin:26px auto 0; background:#fff; border-radius:14px; box-shadow:var(--shadow); padding:18px 24px; display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; position:relative; z-index:1; }
.single-plan b{ font-family:var(--font-head); color:var(--brown); font-size:16.5px; }
.single-plan .yen{ font-family:var(--font-head); color:var(--gold-deep); font-size:21px; }
.price-foot{ text-align:center; margin-top:26px; font-size:15px; color:#52707A; position:relative; z-index:1; }
@media (max-width:760px){ .price-grid{ grid-template-columns:1fr; } }

/* 実績 */
.awards{ max-width:820px; margin:0 auto; list-style:none; display:grid; gap:12px; position:relative; z-index:1; }
.awards li{ background:#fff; border-radius:14px; box-shadow:var(--shadow); padding:16px 20px 16px 56px; position:relative; font-size:15px; line-height:1.75; }
.awards li::before{ content:"🏅"; position:absolute; left:18px; top:16px; font-size:22px; }
.awards li b{ color:var(--brown); }
.awards li .place{ color:#5E7681; font-size:14.5px; }
.award-more{ display:none; }
.awards.is-open .award-more{ display:block; animation:fadein .4s ease; }
@keyframes fadein{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:none;} }
#awards-toggle .arw{ display:inline-block; transition:transform .3s; }
#awards-toggle[aria-expanded="true"] .arw{ transform:rotate(180deg); }

/* 代表 */
.profile{ display:grid; grid-template-columns:290px 1fr; gap:38px; align-items:start; position:relative; z-index:1; }
.profile .img-slot{ --ratio:3/4; display:grid; place-items:center; color:#46666F; font-size:15px; font-weight:700; text-align:center; }
.yomi{ font-size:15px; color:#5E7681; margin-bottom:14px; letter-spacing:.12em; }
.cred-table{ width:100%; border-collapse:collapse; margin:16px 0; font-size:15.5px; }
.cred-table th{ text-align:left; white-space:nowrap; color:var(--brown); padding:9px 18px 9px 0; vertical-align:top; border-bottom:1px solid var(--gold-soft); }
.cred-table td{ padding:9px 0; border-bottom:1px solid var(--gold-soft); }
.profile blockquote{ margin-top:20px; padding:22px 26px; background:#FAF3E7; border-radius:18px; font-size:16px; color:var(--brown); border-left:6px solid var(--sun); }
.profile blockquote::before{ content:"代表の想い"; display:block; font-family:var(--font-head); color:var(--sun); font-size:15px; margin-bottom:6px; }
@media (max-width:760px){ .profile{ grid-template-columns:1fr; } .profile .img-slot{ max-width:300px; margin:0 auto; } }

/* 流れ */
.flow{ list-style:none; display:grid; max-width:680px; margin:0 auto; position:relative; z-index:1; }
.flow li{ position:relative; padding:0 0 34px 76px; }
.flow li:last-child{ padding-bottom:0; }
.flow li::before{ content:attr(data-step); position:absolute; left:0; top:0; width:54px; height:54px; border-radius:50%; background:var(--leaf); color:#fff; display:grid; place-items:center; font-family:var(--font-head); font-size:22px; }
.flow li:not(:last-child)::after{ content:""; position:absolute; left:26px; top:58px; bottom:6px; border-left:3px dotted var(--gold-soft); }
.flow b{ display:block; font-family:var(--font-head); font-size:18px; color:var(--brown); margin-bottom:4px; }

/* アクセス */
.access-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; max-width:820px; margin:0 auto; position:relative; z-index:1; }
.access-card{ background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:0 0 24px; text-align:center; overflow:hidden; }
.access-photo{ --ratio:16/10; border-radius:0; box-shadow:none; border:none; margin-bottom:18px; }
.access-card .st{ display:inline-block; background:var(--gold-soft); color:var(--brown); border-radius:999px; padding:4px 18px; font-weight:700; font-size:15px; margin-bottom:10px; }
.access-note{ max-width:820px; margin:24px auto 0; background:#FAF3E7; border-radius:14px; padding:18px 24px; font-size:15px; position:relative; z-index:1; }
@media (max-width:760px){ .access-grid{ grid-template-columns:1fr; } }

/* お知らせ・コラム（サムネイル付きカード：VOICE型） */
.news-box{ max-width:1000px; margin:0 auto; background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:34px 34px 30px; position:relative; z-index:1; }
.news-box h2{ text-align:center; margin-bottom:6px; }
.news-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.news-card{ display:flex; flex-direction:column; text-decoration:none; color:var(--ink); border-radius:16px; overflow:hidden; background:#fff; border:1px solid var(--gold-soft); transition:transform .2s, box-shadow .2s; }
.news-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.news-thumb{ --ratio:16/10; border-radius:0; box-shadow:none; border:none; }
.news-card-body{ padding:14px 16px 18px; }
.news-meta{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.news-meta time{ font-size:14.5px; color:#5E7681; font-weight:700; }
.news-meta .tag{ background:var(--leaf); color:#fff; border-radius:999px; font-size:13.5px; padding:2px 12px; font-weight:700; }
.news-card b{ font-family:var(--font-head); font-weight:500; font-size:15.5px; line-height:1.6; color:var(--brown); }
.news-card:hover b{ color:var(--sun); }
@media (max-width:760px){ .news-grid{ grid-template-columns:1fr 1fr; gap:16px; } .news-card b{ font-size:15px; } .news-card-body{ padding:12px 12px 14px; } .news-meta{ gap:6px; margin-bottom:6px; } .news-meta time{ font-size:13.5px; } .news-meta .tag{ font-size:12.5px; padding:2px 9px; } }
@media (max-width:420px){ .news-grid{ gap:12px; } .news-card b{ font-size:14.5px; line-height:1.5; } }

/* ブランドストーリー */
.story-hero{ text-align:center; margin-bottom:30px; position:relative; z-index:1; }
.story-logo{ width:200px; height:200px; margin:0 auto 20px; border-radius:0; background:none; padding:0; box-shadow:none; }
.story-tagline{ font-family:var(--font-head); font-size:clamp(17px,2.4vw,21px); color:var(--brown); }
.story-letters{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:720px; margin:0 auto 34px; position:relative; z-index:1; }
.story-letters .sl{ background:#fff; border-radius:14px; box-shadow:var(--shadow); padding:16px 14px; text-align:center; }
.story-letters .sl b{ display:block; font-family:"Kiwi Maru",serif; font-size:34px; color:var(--gold); line-height:1; margin-bottom:6px; }
.story-letters .sl span{ font-size:14.5px; color:#52707A; }
.story-body{ max-width:800px; margin:0 auto; position:relative; z-index:1; }
.story-body p{ margin-bottom:14px; }
.story-sign{ text-align:right; font-family:var(--font-head); color:var(--brown); margin-top:20px; margin-bottom:0; }
@media (max-width:640px){ .story-letters{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:760px){ .story-body p{ text-align:left; } }

/* FAQ */
.faq{ max-width:760px; margin:0 auto; display:grid; gap:14px; position:relative; z-index:1; }
.faq details{ background:#fff; border-radius:16px; box-shadow:var(--shadow); overflow:hidden; }
.faq summary{ list-style:none; cursor:pointer; padding:19px 54px 19px 60px; font-weight:700; font-size:16.5px; color:var(--brown); position:relative; user-select:none; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::before{ content:"Q"; position:absolute; left:18px; top:16px; width:30px; height:30px; border-radius:50%; background:var(--gold); color:#fff; display:grid; place-items:center; font-family:var(--font-head); font-size:16px; }
.faq summary::after{ content:"＋"; position:absolute; right:20px; top:50%; transform:translateY(-50%); color:var(--sun); font-size:22px; }
.faq details[open] summary::after{ content:"－"; }
.faq .a{ padding:0 24px 20px 60px; font-size:16px; }

/* お問い合わせフォーム（サイト内オリジナル・CF7置換前提） */
.contact-wrap{ display:grid; grid-template-columns:1.3fr .7fr; gap:30px; align-items:start; position:relative; z-index:1; }
.contact-form{ background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:32px 30px; display:grid; gap:18px; }
.contact-form label{ display:grid; gap:6px; font-family:var(--font-head); font-size:15px; color:var(--brown); }
.cf-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.contact-form input, .contact-form select, .contact-form textarea{
  font-family:var(--font-body); font-size:16px; color:var(--ink);
  border:1.5px solid var(--gold-soft); border-radius:12px; padding:12px 14px; background:#FAF4E9; width:100%;
}
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus{ outline:none; border-color:var(--sun); box-shadow:0 0 0 3px rgba(244,162,97,.15); }
.req{ background:var(--sun); color:#fff; font-size:13px; border-radius:6px; padding:1px 8px; margin-left:6px; }
.cf-check{ flex-direction:row; display:flex; align-items:center; gap:10px; font-size:15.5px; }
.cf-check input{ width:20px; height:20px; accent-color:var(--sun); }
.cf-submit{ text-align:center; margin-top:6px; }
.cf-submit .btn{ width:100%; max-width:340px; }
.cf-note{ font-size:14.5px; color:#5E7681; margin-top:12px; }
.contact-side{ display:grid; gap:20px; }
.contact-line, .contact-flow{ background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:26px 24px; text-align:center; }
.cs-lead{ font-family:var(--font-head); color:var(--brown); font-size:17px; margin-bottom:14px; }
.contact-line .btn{ width:100%; }
.cs-sub{ font-size:14.5px; color:#5E7681; margin-top:12px; }
.contact-flow{ text-align:left; }
.contact-flow ol{ padding-left:0; list-style:none; counter-reset:cf; display:grid; gap:12px; }
.contact-flow li{ counter-increment:cf; position:relative; padding-left:38px; font-size:15.5px; }
.contact-flow li::before{ content:counter(cf); position:absolute; left:0; top:0; width:26px; height:26px; border-radius:50%; background:var(--leaf); color:#fff; display:grid; place-items:center; font-family:var(--font-head); font-size:15px; }
.contact-flow li b{ color:var(--brown); }
@media (max-width:760px){ .contact-wrap{ grid-template-columns:1fr; } .cf-row{ grid-template-columns:1fr; } }

/* クイックアクセスバー（ヘッダー上部） */






@media(max-width:760px){  }

/* フッター */
.site-footer{ background:#26383F; color:#DCCBAA; padding:0; font-size:15px; }
.footer-in{ max-width:var(--maxw); margin:0 auto; padding:56px 20px 36px; display:grid; grid-template-columns:1.8fr 1fr 1fr; gap:36px 48px; }
.footer-nav-col h5{ font-size:14px; font-weight:700; color:var(--gold); letter-spacing:.1em; text-transform:uppercase; margin-bottom:12px; border-bottom:1px solid rgba(176,138,69,.3); padding-bottom:8px; }
.footer-nav-col ul{ list-style:none; display:grid; gap:9px; }
.footer-nav-col ul a{ color:rgba(220,205,176,.78); font-size:14.5px; text-decoration:none; display:flex; align-items:center; gap:5px; transition:color .2s; }
.footer-nav-col ul a::before{ content:"›"; color:var(--gold); font-size:15px; line-height:1; }
.footer-nav-col ul a:hover{ color:#fff; }




.footer-logo{ width:150px; height:150px; margin-bottom:14px; filter:drop-shadow(0 4px 12px rgba(0,0,0,.25)); }
.site-footer h4{ color:#EBDDC6; font-family:var(--font-head); margin-bottom:10px; font-size:17px; }
.site-footer a{ color:#E7D9C1; }
/* ── フッターのオンラインサロン用バナー ──
   外部サイト（mosh.jp）へのご案内。文章のすぐ下に置く。 */
.footer-banner{ display:block; margin-top:20px; max-width:360px; border-radius:10px;
  overflow:hidden; box-shadow:0 6px 18px rgba(0,0,0,.22);
  transition:transform .25s ease, box-shadow .25s ease; }
.footer-banner img{ width:100%; height:auto; display:block; }
.footer-banner:hover{ transform:translateY(-3px); box-shadow:0 10px 26px rgba(0,0,0,.32); }
.footer-banner:focus-visible{ outline:3px solid var(--sun); outline-offset:3px; }
@media (max-width:760px){ .footer-banner{ max-width:100%; margin-left:auto; margin-right:auto; } }
.copyright{ grid-column:1/-1; border-top:1px solid #46666F; padding-top:18px; text-align:center; }
@media (max-width:760px){ .footer-in{ grid-template-columns:1fr 1fr; gap:24px; } } @media (max-width:560px){ .footer-in{ grid-template-columns:1fr; } }

/* 追従バー */



/* ==========================================================
   レスポンシブ強化（v6.1）
   方針：
   - モバイル（〜760px）はヒーローを「絶対配置の重ね」から
     「流し込み（フロー）」へ切替 → 衝突・はみ出しを根絶
   - 浮遊装飾・ドット柄はSOHGO同様タブレット以上限定
   - 余白・ボタン・カードをモバイル密度に最適化
========================================================== */

/* モバイル用キャンペーンピル（PCでは円形バッジを使うため非表示） */
.badge-inline{
    display:inline-block; background:#fff; color:var(--sun); border:2px solid var(--sun);
    font-family:var(--font-head); font-size:15px; line-height:1.5;
    border-radius:999px; padding:7px 20px; margin-bottom:16px; box-shadow:var(--shadow);
  }
  .badge-inline b{ font-size:1.2em; }

/* ---- タブレット（〜1024px）：ヒーロー・ヘッダー調整 ---- */
@media (max-width:760px){
  .hero-copy-box{ max-width:min(580px, 74vw); padding:26px 26px 24px; }
  .gnav{ gap:2px 12px; }
  .gnav a{ font-size:16px; }
  .brand-sub{ font-size:12.5px; }
}

/* ---- モバイル（〜760px）：全面調整 ---- */
@media (max-width:760px){

  /* 装飾はPC/タブレット限定（SOHGOのu-view-upper-tb相当） */
  .float-item, .dots{ display:none; }

  /* ■ ヒーロー：写真まるごと表示ゾーン＋コピーボックスは下から「ちょい被り」 */
  .hero{
    min-height:0; align-items:stretch;
    flex-direction:column; justify-content:flex-start;
    padding:0 0 18px;
  }
  /* 写真を絶対配置の背景から通常フローへ。3:2＝写真の実比率なので全体が見切れず表示される */
  .hero-slides{
    position:relative; inset:auto;
    width:100%; aspect-ratio:3/2;
  }
  .hero::after{ display:none; }  /* 下端グラデはモバイル積み上げでは不要 */
  .hero-slide .slot-label{ font-size:13px; }
  .hero-copy-box{
    max-width:none; padding:20px 18px 18px;
    margin:-46px 16px 0;           /* 写真の下辺に少しだけ重なる */
    background:rgba(251,247,240,.94);
  }
  .badge-inline{ font-size:14px; padding:6px 16px; }
  .hero-copy-box h1{
    font-size:clamp(22px, 6.6vw, 30px); line-height:1.55; margin-bottom:10px;
  }
  .hero-sub{ font-size:14px; padding:7px 13px; margin-bottom:14px; }
  .hero-cta{ align-items:stretch; gap:10px; }
  .hero-cta .btn{ width:100%; }
  .hero-cta .btn.big{ padding:16px 18px; font-size:17px; }
  .hero-cta .btn.mid{ padding:13px 18px; font-size:15.5px; }
  .hero-note{ font-size:14px; text-align:center; }
  .hero-news{
    position:relative; z-index:6; right:auto; bottom:auto;
    margin:12px 16px 0; max-width:none;
    display:flex; align-items:center; gap:8px; padding:11px 14px;
  }
  .hero-news .tag{ flex:none; }
  .hero-news .t{ font-size:14.5px; line-height:1.6; }

  /* ■ ヘッダー：省スペース化 */
  .header-in{ padding:8px 14px; gap:8px; flex-wrap:nowrap; }
  .brand{ flex:1; min-width:0; }
  .brand > span{ min-width:0; overflow:hidden; }
  .brand-logo{ height:64px; width:auto; flex:none; }
  .brand-name{ font-size:18px; letter-spacing:.06em; }
  .brand-sub{ display:none; }   /* モバイルはボタンとの被り防止のため非表示 */
  .header-sns{ gap:6px; }
  .header-sns a{ width:30px; height:30px; }
  .header-sns svg{ width:16px; height:16px; }
  html{ scroll-padding-top:72px; }

  /* ■ セクション密度 */
  .section{ padding:58px 0; }
  .sec-head{ margin-bottom:30px; }
  .lede{ font-size:15.5px; }
  .wave{ height:30px; top:-29px; }

  /* ■ メッセージ・ジグザグ */
  .msg-set{ gap:26px; }
  .msg-txt h2{ font-size:clamp(23px,6.4vw,28px); }
  .zigzag{ margin-top:40px; gap:18px; }
  .zigzag .img-slot{ aspect-ratio:16/10; }

  /* ■ カード類の内側余白 */
  .card, .svc-item{ padding:24px 20px; }
  .svc-circle{ width:126px; height:126px; }
  .shin-hero{ padding:28px 20px; gap:18px; }
  .shin-kanji{ font-size:82px; }
  .trial-card{ padding:28px 18px 24px; }
  .trial-card .btn.big{ width:100%; padding:16px 16px; font-size:16.5px; }
  .news-box{ padding:26px 18px 22px; }
  .news-list a{ gap:8px 12px; padding:13px 2px; }
  .news-list .nt{ width:100%; }           /* タイトルは2行目に回す */
  .profile blockquote{ padding:18px 18px; font-size:15px; }
  .awards li{ font-size:15px; padding:14px 16px 14px 50px; }
  .awards li::before{ left:14px; font-size:19px; }
  .access-note{ font-size:15px; padding:16px 18px; }
  .faq summary{ font-size:15px; padding:17px 46px 17px 56px; }
  .faq .a{ font-size:15px; }

  /* ■ CVバンド・追従バー */
  .cta-band{ padding:60px 18px 68px; }
  .cta-band .btn.big{ width:100%; max-width:420px; padding:16px 18px; font-size:16.5px; }
  .cta-steps{ font-size:14px; gap:8px; }
  .cta-steps span{ padding:6px 13px; }
  
  

  /* ■ 本文ベース */
  body{ font-size:16.5px; line-height:1.9; }
  h2{ font-size:clamp(22px,6vw,28px); }
  h3{ font-size:clamp(18px,4.8vw,21px); }
}


/* ---- 文字バランス微調整（v6.2） ---- */
.br-pc{ display:inline; }


.br-sp{ display:none; }                  /* スマホ専用改行（PCでは非表示） */
@media (max-width:760px){
  .br-pc{ display:none; }                /* モバイルは自然折返し */
  .br-sp{ display:inline; }
  .cta-band p{ text-align:left; }        /* 日本語センタリングの語中割れ回避 */
  .cta-band h2{ font-size:clamp(21px,5.8vw,26px); }
  .worry-close{ font-size:clamp(17px,4.9vw,21px); line-height:1.8; }
  .sinpla-note{ font-size:clamp(16.5px,4.6vw,20px); }
  .msg-txt .more-link{ text-align:center !important; }
  .zigzag .more-link{ text-align:center !important; }
}

/* ---- 極小画面（〜380px）の最終調整 ---- */
@media (max-width:380px){
  .hero{ padding:0 0 16px; }
  .hero-copy-box{ margin:-40px 12px 0; }
  .hero-copy-box h1{ font-size:24px; }
  
  .brand-sub{ display:none; }
  .cta-steps{ flex-direction:column; align-items:center; }
}

/* ---- 横向きスマホ（高さ不足）対策 ---- */
@media (max-height:480px) and (max-width:900px){
  .hero{ padding-top:90px; }
}

/* ============ 下層ページ共通：左サイドナビ（追従目次） ============ */
.page-wrap{ max-width:var(--maxw); margin:0 auto; padding:0 20px;
  display:grid; grid-template-columns:230px 1fr; gap:40px; align-items:start; }
.page-head{ background:linear-gradient(135deg,var(--paper),#fff);
  padding:54px 20px 40px; text-align:center; border-bottom:1px solid var(--gold-soft); margin-bottom:40px; }
.page-head .crumb{ font-size:14px; color:var(--gold); letter-spacing:.08em; margin-bottom:12px; }
.page-head .crumb a{ color:var(--gold); text-decoration:none; }
.page-head h1{ font-family:var(--font-head); font-size:clamp(26px,4vw,38px); color:var(--brown); margin-bottom:8px; }
.page-head .en{ font-size:14px; color:var(--sun); letter-spacing:.14em; text-transform:uppercase; }
/* サイドナビ */
.side-toc{ position:sticky; top:96px; }
.side-toc h4{ font-size:14px; letter-spacing:.1em; color:var(--gold); border-bottom:1px solid var(--gold-soft);
  padding-bottom:10px; margin-bottom:14px; font-family:var(--font-body); font-weight:700; }
.side-toc ul{ list-style:none; display:grid; gap:2px; }
.side-toc a{ display:block; padding:10px 12px; font-size:15px; color:var(--brown); text-decoration:none;
  border-radius:8px; border-left:3px solid transparent; transition:all .2s; line-height:1.5; }
.side-toc a:hover{ background:var(--paper); color:var(--sun); }
.side-toc a.active{ background:var(--paper); color:var(--sun); border-left-color:var(--sun); font-weight:700; }
.page-main{ min-width:0; padding-bottom:60px; }
.page-main h2{ font-family:var(--font-head); font-size:clamp(20px,3vw,26px); color:var(--brown);
  margin:0 0 20px; padding-bottom:12px; border-bottom:2px solid var(--gold-soft); scroll-margin-top:90px; }
.page-main h2:not(:first-child){ margin-top:48px; }
.page-main h3{ font-family:var(--font-head); font-size:18px; color:var(--sun); margin:28px 0 12px; }
.page-main p{ line-height:1.95; margin-bottom:16px; color:var(--ink); }
@media(max-width:760px){
  .page-wrap{ grid-template-columns:1fr; gap:0; }
  .side-toc{ position:static; margin-bottom:32px; background:var(--paper); border-radius:12px; padding:16px; }
  .side-toc ul{ grid-template-columns:1fr 1fr; gap:4px; }
}

.gnav a.nav-active{ color:var(--sun); font-weight:700; border-bottom:2px solid var(--sun); }
.site-footer{ background:var(--brown); color:#fff; margin-top:0; }
.footer-in{ max-width:var(--maxw); margin:0 auto; padding:56px 20px 36px; display:grid; grid-template-columns:1.8fr 1fr 1fr; gap:36px 48px; }
.footer-logo{ width:120px; height:120px; margin-bottom:10px; }
.footer-nav-col h5{ font-size:14px; font-weight:700; color:var(--gold); letter-spacing:.1em; text-transform:uppercase; margin-bottom:12px; border-bottom:1px solid rgba(176,138,69,.3); padding-bottom:8px; }
.footer-nav-col ul{ list-style:none; display:grid; gap:9px; }
.footer-nav-col ul a{ color:rgba(220,205,176,.78); font-size:14.5px; text-decoration:none; display:flex; align-items:center; gap:5px; transition:color .2s; }
.footer-nav-col ul a::before{ content:"\203A"; color:var(--gold); font-size:15px; line-height:1; }
.footer-nav-col ul a:hover{ color:#fff; }
.footer-in h4{ color:#fff; }
.sub-footer{ background:rgba(0,0,0,.25); display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; padding:16px 28px; font-size:14px; color:rgba(220,205,176,.55); }
.sub-footer a{ color:rgba(220,205,176,.6); text-decoration:none; transition:color .2s; }
.sub-footer a:hover{ color:#fff; }
.sub-footer-links{ display:flex; gap:18px; flex-wrap:wrap; }
@media(max-width:760px){ .footer-in{ grid-template-columns:1fr 1fr; gap:24px; } }
@media(max-width:560px){ .footer-in{ grid-template-columns:1fr; }  }
.header-topbar{ background:var(--brown); color:#fff; font-size:14px; display:flex; justify-content:flex-end; align-items:center; gap:0; overflow:hidden; flex-wrap:wrap; }
.header-topbar a{ display:flex; align-items:center; gap:5px; color:rgba(255,255,255,.88); text-decoration:none; padding:7px 16px; border-left:1px solid rgba(255,255,255,.15); transition:background .2s; white-space:nowrap; font-size:14px; }
.header-topbar a:first-child{ border-left:none; }
.header-topbar a:hover{ background:rgba(255,255,255,.12); color:#fff; }
.header-topbar .tb-ico{ width:14px; height:14px; flex-shrink:0; fill:currentColor; }
.header-topbar .lang-btn{ background:rgba(255,255,255,.18); border-radius:3px; font-weight:700; }
@media(max-width:760px){ .header-topbar{ display:none; } }

/* ===== ヘッダー：スクロールで縮小＋タブレット収まり（TOPと統一） ===== */
.site-header{ will-change:transform; transition:background .55s ease, box-shadow .55s ease, transform 1.5s cubic-bezier(.34,1.42,.5,1); }
.site-header .header-in{ transition:padding .3s ease; }
.site-header .brand-logo{ transition:height .3s ease; }
.site-header.scrolled{ position:fixed; top:0; left:0; right:0; transform:translateY(0); background:rgba(251,247,240,.97); backdrop-filter:blur(8px); box-shadow:0 2px 14px rgba(38,70,83,.10); }
.site-header.scrolled.prehide{ transform:translateY(-105%); transition:none; }
@media (max-width:1180px) and (min-width:761px){
  .header-in{ flex-wrap:nowrap; gap:clamp(6px,1.1vw,16px); padding-top:10px; padding-bottom:10px; padding-left:clamp(10px,1.9vw,40px); padding-right:clamp(10px,1.9vw,40px); }
  .brand{ margin-right:clamp(4px,0.9vw,14px); }
  .brand-logo{ height:48px; }
  .header-right{ gap:clamp(5px,0.8vw,14px); flex-wrap:nowrap; min-width:0; }
  .brand,.gnav,.gnav a,.header-cta,.header-sns{ flex-shrink:0; }
  .gnav{ gap:clamp(2px,0.55vw,12px); flex-wrap:nowrap; }
  .gnav a{ font-size:clamp(12px,1.28vw,17px); padding:6px 1px; white-space:nowrap; }
  .header-cta{ gap:clamp(3px,0.5vw,8px); }
  .hbtn{ font-size:clamp(11px,1.15vw,14px); padding:8px clamp(7px,0.9vw,14px); }
  .header-sns{ gap:5px; }
  .header-sns a{ width:clamp(28px,2.9vw,36px); height:clamp(28px,2.9vw,36px); }
  .header-sns svg{ width:16px; height:16px; }
}
/* 固定ヘッダー分の余白（absoluteヘッダーと本文が重ならないように） */
main{ padding-top:76px; }
@media(max-width:760px){ main{ padding-top:84px; } }


.news-list{ display:grid; gap:0; }
.news-list-item{ display:grid; grid-template-columns:300px 1fr; gap:28px; padding:28px 0;
  border-bottom:1px solid var(--gold-soft); text-decoration:none; transition:background .2s; align-items:start; }
.news-list-item:hover{ background:var(--paper); }
.news-list-item:first-child{ padding-top:0; }
.nli-thumb{ aspect-ratio:40/21; border-radius:12px; overflow:hidden; background:transparent;
  /* 日付・タグ行のぶん下げて、タイトルの高さに天端を合わせる */
  margin-top:calc(1.5em + 14px);   /* アイキャッチ比率に一致＝余白なし */
  box-shadow:0 6px 18px rgba(38,70,83,.14); transition:box-shadow .2s, transform .2s; }
.news-list-item:hover .nli-thumb{ box-shadow:0 10px 26px rgba(38,70,83,.2); transform:translateY(-2px); }
.nli-thumb > img{ border-radius:12px; }
@media(min-width:601px) and (max-width:900px){
  .news-list-item{ grid-template-columns:240px 1fr; gap:22px; }
}
.nli-meta{ display:flex; align-items:center; gap:12px; margin-bottom:8px; }
.nli-meta time{ font-size:14.5px; color:#5E7681; font-weight:600; }
.nli-tag{ font-size:13px; color:#fff; padding:3px 12px; border-radius:20px; font-weight:600; }
.nli-title{ font-family:var(--font-head); font-size:17px; color:var(--brown); margin:0 0 8px; line-height:1.5; }
.news-list-item:hover .nli-title{ color:var(--sun); }
.nli-excerpt{ font-size:15px; color:#52707A; line-height:1.75; margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media(max-width:600px){
  .news-list-item{ grid-template-columns:1fr; gap:12px; padding:20px 0; }
  .nli-thumb{ margin-top:0; width:100%; }
  .nli-thumb{ margin-top:calc(1.4em + 10px); }
  .nli-title{ font-size:15px; } .nli-excerpt{ font-size:14px; }
}
.side-toc .cat-link.on{ background:var(--paper); color:var(--sun); border-left-color:var(--sun); font-weight:700; }

/* 最新情報→SNS誘導セクション */
.news-sns{ margin-top:52px; padding:36px 24px 40px; background:var(--paper); border-radius:20px; text-align:center;
  border:1px solid var(--gold-soft); }
.news-sns .ns-eyebrow{ color:var(--sun); letter-spacing:.18em; font-size:13.5px; font-weight:700; margin:0 0 8px; }
.news-sns h2{ border:none !important; padding:0 !important; margin:0 0 10px !important; }
.news-sns .ns-lede{ font-size:15px; color:#52707A; margin:0 0 26px; line-height:1.85; }
.ns-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; max-width:760px; margin:0 auto; }
.ns-tile{ background:#fff; border:1px solid rgba(30,45,52,.06); border-radius:16px; padding:22px 12px 18px;
  text-decoration:none; display:flex; flex-direction:column; align-items:center; gap:7px;
  transition:transform .25s ease, box-shadow .25s ease; box-shadow:0 6px 16px rgba(30,18,6,.08); }
.ns-tile:hover{ transform:translateY(-5px); box-shadow:0 14px 28px rgba(30,18,6,.16); }
.ns-ico{ width:50px; height:50px; border-radius:14px; display:grid; place-items:center; color:#fff;
  box-shadow:0 5px 12px rgba(0,0,0,.16); margin-bottom:2px; }
.ns-ico svg{ width:26px; height:26px; filter:drop-shadow(0 1px 1px rgba(0,0,0,.14)); }
.ns-instagram{ background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF); }
.ns-youtube{ background:#FF0000; }
.ns-facebook{ background:#1877F2; }
.ns-line{ background:#06C755; }
.ns-name{ font-family:var(--font-head); font-size:15.5px; color:var(--brown); font-weight:700; }
.ns-desc{ font-size:13.5px; color:#5E7681; line-height:1.55; }
.ns-cta{ font-size:14px; color:var(--sun); font-weight:700; margin-top:5px; transition:color .2s; }
.ns-tile:hover .ns-cta{ color:#DD8236; }
@media(max-width:720px){ .ns-grid{ grid-template-columns:repeat(2,1fr); gap:12px; max-width:420px; } }



/* SNSセクション統一（TOPと同一デザイン） */
/* SNSセクション（ASPATHデザイン：カードグリッド） */
.sns-section{ position:relative; padding:74px 20px 82px; overflow:hidden;
  background:linear-gradient(152deg, #1E3A44 0%, #264653 50%, #3F6A76 100%); }
.sns-section::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(130% 90% at 50% -12%, rgba(255,244,214,.16), transparent 62%); }
.sns-section .sns-overlay{ position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,0) 58%, rgba(0,0,0,.18) 100%); }
.sns-section .wrap{ position:relative; z-index:1; }
.sns-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; max-width:880px; margin:0 auto; }
.sns-tile{ position:relative; background:#fff; border:1px solid rgba(30,45,52,.06); border-radius:20px;
  padding:32px 18px 26px; text-decoration:none; text-align:center; display:flex; flex-direction:column;
  align-items:center; gap:9px; transition:transform .28s ease, box-shadow .28s ease;
  box-shadow:0 10px 26px rgba(30,18,6,.18), 0 2px 6px rgba(30,18,6,.10); }
.sns-tile:hover{ transform:translateY(-7px); box-shadow:0 22px 44px rgba(30,18,6,.30), 0 4px 10px rgba(30,18,6,.14); }
.sns-tile-ico{ width:62px; height:62px; border-radius:18px; display:grid; place-items:center; color:#fff;
  margin-bottom:4px; box-shadow:0 6px 15px rgba(0,0,0,.20); }
.sns-tile-ico svg{ width:32px; height:32px; filter:drop-shadow(0 1px 1px rgba(0,0,0,.16)); }
.sns-instagram{ background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF); }
.sns-facebook{ background:#1877F2; }
.sns-youtube{ background:#FF0000; }
.sns-line{ background:#06C755; }
.sns-tile-name{ font-family:var(--font-head); font-size:16.5px; color:var(--brown); font-weight:700; letter-spacing:.02em; }
.sns-tile-desc{ font-size:14px; color:#5E7681; line-height:1.55; }
.sns-tile-cta{ font-size:14px; color:var(--sun); font-weight:700; margin-top:8px; letter-spacing:.02em; transition:color .2s; }
.sns-tile:hover .sns-tile-cta{ color:#DD8236; }
@media(max-width:720px){ .sns-grid{ grid-template-columns:repeat(2,1fr); gap:16px; max-width:420px; } }
@media(max-width:360px){ .sns-grid{ grid-template-columns:1fr; } }

/* ===== モバイル安全策：横スクロール/はみ出し防止 ===== */
html,body{ overflow-x:clip; max-width:100%; }
img,video,iframe{ max-width:100%; height:auto; }
/* ※ここで word-break:normal に戻すと文節折り返しが無効になるため、auto-phrase を維持する。
   overflow-wrap:break-word は「希望」のような語の途中でも切ってしまうため使わない。 */
body{ overflow-wrap:normal; word-break:auto-phrase; line-break:strict; }
.br-pc{ display:inline; }
@media(max-width:600px){
  .cred-table{ font-size:14.5px; }
  .cred-table th{ padding:8px 10px 8px 0; }
  .br-pc{ display:none; }   /* PC用改行はスマホでは改行しない */
}

/* ===== スマホUI最適化（余白・サイズをモバイル基準へ｜iPhone SE想定） ===== */
@media(max-width:600px){
  .section{ padding:50px 0 !important; }
  .wrap{ padding:0 16px; }
  .sec-head{ margin-bottom:20px; }
  .service-banners{ padding:38px 14px !important; }
  .message-band{ padding:46px 16px 50px !important; min-height:0 !important; }
  .sns-section{ padding:44px 14px 50px !important; }
  .about-hsr{ gap:20px !important; }
  .pillar-list{ gap:26px !important; }
  .worry-list{ gap:12px; }
  .worry-close{ margin-top:26px; }
  /* 下層ページ */
  .page-head{ padding-top:74px !important; padding-bottom:6px !important; }
  .page-main{ padding-bottom:36px !important; }
  .page-main h2:not(:first-child){ margin-top:32px !important; }
  .side-toc{ margin-bottom:22px !important; }
  /* ヒーロー */
  .hero{ min-height:74vh !important; padding:60px 6% 66px !important; }
  /* 見出し・本文を少し詰める */
  h2{ line-height:1.4; }
  .lede{ font-size:15px; }
  /* コラム記事の図・引用の余白圧縮 */
  .column-callout{ margin:24px 0 !important; padding:18px 18px !important; font-size:15px !important; }
  .column-quote{ margin:18px 0 !important; }
  .trial-detail, .trial-card{ padding:20px 16px !important; }
}
/* ===== ヘッダーサイズをindex（TOP）と厳密一致（保険・最優先） ===== */
@media (min-width:1181px){
  .site-header .brand-logo{ height:48px !important; }
  .site-header .gnav a{ font-size:24px !important; }
  .site-header .header-in{ padding:12px clamp(20px,4vw,56px) !important; }
}
@media (max-width:1180px) and (min-width:761px){
  .site-header .brand-logo{ height:48px !important; }
  .site-header .gnav a{ font-size:clamp(12px,1.28vw,17px) !important; }
}

/* ===== ヘッダー統一（indexに合わせる：フォント/サイズ/レイアウト） ===== */
.brand{ margin-right:clamp(24px,3.5vw,52px) !important; }
.header-right{ flex:1 !important; min-width:0 !important; }
.gnav{ gap:4px 58px !important; flex:1 !important; justify-content:center !important; padding-left:clamp(20px,5vw,90px) !important; }
.gnav a{ font-size:24px !important; }
.header-cta{ margin-left:auto !important; margin-right:clamp(14px,2.6vw,40px) !important; padding:0 clamp(10px,2vw,26px) !important; }
.hbtn-line{ font-size:23px !important; padding:20px 42px !important; box-shadow:0 7px 20px rgba(6,199,85,.42) !important; }
.hbtn-line .hbtn-ico{ width:26px !important; height:26px !important; }
@media (max-width:1180px) and (min-width:761px){
  .gnav{ gap:clamp(2px,0.55vw,12px) !important; padding-left:0 !important; }
  .gnav a{ font-size:clamp(12px,1.28vw,17px) !important; }
  .hbtn-line{ font-size:clamp(11px,1.2vw,15px) !important; padding:9px clamp(8px,1vw,16px) !important; }
  .hbtn-line .hbtn-ico{ width:18px !important; height:18px !important; }
}

/* ===== 目次/カテゴリ撤去・本文を中央寄せ（TOP以外／50-70代の視認性重視） ===== */
.side-toc{ display:none !important; }
.page-wrap{ grid-template-columns:minmax(0,1fr) !important; gap:0 !important; max-width:1040px !important; }
.page-main{ margin:0 auto !important; }
@media (max-width:760px){ .page-wrap{ max-width:100% !important; } }

/* ===== ヘッダーメニューを常に1行に（ウィンドウ幅に追従／2段折返し防止） ===== */
@media (min-width:761px){
  .header-in{ flex-wrap:nowrap !important; gap:clamp(4px,1vw,20px) !important; padding-left:clamp(12px,2.2vw,56px) !important; padding-right:clamp(12px,2.2vw,56px) !important; }
  .header-right{ flex-wrap:nowrap !important; flex:1 1 auto !important; min-width:0 !important; gap:clamp(4px,0.9vw,18px) !important; }
  /* ロゴも画面幅に追従（固定152pxをやめる）＋ズレ量も可変に */
  .brand{ flex:0 0 auto !important; margin-right:clamp(6px,1.6vw,52px) !important; }
  .brand-logo{ height:48px !important; transform:none !important; }
  /* メニュー：縮小を許可し、間隔・文字を可変に */
  .gnav{ flex-wrap:nowrap !important; flex:1 1 auto !important; min-width:0 !important; justify-content:center !important;
         gap:4px clamp(8px,2.6vw,58px) !important; padding-left:clamp(0px,1.6vw,90px) !important; }
  .gnav a{ white-space:nowrap !important; font-size:clamp(13px,1.5vw,24px) !important; padding:8px 0 !important; }
  /* 公式LINE：縮まないが可変 */
  .header-cta{ flex:0 0 auto !important; margin-left:auto !important; margin-right:clamp(2px,1.2vw,40px) !important; padding:0 clamp(2px,0.8vw,26px) !important; }
  .hbtn-line{ font-size:clamp(12.5px,1.35vw,23px) !important; padding:clamp(9px,1.1vw,20px) clamp(12px,2vw,42px) !important; white-space:nowrap !important; }
  .hbtn-line .hbtn-ico{ width:clamp(15px,1.5vw,26px) !important; height:clamp(15px,1.5vw,26px) !important; }
}

/* ===== 1181〜1599px：メニューを24px固定にすると入りきらず文字が重なる =====
   上の `@media (min-width:1181px)` が `.site-header .gnav a{font-size:24px}` を
   指定しており、詳細度が高いため上のclampが効かない。その結果この幅帯では
   項目が押し潰され「ASPATHについて」が最大58px はみ出して隣と重なっていた。
   TOPページはロゴが大きいぶん余白が少ないため、1700pxまで幅に追従させる。
   文字サイズだけでなく項目の間隔も一緒に詰めることで、どの幅でも
   すき間が均等になるようにしている。
   ※この範囲だけを対象にしているので、他の幅の見た目は変わらない。 */
@media (min-width:1181px) and (max-width:1699.98px){
  .site-header .gnav a{ font-size:clamp(13px,1.5vw,24px) !important; }
  .site-header .gnav{ gap:4px clamp(8px,2.1vw,58px) !important; padding-left:clamp(0px,1.1vw,90px) !important; }
  .site-header .header-in{ padding-left:clamp(12px,2.2vw,56px) !important; padding-right:clamp(12px,2.2vw,56px) !important; }
}

/* ============================================================
   レスポンシブ基盤：全デバイス対応（PCの見た目は維持）
   ============================================================ */
/* 共通：はみ出し防止・画像/表の追従 */
html{ -webkit-text-size-adjust:100%; }
body{ overflow-x:hidden; }
img, video, svg{ max-width:100%; height:auto; }
table{ max-width:100%; }
*{ min-width:0; }

/* ── 大型タブレット / 小型ノート（〜1180px） ── */
@media (max-width:1180px){
  .wrap, .page-wrap{ padding-left:clamp(16px,3vw,32px); padding-right:clamp(16px,3vw,32px); }
  /* 3カラム→2カラム */
  .price-grid{ grid-template-columns:repeat(2,1fr) !important; }
  .reasons-grid, .rs-grid, .col-list, .column-list, .news-list, .sb-grid{ gap:20px; }
}

/* ── タブレット縦（〜1024px） ── */
@media (max-width:1024px){
  /* 2カラム構成を1カラムへ（プロフィール・ジグザグ・由来） */
  .profile{ grid-template-columns:1fr !important; gap:28px !important; padding:30px 26px !important; }
  .profile .img-slot{ max-width:330px; margin:0 auto; }
  .zigzag{ grid-template-columns:1fr !important; gap:22px !important; }
  .zigzag.is-reverse .z-img{ order:0 !important; }
  .origin-hero{ grid-template-columns:1fr !important; gap:24px !important; margin:26px auto 8px !important; padding-right:0 !important; }
  .origin-hero-logo{ max-width:200px; margin:0 auto; }
  .origin-acr{ max-width:520px; margin:0 auto; }
  .acr-en{ min-width:clamp(130px,26vw,205px) !important; }
}

/* ── 小型タブレット / 大型スマホ（〜900px） ── */
@media (max-width:900px){
  .price-grid{ grid-template-columns:1fr !important; max-width:420px; margin-left:auto; margin-right:auto; }
  .price-card.recommend{ transform:none !important; }
  .sb-grid{ grid-template-columns:1fr !important; }
  .svc-item{ grid-template-columns:84px 1fr !important; gap:18px !important; padding:20px 18px !important; }
  .train-flow{ margin-top:48px; }
}

/* ── スマホ（〜760px）：可読性重視 ── */
@media (max-width:760px){
  .wrap, .page-wrap{ padding-left:16px; padding-right:16px; }
  h1{ font-size:clamp(23px,6.6vw,30px) !important; }
  h2{ font-size:clamp(20px,5.6vw,26px) !important; }
  h3{ font-size:clamp(17px,4.8vw,21px) !important; }
  p, li, dd, td{ font-size:clamp(15px,4.1vw,17px) !important; line-height:1.9 !important; }
  /* PC用の手動改行はスマホで無効化（変な位置で切れないように） */
  br.br-pc{ display:none !important; }
  /* ボタンは押しやすく */
  .btn, .hbtn, .btn-line, .btn-form{ min-height:48px; }
  .btn.big, .btn-line.big{ width:100%; max-width:340px; justify-content:center; }
  /* カード内の余白を締める */
  .card, .price-card, .svc-item, .news-list-item, .col-card{ padding:18px 16px !important; }
  .train-flow .tf-list li{ padding-left:56px !important; }
  .tf-list li::before{ width:38px !important; height:38px !important; font-size:15px !important; }
  .tf-list li:not(:last-child)::after{ left:18px !important; }
  /* 表は横スクロール可に */
  .cred-table, .price-table{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
}

/* ── 小型スマホ（〜400px） ── */
@media (max-width:400px){
  .wrap, .page-wrap{ padding-left:13px; padding-right:13px; }
  .svc-item{ grid-template-columns:1fr !important; text-align:center; }
  .svc-circle{ margin:0 auto !important; }
  .svc-body h3::before{ display:none; }
}

/* ── 横向き（ランドスケープ）スマホ ── */
@media (max-height:480px) and (orientation:landscape){
  .hero{ min-height:520px; }
}