:root{
  --navy:#13294b; --navy-2:#1d3a63; --navy-deep:#0d1d36;
  --teal:#2f8a96; --teal-soft:#e8f2f3;
  --gold:#b59a62;
  --ink:#1c2430; --body:#4b5563; --muted:#8a94a3;
  --line:#e3e7ec; --bg-alt:#f4f6f9;
  --radius:18px; --maxw:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Pretendard,-apple-system,'Malgun Gothic',sans-serif;color:var(--ink);background:#fff;line-height:1.6;word-break:keep-all}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.sm-wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* ---------- header (아임웹 이식 시 제거) ---------- */
.sm-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.sm-header .sm-wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.sm-logo img{height:46px}
.sm-gnb{display:flex;gap:44px;font-size:17px;font-weight:600;color:var(--ink)}
.sm-gnb a:hover{color:var(--teal)}
.sm-tel{font-size:15px;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:8px}
.sm-tel span{font-size:12px;font-weight:500;color:var(--muted)}

/* ---------- hero ---------- */
.sm-hero{position:relative;height:760px;overflow:hidden;color:#fff;display:flex;align-items:center}
.sm-hero-bg{position:absolute;inset:0}
.sm-hero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.4s ease;transform:scale(1.04)}
.sm-hero-bg img.on{opacity:1}
.sm-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,29,54,.55) 0%,rgba(13,29,54,.72) 60%,rgba(13,29,54,.88) 100%)}
.sm-hero-in{position:relative;z-index:2;width:100%;text-align:center}
.sm-hero-eyebrow{display:inline-block;font-size:14px;letter-spacing:.24em;color:#cfe3e6;margin-bottom:22px}
.sm-hero h1.sm-hero-title{font-size:58px;font-weight:700;line-height:1.25;letter-spacing:-.02em;color:#fff}
.sm-hero h1.sm-hero-title em{font-style:normal;color:#8fd0d8}
.sm-hero-sub{display:inline-block;margin-top:26px;padding:10px 26px;border:1px solid rgba(255,255,255,.35);border-radius:40px;font-size:17px;color:#e9eef4;background:rgba(255,255,255,.06)}
.sm-hero-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:960px;margin:56px auto 0;text-align:left}
.sm-hcard{position:relative;border-radius:var(--radius);padding:30px 30px 26px;min-height:210px;display:flex;flex-direction:column;transition:transform .25s}
.sm-hcard:hover{transform:translateY(-6px)}
.sm-hcard .sm-hc-ico{position:absolute;top:24px;right:24px;width:48px;height:48px;border-radius:12px;display:grid;place-items:center}
.sm-hcard .sm-hc-ico svg{width:22px;height:22px}
.sm-hcard h3{font-size:25px;font-weight:700;margin-bottom:10px;color:inherit}
.sm-hcard p{font-size:15px;line-height:1.6;opacity:.85}
.sm-hcard .sm-hc-go{margin-top:auto;padding-top:18px;font-size:15px;font-weight:700}
.sm-hcard.c1{background:var(--navy);color:#fff}
.sm-hcard.c1 .sm-hc-ico{background:var(--teal);color:#fff}
.sm-hcard.c1 .sm-hc-go{color:#8fd0d8}
.sm-hcard.c2{background:var(--teal);color:#fff}
.sm-hcard.c2 .sm-hc-ico{background:var(--navy);color:#fff}
.sm-hcard.c3{background:#f2f4f7;color:var(--ink)}
.sm-hcard.c3 .sm-hc-ico{background:var(--navy);color:#fff}
.sm-hcard.c3 .sm-hc-go{color:var(--teal)}
.sm-hero-ind{position:absolute;left:40px;bottom:40px;z-index:3;display:flex;align-items:center;gap:14px;font-size:14px;color:rgba(255,255,255,.7)}
.sm-hero-ind .bar{width:150px;height:2px;background:rgba(255,255,255,.25);position:relative}
.sm-hero-ind .bar i{position:absolute;top:0;left:0;height:100%;width:33.3%;background:#fff;transition:left .6s}
.sm-hero-ind b{color:#fff}

/* ---------- quick menu ---------- */
.sm-quick{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:60;display:flex;flex-direction:column;align-items:center;gap:14px}
.sm-quick-box{background:var(--navy);border-radius:44px;padding:18px 0;width:84px;box-shadow:0 10px 30px rgba(13,29,54,.25)}
.sm-quick-box a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 0;color:#fff;font-size:12.5px;font-weight:600}
.sm-quick-box a + a{border-top:1px solid rgba(255,255,255,.12)}
.sm-quick-box svg{width:22px;height:22px}
.sm-quick-top{width:60px;height:60px;border-radius:50%;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:var(--navy);cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.08)}

/* ---------- section common ---------- */
.sm-sec{padding:130px 0}
.sm-sec-head{text-align:center;margin-bottom:64px}
.sm-eyebrow{display:block;font-size:14px;font-weight:700;letter-spacing:.14em;color:var(--teal);margin-bottom:16px}
h2.sm-sec-title{font-size:44px;font-weight:600;line-height:1.3;letter-spacing:-.02em;color:var(--ink)}
.sm-sec-desc{margin-top:18px;font-size:17px;color:var(--body)}
.sm-more{display:inline-block;margin-top:26px;padding-bottom:6px;border-bottom:1px solid var(--ink);font-size:15px;font-weight:500}

/* ---------- why (point slider) ---------- */
.sm-why{background:linear-gradient(180deg,#fff 0%,#f4f8f9 100%);overflow:hidden}
.sm-why-slider{position:relative}
.sm-why-slide{display:none;grid-template-columns:1.15fr 1fr;gap:64px;align-items:center}
.sm-why-slide.on{display:grid;animation:smFade .6s ease}
@keyframes smFade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.sm-why-img{border-radius:28px;overflow:hidden;aspect-ratio:16/10.5;background:#dde3ea}
.sm-why-img img{width:100%;height:100%;object-fit:cover}
.sm-point{font-size:15px;font-weight:800;letter-spacing:.06em;color:var(--teal);margin-bottom:22px}
.sm-point span{color:var(--gold);margin-right:6px}
.sm-why-txt h3{font-size:36px;font-weight:700;line-height:1.35;letter-spacing:-.02em;margin-bottom:22px;color:var(--navy)}
.sm-why-txt p{font-size:17px;line-height:1.85;color:var(--body)}
.sm-why-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.sm-why-tags span{padding:7px 14px;border-radius:30px;background:#fff;border:1px solid var(--line);font-size:14px;color:var(--navy);font-weight:600}
.sm-why-ctrl{display:flex;align-items:center;gap:12px;margin-top:34px}
.sm-why-ctrl button{width:56px;height:56px;border-radius:50%;border:1px solid #c9d1db;background:#fff;cursor:pointer;color:var(--navy);display:grid;place-items:center}
.sm-why-ctrl button:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.sm-why-count{margin-left:14px;font-size:15px;color:var(--muted)}
.sm-why-count b{color:var(--navy);font-size:18px}

/* ---------- marquee ---------- */
.sm-marquee{overflow:hidden;white-space:nowrap;padding:10px 0 0}
.sm-marquee div{display:inline-block;font-family:Georgia,'Times New Roman',serif;font-size:76px;color:#e9edf1;animation:smMarq 40s linear infinite}
@keyframes smMarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- clinic cards ---------- */
.sm-clinic{padding-top:90px}
.sm-cl-big{position:relative;display:grid;grid-template-columns:1fr 1fr;border-radius:24px;overflow:hidden;background:var(--navy);color:#fff;min-height:340px}
.sm-cl-big .txt{padding:54px 52px;display:flex;flex-direction:column;justify-content:flex-end}
.sm-cl-big .lab{font-size:13px;font-weight:800;letter-spacing:.14em;color:#8fd0d8;margin-bottom:14px}
.sm-cl-big h3{font-size:38px;font-weight:700;margin-bottom:16px;color:#fff}
.sm-cl-big p{font-size:16px;line-height:1.8;color:#c9d4e2}
.sm-cl-big .img{position:relative}
.sm-cl-big .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sm-cl-big .img::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,var(--navy) 0%,rgba(19,41,75,0) 45%)}
.sm-plus{position:absolute;top:22px;right:22px;z-index:2;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;font-size:26px;font-weight:300;line-height:1}
.sm-cl-big .sm-plus{background:rgba(255,255,255,.18);color:#fff}
.sm-cl-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:16px}
.sm-cl-card{position:relative;border-radius:20px;padding:96px 24px 28px;min-height:250px;transition:transform .25s}
.sm-cl-card:hover{transform:translateY(-6px)}
.sm-cl-card .lab{font-size:12px;font-weight:800;letter-spacing:.1em;margin-bottom:10px}
.sm-cl-card h4{font-size:24px;font-weight:700;margin-bottom:10px}
.sm-cl-card p{font-size:14.5px;line-height:1.6}
.sm-cl-card .sm-plus{width:44px;height:44px;font-size:22px}
.k1{background:#eef1f5;color:var(--ink)} .k1 .lab{color:var(--navy-2)} .k1 p{color:var(--body)} .k1 .sm-plus{background:#a8b2bf;color:#fff}
.k2{background:var(--navy-deep);color:#fff} .k2 .lab{color:#8fd0d8} .k2 p{color:#b9c4d3} .k2 .sm-plus{background:#2a3f5f;color:#fff}
.k3{background:var(--teal);color:#fff} .k3 .lab{color:#d5eef1} .k3 p{color:#e4f3f5} .k3 .sm-plus{background:#246f79;color:#fff}
.k4{background:#9aa7b6;color:#fff} .k4 .lab{color:#eef2f6} .k4 p{color:#f3f6f9} .k4 .sm-plus{background:#7e8b9b;color:#fff}
.k5{background:#f3efe6;color:var(--ink)} .k5 .lab{color:var(--gold)} .k5 p{color:var(--body)} .k5 .sm-plus{background:#cdbd99;color:#fff}

/* ---------- facility ---------- */
.sm-facility{background:var(--bg-alt)}
.sm-fac-grid{display:grid;grid-template-columns:330px 1fr;gap:24px}
.sm-fac-lead{background:linear-gradient(180deg,var(--navy-deep) 0%,var(--navy-2) 100%);border-radius:24px;padding:44px 38px;color:#fff;display:flex;flex-direction:column}
.sm-fac-lead .lab{font-size:13px;font-weight:800;letter-spacing:.12em;color:#8fd0d8}
.sm-fac-lead h3{margin-top:26px;font-size:32px;font-weight:700;line-height:1.4;color:#fff}
.sm-fac-lead p{margin-top:22px;font-size:15.5px;line-height:1.8;color:#c3cfdd}
.sm-fac-lead .stat{display:flex;gap:26px;margin-top:auto;padding-top:26px;border-top:1px solid rgba(255,255,255,.15)}
.sm-fac-lead .stat b{display:block;font-size:30px;font-weight:700;color:#fff}
.sm-fac-lead .stat span{font-size:13px;color:#9fb0c4}
.sm-fac-lead .floor{margin:26px 0 30px;display:flex;flex-direction:column;gap:14px}
.sm-fac-lead .floor div{display:flex;gap:16px;align-items:flex-start;padding:16px 18px;border-radius:14px;background:rgba(255,255,255,.06)}
.sm-fac-lead .floor dt{flex:none;width:42px;height:42px;border-radius:10px;background:var(--teal);display:grid;place-items:center;font-size:15px;font-weight:800;color:#fff}
.sm-fac-lead .floor dd{font-size:14px;line-height:1.65;color:#b9c6d6}
.sm-fac-lead .floor dd b{display:block;font-size:16px;color:#fff;margin-bottom:2px}
.sm-fac-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sm-fac-card{background:#fff;border-radius:20px;overflow:hidden;border:1px solid var(--line);transition:box-shadow .25s,transform .25s}
.sm-fac-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(19,41,75,.1)}
.sm-fac-card .ph{aspect-ratio:3/2;overflow:hidden}
.sm-fac-card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.sm-fac-card:hover .ph img{transform:scale(1.05)}
.sm-fac-card .cap{padding:20px 22px 24px}
.sm-fac-card .cap .lab{font-size:12px;font-weight:800;letter-spacing:.1em;color:var(--teal)}
.sm-fac-card .cap h4{font-size:19px;font-weight:700;margin:6px 0 6px;color:var(--ink)}
.sm-fac-card .cap p{font-size:14px;color:var(--body);line-height:1.6}

/* ---------- greeting ---------- */
.sm-greet{display:grid;grid-template-columns:300px 1fr;gap:70px;align-items:center}
.sm-greet-photo{border-radius:24px;overflow:hidden;background:#e6eaef;aspect-ratio:1/1.1}
.sm-greet-photo img{width:100%;height:100%;object-fit:cover}
.sm-greet blockquote{font-size:30px;font-weight:600;line-height:1.5;letter-spacing:-.02em;color:var(--navy)}
.sm-greet blockquote em{font-style:normal;color:var(--teal)}
.sm-greet p{margin-top:24px;font-size:17px;line-height:1.9;color:var(--body)}
.sm-greet .sign{margin-top:28px;font-size:15px;color:var(--muted)}
.sm-greet .sign b{margin-left:8px;font-size:22px;color:var(--ink)}

/* ---------- info (notice + hours/map) ---------- */
.sm-info{padding-top:40px}
.sm-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.sm-notice{border:1px solid var(--line);border-radius:24px;padding:40px 40px 30px}
.sm-notice-hd{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}
.sm-notice-hd .lab{font-size:15px;font-weight:700;color:var(--teal)}
.sm-notice-hd h3{font-size:34px;font-weight:700;color:var(--ink)}
.sm-notice-hd a{width:58px;height:58px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-size:30px;font-weight:300}
.sm-notice ul{list-style:none}
.sm-notice li{padding:18px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:16.5px}
.sm-notice li span{color:var(--muted);font-size:14px;white-space:nowrap}
.sm-hours{border-radius:24px;overflow:hidden;background:var(--navy);color:#fff;display:flex;flex-direction:column}
.sm-map{height:240px;background:#dfe5ec}
.sm-map iframe{width:100%;height:100%;border:0;display:block}
.sm-hours-body{padding:34px 40px 36px}
.sm-hrow{display:grid;grid-template-columns:96px 1fr;gap:18px;margin-bottom:14px;font-size:16.5px}
.sm-hrow .pill{display:inline-block;text-align:center;padding:4px 0;border-radius:20px;background:#fff;color:var(--navy);font-size:14px;font-weight:700;height:fit-content}
.sm-htable{display:grid;grid-template-columns:auto 1fr;gap:4px 22px}
.sm-htable .off{grid-column:1/-1;font-weight:700;color:#8fd0d8;margin-top:4px}
.sm-hrow small{display:block;color:#9fb0c4;font-size:13.5px;margin-top:2px}

/* ---------- footer ---------- */
.sm-footer{margin-top:130px;background:var(--navy-deep);color:#aab6c6;padding:56px 0 60px;font-size:14.5px}
.sm-footer .brand{font-size:22px;font-weight:700;color:#fff}
.sm-footer .brand small{font-size:13px;font-weight:500;color:#8fd0d8;margin-left:8px}
.sm-footer .links{display:flex;gap:22px;margin:26px 0 20px;color:#fff;font-weight:600}
.sm-footer .copy{margin-top:18px;font-size:13px;color:#6f7f95}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .sm-gnb{display:none}
  .sm-hero h1.sm-hero-title{font-size:44px}
  .sm-cl-grid{grid-template-columns:repeat(3,1fr)}
  .sm-fac-grid{grid-template-columns:1fr}
  .sm-fac-cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:768px){
  .sm-header .sm-wrap{height:68px}
  .sm-logo img{height:36px}
  .sm-tel span{display:none}
  .sm-hero{height:auto;padding:90px 0 110px}
  .sm-hero h1.sm-hero-title{font-size:32px}
  .sm-hero-sub{font-size:14px;padding:8px 16px}
  .sm-hero-cards{grid-template-columns:1fr;gap:12px;margin-top:36px}
  .sm-hcard{min-height:auto}
  .sm-hero-ind{left:24px;bottom:30px}
  .sm-sec{padding:84px 0}
  h2.sm-sec-title{font-size:30px}
  .sm-why-slide{grid-template-columns:1fr;gap:30px}
  .sm-why-txt h3{font-size:27px}
  .sm-marquee div{font-size:46px}
  .sm-cl-big{grid-template-columns:1fr}
  .sm-cl-big .img{height:200px;order:-1}
  .sm-cl-big .txt{padding:34px 28px}
  .sm-cl-grid{grid-template-columns:1fr 1fr}
  .sm-fac-cards{grid-template-columns:1fr}
  .sm-greet{grid-template-columns:1fr;gap:34px}
  .sm-greet-photo{max-width:240px}
  .sm-greet blockquote{font-size:23px}
  .sm-info-grid{grid-template-columns:1fr}
  .sm-notice{padding:30px 24px 20px}
  .sm-hours-body{padding:28px 24px}
  .sm-quick{top:auto;bottom:0;left:0;right:0;transform:none}
  .sm-quick-box{width:100%;display:flex;border-radius:0;padding:0;box-shadow:0 -4px 16px rgba(13,29,54,.18)}
  .sm-quick-box a{flex:1;flex-direction:row;justify-content:center;font-size:13.5px;padding:15px 0}
  .sm-quick-box a + a{border-top:0;border-left:1px solid rgba(255,255,255,.14)}
  .sm-quick-box svg{width:18px;height:18px}
  .sm-quick-top{display:none}
  body{padding-bottom:52px}
}
.sm-notice li.empty{justify-content:center;padding:70px 0;color:var(--muted);border-bottom:0}

/* ---------- 스크롤 등장 ---------- */
.sm-rv{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.sm-rv.in{opacity:1;transform:none}

/* ---------- 진료 상태 배지 ---------- */
.sm-open{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 18px;border-radius:12px;font-size:14.5px;margin-bottom:22px}
.sm-open i{width:9px;height:9px;border-radius:50%;flex:none}
.sm-open b{font-weight:700}
.sm-open span{opacity:.75;font-size:13.5px}
.sm-open.is-on i{background:#3ccf91;animation:smPulse 1.8s infinite}
.sm-open.is-lunch i,.sm-open.is-before i{background:#f0b44c}
.sm-open.is-off i{background:#9aa7b6}
@keyframes smPulse{0%{box-shadow:0 0 0 0 rgba(60,207,145,.55)}70%{box-shadow:0 0 0 9px rgba(60,207,145,0)}100%{box-shadow:0 0 0 0 rgba(60,207,145,0)}}
.sm-hours .sm-open{background:rgba(255,255,255,.08);color:#fff}
.sm-open.light{background:var(--teal-soft);color:var(--navy)}

/* ---------- 투석 상담 띠 ---------- */
.sm-dial-band{background:var(--navy-deep);color:#fff}
.sm-dial-band .sm-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:26px;padding-bottom:26px}
.sm-dial-band .q{display:flex;align-items:center;gap:16px;font-size:17px}
.sm-dial-band .q em{font-style:normal;flex:none;padding:5px 12px;border-radius:6px;background:var(--teal);font-size:13px;font-weight:700;letter-spacing:.04em}
.sm-dial-band a{flex:none;display:flex;align-items:center;gap:12px;font-size:15px;color:#bccadb}
.sm-dial-band a b{font-size:22px;color:#fff;letter-spacing:.01em}
.sm-dial-band a::after{content:"→";width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.3);display:grid;place-items:center;color:#fff;transition:.2s}
.sm-dial-band a:hover::after{background:#fff;color:var(--navy)}
@media (max-width:768px){
  .sm-dial-band .sm-wrap{flex-direction:column;align-items:flex-start;gap:12px}
  .sm-dial-band .q{font-size:15px;align-items:flex-start;flex-direction:column;gap:8px}
}
