:root{
  --paper:#fbf7ec; --bg:#fdfbf4;
  --ink:#1f2a30; --ink-2:#3a464e; --ink-3:#6c7780;
  --teal:#77b9b1; --teal-deep:#4a8c83; --teal-darkest:#356b63;
  --teal-pale:#f0f7f5; --teal-paler:#f5faf8;
  --line:rgba(31,42,48,.10); --line-soft:rgba(31,42,48,.07);
  --ff-serif:"Noto Serif JP","Yu Mincho",serif;
  --ff-sans:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
  --maxw:1100px;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--ff-sans); line-height:1.8; -webkit-font-smoothing:antialiased; }
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 20px; }

/* ===== header ===== */
.hd{ position:sticky; top:0; z-index:100; background:rgba(253,251,244,.94); backdrop-filter:blur(8px); border-bottom:1px solid var(--line-soft); }
.hd-in{ max-width:var(--maxw); margin:0 auto; padding:10px 20px; display:flex; align-items:center; gap:18px; }
.logo{ text-decoration:none; line-height:1.3; }
.logo .nm{ display:block; font-family:var(--ff-serif); font-weight:700; font-size:17px; letter-spacing:.04em; color:var(--ink); white-space:nowrap; }
.logo .sub{ display:block; font-size:10px; letter-spacing:.22em; color:var(--teal-deep); font-weight:700; }
.gnav{ display:none; margin-left:auto; }
.gnav a{ text-decoration:none; font-size:13.5px; font-weight:500; color:var(--ink-2); padding:8px 12px; border-radius:8px; white-space:nowrap; }
.gnav a:hover{ background:var(--teal-pale); color:var(--teal-darkest); }
.hd-cta{ display:none; align-items:center; gap:10px; }
.hd-tel{ text-align:right; text-decoration:none; line-height:1.35; }
.hd-tel .n{ display:block; font-family:var(--ff-serif); font-weight:700; font-size:17px; color:var(--teal-darkest); letter-spacing:.04em; }
.hd-tel .t{ display:block; font-size:10px; color:var(--ink-3); }
.btn-rsv{ display:inline-flex; align-items:center; gap:8px; background:var(--teal); color:#fff; text-decoration:none; font-weight:700; font-size:14px; padding:11px 20px; border-radius:999px; letter-spacing:.04em; box-shadow:0 6px 14px -6px rgba(74,140,131,.55); white-space:nowrap; }
.btn-rsv:hover{ background:var(--teal-deep); }
.menu-btn{ margin-left:auto; width:42px; height:42px; border:1px solid var(--line); border-radius:10px; background:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4.5px; cursor:pointer; }
.menu-btn span{ width:18px; height:2px; background:var(--teal-darkest); border-radius:2px; }
#nav-t{ display:none; }
.m-nav{ display:none; background:var(--paper); border-bottom:1px solid var(--line); }
#nav-t:checked ~ .m-nav{ display:block; }
.m-nav a{ display:block; padding:14px 24px; text-decoration:none; font-size:14.5px; font-weight:500; color:var(--ink-2); border-top:1px solid var(--line-soft); }

/* ===== hero ===== */
.hero{ background:linear-gradient(180deg,var(--teal-paler),var(--bg) 70%); }
.hero-in{ max-width:var(--maxw); margin:0 auto; padding:34px 20px 30px; display:grid; gap:22px; }
.hero-copy .eyebrow{ font-size:11px; letter-spacing:.3em; color:var(--teal-deep); font-weight:700; margin:0 0 10px; }
.hero-copy h1{ font-family:var(--ff-serif); font-weight:700; font-size:clamp(25px,5.6vw,40px); line-height:1.55; letter-spacing:.03em; margin:0; }
.hero-copy h1 .q{ color:var(--teal-darkest); }
.hero-copy .lead{ font-size:14.5px; color:var(--ink-2); margin:14px 0 0; text-wrap:pretty; }
.badges{ display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 0; }
.badge{ display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid var(--line-soft); border-radius:999px; padding:7px 13px; font-size:11.5px; font-weight:700; color:var(--teal-darkest); }
.badge .st{ color:#e8a000; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:10px; margin:20px 0 0; }
.hero-cta .btn-rsv{ font-size:15.5px; padding:14px 26px; }
.btn-tel2{ display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--line); color:var(--ink-2); text-decoration:none; font-weight:700; font-size:14px; padding:13px 20px; border-radius:999px; }
.btn-tel2 .n{ font-family:var(--ff-serif); color:var(--teal-darkest); letter-spacing:.04em; }
.hero-ph{ border-radius:18px; overflow:hidden; box-shadow:0 24px 50px -28px rgba(31,42,48,.5); }

/* ===== news slider ===== */
.news{ padding:26px 0 6px; }
.news-head{ display:flex; align-items:baseline; gap:14px; max-width:var(--maxw); margin:0 auto; padding:0 20px 12px; }
.news-head h2{ font-family:var(--ff-serif); font-size:18px; font-weight:700; margin:0; letter-spacing:.06em; }
.news-head .en{ font-size:10px; letter-spacing:.26em; color:var(--teal-deep); font-weight:700; }
.news-head .all{ margin-left:auto; font-size:12px; color:var(--teal-darkest); font-weight:700; text-decoration:none; }
.nw-rail{ display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 20px 18px; scrollbar-width:thin; max-width:calc(var(--maxw) + 40px); margin:0 auto; }
.nw-card{ flex:0 0 240px; scroll-snap-align:start; background:#fff; border:1px solid var(--line-soft); border-radius:14px; overflow:hidden; text-decoration:none; box-shadow:0 8px 18px -12px rgba(31,42,48,.3); }
.nw-card img{ width:100%; height:130px; object-fit:cover; }
.nw-body{ padding:12px 14px 14px; }
.nw-meta{ display:flex; align-items:center; gap:8px; font-size:10.5px; color:var(--ink-3); }
.nw-tag{ background:var(--teal-pale); color:var(--teal-darkest); font-weight:700; border-radius:5px; padding:1px 8px; }
.nw-title{ font-size:13.5px; font-weight:700; color:var(--ink); line-height:1.6; margin:7px 0 0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* ===== sections common ===== */
.sec{ padding:44px 0; }
.sec--tint{ background:var(--teal-paler); }
.sec-h{ text-align:center; margin:0 0 26px; }
.sec-h .en{ display:block; font-size:10px; letter-spacing:.3em; color:var(--teal-deep); font-weight:700; }
.sec-h h2{ font-family:var(--ff-serif); font-weight:700; font-size:clamp(21px,4vw,28px); letter-spacing:.05em; margin:8px 0 0; }
.sec-h .ul{ width:44px; height:2.5px; background:var(--teal); border-radius:2px; margin:14px auto 0; }

/* 症状ナビ */
.sym-grid{ display:grid; gap:16px; }
.sym-card{ background:#fff; border:1px solid var(--line-soft); border-radius:16px; overflow:hidden; text-decoration:none; box-shadow:0 10px 24px -16px rgba(31,42,48,.35); transition:transform .18s; }
.sym-card:hover{ transform:translateY(-3px); }
.sym-card img{ width:100%; height:150px; object-fit:cover; }
.sym-body{ padding:16px 18px 18px; }
.sym-body h3{ font-family:var(--ff-serif); font-size:17.5px; margin:0; color:var(--ink); }
.sym-body p{ font-size:12.5px; color:var(--ink-3); margin:7px 0 0; line-height:1.7; }
.sym-more{ display:inline-block; margin-top:10px; font-size:12px; font-weight:700; color:var(--teal-darkest); }

/* 選ばれる理由 */
.rsn-grid{ display:grid; gap:14px; }
.rsn{ background:#fff; border:1px solid var(--line-soft); border-radius:14px; padding:18px 18px 16px; display:flex; gap:14px; align-items:flex-start; }
.rsn .no{ font-family:var(--ff-serif); font-weight:700; font-size:22px; color:var(--teal); line-height:1; flex:none; margin-top:2px; }
.rsn h3{ font-size:15px; margin:0; }
.rsn p{ font-size:12.5px; color:var(--ink-3); margin:5px 0 0; line-height:1.7; }

/* 口コミ */
.gmb-chip{ display:flex; align-items:center; justify-content:center; gap:9px; background:#fff; border:1px solid var(--line-soft); border-radius:999px; width:max-content; margin:0 auto 22px; padding:9px 20px; }
.gmb-chip .st{ color:#e8a000; font-size:15px; }
.gmb-chip .rt{ font-family:var(--ff-serif); font-weight:700; font-size:16px; }
.gmb-chip .gt{ font-size:12px; color:var(--ink-3); }
.rev-grid{ display:grid; gap:16px; }
.rev{ background:#fff; border:1px solid var(--line-soft); border-radius:14px; overflow:hidden; box-shadow:0 8px 20px -14px rgba(31,42,48,.3); display:flex; }
.rev img{ width:118px; height:118px; object-fit:cover; object-position:center top; flex:none; }
.rev-b{ padding:12px 15px; }
.rev-b .st{ color:#e8a000; font-size:12px; margin:0 0 4px; }
.rev-b p{ font-size:13px; margin:0; line-height:1.75; }
.rev-b .who{ font-size:11px; color:var(--ink-3); margin-top:6px; display:block; }
.g-link{ display:block; width:max-content; margin:20px auto 0; font-size:13px; font-weight:700; color:var(--teal-darkest); }

/* 料金 */
.price-card{ background:#fff; border:1.5px solid var(--teal-darkest); border-radius:18px; overflow:hidden; max-width:560px; margin:0 auto; }
.price-hd{ background:var(--teal-darkest); color:#fff; text-align:center; padding:12px; font-family:var(--ff-serif); font-size:15px; letter-spacing:.08em; }
.price-bd{ padding:24px 22px; text-align:center; }
.price-bd .was{ font-size:13px; color:var(--ink-3); }
.price-bd .was s{ opacity:.75; }
.price-bd .now{ font-family:var(--ff-serif); font-weight:700; font-size:40px; color:var(--teal-darkest); line-height:1.2; }
.price-bd .now small{ font-size:15px; }
.price-bd .inc{ font-size:12px; color:var(--ink-3); margin-top:6px; }
.price-tbl{ margin:18px auto 0; border-top:1px dashed var(--line); padding-top:14px; font-size:13px; color:var(--ink-2); }
.price-tbl div{ display:flex; justify-content:space-between; gap:14px; padding:4px 6px; }
.price-note{ font-size:11.5px; color:var(--ink-3); margin-top:12px; }

/* 院長 */
.dr{ display:grid; gap:20px; align-items:center; max-width:820px; margin:0 auto; }
.dr-ph{ width:180px; height:180px; border-radius:50%; overflow:hidden; margin:0 auto; border:4px solid #fff; box-shadow:0 12px 30px -16px rgba(31,42,48,.45); }
.dr-ph img{ width:100%; height:100%; object-fit:cover; }
.dr-b h3{ font-family:var(--ff-serif); font-size:20px; margin:0; text-align:center; }
.dr-b .role{ text-align:center; font-size:12px; color:var(--teal-darkest); font-weight:700; margin:4px 0 12px; }
.dr-b p{ font-size:13.5px; color:var(--ink-2); margin:0; text-wrap:pretty; }

/* アクセス */
.acc{ display:grid; gap:20px; }
.acc-map{ border-radius:16px; overflow:hidden; border:1px solid var(--line-soft); min-height:280px; }
.acc-map iframe{ width:100%; height:100%; min-height:280px; border:0; display:block; }
.acc-tbl{ font-size:13.5px; }
.acc-tbl .row{ display:flex; gap:14px; padding:11px 4px; border-bottom:1px dashed var(--line); }
.acc-tbl .k{ flex:0 0 84px; font-weight:700; color:var(--teal-darkest); }
.acc-tbl .v{ color:var(--ink-2); }

/* FAQ */
.faq{ max-width:760px; margin:0 auto; }
.faq details{ background:#fff; border:1px solid var(--line-soft); border-radius:12px; margin-bottom:10px; padding:0 18px; }
.faq summary{ cursor:pointer; font-weight:700; font-size:14px; padding:15px 0; list-style:none; position:relative; padding-right:28px; }
.faq summary::after{ content:"＋"; position:absolute; right:2px; top:13px; color:var(--teal-deep); font-size:16px; }
.faq details[open] summary::after{ content:"−"; }
.faq .a{ font-size:13px; color:var(--ink-2); padding:0 0 15px; margin:0; border-top:1px dashed var(--line-soft); padding-top:12px; }

/* footer */
.ft{ background:#22312e; color:#cfe0dc; margin-top:30px; padding:36px 0 90px; }
.ft-in{ max-width:var(--maxw); margin:0 auto; padding:0 20px; display:grid; gap:22px; }
.ft .nm{ font-family:var(--ff-serif); font-size:17px; color:#fff; font-weight:700; }
.ft p{ font-size:12.5px; margin:8px 0 0; line-height:1.9; }
.ft-nav{ display:flex; flex-wrap:wrap; gap:4px 18px; }
.ft-nav a{ color:#cfe0dc; text-decoration:none; font-size:12.5px; padding:4px 0; }
.copy{ font-size:11px; color:#8fa8a2; }

/* mobile fixed bar */
.fbar{ position:fixed; left:0; right:0; bottom:0; z-index:120; display:flex; gap:8px; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); background:rgba(253,251,244,.96); border-top:1px solid var(--line); backdrop-filter:blur(8px); }
.fbar a{ flex:1; display:flex; align-items:center; justify-content:center; gap:7px; text-decoration:none; font-weight:700; border-radius:12px; padding:13px 6px; font-size:14px; }
.fbar .fw{ flex:1.6; background:var(--teal); color:#fff; box-shadow:0 6px 14px -6px rgba(74,140,131,.55); }
.fbar .ftl{ background:#fff; border:1px solid var(--line); color:var(--ink-2); }

/* ===== tablet ===== */
@media (min-width:768px){
  .hero-in{ grid-template-columns:1.05fr .95fr; align-items:center; padding:48px 20px 44px; }
  .sym-grid{ grid-template-columns:repeat(3,1fr); }
  .rsn-grid{ grid-template-columns:1fr 1fr; }
  .rev-grid{ grid-template-columns:1fr 1fr; }
  .acc{ grid-template-columns:1.1fr .9fr; align-items:start; }
  .dr{ grid-template-columns:auto 1fr; }
  .dr-b h3,.dr-b .role{ text-align:left; }
  .nw-card{ flex-basis:280px; }
}
/* ===== PC ===== */
@media (min-width:1080px){
  .gnav{ display:flex; gap:2px; }
  .hd-cta{ display:flex; }
  .menu-btn{ display:none; }
  .m-nav{ display:none !important; }
  .fbar{ display:none; }
  .ft{ padding-bottom:36px; }
  .hero-copy h1{ font-size:44px; }
  .sec{ padding:64px 0; }
}

/* ===== subpages ===== */
.crumb{ font-size:11.5px; color:var(--ink-3); padding:14px 0 0; }
.crumb a{ color:var(--teal-darkest); text-decoration:none; }
.crumb span{ margin:0 6px; color:var(--line); }
.page-hero{ background:linear-gradient(180deg,var(--teal-paler),var(--bg) 80%); padding:26px 0 34px; }
.page-hero .eyebrow{ font-size:11px; letter-spacing:.28em; color:var(--teal-deep); font-weight:700; margin:0 0 10px; }
.page-hero h1{ font-family:var(--ff-serif); font-weight:700; font-size:clamp(23px,5vw,34px); line-height:1.55; letter-spacing:.03em; margin:0; }
.page-hero .lead{ font-size:14.5px; color:var(--ink-2); margin:14px 0 0; max-width:720px; text-wrap:pretty; }
.chk{ list-style:none; margin:0; padding:0; display:grid; gap:10px; max-width:720px; }
.chk li{ background:#fff; border:1px solid var(--line-soft); border-radius:12px; padding:13px 16px 13px 44px; font-size:14px; position:relative; line-height:1.7; }
.chk li::before{ content:"✓"; position:absolute; left:16px; top:12px; color:var(--teal-deep); font-weight:700; }
.prose{ max-width:720px; margin:0 auto; }
.prose h2{ font-family:var(--ff-serif); font-weight:700; font-size:clamp(19px,3.6vw,24px); letter-spacing:.04em; margin:38px 0 14px; padding-left:14px; border-left:3.5px solid var(--teal); line-height:1.6; }
.prose h3{ font-size:16px; margin:26px 0 8px; }
.prose p{ font-size:14.5px; color:var(--ink-2); margin:0 0 14px; text-wrap:pretty; }
.prose ul{ font-size:14.5px; color:var(--ink-2); padding-left:22px; margin:0 0 14px; }
.prose li{ margin-bottom:6px; }
.prose .ph{ border-radius:14px; overflow:hidden; margin:18px 0; box-shadow:0 12px 28px -18px rgba(31,42,48,.4); }
.note-box{ background:var(--teal-pale); border-radius:12px; padding:16px 18px; font-size:13px; color:var(--ink-2); margin:18px 0; }
.note-box b{ color:var(--teal-darkest); }
.cta-band{ background:var(--teal-paler); border:1px solid var(--line-soft); border-radius:18px; text-align:center; padding:28px 20px; margin:36px auto; max-width:720px; }
.cta-band .t{ font-family:var(--ff-serif); font-weight:700; font-size:18px; margin:0 0 4px; }
.cta-band .p{ font-size:13px; color:var(--ink-2); margin:0 0 16px; }
.cta-band .btns{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.voice-one{ background:#fff; border:1px solid var(--line-soft); border-radius:14px; padding:18px 20px; max-width:720px; margin:0 auto; box-shadow:0 8px 20px -14px rgba(31,42,48,.3); }
.voice-one .st{ color:#e8a000; font-size:13px; margin:0 0 6px; }
.voice-one p{ font-size:14px; margin:0; line-height:1.8; }
.voice-one .who{ font-size:11.5px; color:var(--ink-3); margin-top:8px; display:block; }
.oth-grid{ display:grid; gap:12px; max-width:720px; margin:0 auto; }
.oth-grid a{ background:#fff; border:1px solid var(--line-soft); border-radius:12px; padding:14px 18px; text-decoration:none; font-size:14px; font-weight:700; color:var(--ink); display:flex; justify-content:space-between; align-items:center; }
.oth-grid a small{ font-weight:500; color:var(--teal-darkest); }
@media (min-width:768px){ .oth-grid{ grid-template-columns:1fr 1fr; } }

/* ===== blog ===== */
.bl-list{ display:grid; gap:16px; max-width:820px; margin:0 auto; }
.bl-card{ background:#fff; border:1px solid var(--line-soft); border-radius:14px; overflow:hidden; text-decoration:none; box-shadow:0 8px 20px -14px rgba(31,42,48,.3); display:grid; transition:transform .18s; }
.bl-card:hover{ transform:translateY(-3px); }
.bl-card img{ width:100%; height:170px; object-fit:cover; }
.bl-b{ padding:15px 18px 18px; }
.bl-meta{ display:flex; align-items:center; gap:9px; font-size:11px; color:var(--ink-3); }
.bl-tag{ background:var(--teal-pale); color:var(--teal-darkest); font-weight:700; border-radius:5px; padding:2px 9px; }
.bl-card h2,.bl-card h3{ font-family:var(--ff-serif); font-size:17px; font-weight:700; color:var(--ink); line-height:1.65; margin:8px 0 0; }
.bl-card p.ex{ font-size:12.5px; color:var(--ink-3); margin:8px 0 0; line-height:1.75; }
@media (min-width:768px){ .bl-card{ grid-template-columns:260px 1fr; } .bl-card img{ height:100%; min-height:150px; } }
.art-head{ max-width:760px; margin:0 auto; }
.art-head .bl-meta{ justify-content:flex-start; margin-bottom:10px; }
.art-head h1{ font-family:var(--ff-serif); font-weight:700; font-size:clamp(22px,4.6vw,32px); line-height:1.6; letter-spacing:.02em; margin:0; }
.art-head .sub{ font-size:14px; color:var(--ink-2); margin:14px 0 0; }
.byline{ display:flex; align-items:center; gap:12px; border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); padding:14px 0; margin:22px 0 0; max-width:760px; }
.byline img{ width:52px; height:52px; border-radius:50%; object-fit:cover; flex:none; }
.byline .t{ font-size:13px; font-weight:700; }
.byline .r{ font-size:11.5px; color:var(--ink-3); }
.toc{ background:var(--teal-paler); border-radius:12px; padding:16px 20px; margin:24px 0; }
.toc b{ font-size:13px; color:var(--teal-darkest); }
.toc ol{ margin:8px 0 0; padding-left:20px; font-size:13.5px; }
.toc li{ margin:4px 0; }
.toc a{ color:var(--ink-2); text-decoration:none; }
.toc a:hover{ color:var(--teal-darkest); }