:root{
  --bg:#fdfcfa;
  --bg-tint:#faf2ea;
  --bg-deep:#3b2519;
  --ink:#33271d;
  --ink-soft:#6f6355;
  --teal:#db7f30;
  --teal-deep:#b5641c;
  --gold:#e8992f;
  --gold-deep:#b07a2c;
  --line:rgba(51,39,29,.10);
  --jp:"游ゴシック体",YuGothic,"游ゴシック","Yu Gothic","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,Osaka,"MS Pゴシック","MS PGothic",sans-serif;--serif:var(--sans);
  --sans:"Futura","Jost","Helvetica Neue",Arial,var(--jp);
  --lat:"Futura","Jost","Helvetica Neue",Arial,sans-serif;
  --wrap:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);color:var(--ink);background:var(--bg);
  font-weight:400;line-height:1.9;letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}

/* ---------- Section framing ---------- */
.eyebrow{
  font-family:var(--lat);font-size:.82rem;letter-spacing:.34em;
  text-transform:uppercase;color:var(--gold-deep);font-weight:600;
  display:flex;align-items:center;gap:.7em;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--gold)}
.eyebrow.center{justify-content:center}
.sec-title{
  font-family:var(--serif);font-weight:600;line-height:1.5;
  font-size:clamp(1.7rem,3.6vw,2.6rem);color:var(--ink);
  margin:.5em 0 .2em;letter-spacing:.04em;text-wrap:balance;
}
.concept h2,.hero h1,.doctor-text h2,.cta-band h2{text-wrap:balance}
.sec-title .accent{color:var(--teal-deep)}
.sec-lead{color:var(--ink-soft);font-size:.98rem;line-height:2.05;max-width:640px}
.fignum{font-family:var(--lat);font-size:.8rem;letter-spacing:.3em;color:var(--gold-deep);font-weight:600}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.1s}.reveal.d2{transition-delay:.2s}.reveal.d3{transition-delay:.3s}

/* ---------- Header ---------- */
header{
  position:fixed;top:0;left:0;width:100%;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 30px;transition:all .5s var(--ease);
  background:rgba(250,248,244,.97);box-shadow:0 1px 0 rgba(51,39,29,.07);
}
header.scrolled{background:rgba(250,248,244,.97);backdrop-filter:blur(10px);box-shadow:0 2px 24px rgba(51,39,29,.07);padding:10px 30px}
.brand{display:flex;align-items:center;gap:13px}
.brand .mark{
  width:44px;height:44px;border-radius:50%;flex:0 0 auto;
  background:var(--teal-deep);display:grid;place-items:center;color:#fff;
  font-family:var(--lat);font-size:1.4rem;font-weight:600;letter-spacing:.02em;
  transition:transform .5s var(--ease);
}
header.scrolled .brand .mark{transform:scale(.9)}
.brand .name{line-height:1.25}
.brand .name b{font-family:var(--serif);font-weight:600;font-size:1.14rem;letter-spacing:.08em;color:var(--ink);display:block}
.brand .name span{font-family:var(--lat);font-size:.66rem;letter-spacing:.28em;color:var(--gold-deep);text-transform:uppercase}
.nav{display:flex;align-items:center;gap:30px}
.nav ul{display:flex;gap:26px;list-style:none}
.nav ul a{font-size:.86rem;font-weight:500;position:relative;padding:4px 0;color:var(--ink)}
.nav ul a span{display:block;font-family:var(--lat);font-size:.58rem;letter-spacing:.2em;color:var(--gold-deep);text-transform:uppercase;text-align:center}
.nav ul a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--teal);transition:width .4s var(--ease)}
.nav ul a:hover::after{width:100%}
.head-cta{display:flex;align-items:center;gap:10px}
.btn{
  display:inline-flex;align-items:center;gap:9px;font-weight:500;font-size:.9rem;
  padding:13px 26px;border-radius:40px;transition:all .4s var(--ease);white-space:nowrap;cursor:pointer;border:none;
}
.btn svg{width:17px;height:17px}
.btn-tel{background:transparent;border:1px solid var(--teal);color:var(--teal-deep)}
.btn-tel:hover{background:var(--teal);color:#fff}
.btn-book{background:var(--gold);color:#fff;box-shadow:0 6px 18px rgba(224,138,60,.35)}
.btn-book:hover{background:var(--gold-deep);transform:translateY(-2px);box-shadow:0 10px 26px rgba(224,138,60,.42)}
.btn-lg{padding:17px 40px;font-size:1rem}
.burger{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;background:none;border:none;cursor:pointer;padding:8px;min-width:44px;min-height:44px;box-sizing:border-box}
.burger span{width:26px;height:2px;background:var(--ink);transition:.3s}

/* ---------- Hero（右に大きな写真フルブリード＋左3行キャッチ） ---------- */
.hero{position:relative;overflow:hidden;background:
  radial-gradient(120% 90% at 12% 20%,#fff 0%,var(--bg) 40%,var(--bg-tint) 100%)}
/* 右に大きな写真（画面端までフルブリード）。左端は斜めに切ってテキスト側へ馴染ませる */
.hero-photo{position:absolute;top:0;right:0;width:60%;height:100%;z-index:1;
  clip-path:polygon(12% 0,100% 0,100% 100%,0 100%);
  opacity:0;transform:translateX(24px);transition:opacity 1.2s var(--ease) .3s,transform 1.2s var(--ease) .3s}
.hero.loaded .hero-photo{opacity:1;transform:none}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
/* 写真の左端＋上端をふわっと背景へ（ヘッダーのロゴ・メニューを読みやすく） */
.hero-photo::before{content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(253,252,250,.92) 0%,rgba(253,252,250,.25) 12%,transparent 22%),
            linear-gradient(100deg,var(--bg) 0%,rgba(253,252,250,.55) 14%,transparent 34%)}
.hero-inner{position:relative;z-index:3;max-width:var(--wrap);margin:0 auto;
  padding:clamp(120px,17vh,200px) 6vw clamp(56px,9vh,110px);min-height:min(88vh,860px);
  display:flex;flex-direction:column;justify-content:center}
.hero-text{max-width:min(560px,54%)}
.hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px}
.hero-badges span{font-size:.82rem;font-weight:500;letter-spacing:.02em;color:#fff;background:var(--teal-deep);border-radius:5px;padding:8px 16px}
.hero-catch{font-family:var(--sans);font-weight:700;letter-spacing:.03em;line-height:1.42;
  opacity:0;transform:translateY(14px);transition:opacity 1.1s var(--ease) .2s,transform 1.1s var(--ease) .2s}
.hero-catch .l1{display:block;font-size:clamp(1.55rem,2.9vw,2.35rem);color:var(--ink)}
.hero-catch .l2,.hero-catch .l3{display:block;font-size:clamp(1.95rem,4vw,3.15rem);color:var(--teal-deep);line-height:1.32}
.hero.loaded .hero-catch{opacity:1;transform:none}
.hero-sub.sp-only{display:none}
.hero-sub{color:var(--ink-soft);font-size:1rem;line-height:2.05;margin-top:24px;max-width:26em;text-wrap:pretty}
/* 情報ボックス（アイコンを上・文字を下／区切り線入り・半透明） */
.hero-info-box{display:inline-flex;align-items:stretch;margin-top:38px;
  background:rgba(255,255,255,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border:1px solid var(--line);border-radius:14px;padding:20px 6px;
  box-shadow:0 24px 50px -28px rgba(51,39,29,.35)}
.hero-info-box .hi{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;padding:2px 26px;text-align:center}
.hero-info-box .hi svg{width:32px;height:32px;color:var(--teal-deep)}
.hero-info-box .hi b{font-size:.9rem;font-weight:600;color:var(--ink);letter-spacing:.02em;line-height:1.4}
.hero-info-box .hi-div{width:1px;background:var(--line);align-self:stretch}
.sec-lead,.concept p{text-wrap:pretty}

/* ---------- Info bar ---------- */
.infobar{background:var(--bg-deep);color:#f3ede4}
.infobar .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding-top:22px;padding-bottom:22px}
.infobar .ib-item{display:flex;align-items:center;gap:13px;font-size:.9rem}
.infobar .ib-item svg{width:22px;height:22px;color:var(--gold);flex:0 0 auto}
.infobar .ib-item b{font-family:var(--serif);font-weight:500;font-size:1.05rem;display:block;letter-spacing:.04em}
.infobar .ib-item small{color:#b9c4bf;font-size:.76rem}
.infobar .divider{width:1px;height:38px;background:rgba(255,255,255,.15)}

/* ---------- News ---------- */
.news{padding:76px 0}
.news .wrap{display:grid;grid-template-columns:280px 1fr;gap:40px;align-items:start}
.news-list{border-top:1px solid var(--line)}
.news-item{display:flex;gap:24px;padding:22px 4px;border-bottom:1px solid var(--line);align-items:baseline;transition:background .3s}
.news-item:hover{background:rgba(219,127,48,.04)}
.news-item time{font-family:var(--lat);font-size:.9rem;letter-spacing:.08em;color:var(--gold-deep);flex:0 0 auto;font-weight:600}
.news-item .tag{font-size:.68rem;font-weight:700;color:#fff;background:var(--teal);padding:3px 12px;border-radius:20px;flex:0 0 auto;letter-spacing:.06em}
.news-item p{font-size:.94rem;color:var(--ink)}

/* ---------- Concept ---------- */
.concept{position:relative;padding:110px 0;background:var(--bg-tint);overflow:hidden}
.concept .bloom{position:absolute;font-family:var(--lat);font-size:22vw;color:rgba(219,127,48,.06);top:-4%;right:-2%;line-height:1;font-style:italic;pointer-events:none;user-select:none}
.concept .wrap{position:relative;z-index:2;text-align:center;max-width:820px}
.concept h2{font-family:var(--serif);font-weight:500;font-size:clamp(1.6rem,4.4vw,2.8rem);line-height:2.1;letter-spacing:.08em;margin:26px 0 30px}
.concept h2 em{font-style:normal;color:var(--teal-deep);font-weight:600}
.concept h2 .ph{display:inline-block}
.concept p{color:var(--ink-soft);font-size:1rem;line-height:2.2;max-width:600px;margin:0 auto}

/* ---------- Reasons ---------- */
.reasons{padding:110px 0}
.reasons .head{text-align:center;margin-bottom:60px}
.reason-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 30px}
.reason{background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 14px 40px rgba(51,39,29,.06);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.reason:hover{transform:translateY(-8px);box-shadow:0 24px 56px rgba(51,39,29,.12)}
.reason .ph{position:relative;aspect-ratio:4/3;overflow:hidden}
.reason .ph img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:transform .8s var(--ease)}
.reason:hover .ph img{transform:scale(1.06)}
.reason .num{position:absolute;top:14px;left:16px;font-family:var(--lat);font-size:2.1rem;font-weight:600;color:#fff;line-height:1;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.reason .body{padding:26px 26px 30px}
.reason h3{font-family:var(--serif);font-weight:600;font-size:1.2rem;letter-spacing:.03em;margin-bottom:12px;color:var(--ink)}
.reason h3 .en{display:block;font-family:var(--lat);font-size:.66rem;letter-spacing:.2em;color:var(--gold-deep);text-transform:uppercase;margin-bottom:5px;font-weight:600}
.reason p{font-size:.87rem;color:var(--ink-soft);line-height:1.95}

/* ---------- Services ---------- */
.services{padding:110px 0;background:var(--bg-deep);color:#f3ede4;position:relative}
.services .head{text-align:center;margin-bottom:58px}
.services .head .sec-title{color:#fff}
.services .head .sec-lead{color:#b9c4bf;margin:0 auto}
.services .head .eyebrow{color:var(--gold)}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}
.svc{background:var(--bg-deep);padding:38px 30px;transition:background .5s var(--ease)}
.svc:hover{background:#4a3222}
.svc .ic{width:46px;height:46px;color:var(--gold);margin-bottom:20px}
.svc .ic svg{width:100%;height:100%;stroke-width:1.3}
.svc h3{font-family:var(--serif);font-weight:500;font-size:1.16rem;letter-spacing:.04em;margin-bottom:5px;color:#fff}
.svc h3 .en{display:block;font-family:var(--lat);font-size:.6rem;letter-spacing:.18em;color:var(--gold);text-transform:uppercase;margin-bottom:8px;font-weight:600}
.svc p{font-size:.84rem;color:#b9c4bf;line-height:1.9}

/* ---------- Equipment ---------- */
.equip{padding:110px 0}
.equip .head{text-align:center;margin-bottom:56px}
.equip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.eq{text-align:center}
.eq .ring{width:120px;height:120px;margin:0 auto 22px;border-radius:50%;border:1px solid var(--line);
  display:grid;place-items:center;position:relative;background:var(--bg-tint);transition:all .5s var(--ease)}
.eq .ring svg{width:52px;height:52px;color:var(--teal-deep);stroke-width:1.2;transition:transform .5s var(--ease)}
.eq:hover .ring{background:var(--teal-deep);border-color:var(--teal-deep)}
.eq:hover .ring svg{color:#fff;transform:scale(1.08)}
.eq .num{position:absolute;top:-6px;right:-2px;font-family:var(--lat);font-size:.8rem;color:var(--gold-deep);font-weight:600;letter-spacing:.1em}
.eq h3{font-family:var(--serif);font-weight:600;font-size:1.08rem;letter-spacing:.03em;margin-bottom:10px}
.eq p{font-size:.85rem;color:var(--ink-soft);line-height:1.9;max-width:230px;margin:0 auto}

/* ---------- Doctor ---------- */
.doctor{position:relative;padding:110px 0;background:var(--bg-tint);overflow:hidden}
.doctor .wrap{display:grid;grid-template-columns:400px 1fr;gap:64px;align-items:center}
.doctor-photo{position:relative}
.doctor-photo .frame{position:relative;border-radius:6px;overflow:hidden;box-shadow:0 26px 60px rgba(51,39,29,.16);background:#fff}
.doctor-photo .frame img{width:100%;display:block}
.doctor-photo .badge{position:absolute;bottom:-22px;right:-14px;background:var(--bg-deep);color:#fff;padding:20px 26px;border-radius:4px;box-shadow:0 16px 40px rgba(42,61,57,.4)}
.doctor-photo .badge small{font-family:var(--lat);font-size:.62rem;letter-spacing:.24em;color:var(--gold);text-transform:uppercase;display:block;margin-bottom:4px}
.doctor-photo .badge b{font-family:var(--serif);font-weight:500;font-size:1.24rem;letter-spacing:.06em}
.doctor-photo .badge span{font-size:.72rem;color:#b9c4bf;display:block;margin-top:2px}
.doctor-text h2{font-family:var(--serif);font-weight:500;font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.9;letter-spacing:.06em;margin:20px 0 26px}
.doctor-text h2 em{font-style:normal;color:var(--teal-deep);font-weight:600}
.doctor-text p{color:var(--ink-soft);font-size:.96rem;line-height:2.15;margin-bottom:18px}
.doctor-text .sign{margin-top:28px;display:flex;align-items:baseline;gap:14px}
.doctor-text .sign small{font-size:.78rem;color:var(--ink-soft)}
.doctor-text .sign b{font-family:var(--serif);font-size:1.4rem;font-weight:500;letter-spacing:.12em}

/* ---------- Clinic intro ---------- */
.clinic{padding:110px 0}
.clinic .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.clinic-photo{border-radius:6px;overflow:hidden;box-shadow:0 20px 50px rgba(51,39,29,.1);position:relative}
.clinic-photo img{width:100%;aspect-ratio:5/4;object-fit:cover}
.clinic-text .sec-title{margin-bottom:18px}
.clinic-text p{color:var(--ink-soft);line-height:2.15;font-size:.96rem;margin-bottom:16px}
.clinic-feat{list-style:none;margin-top:26px;display:grid;gap:14px}
.clinic-feat li{display:flex;gap:13px;align-items:flex-start;font-size:.92rem}
.clinic-feat li svg{width:20px;height:20px;color:var(--teal);flex:0 0 auto;margin-top:3px}

/* ---------- Access ---------- */
.access{padding:110px 0;background:var(--bg-tint)}
.access .head{text-align:center;margin-bottom:52px}
.access-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}
.map-embed{border-radius:6px;overflow:hidden;box-shadow:0 18px 44px rgba(51,39,29,.1);height:100%;min-height:380px}
.map-embed iframe{width:100%;height:100%;min-height:380px;border:0;display:block;filter:grayscale(.15)}
.access-info{background:#fff;border-radius:6px;padding:40px;box-shadow:0 14px 40px rgba(51,39,29,.06)}
.access-info h3{font-family:var(--serif);font-weight:600;font-size:1.3rem;letter-spacing:.05em;margin-bottom:6px}
.access-info .addr{color:var(--ink-soft);font-size:.92rem;margin-bottom:24px}
.hours-table{width:100%;border-collapse:collapse;margin-bottom:22px;font-size:.88rem}
.hours-table th,.hours-table td{border:1px solid var(--line);padding:11px 6px;text-align:center}
.hours-table thead th{background:var(--bg-deep);color:#fff;font-weight:500;font-size:.82rem}
.hours-table thead th.sun{color:#e5a3a3}.hours-table thead th.sat{color:#9ec7e0}
.hours-table tbody th{background:var(--bg-tint);font-weight:500;font-size:.8rem;color:var(--ink)}
.hours-table td .o{color:var(--teal-deep);font-weight:700}
.hours-table td .x{color:#c9beb2}
.hours-note{font-size:.78rem;color:var(--ink-soft);line-height:1.8;margin-bottom:8px}
.access-detail{display:grid;gap:14px;margin-top:22px;border-top:1px solid var(--line);padding-top:22px}
.access-detail div{display:flex;gap:12px;font-size:.9rem;align-items:flex-start}
.access-detail svg{width:19px;height:19px;color:var(--gold-deep);flex:0 0 auto;margin-top:4px}

/* ---------- CTA band ---------- */
.cta-band{position:relative;padding:96px 0;background:var(--bg-deep);color:#fff;text-align:center;overflow:hidden}
.cta-band .bloom{position:absolute;font-family:var(--lat);font-style:italic;font-size:20vw;color:rgba(255,255,255,.03);top:50%;left:50%;transform:translate(-50%,-50%);white-space:nowrap;pointer-events:none}
.cta-band .wrap{position:relative;z-index:2}
.cta-band .eyebrow{justify-content:center;color:var(--gold)}
.cta-band h2{font-family:var(--serif);font-weight:500;font-size:clamp(1.6rem,3.6vw,2.5rem);line-height:1.7;letter-spacing:.06em;margin:20px 0 14px}
.cta-band p{color:#b9c4bf;margin-bottom:38px}
.cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.cta-actions .btn-tel{border-color:rgba(255,255,255,.5);color:#fff}
.cta-actions .btn-tel:hover{background:#fff;color:var(--bg-deep)}
.cta-tel-num{font-family:var(--lat);font-size:1.05rem;font-weight:600;letter-spacing:.06em}

/* ---------- Footer ---------- */
footer{background:#241a12;color:#c7c0b6;padding:64px 0 30px}
footer .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.08)}
footer .f-brand .brand .name b{color:#fff}
footer .f-brand p{font-size:.84rem;line-height:1.9;margin-top:18px;color:#9a9388;max-width:320px}
footer h4{font-family:var(--serif);font-weight:500;color:#fff;font-size:1rem;letter-spacing:.06em;margin-bottom:18px}
footer ul{list-style:none;display:grid;gap:2px}
footer ul a{display:block;padding:11px 0;font-size:.86rem;color:#b3aca0;transition:color .3s}
footer ul a:hover{color:var(--gold)}
footer .copy{text-align:center;padding-top:26px;font-size:.74rem;color:#7c766c;letter-spacing:.06em}
footer .copy a{display:inline-block;padding:9px 6px;margin:-6px 0;color:inherit}
footer .f-lat{font-family:var(--lat);letter-spacing:.16em}

/* ---------- Mobile sticky CTA ---------- */
.mobile-cta{position:fixed;bottom:0;left:0;width:100%;z-index:90;display:none;
  grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.15);box-shadow:0 -6px 24px rgba(0,0,0,.14)}
.mobile-cta a{display:flex;align-items:center;justify-content:center;gap:8px;padding:15px;font-size:.92rem;font-weight:500}
.mobile-cta a svg{width:18px;height:18px}
.mobile-cta .m-tel{background:var(--teal-deep);color:#fff}
.mobile-cta .m-book{background:var(--gold);color:#fff}

/* ---------- Responsive ---------- */
@media(max-width:1000px){
  .reason-grid{grid-template-columns:repeat(2,1fr)}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .equip-grid{grid-template-columns:repeat(2,1fr);gap:44px 20px}
  .doctor .wrap{grid-template-columns:1fr;gap:70px}
  .doctor-photo{max-width:360px;margin:0 auto}
  .clinic .wrap{grid-template-columns:1fr;gap:36px}
  .access-grid{grid-template-columns:1fr}
  .map-embed{min-height:320px}
}
@media(max-width:860px){
  .nav ul{display:none}
  .head-cta .btn-tel,.head-cta .btn-book{display:none}
  .burger{display:flex}
  header{padding:14px 18px;background:rgba(250,248,244,.97);box-shadow:0 1px 0 rgba(51,39,29,.08)}
  header.scrolled{padding:10px 18px}
  /* モバイル：写真を背景レイヤーにして文字を重ねる（硬い境界を作らない） */
  .hero{position:relative;display:block;overflow:hidden;
    --hero-ph:clamp(380px,62vh,560px)}
  @supports (height:1svh){ .hero{--hero-ph:clamp(380px,62svh,560px)} }
  .hero-photo{position:absolute;top:0;left:0;right:0;width:100%;height:var(--hero-ph);
    z-index:1;clip-path:none;transform:none}
  .hero-photo img{width:100%;height:100%;object-fit:cover;object-position:52% 10%}
  /* 上端：ヘッダー下をわずかに沈める */
  .hero-photo::before{background:linear-gradient(180deg,rgba(253,252,250,.5) 0%,rgba(253,252,250,.05) 13%,transparent 24%)}
  /* 下端：背景色へ完全に溶かす＝写真とテキストの境目を消す */
  .hero-photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:44%;z-index:2;
    background:linear-gradient(180deg,rgba(253,252,250,0) 0%,rgba(253,252,250,.5) 40%,rgba(253,252,250,.9) 72%,var(--bg) 100%)}
  .hero-inner{position:relative;z-index:3;min-height:auto;display:block;
    padding:calc(var(--hero-ph) - 196px) 7vw 34px}
  .hero-text{max-width:none}
  .hero-badges{margin-bottom:13px;gap:8px}
  .hero-badges span{font-size:.72rem;padding:6px 12px}
  .hero-catch .l1{font-size:clamp(1.24rem,5vw,1.6rem)}
  .hero-catch .l2,.hero-catch .l3{font-size:clamp(1.7rem,7vw,2.3rem)}
  .hero-sub{margin-top:14px;max-width:none;font-size:.95rem;line-height:1.95}
  .hero-sub.pc-only{display:none}
  .hero-sub.sp-only{display:block}
  .hero-info-box{display:flex;width:100%;margin-top:22px;padding:16px 4px;justify-content:space-between}
  .hero-info-box .hi{padding:2px 8px;flex:1}
  .hero-info-box .hi svg{width:28px;height:28px}
  .hero-info-box .hi b{font-size:.8rem}
  .infobar .wrap{gap:16px;flex-direction:column;align-items:flex-start}
  .infobar .divider{display:none}
  .infobar .ib-item{flex:1 1 100%;width:100%}
  .news .wrap{grid-template-columns:1fr;gap:24px}
  .mobile-cta{display:grid}
  body{padding-bottom:54px}
  .nav-open{position:fixed;inset:0;background:rgba(250,248,244,.98);backdrop-filter:blur(6px);z-index:99;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
  .nav-open ul{display:flex!important;flex-direction:column;text-align:center;gap:22px}
  .nav-open ul a{font-size:1.15rem;font-family:var(--serif)}
  .nav-open .close{position:absolute;top:24px;right:26px;font-size:2rem;background:none;border:none;color:var(--ink)}
}
@media(max-width:560px){
  .reason-grid{grid-template-columns:1fr;max-width:400px;margin:0 auto}
  .svc-grid{grid-template-columns:1fr}
  .equip-grid{grid-template-columns:1fr;max-width:280px;margin:0 auto}
  .concept h2{line-height:1.9}
  .access-info{padding:26px 20px}
  footer .wrap{grid-template-columns:1fr;gap:32px}
  .hours-table th,.hours-table td{padding:9px 3px;font-size:.8rem}
}

/* ============================================================
   Sub-page components
   ============================================================ */
/* Page hero (sub-page banner) */
.page-hero{position:relative;padding:150px 0 60px;background:var(--bg-tint);overflow:hidden;text-align:center}
.page-hero::after{content:"";position:absolute;right:-4%;top:0;width:52%;height:100%;background:rgba(219,127,48,.06);clip-path:polygon(24% 0,100% 0,100% 100%,0 100%);pointer-events:none}
.page-hero .wrap{position:relative;z-index:2}
.page-hero .en{font-family:var(--lat);font-size:clamp(2.4rem,6vw,3.8rem);font-style:italic;color:rgba(181,100,28,.22);line-height:1;letter-spacing:.04em}
.page-hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(1.7rem,4vw,2.5rem);letter-spacing:.08em;color:var(--ink);margin-top:-.4em}
.page-hero p{color:var(--ink-soft);font-size:.96rem;margin-top:16px;max-width:640px;margin-left:auto;margin-right:auto}
.breadcrumb{background:var(--bg);border-bottom:1px solid var(--line)}
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;align-items:center;max-width:var(--wrap);margin:0 auto;padding:13px 24px;font-size:.78rem;color:var(--ink-soft)}
.breadcrumb a{color:var(--teal-deep);display:inline-block;padding:11px 4px;margin:-11px 0}.breadcrumb a:hover{text-decoration:underline}
.breadcrumb li+li::before{content:"\203A";margin-right:8px;color:var(--gold-deep)}

/* Generic section */
.sec{padding:88px 0}
.sec.tint{background:var(--bg-tint)}
.sec.deep{background:var(--bg-deep);color:#f3ede4}
.sec-head{text-align:center;margin-bottom:52px}
.sec-head .sec-lead{margin:0 auto}
.prose{max-width:760px;margin:0 auto;color:var(--ink-soft);font-size:1rem;line-height:2.15;text-wrap:pretty}
.prose p{margin-bottom:1.2em}
.prose strong{color:var(--teal-deep);font-weight:600}
.lead-serif{font-family:var(--serif);font-weight:500;font-size:clamp(1.3rem,2.8vw,1.8rem);line-height:2;letter-spacing:.05em;text-align:center;color:var(--ink);margin-bottom:34px;text-wrap:balance}
.lead-serif em{font-style:normal;color:var(--teal-deep);font-weight:600}

/* Text link */
.link-more{display:inline-flex;align-items:center;gap:9px;font-size:.9rem;font-weight:500;color:var(--teal-deep);margin-top:8px;transition:gap .3s var(--ease)}
.link-more::after{content:"\2192";transition:transform .3s var(--ease)}
.link-more:hover::after{transform:translateX(5px)}
.center{text-align:center}

/* Flow steps */
.flow{max-width:760px;margin:0 auto;position:relative}
.flow::before{content:"";position:absolute;left:31px;top:20px;bottom:40px;width:2px;background:linear-gradient(var(--teal),rgba(219,127,48,.15))}
.flow-step{position:relative;display:grid;grid-template-columns:64px 1fr;gap:24px;padding-bottom:36px}
.flow-step .n{width:64px;height:64px;border-radius:50%;background:var(--teal-deep);color:#fff;display:grid;place-items:center;font-family:var(--lat);font-size:1.5rem;font-weight:600;z-index:1;box-shadow:0 8px 22px rgba(181,100,28,.28)}
.flow-step .c{padding-top:6px}
.flow-step h3{font-family:var(--serif);font-weight:600;font-size:1.16rem;letter-spacing:.03em;margin-bottom:8px}
.flow-step h3 .en{display:block;font-family:var(--lat);font-size:.62rem;letter-spacing:.2em;color:var(--gold-deep);text-transform:uppercase;font-weight:600;margin-bottom:3px}
.flow-step p{font-size:.92rem;color:var(--ink-soft);line-height:1.95}

/* Info cards row */
.icards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.icard{background:#fff;border:1px solid var(--line);border-radius:6px;padding:30px 26px;box-shadow:0 12px 34px rgba(51,39,29,.05)}
.icard .ic{width:40px;height:40px;color:var(--gold);margin-bottom:16px}
.icard .ic svg{width:100%;height:100%;stroke-width:1.3}
.icard h3{font-family:var(--serif);font-weight:600;font-size:1.08rem;margin-bottom:9px}
.icard p{font-size:.87rem;color:var(--ink-soft);line-height:1.9}
.icard-fig{display:block;width:100%;height:auto;margin-bottom:16px;background:#fdf9f4;border-radius:6px}

/* FAQ */
.faq{max-width:820px;margin:0 auto}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:22px 44px;position:relative;font-weight:500;font-size:1rem;color:var(--ink);transition:color .3s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";position:absolute;left:6px;top:20px;font-family:var(--lat);font-size:1.3rem;font-weight:600;color:var(--gold-deep)}
.faq summary::after{content:"+";position:absolute;right:8px;top:18px;font-size:1.5rem;color:var(--teal);transition:transform .3s var(--ease);font-weight:300}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--teal-deep)}
.faq .a{padding:0 44px 24px;color:var(--ink-soft);font-size:.92rem;line-height:2;position:relative}
.faq .a::before{content:"A";position:absolute;left:6px;top:-2px;font-family:var(--lat);font-size:1.3rem;font-weight:600;color:var(--teal)}

/* Treatment detail */
.tdetail{max-width:860px;margin:0 auto}
.tdetail .photo{border-radius:6px;overflow:hidden;box-shadow:0 18px 44px rgba(51,39,29,.1);margin-bottom:40px}
.tdetail .photo img{width:100%;aspect-ratio:3/2;object-fit:cover;object-position:center 15%}
.point-list{list-style:none;display:grid;gap:16px;margin:8px 0}
.point-list li{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:6px;padding:20px 24px;box-shadow:0 8px 24px rgba(51,39,29,.04)}
.point-list li svg{width:24px;height:24px;color:var(--teal);flex:0 0 auto;margin-top:2px}
.point-list li b{font-family:var(--serif);font-weight:600;font-size:1.02rem;display:block;margin-bottom:4px;color:var(--ink)}
.point-list li span{font-size:.88rem;color:var(--ink-soft);line-height:1.85}
.note{background:var(--bg-tint);border:1px solid var(--line);border-radius:12px;padding:22px 26px;font-size:.86rem;color:var(--ink-soft);line-height:1.9;margin-top:28px}
.note b{color:var(--ink);font-weight:600}
/* 「ご確認ください」等の見出しつき注記は、見出しを1行の小見出しに起こす */
.note>b:first-child:has(+br){display:block;font-family:var(--serif);font-size:.98rem;margin-bottom:10px;letter-spacing:.02em}
.note>b:first-child:has(+br)+br{display:none}
/* 色地のカードの中では面が効かない（同じ色）ので、細い罫線だけにする */
.plan .note,.pcard .note{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:16px 0 0;margin-top:18px}

/* Treatment menu grid (index) */
.tmenu{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:960px;margin:0 auto}
.tmenu a,.tmenu .item{display:flex;gap:22px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:6px;padding:28px 30px;box-shadow:0 12px 34px rgba(51,39,29,.05);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.tmenu a:hover{transform:translateY(-5px);box-shadow:0 20px 46px rgba(51,39,29,.12)}
.tmenu .ic{width:48px;height:48px;color:var(--teal-deep);flex:0 0 auto}
.tmenu .ic svg{width:100%;height:100%;stroke-width:1.3}
.tmenu h3{font-family:var(--serif);font-weight:600;font-size:1.16rem;letter-spacing:.03em;margin-bottom:6px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tmenu h3 .en{font-family:var(--lat);font-size:.6rem;letter-spacing:.18em;color:var(--gold-deep);text-transform:uppercase;font-weight:600}
.tmenu p{font-size:.86rem;color:var(--ink-soft);line-height:1.85}
.tmenu .arrow{margin-left:auto;color:var(--gold);align-self:center}

/* Staff / profile */
.profile{display:grid;grid-template-columns:360px 1fr;gap:56px;align-items:start;max-width:960px;margin:0 auto}
.profile-photo .frame{border-radius:6px;overflow:hidden;box-shadow:0 22px 50px rgba(51,39,29,.14);background:#fff}
.profile-photo .frame img{width:100%;display:block}
.profile-table{width:100%;border-collapse:collapse;margin-top:22px;font-size:.9rem}
.profile-table th,.profile-table td{text-align:left;padding:13px 4px;border-bottom:1px solid var(--line);vertical-align:top}
.profile-table th{width:34%;font-weight:500;color:var(--teal-deep);font-family:var(--serif)}
.profile-table td{color:var(--ink-soft)}
.staff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:960px;margin:0 auto}
.staff-card{text-align:center}
.staff-card .av{width:120px;height:120px;border-radius:50%;background:var(--bg-tint);display:grid;place-items:center;margin:0 auto 18px;border:1px solid var(--line)}
.staff-card .av svg{width:52px;height:52px;color:var(--teal);stroke-width:1.1}
.staff-card h3{font-family:var(--serif);font-weight:600;font-size:1.05rem;margin-bottom:4px}
.staff-card .role{font-family:var(--lat);font-size:.66rem;letter-spacing:.16em;color:var(--gold-deep);text-transform:uppercase;margin-bottom:10px}
.staff-card p{font-size:.85rem;color:var(--ink-soft);line-height:1.85;max-width:260px;margin:0 auto}
.editnote{font-size:.76rem;color:#a08a6a;background:rgba(224,138,60,.08);border:1px dashed rgba(224,138,60,.4);border-radius:5px;padding:4px 10px;display:inline-block;margin-top:10px}

/* Two-col access */
.acc2{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start;max-width:var(--wrap);margin:0 auto}

@media(max-width:1000px){
  .icards{grid-template-columns:1fr;max-width:520px;margin:0 auto}
  .tmenu{grid-template-columns:1fr;max-width:560px}
  .profile{grid-template-columns:1fr;gap:36px}
  .profile-photo{max-width:340px;margin:0 auto}
  .staff-grid{grid-template-columns:repeat(2,1fr);max-width:560px}
  .acc2{grid-template-columns:1fr}
}
@media(max-width:560px){
  .page-hero{padding:120px 0 46px}
  .flow-step{grid-template-columns:50px 1fr;gap:16px}
  .flow-step .n{width:50px;height:50px;font-size:1.2rem}
  .flow::before{left:24px}
  .staff-grid{grid-template-columns:1fr;max-width:300px}
  .faq summary,.faq .a{padding-left:38px;padding-right:34px}
  .tdetail .photo img{aspect-ratio:4/3}
}

/* active nav */
.nav ul a.active{color:var(--teal-deep)}
.nav ul a.active::after{width:100%}

/* ============================================================
   Logo / news / font scale  (2nd pass)
   ============================================================ */
/* Logo */
.brand .logo-img{height:44px;width:auto;display:block;transition:height .5s var(--ease)}
header.scrolled .brand .logo-img{height:37px}
@media(max-width:860px){ .brand .logo-img{height:38px} }
footer .f-brand .brand .logo-img{height:40px}
/* ★2026-09-29 ロゴの白抜け修正：filter:brightness(0) invert(1) は元がPNG入りSVGのため
   実際のブラウザ描画でジャギー（輪郭がガタつく）・色が薄く抜けて見える不具合があった
  （headless Edgeで実測して確認済み）。あらかじめ白色化したPNG(logo-white.png)を
   フッターだけ差し替えて描画し、CSSフィルターには頼らない。 */

/* Mobile-only nav item (shown in hamburger overlay, hidden in desktop bar) */
.nav ul li.only-mobile{display:none}
.nav-open ul li.only-mobile{display:block}

/* News list + article */
.news-list.linked .news-item{text-decoration:none;transition:background .3s}
.news-list.linked .news-item:hover{background:rgba(219,127,48,.05)}
.news-list.linked .news-item p{transition:color .3s}
.news-list.linked .news-item:hover p{color:var(--teal-deep)}
.news-item .tag.gold{background:var(--gold)}
.news-item .tag.muted{background:#9a8f80}
.news-article{max-width:820px;margin:0 auto}
.news-article .meta{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.news-article .meta time{font-family:var(--lat);font-size:1rem;letter-spacing:.06em;color:var(--gold-deep);font-weight:600}
.news-article h1{font-family:var(--serif);font-weight:600;font-size:clamp(1.35rem,2.8vw,1.95rem);line-height:1.7;letter-spacing:.04em;color:var(--ink);margin-bottom:30px;padding-bottom:26px;border-bottom:1px solid var(--line)}
.news-article .body{color:var(--ink-soft);font-size:.98rem;line-height:2.2;text-wrap:pretty}
.news-article .body p{margin-bottom:1.3em}
.news-article .body strong{color:var(--teal-deep);font-weight:600}
.news-back{text-align:center;margin-top:54px}
.news-back a{display:inline-flex;align-items:center;gap:9px;font-size:.9rem;font-weight:500;color:var(--teal-deep)}
.news-back a::before{content:"\2190";transition:transform .3s}
.news-back a:hover::before{transform:translateX(-4px)}

/* Font scale — 全体を少し控えめに（ヒーローのサイズは .hero-catch 側で定義） */
.sec-title{font-size:clamp(1.5rem,3vw,2.2rem)}
.page-hero h1{font-size:clamp(1.55rem,3.4vw,2.15rem)}
.page-hero .en{font-size:clamp(2.1rem,5vw,3.2rem)}
.concept h2{font-size:clamp(1.45rem,3.4vw,2.3rem)}
.lead-serif{font-size:clamp(1.2rem,2.4vw,1.6rem)}
.doctor-text h2{font-size:clamp(1.35rem,2.6vw,1.9rem)}
.cta-band h2{font-size:clamp(1.45rem,3vw,2.2rem)}
.concept p,.prose{font-size:.96rem}
.svc h3,.reason h3,.eq h3{font-size:1.1rem}

/* ============================================================
   News cards (3rd pass) — お知らせを枠のあるカードで表示
   ============================================================ */
/* 旧お知らせの2カラムグリッドを無効化（新レイアウト用） */
.news .wrap{display:block}

.news-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.news-card{display:flex;flex-direction:column;gap:14px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--teal);border-radius:8px;padding:28px 28px 24px;box-shadow:0 12px 34px rgba(51,39,29,.06);transition:transform .4s var(--ease),box-shadow .4s var(--ease);text-decoration:none;min-height:196px}
.news-card:hover{transform:translateY(-6px);box-shadow:0 22px 48px rgba(51,39,29,.13)}
.news-card.gold{border-top-color:var(--gold)}
.news-card.muted{border-top-color:#9a8f80}
.nc-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.nc-head time{font-family:var(--lat);font-size:.95rem;font-weight:600;letter-spacing:.06em;color:var(--gold-deep)}
.nc-title{font-family:var(--serif);font-weight:600;font-size:1.05rem;line-height:1.7;color:var(--ink);margin:0;flex:1}
.nc-more{font-size:.82rem;font-weight:500;color:var(--teal-deep);display:inline-flex;align-items:center;gap:7px;margin-top:auto;padding-top:8px}
.nc-more::after{content:"\2192";transition:transform .3s var(--ease)}
.news-card:hover .nc-more::after{transform:translateX(4px)}
.news-card:hover .nc-title{color:var(--teal-deep)}
@media(max-width:900px){
  .news-cards{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto}
  .news-card{min-height:0}
}

/* ============================================================
   LINE / floating / worry / timeline  (4th pass)
   ============================================================ */
/* LINE buttons */
.btn-line{background:#06C755;color:#fff;box-shadow:0 6px 18px rgba(6,199,85,.32)}
.btn-line:hover{background:#05b34c;transform:translateY(-2px);box-shadow:0 10px 26px rgba(6,199,85,.4)}
.btn-line svg{width:20px;height:20px}

/* Mobile sticky bar — 3 buttons */
.mobile-cta.cta3{grid-template-columns:1fr 1fr 1.2fr}
.mobile-cta .m-line{background:#06C755;color:#fff}

/* Floating LINE (desktop only; mobile uses the sticky bar) */
.fab-line{position:fixed;right:24px;bottom:26px;z-index:80;display:inline-flex;align-items:center;gap:9px;background:#06C755;color:#fff;padding:13px 20px;border-radius:40px;box-shadow:0 10px 30px rgba(6,199,85,.4);font-size:.88rem;font-weight:500;transition:transform .3s var(--ease),box-shadow .3s}
.fab-line svg{width:22px;height:22px}
.fab-line:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(6,199,85,.5)}
@media(max-width:860px){.fab-line{display:none}}

/* お悩み別 (worry) */
.worry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.worry-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:11px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:28px 18px;box-shadow:0 10px 28px rgba(51,39,29,.05);transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s;text-decoration:none}
.worry-card:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(51,39,29,.12);border-color:rgba(219,127,48,.4)}
.wc-ic{width:54px;height:54px;border-radius:50%;background:var(--bg-tint);display:grid;place-items:center;color:var(--teal-deep);transition:background .4s,color .4s}
.worry-card:hover .wc-ic{background:var(--teal-deep);color:#fff}
.wc-ic svg{width:28px;height:28px}
.worry-card b{font-family:var(--serif);font-weight:600;font-size:.98rem;color:var(--ink);line-height:1.5}
.wc-sub{font-size:.78rem;color:var(--ink-soft);line-height:1.5}
.wc-sub em{font-style:normal;color:var(--gold-deep);font-weight:600}
@media(max-width:900px){.worry-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.worry-grid{gap:12px}.worry-card{padding:22px 12px}}

/* Career timeline */
.timeline{max-width:600px;margin:0 auto;position:relative}
.timeline::before{content:"";position:absolute;left:61px;top:10px;bottom:14px;width:2px;background:linear-gradient(var(--teal),rgba(219,127,48,.2))}
.tl-item{position:relative;display:grid;grid-template-columns:56px 1fr;gap:30px;padding:8px 0 20px}
.tl-year{font-family:var(--lat);font-size:1.15rem;font-weight:600;color:var(--gold-deep);text-align:right;padding-top:1px}
.tl-item::before{content:"";position:absolute;left:55px;top:8px;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--teal);z-index:1}
.tl-c b{font-family:var(--serif);font-weight:600;font-size:1.02rem;color:var(--ink);display:block;line-height:1.6}
.tl-c span{font-size:.85rem;color:var(--ink-soft)}

/* ============================================================
   Commitment — 画像↔文字 左右交互（シュシュ風）(5th pass)
   ============================================================ */
.commit-rows{display:flex;flex-direction:column;gap:72px;max-width:1040px;margin:0 auto}
.commit-row{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.commit-row.reverse .cr-img{order:2}
.cr-img{position:relative;border-radius:8px;overflow:hidden;box-shadow:0 22px 50px rgba(58,44,32,.14)}
.cr-img img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 18%;display:block;transition:transform .8s var(--ease)}
.commit-row:hover .cr-img img{transform:scale(1.04)}
.cr-num{position:absolute;top:14px;left:18px;z-index:2;font-family:var(--lat);font-size:2.7rem;font-weight:600;color:#fff;line-height:1;text-shadow:0 2px 16px rgba(0,0,0,.4)}
.cr-text{padding:0 4px}
.cr-en{font-family:var(--lat);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-deep);font-weight:600;display:block;margin-bottom:12px}
.cr-text h3{font-family:var(--serif);font-weight:600;font-size:clamp(1.3rem,2.4vw,1.7rem);line-height:1.65;letter-spacing:.03em;color:var(--ink);margin-bottom:18px;padding-bottom:18px;position:relative}
.cr-text h3::after{content:"";position:absolute;left:0;bottom:0;width:46px;height:2px;background:var(--teal)}
.cr-text p{color:var(--ink-soft);font-size:.96rem;line-height:2.1;text-wrap:pretty}
@media(max-width:820px){
  .commit-rows{gap:46px}
  .commit-row{grid-template-columns:1fr;gap:20px}
  .commit-row.reverse .cr-img{order:0}
  .cr-img img{aspect-ratio:16/10}
  .cr-num{font-size:2.2rem}
}

/* clean-up: concept phrase wrap on mobile (fixes right-edge clip) */
@media(max-width:640px){
  .concept h2 .ph{display:inline}
  .concept h2{font-size:clamp(1rem,4.4vw,2rem);line-height:2}
}

/* ==== Treatment detail extras (implant) ==== */
.tsub{font-family:var(--serif);font-weight:600;font-size:1.3rem;text-align:center;margin:58px 0 20px;color:var(--ink);letter-spacing:.04em}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:6px 0}
.mdbox{background:#fff;border:1px solid var(--line);border-radius:8px;padding:26px 28px;box-shadow:0 10px 28px rgba(51,39,29,.05)}
.mdbox h4{font-family:var(--serif);font-weight:600;font-size:1.1rem;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line);color:var(--ink)}
.mdbox.merit h4{color:var(--teal-deep)}
.mdbox ul{list-style:none;display:grid;gap:9px}
.mdbox li{font-size:.9rem;color:var(--ink-soft);line-height:1.7;padding-left:20px;position:relative}
.mdbox.merit li::before{content:"\25CB";position:absolute;left:0;color:var(--teal);font-size:.82rem;top:.15em}
.mdbox.demerit li::before{content:"\25B3";position:absolute;left:0;color:#c08a4a;font-size:.78rem;top:.15em}
.cmp-desc{font-size:.88rem;color:var(--ink-soft);margin-bottom:12px;line-height:1.75}
.cmp-l{font-size:.85rem;color:var(--teal-deep);margin-bottom:6px;line-height:1.6}
.cmp-x{font-size:.85rem;color:#9a7b52;line-height:1.6}
@media(max-width:700px){.grid2{grid-template-columns:1fr;gap:18px}.tsub{margin:44px 0 18px}}

/* ==== Career list + Price table ==== */
.career{max-width:600px;margin:0 auto}
.career-sub{font-family:var(--serif);font-weight:600;font-size:1.05rem;color:var(--teal-deep);margin:28px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.career-sub:first-child{margin-top:0}
.career-list{list-style:none;display:grid;gap:10px}
.career-list li{font-size:.94rem;color:var(--ink-soft);line-height:1.7;padding-left:18px;position:relative}
.career-list li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--teal)}
.price-h:first-of-type{margin-top:0}
.price-wrap{max-width:820px;margin:0 auto;overflow-x:auto}
.price-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.price-table thead th{background:var(--bg-deep);color:#fff;font-weight:500;font-size:.9rem;padding:13px 18px;text-align:left}
.price-table thead th:last-child{text-align:right}
.price-table td{padding:14px 18px;border-top:1px solid var(--line);font-size:.92rem;color:var(--ink)}
.price-table td.p{text-align:right;font-weight:600;color:var(--teal-deep);white-space:nowrap}
.price-table tbody tr:nth-child(even){background:rgba(219,127,48,.035)}
.price-note{max-width:820px;margin:10px auto 0;font-size:.82rem;color:var(--ink-soft)}

/* ==== Reservation page (ルチェンテ参考) ==== */
.rsv-feats{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;max-width:820px;margin:0 auto 40px}
.rsv-feat{display:inline-flex;align-items:center;gap:9px;font-size:.88rem;font-weight:500;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:40px;padding:9px 20px 9px 14px;box-shadow:0 6px 18px rgba(51,39,29,.05)}
.rsv-feat .ic{width:20px;height:20px;color:var(--teal-deep);display:inline-flex}
.rsv-feat .ic svg{width:100%;height:100%}
.rsv-cards{display:grid;gap:16px;max-width:720px;margin:0 auto}
.rsv-card{display:flex;align-items:center;gap:18px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px 24px;box-shadow:0 12px 30px rgba(51,39,29,.06);text-decoration:none;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.rsv-card:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(51,39,29,.13)}
.rsv-ic{width:52px;height:52px;border-radius:14px;flex:0 0 auto;display:grid;place-items:center;color:#fff}
.rsv-ic svg{width:26px;height:26px}
.rsv-card.web .rsv-ic{background:var(--gold)}
.rsv-card.line .rsv-ic{background:#06C755}
.rsv-card.tel .rsv-ic{background:var(--bg-deep)}
.rsv-tx{flex:1;min-width:0}
.rsv-tx b{font-family:var(--serif);font-weight:600;font-size:1.12rem;color:var(--ink);display:block;letter-spacing:.02em}
.rsv-tx small{font-size:.82rem;color:var(--ink-soft);display:block;margin-top:3px;line-height:1.6}
.rsv-go{flex:0 0 auto;font-size:.86rem;font-weight:600;color:#fff;padding:11px 20px;border-radius:40px;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.rsv-go::after{content:"\2192"}
.rsv-card.web .rsv-go{background:var(--gold)}
.rsv-card.line .rsv-go{background:#06C755}
.rsv-card.tel .rsv-go{background:var(--teal-deep)}
@media(max-width:560px){
  .rsv-card{flex-wrap:wrap;gap:14px}
  .rsv-tx{flex:1 1 calc(100% - 70px)}
  .rsv-go{width:100%;justify-content:center;order:3}
}

/* ==== inline figure in treatment pages ==== */
.tfig{max-width:600px;margin:26px auto 0;border-radius:8px;overflow:hidden;box-shadow:0 12px 30px rgba(51,39,29,.08);background:#fff}
.tfig img{width:100%;display:block}
.tfig.sm{max-width:460px}

/* 狭い端末（iPhone SE 等）：キャッチが不自然に折れるのを防ぐ */
@media(max-width:360px){
  .hero-inner{padding-left:5.5vw;padding-right:5.5vw}
  .hero-badges{gap:6px;margin-bottom:11px}
  .hero-badges span{font-size:.64rem;padding:5px 9px}
  .hero-catch .l1{font-size:1.08rem}
  .hero-catch .l2,.hero-catch .l3{font-size:1.46rem}
  .hero-sub{font-size:.88rem;line-height:1.85;margin-top:12px}
  .hero-info-box .hi b{font-size:.72rem}
}

/* ===================== ヒーロー：写真カルーセル＋アイコンメニュー ===================== */
.hero{--slide-w:min(800px,54vw);--stage-h:clamp(360px,58vh,660px);
  padding:clamp(104px,12vh,140px) 0 clamp(26px,4vh,46px)}
.hs-stage{position:relative}
.hs-viewport{overflow:hidden;width:100%}
.hs-track{display:flex;gap:22px;will-change:transform;
  transition:transform .8s cubic-bezier(.22,1,.36,1)}
.hs-slide{flex:0 0 var(--slide-w);height:var(--stage-h);margin:0;
  border-radius:18px;overflow:hidden;background:#fff;
  opacity:.34;transition:opacity .8s cubic-bezier(.22,1,.36,1);
  box-shadow:0 34px 64px -44px rgba(51,39,29,.55)}
.hs-slide.is-active{opacity:1}
.hs-slide img{width:100%;height:100%;object-fit:cover;object-position:center 24%;display:block}

.hs-arrow{position:absolute;top:calc(var(--stage-h) / 2);transform:translateY(-50%);
  width:54px;height:54px;border-radius:50%;padding:0;cursor:pointer;z-index:4;
  border:1px solid var(--line);background:rgba(255,255,255,.92);color:var(--ink);
  display:grid;place-items:center;transition:all .3s var(--ease);
  box-shadow:0 12px 28px -16px rgba(51,39,29,.45)}
.hs-arrow:hover{background:#fff;color:var(--teal-deep);transform:translateY(-50%) scale(1.06)}
.hs-arrow svg{width:22px;height:22px}
.hs-prev{left:calc(50% - var(--slide-w) / 2 - 27px)}
.hs-next{right:calc(50% - var(--slide-w) / 2 - 27px)}

.hs-catch{position:absolute;z-index:5;margin:0;top:calc(var(--stage-h) * .09);
  right:calc(50% - var(--slide-w) / 2 + 26px);pointer-events:none}
.hs-catch span{writing-mode:vertical-rl;display:inline-block;
  font-family:var(--sans);font-weight:700;letter-spacing:.2em;
  font-size:clamp(1.25rem,2vw,1.85rem);color:var(--ink);
  text-shadow:0 2px 16px rgba(253,252,250,.95),0 0 34px rgba(253,252,250,.85)}

.hs-dots{display:flex;justify-content:center;gap:9px;margin-top:22px}
.hs-dot{width:9px;height:9px;border-radius:50%;border:0;padding:0;cursor:pointer;
  background:rgba(51,39,29,.22);transition:all .35s var(--ease)}
.hs-dot.is-on{background:var(--teal-deep);width:26px;border-radius:5px}

.hero-menu{margin-top:clamp(20px,3.4vh,38px)}
.hero-menu ul{list-style:none;margin:0 auto;padding:0 5vw;max-width:1200px;
  display:flex;align-items:center;justify-content:center;gap:clamp(8px,2.1vw,32px)}
.hero-menu a{display:flex;flex-direction:column;align-items:center;gap:7px;
  text-decoration:none;color:var(--ink);padding:8px 6px;border-radius:12px;
  transition:transform .3s var(--ease),color .3s var(--ease)}
.hero-menu a:hover{color:var(--teal-deep);transform:translateY(-3px)}
.hero-menu svg{width:30px;height:30px;color:var(--teal-deep)}
.hero-menu b{font-size:.9rem;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.hero-menu span{font-family:var(--lat);font-size:.62rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-deep)}
.hm-logo a{padding:0}
.hm-logo img{width:clamp(128px,13vw,188px);height:auto;display:block}

@media(max-width:860px){
  .hero{--slide-w:78vw;--stage-h:clamp(288px,42vh,400px);
    padding:calc(72px + 16px) 0 24px}
  .hs-track{gap:12px}
  .hs-slide{border-radius:14px}
  .hs-arrow{width:40px;height:40px}
  .hs-arrow svg{width:18px;height:18px}
  .hs-prev{left:8px}
  .hs-next{right:8px}
  .hs-dots{margin-top:16px}
  /* スマホは縦書きをやめ、写真の下に1行で置く */
  .hs-catch{position:static;text-align:center;margin:15px 0 0}
  .hs-catch span{writing-mode:horizontal-tb;font-size:clamp(1.15rem,5.4vw,1.5rem);
    letter-spacing:.07em;text-shadow:none;color:var(--teal-deep)}
  .hero-menu{margin-top:18px}
  .hero-menu ul{flex-wrap:wrap;gap:2px 0;padding:0 3vw}
  .hero-menu li{flex:0 0 33.333%}
  .hero-menu .hm-logo{display:none}
  .hero-menu a{padding:11px 4px;gap:5px}
  .hero-menu svg{width:26px;height:26px}
  .hero-menu b{font-size:.78rem}
  .hero-menu span{font-size:.54rem}
}
@media(max-width:360px){
  .hero-menu b{font-size:.72rem}
  .hero-menu svg{width:23px;height:23px}
}
@media(prefers-reduced-motion:reduce){
  .hs-track{transition:none}
  .hs-slide{transition:none}
}

/* ===== ヒーロー写真を歯の形に切り抜く ===== */
.hs-defs{position:absolute;width:0;height:0;overflow:hidden}
.hero{--slide-w:min(460px,34vw);--stage-h:calc(var(--slide-w) * 1.18)}
.hs-slide{border-radius:0;background:none;overflow:visible;
  filter:drop-shadow(0 26px 34px rgba(51,39,29,.26))}
.hs-slide img{-webkit-clip-path:url(#toothClip);clip-path:url(#toothClip);
  object-position:center 22%}
.hs-prev{left:calc(50% - var(--slide-w) / 2 - 40px)}
.hs-next{right:calc(50% - var(--slide-w) / 2 - 40px)}
.hs-catch{top:calc(var(--stage-h) * .04);right:calc(50% - var(--slide-w) / 2 - 104px)}
@media(max-width:860px){
  .hero{--slide-w:min(70vw,320px);--stage-h:calc(var(--slide-w) * 1.18)}
  .hs-slide{filter:drop-shadow(0 16px 22px rgba(51,39,29,.22))}
  .hs-prev{left:8px}
  .hs-next{right:8px}
}

/* ===== 奥行き（中央を大きく・左右を小さく）＋ 歯の輪郭に沿う枠線 ===== */
.hs-track{gap:12px}
.hs-slide{position:relative;transform:scale(.60);opacity:.72;z-index:1;
  transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .8s cubic-bezier(.22,1,.36,1)}
.hs-slide.is-active{transform:scale(1);opacity:1;z-index:2}
.hs-outline{position:absolute;inset:0;width:100%;height:100%;
  color:#fff;pointer-events:none;overflow:visible}
@media(max-width:860px){
  .hs-track{gap:8px}
  .hs-slide{transform:scale(.64)}
  .hs-outline path{stroke-width:2.5}
}
@media(prefers-reduced-motion:reduce){ .hs-slide{transition:none} }
/* 枠線：白い縁取り＋中央に細い暖色ライン（白い写真でも輪郭が見える） */
.hs-outline .ol-w{stroke-width:7}
.hs-outline .ol-l{stroke-width:1.6}
@media(max-width:860px){
  .hs-outline .ol-w{stroke-width:5}
  .hs-outline .ol-l{stroke-width:1.3}
}

/* ===== メニュー中央のロゴ：大きく＋下に飾り罫（参考サイトの見せ方に合わせる） ===== */
.hero-menu .hm-logo{display:flex;flex-direction:column;align-items:center;gap:11px;
  padding:0 clamp(6px,1.2vw,20px)}
.hm-logo img{width:clamp(160px,17vw,236px)}
.hm-logo::after{content:"";display:block;width:min(100%,236px);height:5px;
  background:
    radial-gradient(circle at 2.5px 50%, var(--gold-deep) 2.5px, transparent 2.6px) left center/50% 100% no-repeat,
    radial-gradient(circle at calc(100% - 2.5px) 50%, var(--gold-deep) 2.5px, transparent 2.6px) right center/50% 100% no-repeat,
    linear-gradient(90deg, rgba(160,120,80,.42), rgba(160,120,80,.42)) center center/calc(100% - 12px) 1px no-repeat}
@media(max-width:860px){
  /* スマホはヘッダーにロゴがあるため非表示のまま（既定を維持） */
  .hero-menu .hm-logo{display:none}
}

/* ===== 携帯：左右のチラ見せをやめ、歯を1枚だけ中央に置く（参考サイトの携帯版に合わせる） ===== */
@media(max-width:860px){
  .hero{--slide-w:min(84vw,350px)}
  /* 隣のスライドを画面外へ押し出す量。中央寄せの計算はJSがoffsetLeftで行うため崩れない */
  .hs-track{gap:52px}
  .hs-slide{transform:scale(.70)}
  .hs-slide.is-active{transform:scale(1)}
}

/* ===== 影の作り直し：親のfilterは長方形の影になるので廃止し、
       歯型に塗りつぶしたSVGを画像の下に敷いて、そこに影を掛ける ===== */
.hs-slide{filter:none}
.hs-shadow{position:absolute;inset:0;width:100%;height:100%;z-index:0;
  filter:drop-shadow(0 24px 30px rgba(51,39,29,.26))}
.hs-slide img{position:relative;z-index:1}
.hs-outline{z-index:2}
@media(max-width:860px){
  .hs-slide{filter:none}
  .hs-shadow{filter:drop-shadow(0 14px 20px rgba(51,39,29,.22))}
}

/* 影レイヤーだけ箱より18%大きくして、箱の縁で影が断ち切られる縦線をなくす。
   viewBoxを -0.18..1.18 にしてあるので、歯そのものの位置・大きさは変わらない。 */
.hs-shadow{position:absolute;inset:-18%;width:136%;height:136%;overflow:visible}

/* 初期カルーセルCSSに残っていた矩形の box-shadow を消す。
   （clip-pathで歯型にしても box-shadow は要素の四角に沿って描かれ、
     箱の縁に縦線として見えていた。影は .hs-shadow レイヤーが担当する） */
.hs-slide{box-shadow:none}

/* ===== 携帯もキャッチを縦書きに（写真の右わきに立てる） ===== */
@media(max-width:860px){
  .hs-catch{position:absolute;z-index:5;margin:0;text-align:initial;
    top:calc(var(--stage-h) * .07);
    right:6px;pointer-events:none}
  .hs-catch span{writing-mode:vertical-rl;display:inline-block;
    font-size:clamp(1.05rem,4.6vw,1.35rem);letter-spacing:.16em;
    color:var(--ink);
    text-shadow:0 2px 12px rgba(253,252,250,.96),0 0 24px rgba(253,252,250,.9)}
  /* 縦書きにして流れから外れた分、ドットの位置を詰める */
  .hs-dots{margin-top:14px}
}
@media(max-width:360px){
  .hs-catch{right:4px}
  .hs-catch span{font-size:1.02rem;letter-spacing:.13em}
}

/* ちぎり縁パスは <use> 参照。線幅はここで一括指定 */
.hs-outline .ol-w{stroke-width:7px}
.hs-outline .ol-l{stroke-width:1.6px}
@media(max-width:860px){
  .hs-outline .ol-w{stroke-width:5px}
  .hs-outline .ol-l{stroke-width:1.3px}
  /* 縦書きキャッチをヒーロー画像に重ねる（クルミと同じ見せ方） */
  .hs-catch{right:clamp(16px,7vw,34px)}
}

/* ===== キャッチ：2行の縦書き（右列→左列）／クルミと同じ位置＝画像の右わき中央 ===== */
.hs-catch{writing-mode:vertical-rl}
.hs-catch span{writing-mode:horizontal-tb;display:block}
.hs-catch{top:50%;transform:translateY(-50%)}
.hs-catch span{writing-mode:vertical-rl;line-height:1.15}
.hs-catch span + span{margin-right:.34em}

/* ===== 画像がメニューにかかるように（クルミと同じ重ね方） ===== */
.hs-dots{margin-top:calc(-1 * clamp(30px,5vh,64px));position:relative;z-index:6}
.hero-menu{margin-top:clamp(6px,1.2vh,16px);position:relative;z-index:6}

@media(max-width:860px){
  .hs-catch{top:50%;transform:translateY(-50%);right:clamp(14px,6vw,30px)}
  .hs-catch span{font-size:clamp(1.02rem,4.4vw,1.3rem);letter-spacing:.14em}
  .hs-dots{margin-top:calc(-1 * clamp(22px,4vh,44px))}
  .hero-menu{margin-top:8px}
}

/* ===== ヘッダーを白に ===== */
header{background:#fff;box-shadow:0 1px 0 rgba(51,39,29,.08)}
header.scrolled{background:#fff}
@media(max-width:860px){
  header{background:#fff}
  /* 縦書きキャッチを「›」矢印から離し、より画像側へ寄せる */
  .hs-catch{right:clamp(52px,14vw,66px)}
}

/* ===== ヒーロー画像をヘッダー（メニューバー）の下に潜り込ませる ===== */
.hero{padding-top:clamp(52px,7vh,84px)}
@media(max-width:860px){
  .hero{padding-top:40px}
}
@media(max-width:360px){
  .hero{padding-top:34px}
}

/* 縦書きキャッチをもう少し下へ */
.hs-catch{top:64%}
@media(max-width:860px){ .hs-catch{top:64%} }

/* ===== コンセプトの見出しをクルミ風に（script + 点線 + サブ + ボタン） ===== */
.concept .cc-label{font-family:var(--lat);font-style:italic;line-height:1;margin:0;
  font-size:clamp(1.5rem,4.2vw,2.15rem);color:var(--teal-deep);letter-spacing:.05em}
.concept .cc-dots{display:block;width:1px;height:34px;margin:15px auto 13px;
  background:repeating-linear-gradient(to bottom,var(--gold-deep) 0 2px,transparent 2px 6px)}
.concept .cc-sub{font-size:.98rem;font-weight:600;letter-spacing:.14em;color:var(--ink);margin:0}
.concept .cc-more{margin-top:38px}

/* ===== 携帯はアイコンメニューを出さず、ヒーローの直後をコンセプトにする（クルミと同じ） ===== */
@media(max-width:860px){
  .hero-menu{display:none}
  .hs-dots{margin-top:calc(-1 * clamp(16px,3vh,30px))}
  .hero{padding-bottom:18px}
  .concept{padding:56px 0 62px}
  .concept .cc-dots{height:28px;margin:12px auto 11px}
  .concept h2{margin:20px 0 22px;line-height:1.95}
  .concept .cc-more{margin-top:28px}
}

/* ===== コンセプトのバランス調整（クルミに倣い、要素の大小差をならす） ===== */
@media(max-width:860px){
  .concept{padding:52px 0 58px}
  /* 背景の飾り文字が大きすぎて視線を散らすので控えめに */
  .concept .bloom{font-size:34vw;top:-3%;right:-8%;color:rgba(219,127,48,.045)}
  .concept .cc-label{font-size:1.62rem}
  .concept .cc-dots{height:26px;margin:11px auto 10px}
  .concept .cc-sub{font-size:.86rem;letter-spacing:.18em;color:var(--ink-soft)}
  /* 見出しが突出していたので縮める（本文との差を詰める） */
  .concept h2{font-size:1.28rem;line-height:1.92;letter-spacing:.045em;margin:24px 0 18px}
  .concept p{font-size:.92rem;line-height:1.95;max-width:20em}
  .concept .cc-more{margin-top:30px}
}

/* コンセプト本文の出し分け（既定=PC） */
.concept .cc-body.sp-only{display:none}
@media(max-width:860px){
  .concept .cc-body.pc-only{display:none}
  .concept .cc-body.sp-only{display:block}
  /* 飾り文字は "concept" に重なるので携帯では出さない */
  .concept .bloom{display:none}
  /* 見出しは語句の途中で折らない＋さらに小さく */
  .concept h2{font-size:1.16rem;line-height:1.95;margin:22px 0 16px}
  .concept h2 .ph{white-space:nowrap}
  .concept .cc-more{margin-top:26px}
}

/* ===== コンセプト微調整 ===== */
/* letter-spacing は最終文字の後ろにも入るため、中央寄せが左にズレる。
   同量の text-indent で打ち消して光学的に中央へ。 */
.concept .cc-label{text-indent:.05em}
.concept .cc-sub{text-indent:.18em}
/* ボタンを横長に */
.concept .cc-more .btn{min-width:210px;justify-content:center;padding-left:44px;padding-right:44px}
@media(max-width:860px){
  .concept .cc-label{font-size:2rem}          /* concept を大きく */
  .concept .cc-more .btn{min-width:196px;padding-left:40px;padding-right:40px}
}
@media(max-width:360px){
  .concept .cc-label{font-size:1.8rem}
  .concept .cc-more .btn{min-width:172px;padding-left:30px;padding-right:30px}
}

/* 真因：.cc-sub に margin:0 が効いており、.concept p の max-width で細くなった箱が
   左寄せのままだった（letter-spacing ではなかった）。auto で中央へ戻す。 */
.concept .cc-sub{max-width:none;margin-left:auto;margin-right:auto}
.concept .cc-label{max-width:none;margin-left:auto;margin-right:auto}

/* 縦書きキャッチをさらに下へ */
.hs-catch{top:74%}
@media(max-width:860px){ .hs-catch{top:74%} }

/* 縦書きはインライン方向が「縦」なので、下に寄せるほど使える高さが減って
   勝手に列が増える。nowrap で1列＝1文にして固定する。 */
.hs-catch span{white-space:nowrap}
.hs-catch{height:max-content}

/* 縦書きキャッチをさらに下（歯の下部へ） */
.hs-catch{top:88%}
@media(max-width:860px){ .hs-catch{top:88%} }

/* ===== こだわり：画像は左から、文字は右から出す ===== */
/* 行そのものは動かさず（.reveal の下からフェードを打ち消し）、子要素を左右から入れる */
.commit-row.reveal{opacity:1;transform:none;transition:none}
.commit-row .cr-img{opacity:0;transform:translateX(-48px);
  transition:opacity .95s var(--ease),transform 1.05s var(--ease)}
.commit-row .cr-text{opacity:0;transform:translateX(48px);
  transition:opacity .95s var(--ease) .14s,transform 1.05s var(--ease) .14s}
.commit-row.in .cr-img,.commit-row.in .cr-text{opacity:1;transform:none}

/* PCで画像が右に来る行（.reverse）は、交差して見えないよう左右を入れ替える */
@media(min-width:861px){
  .commit-row.reverse .cr-img{transform:translateX(48px)}
  .commit-row.reverse .cr-text{transform:translateX(-48px)}
  .commit-row.reverse.in .cr-img,.commit-row.reverse.in .cr-text{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .commit-row .cr-img,.commit-row .cr-text{opacity:1;transform:none;transition:none}
}

/* ===== 中盤のアイコンラッシュを解消（参考サイト クルミ歯科はアイコン0個） =====
   「お悩み別」8個 ＋「診療案内」9個 の計17個が連続し、しかも同じ絵柄が
   2セクションで重複していた。文字だけで意味が通る箇所なのでアイコンを外す。
   ※アクセスの駅・駐車場・時間、下部CTA、PCのヒーローメニューは情報伝達に
     効いているので残す。 */
.worry-card .wc-ic{display:none}
.svc .ic{display:none}
/* アイコン分の余白を詰めて間延びを防ぐ */
.worry-card{gap:8px;padding:22px 18px}
.svc{padding:30px 30px}

/* ===== 診療案内：横スクロールの丸カード（参考: クルミ歯科の menu） ===== */
.svc-car{position:relative;margin-top:40px}
.svc-track{display:flex;gap:clamp(14px,2.4vw,26px);overflow-x:auto;scroll-snap-type:x mandatory;
  padding:6px clamp(14px,6vw,64px) 10px;scroll-padding-inline:clamp(14px,6vw,64px);
  -webkit-overflow-scrolling:touch;scrollbar-width:none}
.svc-track::-webkit-scrollbar{display:none}
.svc-card{flex:0 0 clamp(146px,42vw,188px);aspect-ratio:1;scroll-snap-align:center;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  border-radius:50%;text-decoration:none;text-align:center;padding:14px;
  background:var(--bg-tint);color:var(--ink);
  transition:transform .45s var(--ease),background .45s var(--ease),color .45s var(--ease);
  box-shadow:0 14px 30px -18px rgba(0,0,0,.45)}
.svc-card:hover{transform:translateY(-5px);background:var(--gold);color:#fff}
.svc-card .sc-en{font-family:var(--lat);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-deep);font-weight:600;transition:color .45s var(--ease)}
.svc-card:hover .sc-en{color:#fff}
.svc-card b{font-family:var(--serif);font-weight:600;font-size:clamp(.88rem,2.6vw,1rem);line-height:1.5}
.svc-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:44px;height:44px;border-radius:50%;padding:0;cursor:pointer;
  border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.92);color:var(--ink);
  display:grid;place-items:center;transition:all .3s var(--ease)}
.svc-arrow:hover{background:#fff;color:var(--teal-deep)}
.svc-arrow svg{width:19px;height:19px}
.svc-prev{left:4px}
.svc-next{right:4px}
@media(max-width:860px){
  .svc-car{margin-top:28px}
  .svc-arrow{width:38px;height:38px}
  .svc-arrow svg{width:16px;height:16px}
}

/* 矢印がカードに重ならないよう、トラックの左右に矢印ぶんの余白を確保 */
.svc-track{padding-left:clamp(56px,7vw,86px);padding-right:clamp(56px,7vw,86px);
  scroll-padding-inline:clamp(56px,7vw,86px)}
.svc-prev{left:6px}
.svc-next{right:6px}
@media(max-width:860px){
  .svc-card{flex:0 0 clamp(138px,40vw,168px)}
  .services{padding:56px 0 60px}
  .svc-car{margin-top:24px}
}

/* トラック自身の箱を左右に狭め、矢印はその外側の溝に置く。
   （padding だとスクロール時にカードが padding 領域を通過して重なる） */
.svc-car{padding:0 clamp(50px,7vw,82px)}
.svc-track{padding-left:4px;padding-right:4px;scroll-padding-inline:4px}
.svc-prev{left:4px}
.svc-next{right:4px}

/* クルミ同様「画面端で切れる」形に。トラックは全幅、矢印は端に重ねるが
   scroll-snap-align:start にしてカードの文字が矢印の下に来ないようにする。 */
.svc-car{padding:0}
.svc-track{padding-left:16px;padding-right:16px;scroll-padding-inline:16px}
.svc-card{scroll-snap-align:start}
.svc-prev{left:2px}
.svc-next{right:2px}
@media(max-width:860px){
  .svc-card{flex:0 0 clamp(140px,42vw,170px)}
}

/* ===== アクセス：reception time 型（参考 クルミ歯科） ===== */
.access .wrap.rt{max-width:680px;text-align:center}
.access .cc-label{font-family:var(--lat);font-style:italic;line-height:1;margin:0;
  font-size:clamp(1.6rem,4.4vw,2.15rem);color:var(--teal-deep);letter-spacing:.05em;
  max-width:none;margin-left:auto;margin-right:auto}
.access .cc-dots{display:block;width:1px;height:30px;margin:13px auto 12px;
  background:repeating-linear-gradient(to bottom,var(--gold-deep) 0 2px,transparent 2px 6px)}
.access .cc-sub{font-size:.95rem;font-weight:600;letter-spacing:.16em;color:var(--ink);
  margin:0 auto;max-width:none;text-indent:.16em}
.rt-note{font-size:.82rem;color:var(--ink-soft);margin:16px 0 14px}
.rt-table{border-top:1px dotted rgba(120,92,60,.4);border-bottom:1px dotted rgba(120,92,60,.4);padding:6px 0}
.rt-table .hours-table{width:100%;border-collapse:collapse}
.rt-table .hours-table th,.rt-table .hours-table td{padding:11px 2px;font-size:.86rem;text-align:center;border:0}
.rt-table .hours-table thead th{font-weight:600;color:var(--ink);font-size:.84rem}
.rt-table .hours-table tbody th{text-align:left;white-space:nowrap;color:var(--ink-soft);font-weight:500;font-size:.8rem}
.rt-table .hours-table .o{color:var(--teal-deep)}
.rt-table .hours-table .x{color:rgba(51,39,29,.35)}
.rt-closed{font-size:.8rem;color:var(--ink-soft);margin:12px 0 0}
.rt-tel{display:block;font-family:var(--lat);font-size:clamp(1.5rem,6vw,2.1rem);letter-spacing:.04em;
  color:var(--ink);text-decoration:none;margin:26px 0 4px;font-weight:500}
.rt-tel:hover{color:var(--teal-deep)}
.rt-telsub{font-size:.78rem;color:var(--ink-soft);margin:0}
.rt-map{margin:26px 0 22px;border-radius:12px;overflow:hidden;border:1px solid var(--line);
  box-shadow:0 14px 34px -22px rgba(51,39,29,.4)}
.rt-map iframe{display:block;width:100%;height:clamp(220px,34vh,300px);border:0}
.rt-meta{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;text-align:left;margin:0 auto 4px;max-width:560px}
.rt-meta dt{font-size:.74rem;letter-spacing:.12em;color:var(--gold-deep);font-weight:600;white-space:nowrap;padding-top:2px}
.rt-meta dd{margin:0;font-size:.88rem;line-height:1.85;color:var(--ink-soft)}
.access .cc-more{margin-top:26px}
@media(max-width:860px){
  .rt-table .hours-table th,.rt-table .hours-table td{padding:9px 1px;font-size:.8rem}
  .rt-table .hours-table tbody th{font-size:.72rem}
  .rt-meta{grid-template-columns:1fr;gap:2px 0}
  .rt-meta dd{margin-bottom:10px}
}

/* 旧レイアウト用の濃い背景が thead に残っていて文字が読めなかったので解除 */
.rt-table .hours-table thead,
.rt-table .hours-table thead tr,
.rt-table .hours-table thead th{background:transparent;color:var(--ink)}
.rt-table .hours-table thead th:first-child{color:transparent}
.rt-table .hours-table thead th.sat{color:#2f7fa6}
.rt-table .hours-table thead th.sun{color:#c0533f}
.rt-table .hours-table tbody th,
.rt-table .hours-table tbody td{background:transparent}

/* ===== 診療時間の表をクルミに合わせる（罫線をはっきり／サンセリフ／太字） ===== */
.rt-table{border-top:0;border-bottom:0;padding:0}
.rt-table .hours-table{font-family:var(--sans)}
.rt-table .hours-table th,
.rt-table .hours-table td{
  border:0;border-bottom:2px solid rgba(141,109,82,.7);
  font-weight:700;font-size:.9rem;letter-spacing:.06em;color:var(--ink);padding:13px 2px}
.rt-table .hours-table tbody tr:last-child th,
.rt-table .hours-table tbody tr:last-child td{border-bottom:2px solid rgba(141,109,82,.7)}
.rt-table .hours-table tbody th{font-size:.82rem;letter-spacing:.02em}
.rt-table .hours-table .o{font-weight:700}
.rt-table .hours-table .x{color:rgba(51,39,29,.4);font-weight:700}
/* TEL は旧様式数字の明朝をやめてサンセリフに（クルミ同様くっきり） */
.rt-tel{font-family:var(--sans);font-weight:700;letter-spacing:.02em;
  font-feature-settings:"lnum" 1;font-variant-numeric:lining-nums}
@media(max-width:860px){
  .rt-table .hours-table th,.rt-table .hours-table td{font-size:.84rem;padding:11px 1px}
  .rt-table .hours-table tbody th{font-size:.75rem}
}

/* 丸カードの中にアイコンを戻す（円の上半分にアイコン・下に文字） */
.svc-card{justify-content:center;gap:6px;padding:10px 12px}
.svc-card .sc-ic{display:block;width:clamp(30px,8vw,38px);height:clamp(30px,8vw,38px);
  color:var(--gold-deep);transition:color .45s var(--ease);margin-bottom:2px}
.svc-card .sc-ic svg{width:100%;height:100%;stroke-width:1.3}
.svc-card:hover .sc-ic{color:#fff}

/* 地図にも表と同じ枠線を（既定の var(--line) は薄すぎて見えなかった） */
.rt-map{border:2px solid rgba(141,109,82,.7);border-radius:8px}

/* ===== 設備：丸リング → 四角カード＋黒枠＋番号（参考 クルミの introduce） ===== */
.equip-grid{grid-template-columns:repeat(3,1fr);gap:26px 20px}
.eq{text-align:left}
.eq .ring{width:100%;height:auto;aspect-ratio:4/3;margin:0 0 12px;
  border-radius:4px;border:1.5px solid rgba(51,39,29,.8);background:var(--bg-tint);
  display:grid;place-items:center;position:relative;overflow:hidden}
.eq .ring svg{width:clamp(38px,7vw,54px);height:clamp(38px,7vw,54px)}
.eq .num{position:absolute;top:7px;right:10px;font-family:var(--lat);font-style:italic;
  font-size:.86rem;color:var(--gold-deep);line-height:1}
.eq:hover .ring{background:var(--teal-deep);border-color:var(--teal-deep)}
.eq:hover .num{color:#fff}
.eq h3{font-size:.94rem;margin:0 0 6px;line-height:1.5}
.eq p{font-size:.82rem;line-height:1.8;color:var(--ink-soft);margin:0}
@media(max-width:860px){
  .equip{padding:56px 0 60px}
  .equip .head{margin-bottom:30px}
  .equip-grid{grid-template-columns:repeat(2,1fr);gap:20px 14px}
  .eq h3{font-size:.86rem}
  .eq p{font-size:.76rem;line-height:1.75}
}

/* 設備カードが小さすぎたので、グリッドの幅を広げてカードを大きく */
@media(max-width:860px){
  .equip .wrap{max-width:none;padding-left:5vw;padding-right:5vw}
  .equip-grid{gap:22px 12px}
  .eq .ring{border-radius:5px}
  .eq .ring svg{width:clamp(44px,12vw,58px);height:clamp(44px,12vw,58px)}
  .eq h3{font-size:.9rem;margin-bottom:5px}
  .eq p{font-size:.78rem}
}

/* 親の .wrap 幅に関係なく、設備グリッド自体を画面幅基準で広げる */
@media(max-width:860px){
  .equip-grid{width:90vw;max-width:none;margin-left:calc(50% - 45vw);margin-right:calc(50% - 45vw)}
}

/* ===== お知らせ：カード → 行リスト（日付｜タイトル｜»） ===== */
.news .sec-head{text-align:left;margin-bottom:26px}
.news .sec-head .eyebrow{order:2}
.news .sec-head .eyebrow::before,.news .sec-head .eyebrow::after{display:none}
.news .sec-head h2{margin:0 0 10px;font-size:clamp(1.15rem,4vw,1.5rem);letter-spacing:.1em}
.news .sec-head .eyebrow{display:block;font-family:var(--lat);font-size:.8rem;letter-spacing:.1em;
  color:var(--ink-soft);text-transform:none;margin:0}
.news .sec-head h2::after{content:"";display:block;width:34px;height:1px;
  background:rgba(51,39,29,.45);margin:12px 0 10px}
.news-cards{display:flex;flex-direction:column;gap:0}
.news-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(10px,3vw,26px);
  padding:16px 2px;border-top:1px solid rgba(51,39,29,.2);border-radius:0;
  min-height:0;
  background:none;box-shadow:none;transition:background .3s var(--ease)}
.news-card:last-of-type{border-bottom:1px solid rgba(51,39,29,.2)}
.news-card:hover{background:rgba(255,255,255,.5)}
.news-card .nc-head{display:flex;align-items:center;gap:10px;margin:0;
  padding-right:clamp(8px,3vw,22px);border-right:1px solid rgba(51,39,29,.18)}
.news-card .nc-head time{font-family:var(--lat);font-size:.86rem;color:var(--ink-soft);letter-spacing:.03em}
.news-card .nc-title{margin:0;font-size:.9rem;line-height:1.6;color:var(--ink)}
.news-card .nc-more{font-size:0;line-height:1}
.news-card .nc-more::after{content:"»";font-size:1.15rem;color:var(--gold-deep)}
@media(max-width:860px){
  .news-card{gap:10px;padding:14px 2px}
  .news-card .nc-head .tag{display:none}
  .news-card .nc-title{font-size:.84rem}
}
/* 見出しの並びを「お知らせ → 罫 → News」に */
.news .sec-head{display:flex;flex-direction:column;align-items:flex-start}
.news .sec-head h2{order:1}
.news .sec-head .eyebrow{order:2;margin-top:-2px}

/* ===== メニューが透ける不具合の修正 =====
   ①半透明+backdrop-filter をやめて完全不透明に（backdrop-filterは
     重なり順の文脈を作り、環境によって下の要素が抜けて見える）
   ②z-index をヘッダー(100)・追従ボタンより上へ
   ③地図の iframe はオーバーレイを突き抜けることがあるため、
     メニューが開いている間だけ非表示にする */
.nav-open{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;z-index:200}
body:has(.nav-open) iframe,
body:has(.nav-open) .fab-line,
body:has(.nav-open) .mobile-cta{visibility:hidden}

/* 真因：header.scrolled の backdrop-filter が「子孫の position:fixed の基準」を
   ヘッダー自身に変えてしまい、スクロール後だけ .nav-open が
   ヘッダー内(390x64)に閉じ込められて中身が外に溢れていた。
   ヘッダーは既に不透明白なのでぼかしは不要。除去する。 */
header,header.scrolled{-webkit-backdrop-filter:none;backdrop-filter:none}

/* ヒーロー写真の左下にマスコット（クルミのリス位置に相当）
   縦位置は .hs-stage の下端ではなく「写真の下端」に合わせる。
   SP では .hs-catch / .hs-dots が .hs-stage 内に静的に入り箱が伸びるため、
   bottom 指定だとキャッチコピーに重なる。top:var(--stage-h) + translateY(-100%)
   なら、どの画面幅でも写真の下端＝マスコットの足元で揃う。 */
.hs-mascot{position:absolute;z-index:4;pointer-events:none;
  left:calc(50% - var(--slide-w) * .40);top:var(--stage-h);
  transform:translateY(-100%) scaleX(-1);
  width:auto;height:clamp(76px,12vw,168px)}
@media(max-width:860px){
  .hs-mascot{height:clamp(76px,23vw,100px)}
}
@media(prefers-reduced-motion:no-preference){
  .hs-mascot{animation:mascot-bob 4.6s ease-in-out infinite}
  @keyframes mascot-bob{
    0%,100%{transform:translateY(-100%) scaleX(-1)}
    50%{transform:translateY(calc(-100% - 5px)) scaleX(-1)}}
}
/* 日本語の改行を文節単位に。「少/し緊張する」のような不自然な折り返しを防ぐ */
p,.sec-lead,.hero-sub,.concept p,.eq p,.svc-card b,.worry-card b,.wc-sub,.rt-meta dd{
  word-break:auto-phrase;line-break:strict;overflow-wrap:anywhere}


/* 診療案内のカードを「丸」→「歯の形」に。ヒーローで使っている #toothClip を流用する
   （clipPathUnits=objectBoundingBox なので、要素の縦横比をヒーローのスライドと
   揃えないと歯が潰れる → aspect-ratio を 1/1.18 に）。
   ※clip-path を掛けると box-shadow は描かれないので消す（影が要るなら drop-shadow）。 */
.svc-card{aspect-ratio:1 / 1.18;border-radius:0;
  -webkit-clip-path:url(#toothClip);clip-path:url(#toothClip);
  box-shadow:none;
  min-width:0;
  /* ⚠️% の padding は「自分の幅」ではなく親（.svc-track 約1100px）基準で解決される。
     % で書くとカードが 188px→410px→286px と暴れた。カード幅 clamp(146,42vw,188) に
     比例する実寸で指定する。歯根側が細いので中身は歯冠（上寄り）に置く。 */
  padding:clamp(21px,5.9vw,27px) clamp(19px,5.5vw,24px) clamp(48px,13.9vw,62px);
  gap:5px}


/* --- 2026-08-20 修正 --- */
/* 歯カードは真っ白に（クリーム #faf2ea → #fff） */
.svc-card{background:#fff}
.svc-card:hover{background:var(--gold);color:#fff}

/* 設備カードの通し番号 01〜04：Cormorant のイタリック×gold-deep では
   クリーム地に埋もれて読めなかった。サンセリフ＋濃色＋太字にする */
.eq .num{font-family:var(--sans);font-style:normal;font-weight:700;
  font-size:.78rem;letter-spacing:.06em;color:rgba(51,39,29,.72)}

/* 院長写真に濃いめの枠線（表・地図・設備カードと同じ「線を見せる」方針に揃える） */
.doctor-photo .frame{border:2px solid rgba(51,39,29,.8)}

/* 院長メッセージの見出しと署名を太字に */
.doctor-text h2{font-weight:700}
.doctor-text .sign b{font-weight:700}
.doctor-text .sign small{font-weight:700;color:var(--ink)}


/* ===== お問い合わせ（CONTACT）を横長パネル2枚のデザインに ===== */
.cta-band{padding:clamp(64px,9vw,104px) 0;text-align:center;color:#fff;
  background:linear-gradient(rgba(59,37,25,.88),rgba(59,37,25,.92)),url("../img/clinic_wait.jpg") center/cover no-repeat}
.cta-band .bloom{display:none}
.cta-label{font-family:var(--lat);font-size:.72rem;font-weight:600;
  letter-spacing:.34em;text-transform:uppercase;color:rgba(255,255,255,.9);margin:0}
.cta-band h2{font-family:var(--serif);font-weight:500;color:#fff;
  font-size:clamp(1.25rem,3.6vw,1.9rem);letter-spacing:.1em;line-height:1.7;
  margin:14px 0 clamp(26px,4vw,40px)}
.cta-panels{display:flex;flex-direction:column;gap:clamp(12px,1.6vw,18px);
  max-width:720px;margin:0 auto}
.cta-panel{display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  gap:clamp(14px,2.4vw,24px);text-decoration:none;color:#fff;text-align:left;
  padding:clamp(16px,2.4vw,22px) clamp(18px,3vw,30px);border-radius:3px;
  transition:transform .4s var(--ease),filter .4s var(--ease)}
.cta-panel:hover{transform:translateY(-3px);filter:brightness(1.07)}
.cp-tel{background:#6f8b86}
.cp-web{background:#c8a86a}
.cp-ic{width:clamp(46px,7vw,62px);height:clamp(46px,7vw,62px);border-radius:50%;
  background:#fff;display:grid;place-items:center;flex:none}
.cp-tel .cp-ic{color:#6f8b86}
.cp-web .cp-ic{color:#c8a86a}
.cp-ic svg{width:52%;height:52%}
.cp-body{min-width:0}
.cp-sub{display:block;font-size:clamp(.66rem,1.7vw,.78rem);letter-spacing:.04em;
  color:rgba(255,255,255,.92);line-height:1.6;margin-bottom:2px}
.cp-main{display:block;font-family:var(--lat);font-weight:500;
  font-size:clamp(1.4rem,5vw,2.1rem);letter-spacing:.06em;line-height:1.25;
  font-variant-numeric:lining-nums}
.cp-row{display:flex;align-items:center;gap:clamp(8px,1.6vw,14px)}
.cp-badge{flex:none;font-size:.6rem;line-height:1.25;letter-spacing:.04em;
  text-align:center;padding:4px 6px;border:1px solid rgba(255,255,255,.75);border-radius:2px}
.cp-arrow{width:clamp(28px,5vw,62px);height:1px;background:#fff;position:relative;flex:none}
.cp-arrow::after{content:"";position:absolute;right:0;top:-3px;
  width:7px;height:7px;border-top:1px solid #fff;border-right:1px solid #fff;transform:rotate(45deg)}
.cp-tel .cp-arrow{display:none}
@media(max-width:480px){
  .cta-panel{grid-template-columns:auto 1fr;gap:12px;padding:14px 14px}
  .cp-arrow{display:none}
}

.cp-line{background:#06c755}
.cp-line .cp-ic{color:#06c755}
.cp-main-sm{font-family:var(--sans);font-size:clamp(1.05rem,3.4vw,1.4rem);letter-spacing:.08em}

/* 設備カードの番号：白フチ付きにして、クリーム地でも hover の濃色地でも読めるようにする */
.eq .num{color:#fff;font-size:clamp(1rem,2.6vw,1.22rem);letter-spacing:.04em;
  -webkit-text-stroke:0;
  /* text-stroke は輪郭の内側にも食い込んで字が細るので、8方向の影で実線のフチを作る */
  text-shadow:1px 0 0 #33271d,-1px 0 0 #33271d,0 1px 0 #33271d,0 -1px 0 #33271d,
    1px 1px 0 #33271d,-1px 1px 0 #33271d,1px -1px 0 #33271d,-1px -1px 0 #33271d}
.eq:hover .num{color:#fff}


/* ===== 診療案内ページの構成を dc-uchida.com 風に（配色は当院のパレットのまま） =====
   ・小見出しは「塗りバンド」にして、どこから次の話題か一目で分かるようにする
   ・要点は白カードの羅列でなく、淡色パネルにチェックリストでまとめる            */
.tsub{font-family:var(--sans);font-weight:700;
  font-size:clamp(1rem,2.4vw,1.2rem);letter-spacing:.08em;line-height:1.5;
  text-align:left;color:#fff;background:var(--teal-deep);
  padding:.74em 1.1em;border-radius:3px;margin:56px 0 24px}
@media(max-width:700px){ .tsub{margin:40px 0 18px} }

.point-list{background:var(--bg-tint);border:1px solid var(--line);border-radius:4px;
  padding:clamp(18px,3vw,26px);gap:clamp(14px,2vw,18px);margin:0}
.point-list li{background:transparent;border:0;box-shadow:none;padding:0;gap:12px}
.point-list li svg{width:15px;height:15px;padding:4px;box-sizing:content-box;
  color:#fff;background:var(--teal);border-radius:50%;margin-top:1px}
.point-list li b{font-family:var(--sans);font-size:.98rem}

/* 注意書きの縦棒は廃止（上の .note で面と罫線に統一） */


/* PC は設備4点をきれいに1行へ（3列だと4枚目だけ次の行に取り残される） */
@media(min-width:861px){
  .equip-grid{grid-template-columns:repeat(4,1fr);gap:24px 20px}
}

/* 見出しの禁則：「ほ／っとする」のように小書き文字が行頭に落ちるのを防ぐ
   （本文には既に指定済みだったが、見出しに掛かっていなかった） */
h1,h2,h3,.sec-title,.tsub,.cta-band h2,.doctor-text h2,.concept h2{
  word-break:auto-phrase;line-break:strict}


/* ===== 「初めての方へ」: sakamotodc.com/first/ 参考のブロック（配色は当院のまま） ===== */
.lead-wide{text-align:center;font-family:var(--sans);font-weight:500;
  font-size:clamp(1.05rem,2.6vw,1.5rem);letter-spacing:.16em;line-height:2.2;
  color:var(--ink);margin:0 0 clamp(30px,5vw,56px)}

/* 写真に白いカードを重ねるブロック（左右交互） */
.fblock{display:grid;margin:clamp(36px,5vw,64px) 0}
.fblock .fb-photo{overflow:hidden;border-radius:2px}
.fblock .fb-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.fblock .fb-card{background:#fff;padding:clamp(22px,3.2vw,42px);border-radius:2px;
  box-shadow:0 26px 60px -32px rgba(51,39,29,.4);z-index:2}
.fb-card h3{font-family:var(--sans);font-weight:500;color:var(--ink);
  font-size:clamp(1.02rem,2.1vw,1.4rem);letter-spacing:.14em;line-height:1.95;margin:0 0 14px}
.fb-card p{font-size:.9rem;line-height:2.05;color:var(--ink-soft);margin:0}
@media(min-width:861px){
  .fblock{grid-template-columns:repeat(12,1fr);align-items:center}
  .fblock .fb-photo{grid-row:1;grid-column:1/8}
  .fblock .fb-card{grid-row:1;grid-column:7/13}
  .fblock.rev .fb-photo{grid-column:6/13}
  .fblock.rev .fb-card{grid-column:1/7}
}
@media(max-width:860px){
  .fblock{grid-template-columns:1fr}
  .fblock .fb-photo{grid-row:1}
  .fblock .fb-card{grid-row:2;margin:-30px 14px 0}
}

/* 写真＋丸番号バッジのカード列 */
.numcards{display:grid;grid-template-columns:repeat(4,1fr);
  gap:clamp(16px,2.4vw,26px);margin-top:clamp(30px,4vw,50px)}
@media(max-width:700px){ .numcards{grid-template-columns:repeat(2,1fr);gap:22px 14px} }
.numcard .nc-ph{position:relative}
.numcard img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:2px}
.numcard .nc-n{position:absolute;left:10px;bottom:-17px;width:38px;height:38px;border-radius:50%;
  background:var(--bg-tint);border:1px solid rgba(51,39,29,.25);display:grid;place-items:center;
  font-family:var(--lat);font-weight:600;font-size:.8rem;letter-spacing:.04em;color:var(--teal-deep)}
.numcard b{display:block;margin-top:30px;font-size:.95rem;font-weight:700;
  color:var(--ink);line-height:1.6}
.numcard span{display:block;margin-top:7px;font-size:.83rem;color:var(--ink-soft);line-height:1.85}

/* セクション見出しを「大きな英字＋小さな和文」に（このページのみ .sh-en） */
.sh-en .eyebrow{font-family:var(--lat);font-weight:400;text-transform:uppercase;
  font-size:clamp(1.35rem,3.2vw,2rem);letter-spacing:.3em;color:var(--ink);
  justify-content:center;gap:0}
.sh-en .eyebrow::before,.sh-en .eyebrow::after{display:none}
.sh-en .sec-title{font-family:var(--sans);font-weight:500;font-size:.86rem;
  letter-spacing:.16em;color:var(--ink-soft);margin-top:6px}


/* ===== ドクター紹介（GREETING）: 歯科エメラルド茅ヶ崎 参考。配色は当院のまま ===== */
.greet{position:relative;overflow:hidden}
.greet-head{position:relative;text-align:center;margin-bottom:clamp(30px,5vw,54px)}
.greet-ic{display:inline-grid;place-items:center;width:34px;height:34px;color:var(--teal)}
.greet-ic svg{width:100%;height:100%}
.greet-label{display:flex;align-items:center;justify-content:center;gap:16px;
  font-family:var(--lat);font-size:.78rem;font-weight:600;letter-spacing:.32em;
  text-transform:uppercase;color:var(--ink-soft);margin:4px 0 18px}
.greet-label::before,.greet-label::after{content:"";width:clamp(34px,7vw,72px);height:1px;background:rgba(51,39,29,.28)}
.greet-title{position:relative;z-index:2;font-family:var(--sans);font-weight:700;
  font-size:clamp(1.15rem,3vw,1.7rem);letter-spacing:.06em;line-height:1.75;color:var(--ink)}
/* 見出し背後の淡い丸（参考サイトの装飾に相当） */
.greet-head::before,.greet-head::after{content:"";position:absolute;z-index:1;border-radius:50%;pointer-events:none}
.greet-head::before{width:clamp(80px,12vw,132px);height:clamp(80px,12vw,132px);
  background:rgba(232,153,47,.13);left:calc(50% - clamp(150px,22vw,260px));bottom:-14px}
.greet-head::after{width:clamp(56px,9vw,96px);height:clamp(56px,9vw,96px);
  background:rgba(141,109,82,.13);left:calc(50% + clamp(96px,16vw,190px));bottom:-6px}

.greet-body{display:grid;gap:clamp(26px,4vw,48px);align-items:start}
@media(min-width:861px){ .greet-body{grid-template-columns:1fr 300px} }
.greet-lead{font-family:var(--sans);font-weight:700;color:var(--teal-deep);
  font-size:clamp(1rem,2.2vw,1.2rem);line-height:1.95;letter-spacing:.05em;
  padding-bottom:14px;margin-bottom:22px;
  border-bottom:2px dotted rgba(181,100,28,.5)}
.greet-lead em{font-style:normal}
.greet-text p{font-size:.94rem;line-height:2.15;color:var(--ink-soft);
  margin-bottom:16px;text-indent:1em}
.greet-text .greet-lead{text-indent:0}
.greet-photo{margin:0;text-align:center}
.greet-photo img{width:min(300px,74vw);aspect-ratio:1;object-fit:cover;object-position:center 18%;
  border-radius:50%;display:block;margin:0 auto;
  box-shadow:0 22px 50px -26px rgba(51,39,29,.5)}
.greet-photo figcaption{margin-top:16px;font-size:.84rem;line-height:1.9;color:var(--teal-deep)}
.greet-photo figcaption b{display:block;font-size:1.05rem;font-weight:700;letter-spacing:.08em}

/* 経歴カード */
.carcard{background:#fff;border-radius:4px;padding:clamp(22px,3vw,38px);
  box-shadow:0 18px 46px -30px rgba(51,39,29,.4);display:grid;gap:clamp(18px,3vw,34px)}
.carcard + .carcard{margin-top:clamp(20px,3vw,32px)}
@media(min-width:861px){ .carcard{grid-template-columns:210px 1fr} }
.cc-head{text-align:center}
@media(min-width:861px){ .cc-head{border-right:1px solid var(--line);align-self:center} }
.cc-ic{display:inline-grid;place-items:center;width:30px;height:30px;color:var(--teal)}
.cc-ic svg{width:100%;height:100%}
.cc-jp{font-family:var(--sans);font-weight:700;font-size:1.12rem;letter-spacing:.16em;color:var(--ink);margin-top:2px}
.cc-en{font-family:var(--lat);font-size:.7rem;letter-spacing:.24em;color:var(--ink-soft);margin-top:4px}
.cc-body .career-sub:first-child{margin-top:0}
@media(min-width:861px){
  .cc-body .career-list{display:grid;grid-template-columns:repeat(2,1fr);gap:0 26px}
}


/* ===== お悩み別カード：提供のイラスト（左に文字スペース／右に人物）を使う ===== */
.worry-grid{grid-template-columns:repeat(2,1fr);gap:clamp(14px,2vw,22px)}
@media(max-width:600px){ .worry-grid{grid-template-columns:1fr} }
.worry-card{position:relative;display:block;padding:0;gap:0;text-align:left;
  background:transparent;border:0;box-shadow:none;border-radius:12px;overflow:hidden}
.worry-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(51,39,29,.14);border-color:transparent}
.wc-img{width:100%;height:auto;display:block}
.wc-body{position:absolute;left:0;top:0;bottom:0;width:56%;
  display:flex;flex-direction:column;justify-content:center;gap:7px;
  padding-left:clamp(16px,5%,34px);padding-right:6px}
.worry-card b{font-size:clamp(.92rem,1.9vw,1.14rem);font-weight:700;line-height:1.55;color:var(--ink)}
.worry-card .wc-sub{font-size:clamp(.72rem,1.5vw,.85rem);color:var(--ink-soft);line-height:1.6}


/* 偶数番のカードは左右反転（人物を左・文字を右に）して交互に見せる。
   イラストは文字を含まないので scaleX(-1) で鏡像にして問題ない */
/* PC（2列）では左右の文字が中央に寄って窮屈なので、反転は1列のときだけ。 */
@media(max-width:600px){
  .worry-card:nth-child(even) .wc-img{transform:scaleX(-1)}
  .worry-card:nth-child(even) .wc-body{left:auto;right:0;
    padding-left:6px;padding-right:clamp(16px,5%,34px)}
}


/* 設備カードにイラストを敷く（アイコン → 実イラスト） */
.eq .ring{padding:0;overflow:hidden}
.eq .ring img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s var(--ease)}
.eq:hover .ring{background:var(--bg-tint);border-color:rgba(51,39,29,.8)}
.eq:hover .ring img{transform:scale(1.04)}


/* ===== ドクター紹介：emerald-shika.jp/doctor.html にもう一段寄せる ===== */
/* 写真は小さめ・本文の頭に揃える（中央寄せだと重心が下がって間延びする） */
@media(min-width:861px){ .greet-body{grid-template-columns:1fr 250px;align-items:start} }
.greet-photo img{width:min(230px,62vw);box-shadow:none;
  border:6px solid #fff;outline:1px solid var(--line);outline-offset:-6px}
.greet-photo figcaption{margin-top:12px;font-size:.78rem}
.greet-photo figcaption b{font-size:.98rem;letter-spacing:.1em}
.greet-lead{font-size:clamp(.95rem,2vw,1.1rem);line-height:1.9;padding-bottom:12px;margin-bottom:18px}
.greet-text p{font-size:.9rem;line-height:2.05;margin-bottom:12px}

/* 経歴は「影のある厚いカード」→「細い枠の軽いカード」に */
.carcard{background:#fff;border:1px solid var(--line);box-shadow:none;
  border-radius:2px;padding:clamp(20px,2.6vw,30px) clamp(18px,3vw,40px);
  max-width:940px;margin-inline:auto}
.cc-jp{font-size:1.02rem;letter-spacing:.2em}
.cc-en{font-size:.64rem;letter-spacing:.26em}
/* 箇条書きの丸を外し、行間を詰めて一覧らしく */
.cc-body .career-list{gap:7px 40px}
.cc-body .career-list li{padding-left:0;font-size:.86rem;line-height:1.75}
.cc-body .career-list li::before{display:none}
.cc-body .career-sub{font-size:.9rem;margin:22px 0 10px;padding-bottom:6px}


/* ===== 料金一覧：marimo-dental.com/price/ 参考（配色は当院のまま） ===== */
.price-lead{text-align:center;font-family:var(--sans);font-weight:700;
  font-size:clamp(1.05rem,2.6vw,1.5rem);letter-spacing:.08em;line-height:1.9;
  color:var(--ink);margin:0 0 12px}
.price-sub{text-align:center;font-size:.88rem;line-height:1.95;color:var(--ink-soft);
  max-width:760px;margin:0 auto clamp(30px,5vw,50px)}
@media(min-width:601px){ .sp-br{display:none} }

.pcard{max-width:900px;margin:0 auto clamp(22px,3vw,34px);
  border-radius:3px;overflow:hidden;border:1px solid var(--line)}
.pc-head{background:var(--teal-deep);color:#fff;font-weight:700;
  font-size:clamp(.95rem,2.2vw,1.1rem);letter-spacing:.1em;
  padding:.85em clamp(16px,2.4vw,28px);margin:0}
.pc-body{background:var(--bg-tint);padding:clamp(18px,2.6vw,30px) clamp(16px,2.6vw,30px)}
.pc-group + .pc-group{margin-top:clamp(20px,2.6vw,28px)}
.pc-gt{font-weight:700;font-size:.92rem;color:var(--ink);letter-spacing:.06em;margin:0 0 8px}
.prow-list{list-style:none;margin:0;padding:0}
.prow{display:flex;align-items:baseline;gap:12px;
  padding:11px 4px;border-bottom:1px solid rgba(51,39,29,.12)}
.prow:last-child{border-bottom:0}
.pr-n{flex:1;position:relative;padding-left:18px;
  font-size:.9rem;line-height:1.7;color:var(--ink-soft)}
.pr-n::before{content:"";position:absolute;left:0;top:.5em;width:8px;height:8px;
  border-radius:50%;border:1px solid rgba(51,39,29,.35)}
.pr-p{flex:none;font-family:var(--lat);font-weight:600;letter-spacing:.02em;
  font-size:clamp(.92rem,2vw,1.02rem);color:var(--ink);white-space:nowrap;
  font-variant-numeric:lining-nums}
@media(max-width:520px){
  .prow{flex-direction:column;gap:2px}
  .pr-p{align-self:flex-end}
}
.price-note{max-width:900px;margin:-8px auto clamp(22px,3vw,34px);
  font-size:.8rem;color:var(--ink-soft);text-align:right}


/* ===== 料金：代表的な治療の「カード」（marimo の月々支払いカードの型） ===== */
.plans{display:grid;gap:clamp(16px,2.4vw,26px);max-width:900px;
  margin:0 auto clamp(34px,5vw,54px)}
@media(min-width:721px){ .plans{grid-template-columns:repeat(2,1fr)} }
.plan{background:var(--bg-tint);border-radius:4px;
  padding:clamp(18px,2.6vw,26px) clamp(16px,2.4vw,26px)}
.pl-top{display:flex;align-items:center;gap:clamp(12px,2vw,18px);margin-bottom:16px}
.pl-ph{width:clamp(64px,11vw,84px);height:clamp(64px,11vw,84px);flex:none;
  object-fit:cover;border-radius:50%;background:#fff}
.pl-desc{font-weight:700;font-size:clamp(.86rem,1.9vw,.98rem);
  line-height:1.85;color:var(--ink);margin:0}

.pl-price{display:flex;align-items:center;gap:10px;margin:0 0 14px;flex-wrap:wrap}
.pl-tag{position:relative;flex:none;background:var(--teal-deep);color:#fff;
  font-size:.7rem;font-weight:700;letter-spacing:.06em;line-height:1.35;
  padding:7px 14px 7px 10px;border-radius:2px;
  clip-path:polygon(0 0,100% 0,calc(100% - 8px) 50%,100% 100%,0 100%)}
.pl-num{display:inline-flex;align-items:baseline;gap:2px;font-family:var(--lat);
  font-variant-numeric:lining-nums}
.pl-num em{font-style:normal;font-weight:700;letter-spacing:.01em;
  font-size:clamp(1.6rem,5vw,2.3rem);color:var(--ink);
  /* 参考サイトの蛍光マーカーに相当（当院はゴールド系で） */
  background:linear-gradient(transparent 58%,rgba(232,153,47,.42) 58%);
  padding:0 4px}
.pl-num small{font-size:1rem;color:var(--ink-soft);font-weight:600}

.pl-meta{margin:0;font-size:.8rem;line-height:1.9}
.pl-meta > div{display:flex;gap:12px}
.pl-meta dt{flex:0 0 4.6em;color:var(--ink-soft)}
.pl-meta dd{margin:0;color:var(--ink)}


/* 丸写真に「墨で描いた輪」を重ねる（半透明のフェードではなく、
   輪郭がにじんだ不透明の墨。assets/img/ink-ring.png を生成して使用） */
.pl-phw{position:relative;display:block;flex:none;
  width:clamp(64px,11vw,84px);height:clamp(64px,11vw,84px)}
.pl-phw .pl-ph{width:100%;height:100%}
.pl-phw::after{content:"";position:absolute;inset:-12.5%;
  background:url("../img/ink-ring.png") center/contain no-repeat;pointer-events:none}


/* ループの繋ぎ目で位置を戻す一瞬だけ、スライドのアニメーションを止める */
.hs-stage.hs-nofx .hs-slide,.hs-stage.hs-nofx .hs-track{transition:none !important}


/* ===== 診療案内の詳細ページを marimo-dental.com の型に（配色は当院のまま） =====
   ・小見出しは「塗りバンド」→「中央寄せの大きめ見出し」
   ・要点は淡色パネルの箇条書き → 「番号つきカードの2列グリッド」
   （.tdetail は treatment/*.html だけで使われているのでスコープを限定。
     同じ .point-list を使う about.html には影響させない）             */
.tdetail .tsub{background:none;color:var(--ink);text-align:center;border-radius:0;
  font-size:clamp(1.12rem,2.8vw,1.45rem);letter-spacing:.08em;font-weight:700;
  padding:0;margin:clamp(52px,7vw,76px) 0 clamp(22px,3vw,32px)}

.tdetail .point-list{counter-reset:pt;background:none;border:0;padding:0;
  display:grid;gap:clamp(16px,2.4vw,24px)}
@media(min-width:721px){ .tdetail .point-list{grid-template-columns:repeat(2,1fr)} }
.tdetail .point-list li{counter-increment:pt;display:block;position:relative;
  background:var(--bg-tint);border:0;border-radius:4px;box-shadow:none;
  padding:clamp(30px,4vw,42px) clamp(20px,2.8vw,30px) clamp(22px,3vw,30px)}
.tdetail .point-list li svg{display:none}
/* 番号（01,02…）と、その背後の三日月アーチ */
.tdetail .point-list li::before{content:counter(pt,decimal-leading-zero);
  display:block;text-align:center;font-family:var(--lat);font-weight:600;
  font-size:1.02rem;letter-spacing:.1em;color:var(--ink-soft);
  position:relative;z-index:1;margin-bottom:8px}
.tdetail .point-list li::after{content:"";position:absolute;
  top:clamp(20px,2.8vw,30px);left:50%;transform:translateX(-64%);
  width:30px;height:30px;border:2px solid rgba(219,127,48,.5);border-radius:50%;
  clip-path:polygon(0 0,52% 0,52% 100%,0 100%);pointer-events:none}
.tdetail .point-list li b{display:block;text-align:center;font-family:var(--sans);
  font-size:clamp(1rem,2.2vw,1.15rem);font-weight:700;color:var(--ink);
  line-height:1.6;margin-bottom:14px}
.tdetail .point-list li span{display:block;font-size:.88rem;line-height:2.05;
  color:var(--ink-soft)}


/* 診療案内は写真ヒーロー（暗い被せはインラインの background-image 側で付与） */
.page-hero.ph-photo{background-size:cover;background-position:center;background-repeat:no-repeat;
  padding:clamp(140px,17vh,200px) 0 clamp(56px,9vh,96px)}
.page-hero.ph-photo::before,.page-hero.ph-photo::after{display:none}
.page-hero.ph-photo .en{color:rgba(255,255,255,.82)}
.page-hero.ph-photo h1{color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.28)}
.page-hero.ph-photo p{color:rgba(255,255,255,.94)}


/* ===== 診療案内トップ：emerald-shika.jp/medical/ 参考 ===== */
.mg-head{text-align:center;margin-bottom:clamp(34px,5vw,58px)}
.mg-ic{display:inline-grid;place-items:center;width:32px;height:32px;color:var(--teal)}
.mg-ic svg{width:100%;height:100%}
.mg-label{display:flex;align-items:center;justify-content:center;gap:16px;
  font-family:var(--lat);font-size:.76rem;font-weight:600;letter-spacing:.32em;
  text-transform:uppercase;color:var(--ink-soft);margin:2px 0 16px}
.mg-label::before,.mg-label::after{content:"";width:clamp(34px,7vw,74px);height:1px;
  background:rgba(51,39,29,.28)}
.mg-title{font-family:var(--sans);font-weight:700;color:var(--ink);
  font-size:clamp(1.2rem,3vw,1.7rem);letter-spacing:.1em;line-height:1.7}

.mg-list{max-width:820px;margin:0 auto}
.mg-item{margin-bottom:clamp(38px,5.5vw,64px)}
.mg-item h3{text-align:center;font-family:var(--sans);font-weight:700;
  color:var(--teal-deep);font-size:clamp(1.05rem,2.5vw,1.3rem);
  letter-spacing:.1em;line-height:1.6}
.mg-dots{display:block;width:74px;height:6px;margin:10px auto 18px;
  /* フォント依存の◆グリフだと環境で豆腐になるので、CSSで点を描く */
  background-image:radial-gradient(circle,rgba(219,127,48,.75) 2.2px,transparent 2.4px);
  background-size:19px 6px;background-repeat:repeat-x}
.mg-item > p{font-size:.92rem;line-height:2.15;color:var(--ink-soft);margin:0}
.mg-more{margin-top:22px !important}
/* ボタンは文字数で幅が変わらないよう、全部同じ幅に揃える
   （一番長い「審美・ホワイトニングについて詳しく見る」が1行で収まる幅） */
.mg-more a{display:flex;align-items:center;gap:12px;text-decoration:none;
  width:min(100%,420px);box-sizing:border-box;
  border:1px solid rgba(181,100,28,.55);border-radius:2px;
  padding:14px clamp(14px,2.4vw,22px);
  font-size:.9rem;font-weight:700;letter-spacing:.06em;color:var(--teal-deep);
  transition:background .35s var(--ease),color .35s var(--ease)}
.mg-more a::before{content:"";width:22px;height:1px;background:currentColor;position:relative}
.mg-more a::after{content:"";position:absolute}
.mg-more a:hover{background:var(--teal-deep);color:#fff;border-color:var(--teal-deep)}


/* 各診療の見出しの上に、診療内容が一目で分かるアイコンを置く */
.mg-ic-item{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 10px;
  border-radius:50%;background:var(--bg-tint);border:1px solid rgba(181,100,28,.35);
  color:var(--teal-deep)}
.mg-ic-item svg{width:28px;height:28px}

/* 左右スライド出現の初期位置(translateX ±48px)が画面外にはみ出し、
   出現前のあいだ横スクロールが発生していた。区間内でクリップして止める。
   （overflow:hidden ではなく clip = スクロールコンテナを作らないので
     position:sticky 等に副作用が出ない） */
#commit,.commit-rows{overflow-x:clip}

/* ===== 駐車場のご案内 ===== */
.pk-map{max-width:950px;margin:0 auto;border:1px solid var(--line);border-radius:12px;
  background:#fff;padding:clamp(10px,2vw,20px);
  box-shadow:0 18px 40px -28px rgba(51,39,29,.4)}
.pk-map img{display:block;width:100%;height:auto}
.pk-notes{max-width:760px;margin:clamp(22px,3vw,34px) auto 0;padding:0;list-style:none;
  display:grid;gap:10px}
.pk-notes li{position:relative;padding-left:1.5em;font-size:.94rem;line-height:1.9;color:var(--ink-soft)}
.pk-notes li::before{content:"";position:absolute;left:.35em;top:.75em;width:7px;height:7px;
  border-radius:50%;background:var(--gold-deep)}
.pk-notes b{color:var(--ink)}
@media(max-width:860px){
  .pk-map{padding:8px;border-radius:10px}
  .pk-notes li{font-size:.86rem;line-height:1.85}
}


/* ===== 施設基準（2026-08-28 打合せ） ===== */
.std-list{display:grid;gap:14px;max-width:900px;margin:0 auto}
.std-item{background:#fff;border:1px solid var(--line,#ece7df);border-radius:14px;padding:18px 20px;box-shadow:0 2px 10px rgba(0,0,0,.03)}
.std-name{font-size:1rem;font-weight:700;color:var(--ink,#2b2b2b);margin:0 0 6px;line-height:1.6}
.std-desc{font-size:.92rem;color:var(--ink-soft,#6b6560);line-height:1.9;margin:0}
.std-link{font-size:.85rem;color:var(--ink-soft,#6b6560);line-height:1.8;margin:10px 0 0;padding-top:10px;border-top:1px dashed var(--line,#ece7df)}
.std-link b{color:var(--ink,#2b2b2b);font-weight:600}
.std-link a,.prose a{color:var(--gold-deep,#b07a2c);text-decoration:underline;text-underline-offset:2px}
.std-link a:hover,.prose a:hover{color:var(--gold,#e8992f)}
@media(min-width:860px){.std-list{grid-template-columns:1fr 1fr}}
.std-notice{max-width:900px;margin:0 auto;display:grid;gap:10px}
.std-notice li{background:#fff;border:1px solid var(--line,#ece7df);border-radius:14px;padding:14px 18px;font-size:.92rem;color:var(--ink-soft,#6b6560);line-height:1.9;list-style:none;box-shadow:0 2px 10px rgba(0,0,0,.03)}
.std-notice li b{color:var(--ink,#2b2b2b);font-weight:700}

/* ===== 医院PV動画（2026-08-28 打合せ） ===== */
.pv-frame{max-width:900px;margin:0 auto;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 10px 30px rgba(0,0,0,.12)}
.pv-video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000}

/* ===== ガイドバナー（歯医者の選び方） 2026-09-30 ===== */
.guide-banner{
  display:flex;align-items:center;gap:18px;
  max-width:900px;margin:0 auto;padding:22px 28px;
  background:var(--bg-tint);border:1px solid var(--line);border-radius:12px;
  text-decoration:none;transition:box-shadow .3s var(--ease,ease),transform .3s var(--ease,ease);
}
.guide-banner:hover{box-shadow:0 10px 26px rgba(51,39,29,.08);transform:translateY(-2px)}
.guide-banner .gb-label{
  flex:none;font-family:var(--serif);font-weight:600;font-size:1.05rem;color:var(--gold-deep);
  border-right:1px solid var(--line);padding-right:18px;
}
.guide-banner .gb-text{flex:1;font-size:.92rem;color:var(--ink-soft);line-height:1.6}
.guide-banner .gb-arrow{flex:none;color:var(--gold-deep);font-size:1.2rem}
@media(max-width:640px){
  .guide-banner{flex-wrap:wrap;gap:8px 14px;padding:18px 20px}
  .guide-banner .gb-label{border-right:0;padding-right:0;width:100%}
}

/* 2026-10-19 医院ご依頼：駐車場の案内図へのリンク／通いやすさ2枚組 */
.plink{color:inherit;text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:1px;text-underline-offset:4px}
.plink:hover{color:var(--gold-deep);text-decoration-thickness:2px}
.icards.two{grid-template-columns:repeat(2,1fr);max-width:780px;margin:0 auto}
@media(max-width:1000px){.icards.two{grid-template-columns:1fr;max-width:520px}}