/* ============================================================
   인도네시아 법령정보 포털 — 파일럿 공통 디자인 시스템
   기준: 국가법령정보센터(law.go.kr) 레이아웃 + peraturan 법령위계 메뉴
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700;900&display=swap');
:root{
  --navy:#1B2C5D; --navy-2:#13395f; --red:#c8102e; --gold:#d9a441;
  --blue:#1763a6; --blue-soft:#eef4fb; --line:#e5e9f0; --bg:#ffffff;
  --txt:#1c2733; --muted:#6b7785;
  --b-uu:#c8102e; --b-pp:#1763a6; --b-perpres:#2e7d57; --b-permen:#8a6d1f; --b-perda:#6b4ea0; --b-mk:#444;
  --shadow-card:0 1px 2px rgba(11,42,74,.04),0 1px 3px rgba(11,42,74,.04);
  --shadow-lift:0 10px 28px rgba(11,42,74,.12);
}
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:var(--root-fs,100%)}
body{font-family:'Noto Sans KR','Malgun Gothic','Segoe UI',sans-serif;background:var(--bg);color:var(--txt);line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
a{text-decoration:none;color:inherit}
ul{list-style:none}

/* ===== 라인 SVG 아이콘 ===== */
.svg-ic{display:inline-flex;align-items:center;justify-content:center;vertical-align:-.14em;line-height:0;flex-shrink:0}
.svg-ic svg{width:1em;height:1em;display:block}
.cat-ic .svg-ic,.fr-label .ic .svg-ic,.svc-tile .ic .svg-ic{color:var(--blue)}
.svc-tile.call .ic .svg-ic{color:#fff}
.wrap{max-width:1280px;margin:0 auto;padding:0 24px}
/* 조회 계열(검색·본문): 본문만 최대 폭 확장(헤더·탭·경계선은 1280 유지) */
body.wide main > .wrap{max-width:2400px}
/* 사이드바-본문 사이 드래그 스플리터 */
.splitter{align-self:stretch;width:10px;cursor:col-resize;position:relative;border-radius:6px;background:transparent;touch-action:none}
.splitter::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;transform:translateX(-50%);background:var(--line);border-radius:2px;transition:background .12s}
.splitter:hover::before,.splitter.dragging::before{background:var(--blue);width:3px}
.splitter::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:4px;height:34px;border-radius:3px;background:#c2cad3}
.splitter:hover::after,.splitter.dragging::after{background:var(--blue)}
@media(max-width:1080px){.splitter{display:none}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
/* 가로 스와이프 컨테이너 (조건 ④: 가로 넘침은 스와이프로 처리) */
.x-swipe{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.x-swipe::-webkit-scrollbar{height:8px}
.x-swipe::-webkit-scrollbar-thumb{background:#c2cdd9;border-radius:4px}
.x-swipe::-webkit-scrollbar-track{background:#eef2f7;border-radius:4px}

/* ===== ① Utility ===== */
.utility{background:var(--navy);color:#cdd8e6;font-size:12.5px}
.utility .wrap{display:flex;align-items:center;justify-content:flex-end;gap:16px;height:38px}
.utility a:hover{color:#fff}
.lang-switch{position:relative;display:flex;align-items:center}
.lang-cur{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border:1px solid rgba(255,255,255,.28);border-radius:16px;background:rgba(255,255,255,.08);color:#e6eef7;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer}
.lang-cur:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.45);color:#fff}
.lang-cur .glb{width:14px;height:14px;flex:0 0 auto}
.lang-cur .cav{width:12px;height:12px;flex:0 0 auto;opacity:.8;transition:transform .18s}
.lang-switch.open .lang-cur .cav{transform:rotate(180deg)}
.lang-cur .code{letter-spacing:.04em}
.lang-menu{display:none;position:absolute;top:calc(100% + 7px);right:0;min-width:190px;background:#fff;border:1px solid #e3e8ef;border-radius:10px;box-shadow:0 12px 30px rgba(11,42,74,.22);padding:6px;z-index:220}
.lang-switch.open .lang-menu{display:block}
.lang-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;box-sizing:border-box;border:none;background:transparent;color:#41505e;font-family:inherit;font-size:13px;text-align:left;padding:9px 11px;border-radius:7px;cursor:pointer}
.lang-btn:hover{background:#f2f7fc;color:var(--blue)}
.lang-btn .ck{visibility:hidden;color:var(--blue);font-weight:700}
.lang-btn.active{color:var(--navy);font-weight:700}
.lang-btn.active .ck{visibility:visible}
.utility .divider{width:1px;height:14px;background:rgba(255,255,255,.2)}
.fontsize{display:flex;align-items:center;gap:4px}
.fontsize button{width:22px;height:22px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#cdd8e6;border-radius:5px;cursor:pointer;font-size:13px;line-height:1}
.fontsize button:hover{background:rgba(255,255,255,.12);color:#fff}
.fontsize .pct{min-width:42px;text-align:center}

/* ===== ② Header ===== */
.header{background:#fff;border-bottom:1px solid var(--line)}
.header .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.brand{display:flex;align-items:center;gap:14px}
.emblem{width:50px;height:50px;flex-shrink:0;object-fit:contain}
.brand-txt b{display:block;font-size:18px;font-weight:800;color:var(--navy);letter-spacing:-.3px}
.brand-txt .min{font-size:12px;color:var(--red);font-weight:700;margin-top:2px}
.brand-txt .djpp{display:block;font-size:11px;color:var(--muted);margin-top:1px}
/* 국법 기준: 서브페이지 헤더 내 컴팩트 검색 (로고 옆) */
.header-search{display:flex;align-items:center;height:44px}
.header-search input{width:330px;height:44px;border:2px solid var(--navy);border-right:none;border-radius:8px 0 0 8px;padding:0 14px;font-size:14px;outline:none;font-family:inherit;color:var(--txt)}
.header-search .hs-go{height:44px;width:46px;border:2px solid var(--navy);border-left:none;border-radius:0 8px 8px 0;background:#f5b301;color:#3a2c05;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.header-search .hs-go:hover{background:#3a9d5d;color:#fff}
.header-search .hs-adv{height:44px;display:flex;align-items:center;padding:0 16px;margin-left:14px;border:2px solid var(--navy);border-radius:8px;background:#f5b301;color:#3a2c05;font-weight:700;font-size:13px;white-space:nowrap;cursor:pointer;transition:background .15s,color .15s}
.header-search .hs-adv:hover{background:#3a9d5d;color:#fff}
.header-search-mini{display:flex;border:2px solid var(--navy);border-radius:24px;overflow:hidden;height:42px;width:340px}
.header-search-mini input{flex:1;border:none;padding:0 16px;font-size:14px;outline:none}
.header-search-mini button{border:none;background:var(--navy);color:#fff;width:48px;cursor:pointer;font-size:16px}
.wa-mark{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);border-radius:8px;padding:5px 10px;color:var(--muted);font-size:10px;line-height:1.25;text-align:center}
.wa-mark b{color:var(--blue);font-size:13px}

/* ===== ③ GNB ===== */
.gnb{background:var(--navy);box-shadow:0 1px 0 rgba(255,255,255,.04),0 6px 18px rgba(11,42,74,.16)}
.gnb .wrap{display:flex;align-items:stretch}
.gnb-home{display:flex;align-items:center;padding:0 18px;color:#fff;font-size:18px;border-right:1px solid rgba(255,255,255,.1)}
.gnb-home:hover{background:var(--blue)}
.gnb-menu{display:flex;flex:1}
.gnb-menu>li{position:relative}
.gnb-menu>li>a{display:flex;align-items:center;height:52px;padding:0 30px;color:#eaf0f7;font-size:15.5px;font-weight:600}
.gnb-menu>li.active>a{background:var(--blue);color:#fff;box-shadow:none}
.gnb-menu>li:hover>a{background:var(--blue);color:#fff;box-shadow:none}
/* 호버 밑줄: 드롭다운 위로 끊김 없이 표시 */
.gnb-menu>li>a{position:relative}
.gnb-menu>li:hover .submenu{border-top-color:var(--red)}
.submenu{display:none;position:absolute;top:52px;left:0;min-width:230px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--red);box-shadow:0 16px 32px rgba(11,42,74,.18);padding:8px 0;z-index:60}
.gnb-menu>li:hover .submenu{display:block}
.submenu li a{display:flex;justify-content:space-between;gap:12px;padding:9px 20px;font-size:13.5px;color:#3a4655}
.submenu li a:hover{background:var(--blue-soft);color:var(--blue)}
.submenu .tag{font-size:10.5px;color:#fff;background:var(--gold);border-radius:4px;padding:1px 7px;align-self:center}
.gnb-all{display:flex;align-items:center;gap:8px;padding:0 20px;color:#fff;font-size:14.5px;font-weight:600;cursor:pointer;border-left:1px solid rgba(255,255,255,.1)}
.gnb-all:hover{background:var(--blue)}
.allmenu-panel{display:none;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(0,0,0,.1)}
.allmenu-panel.open{display:block}
.allmenu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:26px 0 32px}
.allmenu-col h4{font-size:14.5px;color:var(--navy);font-weight:800;padding-bottom:9px;margin-bottom:7px;border-bottom:2px solid var(--navy)}
.allmenu-col li a{display:block;padding:6px 2px;font-size:13px;color:#4a5663}
.allmenu-col li a:hover{color:var(--blue);text-decoration:underline}

/* ===== badges ===== */
.badge{flex-shrink:0;font-size:11px;font-weight:700;color:#fff;border-radius:5px;padding:3px 8px;min-width:58px;text-align:center;display:inline-block}
.b-uu{background:var(--b-uu)}.b-pp{background:var(--b-pp)}.b-perpres{background:var(--b-perpres)}.b-permen{background:var(--b-permen)}.b-perda{background:var(--b-perda)}.b-mk{background:var(--b-mk)}.b-doc{background:var(--muted)}
.status-chip{font-size:11px;font-weight:700;border-radius:12px;padding:2px 10px;display:inline-block}
.st-current{background:#e6f4ea;color:#1e7e44}
.st-repealed{background:#fdeaea;color:#c8102e}
.st-amended{background:#e3f0ff;color:#1b58a6}

/* ===== breadcrumb ===== */
.crumb{background:#fff;border-bottom:1px solid var(--line)}
.crumb .wrap{display:flex;align-items:center;gap:8px;height:44px;font-size:12.5px;color:var(--muted)}
.crumb a:hover{color:var(--blue)}
.crumb .sep{color:#c2cad3}
.crumb .here{color:var(--navy);font-weight:700}

/* ===== shared card / section head ===== */
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 20px;box-shadow:var(--shadow-card)}
.sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;padding-bottom:11px;border-bottom:2px solid var(--navy)}
.sec-head h3{font-size:16.5px;font-weight:800;color:var(--navy);display:flex;align-items:center;gap:8px}
.sec-head h3::before{content:"";width:5px;height:17px;background:var(--red);border-radius:2px}
.more{font-size:12px;color:var(--muted)}.more:hover{color:var(--blue)}
.page-title{font-size:24px;font-weight:800;color:var(--navy);letter-spacing:-.5px}

/* ===== buttons ===== */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--txt);font-size:13px;padding:8px 14px;border-radius:8px;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--blue-soft);border-color:var(--blue);color:var(--blue)}
.btn-navy{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-navy:hover{background:var(--navy-2);color:#fff}
.btn-sm{padding:5px 10px;font-size:12px}

/* ===== law list (shared) ===== */
.law-list li a{display:flex;align-items:center;gap:10px;padding:10px 4px;border-bottom:1px dashed var(--line)}
.law-list li:last-child a{border-bottom:none}
.law-list li a:hover .ttl{color:var(--blue);text-decoration:underline}
.law-list .ttl{flex:1;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.law-list .org{font-size:12px;color:var(--muted);flex-shrink:0}
.law-list .date{font-size:12px;color:var(--muted);flex-shrink:0;min-width:80px;text-align:right}
.law-list .new{color:var(--red);font-size:10px;font-weight:700;margin-left:3px;vertical-align:top}

/* ===== Footer ===== */
.footer{background:#0a2138;color:#9fb2c6;margin-top:40px;padding:30px 0 26px;font-size:13px}
.footer .wrap{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.footer .flogo{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.footer .flogo b{color:#fff;font-size:15px}
.footer .flogo-txt{display:flex;flex-direction:column;line-height:1.35}
.footer .flogo-txt b{display:block}
.footer .flogo-txt .min{color:#c9b16a;font-size:12px;font-weight:700;margin-top:2px}
.footer .flogo-txt .djpp{color:#9fb2c6;font-size:11.5px;margin-top:1px}
.foot-links{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.foot-links a{color:#cdd8e6;font-size:12.5px}.foot-links a:hover{color:#fff}
.footer address{font-style:normal;line-height:1.7;color:#7e93a8;font-size:12.5px}
.foot-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.foot-right select{background:#13395f;color:#cdd8e6;border:1px solid #28486b;border-radius:7px;padding:8px 12px;font-size:12.5px;font-family:inherit}
.foot-right p{font-size:12px;color:#7e93a8;text-align:right}
.pilot-note{background:var(--gold);color:#3a2a05;font-size:11.5px;font-weight:700;text-align:center;padding:6px}

/* ===== tabs (generic) ===== */
.tab-strip{display:flex;border-bottom:2px solid var(--navy);flex-wrap:wrap}
.tab-strip button{border:none;background:transparent;padding:11px 18px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit;border-bottom:3px solid transparent;margin-bottom:-2px}
.tab-strip button.active{color:var(--navy);font-weight:800;border-bottom-color:var(--red)}
.tab-pane{display:none}.tab-pane.active{display:block}
/* 2차분류 = 검색조건. 메뉴가 아니라 탭(폴더형)으로 읽히게 한다 */
.field-tabs{background:transparent;margin:0}
.field-tabs .wrap{display:flex;align-items:flex-end;gap:3px;flex-wrap:wrap;padding:0;max-width:none;background:transparent;border:none;box-shadow:none;border-radius:0}
.field-tabs button,.field-tabs a{border:1px solid var(--line);border-bottom:none;background:#f4f7fb;color:var(--muted);font-size:12px;font-weight:600;padding:6px 13px;cursor:pointer;font-family:inherit;border-radius:5px 5px 0 0;position:relative;white-space:nowrap;margin-bottom:0}
.field-tabs button:hover,.field-tabs a:hover{background:#e8eef7;color:var(--blue)}
.field-tabs button.active,.field-tabs a.active{background:var(--navy);color:#fff;font-weight:800;border-color:var(--navy);z-index:1}
.field-tabs button.active:hover,.field-tabs a.active:hover{background:var(--navy);color:#fff}


/* ===== search bar (shared: search & law-view) ===== */
.search-hero{background:var(--navy-2);padding:14px 0}
.sh-box{display:flex;gap:8px;max-width:920px;margin:0 auto;align-items:stretch}
.sh-box select{border:none;background:#fff;border-radius:8px;padding:0 14px;font-size:14px;color:var(--navy);font-weight:600;font-family:inherit;height:44px}
.sh-box .inp{flex:1;display:flex;background:#fff;border-radius:8px;overflow:hidden}
.sh-box .inp input{flex:1;border:none;padding:0 16px;font-size:15px;outline:none;font-family:inherit}
.sh-box .inp button{border:none;background:var(--red);color:#fff;width:60px;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.sh-box .adv{border:none;background:var(--gold);color:#3a2a05;font-weight:700;border-radius:8px;padding:0 16px;font-size:13.5px;cursor:pointer;font-family:inherit;white-space:nowrap;display:flex;align-items:center;justify-content:center}

/* ===== scope & field tabs (shared: search & law-view) ===== */
.scope-tabs{background:var(--navy);border-bottom:1px solid rgba(255,255,255,.1)}
.scope-tabs .wrap{display:flex;gap:2px}
.scope-tabs button,.scope-tabs a{border:none;background:transparent;color:#cdd8e6;font-size:13.5px;font-weight:600;padding:11px 22px;cursor:pointer;font-family:inherit;border-bottom:3px solid transparent;display:inline-flex;align-items:center}
.scope-tabs button:hover,.scope-tabs a:hover{color:#fff}
.scope-tabs button.active,.scope-tabs a.active{color:#fff;background:var(--blue);border-bottom-color:var(--gold);font-weight:700}

@media(max-width:1080px){.splitter{display:none}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
/* 가로 스와이프 컨테이너 (조건 ④: 가로 넘침은 스와이프로 처리) */
.x-swipe{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.x-swipe::-webkit-scrollbar{height:8px}
.x-swipe::-webkit-scrollbar-thumb{background:#c2cdd9;border-radius:4px}
.x-swipe::-webkit-scrollbar-track{background:#eef2f7;border-radius:4px}

/* ===== ① Utility ===== */
.utility{background:var(--navy);color:#cdd8e6;font-size:12.5px}
.utility .wrap{display:flex;align-items:center;justify-content:flex-end;gap:16px;height:38px}
.utility a:hover{color:#fff}
.lang-switch{position:relative;display:flex;align-items:center}
.lang-cur{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border:1px solid rgba(255,255,255,.28);border-radius:16px;background:rgba(255,255,255,.08);color:#e6eef7;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer}
.lang-cur:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.45);color:#fff}
.lang-cur .glb{width:14px;height:14px;flex:0 0 auto}
.lang-cur .cav{width:12px;height:12px;flex:0 0 auto;opacity:.8;transition:transform .18s}
.lang-switch.open .lang-cur .cav{transform:rotate(180deg)}
.lang-cur .code{letter-spacing:.04em}
.lang-menu{display:none;position:absolute;top:calc(100% + 7px);right:0;min-width:190px;background:#fff;border:1px solid #e3e8ef;border-radius:10px;box-shadow:0 12px 30px rgba(11,42,74,.22);padding:6px;z-index:220}
.lang-switch.open .lang-menu{display:block}
.lang-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;box-sizing:border-box;border:none;background:transparent;color:#41505e;font-family:inherit;font-size:13px;text-align:left;padding:9px 11px;border-radius:7px;cursor:pointer}
.lang-btn:hover{background:#f2f7fc;color:var(--blue)}
.lang-btn .ck{visibility:hidden;color:var(--blue);font-weight:700}
.lang-btn.active{color:var(--navy);font-weight:700}
.lang-btn.active .ck{visibility:visible}
.utility .divider{width:1px;height:14px;background:rgba(255,255,255,.2)}
.fontsize{display:flex;align-items:center;gap:4px}
.fontsize button{width:22px;height:22px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#cdd8e6;border-radius:5px;cursor:pointer;font-size:13px;line-height:1}
.fontsize button:hover{background:rgba(255,255,255,.12);color:#fff}
.fontsize .pct{min-width:42px;text-align:center}

/* ===== ② Header ===== */
.header{background:#fff;border-bottom:1px solid var(--line)}
.header .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.brand{display:flex;align-items:center;gap:14px}
.emblem{width:50px;height:50px;flex-shrink:0;object-fit:contain}
.brand-txt b{display:block;font-size:18px;font-weight:800;color:var(--navy);letter-spacing:-.3px}
.brand-txt .min{font-size:12px;color:var(--red);font-weight:700;margin-top:2px}
.brand-txt .djpp{display:block;font-size:11px;color:var(--muted);margin-top:1px}
/* 국법 기준: 서브페이지 헤더 내 컴팩트 검색 (로고 옆) */
.header-search{display:flex;align-items:center;height:44px}
.header-search input{width:330px;height:44px;border:2px solid var(--navy);border-right:none;border-radius:8px 0 0 8px;padding:0 14px;font-size:14px;outline:none;font-family:inherit;color:var(--txt)}
.header-search .hs-go{height:44px;width:46px;border:2px solid var(--navy);border-left:none;border-radius:0 8px 8px 0;background:#f5b301;color:#3a2c05;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.header-search .hs-go:hover{background:#3a9d5d;color:#fff}
.header-search .hs-adv{height:44px;display:flex;align-items:center;padding:0 16px;margin-left:14px;border:2px solid var(--navy);border-radius:8px;background:#f5b301;color:#3a2c05;font-weight:700;font-size:13px;white-space:nowrap;cursor:pointer;transition:background .15s,color .15s}
.header-search .hs-adv:hover{background:#3a9d5d;color:#fff}
.header-search-mini{display:flex;border:2px solid var(--navy);border-radius:24px;overflow:hidden;height:42px;width:340px}
.header-search-mini input{flex:1;border:none;padding:0 16px;font-size:14px;outline:none}
.header-search-mini button{border:none;background:var(--navy);color:#fff;width:48px;cursor:pointer;font-size:16px}
.wa-mark{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);border-radius:8px;padding:5px 10px;color:var(--muted);font-size:10px;line-height:1.25;text-align:center}
.wa-mark b{color:var(--blue);font-size:13px}

/* ===== ③ GNB ===== */
.gnb{background:var(--navy);box-shadow:0 1px 0 rgba(255,255,255,.04),0 6px 18px rgba(11,42,74,.16)}
.gnb .wrap{display:flex;align-items:stretch}
.gnb-home{display:flex;align-items:center;padding:0 18px;color:#fff;font-size:18px;border-right:1px solid rgba(255,255,255,.1)}
.gnb-home:hover{background:var(--blue)}
.gnb-menu{display:flex;flex:1}
.gnb-menu>li{position:relative}
.gnb-menu>li>a{display:flex;align-items:center;height:52px;padding:0 30px;color:#eaf0f7;font-size:15.5px;font-weight:600}
.gnb-menu>li.active>a{background:var(--blue);color:#fff;box-shadow:none}
.gnb-menu>li:hover>a{background:var(--blue);color:#fff;box-shadow:none}
/* 호버 밑줄: 드롭다운 위로 끊김 없이 표시 */
.gnb-menu>li>a{position:relative}
.gnb-menu>li:hover .submenu{border-top-color:var(--red)}
.submenu{display:none;position:absolute;top:52px;left:0;min-width:230px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--red);box-shadow:0 16px 32px rgba(11,42,74,.18);padding:8px 0;z-index:60}
.gnb-menu>li:hover .submenu{display:block}
.submenu li a{display:flex;justify-content:space-between;gap:12px;padding:9px 20px;font-size:13.5px;color:#3a4655}
.submenu li a:hover{background:var(--blue-soft);color:var(--blue)}
.submenu .tag{font-size:10.5px;color:#fff;background:var(--gold);border-radius:4px;padding:1px 7px;align-self:center}
.gnb-all{display:flex;align-items:center;gap:8px;padding:0 20px;color:#fff;font-size:14.5px;font-weight:600;cursor:pointer;border-left:1px solid rgba(255,255,255,.1)}
.gnb-all:hover{background:var(--blue)}
.allmenu-panel{display:none;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(0,0,0,.1)}
.allmenu-panel.open{display:block}
.allmenu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:26px 0 32px}
.allmenu-col h4{font-size:14.5px;color:var(--navy);font-weight:800;padding-bottom:9px;margin-bottom:7px;border-bottom:2px solid var(--navy)}
.allmenu-col li a{display:block;padding:6px 2px;font-size:13px;color:#4a5663}
.allmenu-col li a:hover{color:var(--blue);text-decoration:underline}

/* ===== badges ===== */
.badge{flex-shrink:0;font-size:11px;font-weight:700;color:#fff;border-radius:5px;padding:3px 8px;min-width:58px;text-align:center;display:inline-block}
.b-uu{background:var(--b-uu)}.b-pp{background:var(--b-pp)}.b-perpres{background:var(--b-perpres)}.b-permen{background:var(--b-permen)}.b-perda{background:var(--b-perda)}.b-mk{background:var(--b-mk)}.b-doc{background:var(--muted)}
.status-chip{font-size:11px;font-weight:700;border-radius:12px;padding:2px 10px;display:inline-block}
.st-current{background:#e6f4ea;color:#1e7e44}
.st-repealed{background:#fdeaea;color:#c8102e}
.st-amended{background:#e3f0ff;color:#1b58a6}

/* ===== breadcrumb ===== */
.crumb{background:#fff;border-bottom:1px solid var(--line)}
.crumb .wrap{display:flex;align-items:center;gap:8px;height:44px;font-size:12.5px;color:var(--muted)}
.crumb a:hover{color:var(--blue)}
.crumb .sep{color:#c2cad3}
.crumb .here{color:var(--navy);font-weight:700}

/* ===== shared card / section head ===== */
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 20px;box-shadow:var(--shadow-card)}
.sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;padding-bottom:11px;border-bottom:2px solid var(--navy)}
.sec-head h3{font-size:16.5px;font-weight:800;color:var(--navy);display:flex;align-items:center;gap:8px}
.sec-head h3::before{content:"";width:5px;height:17px;background:var(--red);border-radius:2px}
.more{font-size:12px;color:var(--muted)}.more:hover{color:var(--blue)}
.page-title{font-size:24px;font-weight:800;color:var(--navy);letter-spacing:-.5px}

/* ===== buttons ===== */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--txt);font-size:13px;padding:8px 14px;border-radius:8px;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--blue-soft);border-color:var(--blue);color:var(--blue)}
.btn-navy{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-navy:hover{background:var(--navy-2);color:#fff}
.btn-sm{padding:5px 10px;font-size:12px}

/* ===== law list (shared) ===== */
.law-list li a{display:flex;align-items:center;gap:10px;padding:10px 4px;border-bottom:1px dashed var(--line)}
.law-list li:last-child a{border-bottom:none}
.law-list li a:hover .ttl{color:var(--blue);text-decoration:underline}
.law-list .ttl{flex:1;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.law-list .org{font-size:12px;color:var(--muted);flex-shrink:0}
.law-list .date{font-size:12px;color:var(--muted);flex-shrink:0;min-width:80px;text-align:right}
.law-list .new{color:var(--red);font-size:10px;font-weight:700;margin-left:3px;vertical-align:top}

/* ===== Footer ===== */
.footer{background:#0a2138;color:#9fb2c6;margin-top:40px;padding:30px 0 26px;font-size:13px}
.footer .wrap{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.footer .flogo{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.footer .flogo b{color:#fff;font-size:15px}
.footer .flogo-txt{display:flex;flex-direction:column;line-height:1.35}
.footer .flogo-txt b{display:block}
.footer .flogo-txt .min{color:#c9b16a;font-size:12px;font-weight:700;margin-top:2px}
.footer .flogo-txt .djpp{color:#9fb2c6;font-size:11.5px;margin-top:1px}
.foot-links{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.foot-links a{color:#cdd8e6;font-size:12.5px}.foot-links a:hover{color:#fff}
.footer address{font-style:normal;line-height:1.7;color:#7e93a8;font-size:12.5px}
.foot-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.foot-right select{background:#13395f;color:#cdd8e6;border:1px solid #28486b;border-radius:7px;padding:8px 12px;font-size:12.5px;font-family:inherit}
.foot-right p{font-size:12px;color:#7e93a8;text-align:right}
.pilot-note{background:var(--gold);color:#3a2a05;font-size:11.5px;font-weight:700;text-align:center;padding:6px}

/* ===== tabs (generic) ===== */
.tab-strip{display:flex;border-bottom:2px solid var(--navy);flex-wrap:wrap}
.tab-strip button{border:none;background:transparent;padding:11px 18px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit;border-bottom:3px solid transparent;margin-bottom:-2px}
.tab-strip button.active{color:var(--navy);font-weight:800;border-bottom-color:var(--red)}
.tab-pane{display:none}.tab-pane.active{display:block}

/* ===== search bar (shared: search & law-view) ===== */
.search-hero{background:var(--navy-2);padding:14px 0}
.sh-box{display:flex;gap:8px;max-width:920px;margin:0 auto;align-items:stretch}
.sh-box select{border:none;background:#fff;border-radius:8px;padding:0 14px;font-size:14px;color:var(--navy);font-weight:600;font-family:inherit;height:44px}
.sh-box .inp{flex:1;display:flex;background:#fff;border-radius:8px;overflow:hidden}
.sh-box .inp input{flex:1;border:none;padding:0 16px;font-size:15px;outline:none;font-family:inherit}
.sh-box .inp button{border:none;background:var(--red);color:#fff;width:60px;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.sh-box .adv{border:none;background:var(--gold);color:#3a2a05;font-weight:700;border-radius:8px;padding:0 16px;font-size:13.5px;cursor:pointer;font-family:inherit;white-space:nowrap;display:flex;align-items:center;justify-content:center}

/* ===== scope & field tabs (shared: search & law-view) ===== */
.scope-tabs{background:var(--navy);border-bottom:1px solid rgba(255,255,255,.1)}
.scope-tabs .wrap{display:flex;gap:2px}
.scope-tabs button,.scope-tabs a{border:none;background:transparent;color:#cdd8e6;font-size:13.5px;font-weight:600;padding:11px 22px;cursor:pointer;font-family:inherit;border-bottom:3px solid transparent;display:inline-flex;align-items:center}
.scope-tabs button:hover,.scope-tabs a:hover{color:#fff}
.scope-tabs button.active,.scope-tabs a.active{color:#fff;background:var(--blue);border-bottom-color:var(--gold);font-weight:700}

@media(max-width:1080px){.splitter{display:none}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
/* 가로 스와이프 컨테이너 (조건 ④: 가로 넘침은 스와이프로 처리) */
.x-swipe{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.x-swipe::-webkit-scrollbar{height:8px}
.x-swipe::-webkit-scrollbar-thumb{background:#c2cdd9;border-radius:4px}
.x-swipe::-webkit-scrollbar-track{background:#eef2f7;border-radius:4px}

/* ===== ① Utility ===== */
.utility{background:var(--navy);color:#cdd8e6;font-size:12.5px}
.utility .wrap{display:flex;align-items:center;justify-content:flex-end;gap:16px;height:38px}
.utility a:hover{color:#fff}
.lang-switch{position:relative;display:flex;align-items:center}
.lang-cur{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border:1px solid rgba(255,255,255,.28);border-radius:16px;background:rgba(255,255,255,.08);color:#e6eef7;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer}
.lang-cur:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.45);color:#fff}
.lang-cur .glb{width:14px;height:14px;flex:0 0 auto}
.lang-cur .cav{width:12px;height:12px;flex:0 0 auto;opacity:.8;transition:transform .18s}
.lang-switch.open .lang-cur .cav{transform:rotate(180deg)}
.lang-cur .code{letter-spacing:.04em}
.lang-menu{display:none;position:absolute;top:calc(100% + 7px);right:0;min-width:190px;background:#fff;border:1px solid #e3e8ef;border-radius:10px;box-shadow:0 12px 30px rgba(11,42,74,.22);padding:6px;z-index:220}
.lang-switch.open .lang-menu{display:block}
.lang-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;box-sizing:border-box;border:none;background:transparent;color:#41505e;font-family:inherit;font-size:13px;text-align:left;padding:9px 11px;border-radius:7px;cursor:pointer}
.lang-btn:hover{background:#f2f7fc;color:var(--blue)}
.lang-btn .ck{visibility:hidden;color:var(--blue);font-weight:700}
.lang-btn.active{color:var(--navy);font-weight:700}
.lang-btn.active .ck{visibility:visible}
.utility .divider{width:1px;height:14px;background:rgba(255,255,255,.2)}
.fontsize{display:flex;align-items:center;gap:4px}
.fontsize button{width:22px;height:22px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#cdd8e6;border-radius:5px;cursor:pointer;font-size:13px;line-height:1}
.fontsize button:hover{background:rgba(255,255,255,.12);color:#fff}
.fontsize .pct{min-width:42px;text-align:center}

/* ===== ② Header ===== */
.header{background:#fff;border-bottom:1px solid var(--line)}
.header .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.brand{display:flex;align-items:center;gap:14px}
.emblem{width:50px;height:50px;flex-shrink:0;object-fit:contain}
.brand-txt b{display:block;font-size:18px;font-weight:800;color:var(--navy);letter-spacing:-.3px}
.brand-txt .min{font-size:12px;color:var(--red);font-weight:700;margin-top:2px}
.brand-txt .djpp{display:block;font-size:11px;color:var(--muted);margin-top:1px}
/* 국법 기준: 서브페이지 헤더 내 컴팩트 검색 (로고 옆) */
.header-search{display:flex;align-items:center;height:44px}
.header-search input{width:330px;height:44px;border:2px solid var(--navy);border-right:none;border-radius:8px 0 0 8px;padding:0 14px;font-size:14px;outline:none;font-family:inherit;color:var(--txt)}
.header-search .hs-go{height:44px;width:46px;border:2px solid var(--navy);border-left:none;border-radius:0 8px 8px 0;background:#f5b301;color:#3a2c05;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.header-search .hs-go:hover{background:#3a9d5d;color:#fff}
.header-search .hs-adv{height:44px;display:flex;align-items:center;padding:0 16px;margin-left:14px;border:2px solid var(--navy);border-radius:8px;background:#f5b301;color:#3a2c05;font-weight:700;font-size:13px;white-space:nowrap;cursor:pointer;transition:background .15s,color .15s}
.header-search .hs-adv:hover{background:#3a9d5d;color:#fff}
.header-search-mini{display:flex;border:2px solid var(--navy);border-radius:24px;overflow:hidden;height:42px;width:340px}
.header-search-mini input{flex:1;border:none;padding:0 16px;font-size:14px;outline:none}
.header-search-mini button{border:none;background:var(--navy);color:#fff;width:48px;cursor:pointer;font-size:16px}
.wa-mark{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);border-radius:8px;padding:5px 10px;color:var(--muted);font-size:10px;line-height:1.25;text-align:center}
.wa-mark b{color:var(--blue);font-size:13px}

/* ===== ③ GNB ===== */
.gnb{background:var(--navy);box-shadow:0 1px 0 rgba(255,255,255,.04),0 6px 18px rgba(11,42,74,.16)}
.gnb .wrap{display:flex;align-items:stretch}
.gnb-home{display:flex;align-items:center;padding:0 18px;color:#fff;font-size:18px;border-right:1px solid rgba(255,255,255,.1)}
.gnb-home:hover{background:var(--blue)}
.gnb-menu{display:flex;flex:1}
.gnb-menu>li{position:relative}
.gnb-menu>li>a{display:flex;align-items:center;height:52px;padding:0 30px;color:#eaf0f7;font-size:15.5px;font-weight:600}
.gnb-menu>li.active>a{background:var(--blue);color:#fff;box-shadow:none}
.gnb-menu>li:hover>a{background:var(--blue);color:#fff;box-shadow:none}
/* 호버 밑줄: 드롭다운 위로 끊김 없이 표시 */
.gnb-menu>li>a{position:relative}
.gnb-menu>li:hover .submenu{border-top-color:var(--red)}
.submenu{display:none;position:absolute;top:52px;left:0;min-width:230px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--red);box-shadow:0 16px 32px rgba(11,42,74,.18);padding:8px 0;z-index:60}
.gnb-menu>li:hover .submenu{display:block}
.submenu li a{display:flex;justify-content:space-between;gap:12px;padding:9px 20px;font-size:13.5px;color:#3a4655}
.submenu li a:hover{background:var(--blue-soft);color:var(--blue)}
.submenu .tag{font-size:10.5px;color:#fff;background:var(--gold);border-radius:4px;padding:1px 7px;align-self:center}
.gnb-all{display:flex;align-items:center;gap:8px;padding:0 20px;color:#fff;font-size:14.5px;font-weight:600;cursor:pointer;border-left:1px solid rgba(255,255,255,.1)}
.gnb-all:hover{background:var(--blue)}
.allmenu-panel{display:none;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(0,0,0,.1)}
.allmenu-panel.open{display:block}
.allmenu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:26px 0 32px}
.allmenu-col h4{font-size:14.5px;color:var(--navy);font-weight:800;padding-bottom:9px;margin-bottom:7px;border-bottom:2px solid var(--navy)}
.allmenu-col li a{display:block;padding:6px 2px;font-size:13px;color:#4a5663}
.allmenu-col li a:hover{color:var(--blue);text-decoration:underline}

/* ===== badges ===== */
.badge{flex-shrink:0;font-size:11px;font-weight:700;color:#fff;border-radius:5px;padding:3px 8px;min-width:58px;text-align:center;display:inline-block}
.b-uu{background:var(--b-uu)}.b-pp{background:var(--b-pp)}.b-perpres{background:var(--b-perpres)}.b-permen{background:var(--b-permen)}.b-perda{background:var(--b-perda)}.b-mk{background:var(--b-mk)}.b-doc{background:var(--muted)}
.status-chip{font-size:11px;font-weight:700;border-radius:12px;padding:2px 10px;display:inline-block}
.st-current{background:#e6f4ea;color:#1e7e44}
.st-repealed{background:#fdeaea;color:#c8102e}
.st-amended{background:#e3f0ff;color:#1b58a6}

/* ===== breadcrumb ===== */
.crumb{background:#fff;border-bottom:1px solid var(--line)}
.crumb .wrap{display:flex;align-items:center;gap:8px;height:44px;font-size:12.5px;color:var(--muted)}
.crumb a:hover{color:var(--blue)}
.crumb .sep{color:#c2cad3}
.crumb .here{color:var(--navy);font-weight:700}

/* ===== shared card / section head ===== */
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 20px;box-shadow:var(--shadow-card)}
.sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;padding-bottom:11px;border-bottom:2px solid var(--navy)}
.sec-head h3{font-size:16.5px;font-weight:800;color:var(--navy);display:flex;align-items:center;gap:8px}
.sec-head h3::before{content:"";width:5px;height:17px;background:var(--red);border-radius:2px}
.more{font-size:12px;color:var(--muted)}.more:hover{color:var(--blue)}
.page-title{font-size:24px;font-weight:800;color:var(--navy);letter-spacing:-.5px}

/* ===== buttons ===== */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--txt);font-size:13px;padding:8px 14px;border-radius:8px;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--blue-soft);border-color:var(--blue);color:var(--blue)}
.btn-navy{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-navy:hover{background:var(--navy-2);color:#fff}
.btn-sm{padding:5px 10px;font-size:12px}

/* ===== law list (shared) ===== */
.law-list li a{display:flex;align-items:center;gap:10px;padding:10px 4px;border-bottom:1px dashed var(--line)}
.law-list li:last-child a{border-bottom:none}
.law-list li a:hover .ttl{color:var(--blue);text-decoration:underline}
.law-list .ttl{flex:1;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.law-list .org{font-size:12px;color:var(--muted);flex-shrink:0}
.law-list .date{font-size:12px;color:var(--muted);flex-shrink:0;min-width:80px;text-align:right}
.law-list .new{color:var(--red);font-size:10px;font-weight:700;margin-left:3px;vertical-align:top}

/* ===== Footer ===== */
.footer{background:#0a2138;color:#9fb2c6;margin-top:40px;padding:30px 0 26px;font-size:13px}
.footer .wrap{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.footer .flogo{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.footer .flogo b{color:#fff;font-size:15px}
.footer .flogo-txt{display:flex;flex-direction:column;line-height:1.35}
.footer .flogo-txt b{display:block}
.footer .flogo-txt .min{color:#c9b16a;font-size:12px;font-weight:700;margin-top:2px}
.footer .flogo-txt .djpp{color:#9fb2c6;font-size:11.5px;margin-top:1px}
.foot-links{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.foot-links a{color:#cdd8e6;font-size:12.5px}.foot-links a:hover{color:#fff}
.footer address{font-style:normal;line-height:1.7;color:#7e93a8;font-size:12.5px}
.foot-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.foot-right select{background:#13395f;color:#cdd8e6;border:1px solid #28486b;border-radius:7px;padding:8px 12px;font-size:12.5px;font-family:inherit}
.foot-right p{font-size:12px;color:#7e93a8;text-align:right}
.pilot-note{background:var(--gold);color:#3a2a05;font-size:11.5px;font-weight:700;text-align:center;padding:6px}

/* ===== tabs (generic) ===== */
.tab-strip{display:flex;border-bottom:2px solid var(--navy);flex-wrap:wrap}
.tab-strip button{border:none;background:transparent;padding:11px 18px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit;border-bottom:3px solid transparent;margin-bottom:-2px}
.tab-strip button.active{color:var(--navy);font-weight:800;border-bottom-color:var(--red)}
.tab-pane{display:none}.tab-pane.active{display:block}

/* ===== search bar (shared: search & law-view) ===== */
.search-hero{background:var(--navy-2);padding:14px 0}
.sh-box{display:flex;gap:8px;max-width:920px;margin:0 auto;align-items:stretch}
.sh-box select{border:none;background:#fff;border-radius:8px;padding:0 14px;font-size:14px;color:var(--navy);font-weight:600;font-family:inherit;height:44px}
.sh-box .inp{flex:1;display:flex;background:#fff;border-radius:8px;overflow:hidden}
.sh-box .inp input{flex:1;border:none;padding:0 16px;font-size:15px;outline:none;font-family:inherit}
.sh-box .inp button{border:none;background:var(--red);color:#fff;width:60px;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.sh-box .adv{border:none;background:var(--gold);color:#3a2a05;font-weight:700;border-radius:8px;padding:0 16px;font-size:13.5px;cursor:pointer;font-family:inherit;white-space:nowrap;display:flex;align-items:center;justify-content:center}

/* ===== scope & field tabs (shared: search & law-view) ===== */
.scope-tabs{background:var(--navy);border-bottom:1px solid rgba(255,255,255,.1)}
.scope-tabs .wrap{display:flex;gap:2px}
.scope-tabs button,.scope-tabs a{border:none;background:transparent;color:#cdd8e6;font-size:13.5px;font-weight:600;padding:11px 22px;cursor:pointer;font-family:inherit;border-bottom:3px solid transparent;display:inline-flex;align-items:center}
.scope-tabs button:hover,.scope-tabs a:hover{color:#fff}
.scope-tabs button.active,.scope-tabs a.active{color:#fff;background:var(--blue);border-bottom-color:var(--gold);font-weight:700}

@media(max-width:1080px){.splitter{display:none}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
/* 가로 스와이프 컨테이너 (조건 ④: 가로 넘침은 스와이프로 처리) */
.x-swipe{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.x-swipe::-webkit-scrollbar{height:8px}
.x-swipe::-webkit-scrollbar-thumb{background:#c2cdd9;border-radius:4px}
.x-swipe::-webkit-scrollbar-track{background:#eef2f7;border-radius:4px}

/* ===== ① Utility ===== */
.utility{background:var(--navy);color:#cdd8e6;font-size:12.5px}
.utility .wrap{display:flex;align-items:center;justify-content:flex-end;gap:16px;height:38px}
.utility a:hover{color:#fff}
.lang-switch{position:relative;display:flex;align-items:center}
.lang-cur{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border:1px solid rgba(255,255,255,.28);border-radius:16px;background:rgba(255,255,255,.08);color:#e6eef7;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer}
.lang-cur:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.45);color:#fff}
.lang-cur .glb{width:14px;height:14px;flex:0 0 auto}
.lang-cur .cav{width:12px;height:12px;flex:0 0 auto;opacity:.8;transition:transform .18s}
.lang-switch.open .lang-cur .cav{transform:rotate(180deg)}
.lang-cur .code{letter-spacing:.04em}
.lang-menu{display:none;position:absolute;top:calc(100% + 7px);right:0;min-width:190px;background:#fff;border:1px solid #e3e8ef;border-radius:10px;box-shadow:0 12px 30px rgba(11,42,74,.22);padding:6px;z-index:220}
.lang-switch.open .lang-menu{display:block}
.lang-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;box-sizing:border-box;border:none;background:transparent;color:#41505e;font-family:inherit;font-size:13px;text-align:left;padding:9px 11px;border-radius:7px;cursor:pointer}
.lang-btn:hover{background:#f2f7fc;color:var(--blue)}
.lang-btn .ck{visibility:hidden;color:var(--blue);font-weight:700}
.lang-btn.active{color:var(--navy);font-weight:700}
.lang-btn.active .ck{visibility:visible}
.utility .divider{width:1px;height:14px;background:rgba(255,255,255,.2)}
.fontsize{display:flex;align-items:center;gap:4px}
.fontsize button{width:22px;height:22px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#cdd8e6;border-radius:5px;cursor:pointer;font-size:13px;line-height:1}
.fontsize button:hover{background:rgba(255,255,255,.12);color:#fff}
.fontsize .pct{min-width:42px;text-align:center}

/* ===== ② Header ===== */
.header{background:#fff;border-bottom:1px solid var(--line)}
.header .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.brand{display:flex;align-items:center;gap:14px}
.emblem{width:50px;height:50px;flex-shrink:0;object-fit:contain}
.brand-txt b{display:block;font-size:18px;font-weight:800;color:var(--navy);letter-spacing:-.3px}
.brand-txt .min{font-size:12px;color:var(--red);font-weight:700;margin-top:2px}
.brand-txt .djpp{display:block;font-size:11px;color:var(--muted);margin-top:1px}
/* 국법 기준: 서브페이지 헤더 내 컴팩트 검색 (로고 옆) */
.header-search{display:flex;align-items:center;height:44px}
.header-search input{width:330px;height:44px;border:2px solid var(--navy);border-right:none;border-radius:8px 0 0 8px;padding:0 14px;font-size:14px;outline:none;font-family:inherit;color:var(--txt)}
.header-search .hs-go{height:44px;width:46px;border:2px solid var(--navy);border-left:none;border-radius:0 8px 8px 0;background:#f5b301;color:#3a2c05;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.header-search .hs-go:hover{background:#3a9d5d;color:#fff}
.header-search .hs-adv{height:44px;display:flex;align-items:center;padding:0 16px;margin-left:14px;border:2px solid var(--navy);border-radius:8px;background:#f5b301;color:#3a2c05;font-weight:700;font-size:13px;white-space:nowrap;cursor:pointer;transition:background .15s,color .15s}
.header-search .hs-adv:hover{background:#3a9d5d;color:#fff}
.header-search-mini{display:flex;border:2px solid var(--navy);border-radius:24px;overflow:hidden;height:42px;width:340px}
.header-search-mini input{flex:1;border:none;padding:0 16px;font-size:14px;outline:none}
.header-search-mini button{border:none;background:var(--navy);color:#fff;width:48px;cursor:pointer;font-size:16px}
.wa-mark{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);border-radius:8px;padding:5px 10px;color:var(--muted);font-size:10px;line-height:1.25;text-align:center}
.wa-mark b{color:var(--blue);font-size:13px}

/* ===== ③ GNB ===== */
.gnb{background:var(--navy);box-shadow:0 1px 0 rgba(255,255,255,.04),0 6px 18px rgba(11,42,74,.16)}
.gnb .wrap{display:flex;align-items:stretch}
.gnb-home{display:flex;align-items:center;padding:0 18px;color:#fff;font-size:18px;border-right:1px solid rgba(255,255,255,.1)}
.gnb-home:hover{background:var(--blue)}
.gnb-menu{display:flex;flex:1}
.gnb-menu>li{position:relative}
.gnb-menu>li>a{display:flex;align-items:center;height:52px;padding:0 30px;color:#eaf0f7;font-size:15.5px;font-weight:600}
.gnb-menu>li.active>a{background:var(--blue);color:#fff;box-shadow:none}
.gnb-menu>li:hover>a{background:var(--blue);color:#fff;box-shadow:none}
/* 호버 밑줄: 드롭다운 위로 끊김 없이 표시 */
.gnb-menu>li>a{position:relative}
.gnb-menu>li:hover .submenu{border-top-color:var(--red)}
.submenu{display:none;position:absolute;top:52px;left:0;min-width:230px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--red);box-shadow:0 16px 32px rgba(11,42,74,.18);padding:8px 0;z-index:60}
.gnb-menu>li:hover .submenu{display:block}
.submenu li a{display:flex;justify-content:space-between;gap:12px;padding:9px 20px;font-size:13.5px;color:#3a4655}
.submenu li a:hover{background:var(--blue-soft);color:var(--blue)}
.submenu .tag{font-size:10.5px;color:#fff;background:var(--gold);border-radius:4px;padding:1px 7px;align-self:center}
.gnb-all{display:flex;align-items:center;gap:8px;padding:0 20px;color:#fff;font-size:14.5px;font-weight:600;cursor:pointer;border-left:1px solid rgba(255,255,255,.1)}
.gnb-all:hover{background:var(--blue)}
.allmenu-panel{display:none;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(0,0,0,.1)}
.allmenu-panel.open{display:block}
.allmenu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:26px 0 32px}
.allmenu-col h4{font-size:14.5px;color:var(--navy);font-weight:800;padding-bottom:9px;margin-bottom:7px;border-bottom:2px solid var(--navy)}
.allmenu-col li a{display:block;padding:6px 2px;font-size:13px;color:#4a5663}
.allmenu-col li a:hover{color:var(--blue);text-decoration:underline}

/* ===== badges ===== */
.badge{flex-shrink:0;font-size:11px;font-weight:700;color:#fff;border-radius:5px;padding:3px 8px;min-width:58px;text-align:center;display:inline-block}
.b-uu{background:var(--b-uu)}.b-pp{background:var(--b-pp)}.b-perpres{background:var(--b-perpres)}.b-permen{background:var(--b-permen)}.b-perda{background:var(--b-perda)}.b-mk{background:var(--b-mk)}.b-doc{background:var(--muted)}
.status-chip{font-size:11px;font-weight:700;border-radius:12px;padding:2px 10px;display:inline-block}
.st-current{background:#e6f4ea;color:#1e7e44}
.st-repealed{background:#fdeaea;color:#c8102e}
.st-amended{background:#e3f0ff;color:#1b58a6}

/* ===== breadcrumb ===== */
.crumb{background:#fff;border-bottom:1px solid var(--line)}
.crumb .wrap{display:flex;align-items:center;gap:8px;height:44px;font-size:12.5px;color:var(--muted)}
.crumb a:hover{color:var(--blue)}
.crumb .sep{color:#c2cad3}
.crumb .here{color:var(--navy);font-weight:700}

/* ===== shared card / section head ===== */
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 20px;box-shadow:var(--shadow-card)}
.sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;padding-bottom:11px;border-bottom:2px solid var(--navy)}
.sec-head h3{font-size:16.5px;font-weight:800;color:var(--navy);display:flex;align-items:center;gap:8px}
.sec-head h3::before{content:"";width:5px;height:17px;background:var(--red);border-radius:2px}
.more{font-size:12px;color:var(--muted)}.more:hover{color:var(--blue)}
.page-title{font-size:24px;font-weight:800;color:var(--navy);letter-spacing:-.5px}

/* ===== buttons ===== */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--txt);font-size:13px;padding:8px 14px;border-radius:8px;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--blue-soft);border-color:var(--blue);color:var(--blue)}
.btn-navy{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-navy:hover{background:var(--navy-2);color:#fff}
.btn-sm{padding:5px 10px;font-size:12px}

/* ===== law list (shared) ===== */
.law-list li a{display:flex;align-items:center;gap:10px;padding:10px 4px;border-bottom:1px dashed var(--line)}
.law-list li:last-child a{border-bottom:none}
.law-list li a:hover .ttl{color:var(--blue);text-decoration:underline}
.law-list .ttl{flex:1;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.law-list .org{font-size:12px;color:var(--muted);flex-shrink:0}
.law-list .date{font-size:12px;color:var(--muted);flex-shrink:0;min-width:80px;text-align:right}
.law-list .new{color:var(--red);font-size:10px;font-weight:700;margin-left:3px;vertical-align:top}

/* ===== Footer ===== */
.footer{background:#0a2138;color:#9fb2c6;margin-top:40px;padding:30px 0 26px;font-size:13px}
.footer .wrap{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.footer .flogo{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.footer .flogo b{color:#fff;font-size:15px}
.footer .flogo-txt{display:flex;flex-direction:column;line-height:1.35}
.footer .flogo-txt b{display:block}
.footer .flogo-txt .min{color:#c9b16a;font-size:12px;font-weight:700;margin-top:2px}
.footer .flogo-txt .djpp{color:#9fb2c6;font-size:11.5px;margin-top:1px}
.foot-links{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.foot-links a{color:#cdd8e6;font-size:12.5px}.foot-links a:hover{color:#fff}
.footer address{font-style:normal;line-height:1.7;color:#7e93a8;font-size:12.5px}
.foot-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.foot-right select{background:#13395f;color:#cdd8e6;border:1px solid #28486b;border-radius:7px;padding:8px 12px;font-size:12.5px;font-family:inherit}
.foot-right p{font-size:12px;color:#7e93a8;text-align:right}
.pilot-note{background:var(--gold);color:#3a2a05;font-size:11.5px;font-weight:700;text-align:center;padding:6px}

/* ===== tabs (generic) ===== */
.tab-strip{display:flex;border-bottom:2px solid var(--navy);flex-wrap:wrap}
.tab-strip button{border:none;background:transparent;padding:11px 18px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit;border-bottom:3px solid transparent;margin-bottom:-2px}
.tab-strip button.active{color:var(--navy);font-weight:800;border-bottom-color:var(--red)}
.tab-pane{display:none}.tab-pane.active{display:block}

/* ===== search bar (shared: search & law-view) ===== */
.search-hero{background:var(--navy-2);padding:14px 0}
.sh-box{display:flex;gap:8px;max-width:920px;margin:0 auto;align-items:stretch}
.sh-box select{border:none;background:#fff;border-radius:8px;padding:0 14px;font-size:14px;color:var(--navy);font-weight:600;font-family:inherit;height:44px}
.sh-box .inp{flex:1;display:flex;background:#fff;border-radius:8px;overflow:hidden}
.sh-box .inp input{flex:1;border:none;padding:0 16px;font-size:15px;outline:none;font-family:inherit}
.sh-box .inp button{border:none;background:var(--red);color:#fff;width:60px;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.sh-box .adv{border:none;background:var(--gold);color:#3a2a05;font-weight:700;border-radius:8px;padding:0 16px;font-size:13.5px;cursor:pointer;font-family:inherit;white-space:nowrap;display:flex;align-items:center;justify-content:center}

/* ===== scope & field tabs (shared: search & law-view) ===== */
.scope-tabs{background:var(--navy);border-bottom:1px solid rgba(255,255,255,.1)}
.scope-tabs .wrap{display:flex;gap:2px}
.scope-tabs button,.scope-tabs a{border:none;background:transparent;color:#cdd8e6;font-size:13.5px;font-weight:600;padding:11px 22px;cursor:pointer;font-family:inherit;border-bottom:3px solid transparent;display:inline-flex;align-items:center}
.scope-tabs button:hover,.scope-tabs a:hover{color:#fff}
.scope-tabs button.active,.scope-tabs a.active{color:#fff;background:var(--blue);border-bottom-color:var(--gold);font-weight:700}

@media(max-width:1080px){
  .allmenu-grid{grid-template-columns:repeat(2,1fr)}
  .header .wrap{height:auto;padding:12px 24px;flex-wrap:wrap;gap:10px}
  /* 서브페이지 고정 헤더: 54px 고정 해제 → 검색바가 줄바꿈해도 GNB를 덮지 않도록 */
  [data-chrome="header"] .header .wrap{height:auto !important;row-gap:10px}
  /* 헤더 내 검색바를 한 줄 전체로 내리고 입력창은 가변폭 */
  .header-search-mini,.header-search{width:100%;order:3}
  .header-search input{width:auto;flex:1;min-width:0}
  /* GNB 가로 메뉴를 ‘전체메뉴’ 버튼으로 접기 (적은 폭에서 가로 넘침 방지) */
  .gnb-menu{display:none}
  /* 전체메뉴 버튼이 남은 폭을 모두 차지 (좁은 화면에서 눌리기 쉽게) */
  .gnb-all{margin-left:auto;flex:0 0 auto;justify-content:center;height:31px;min-height:0;padding:0 14px;gap:6px;font-size:14.5px;border-left:1px solid rgba(255,255,255,.1)}
  .gnb-home{padding:0 20px}
  [data-chrome="header"] .gnb-menu{display:none}
}
@media(max-width:640px){
  .wrap{padding:0 14px}
  .allmenu-grid{grid-template-columns:1fr;gap:14px;padding:18px 0 22px}
  .utility .wrap{gap:10px;flex-wrap:wrap;height:auto;padding-top:6px;padding-bottom:6px}
}

/* ===== 서브페이지(data-chrome 주입 헤더)는 처음부터 즐인 높이 유지 + sticky (홈은 정적 헤더라 미적용) ===== */
[data-chrome="header"]{position:fixed;top:0;left:0;right:0;width:100%;z-index:60;background:#fff;box-shadow:0 4px 14px rgba(11,42,74,.10)}
[data-chrome="header"] .gnb{position:static;box-shadow:none}
[data-chrome="header"] .header .wrap{height:54px}
[data-chrome="header"] .brand-txt .min,
[data-chrome="header"] .brand-txt .djpp{display:none}
[data-chrome="header"] .emblem{width:34px;height:34px}
[data-chrome="header"] .brand-txt b{font-size:15px}
[data-chrome="header"] .gnb-menu>li>a{height:42px}
[data-chrome="header"] .gnb-home,[data-chrome="header"] .gnb-all{font-size:13.5px}
.gnb-home svg{width:20px;height:20px}
/* 서브페이지 헤더: 검색바를 가운데 정렬 (데스크톱) */
@media(min-width:1081px){
  [data-chrome="header"] .header .wrap{position:relative;justify-content:flex-start}
  [data-chrome="header"] .header-search{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
}
[data-chrome="header"] .submenu{top:42px}
[data-chrome="header"] .allmenu-panel{position:absolute;left:0;right:0;top:100%}
.scope-tabs.sticky-bar{position:sticky;z-index:55}


/* ===== 법령 검색·조회 2단계 탭: 법령정보(.li-tabs)와 동일 디자인 ===== */
.scope-tabs{background:#fff;border-bottom:1px solid var(--line)}
.scope-tabs .wrap{display:flex;flex-wrap:wrap;gap:4px}
.scope-tabs button,.scope-tabs a{display:flex;align-items:center;gap:7px;border:none;background:transparent;padding:13px 18px;font-family:inherit;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap}
.scope-tabs button:hover,.scope-tabs a:hover{color:var(--blue);background:transparent}
.scope-tabs button.active,.scope-tabs a.active{color:var(--navy);font-weight:800;background:transparent;border-bottom-color:var(--red)}
@media(max-width:720px){.scope-tabs .wrap{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.scope-tabs button,.scope-tabs a{flex:none}}
