@charset "utf-8";
/* ============================================================
   しまだ歯科医院 — 共通スタイル
   配色：ティール(#00838F) × クリーム(#FFF8E1) × イエロー(#FFB300)
         ＋ ブランドの りんご赤(#D83A2A) / リーフ緑(#59AD38) をアクセント
   フォント：Zen Maru Gothic（見出し・丸ゴシック）/ Zen Kaku Gothic New（本文）
   ============================================================ */

:root{
  --teal:#00838F; --teal-d:#00646E; --teal-l:#4FB3BE; --teal-p:#E3F2F3;
  --cream:#FFF8E1; --cream-d:#FFEFC2;
  --yellow:#FFB300; --yellow-d:#EF9E00; --yellow-p:#FFF3D6;
  --apple:#D83A2A; --apple-l:#F2857A; --apple-p:#FDEDEB;
  --leaf:#59AD38; --leaf-d:#478C2C; --leaf-p:#EDF7E8;

  --bg:#FFFFFF; --soft:#FFFCF3; --paper:#F7FBFB;
  --ink:#33302B; --body:#5E5951; --muted:#8E887E;
  --line:rgba(0,131,143,.16); --line-soft:rgba(0,131,143,.08);
  --line-warm:rgba(255,179,0,.28);

  --r:22px; --r-s:14px; --r-l:34px;
  --sh:0 18px 40px -24px rgba(51,48,43,.38);
  --sh-s:0 10px 24px -16px rgba(51,48,43,.34);
  --ff-h:"Zen Maru Gothic","Zen Kaku Gothic New",sans-serif;
  --ff-b:"Zen Kaku Gothic New","Hiragino Sans","Noto Sans JP",sans-serif;
  --ff-m:"Baloo 2","Zen Maru Gothic",sans-serif;
  --head-h:134px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:calc(var(--head-h) + 12px);}
body{
  margin:0; color:var(--body); background:var(--bg);
  font-family:var(--ff-b); font-size:16px; line-height:1.95;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
  padding-bottom:env(safe-area-inset-bottom);
}
img{max-width:100%; display:block; height:auto;}
a{color:inherit; text-decoration:none;}
p{margin:0;}
h1,h2,h3,h4{margin:0; color:var(--ink); font-family:var(--ff-h); font-weight:700; line-height:1.5; word-break:auto-phrase; text-wrap:balance;}
ul{margin:0; padding:0; list-style:none;}
button{font-family:inherit;}
:focus-visible{outline:3px solid var(--yellow); outline-offset:3px; border-radius:6px;}

.wrap{width:min(1120px,calc(100% - 44px)); margin:0 auto;}
.wrap-n{width:min(920px,calc(100% - 44px)); margin:0 auto;}
.sec{padding:96px 0; position:relative;}
.sec-soft{background:var(--soft);}
.sec-cream{background:var(--cream);}
.sec-mint{background:var(--teal-p);}
.mk{color:var(--teal);}
.mk-y{color:var(--yellow-d);}
.mk-a{color:var(--apple);}
.center{text-align:center;}

/* ---- マーカー風ハイライト ---- */
.hl{background:linear-gradient(transparent 62%, var(--cream-d) 62%, var(--cream-d) 94%, transparent 94%); padding:0 .08em;}
.hl-y{background:linear-gradient(transparent 62%, rgba(255,179,0,.42) 62%, rgba(255,179,0,.42) 94%, transparent 94%); padding:0 .08em;}

/* ---- 見出しユニット ---- */
.shead{text-align:center; margin-bottom:52px;}
.shead .eye{display:inline-flex; align-items:center; gap:9px; font-family:var(--ff-m); font-size:13px; font-weight:700; letter-spacing:.16em; color:var(--teal); text-transform:uppercase;}
.shead .eye::before{content:""; width:16px; height:16px; background:var(--yellow); border-radius:50% 50% 50% 0; transform:rotate(-45deg); display:inline-block;}
.shead h2{font-size:clamp(25px,4.4vw,40px); margin:12px 0 0; line-height:1.45;}
.shead p{margin:16px auto 0; max-width:40em; color:var(--body); font-size:15.5px;}
.shead.is-left{text-align:left;}
.shead.is-left p{margin-left:0;}

/* ---- ボタン ---- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  font-family:var(--ff-h); font-weight:700; font-size:16px; min-height:60px; padding:14px 34px;
  border:2px solid transparent; border-radius:999px; cursor:pointer;
  transition:transform .22s ease, background .22s ease, color .22s ease, box-shadow .22s ease;}
.btn:hover{transform:translateY(-3px);}
.btn.pri{background:var(--teal); color:#fff; box-shadow:0 14px 28px -14px rgba(0,131,143,.75);}
.btn.pri:hover{background:var(--teal-d);}
.btn.acc{background:var(--yellow); color:#4A3400; box-shadow:0 14px 28px -14px rgba(239,158,0,.85);}
.btn.acc:hover{background:var(--yellow-d);}
.btn.red{background:var(--apple); color:#fff; box-shadow:0 14px 28px -14px rgba(216,58,42,.7);}
.btn.red:hover{background:#BE2D1E;}
.btn.gho{background:#fff; color:var(--teal); border-color:var(--teal);}
.btn.gho:hover{background:var(--teal); color:#fff;}
.btn.lit{background:rgba(255,255,255,.14); color:#fff; border-color:rgba(255,255,255,.6);}
.btn.lit:hover{background:#fff; color:var(--teal);}
.btn .ico{display:inline-flex; line-height:1;}
.i-svg{width:1.2em; height:1.2em; display:block;}
.i-apple{width:1.15em; height:1.15em; display:inline-block; vertical-align:-.2em; flex:0 0 auto;}
.hd__bar .msg .i-apple,.hero__tag .i-apple,.worry__ans .pin .i-apple{margin-right:2px;}
.btn-row{display:flex; gap:14px; flex-wrap:wrap;}

/* ---- テキストリンク ---- */
.more{display:inline-flex; align-items:center; gap:8px; font-family:var(--ff-h); font-weight:700; color:var(--teal); border-bottom:2px solid var(--line); padding-bottom:4px; transition:.2s;}
.more::after{content:"→"; transition:transform .2s ease;}
.more:hover{color:var(--teal-d); border-color:var(--teal);}
.more:hover::after{transform:translateX(5px);}

/* ============================================================
   HEADER
   ============================================================ */
.hd{position:sticky; top:0; z-index:90; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); box-shadow:0 2px 18px -10px rgba(51,48,43,.4);}
.hd__bar{background:var(--teal); color:#fff;}
.hd__bar .in{width:min(1240px,calc(100% - 36px)); margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:7px 0; font-size:12.5px; letter-spacing:.02em;}
.hd__bar .msg{display:flex; align-items:center; gap:8px; opacity:.95;}
.hd__bar .r{display:flex; align-items:center; gap:16px;}
.hd__bar .tel{font-family:var(--ff-m); font-weight:700; font-size:15px; letter-spacing:.04em;}
.hd__bar .rsv{background:var(--yellow); color:#4A3400; font-weight:700; border-radius:999px; padding:4px 15px; font-size:12.5px;}
.hd__bar .rsv:hover{background:#fff; color:var(--teal-d);}

.hd__main{width:min(1240px,calc(100% - 36px)); margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px 0;}
.hd__logo img{height:52px; width:auto;}
.hd__nav{display:flex; align-items:center; gap:4px;}
.hd__nav > a{position:relative; font-family:var(--ff-h); font-weight:700; font-size:14.5px; color:var(--ink); padding:10px 13px; border-radius:999px; white-space:nowrap; transition:.2s;}
.hd__nav > a:hover{background:var(--teal-p); color:var(--teal-d);}
.hd__nav > a.is-cur{color:var(--teal); background:var(--teal-p);}
.hd__cta{display:flex; gap:8px; align-items:center;}
.hd__cta .btn{min-height:48px; font-size:14px; padding:10px 22px;}
.hd__strip{height:5px; background:linear-gradient(90deg,var(--teal) 0 25%, var(--leaf) 25% 50%, var(--yellow) 50% 75%, var(--apple) 75% 100%);}

/* ハンバーガー */
.hd__burger{display:none; width:52px; height:52px; border:none; background:var(--teal); border-radius:16px; cursor:pointer; position:relative; flex:0 0 auto;}
.hd__burger span{position:absolute; left:15px; width:22px; height:2.5px; background:#fff; border-radius:2px; transition:.28s ease;}
.hd__burger span:nth-child(1){top:18px;} .hd__burger span:nth-child(2){top:25px;} .hd__burger span:nth-child(3){top:32px;}
.hd__burger.is-on span:nth-child(1){top:25px; transform:rotate(45deg);}
.hd__burger.is-on span:nth-child(2){opacity:0;}
.hd__burger.is-on span:nth-child(3){top:25px; transform:rotate(-45deg);}

.drawer{position:fixed; inset:0; z-index:95; background:rgba(51,48,43,.5); opacity:0; visibility:hidden; transition:.28s;}
.drawer.is-on{opacity:1; visibility:visible;}
.drawer__panel{position:absolute; top:0; right:0; width:min(360px,86vw); height:100%; background:var(--soft); overflow-y:auto; padding:22px 22px calc(40px + env(safe-area-inset-bottom)); transform:translateX(100%); transition:transform .32s cubic-bezier(.5,0,.2,1);}
.drawer.is-on .drawer__panel{transform:none;}
.drawer__top{display:flex; justify-content:space-between; align-items:center; margin-bottom:18px;}
.drawer__top img{height:44px;}
.drawer__close{border:none; background:var(--cream-d); width:44px; height:44px; border-radius:14px; font-size:22px; line-height:1; color:var(--ink); cursor:pointer;}
.drawer__nav a{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:15px 16px; background:#fff; border-radius:var(--r-s); margin-bottom:9px; font-family:var(--ff-h); font-weight:700; color:var(--ink); box-shadow:var(--sh-s);}
.drawer__nav a span.en{font-family:var(--ff-m); font-size:11px; color:var(--teal); letter-spacing:.1em;}
.drawer__nav a::after{content:"→"; color:var(--teal);}
.drawer__cta{display:grid; gap:10px; margin-top:20px;}
.drawer__cta .btn{width:100%;}
.drawer__info{margin-top:22px; background:#fff; border-radius:var(--r-s); padding:16px 18px; font-size:13.5px; line-height:1.9; box-shadow:var(--sh-s);}
.drawer__info strong{display:block; font-family:var(--ff-h); color:var(--ink);}

/* ============================================================
   HERO（トップ）
   ============================================================ */
.hero{position:relative; overflow:hidden; background:
  radial-gradient(70% 60% at 88% 12%, rgba(79,179,190,.22), transparent 62%),
  radial-gradient(60% 55% at 6% 88%, rgba(255,179,0,.20), transparent 60%),
  linear-gradient(170deg,#FFFDF6 0%, var(--cream) 55%, #F3FAFA 100%);}
.hero__deco{position:absolute; inset:0; pointer-events:none; z-index:0;}
.hero__deco i{position:absolute; display:block; opacity:.55;}
.hero__deco .d1{width:150px; height:150px; left:3%; top:12%; background:var(--leaf-p); border-radius:56% 44% 50% 50%/50% 50% 46% 54%; animation:float 9s ease-in-out infinite;}
.hero__deco .d2{width:96px; height:96px; right:6%; bottom:16%; background:var(--apple-p); border-radius:50% 50% 44% 56%/56% 44% 50% 50%; animation:float 11s ease-in-out infinite reverse;}
.hero__deco .d3{width:60px; height:60px; left:46%; top:6%; background:var(--yellow-p); border-radius:50%; animation:float 7s ease-in-out infinite;}
@keyframes float{0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-20px) rotate(7deg)}}

.hero__in{position:relative; z-index:2; display:grid; grid-template-columns:1.02fr .98fr; gap:46px; align-items:center; padding:70px 0 96px;}
.hero__copy{display:grid; gap:22px; justify-items:start;}
.hero__tag{display:inline-flex; align-items:center; gap:9px; background:#fff; border:2px solid var(--line-warm); border-radius:999px; padding:7px 18px; font-family:var(--ff-h); font-weight:700; font-size:13px; color:var(--teal-d); box-shadow:var(--sh-s); max-width:100%;}
.hero__tag .t{min-width:0;}
.hero__tag b{color:var(--apple);}
.hero h1{font-size:clamp(30px,4.3vw,49px); line-height:1.38; letter-spacing:.005em;}
.hero h1 .ln{display:block; white-space:nowrap;}
.hero h1 em{font-style:normal; position:relative; color:var(--teal); white-space:nowrap;}
.hero h1 em::after{content:""; position:absolute; left:-2px; right:-2px; bottom:.04em; height:.24em; background:rgba(255,179,0,.4); border-radius:99px; z-index:-1;}
.hero__lead{font-size:16px; max-width:31em;}
.hero__chips{display:flex; flex-wrap:wrap; gap:9px;}
.hero__chips span{display:inline-flex; align-items:center; gap:7px; background:#fff; border-radius:999px; padding:9px 16px; font-size:13.5px; font-weight:700; font-family:var(--ff-h); color:var(--ink); box-shadow:var(--sh-s);}
.hero__chips span::before{content:""; width:9px; height:9px; border-radius:50%; background:var(--leaf);}
.hero__chips span:nth-child(2)::before{background:var(--yellow);}
.hero__chips span:nth-child(3)::before{background:var(--apple);}
.hero__chips span:nth-child(4)::before{background:var(--teal);}

.hero__art{position:relative;}
.hero__art .ph{border-radius:var(--r-l); overflow:hidden; border:8px solid #fff; box-shadow:0 30px 60px -34px rgba(51,48,43,.6); background:#fff;}
.hero__art .ph img{width:100%; aspect-ratio:4/3; object-fit:cover;}
.hero__art .ph.p2{position:absolute; right:-14px; bottom:-40px; width:46%; border-width:6px; transform:rotate(4deg);}
.hero__art .ph.p3{position:absolute; left:-32px; top:-26px; width:36%; border-width:6px; transform:rotate(-5deg);}
.hero__bubble{position:absolute; left:-18px; bottom:26%; z-index:3; background:var(--apple); color:#fff; font-family:var(--ff-h); font-weight:700; font-size:13.5px; line-height:1.6; padding:12px 18px; border-radius:16px; box-shadow:var(--sh); max-width:190px;}
.hero__bubble::after{content:""; position:absolute; right:24px; bottom:-11px; border:7px solid transparent; border-top-color:var(--apple); border-bottom:0;}
/* ファーストビュー右下のSNSアイコン */
.hero__sns{position:absolute; right:max(28px,4vw); bottom:74px; z-index:4; display:flex; align-items:center; gap:10px;}
.hero__sns a{width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.92); backdrop-filter:blur(6px);
  display:grid; place-items:center; box-shadow:var(--sh-s); border:2px solid var(--line-soft);
  transition:transform .22s ease, background .22s ease, color .22s ease;}
.hero__sns a svg{width:22px; height:22px; display:block;}
.hero__sns a:hover{transform:translateY(-3px); color:#fff;}
.hero__sns a.is-ig{color:#C1358A;}
.hero__sns a.is-ig:hover{background:linear-gradient(45deg,#F9CE34 0%,#EE2A7B 52%,#6228D7 100%); border-color:transparent;}
.hero__sns a.is-fb{color:#1877F2;}
.hero__sns a.is-fb:hover{background:#1877F2; border-color:transparent;}
.hero__wave{position:relative; z-index:2; display:block; width:100%; height:auto; margin-bottom:-2px;}

/* ============================================================
   PAGE HERO（下層）
   ============================================================ */
.phero{position:relative; overflow:hidden; background:linear-gradient(160deg,#FFFDF6,var(--cream) 60%,#F1F9FA); padding:56px 0 12px;}
.phero__in{position:relative; z-index:2; text-align:center; padding-bottom:40px;}
.phero .eye{font-family:var(--ff-m); font-size:13px; font-weight:700; letter-spacing:.18em; color:var(--teal); text-transform:uppercase;}
.phero h1{font-size:clamp(27px,4.8vw,44px); margin:10px 0 0;}
.phero p{margin:16px auto 0; max-width:38em; font-size:15.5px;}
.phero__deco{position:absolute; inset:0; pointer-events:none;}
.phero__deco i{position:absolute; opacity:.5; border-radius:50%;}
.phero__deco .a{width:120px; height:120px; background:var(--teal-p); left:4%; top:16%;}
.phero__deco .b{width:78px; height:78px; background:var(--yellow-p); right:7%; top:26%;}
.phero__deco .c{width:54px; height:54px; background:var(--apple-p); right:22%; bottom:8%;}
.crumb{position:relative; z-index:2; font-size:12.5px; color:var(--muted); display:flex; flex-wrap:wrap; gap:7px; align-items:center;}
.crumb a:hover{color:var(--teal); text-decoration:underline;}
.crumb span{color:var(--muted);}

/* ============================================================
   3つの特色（トップ）
   ============================================================ */
.pt3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.pt3 .c{position:relative; display:flex; flex-direction:column; background:#fff; border-radius:var(--r); padding:56px 26px 30px; text-align:center; box-shadow:var(--sh); border:2px solid var(--line-soft);}
.pt3 .c .badge{position:absolute; left:50%; top:-30px; transform:translateX(-50%); width:72px;}
.pt3 .c h3{font-size:20px; margin-bottom:10px;}
.pt3 .c > p{font-size:14.5px; line-height:1.9; margin-bottom:20px;}
.pt3 .c .tagline{display:inline-block; font-family:var(--ff-m); font-size:12px; font-weight:700; letter-spacing:.12em; color:var(--teal); margin-bottom:6px;}
.pt3 .c .ph{border-radius:var(--r-s); overflow:hidden; margin:auto 0 0;}
.pt3 .c .ph img{width:100%; aspect-ratio:16/10; object-fit:cover;}

/* ============================================================
   お悩み（吹き出し）
   ============================================================ */
.worry{position:relative;}
.worry__grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); gap:16px; max-width:960px; margin:0 auto;}
.worry__b{position:relative; background:#fff; border:2px dashed var(--line-warm); border-radius:var(--r); padding:22px 22px 24px; font-family:var(--ff-h); font-weight:700; color:var(--ink); font-size:15.5px; line-height:1.8;}
.worry__b::after{content:""; position:absolute; left:32px; bottom:-13px; width:22px; height:22px; background:#fff; border-right:2px dashed var(--line-warm); border-bottom:2px dashed var(--line-warm); transform:rotate(45deg);}
.worry__b .em{display:block; font-family:var(--ff-m); font-size:12px; color:var(--yellow-d); letter-spacing:.1em; margin-bottom:4px;}
.worry__ans{margin:56px auto 0; max-width:880px; background:var(--teal); color:#fff; border-radius:var(--r-l); padding:44px 38px; text-align:center; box-shadow:var(--sh); position:relative;}
.worry__ans h3{color:#fff; font-size:clamp(20px,3.4vw,30px); line-height:1.6;}
.worry__ans h3 em{font-style:normal; color:var(--yellow); }
.worry__ans p{margin-top:16px; color:rgba(255,255,255,.94); font-size:15px;}
.worry__ans .pin{position:absolute; left:50%; top:-26px; transform:translateX(-50%); background:var(--yellow); color:#4A3400; font-family:var(--ff-h); font-weight:700; font-size:13.5px; padding:8px 22px; border-radius:999px; white-space:nowrap;}

/* ============================================================
   診療メニュー グリッド
   ============================================================ */
.menu{display:grid; grid-template-columns:repeat(auto-fit,minmax(238px,1fr)); gap:18px;}
.menu a, .menu .item{display:block; background:#fff; border-radius:var(--r); overflow:hidden; box-shadow:var(--sh-s); border:2px solid var(--line-soft); transition:transform .24s ease, box-shadow .24s ease, border-color .24s;}
.menu a:hover{transform:translateY(-6px); box-shadow:var(--sh); border-color:var(--teal-l);}
.menu .ph{position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--teal-p);}
.menu .ph img{width:100%; height:100%; object-fit:cover;}
.menu .ph .no{position:absolute; left:12px; top:12px; background:#fff; color:var(--teal); font-family:var(--ff-m); font-weight:700; font-size:12px; padding:4px 12px; border-radius:999px;}
.menu .bd{padding:20px 20px 24px;}
.menu .bd h3{font-size:18px; display:flex; align-items:center; gap:8px;}
.menu .bd h3::before{content:""; width:12px; height:12px; background:var(--yellow); border-radius:50% 50% 50% 0; transform:rotate(-45deg); flex:0 0 auto;}
.menu .bd p{margin-top:9px; font-size:14px; line-height:1.85; color:var(--body);}
.menu .bd .go{display:inline-flex; margin-top:12px; font-family:var(--ff-h); font-weight:700; font-size:13.5px; color:var(--teal);}
.menu .bd .go::after{content:"→"; margin-left:6px;}

/* ============================================================
   PICK UP（とくに力を入れている3つの治療）
   ============================================================ */
.pick{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.pick__i{position:relative; background:#fff; border-radius:var(--r); padding:52px 26px 28px; box-shadow:var(--sh); border:2px solid var(--line-soft); display:flex; flex-direction:column;}
.pick__i .badge{position:absolute; left:50%; top:-28px; transform:translateX(-50%); width:66px;}
.pick__i .tagline{display:block; text-align:center; font-family:var(--ff-m); font-size:11.5px; font-weight:700; letter-spacing:.14em; color:var(--teal); margin-bottom:6px;}
.pick__i h3{text-align:center; font-size:21px; line-height:1.5; margin-bottom:14px;}
.pick__i p{font-size:14.5px; line-height:1.9;}
.pick__i .chips{margin-top:14px;}
.pick__i .go{margin-top:auto; padding-top:18px; display:inline-flex; align-items:center; font-family:var(--ff-h); font-weight:700; font-size:14px; color:var(--teal);}
.pick__i .go::after{content:"→"; margin-left:7px;}
.pick__i:nth-child(2) .tagline{color:var(--apple);}
.pick__i:nth-child(3) .tagline{color:var(--leaf-d);}

/* 画像を縦に重ねるカラム（小児歯科など） */
.ph-stack{display:grid; gap:16px;}
.ph-stack figure{margin:0;}
.ph-stack figcaption{margin-top:8px; font-size:12.5px; color:var(--muted); text-align:center;}

@media(max-width:860px){
  .pick{grid-template-columns:1fr; gap:52px;}
}

/* ============================================================
   KIDS 帯
   ============================================================ */
.kids{background:linear-gradient(170deg,var(--leaf-p),#FFFDF4); position:relative; overflow:hidden;}
.kids__in{display:grid; grid-template-columns:.9fr 1.1fr; gap:44px; align-items:center; position:relative; z-index:2;}
.kids__art{position:relative;}
.kids__art img{width:100%; border-radius:var(--r-l);}
.kids__art .bub{width:78%; max-width:330px; margin:0 auto 6px; filter:drop-shadow(0 10px 18px rgba(51,48,43,.15));}
.kids__photo{margin:18px 0 0;}
.kids__photo img{width:100%; border-radius:var(--r); border:6px solid #fff; box-shadow:var(--sh);}
.kids__photo figcaption{margin-top:9px; font-size:12.5px; color:var(--muted); text-align:center; line-height:1.7;}
.kids h2{font-size:clamp(24px,4.2vw,38px); line-height:1.45;}
.kids .lead{margin-top:18px; font-size:15.5px;}
.kids__list{display:grid; gap:11px; margin-top:24px;}
.kids__list li{display:flex; gap:12px; align-items:flex-start; background:#fff; border-radius:var(--r-s); padding:15px 18px; box-shadow:var(--sh-s); font-size:14.5px; line-height:1.8;}
.kids__list li b{font-family:var(--ff-h); color:var(--ink); display:block;}
.kids__list li .ic{flex:0 0 auto; width:34px; height:34px; border-radius:50%; background:var(--leaf); color:#fff; display:grid; place-items:center; font-family:var(--ff-m); font-weight:700; font-size:14px;}
.kids__list li:nth-child(2) .ic{background:var(--yellow); color:#4A3400;}
.kids__list li:nth-child(3) .ic{background:var(--apple);}

/* ============================================================
   バナー列（矯正・審美など）
   ============================================================ */
.bnr{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px;}
.bnr a{display:block; border-radius:var(--r-s); overflow:hidden; box-shadow:var(--sh-s); border:2px solid var(--line-soft); transition:.24s;}
.bnr a:hover{transform:translateY(-4px); box-shadow:var(--sh);}
.bnr img{width:100%;}

/* ============================================================
   ギャラリー
   ============================================================ */
.gal{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.gal figure{margin:0; border-radius:var(--r-s); overflow:hidden; position:relative; box-shadow:var(--sh-s); background:#fff;}
.gal figure.w2{grid-column:span 2;}
.gal img{width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; transition:transform .5s ease;}
.gal figure:hover img{transform:scale(1.06);}
.gal figcaption{position:absolute; left:0; right:0; bottom:0; padding:22px 14px 10px; color:#fff; font-family:var(--ff-h); font-weight:700; font-size:13px; background:linear-gradient(transparent,rgba(51,48,43,.72));}

/* ============================================================
   CREED（当院のこだわり・旧サイトの5項目）
   ============================================================ */
.creed{display:grid; grid-template-columns:1fr 1fr; gap:16px; max-width:960px; margin:0 auto;}
.creed__i{display:grid; grid-template-columns:76px 1fr; gap:18px; align-items:start;
  background:#fff; border-radius:var(--r); padding:24px 26px; box-shadow:var(--sh-s); border:2px solid var(--line-soft);}
.creed__i .n img{width:68px;}
.creed__i h3{font-size:18px; line-height:1.6;}
.creed__i p{margin-top:9px; font-size:14px; line-height:1.85;}
.creed__i .go{display:inline-flex; margin-top:11px; font-family:var(--ff-h); font-weight:700; font-size:13.5px; color:var(--teal);}
.creed__i .go::after{content:"→"; margin-left:6px;}
.creed__i:nth-child(5){grid-column:1/-1;}
.creed__i:nth-child(5) .n img{width:74px;}

.creed__msg{position:relative; max-width:960px; margin:36px auto 0; background:#fff;
  border:2px dashed var(--line-warm); border-radius:var(--r); padding:38px 36px 32px; text-align:center;}
.creed__msg .lb{position:absolute; left:50%; top:-17px; transform:translateX(-50%); background:var(--leaf); color:#fff;
  font-family:var(--ff-h); font-weight:700; font-size:13px; padding:6px 20px; border-radius:999px; white-space:nowrap;}
.creed__msg p{font-size:15.5px; line-height:2;}
.creed__msg em{font-style:normal; font-weight:700; color:var(--apple);}

@media(max-width:860px){
  .creed{grid-template-columns:1fr;}
  .creed__i{grid-template-columns:58px 1fr; gap:14px; padding:20px;}
  .creed__i .n img,.creed__i:nth-child(5) .n img{width:54px;}
  .creed__msg{padding:32px 22px 26px;}
  .creed__msg p{font-size:15px; line-height:1.95;}
}

/* 設備写真グリッド（はじめての方へ） */
.eqgrid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:18px;}
.eqgrid figure{margin:0; background:var(--soft); border-radius:var(--r-s); overflow:hidden; box-shadow:var(--sh-s);}
.eqgrid img{width:100%; aspect-ratio:4/3; object-fit:cover; display:block;}
.eqgrid figcaption{padding:9px 10px 11px; font-size:12.5px; font-family:var(--ff-h); font-weight:700; color:var(--ink); text-align:center; line-height:1.5;}
@media(max-width:760px){ .eqgrid{grid-template-columns:repeat(2,1fr); gap:10px;} }

/* ============================================================
   FLOW（通院の流れ）
   ============================================================ */
.flow{display:grid; gap:16px; max-width:880px; margin:0 auto;}
.flow__s{display:grid; grid-template-columns:84px 1fr; gap:20px; align-items:center; background:#fff; border-radius:var(--r); padding:22px 26px; box-shadow:var(--sh-s); position:relative;}
.flow__s::after{content:""; position:absolute; left:52px; bottom:-16px; width:0; height:0; border:11px solid transparent; border-top-color:var(--cream-d); z-index:2;}
.flow__s:last-child::after{display:none;}
.flow__s .n img{width:72px;}
.flow__s h3{font-size:19px;}
.flow__s p{margin-top:6px; font-size:14.5px; line-height:1.85;}

/* ============================================================
   FAQ
   ============================================================ */
.faq{max-width:880px; margin:0 auto; display:grid; gap:12px;}
.faq__i{background:#fff; border-radius:var(--r); box-shadow:var(--sh-s); border:2px solid var(--line-soft); overflow:hidden;}
.faq__q{width:100%; display:flex; align-items:center; gap:14px; text-align:left; background:none; border:0; cursor:pointer; padding:20px 54px 20px 22px; font-family:var(--ff-h); font-weight:700; font-size:16px; color:var(--ink); position:relative; line-height:1.7;}
.faq__q .qm{flex:0 0 auto; width:34px; height:34px; border-radius:50%; background:var(--teal); color:#fff; display:grid; place-items:center; font-family:var(--ff-m); font-size:15px;}
.faq__q .ic{position:absolute; right:22px; top:50%; width:16px; height:16px; transform:translateY(-50%);}
.faq__q .ic::before,.faq__q .ic::after{content:""; position:absolute; background:var(--teal); border-radius:2px; transition:transform .28s ease;}
.faq__q .ic::before{left:0; top:7px; width:16px; height:2.5px;}
.faq__q .ic::after{left:7px; top:0; width:2.5px; height:16px;}
.faq__q[aria-expanded="true"] .ic::after{transform:rotate(90deg); opacity:0;}
.faq__a{display:grid; grid-template-rows:0fr; transition:grid-template-rows .32s ease;}
.faq__i.is-open .faq__a{grid-template-rows:1fr;}
.faq__a > div{overflow:hidden;}
.faq__a .in{display:flex; gap:14px; padding:0 22px 22px 22px; font-size:14.5px; line-height:1.95;}
.faq__a .am{flex:0 0 auto; width:34px; height:34px; border-radius:50%; background:var(--yellow); color:#4A3400; display:grid; place-items:center; font-family:var(--ff-m); font-size:15px; font-weight:700;}

/* ============================================================
   NEWS
   ============================================================ */
.news{max-width:880px; margin:0 auto;}
.news__row{display:grid; grid-template-columns:auto auto 1fr auto; gap:16px; align-items:center; padding:18px 20px; background:#fff; border-radius:var(--r-s); box-shadow:var(--sh-s); margin-bottom:10px; transition:.22s;}
.news__row:hover{transform:translateX(5px); box-shadow:var(--sh);}
.news__row .d{font-family:var(--ff-m); font-size:13.5px; color:var(--muted); white-space:nowrap;}
.news__row .cat{font-size:11.5px; font-weight:700; font-family:var(--ff-h); color:#fff; background:var(--teal); border-radius:999px; padding:3px 13px; white-space:nowrap;}
.news__row .cat.y{background:var(--yellow); color:#4A3400;}
.news__row .cat.r{background:var(--apple);}
.news__row .t{font-size:14.5px; color:var(--ink); font-weight:500;}
.news__row .ar{color:var(--teal);}

/* ============================================================
   INFO（診療時間・アクセス）
   ============================================================ */
.info{display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:start;}
.info--solo{grid-template-columns:1fr; max-width:680px; margin:0 auto;}
.info__card{background:#fff; border-radius:var(--r); padding:30px 30px 34px; box-shadow:var(--sh); border:2px solid var(--line-soft);}
.info__card h3{font-size:20px; margin-bottom:18px; display:flex; align-items:center; gap:9px;}
.info__card h3::before{content:""; width:13px; height:13px; background:var(--teal); border-radius:50% 50% 50% 0; transform:rotate(-45deg);}
.tbl{width:100%; border-collapse:collapse; font-size:14.5px;}
.tbl th,.tbl td{border:1px solid var(--line); padding:10px 6px; text-align:center;}
.tbl thead th{background:var(--teal-p); color:var(--teal-d); font-family:var(--ff-h); font-weight:700;}
.tbl tbody th{background:var(--soft); font-family:var(--ff-m); font-weight:700; color:var(--ink); white-space:nowrap; padding:10px 12px;}
.tbl td{color:var(--teal); font-size:16px;}
.tbl .x{color:var(--muted);}
.note{margin-top:12px; font-size:13px; color:var(--muted); line-height:1.8;}
.dl{display:grid; gap:0; font-size:14.5px;}
.dl > div{display:grid; grid-template-columns:104px 1fr; gap:14px; padding:12px 0; border-bottom:1px dashed var(--line);}
.dl > div:last-child{border-bottom:0;}
.dl dt{font-family:var(--ff-h); font-weight:700; color:var(--ink);}
.dl dd{margin:0;}
.map{border-radius:var(--r); overflow:hidden; box-shadow:var(--sh); border:6px solid #fff; background:var(--teal-p);}
.map iframe{display:block; width:100%; height:380px; border:0;}

/* ============================================================
   料金表
   ============================================================ */
.price{background:#fff; border-radius:var(--r); box-shadow:var(--sh); overflow:hidden; border:2px solid var(--line-soft); margin-bottom:26px;}
.price h3{background:var(--teal); color:#fff; font-size:18px; padding:15px 24px;}
.price h3.y{background:var(--yellow); color:#4A3400;}
.price h3.r{background:var(--apple);}
.price h3.g{background:var(--leaf);}
.price table{width:100%; border-collapse:collapse; font-size:14.5px;}
.price th,.price td{padding:14px 22px; border-bottom:1px solid var(--line-soft); text-align:left; vertical-align:top;}
.price th{font-family:var(--ff-h); font-weight:700; color:var(--ink); width:56%;}
.price td{font-family:var(--ff-m); font-weight:700; color:var(--teal-d); white-space:nowrap; text-align:right;}
.price tr:last-child th,.price tr:last-child td{border-bottom:0;}
.price .sub{display:block; font-family:var(--ff-b); font-weight:400; font-size:13px; color:var(--muted); margin-top:3px; line-height:1.7;}

/* ============================================================
   本文カード（下層汎用）
   ============================================================ */
.card{background:#fff; border-radius:var(--r); padding:32px 34px; box-shadow:var(--sh-s); border:2px solid var(--line-soft);}
.card + .card{margin-top:20px;}
.card h3,.card h2{font-size:21px; margin-bottom:12px; display:flex; gap:10px; align-items:center;}
.card h3 .n,.card h2 .n{flex:0 0 auto; width:36px; height:36px; border-radius:50%; background:var(--teal); color:#fff; display:grid; place-items:center; font-family:var(--ff-m); font-size:16px;}
.card p + p{margin-top:12px;}
.card .ph{border-radius:var(--r-s); overflow:hidden; margin-top:18px;}

.split{display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:center;}
.split.is-rev > *:first-child{order:2;}
.split__ph{border-radius:var(--r-l); overflow:hidden; border:7px solid #fff; box-shadow:var(--sh);}
.split__ph img{width:100%; aspect-ratio:3/2; object-fit:cover;}
.split h3,.split h2{font-size:clamp(20px,3.2vw,28px); line-height:1.5;}
.split p{margin-top:14px; font-size:15px;}

.chips{display:flex; flex-wrap:wrap; gap:9px; margin-top:18px;}
.chips li{background:var(--cream); border:2px solid var(--line-warm); border-radius:999px; padding:7px 16px; font-size:13.5px; font-family:var(--ff-h); font-weight:700; color:var(--ink);}

.checks{display:grid; gap:11px; margin-top:16px;}
.checks li{display:flex; gap:11px; align-items:flex-start; font-size:14.5px; line-height:1.85;}
.checks li::before{content:"✓"; flex:0 0 auto; width:24px; height:24px; border-radius:50%; background:var(--leaf); color:#fff; display:grid; place-items:center; font-size:13px; margin-top:4px;}


/* 見出し横の英字ラベル（下層本文で使用） */
.eye{display:inline-block;}

/* ============================================================
   FINAL CTA
   ============================================================ */
.fcta{position:relative; overflow:hidden; background:linear-gradient(160deg,var(--teal) 0%, #016D78 60%, #005B66 100%); color:#fff; padding:88px 0;}
.fcta::before,.fcta::after{content:""; position:absolute; border-radius:50%; opacity:.16;}
.fcta::before{width:320px; height:320px; background:var(--yellow); left:-90px; top:-110px;}
.fcta::after{width:260px; height:260px; background:var(--leaf); right:-70px; bottom:-90px;}
.fcta__in{position:relative; z-index:2; text-align:center;}
.fcta h2{color:#fff; font-size:clamp(24px,4.4vw,40px); line-height:1.5;}
.fcta h2 em{font-style:normal; color:var(--yellow);}
.fcta p{margin:18px auto 0; max-width:38em; color:rgba(255,255,255,.93); font-size:15.5px;}
.fcta__btns{display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin-top:30px;}
.fcta__tel{display:inline-flex; flex-direction:column; align-items:center; background:#fff; color:var(--teal-d); border-radius:var(--r); padding:16px 34px; box-shadow:var(--sh);}
.fcta__tel .lb{font-size:12px; font-family:var(--ff-h); font-weight:700; color:var(--muted);}
.fcta__tel .nm{font-family:var(--ff-m); font-weight:700; font-size:30px; line-height:1.2; letter-spacing:.02em;}
.fcta__sub{margin-top:22px; font-size:13.5px; color:rgba(255,255,255,.85);}

/* ============================================================
   FOOTER
   ============================================================ */
.ft{background:var(--soft); padding:70px 0 0; border-top:5px solid var(--teal);}
.ft__in{display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:40px; padding-bottom:40px;}
.ft__logo img{height:64px; width:auto; margin-bottom:18px;}
.ft__nap{font-size:14px; line-height:1.95;}
.ft__nap .tel{font-family:var(--ff-m); font-weight:700; font-size:26px; color:var(--teal); display:block; margin-top:10px; letter-spacing:.02em;}
.ft__sns{display:flex; gap:10px; margin-top:16px;}
.ft__sns a{width:46px; height:46px; border-radius:15px; background:#fff; box-shadow:var(--sh-s); display:grid; place-items:center; transition:background .22s ease, color .22s ease, transform .22s ease;}
.ft__sns a:hover{transform:translateY(-3px); color:#fff;}
.ft__sns .i-sns{width:22px; height:22px; display:block;}
.ft__sns a.is-fb{color:#1877F2;}
.ft__sns a.is-fb:hover{background:#1877F2;}
.ft__sns a.is-ig{color:#C1358A;}
.ft__sns a.is-ig:hover{background:linear-gradient(45deg,#F9CE34 0%,#EE2A7B 52%,#6228D7 100%);}
.ft__sns a.is-df{color:var(--teal);}
.ft__sns a.is-df:hover{background:var(--teal);}
.ft__col h4{font-size:14px; font-family:var(--ff-m); letter-spacing:.12em; color:var(--teal); margin-bottom:14px;}
.ft__col a{display:block; font-size:14px; padding:5px 0; color:var(--body);}
.ft__col a:hover{color:var(--teal); text-decoration:underline;}
/* フッターの小さなGoogleマップ（全幅バンド） */
.ft__map{padding-bottom:40px;}
.ft__map__head{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; margin-bottom:12px;}
.ft__map__head h4{font-size:13px; font-family:var(--ff-m); letter-spacing:.14em; color:var(--teal); margin:0;}
.ft__map__head .ad{font-size:13px; color:var(--body);}
.ft__map__frame{border-radius:var(--r-s); overflow:hidden; border:4px solid #fff; box-shadow:var(--sh-s); background:var(--teal-p); line-height:0;}
.ft__map__frame iframe{display:block; width:100%; height:190px; border:0;}
.ft__map__link{margin-left:auto; display:inline-flex; align-items:center; gap:6px; font-size:13px; font-family:var(--ff-h); font-weight:700; color:var(--teal);}
.ft__map__link::after{content:"↗"; font-size:.9em;}
.ft__map__link:hover{text-decoration:underline;}
.ft__cp{border-top:1px solid var(--line); padding:18px 0 calc(18px + env(safe-area-inset-bottom)); font-size:12px; color:var(--muted);}
.ft__cp .in{width:min(1120px,calc(100% - 44px)); margin:0 auto; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;}

/* Page top（りんご） */
.ptop{position:fixed; right:18px; bottom:22px; z-index:80; width:66px; opacity:0; visibility:hidden; transform:translateY(14px); transition:.3s;}
.ptop.is-on{opacity:1; visibility:visible; transform:none;}
.ptop:hover{transform:translateY(-5px);}

/* スマホ固定CTA */
.sp-cta{display:none; position:fixed; left:0; right:0; bottom:0; z-index:85; background:rgba(255,255,255,.97); box-shadow:0 -6px 20px -12px rgba(51,48,43,.6); padding:8px 10px calc(8px + env(safe-area-inset-bottom)); grid-template-columns:1fr 1fr 1fr; gap:7px;}
.sp-cta a{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; border-radius:14px; padding:9px 4px; font-family:var(--ff-h); font-weight:700; font-size:11.5px; line-height:1.3; color:#fff; text-align:center;}
.sp-cta a.tel{background:var(--teal);} .sp-cta a.rsv{background:var(--yellow); color:#4A3400;} .sp-cta a.map{background:var(--apple);}
.sp-cta a .i{display:flex; line-height:1;}
.sp-cta a .i .i-svg{width:20px; height:20px;}

/* ============================================================
   REVEAL
   ============================================================ */
[data-rv]{opacity:0; transform:translateY(22px); transition:opacity .5s ease, transform .5s cubic-bezier(.22,1,.36,1);}
[data-rv].is-in{opacity:1; transform:none;}
@media(prefers-reduced-motion:reduce){
  [data-rv]{opacity:1 !important; transform:none !important; transition:none;}
  .hero__deco i{animation:none;}
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1080px){
  .hd__nav > a{font-size:13.5px; padding:9px 10px;}
  .hd__logo img{height:46px;}
}
@media(max-width:980px){
  :root{--head-h:0px;}
  .hd{position:static;}
  .hd__nav,.hd__cta{display:none;}
  .hd__burger{display:block;}
  .hd__main{padding:10px 0;}
  .hero__in{grid-template-columns:1fr; gap:44px; padding:46px 0 26px;}
  .hero__art{max-width:520px; margin:0 auto; width:100%;}
  .hero__sns{position:static; width:min(1120px,calc(100% - 44px)); margin:0 auto; padding-bottom:30px; justify-content:flex-start;}
  .hero__art .ph.p3{left:-14px; top:-16px;}
  .hero__bubble{left:-6px; bottom:14%;}
  .pt3{grid-template-columns:1fr; gap:56px;}
  .kids__in{grid-template-columns:1fr; gap:36px;}
  .info{grid-template-columns:1fr; gap:24px;}
  .split{grid-template-columns:1fr; gap:24px;}
  .split.is-rev > *:first-child{order:0;}
  .ft__in{grid-template-columns:1fr 1fr; gap:30px;}
  .ft__logo{grid-column:1/-1;}
  .gal{grid-template-columns:repeat(2,1fr);}
  .gal figure.w2{grid-column:span 2;}
}
@media(max-width:760px){
  :root{--head-h:0px;}
  body{font-size:15.5px; line-height:1.9;}
  .hero h1 .ln{white-space:normal;}
  .sec{padding:64px 0;}
  .wrap,.wrap-n{width:calc(100% - 32px);}
  .hd__bar .msg{display:none;}
  .hd__bar .in{justify-content:center; gap:12px; padding:6px 0;}
  .hd__bar .r{gap:12px;}
  .hd__bar .r > span{display:none;}
  .hd__bar .tel{font-size:14.5px;}
  .hd__bar .rsv{font-size:11.5px; padding:4px 12px;}
  .crumb{font-size:11.5px;}
  .phero{padding:40px 0 10px;}
  .phero__in{padding-bottom:30px;}
  .sp-cta{display:grid;}
  body{padding-bottom:78px;}
  .ptop{bottom:88px; width:54px; right:12px;}
  .shead{margin-bottom:36px;}
  .worry__ans{padding:38px 22px; border-radius:var(--r);}
  .flow__s{grid-template-columns:56px 1fr; gap:14px; padding:18px;}
  .flow__s .n img{width:52px;}
  .flow__s::after{left:34px;}
  .news__row{grid-template-columns:auto 1fr; gap:8px 12px; padding:15px 16px;}
  .news__row .ar{display:none;}
  .news__row .t{grid-column:1/-1;}
  .card{padding:24px 20px;}
  .price th,.price td{padding:12px 16px;}
  .price th{width:auto;}
  .dl > div{grid-template-columns:1fr; gap:2px;}
  .map iframe{height:300px;}
  .fcta{padding:64px 0;}
  .ft__in{grid-template-columns:1fr; gap:26px;}
  .ft__map__head{gap:8px;}
  .ft__map__head .ad{width:100%; order:3; font-size:12.5px;}
  .ft__map__link{margin-left:0;}
  .ft__map__frame iframe{height:200px;}
  .btn{width:100%; font-size:15px;}
  .hero .btn-row,.fcta__btns{width:100%;}
  .hero__chips span{font-size:12.5px; padding:8px 13px;}
  .hero__sns{width:calc(100% - 32px); gap:8px; padding-bottom:24px;}
  .hero__sns a{width:42px; height:42px;}
  .hero__sns a svg{width:20px; height:20px;}
}
@media(max-width:480px){
  .hero h1{font-size:25px; line-height:1.42;}
  .hero__tag{align-items:flex-start; border-radius:18px; padding:8px 15px; font-size:12px; line-height:1.65;}
  .hero__tag .i-apple{margin-top:3px;}
  .hero__lead{font-size:15px;}
}
@media(max-width:420px){
  .gal{grid-template-columns:1fr;}
  .gal figure.w2{grid-column:span 1;}
  .tbl th,.tbl td{padding:8px 3px; font-size:13px;}
}

/* ============ お知らせ（休診日） ============ */
.notice{padding-top:54px; padding-bottom:54px;}
.notice__box{display:grid; grid-template-columns:1fr .92fr; gap:34px; align-items:center;
  background:var(--soft); border:2px solid var(--line-warm); border-radius:var(--r-l);
  padding:36px 38px; box-shadow:var(--sh-s);}
.notice__body .eye{display:inline-flex; align-items:center; gap:9px; font-family:var(--ff-m);
  font-size:13px; font-weight:700; letter-spacing:.16em; color:var(--teal); text-transform:uppercase;}
.notice__body h2{margin:6px 0 14px; font-size:clamp(22px,2.4vw,29px);}
.notice__lead{margin:0 0 12px; font-family:var(--ff-h); font-weight:700;
  font-size:clamp(17px,1.7vw,20px); line-height:1.7; color:var(--teal-d);}
.notice__note{margin:0; font-size:14.5px; line-height:1.95; color:var(--body);}
.notice__act{margin-top:20px;}
.notice__cal{margin:0;}
.notice__cal img{display:block; width:100%; height:auto; border-radius:var(--r-s);
  border:2px solid var(--line-soft); background:#fff; box-shadow:var(--sh-s);}
.notice__cal figcaption{margin-top:9px; text-align:center; font-size:12.5px; color:var(--muted);}

@media (max-width:860px){
  .notice{padding-top:40px; padding-bottom:40px;}
  .notice__box{grid-template-columns:1fr; gap:24px; padding:28px 20px; border-radius:var(--r);}
  .notice__act .btn{width:100%;}
}