:root{
  --green:#1f7a4d; --green-d:#155c39; --green-l:#e8f5ee;
  --navy:#1d2b3a; --sun:#f5b301; --sun-l:#fff6d9;
  --gray:#5b6573; --line:#e3e7ec; --bg:#f7f9fb; --red:#c0392b;
  --r:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;font-family:"Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",sans-serif;font-size:18px;line-height:1.65;color:var(--navy);background:#fff;padding-bottom:84px;word-break:keep-all}
a{color:var(--green-d)}
h1,h2,h3{line-height:1.35;margin:0 0 .5em}
h2{font-size:1.6rem}
h3{font-size:1.2rem}
small,.small{font-size:.85rem;color:var(--gray)}
.wrap{max-width:980px;margin:0 auto;padding:0 18px}
section{padding:48px 0;border-bottom:1px solid var(--line)}
section.alt{background:var(--bg)}
.lead{color:var(--gray);margin-top:-.2em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:54px;padding:12px 22px;border-radius:12px;border:2px solid var(--green);background:var(--green);color:#fff;font-size:1.05rem;font-weight:700;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--green-d)}
.btn.ghost{background:#fff;color:var(--green-d)}
.btn.sun{background:var(--sun);border-color:var(--sun);color:var(--navy)}
.btn.block{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.badge{display:inline-block;font-size:.8rem;font-weight:700;padding:2px 10px;border-radius:99px;background:var(--green-l);color:var(--green-d);margin-right:4px}

/* header */
header{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.top{display:flex;align-items:center;justify-content:space-between;padding:10px 18px;max-width:980px;margin:0 auto}
.logo{font-weight:800;font-size:1.15rem;color:var(--navy);text-decoration:none}
.logo span{color:var(--sun)}
.top a.tel{font-weight:700;text-decoration:none;font-size:1rem}
nav.menu{display:flex;gap:6px;overflow-x:auto;padding:0 14px 10px;max-width:980px;margin:0 auto;scrollbar-width:none}
nav.menu::-webkit-scrollbar{display:none}
nav.menu a{flex:0 0 auto;padding:6px 14px;border-radius:99px;background:var(--bg);border:1px solid var(--line);text-decoration:none;color:var(--navy);font-size:.95rem}

/* notice */
.notice{background:var(--sun-l);border-bottom:1px solid #f0dc9c;font-size:.95rem}
.notice .wrap{padding:10px 18px}

/* hero */
.hero{background:linear-gradient(160deg,#eaf6ef 0%,#fffaf0 100%);padding:44px 0 40px}
.hero h1{font-size:1.9rem}
.hero h1 em{font-style:normal;color:var(--green-d);background:linear-gradient(transparent 62%,#ffe08a 62%)}
.hero .facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}
.fact{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px;text-align:center}
.fact b{display:block;font-size:1.35rem;color:var(--green-d);white-space:nowrap}
.fact > span{font-size:.85rem;color:var(--gray)}

/* cards */
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px}
.card.hl{border:2px solid var(--green);background:var(--green-l)}
.card .num{font-size:1.6rem;font-weight:800;color:var(--green-d)}
.card p{margin:.3em 0 0}
ul.clean{padding-left:1.2em;margin:.5em 0}
ul.clean li{margin:.3em 0}
.warn{border-left:5px solid var(--sun);background:var(--sun-l);padding:12px 16px;border-radius:8px;margin-top:16px}
.sources{margin-top:18px;font-size:.8rem;color:var(--gray)}
.sources a{color:var(--gray)}

/* quiz */
.quiz{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px;max-width:640px}
.progress{height:8px;background:var(--line);border-radius:99px;overflow:hidden;margin-bottom:16px}
.progress i{display:block;height:100%;background:var(--green);width:0;transition:width .3s}
.q-title{font-size:1.25rem;font-weight:700;margin-bottom:6px}
.q-help{color:var(--gray);font-size:.95rem;margin-bottom:14px}
.opts{display:grid;gap:10px}
.opt{text-align:left;min-height:56px;padding:12px 16px;border:2px solid var(--line);border-radius:12px;background:#fff;font-size:1.05rem;cursor:pointer;color:var(--navy)}
.opt:hover,.opt:focus{border-color:var(--green);background:var(--green-l)}
.q-back{margin-top:12px;background:none;border:0;color:var(--gray);font-size:.95rem;cursor:pointer;text-decoration:underline}
.result h3{font-size:1.4rem}
.result.ok h3{color:var(--green-d)}
.result.check h3{color:#a86a00}
.result.other h3{color:var(--red)}

/* calculator */
.calc{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.calc label{font-weight:700;display:block;margin-bottom:6px}
.calc input[type=range]{width:100%;accent-color:var(--green)}
.calc .kwh{font-size:2rem;font-weight:800;color:var(--green-d)}
.presets{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.presets button{padding:8px 14px;border-radius:99px;border:1px solid var(--line);background:#fff;font-size:.95rem;cursor:pointer}
.out-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px dashed var(--line)}
.out-row b{color:var(--green-d)}

/* timeline */
.timeline{list-style:none;padding:0;margin:0;counter-reset:step}
.timeline li{position:relative;padding:0 0 22px 56px;counter-increment:step}
.timeline li::before{content:counter(step);position:absolute;left:0;top:0;width:38px;height:38px;border-radius:50%;background:var(--green);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}
.timeline li::after{content:"";position:absolute;left:18px;top:40px;bottom:4px;width:2px;background:var(--line)}
.timeline li:last-child::after{display:none}
.who{display:inline-block;font-size:.78rem;font-weight:700;padding:1px 9px;border-radius:99px;margin-right:6px;vertical-align:2px}
.who.home{background:#e3f0ff;color:#1559a8}
.who.co{background:var(--green-l);color:var(--green-d)}
.who.gov{background:#f3e8ff;color:#6b2fa8}
.who.city{background:#ffe9e0;color:#a8431a}
.who.kepco{background:var(--sun-l);color:#8a6200}

/* checklist */
.check li{list-style:none;margin:10px 0}
.check{padding:0}
.check label{display:flex;gap:12px;align-items:flex-start;cursor:pointer}
.check input{width:24px;height:24px;margin-top:4px;accent-color:var(--green);flex:0 0 auto}

/* FAQ */
.tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:12px;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:0 0 auto;padding:8px 16px;border-radius:99px;border:1px solid var(--line);background:#fff;font-size:.95rem;cursor:pointer}
.tabs button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.search{width:100%;padding:14px 16px;font-size:1.05rem;border:2px solid var(--line);border-radius:12px;margin-bottom:14px}
details{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:10px}
details summary{cursor:pointer;padding:16px 44px 16px 18px;font-weight:700;list-style:none;position:relative}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";position:absolute;right:18px;top:12px;font-size:1.5rem;color:var(--green)}
details[open] summary::after{content:"−"}
details .a{padding:0 18px 16px;color:#33404d}
.cat-label{font-size:.75rem;color:var(--gray);font-weight:400;display:block}
.nores{display:none;color:var(--gray);padding:12px}

/* links */
.link-card{display:block;text-decoration:none;color:var(--navy);background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.link-card:hover{border-color:var(--green)}
.link-card b{display:block;color:var(--green-d)}
.link-card span{font-size:.9rem;color:var(--gray)}

/* ladder */
.ladder{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.ladder li{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.ladder .step{flex:0 0 auto;width:44px;height:44px;border-radius:10px;background:var(--sun);color:var(--navy);font-weight:800;display:flex;align-items:center;justify-content:center}

/* form */
form .field{margin-bottom:16px}
form label.t{display:block;font-weight:700;margin-bottom:6px}
form .req{color:var(--red)}
form input[type=text],form input[type=tel],form select,form textarea{width:100%;padding:14px;font-size:1.05rem;border:2px solid var(--line);border-radius:12px;font-family:inherit;background:#fff}
form textarea{min-height:110px}
form input:focus,form select:focus,form textarea:focus{outline:none;border-color:var(--green)}
.agree{display:flex;gap:10px;align-items:flex-start;background:var(--bg);border-radius:12px;padding:12px 14px;margin-bottom:10px}
.agree input{width:24px;height:24px;margin-top:3px;accent-color:var(--green);flex:0 0 auto}
.form-msg{margin-top:12px;font-weight:700}
.form-msg.err{color:var(--red)}
.done{display:none;text-align:center;background:var(--green-l);border-radius:var(--r);padding:30px 20px}
.done h3{color:var(--green-d)}

/* bottom bar */
.bottom-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
.bottom-bar a{min-height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;text-decoration:none;font-weight:800;font-size:1rem}
.bb-tel{background:var(--navy);color:#fff}
.bb-kakao{background:#fee500;color:#191919}
.bb-apply{background:var(--green);color:#fff}

/* added */
.fontbtn{border:1px solid var(--line);background:#fff;border-radius:99px;padding:6px 12px;font-size:.9rem;font-weight:700;cursor:pointer;color:var(--navy)}
.top-right{display:flex;align-items:center;gap:12px}
html.big{font-size:118%}
html.big body{font-size:21px}
.dday{display:grid;gap:10px;margin:6px 0 18px}
.dday-item{display:flex;align-items:center;gap:12px;background:#fff3f0;border:1px solid #f3c9bf;border-radius:12px;padding:12px 16px}
.dday-item b.d{flex:0 0 auto;min-width:64px;text-align:center;background:var(--red);color:#fff;border-radius:10px;padding:4px 10px;font-size:1.1rem}
.dday-item.soon b.d{background:#e67e22}
.dday-item.info{background:var(--green-l);border-color:#bfe0cc}
.dday-item.info b.d{background:var(--green)}
.bad li{margin:10px 0}
.bad b{color:var(--red)}
.good-list li::marker{content:"✓  ";color:var(--green)}
.words{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.words div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.words b{display:block;color:var(--green-d)}
.flow{list-style:none;padding:0;margin:0 0 18px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;counter-reset:f}
.flow li{counter-increment:f;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;font-size:.95rem;text-align:center}
.flow li::before{content:counter(f);display:block;margin:0 auto 6px;width:30px;height:30px;line-height:30px;border-radius:50%;background:var(--sun);font-weight:800}
.photo{background:#fff;border:1px dashed #c9d2db;border-radius:12px;padding:14px 16px;margin-bottom:20px}
.share-box{margin-top:14px}
.share-box input{width:100%;padding:10px;border-radius:8px;border:1px solid #556;margin-top:8px;font-size:.85rem}
.totop{position:fixed;right:14px;bottom:92px;z-index:31;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.12);font-size:1.2rem;cursor:pointer;display:none}
@media (max-width:760px){ .words{grid-template-columns:1fr} .flow{grid-template-columns:1fr 1fr} }

.year{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.year div{background:#fff;border:1px solid var(--line);border-left:5px solid var(--sun);border-radius:10px;padding:12px 14px}
.year b{display:block;color:var(--navy)}
.year span{font-size:.92rem;color:#33404d}
.addr-check{max-width:640px;margin-top:18px;background:var(--bg);border-radius:var(--r);padding:16px}
.addr-row{display:flex;gap:8px;margin-top:8px}
.addr-row input{flex:1;min-width:0;padding:12px;font-size:1rem;border:2px solid var(--line);border-radius:10px}
@media (max-width:760px){ .year{grid-template-columns:1fr} }

.status{display:inline-block;margin:6px 0 10px;padding:8px 14px;border-radius:12px;font-size:.95rem;font-weight:700;background:#fff;border:2px solid var(--green);color:var(--green-d)}
.status.warn2{border-color:#e67e22;color:#9a4d00}
.status.off{border-color:var(--gray);color:var(--gray)}
.kwh-input{display:flex;align-items:center;gap:8px;margin-top:10px}
.kwh-input label{font-weight:700;font-size:.95rem;margin:0}
.kwh-input input{width:120px;padding:10px;font-size:1.1rem;border:2px solid var(--line);border-radius:10px}
.review{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px}
.review .who2{font-size:.85rem;color:var(--gray);margin-top:8px}

.btn.kakao-btn{background:#fee500;border-color:#fee500;color:#191919}
.promise .card b{display:block;color:var(--green-d);margin-bottom:4px}
@media (max-width:760px){ .grid.promise{grid-template-columns:1fr 1fr;gap:8px} .promise .card{padding:12px} .promise .card b{font-size:.95rem} }


/* 누진 섹션 */
.eyebrow{display:inline-block;font-size:.85rem;font-weight:800;color:#a8431a;background:#ffe9e0;border-radius:99px;padding:3px 12px;margin-bottom:10px}
.persona-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin:10px 0 22px}
.persona{display:flex;flex-direction:column;gap:6px;text-align:left;background:#fff;border:2px solid var(--line);border-radius:var(--r);padding:16px;cursor:pointer;font:inherit;color:var(--navy)}
.persona:hover,.persona:focus{border-color:var(--green);background:var(--green-l)}
.persona b{font-size:1.05rem}
.persona .pnum{font-size:.9rem;color:#33404d;background:var(--bg);border-radius:10px;padding:8px 10px}
.persona .pnum b{color:var(--green-d);font-size:1rem}
.persona .pgo{font-size:.9rem;font-weight:700;color:var(--green-d)}
.nj-calc{border:2px solid var(--green);padding:22px}
.nj-inputs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0}
.nj-inputs label{font-weight:700;font-size:.95rem}
.nj-inputs input{width:110px;padding:10px;font-size:1.15rem;border:2px solid var(--line);border-radius:10px;margin-top:4px}
.nj-now{background:var(--green-l);border-radius:12px;padding:12px 16px}
.nj-now-row{display:flex;justify-content:space-between;align-items:center;font-size:1.05rem}
.nj-now-row b{font-size:1.5rem;color:var(--green-d)}
.nj-steps{display:flex;flex-wrap:wrap;gap:14px;margin-top:6px;font-size:.92rem}
.nj-steps .st{font-style:normal;font-weight:800;color:#a8431a}
.nj-table-wrap{overflow-x:auto}
.nj-table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:520px}
.nj-table th,.nj-table td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;vertical-align:top}
.nj-table th{background:var(--bg);font-size:.88rem}
.nj-table tr.best td{background:#fff8e1}
.nj-table tr.subrow td{color:var(--gray)}
.nj-table .tag{display:inline-block;background:var(--sun);color:var(--navy);font-size:.75rem;font-weight:800;border-radius:99px;padding:1px 8px}
.yp-table{min-width:460px}
.nj-how{margin-top:14px}
.facts2 .card b{display:block;color:var(--navy);margin-bottom:2px}
@media (max-width:760px){ .nj-table{min-width:0;font-size:.82rem} .nj-table th,.nj-table td{padding:8px 4px} .yp-table{min-width:0} .nj-inputs{grid-template-columns:1fr} .nj-inputs input{width:140px} .nj-calc{padding:16px} }


/* 첫 화면·지붕 재보기 */
.hero-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:24px;align-items:center}
.hero-art svg{width:100%;height:auto;max-width:340px;display:block;margin-left:auto}
.eb-green{color:var(--green-d);background:var(--green-l)}
.roof-tool{padding:20px}
.roof-steps{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0 0 12px}
.roof-steps li{background:var(--bg);border:1px solid var(--line);border-radius:99px;padding:4px 14px 4px 6px;font-size:.92rem}
.roof-steps b{display:inline-flex;width:24px;height:24px;border-radius:50%;background:var(--sun);align-items:center;justify-content:center;margin-right:6px}
.roof-search{display:flex;gap:8px;flex-wrap:wrap}
.roof-search input{flex:1 1 220px;min-width:0;padding:12px 14px;font-size:1.05rem;border:2px solid var(--line);border-radius:12px}
.roof-map{height:420px;border-radius:14px;overflow:hidden;margin-top:10px;background:#dfe5ea;position:relative}
.map-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--gray);padding:20px;text-align:center}
.yp-lbl span{display:inline-block;transform:translate(-50%,-50%);white-space:nowrap;background:rgba(29,43,58,.78);color:#fff;font-size:12px;font-weight:700;padding:2px 7px;border-radius:99px}
.map-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px;font-size:.92rem}
.map-tools button,.chips button{padding:8px 14px;border-radius:99px;border:1px solid var(--line);background:#fff;font-size:.95rem;cursor:pointer;font-family:inherit}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.chips button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.roof-opts{display:grid;grid-template-columns:1fr 2fr;gap:14px;margin-top:14px}
.roof-out{margin-top:14px}
.roof-res{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.roof-res div{background:var(--green-l);border-radius:12px;padding:12px}
.roof-res span{display:block;font-size:.85rem;color:var(--gray)}
.roof-res b{display:block;font-size:1.2rem;color:var(--green-d)}
.roof-res small{font-size:.8rem;color:var(--gray)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.nj-table tr.nofit td{opacity:.45}
@media (max-width:760px){ .hero-grid{grid-template-columns:1fr} .hero-art{display:none} .roof-map{height:340px} .roof-opts{grid-template-columns:1fr} .roof-res{grid-template-columns:1fr 1fr} }


/* 무료 호스팅 배지(오른쪽 아래)가 있을 때 버튼이 가려지지 않게 */
body.has-badge .bottom-bar{right:212px}
body.has-badge .totop{bottom:150px}
@media (max-width:760px){ body.has-badge .bottom-bar{right:0;padding-bottom:calc(66px + env(safe-area-inset-bottom))} body.has-badge{padding-bottom:150px} body.has-badge .totop{bottom:150px} }

/* footer & modal */
footer{background:var(--navy);color:#cfd6de;padding:32px 0 40px;font-size:.9rem}
footer a{color:#fff}
.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:50;align-items:center;justify-content:center;padding:16px}
.modal.on{display:flex}
.modal .box{background:#fff;border-radius:var(--r);max-width:640px;width:100%;max-height:85vh;overflow:auto;padding:22px;font-size:.95rem}

@media (max-width:760px){
  body{font-size:18px}
  h2{font-size:1.4rem}
  .hero h1{font-size:1.55rem}
  .g2,.g3,.g4,.calc{grid-template-columns:1fr}
  .hero .facts{grid-template-columns:1fr 1fr 1fr;gap:6px}
  .fact{padding:10px 6px}
  .fact b{font-size:1rem}
}
@media print{
  body.print-docs header, body.print-docs .notice, body.print-docs main > section:not(#docs), body.print-docs footer, body.print-docs .bottom-bar, body.print-docs .no-print{display:none !important}
  body{padding:0}
}

/* ===== 공통 레이아웃 (PC·모바일 분리) ===== */
.logo{display:inline-flex;align-items:center;gap:6px}
.logo-dot{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--sun)}
.logo-sub{font-size:.78rem;color:var(--gray);font-weight:500}
.main-nav,.head-apply{display:none}
.menu-btn{display:inline-flex;align-items:center;border:1px solid var(--line);background:#fff;border-radius:99px;padding:6px 14px;font-size:.92rem;font-weight:700;cursor:pointer;color:var(--navy)}
.drawer{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.45);display:flex;justify-content:flex-end}
.drawer[hidden]{display:none}
.drawer-box{background:#fff;width:min(88vw,360px);height:100%;overflow:auto;padding:22px 20px;display:flex;flex-direction:column;gap:14px}
.drawer-close{align-self:flex-end;border:1px solid var(--line);background:#fff;border-radius:99px;padding:6px 14px;font-size:.95rem;cursor:pointer}
.drawer-title{font-size:1.2rem}
.drawer-nav{display:flex;flex-direction:column}
.drawer-nav a{padding:14px 6px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--navy);font-size:1.1rem;font-weight:700}
.drawer-nav a.on{color:var(--green-d)}
.drawer-contact{display:grid;gap:10px;margin-top:auto}
.side-cta{display:none}
.roof-map{position:relative;z-index:0}
details.fold{border:0;background:none;margin:0}
details.fold > summary{display:inline-block;padding:10px 18px;border:1px solid var(--line);border-radius:99px;background:#fff;font-weight:700;margin:14px 0;position:static}
details.fold > summary::after{content:"";}
details.fold[open] > summary{display:none}
/* 휴대폰 */
@media (max-width:600px){
  .top{padding:8px 12px}
  .top-right{gap:8px}
  .top a.tel{display:none}
  .fontbtn{padding:5px 10px;font-size:.85rem}
  .logo-sub{display:none}
  .hero{padding:28px 0 26px}
  .hero .btn-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .hero .btn-row .btn{min-height:52px;padding:10px 8px;font-size:.98rem;text-align:center}
  section{padding:36px 0}
  .notice .wrap{padding:8px 14px;font-size:.88rem}
}
/* 태블릿·PC 공통 */
@media (min-width:1024px){
  .top{max-width:1200px;gap:16px}
  .wrap{max-width:1200px;padding:0 24px}
  nav.menu{max-width:1200px;flex-wrap:wrap;overflow:visible;padding:0 24px 10px}
  .main-nav{display:flex;gap:2px;margin-left:12px;flex:1}
  .main-nav a{padding:8px 12px;border-radius:10px;text-decoration:none;color:var(--navy);font-weight:700;font-size:1rem}
  .main-nav a.on,.main-nav a:hover{background:var(--green-l);color:var(--green-d)}
  .head-apply{display:inline-flex;background:var(--green);color:#fff;border-radius:10px;padding:8px 16px;font-weight:800;text-decoration:none}
  .menu-btn{display:none}
  .bottom-bar{display:none}
  body{padding-bottom:0}
  .totop{bottom:24px}
  h2{font-size:1.9rem}
  .hero{padding:64px 0 56px}
  .hero h1{font-size:2.5rem}
  section{padding:64px 0}
  .g4{grid-template-columns:repeat(4,1fr)}
  .persona-grid{grid-template-columns:repeat(3,1fr)}
  .nj-calc{display:grid;grid-template-columns:340px 1fr;column-gap:28px;align-items:start}
  .nj-calc > h3,.nj-calc > p.small{grid-column:1/-1}
  .nj-calc .nj-inputs{grid-column:1;grid-template-columns:1fr;margin:0}
  .nj-calc .nj-now{grid-column:1;margin-top:12px}
  .nj-calc > h4,.nj-calc .nj-table-wrap,.nj-calc .nj-chart,.nj-calc #njNote,.nj-calc .btn-row,.nj-calc .nj-how{grid-column:2}
  .nj-calc > h4{grid-row:2;margin-top:0!important}
  .roof-map{height:520px}
  body.has-badge .bottom-bar{display:none}
}
/* 넓은 PC: 오른쪽 상담 카드 */
@media (min-width:1360px){
  body{padding-right:300px}
  .site-head{margin-right:-300px;padding-right:300px}
  .side-cta{display:flex;flex-direction:column;align-items:center;gap:10px;position:fixed;right:24px;top:150px;width:256px;z-index:25;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 8px 30px rgba(29,43,58,.12);padding:20px 18px;text-align:center}
  .side-cta b{font-size:1.15rem}
  .side-tel{font-size:1.3rem;font-weight:900;color:var(--green-d);text-decoration:none}
  .side-cta img{width:150px;height:150px}
  .totop{right:300px}
}
@media print{ .side-cta,.drawer,.menu-btn{display:none!important} }

/* 다듬기 */
.main-nav a{white-space:nowrap}
@media (min-width:1024px){
  .main-nav a{font-size:.95rem;padding:8px 10px}
  .logo-sub{display:none}
  nav.menu{flex-wrap:nowrap;overflow-x:auto;gap:6px}
  nav.menu a{font-size:.88rem;padding:5px 12px}
}
@media (min-width:1200px){ .logo-sub{display:inline} }
@media (min-width:1360px){
  .wrap{max-width:1080px}
  .side-cta{top:auto;bottom:24px}
}
@media (max-width:600px){
  .hero .facts{grid-template-columns:1fr;gap:8px}
  .hero .fact{display:flex;align-items:baseline;justify-content:space-between;gap:10px;text-align:left;padding:12px 14px}
  .hero .fact b{font-size:1.15rem}
  .hero .fact > span{font-size:.85rem;text-align:right}
}

/* 하위 페이지 */
.page-hero{padding:40px 0 34px}
.page-hero h1{font-size:1.9rem}
.crumb{display:block;margin-bottom:10px}
.crumb a{color:var(--gray)}
.biz-calc{border:2px solid var(--green);padding:22px}
.bc-inputs{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:12px 0}
.bc-inputs label{display:flex;flex-direction:column;gap:4px;font-weight:700;font-size:.95rem}
.bc-inputs input,.bc-inputs select{padding:11px;font-size:1.05rem;border:2px solid var(--line);border-radius:10px;font-family:inherit;background:#fff}
.bc-inputs label.chk{flex-direction:row;align-items:center;gap:8px;grid-column:1/-1;font-weight:500}
.bc-inputs label.chk input{width:22px;height:22px}
.out-kw{background:var(--green-l);border-radius:12px;padding:12px 16px;font-size:1.05rem}
.out-kw b{color:var(--green-d)}
.cmp{width:100%;border-collapse:collapse;font-size:.95rem}
.cmp th,.cmp td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;vertical-align:top}
.cmp th{background:var(--bg);font-size:.88rem}
.cta-box{margin-top:22px;background:#fff;border:2px solid var(--green);border-radius:var(--r);padding:20px}
.cta-box b{font-size:1.15rem}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:14px}
.foot-links a{color:#fff;text-decoration:none;font-size:.92rem}
.note-list li{margin:6px 0}
@media (max-width:760px){ .bc-inputs{grid-template-columns:1fr} .page-hero h1{font-size:1.5rem} .cmp{font-size:.85rem} }
@media (min-width:1024px){ .page-hero h1{font-size:2.3rem} }

.news-item{margin-bottom:16px}
.news-item p{margin:.5em 0}

/* 다듬기 2 */
.bc-inputs [hidden]{display:none!important}
.fontbtn,.head-apply,.top a.tel{white-space:nowrap}
@media (min-width:1360px){ .top a.tel{display:none} }
@media (max-width:600px){
  .out-table thead{display:none}
  .out-table,.out-table tbody,.out-table tr,.out-table td{display:block;width:100%}
  .out-table{min-width:0!important}
  .out-table tr{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:10px;background:#fff}
  .out-table td{border:0;padding:3px 0}
  .out-table td:nth-child(2)::before{content:"처음 드는 돈: ";color:var(--gray)}
  .out-table td:nth-child(4)::before{content:"본전: ";color:var(--gray)}
  .out-table td:nth-child(5)::before{content:"20년 합계: ";color:var(--gray)}
}

/* 주소 검색 (네이버식 자동완성) */
.as-wrap{position:relative;flex:1 1 240px;min-width:0}
.as-wrap > input{width:100%;box-sizing:border-box}
.addr-row .as-wrap > input{padding:12px;font-size:1rem;border:2px solid var(--line);border-radius:10px}
.as-list{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:1500;background:#fff;border:2px solid var(--green);border-radius:12px;box-shadow:0 12px 32px rgba(20,40,30,.18);max-height:380px;overflow:auto;margin:0;padding:6px 0;list-style:none;text-align:left}
.as-list li{display:flex;gap:10px;align-items:flex-start;padding:11px 14px;cursor:pointer;line-height:1.4}
.as-list li[data-i]:hover,.as-list li.on{background:var(--green-l)}
.as-list li b{display:block;font-weight:600;color:#1d2b3a;font-size:1rem}
.as-list li small{display:block;color:#6b7684;font-size:.86rem;margin-top:2px}
.as-list mark{background:none;color:var(--green);font-weight:800}
.as-list .as-ic{flex:none;font-size:.72rem;font-weight:700;padding:3px 7px;border-radius:6px;margin-top:2px;background:#e3f3e9;color:var(--green-d)}
.as-list .as-ic.place{background:#fff2cc;color:#8a5a00}
.as-list .as-ic.town{background:#e8eef5;color:#33404d}
.as-list .as-msg{color:#6b7684;cursor:default;font-size:.93rem}
.as-list .as-head{color:#6b7684;cursor:default;font-size:.8rem;padding:4px 14px 2px;font-weight:700}
.hsearch{margin:18px 0 8px;max-width:640px}
.hs-label{display:block;font-weight:800;margin-bottom:6px;color:var(--green-d)}
.hs-box{display:flex;flex:none}
.hs-box > input{flex:1;min-width:0;padding:16px 18px;font-size:1.12rem;border:3px solid var(--green);border-right:0;border-radius:14px 0 0 14px;outline:none;background:#fff;-webkit-appearance:none;appearance:none}
.hs-box > input:focus{box-shadow:0 0 0 4px rgba(31,122,77,.15)}
.hs-btn{flex:none;width:68px;border:0;background:var(--green);color:#fff;border-radius:0 14px 14px 0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.hs-btn:hover{background:var(--green-d)}
.hs-help{margin-top:6px}
.hs-box .as-list{top:calc(100% + 6px)}
input[type=search]::-webkit-search-cancel-button{cursor:pointer}
@media (max-width:600px){ .hs-box > input{font-size:1.02rem;padding:14px 14px} .hs-btn{width:58px} .as-list{max-height:52vh} }

/* 다듬기 3: 업종 비교표 카드형, 로고 줄바꿈 */
.logo-sub{white-space:nowrap}
@media (min-width:1024px) and (max-width:1500px){ .logo-sub{display:none} }
@media (max-width:700px){
  .cmp-cards thead{display:none}
  .cmp-cards,.cmp-cards tbody,.cmp-cards tr,.cmp-cards td{display:block;width:100%}
  .cmp-cards{min-width:0!important}
  .cmp-cards tr{border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin-bottom:10px;background:#fff}
  .cmp-cards td{border:0;padding:3px 0}
  .cmp-cards td[data-l]:not(:first-child)::before{content:attr(data-l) ": ";color:#6b7684;font-size:.88rem}
  .cmp-cards td:first-child{font-size:1.08rem;padding-bottom:6px}
}