body {display:flex;flex-direction:column;min-height:100vh;background:#ffffff;}
#CONTENT_AREA {display:flex;flex:1;}
#SUB_SIDEBAR {width:250px;min-width:200px;background:#fff;border-right:1px solid #d0d5dd;flex-shrink:0;display:flex;flex-direction:column;overflow-y:auto;}
.sub-sidebar-title {background:var(--c-primary);color:#fff;font-size:18px;font-weight:700;padding:22px 22px;letter-spacing:-0.3px;flex-shrink:0;}
.sub-menu {list-style:none;margin:0;flex:1;}
.sub-menu li {border-bottom:1px solid #f0f2f5;}
.sub-menu-link {display:block;padding:12px 20px 12px 28px;font-size:16px;color:#4a5568;text-decoration:none;position:relative;transition:all .15s;border-left:3px solid transparent;}
.sub-menu-link::before {content:'›';position:absolute;left:14px;color:#bbb;font-size:15px;line-height:1.4;}
.sub-menu-link:hover {background:var(--c-primary-soft);color:var(--c-primary);border-left-color:var(--c-primary);}
.sub-menu-link:hover::before {color:var(--c-primary);}
.sub-menu-link.active {background:var(--c-primary-soft);color:var(--c-primary);font-weight:600;border-left-color:var(--c-primary);}
.sub-menu-link.active::before {color:var(--c-primary);}
#SUB_BODY {flex:1;overflow-y:auto;background:var(--c-surface-2);display:flex;flex-direction:column;min-height:0;}
.sub-page-title-area {background:linear-gradient(135deg,var(--c-primary) 0%,var(--c-primary-hover) 100%);padding:27px 36px 28px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:10px;flex-shrink:0;color:#fff;}
.sub-page-title {font-size:30px;font-weight:800;color:#fff;letter-spacing:-0.6px;}
.sub-breadcrumb {font-size:13px;color:rgba(255,255,255,0.78);display:flex;align-items:center;gap:6px;}
.sub-breadcrumb a {color:rgba(255,255,255,0.88);text-decoration:none;transition:color .15s;}
.sub-breadcrumb a:hover {color:#fff;text-decoration:underline;}
.sub-breadcrumb .sep {color:rgba(255,255,255,0.45);}
.sub-content {padding:24px 28px;flex:1;background:#fff;}
.sub-content-heading {font-size:18px !important;font-weight:700;color:var(--c-text-strong) !important;padding:0 0 0 12px;border-left:3px solid var(--c-primary);margin:0 0 16px 0;line-height:1.4 !important;letter-spacing:-0.3px;}
.sub-content-heading+* {margin-top:0;}
.sub-section {margin:0 0 28px 0;}
.sub-content p {font-size:16px;color:#4a5568;line-height:1.5;}
.sub-notice-box {display:flex;gap:12px;padding:16px 20px;background:var(--c-primary-soft);border:1px solid var(--c-primary-soft-2);font-size:14.5px;color:var(--c-text-base);line-height:1.7;margin-bottom:18px;}
.sub-notice-box strong {color:var(--c-primary);}
#DETAIL_TITLE {font-size:19px;font-weight:700;color:var(--c-primary-hover);margin:0 0 8px;}
#DETAIL_META {font-size:13px;color:#888;display:flex;gap:20px;}
#DETAIL_CONTENT {padding:24px 0;min-height:200px;font-size:14px;line-height:1.8;color:#333;border-bottom:1px solid var(--c-primary-soft-2);}
#DETAIL_ERROR {display:none;color:#e53935;padding:40px 0;text-align:center;}
#DETAIL_NAV {margin-top:24px;border:1px solid var(--c-primary-soft-2);border-radius:6px;overflow:hidden;background:#fff;}
.detail-nav-row {display:flex;align-items:stretch;font-size:14px;text-decoration:none;color:inherit;border-bottom:1px solid var(--c-primary-soft-2);transition:background .15s;}
.detail-nav-row:last-child {border-bottom:none;}
.detail-nav-row:hover {background:var(--c-primary-soft);}
.detail-nav-row .detail-nav-label {display:inline-flex;align-items:center;justify-content:center;width:96px;padding:14px 12px;background:var(--c-primary-soft);color:var(--c-primary);font-weight:700;font-size:13px;border-right:1px solid var(--c-primary-soft-2);flex-shrink:0;}
.detail-nav-row .detail-nav-title {flex:1;padding:14px 16px;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:center;}
.detail-nav-row .detail-nav-date {padding:14px 16px;color:#999;font-size:12px;flex-shrink:0;align-self:center;}
.tbl td.title {text-align:left;color:#1a1a1a;cursor:pointer;}
.tbl td.title:hover {color:var(--c-primary);text-decoration:underline;}
.notice-empty {padding:40px;text-align:center;color:#999;font-size:15px;}
.faq-search-bar {display:flex;align-items:center;gap:8px;margin-bottom:16px;}
.faq-search-bar input {flex:1;max-width:280px;padding:7px 10px;border:1px solid #c8cdd6;border-radius:6px;font-size:13px;outline:none;background:#fff;}
.faq-search-bar input:focus {border-color:var(--c-primary);}
.faq-item {border:1px solid var(--c-border);margin-bottom:8px;background:var(--c-surface);overflow:hidden;box-shadow:var(--shadow-sm);}
.faq-question {padding:12px;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:space-between;font-size:15px;font-weight:600;color:#1a1a1a;transition:background .15s;border-left:3px solid transparent;}
.faq-question:hover {background:var(--c-primary-soft);}
.faq-question.open {background:var(--c-primary-soft);color:var(--c-primary);border-left-color:var(--c-primary);}
.faq-question-left {display:flex;align-items:center;gap:10px;}
.faq-q-badge {width:24px;height:26px;background:var(--c-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0;}
.faq-q-badge.open {background:var(--c-primary);}
.faq-q-title {display:flex;align-items:center;gap:2px;}
.faq-arrow {font-size:12px;color:#aaa;transition:transform .2s;}
.faq-arrow.open {transform:rotate(180deg);color:var(--c-primary);}
.faq-answer {display:none;padding:14px 20px 14px 52px;background:#f8f9fb;border-top:1px solid #e2e6ea;font-size:13px;color:#4a5568;line-height:1.85;}
.faq-answer.open {display:block;}
.guide-hero {display:flex;gap:36px;align-items:center;padding:32px;background:radial-gradient(620px 360px at -10% -10%,rgba(184,200,228,.55) 0%,rgba(184,200,228,0) 60%),radial-gradient(440px 280px at 110% 50%,rgba(216,225,238,.55) 0%,rgba(216,225,238,0) 60%),var(--c-surface);border:1px solid var(--c-border);margin-bottom:10px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;}
.guide-hero-img {flex:0 0 38%;max-width:38%;display:flex;align-items:center;justify-content:center;}
.guide-hero-img img {width:100%;max-width:545px;height:auto;filter:drop-shadow(0 12px 24px rgba(0,70,139,0.22));}
.guide-hero-visual {flex:0 0 38%;max-width:38%;min-height:200px;display:flex;align-items:center;justify-content:center;background:var(--c-primary-soft);border-radius:6px;border:1px dashed var(--c-primary-soft-2);}
.guide-hero-visual svg {width:120px;height:120px;color:var(--c-primary);opacity:0.55;}
.guide-hero-text {flex:1;min-width:0;}
.guide-hero-badge {display:inline-block;padding:4px 10px;background:var(--c-primary);color:#fff;font-size:12px;font-weight:700;border-radius:6px;margin-bottom:14px;letter-spacing:0.5px;}
.guide-hero-title {font-size:30px;font-weight:800;color:#1a1a1a;line-height:1.3;margin-bottom:14px;letter-spacing:-0.6px;}
.guide-hero-title strong {color:var(--c-primary);}
.guide-hero-desc {font-size:17px;color:#4a5568;line-height:1.8;margin-bottom:18px;}
.guide-hero-points {display:flex;flex-wrap:wrap;gap:8px;}
.guide-hero-point {display:inline-flex;align-items:center;gap:6px;padding:4px 10px;background:var(--c-primary-soft);border:1px solid var(--c-primary-soft-2);border-radius:9999px;font-size:13px;color:var(--c-primary);font-weight:700;letter-spacing:0.3px;}
.guide-hero-point::before {content:'\2713';color:#2a8a3a;font-weight:700;}
.guide-section {margin:0 0 32px 0;}
.guide-section-head {display:flex;align-items:center;gap:10px;padding:7px 0 10px 0;margin-bottom:12px;border-bottom:2px solid var(--c-primary);}
.guide-section-head .sub {font-size:14px;color:var(--c-text-muted);margin-left:auto;}
.guide-section-num {width:30px;height:32px;background:var(--c-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0;}
.guide-section-title {font-size:24px;font-weight:700;color:#1a1a1a;letter-spacing:-0.3px;}
.guide-text-block {font-size:17px;color:#4a5568;line-height:1.85;margin-bottom:14px;}
.guide-text-block strong {color:var(--c-primary);font-weight:700;}
.guide-card-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.guide-card-grid.cols-2 {grid-template-columns:repeat(2,1fr);}
.guide-card-grid.cols-3 {grid-template-columns:repeat(3,1fr);}
.guide-card-grid.cols-4 {grid-template-columns:repeat(4,1fr);}
.guide-card {background:var(--c-surface);border:1px solid var(--c-border);border-radius:8px;padding:18px 20px;}
.guide-card-title {font-size:16px;font-weight:700;color:#1a1a1a;margin-bottom:6px;}
.guide-card-desc {font-size:14.5px;color:#5a6473;line-height:1.65;}
.guide-list {list-style:none;margin:0;padding:0;font-size:17px;}
.guide-list>li {padding:12px 0;border-bottom:1px solid #f0f2f5;display:flex;gap:20px;align-items:baseline;}
.guide-list>li:first-child {padding-top:0;}
.guide-list>li:last-child {border-bottom:none;padding-bottom:0;}
.guide-list>li .t {flex:0 0 200px;font-size:17px;font-weight:700;color:#1a1a1a;letter-spacing:-0.2px;}
.guide-list>li .d {flex:1;color:#4a5568;line-height:1.8;}
.guide-cta {position:relative;overflow:hidden;background:linear-gradient(135deg,var(--c-primary) 0%,var(--c-primary-hover) 100%);color:#fff;border-radius:var(--r-xl);padding:28px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;box-shadow:0 10px 28px -10px rgba(0,70,139,0.42),inset 0 1px 0 rgba(255,255,255,0.25);}
.guide-cta::before {content:'';position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,0.14);pointer-events:none;}
.guide-cta::after {content:'';position:absolute;left:-40px;bottom:-50px;width:140px;height:140px;border-radius:50%;background:rgba(255,255,255,0.08);pointer-events:none;}
.guide-cta-text {flex:1;min-width:200px;position:relative;z-index:1;}
.guide-cta-text .t {font-size:19px;font-weight:700;margin-bottom:6px;letter-spacing:-0.3px;display:flex;align-items:center;gap:8px;}
.guide-cta-text .t::before {content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,0.2);}
.guide-cta-text .s {font-size:13.5px;color:rgba(255,255,255,0.88);line-height:1.6;}
.guide-cta-btn {display:inline-flex;align-items:center;gap:8px;padding:10px 22px;background:#fff;color:var(--c-primary);border:none;font-size:15px;font-weight:700;text-decoration:none;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;white-space:nowrap;position:relative;z-index:1;box-shadow:0 4px 10px -2px rgba(0,0,0,0.15);}
.guide-cta-btn:hover {transform:translateY(-1px);box-shadow:0 6px 14px -3px rgba(0,0,0,0.22);}
.guide-info-table {width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--c-border);border-radius:6px;overflow:hidden;font-size:16px;}
.guide-info-table th {padding:16px 18px;background:var(--c-surface-3);color:var(--c-primary);font-weight:700;text-align:left;width:200px;border-bottom:1px solid var(--c-border-soft);border-right:1px solid var(--c-border-soft);}
.guide-info-table td {padding:16px 18px;color:var(--c-text-base);border-bottom:1px solid var(--c-border-soft);line-height:1.75;}
.guide-info-table tr:last-child th,.guide-info-table tr:last-child td {border-bottom:none;font-weight:800;}
.fix-badge {display:inline-block;background:var(--c-primary);color:#fff;font-size:13px;font-weight:700;line-height:1;padding:4px 8px;vertical-align:middle;letter-spacing:-0.2px;white-space:nowrap;}
.search-bar {padding:8px 16px;background:var(--c-primary);color:#fff;border:none;font-size:13px;cursor:pointer;}
.mp-detail-btn {display:inline-flex;align-items:center;justify-content:center;padding:6px 12px;background:#fff;color:var(--c-primary);border:1px solid var(--c-primary);font-size:12.5px;font-weight:600;cursor:pointer;border-radius:4px;transition:background .15s,color .15s;white-space:nowrap;line-height:1.2;}
.mp-detail-btn:hover {background:var(--c-primary);color:#fff;}
.mp-api-key {display:inline-block;padding:3px 8px;background:#f1f4f9;border:1px solid var(--c-primary-soft-2);color:var(--c-primary);font-family:"JetBrains Mono",Consolas,monospace;font-size:12.5px;border-radius:4px;word-break:break-all;max-width:100%;}
@media (min-width:769px) and (max-width:1100px) {
#SUB_SIDEBAR {width:200px;min-width:180px;}
.sub-sidebar-title {font-size:16px;padding:14px 16px;}
.sub-menu-link {padding:10px 16px 10px 24px;font-size:14px;}
.sub-page-title-area {padding:18px 24px;}
.sub-page-title {font-size:22px;font-weight:700;color:#fff;letter-spacing:-0.4px;}
.sub-content {padding:20px 22px;}
.sub-content-heading {font-size:18px !important;font-weight:700;color:var(--c-text-strong) !important;padding:0 0 0 12px;border-left:3px solid var(--c-primary);margin:0 0 16px 0;line-height:1.4 !important;letter-spacing:-0.3px;}
.guide-hero {padding:32px;border:1px solid var(--c-border);border-radius:var(--r-xl);margin-bottom:32px;}
.guide-hero-img,.guide-hero-visual {flex:0 0 36%;max-width:36%;}
.guide-hero-img img {max-width:240px;}
.guide-hero-title {font-size:22px;}
.guide-hero-desc {font-size:14px;}
.guide-card-grid,.guide-card-grid.cols-4 {grid-template-columns:repeat(2,1fr);}
.guide-flow-step-title {font-size:13px;}
.guide-flow-step-desc {font-size:11px;}
.guide-section-title {font-size:18px;}
.guide-info-table th {width:130px;font-size:13px;}
.guide-info-table td {font-size:13px;}
}
@media (max-width:768px) {
html,body {height:auto;}
body {min-height:100vh;}
#CONTENT_AREA {flex-direction:column;overflow:visible;}
#SUB_SIDEBAR {width:100%;min-width:0;height:auto;border-right:none;border-bottom:1px solid #d0d5dd;overflow-y:visible;flex-shrink:0;}
#SUB_SIDEBAR.open .sub-sidebar-title::after {transform:rotate(180deg);}
#SUB_SIDEBAR.open .sub-menu {display:flex;}
#SUB_BODY {flex:1 1 auto;}
#DETAIL_TITLE {font-size:17px;}
#DETAIL_META {font-size:12px;gap:12px;flex-wrap:wrap;}
#DETAIL_CONTENT {font-size:13px;padding:18px 0;}
.sub-sidebar-title {font-size:15px;padding:12px 16px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;user-select:none;}
.sub-sidebar-title::after {content:'\25BC';font-size:11px;transition:transform .2s;color:var(--c-primary);}
.sub-menu {display:none;flex-direction:column;border-top:1px solid #f0f2f5;}
.sub-menu li {border-bottom:1px solid #f0f2f5;border-right:none;}
.sub-menu li:last-child {border-bottom:none;}
.sub-menu-link {padding:12px 20px 12px 28px;font-size:14px;}
.sub-page-title-area {padding:10px 14px;flex-direction:column;align-items:flex-start;gap:2px;}
.guide-section {margin:0 0 14px 0 !important;}
.sub-page-title {font-size:20px;font-weight:700;color:#fff;letter-spacing:-0.4px;}
.sub-breadcrumb {font-size:11px;}
.sub-content {padding:10px 8px 12px;max-width:100%;box-sizing:border-box;}
.sub-section {max-width:100%;box-sizing:border-box;margin:0 0 14px 0;}
.sub-content-heading {font-size:15px !important;font-weight:700;color:var(--c-text-strong) !important;padding:0 0 0 10px;border-left:3px solid var(--c-primary);margin:0 0 12px 0;line-height:1.4 !important;letter-spacing:-0.3px;}
.sub-content p {font-size:13.5px;line-height:1.6;text-align:left;}
.sub-notice-box {display:flex;flex-wrap:wrap;gap:6px 10px;padding:12px 14px;background:var(--c-primary-soft);border:1px solid var(--c-primary-soft-2);font-size:13px;color:var(--c-text-base);line-height:1.65;margin-bottom:14px;}
.sub-notice-box strong {flex:0 0 auto;}
.sub-section {margin:0 0 20px 0;}
.detail-nav-row {font-size:13px;}
.detail-nav-row .detail-nav-label {width:64px;padding:10px 8px;font-size:12px;}
.detail-nav-row .detail-nav-title {padding:10px 12px;}
.detail-nav-row .detail-nav-date {display:none;}
.faq-search-bar input {max-width:none;}
.faq-question {font-size:14px;padding:10px;}
.faq-answer {padding:10px 10px 10px 20px;}
/* 표 모바일: 가로 스크롤 없이 셀 내부 줄바꿈 — viewport 안에 맞춤 */
.tbl {display:table;table-layout:fixed;width:100%;min-width:0;font-size:14px;border-collapse:separate;overflow:visible;}
.tbl thead,.tbl tbody,.tbl tr {display:revert;}
.tbl thead th,.tbl tbody td {white-space:normal;word-break:break-all;overflow-wrap:anywhere;padding:6px 6px;line-height:1.4;}
.tbl thead th {font-size:11.5px;}
.tbl tbody td.title {max-width:none;white-space:normal;word-break:keep-all;text-align:left;}
.guide-hero {min-height:auto !important;flex-direction:column-reverse;padding:12px;border:1px solid var(--c-border);border-radius:var(--r-md);margin-bottom:12px;gap:10px;align-items:stretch;}
.guide-hero-text {text-align:center;}
.guide-hero-img,.guide-hero-visual {flex:0 0 auto;max-width:100%;align-self:center;}
.guide-hero-img img {max-width:200px;width:100%;height:auto;}
.guide-hero-visual {min-height:120px;}
.guide-hero-visual svg {width:64px;height:64px;}
.guide-hero-badge {margin-bottom:6px;}
.guide-hero-title {font-size:18px;margin-bottom:6px;line-height:1.25;}
.guide-hero-desc {font-size:13px;line-height:1.55;margin-bottom:6px;}
.guide-hero-points {justify-content:center;}
.guide-card-grid,.guide-card-grid.cols-2,.guide-card-grid.cols-4 {grid-template-columns:1fr;gap:10px;}
.guide-card {border-radius:12px;}
.guide-flow {flex-direction:column;}
.guide-flow-arrow {transform:rotate(90deg);padding:4px 0;}
.guide-section-title {font-size:16px;}
.guide-section-head {padding:6px 0 8px 0;margin-bottom:10px;}
.guide-section-num {width:26px;height:28px;font-size:13px;}
.guide-text-block {font-size:13.5px;line-height:1.7;margin-bottom:10px;}
.guide-list {font-size:13.5px;}
.guide-list>li {flex-direction:column;gap:2px;padding:9px 0;}
.guide-list>li .t {flex:0 0 auto;font-size:13.5px;}
.guide-list>li .d {font-size:13.5px;line-height:1.6;}
.guide-card-title {font-size:14px;}
.guide-card-desc {font-size:13px;line-height:1.55;}
.guide-stats {grid-template-columns:repeat(2,1fr);}
.guide-card-grid.cols-3 {grid-template-columns:1fr;}
.guide-cta {padding:26px 30px;gap:16px;}
.guide-info-table th {width:100px;font-size:12px;padding:10px;}
.guide-info-table td {font-size:13px;padding:10px;}
}