/* 뉴히어링 보청기 지역 랜딩 — 고령층 기준: 본문 18px 이상, 큰 버튼, 높은 대비 */
:root{
  --coral:#ff5a5f;        /* 브랜드 포인트(장식·테두리·강조선). 흰 글씨 배경으로 쓰지 않는다 — 대비 3.0:1 */
  --coral-deep:#c8323a;   /* 흰 글씨 버튼 배경 — 대비 5.3:1 */
  --coral-soft:#fff1f1;
  --ink:#222;
  --ink-2:#4a4a4a;
  --line:#e4e4e4;
  --bg:#fff;
  --bg-2:#f7f7f7;
  --dark:#2b2b2b;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Pretendard","Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",sans-serif;font-size:19px;line-height:1.7;word-break:keep-all;overflow-wrap:break-word}
a{color:inherit}
img{max-width:100%}
.wrap{max-width:720px;margin:0 auto;padding:0 20px}
h1,h2,h3{line-height:1.4;margin:0}
h2{font-size:26px;margin-bottom:20px}
h3{font-size:21px}
p{margin:0 0 12px}
section{padding:44px 0;border-top:1px solid var(--line)}
section.alt{background:var(--bg-2)}
.lead{color:var(--ink-2)}
.miss{display:inline-block;background:#fff4c2;color:#6b5200;border:1px dashed #c9a500;border-radius:6px;padding:0 6px;font-size:16px}

/* 상단 바 */
.top{position:sticky;top:0;z-index:20;background:#fff;border-bottom:3px solid var(--coral)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px}
.top-name{font-weight:700;font-size:18px;line-height:1.35;text-decoration:none}
.top-name small{display:block;font-weight:500;font-size:15px;color:var(--ink-2)}
.top-tel{flex:none;display:inline-flex;align-items:center;gap:6px;background:var(--coral-deep);color:#fff;text-decoration:none;font-weight:700;font-size:17px;padding:10px 14px;border-radius:10px}

/* 버튼 */
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:60px;padding:14px 18px;border-radius:12px;border:0;font:inherit;font-size:20px;font-weight:700;text-decoration:none;cursor:pointer}
.btn-call{background:var(--coral-deep);color:#fff}
.btn-book{background:var(--dark);color:#fff}
.btn-line{background:#fff;color:var(--ink);border:2px solid var(--ink)}
.btn[aria-disabled="true"],.top-tel[aria-disabled="true"]{background:#e9e9e9;color:#555;cursor:default}
.btn-row{display:grid;gap:12px}
.btn:focus-visible,.top-tel:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #1a5fd0;outline-offset:2px}

/* 히어로 */
.hero{padding:20px 0 32px;border-top:0}
.hero-tag{display:inline-block;color:var(--coral-deep);font-weight:700;font-size:17px;border-bottom:2px solid var(--coral);margin-bottom:12px}
.hero h1{font-size:32px;margin-bottom:14px}
.hero-loc{font-size:20px;font-weight:600;margin-bottom:24px}
.hero-loc span{color:var(--ink-2);font-weight:500}
.hero-loc .park{display:inline-block;margin-top:4px;padding:2px 10px;border:1px solid var(--coral);border-radius:999px;color:var(--ink);font-size:17px}

/* 진행 절차 */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.steps li{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px}
.steps .n{flex:none;width:42px;height:42px;border-radius:50%;border:2px solid var(--coral);color:var(--coral-deep);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:20px}
.steps b{display:block;font-size:20px}
.steps p{margin:4px 0 0;color:var(--ink-2)}

/* 체크 목록 */
.checks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.checks li{position:relative;padding:14px 16px 14px 48px;background:#fff;border:1px solid var(--line);border-radius:12px}
.checks li::before{content:"";position:absolute;left:18px;top:24px;width:14px;height:8px;border-left:3px solid var(--coral-deep);border-bottom:3px solid var(--coral-deep);transform:rotate(-45deg)}

.facts{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.facts li{padding-left:16px;border-left:4px solid var(--coral)}

.brands{list-style:none;margin:0 0 16px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.brands li{text-align:center;padding:14px 6px;border:1px solid var(--line);border-radius:10px;font-weight:700;background:#fff}

.notice{background:var(--coral-soft);border-radius:12px;padding:18px;margin-top:14px}
.notice h3{margin-bottom:8px}

/* 매장 안내 */
.info{width:100%;border-collapse:collapse}
.info th,.info td{text-align:left;vertical-align:top;padding:12px 0;border-bottom:1px solid var(--line)}
.info th{width:92px;color:var(--ink-2);font-weight:600}
.hours{margin:0;padding:0;list-style:none}
.hours li{display:flex;justify-content:space-between;gap:12px}
.map-btn{margin-top:18px}

/* FAQ */
.faq details{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;background:#fff}
.faq summary{cursor:pointer;list-style:none;padding:18px 48px 18px 18px;font-weight:700;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:18px;top:14px;font-size:26px;color:var(--coral-deep)}
.faq details[open] summary::after{content:"−"}
.faq .a{padding:0 18px 18px;color:var(--ink-2)}

/* 예약 폼 */
.form label,.form .lbl{display:block;font-weight:700;margin:18px 0 8px}
.form input[type=text],.form input[type=tel],.form input[type=date]{width:100%;min-height:58px;padding:12px 14px;font:inherit;font-size:20px;border:2px solid #9a9a9a;border-radius:10px;background:#fff;color:var(--ink)}
.who{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.who input{position:absolute;opacity:0;pointer-events:none}
.who span{display:flex;align-items:center;justify-content:center;min-height:56px;border:2px solid #9a9a9a;border-radius:10px;font-weight:700;cursor:pointer;background:#fff}
.who input:checked+span{border-color:var(--coral-deep);background:var(--coral-soft);color:var(--coral-deep)}
.who input:focus-visible+span{outline:3px solid #1a5fd0;outline-offset:2px}
.agree{display:flex;gap:12px;align-items:flex-start;margin:22px 0 6px;font-weight:600}
.agree input{width:26px;height:26px;flex:none;margin-top:3px;accent-color:var(--coral-deep)}
.agree-detail{font-size:16px;color:var(--ink-2);margin:0 0 18px}
.agree-detail summary{cursor:pointer;text-decoration:underline}
.form-msg{min-height:28px;margin:12px 0 0;font-weight:700;color:#b00020}
.form-ok{display:none;text-align:center;padding:28px 18px;border:2px solid var(--coral);border-radius:14px;background:#fff}
.form-ok h3{margin-bottom:8px}

/* 다른 지점 */
.others{display:grid;gap:10px}
.others a{display:flex;justify-content:space-between;align-items:center;padding:18px;border:2px solid var(--line);border-radius:12px;text-decoration:none;font-weight:700;background:#fff}
.others a::after{content:"→";color:var(--coral-deep)}

/* 푸터 */
.foot{background:#f1f1f1;color:#444;font-size:16px;line-height:1.7;padding:32px 0 120px;border-top:1px solid var(--line)}
.foot b{color:#222}
.foot details{margin-top:14px}
.foot summary{cursor:pointer;font-weight:700;text-decoration:underline}
.foot .pp{margin-top:10px}
.foot .pp h4{font-size:16px;margin:14px 0 4px}

/* 하단 고정 바 */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 14px rgba(0,0,0,.08);padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
.dock .in{max-width:720px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dock .btn{min-height:58px;font-size:19px}

/* 지점 선택(루트) */
.cards{display:grid;gap:18px}
.card{border:2px solid var(--line);border-top:6px solid var(--coral);border-radius:14px;padding:22px;background:#fff}
.card h2{font-size:24px;margin-bottom:12px}
.card .info th{width:80px}
.card .btn-row{margin-top:18px}

/* 첫 화면 신뢰 배지 — 375px에서 2×2 */
.badges{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.badges li{display:flex;align-items:center;gap:8px;padding:10px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:16px;font-weight:700;line-height:1.3}
.badges li:last-child:nth-child(odd){grid-column:1/-1}
.badges svg{flex:none;width:24px;height:24px;color:var(--coral-deep)}
.guardian{font-size:17px;background:var(--bg-2);border-left:4px solid var(--coral);padding:10px 12px;border-radius:0 8px 8px 0;margin:0 0 18px}

/* 지원 제도 */
.support{background:var(--coral-soft);border-top:0;padding:32px 0}
.support h2{font-size:22px;margin-bottom:14px}
.support-list{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:8px}
.support-list li{background:#fff;border-radius:10px;padding:12px 14px;font-size:17px;line-height:1.55}
.support-note{font-size:16px;color:var(--ink-2);margin-bottom:16px}

/* 오시는 길 */
.route{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:20px}
.route-addr{font-size:20px;font-weight:700;margin-bottom:10px}
.route-row{display:flex;gap:12px;margin:0 0 8px}
.route-row b{flex:none;width:76px;color:var(--ink-2);font-weight:600}
.route .btn-row{margin-top:14px}

/* 부담 줄이는 안내 */
.ease{padding:28px 0}
.ease-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ease-list li{padding:14px 16px 14px 48px;position:relative;border:2px solid var(--coral);border-radius:12px;font-weight:700;line-height:1.5}
.ease-list li::before{content:"";position:absolute;left:18px;top:22px;width:14px;height:8px;border-left:3px solid var(--coral-deep);border-bottom:3px solid var(--coral-deep);transform:rotate(-45deg)}

.form small{font-weight:500;color:var(--ink-2);font-size:15px}
.agree.opt{margin-top:20px;font-weight:600}

/* 사진 — 매장 실사진만 쓴다 */
.ph{margin:0}
.ph img{display:block;width:100%;height:100%;object-fit:cover;border-radius:12px;background:var(--bg-2)}
.ph figcaption{font-size:15px;color:var(--ink-2);margin-top:6px;line-height:1.5}
.hero-ph{display:grid;gap:10px;margin-bottom:22px}
.hero-ph img{border-radius:14px;height:auto}
.hero-ph.n1 img{aspect-ratio:2/1}
.hero-ph.n2{grid-template-columns:1fr 1fr}
.hero-ph.n2 img{aspect-ratio:1/1;object-position:50% 8%}
.hero-hours{margin:-10px 0 20px;font-size:18px;color:var(--ink-2)}
.hero-hours b{color:var(--ink)}
.step-ph{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.step-ph .ph:only-child{grid-column:1/-1}
.step-ph .ph img{aspect-ratio:4/3;height:auto}
.step-ph .ph:only-child img{aspect-ratio:16/9}
.drs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px}
.dr{background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 10px 14px;text-align:center}
.dr b{display:block;font-size:20px;margin-top:10px}
.dr ul{text-align:left;font-size:16px;margin:8px 0 0;padding-left:18px;color:var(--ink-2)}
.dr-ph img{aspect-ratio:3/4;height:auto;object-position:50% 12%;border-radius:10px}
.cert{margin-top:26px}
.cert h3{margin-bottom:10px}
.cert-ph{max-width:340px}
.cert-ph img{height:auto}
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:20px}
.gallery .ph:first-child{grid-column:1/-1}
.gallery .ph:first-child img{aspect-ratio:16/7}
.gallery .ph img{aspect-ratio:1/1;height:auto}
.card-ph{display:grid;gap:8px;margin:-6px -6px 16px}
.card-ph.n1 img{aspect-ratio:16/10;height:auto}
.card-ph.n2{grid-template-columns:1fr 1fr}
.card-ph.n2 img{aspect-ratio:3/4;height:auto;object-position:50% 12%}

@media (min-width:768px){
  .hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
  .hero-grid .hero-ph{order:2;margin:0}
  .hero-grid .hero-ph.n1 img{aspect-ratio:4/3}
  .hero-grid .hero-ph.n2 img{aspect-ratio:4/5}
  .hero-grid .hero-text .btn-row.two{grid-template-columns:1fr}
  .wrap.hero-grid{max-width:1040px}
  .drs{grid-template-columns:1fr 1fr;max-width:520px}
  body{font-size:19px}
  .hero{padding:64px 0 52px}
  .hero h1{font-size:40px}
  .btn-row.two{grid-template-columns:1fr 1fr}
  .brands{grid-template-columns:repeat(6,1fr)}
  .cards{grid-template-columns:1fr 1fr}
  .wrap.wide{max-width:960px}
}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
