*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
:root {
  --hd-blue: #002C5F; --hd-blue-light: #003D7A;
  --hd-cyan: #00AAD2; --hd-gold: #c9a96e;
  --hd-dark: #0a0a0a; --hd-dark2: #111; --hd-dark3: #1a1a1a;
  --hd-gray: #888; --hd-white: #fff;
  --radius: 16px; --radius-sm: 10px;
  --transition: all .35s cubic-bezier(.4,0,.2,1);
}
html { scroll-behavior: smooth; }
body { font-family: 'Noto Sans KR', sans-serif; background: var(--hd-dark); color: var(--hd-white); line-height: 1.7; overflow-x: hidden; -webkit-font-smoothing: antialiased; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
.nav { position: fixed; top:0; left:0; right:0; z-index:1000; height:68px; background: rgba(0,0,0,.88); backdrop-filter: blur(20px); border-bottom: 1px solid rgba(255,255,255,.08); }
.nav-inner { max-width:1100px; margin:0 auto; padding:0 24px; height:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.nav-logo { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:700; }
.nav-logo em { color:var(--hd-cyan); font-style:normal; }
.nav-ctas { display:flex; gap:8px; }
.btn-nav { padding:8px 16px; border-radius:50px; background:var(--hd-cyan); color:#fff; font-size:13px; font-weight:700; }
.btn-nav.kakao { background:#FEE500; color:#000; }
.blog-hero { padding:110px 24px 60px; background:linear-gradient(135deg,#000 0%,var(--hd-blue) 70%); text-align:center; }
.blog-hero .category-badge { display:inline-block; padding:5px 14px; border-radius:50px; background:rgba(0,170,210,.15); border:1px solid rgba(0,170,210,.3); color:var(--hd-cyan); font-size:12px; font-weight:600; margin-bottom:16px; }
.blog-hero h1 { font-size:clamp(24px,4vw,44px); font-weight:900; line-height:1.25; margin-bottom:16px; letter-spacing:-.02em; max-width:820px; margin-left:auto; margin-right:auto; }
.blog-meta { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; font-size:13px; color:rgba(255,255,255,.5); margin-bottom:24px; }
.blog-meta span { display:flex; align-items:center; gap:5px; }
.blog-disclaimer { max-width:820px; margin:0 auto; padding:10px 16px; border-radius:var(--radius-sm); background:rgba(255,165,0,.08); border:1px solid rgba(255,165,0,.2); font-size:13px; color:rgba(255,255,255,.6); }
.blog-body { max-width:820px; margin:0 auto; padding:60px 24px 80px; }
.blog-body h2 { font-size:clamp(20px,2.8vw,28px); font-weight:800; margin:48px 0 16px; letter-spacing:-.02em; }
.blog-body h3 { font-size:18px; font-weight:700; margin:32px 0 12px; color:var(--hd-cyan); }
.blog-body p { font-size:16px; color:rgba(255,255,255,.82); line-height:1.9; margin-bottom:18px; }
.blog-body ul, .blog-body ol { padding-left:22px; margin-bottom:18px; }
.blog-body li { font-size:16px; color:rgba(255,255,255,.8); line-height:1.8; margin-bottom:8px; }
.blog-body strong { color:#fff; font-weight:700; }
.featured-img { width:100%; border-radius:var(--radius); overflow:hidden; margin:32px 0; }
.featured-img img { width:100%; height:280px; object-fit:cover; filter:brightness(.85); }
.featured-img figcaption { text-align:center; font-size:13px; color:rgba(255,255,255,.4); padding:10px 0; }
.warning-box { background:rgba(255,165,0,.07); border:1px solid rgba(255,165,0,.2); border-radius:var(--radius-sm); padding:14px 18px; font-size:14px; color:rgba(255,255,255,.7); line-height:1.8; margin:24px 0; }
.cta-box { background:linear-gradient(135deg,var(--hd-blue),#001a33); border:1px solid rgba(0,170,210,.2); border-radius:var(--radius); padding:36px 28px; text-align:center; margin:40px 0; }
.cta-box h3 { font-size:22px; font-weight:800; margin-bottom:10px; }
.cta-box p { color:rgba(255,255,255,.65); margin-bottom:24px; font-size:15px; }
.cta-box .btns { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.btn-p { padding:13px 28px; border-radius:50px; background:var(--hd-cyan); color:#fff; font-size:14px; font-weight:700; display:inline-flex; align-items:center; gap:7px; transition:var(--transition); }
.btn-p:hover { transform:translateY(-2px); }
.btn-s { padding:13px 28px; border-radius:50px; background:rgba(255,255,255,.08); color:#fff; font-size:14px; font-weight:600; border:1px solid rgba(255,255,255,.2); display:inline-flex; align-items:center; gap:7px; transition:var(--transition); }
.btn-k { padding:13px 28px; border-radius:50px; background:#FEE500; color:#000; font-size:14px; font-weight:700; display:inline-flex; align-items:center; gap:7px; transition:var(--transition); }
.author-box { display:flex; gap:16px; align-items:center; background:var(--hd-dark3); border-radius:var(--radius); padding:20px; margin:36px 0; border:1px solid rgba(255,255,255,.08); }
.author-box img { width:60px; height:60px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.author-box h4 { font-size:15px; font-weight:700; margin-bottom:4px; }
.author-box p { font-size:13px; color:rgba(255,255,255,.6); margin:0; }
.faq-list { display:flex; flex-direction:column; gap:10px; margin-top:16px; }
.faq-item { background:var(--hd-dark3); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius-sm); overflow:hidden; }
.faq-q { padding:18px 22px; font-size:15px; font-weight:600; cursor:pointer; display:flex; justify-content:space-between; align-items:center; }
.faq-q span { font-size:18px; color:var(--hd-cyan); transition:var(--transition); }
.faq-q.open span { transform:rotate(45deg); }
.faq-a { padding:0 22px 16px; font-size:14px; color:rgba(255,255,255,.7); line-height:1.8; display:none; }
.faq-a.open { display:block; }
.internal-links { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.internal-links a { padding:8px 16px; border-radius:50px; border:1px solid rgba(0,170,210,.25); background:rgba(0,170,210,.07); color:rgba(255,255,255,.8); font-size:13px; }
.internal-links a:hover { background:rgba(0,170,210,.18); }
.numbered-list { display:flex; flex-direction:column; gap:20px; margin:20px 0; counter-reset:prep-counter; }
.numbered-item { display:flex; gap:16px; background:var(--hd-dark3); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius); padding:22px; }
.n-badge { width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--hd-cyan),var(--hd-blue)); color:#fff; font-weight:900; font-size:16px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.n-content h4 { font-size:16px; font-weight:700; margin-bottom:8px; }
.n-content p { font-size:14px; color:rgba(255,255,255,.65); line-height:1.7; margin:0; }
.n-content .tip { display:inline-block; margin-top:8px; font-size:12px; padding:3px 10px; border-radius:50px; background:rgba(0,170,210,.12); color:var(--hd-cyan); }
.confirm-list { display:flex; flex-direction:column; gap:10px; margin:16px 0; }
.confirm-item { display:flex; align-items:flex-start; gap:10px; padding:14px 16px; background:var(--hd-dark3); border-radius:var(--radius-sm); border:1px solid rgba(255,255,255,.06); }
.confirm-item i { color:var(--hd-cyan); font-size:18px; flex-shrink:0; margin-top:2px; }
.confirm-item span { font-size:15px; color:rgba(255,255,255,.85); }
.footer { background:#000; border-top:1px solid rgba(255,255,255,.08); padding:48px 24px 80px; }
.footer-disc { max-width:900px; margin:0 auto 32px; background:rgba(255,165,0,.07); border:1px solid rgba(255,165,0,.2); border-radius:var(--radius-sm); padding:14px 18px; font-size:13px; color:rgba(255,255,255,.6); line-height:1.8; }
.footer-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:28px; max-width:900px; margin:0 auto 28px; }
.footer-grid h4 { font-size:13px; font-weight:700; color:var(--hd-cyan); margin-bottom:10px; }
.footer-grid p, .footer-grid a { font-size:13px; color:rgba(255,255,255,.5); display:block; margin-bottom:5px; }
.footer-copy { font-size:12px; color:rgba(255,255,255,.3); text-align:center; max-width:900px; margin:16px auto 0; }
.mobile-cta { display:none; position:fixed; bottom:0; left:0; right:0; z-index:9999; }
.mobile-cta-inner { display:flex; }
.mobile-cta a { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:9px 0 7px; font-size:10px; font-weight:700; gap:3px; }
.mc-phone { background:var(--hd-cyan); color:#fff; }
.mc-sms { background:var(--hd-blue); color:#fff; }
.mc-kakao { background:#FEE500; color:#000; }
.mobile-cta a i { font-size:20px; }
@media(max-width:768px) { .mobile-cta { display:block; } body { padding-bottom:66px; } }
.blog-body .hd-hero{display:none}
.blog-body .hd-table-wrap{overflow-x:auto;margin:24px 0}
.blog-body .hd-table{width:100%;border-collapse:collapse;font-size:14.5px;color:rgba(255,255,255,.85);background:var(--hd-dark3);border-radius:var(--radius-sm);overflow:hidden}
.blog-body .hd-table caption{text-align:left;font-weight:700;color:#fff;padding:0 0 12px;font-size:16px}
.blog-body .hd-table th,.blog-body .hd-table td{padding:12px 14px;border:1px solid rgba(255,255,255,.08);text-align:left;vertical-align:top;line-height:1.6}
.blog-body .hd-table thead th{background:rgba(0,170,210,.14);color:var(--hd-cyan);font-weight:700}
.blog-body .hd-table tbody th{color:#fff;background:rgba(255,255,255,.03);white-space:nowrap}
.blog-body .hd-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:22px 0}
.blog-body .hd-card{background:var(--hd-dark3);border:1px solid rgba(255,255,255,.07);border-left:4px solid var(--hd-cyan);border-radius:var(--radius-sm);padding:18px 20px}
.blog-body .hd-card h4{font-size:16px;font-weight:700;margin:0 0 6px;color:#fff}.blog-body .hd-card p{font-size:14px;color:rgba(255,255,255,.65);line-height:1.7;margin:0}
.blog-body .hd-steps{list-style:none;padding:0;margin:22px 0;display:flex;flex-direction:column;gap:14px}
.blog-body .hd-steps li{display:flex;gap:16px;background:var(--hd-dark3);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:20px;margin:0}
.blog-body .hd-n{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--hd-cyan),var(--hd-blue));color:#fff;font-weight:900;font-size:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.blog-body .hd-steps h4{font-size:16px;font-weight:700;margin:0 0 6px;color:#fff}.blog-body .hd-steps p{font-size:14.5px;color:rgba(255,255,255,.68);line-height:1.75;margin:0}
.blog-body .hd-check{list-style:none;padding:0;margin:18px 0;display:flex;flex-direction:column;gap:10px}
.blog-body .hd-check li{position:relative;padding:13px 16px 13px 42px;background:var(--hd-dark3);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-sm);margin:0;font-size:15px}
.blog-body .hd-check li:before{content:"✓";position:absolute;left:16px;color:var(--hd-cyan);font-weight:900}
.blog-body .hd-callout{border-radius:var(--radius-sm);padding:14px 18px;margin:24px 0;font-size:14px;line-height:1.8}
.blog-body .hd-tip{background:rgba(0,170,210,.08);border:1px solid rgba(0,170,210,.25);color:rgba(255,255,255,.8)}
.blog-body .hd-warn{background:rgba(255,165,0,.07);border:1px solid rgba(255,165,0,.2);color:rgba(255,255,255,.7)}
.blog-body .hd-faqs{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.blog-body .hd-faq{background:var(--hd-dark3);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-sm);overflow:hidden}
.blog-body .hd-faq summary{padding:18px 22px;font-size:15px;font-weight:600;cursor:pointer;list-style:none;display:flex;gap:8px}
.blog-body .hd-faq summary::-webkit-details-marker{display:none}
.blog-body .hd-faq summary:before{content:"Q.";color:var(--hd-cyan);font-weight:800}.blog-body .hd-faq summary:after{content:"+";margin-left:auto;color:var(--hd-cyan);font-size:18px;transition:var(--transition)}
.blog-body .hd-faq[open] summary:after{transform:rotate(45deg)}
.blog-body .hd-a{padding:0 22px 18px;font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.85}
.blog-body .hd-cta{background:linear-gradient(135deg,var(--hd-blue),#001a33);border:1px solid rgba(0,170,210,.2);border-radius:var(--radius);padding:36px 28px;text-align:center;margin:40px 0}
.blog-body .hd-cta h3{font-size:22px;font-weight:800;margin:0 0 20px;color:#fff}
.blog-body .hd-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.blog-body .hd-btns a{padding:13px 26px;border-radius:50px;font-size:14px;font-weight:700;display:inline-flex;align-items:center;gap:7px}
.blog-body .hd-b1{background:var(--hd-cyan);color:#fff}.blog-body .hd-b2{background:#FEE500;color:#000}.blog-body .hd-b3{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.2)}
.blog-body .hd-author{display:flex;gap:16px;align-items:center;background:var(--hd-dark3);border-radius:var(--radius);padding:20px;margin:36px 0 16px;border:1px solid rgba(255,255,255,.08)}
.blog-body .hd-author img{width:60px;height:60px;border-radius:50%;object-fit:cover;flex-shrink:0}.blog-body .hd-author b{display:block;font-size:15px;margin-bottom:4px}.blog-body .hd-author span{display:block;font-size:13px;color:rgba(255,255,255,.6)}
.blog-body .hd-src{font-size:12.5px;color:rgba(255,255,255,.45);margin:8px 0 18px}
.blog-body a{color:var(--hd-cyan)}.blog-body .hd-btns a,.blog-body .internal-links a{color:inherit}
.blog-body .internal-links a{color:rgba(255,255,255,.8)}
@media(max-width:600px){.blog-body{padding:40px 18px 60px}.blog-hero{padding:96px 18px 44px}.blog-body .hd-table{font-size:13px}.blog-body .hd-steps li{padding:16px}}
.blog-hero .h1-sub{display:block;margin:-6px auto 18px;max-width:820px;font-size:clamp(16px,2.4vw,24px);font-weight:700;line-height:1.4;color:rgba(255,255,255,.82)}
.blog-body .hd-btns a.hd-b2,.blog-body .hd-btns a.hd-b2 *{color:#000!important}
.btn-nav.sms { background:rgba(255,255,255,.1); color:#fff; border:1px solid rgba(255,255,255,.25); }
@media(max-width:600px){ .nav-ctas .btn-nav { padding:8px 12px; font-size:0; } .nav-ctas .btn-nav i { font-size:16px; margin:0; } .nav-logo span { font-size:12px; } }
h1,h2,h3,h4,p,li,figcaption,summary,.blog-card p{word-break:keep-all;overflow-wrap:break-word}
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty}
body{word-break:keep-all;overflow-wrap:break-word}

/*tap*/@media(max-width:768px){.footer a,.footer-nav a,.footer-grid a,.internal-links a,.breadcrumb a,.nav-links a{display:inline-flex;align-items:center;min-height:40px;padding-top:8px;padding-bottom:8px}.footer-grid a,.footer-nav a{display:flex}.faq-q{min-height:48px}.breadcrumb a,.footer-nav a,.internal-links a{padding-left:10px;padding-right:10px}.intent-link,.nav-logo{display:inline-flex;align-items:center;min-height:44px}.slide-dot{box-sizing:content-box;padding:9px;background-clip:content-box}}
