/* 한국철도표준규격(KRS) — 한국철도기술연구원 누리집(www.krri.re.kr) 디자인 체계에 맞춤
   글꼴: KRS Sans(= Pretendard 서브셋, OFL 개명본) 본문·제목 + S-Core Dream(버튼·탭·게시판 표), 자간 -0.06em(요소 글자크기 기준)
   색: 연구원 블루 #1161B6 · R&D 그라데이션 #004EA2→#2F81DB · 탭 청록 #0090B9 · 하이라이트 #00AEE0 · 버튼 #3987D7 · 푸터 #353B44
   ※ 웹 접근성(명도 대비 4.5:1)을 못 맞추는 값은 같은 계열에서 한 단계 진하게 조정:
      청록 #0090B9→#007FA3(4.60) · 버튼 #3987D7→#2B76C8(4.64) · 보조 회색 #888→#707070(4.95)
      흰 글자가 올라가는 그라데이션은 밝은 끝을 #2474CC(4.72)로, 서브비주얼은 방향을 뒤집어(위쪽 진함) 원색 유지 */

@font-face{font-family:"KRS Sans";font-weight:400;font-style:normal;font-display:swap;src:url("assets/font/KRSSans-Regular.woff") format("woff")}
@font-face{font-family:"KRS Sans";font-weight:500;font-style:normal;font-display:swap;src:url("assets/font/KRSSans-Medium.woff") format("woff")}
@font-face{font-family:"KRS Sans";font-weight:700;font-style:normal;font-display:swap;src:url("assets/font/KRSSans-Bold.woff") format("woff")}
@font-face{font-family:"SCoreDream";font-weight:400;font-style:normal;font-display:swap;src:url("assets/font/scdream4.woff") format("woff")}
@font-face{font-family:"SCoreDream";font-weight:600;font-style:normal;font-display:swap;src:url("assets/font/scdream6.woff") format("woff")}

:root{
  --ff:"KRS Sans","Malgun Gothic","맑은 고딕","Apple SD Gothic Neo",sans-serif;
  --ff-dream:"KRS Sans","Malgun Gothic","맑은 고딕","Apple SD Gothic Neo",sans-serif;   /* 2026-09-28: 첫 화면과 같은 한 글꼴로 통일 */
  --blue:#1161b6; --navy:#004ea2; --sky:#2f81db; --teal:#007fa3; --cyan:#00aee0;
  --btn:#0d3470; --btn-hover:#1161b6; --page-on:#071a3a;
  --deep:#071a3a; --ink:#1a1a1a; --line-soft:#eef0f3; --cyan-l:#7fd3f0;
  --txt:#111; --td:#424242; --sub:#585858; --muted:#707070;
  --line-strong:#1a1a1a; --line:#e1e1e1; --line-2:#cbcbcb; --th-bg:#f6f8fb; --th-sep:#818181;
  --input-bg:#fff; --input-line:#cfd5dd; --box-line:#cccccc;
  --bg-soft:#f3f8fd; --bg-soft-line:#d6e6f7;
  --ft:#10192b; --ft-txt:#aab4c5;
  --st-rev:#1161b6; --st-new:#007fa3; --st-chk:#6a55c8; --st-del:#707070;
  --grad-hero:linear-gradient(180deg,#040f24 0%,#0a2350 55%,#0d3470 100%);   /* 첫 화면 검색 영역과 같은 남색(2026-09-28) */
  --grad:#071a3a;                                                         /* 흰 글자 머리(대화상자) — 그라데이션 대신 단색 */
  --hl:linear-gradient(rgba(0,0,0,0) calc(100% - 8px),rgba(0,174,224,.4) 8px);   /* 연구원 목록 호버 형광 밑줄 */
}
*{box-sizing:border-box}
[hidden]{display:none!important}   /* display 를 지정한 요소(배너·공지 상세 등)도 hidden 이면 확실히 숨김 */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--txt);font:400 17px/1.6 var(--ff);word-break:keep-all;-webkit-font-smoothing:antialiased}
/* 연구원과 같은 자간 -0.06em 을 요소마다 제 글자크기 기준으로(상속되면 px 로 굳어 큰 제목이 덜 좁아짐) */
body *{letter-spacing:-0.06em}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--blue)}
img{max-width:100%;height:auto}
.wrap{max-width:1340px;margin:0 auto;padding:0 20px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:10px 16px;z-index:60}
.skip:focus{left:8px;top:8px}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
/* 어두운 바탕(헤더·서브비주얼·그라데이션 패널·대화상자 머리·푸터)에서는 흰 초점 테두리 */
.hd .logo:focus-visible,.hd .util a:focus-visible,.hd .gnb-d1:focus-visible,.menu-btn:focus-visible,.dlg-head :focus-visible,.hero :focus-visible,.ft :focus-visible{outline-color:#fff}
::placeholder{color:#6b6b6b;opacity:1}
main:focus,.panel:focus{outline:0}
main{scroll-margin-top:96px}   /* 본문 바로가기: 고정 헤더 아래로 */

/* ───────── 헤더 (서브비주얼 위 투명) ───────── */
.hd{position:fixed;top:0;left:0;right:0;z-index:50;color:#fff;transition:background .25s,box-shadow .25s}
.hd.solid,.hd.open{background:var(--deep);box-shadow:0 6px 20px rgba(0,0,0,.18)}
@media (min-width:1025px){.hd.solid .hd-in{height:86px;padding-top:4px}.hd.solid .util{display:none}}
/* 로고 PNG 는 KRRI 심벌이 위로 솟아 있고 한글 워드마크는 아래쪽(36px 중 14~34px)에 있다.
   상자 중심끼리 맞추면 옆 글자가 워드마크보다 6px 떠 보이므로(실측), 사이트명·GNB 를 워드마크 중심선으로 내린다.
   로고 폭에 비례: 228px→6px, 190px→5px, 150px→4px */
.hd-in{--wm-shift:6px;position:relative;display:flex;align-items:center;gap:28px;height:110px;padding-top:18px}
.logo{display:flex;align-items:center;gap:16px;color:#fff;text-decoration:none;flex:none}
.logo img{width:228px;height:auto;display:block}
.logo .site{position:relative;top:var(--wm-shift);font-size:20px;font-weight:700;padding-left:16px;border-left:1px solid rgba(255,255,255,.45);line-height:1.1;white-space:nowrap}
.gnb{position:relative;top:var(--wm-shift);margin-left:auto}
.gnb-list{display:flex;margin:0;padding:0;list-style:none}
.gnb-item{position:relative}
.gnb-d1{position:relative;display:block;padding:12px 22px;color:#fff;text-decoration:none;font-size:21px;font-weight:700;white-space:nowrap}
.gnb-d1::after{content:"";position:absolute;left:22px;right:22px;bottom:4px;height:3px;border-radius:2px;background:#fff;transform:scaleX(0);transition:transform .2s}
.gnb-item:hover .gnb-d1::after,.gnb-item:focus-within .gnb-d1::after,.gnb-item.on .gnb-d1::after{transform:scaleX(1)}
/* 2차 메뉴: 마우스 올림·키보드 초점 시 펼침 */
.gnb-sub{position:absolute;left:50%;top:100%;min-width:210px;margin:0;padding:10px 0;list-style:none;background:#fff;border-radius:12px;box-shadow:0 14px 34px rgba(0,30,70,.22);transform:translate(-50%,8px);opacity:0;visibility:hidden;transition:opacity .15s,transform .15s,visibility .15s;z-index:30}
.gnb-item:hover .gnb-sub,.gnb-item:focus-within .gnb-sub{opacity:1;visibility:visible;transform:translate(-50%,0)}
.gnb-sub a{display:block;padding:9px 22px;color:#222;text-decoration:none;font-size:16px;font-weight:500;white-space:nowrap}
.gnb-sub a:hover,.gnb-sub a:focus-visible{background:var(--bg-soft);color:var(--blue)}
.gnb-sub a[aria-current="page"]{color:var(--blue);font-weight:700}
/* 마지막 메뉴의 2차 메뉴는 오른쪽 끝에 맞춤 — 가운데 정렬이면 숨겨진 상태에서도 화면 밖으로 나가 가로 스크롤이 생김(1025~1395px) */
@media (min-width:1025px){
  .gnb-item:last-child .gnb-sub{left:auto;right:0;transform:translateY(8px)}
  .gnb-item:last-child:hover .gnb-sub,.gnb-item:last-child:focus-within .gnb-sub{transform:translateY(0)}
}
.gnb-ext{display:none}
/* 메뉴가 로고에 닿을 때(app.js fitGnb — CMS 가 메뉴를 늘린 경우) 글자·여백을 한 단계 줄임 */
@media (min-width:1025px){
  .hd.gnb-tight .gnb-d1{padding-left:9px;padding-right:9px;font-size:16px}
  .hd.gnb-tight .gnb-d1::after{left:9px;right:9px}
  /* 2차 메뉴가 화면 밖으로 나가면(app.js fitGnb) 그룹 오른쪽·왼쪽 끝에 맞춤 */
  .gnb-item.sub-r .gnb-sub{left:auto;right:0;transform:translateY(8px)}
  .gnb-item.sub-l .gnb-sub{left:0;right:auto;transform:translateY(8px)}
  .gnb-item.sub-r:hover .gnb-sub,.gnb-item.sub-r:focus-within .gnb-sub,.gnb-item.sub-l:hover .gnb-sub,.gnb-item.sub-l:focus-within .gnb-sub{transform:translateY(0)}
}
.util{position:absolute;top:10px;right:20px;display:flex;gap:18px;margin:0;padding:0;list-style:none;font-size:13px;font-weight:500}
.util a{color:rgba(255,255,255,.9);text-decoration:none}
.util a:hover{color:#fff;text-decoration:underline}
.menu-btn{display:none}

/* ───────── 서브 비주얼 + 경로(탭) 막대 ───────── */
.sub-top{position:relative;background:var(--grad-hero);color:#fff;padding-top:110px}
.sub-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}
.sub-in{position:relative;text-align:center;padding-top:34px;padding-bottom:78px}
/* 넓은 자간은 마지막 글자 뒤에도 붙어 가운데가 왼쪽으로 쏠리므로 같은 만큼 왼쪽 여백으로 상쇄 */
.eyebrow{margin:0 0 6px;padding-left:.42em;font-size:14px;font-weight:500;letter-spacing:.42em;text-transform:uppercase;color:var(--cyan-l)}
.sub-title{margin:0;font-size:40px;font-weight:700;line-height:1.3}
.sub-desc{margin:8px 0 0;font-size:17px}
.path-wrap{position:relative;z-index:10}
.path{display:flex;align-items:stretch;min-height:60px;background:#fff;color:var(--txt);box-shadow:0 6px 18px rgba(0,20,50,.08)}
.path-home{display:flex;align-items:center;gap:8px;padding:0 26px;border-right:1px solid var(--line-2);color:var(--txt);text-decoration:none;font-size:15px;font-weight:500}
.path-dd{position:relative;border-right:1px solid var(--line-2)}
.path-btn{display:flex;align-items:center;justify-content:space-between;gap:18px;height:100%;min-width:180px;padding:0 22px 0 26px;border:0;background:none;font-size:17px;cursor:pointer;color:var(--txt)}
.path-btn::after{content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .15s}
.path-btn[aria-expanded="true"]::after{transform:translateY(1px) rotate(-135deg)}
.path-dd.cur .path-btn{font-weight:700;color:var(--blue);min-width:240px}
.path-panel{position:absolute;left:-1px;right:-1px;top:100%;margin:0;padding:6px 0;list-style:none;background:#fff;border:1px solid var(--line-2);box-shadow:0 10px 24px rgba(0,30,70,.12);z-index:25}
.path-panel a{display:block;padding:9px 26px;color:#222;text-decoration:none;font-size:16px}
.path-panel a:hover,.path-panel a:focus-visible{background:var(--bg-soft);color:var(--blue)}
.path-panel a[aria-current="page"]{color:var(--blue);font-weight:700}
/* 바로가기(기존 누리집의 주요 바로가기) — 경로 막대 오른쪽
   넓은 화면: [아이콘 18px + 글자 14px] 한 줄 칩(경로 막대 글자와 같은 흐름) · 1024 이하: 막대 아래 균등 칸 · 720 이하: 3열 타일
   아이콘은 같은 선 굵기(2px)의 윤곽선 한 벌 — 채움 아이콘이 섞여 크기·무게가 달라 보이던 문제 해소
   새 창 링크는 글자 뒤 작은 화살표(구석에 떠 있던 ↗ 대신) */
.quick{display:flex;align-items:center;margin-left:auto;padding:0 6px}
.qi{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;height:42px;padding:0 10px;border-radius:8px;color:#333;text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap;transition:background .15s,color .15s}
.qi::before{content:"";flex:none;width:18px;height:18px;background:var(--blue);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.qi:hover,.qi:focus-visible{background:var(--bg-soft);color:var(--blue)}
.qi.ext::after{content:"";flex:none;width:9px;height:9px;margin-left:-3px;background:var(--muted);-webkit-mask:var(--ic-ext) center/contain no-repeat;mask:var(--ic-ext) center/contain no-repeat}
.qi.ext:hover::after,.qi.ext:focus-visible::after{background:var(--blue)}
.qi{--ic-ext:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18 18 6M8 6h10v10'/%3E%3C/svg%3E")}
.qi-recent{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3.2 2'/%3E%3C/svg%3E")}
.qi-english{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5h9M7.5 3v2M10.5 5c-.8 3.8-3 6.6-6.5 8.5M5.5 8.5c1.2 2 2.8 3.5 5 4.5M12 21l4.5-10 4.5 10M13.8 17h5.4'/%3E%3C/svg%3E")}
.qi-committee{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2.5 20c0-3.6 2.9-6 6.5-6s6.5 2.4 6.5 6M16 4.6a3.5 3.5 0 0 1 0 6.8M18.5 14.3c1.8.8 3 2.9 3 5.7'/%3E%3C/svg%3E")}
.qi-law{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5V21M8 21h8M4.5 7h15M4.5 7 2 14c.7 1 1.6 1.5 2.5 1.5S6.3 15 7 14ZM19.5 7 17 14c.7 1 1.6 1.5 2.5 1.5S21.3 15 22 14Z'/%3E%3C/svg%3E")}
.qi-ks{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H6.5A1.5 1.5 0 0 0 5 4.5v15A1.5 1.5 0 0 0 6.5 21h11a1.5 1.5 0 0 0 1.5-1.5V8ZM14 3v5h5M9 13h6M9 17h6'/%3E%3C/svg%3E")}
.qi-link{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.4 2.5 3.6 5.5 3.6 9s-1.2 6.5-3.6 9c-2.4-2.5-3.6-5.5-3.6-9S9.6 5.5 12 3Z'/%3E%3C/svg%3E")}
.qi-search{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E")}
.qi-notice,.qi-intro,.qi-proc{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H8.5L4 20ZM8 9h8M8 12.5h5'/%3E%3C/svg%3E")}

/* ───────── 임시 알림 배너(선택) ───────── */
.banner{display:grid;grid-template-columns:auto 1fr;gap:16px;margin:36px 0 0;padding:20px 24px;background:var(--bg-soft);border:1px solid var(--bg-soft-line);border-radius:2px}
.banner.warn{background:#fff7ea;border-color:#f5d49a}
.banner .ico{width:40px;height:40px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font:600 20px/1 var(--ff-dream)}
.banner.warn .ico{background:#9a4a00}
.banner h2{margin:2px 0 4px;font-size:18px;color:var(--blue)}
.banner.warn h2{color:#7a2e00}
.banner p{margin:0;color:#333;white-space:pre-line}

/* ───────── 섹션 공통 ───────── */
.panel{max-width:1340px;margin:0 auto;padding:70px 20px 100px;scroll-margin-top:96px}
.js .panel[hidden]{display:none}
.tit{margin:0 0 12px;font-size:32px;font-weight:700;line-height:1.35;letter-spacing:-.05em;color:var(--ink)}
.lead{color:var(--sub);margin:0 0 40px;max-width:920px;font-size:17px}
.sec-tit{margin:0 0 14px;font-size:21px;font-weight:700;color:var(--ink)}
.note{font-size:16px;color:var(--sub);margin:14px 0 0}
.hint{font-size:15px;color:var(--muted);margin:18px 0 0}
.empty{text-align:center;color:var(--sub);padding:44px 10px!important;height:auto!important}
.na{font-size:15px;color:var(--muted)}

/* 분류·연도 탭 — 알약 대신 밑줄 탭(첫 화면 알림 탭과 같은 결) */
.tab-btns{display:flex;flex-wrap:wrap;margin:0 0 30px;border-bottom:1px solid var(--line)}
.tab-btns button{position:relative;border:0;background:none;padding:12px 18px;font:600 17px/1.3 var(--ff);color:#6b7280;cursor:pointer;transition:color .15s}
.tab-btns button:hover{color:var(--ink)}
.tab-btns button[aria-pressed="true"]{color:var(--ink)}
.tab-btns button[aria-pressed="true"]::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:3px;background:var(--blue)}
.tab-btns em{font-style:normal;font-weight:400;margin-left:5px;color:var(--muted)}
.tab-btns button[aria-pressed="true"] em{color:var(--blue)}

/* 게시판 상단: Total + 검색 (연구원 board_top) */
.board-top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.board-info{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.total{margin:0;font-size:17px;color:#333}
.total b{color:var(--ink)}
.total b{font-weight:700}
.total .sum{color:var(--muted);font-size:16px;margin-left:8px}
.chk{display:flex;align-items:center;gap:6px;font-size:16px;color:var(--sub);cursor:pointer}
.chk input{width:17px;height:17px;accent-color:var(--blue);margin:0}
.board-search{display:flex;gap:6px;flex-wrap:wrap}
.board-search select,.board-search input{height:42px;border:1px solid var(--input-line);background-color:var(--input-bg);border-radius:2px;padding:0 13px;font-family:var(--ff-dream);font-size:16px;color:#222}
.board-search select{padding-right:30px;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#555 50%),linear-gradient(135deg,#555 50%,transparent 50%);background-position:calc(100% - 16px) 18px,calc(100% - 11px) 18px;background-size:5px 5px;background-repeat:no-repeat}
.board-search input{width:300px;max-width:100%}
.board-search input:focus,.board-search select:focus{border-color:var(--btn);background-color:#fff;outline:0;box-shadow:0 0 0 2px rgba(43,118,200,.25)}
.btn-sky{height:42px;min-width:70px;border:1px solid var(--btn);background:var(--btn);color:#fff;border-radius:2px;padding:0 18px;font:400 16px/1 var(--ff-dream);cursor:pointer}
.btn-sky:hover{background:var(--btn-hover);border-color:var(--btn-hover)}
.btn-line{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 22px;border:1px solid var(--line-strong);background:#fff;color:#222;text-decoration:none;font:400 16px/1 var(--ff-dream)}
.btn-line:hover{border-color:var(--blue);color:var(--blue)}
.btn-line.sm{height:34px;padding:0 14px;font-size:15px}

/* 연구원 board_list 표: 상단선 #606060 · 머리 #F1F1F1(열 구분선 #818181) · 행선 #E1E1E1 · 18px */
table.board{width:100%;border-collapse:collapse;border-top:2px solid var(--line-strong);font-family:var(--ff);font-size:17px}
table.board thead tr{background:var(--th-bg);border-bottom:1px solid var(--line)}
table.board th{position:relative;height:52px;padding:0 10px;font-size:16px;font-weight:700;color:var(--ink);text-align:center;white-space:nowrap}
table.board th+th::before{content:none}
table.board tbody tr{border-bottom:1px solid var(--line);transition:background .12s}
table.board tbody tr:hover{background:#f7fafd}
table.board td{height:60px;padding:10px;color:var(--td);text-align:center;vertical-align:middle}
.list-tbl col.c-no{width:190px}.list-tbl col.c-cls{width:160px}.list-tbl col.c-date{width:125px}.list-tbl col.c-st{width:92px}.list-tbl col.c-pdf{width:118px}
.list-tbl td:nth-child(2),.en-tbl td:nth-child(2),.ks-tbl td:nth-child(2),.nt-tbl td:nth-child(2),.cm-tbl td.cm-sum{text-align:left}
td.no{white-space:nowrap;color:#222;letter-spacing:-0.02em}
td.c{white-space:nowrap}
td .en{display:block;margin-top:2px;font-family:var(--ff);font-size:15px;color:var(--muted)}
tr.del td{color:var(--muted)}
.name-btn{border:0;background:none;padding:0;margin:0;font:inherit;color:#222;text-align:left;cursor:pointer}
/* 연구원 목록의 형광 밑줄: 두 줄로 넘어가는 규격명도 줄마다 칠해지도록 안쪽 span 에 적용 */
.nm{-webkit-box-decoration-break:clone;box-decoration-break:clone}
.name-btn:hover .nm,.name-btn:focus-visible .nm,.nt-a:hover .nm,.nt-a:focus-visible .nm{background-image:var(--hl);color:#000}
tr.del .name-btn{color:var(--muted)}
.st{display:inline-block;font:700 15px/1.5 var(--ff);white-space:nowrap}   /* 테두리 알약 대신 글자색만(첫 화면 고시 목록과 같게) */
.st-개정{color:var(--st-rev)} .st-제정{color:var(--st-new)} .st-확인{color:var(--st-chk)} .st-폐지{color:var(--st-del)}
.st-공지{color:#b54708}
.pdf{display:inline-flex;align-items:center;justify-content:center;height:34px;padding:0 13px;border:1px solid var(--btn);border-radius:2px;color:var(--btn);background:#fff;font:400 15px/1 var(--ff-dream);text-decoration:none;white-space:nowrap}
.pdf:hover{background:var(--btn);color:#fff}

/* 연구원 paginate: 39px 칸·1px #ccc 테두리·KRS Sans 20px/500, 현재 쪽 2px #3E5CBD */
.paginate{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px;margin-top:40px}
.paginate button{position:relative;width:39px;height:39px;padding:0;border:1px solid var(--box-line);background:#fff;font:500 18px/1 var(--ff);letter-spacing:0;color:#333;cursor:pointer}
.paginate button:hover{border-color:var(--page-on);color:var(--page-on)}
.paginate button[aria-current="page"]{border:1px solid var(--page-on);background:var(--page-on);color:#fff;font-weight:700}
/* 처음·이전·다음·마지막: CSS 꺾쇠(좌·하 테두리 상자를 회전) */
.paginate .arrow::before,.paginate .arrow::after{content:"";position:absolute;top:50%;left:50%;width:7px;height:7px;margin:-5px 0 0 -1.75px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.paginate .arrow.next::before,.paginate .arrow.next::after,.paginate .arrow.last::before,.paginate .arrow.last::after{margin-left:-6.75px;transform:rotate(-135deg)}
.paginate .arrow.prev::after,.paginate .arrow.next::after{display:none}
.paginate .arrow.first::before{margin-left:-4.75px}.paginate .arrow.first::after{margin-left:1.25px}
.paginate .arrow.last::before{margin-left:-9.75px}.paginate .arrow.last::after{margin-left:-3.75px}
.paginate button:disabled{opacity:.35;cursor:default}
.paginate button:disabled:hover{border-color:var(--box-line);color:#333}

/* ───────── 최근 제·개정 ───────── */
.stat-row{display:flex;flex-wrap:wrap;gap:10px 22px;margin:-14px 0 36px;font-size:17px;color:#333}
.stat-total{font-weight:700;color:#000}
.rc-group{margin-top:42px}
.rc-head{display:flex;align-items:baseline;gap:6px;margin:0 0 12px;font-size:21px;font-weight:700;color:var(--ink)}
.rc-head time{font-family:var(--ff-dream);font-weight:600;letter-spacing:-0.02em}
.rc-n{margin-left:8px;font-size:16px;font-weight:500;color:var(--sub)}
.rc-tbl col.c-no{width:190px}.rc-tbl col.c-cls{width:160px}.rc-tbl col.c-st{width:92px}.rc-tbl col.c-pdf{width:118px}

/* ───────── 영문화규격·KS·공지 표 ───────── */
.en-tbl col.c-no{width:220px}.en-tbl col.c-date{width:130px}.en-tbl col.c-pdf{width:120px}
.en-t{display:block;color:#222}
.ko-link{display:inline-block;margin-top:3px;font-family:var(--ff);font-size:15px;color:var(--blue)}
.ko-link .nm{text-decoration:underline;text-decoration-color:rgba(17,97,182,.35);text-underline-offset:3px}
.ks-tbl col.c-no{width:170px}.ks-tbl col.c-date{width:170px}
.nt-tbl col.c-num{width:90px}.nt-tbl col.c-att{width:80px}.nt-tbl col.c-date{width:130px}
.nt-a{color:#222;text-decoration:none}
tr.pin{background:#f7fafd}
.att{display:inline-flex;align-items:center;gap:3px;font:400 14px/1 var(--ff-dream);color:var(--sub)}
.att::before{content:"";width:12px;height:14px;background:var(--sub);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.5 6v11.5a4.5 4.5 0 0 1-9 0V5a3 3 0 0 1 6 0v10.5a1.5 1.5 0 0 1-3 0V6H9v9.5a3 3 0 0 0 6 0V5a4.5 4.5 0 0 0-9 0v12.5a6 6 0 0 0 12 0V6Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.5 6v11.5a4.5 4.5 0 0 1-9 0V5a3 3 0 0 1 6 0v10.5a1.5 1.5 0 0 1-3 0V6H9v9.5a3 3 0 0 0 6 0V5a4.5 4.5 0 0 0-9 0v12.5a6 6 0 0 0 12 0V6Z'/%3E%3C/svg%3E") center/contain no-repeat}
.ks-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:0 0 40px;padding:24px 28px;border-top:2px solid var(--ink);background:#f6f8fb;color:var(--ink)}
.ks-cta b{display:block;font-size:21px}
.ks-cta span{font-size:16px;color:var(--sub)}
.btn-go{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 24px;border-radius:2px;background:var(--deep);color:#fff;text-decoration:none;font:600 17px/1 var(--ff-dream)}
.btn-go::after{content:"";width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.btn-go:hover{background:var(--blue)}

/* ───────── 심의위원회 ───────── */
.cm-tbl col.c-year{width:90px}.cm-tbl col.c-round{width:90px}.cm-tbl col.c-date{width:130px}.cm-tbl col.c-name{width:260px}.cm-tbl col.c-pdf{width:120px}
.cm-tbl td.cm-name{color:#222}
.cm-tbl td.cm-sum{white-space:pre-line;font-family:var(--ff);font-size:17px}

/* ───────── 법령정보 ───────── */
.law-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 44px;align-items:start}
.law-card{border-top:2px solid var(--ink);padding:22px 2px 6px}
.law-card:first-child{grid-column:1 / -1}
.law-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.law-head h3{margin:0;font-size:21px;font-weight:700;color:var(--ink)}
.law-card .note{margin:8px 0 4px;font-size:15px}
.law-sec{margin:18px 0 6px;font-size:17px;font-weight:700;color:#222}
.law-sec.solo{margin-bottom:0;padding-bottom:8px;border-bottom:1px solid var(--line)}   /* 편 이름 = 기준 이름인 편: 소제목 자체가 링크 */
.law-sec.solo .law-a{font-weight:700}
.law-list{list-style:none;margin:0;padding:0}
.law-card:first-child .law-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}
.law-list li{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--line)}
.law-card:first-child .law-list li{border:0;padding:0}
.law-card:first-child .law-a{display:flex;align-items:center;justify-content:space-between;width:100%;padding:15px 16px;border:1px solid var(--line);border-radius:2px;background:#fff;font-weight:600}
.law-kind{flex:none;min-width:58px;padding:1px 6px;border-radius:4px;background:#eef3f9;font-size:12px;color:var(--navy);text-align:center}
.law-card:first-child .law-kind{display:none}
.law-a{color:#222;text-decoration:none;overflow-wrap:anywhere}   /* '형식승인ㆍ제작자승인ㆍ완성검사' 같은 긴 낱말도 좁은 화면에서 줄바꿈 */
.law-a::after{content:"↗";margin-left:6px;font-size:13px;color:var(--muted)}
.law-a:hover{color:var(--blue);text-decoration:underline}

/* ───────── 공지 상세 ───────── */
.nt-view{border-top:1px solid var(--line-strong)}
.nt-v-head{padding:26px 20px;border-bottom:1px solid var(--line);background:var(--th-bg)}
.nt-v-head h3{margin:0;font-size:24px;font-weight:700;line-height:1.4}
.nt-v-meta{margin:8px 0 0;font-size:16px;color:var(--sub)}
.nt-v-meta span{font-weight:700;margin-right:6px}
.nt-v-body{padding:32px 20px;font-size:17px;line-height:1.8;color:#222;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.nt-v-body p{margin:0 0 16px}
.nt-v-files{padding:18px 20px;border-bottom:1px solid var(--line)}
.nt-v-files h4{margin:0 0 8px;font-size:17px}
.nt-v-files ul{list-style:none;margin:0;padding:0}
.nt-v-files li{display:flex;align-items:center;gap:10px;padding:5px 0}
.nt-v-files .file{color:var(--blue);word-break:break-all}
.nt-v-files .file.wait{color:#444}
.nt-v-files .hint{margin-top:10px}
.nt-v-files .size{flex:none;font-size:14px;color:var(--muted);white-space:nowrap}
.nt-v-foot{display:flex;justify-content:flex-end;margin-top:22px}

/* ───────── 관련 사이트 ───────── */
.rel-group+.rel-group{margin-top:40px}
.links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.links a{position:relative;display:block;padding:16px 40px 16px 18px;border:1px solid var(--line);border-radius:2px;background:#fff;color:var(--txt);text-decoration:none;transition:border-color .15s}
.links a::after{content:"";position:absolute;right:20px;top:50%;width:9px;height:9px;border-top:2px solid var(--blue);border-right:2px solid var(--blue);transform:translateY(-50%) rotate(45deg)}
.links a:hover{border-color:var(--blue)}
.links b{display:block;font-size:17px}
.links span{font-size:14px;color:var(--sub);word-break:break-all}

/* ───────── KRS 소개 ───────── */
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:20px}   /* min(): 320px 창+스크롤바(305px)에서도 칸이 넘치지 않게 */
.card{border-top:2px solid var(--ink);padding:22px 2px 6px;background:#fff}
.card h3{margin:0 0 10px;font-size:22px;font-weight:700;color:var(--ink)}
.card p{margin:0;color:#333;font-size:18px}
.card-grad{border-top-color:var(--blue)}
.card-grad h3{color:var(--blue)}
.law-box{margin-top:36px;padding:24px 28px;border-left:3px solid var(--blue);background:#f6f8fb}
.law-box ul{margin:0;padding-left:20px}
.law-box li{margin:3px 0}
.cls{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:0 28px;align-items:start}
.cls .card{padding:22px 2px 10px}
.cls .card h3{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.cls .card h3 span{font:700 26px/1 var(--ff);color:var(--blue);letter-spacing:-0.02em}
.cls ul{list-style:none;margin:10px 0 0;padding:0}
.cls li{display:grid;grid-template-columns:46px 1fr auto;gap:8px;align-items:center;padding:11px 0;border-top:1px solid var(--line);font-size:17px}
.cls li code{font:500 14px/1 var(--ff);color:#6b7280;letter-spacing:.04em}
.cls li small{display:block;font-size:13px;color:var(--muted)}
.cls li a{font:600 16px/1 var(--ff-dream);text-decoration:none;color:var(--blue)}
.cls li a:hover{background-image:var(--hl)}
.parts{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line)}
.parts li{display:grid;grid-template-columns:70px 1fr;gap:16px;align-items:start;padding:22px 4px}
.parts li+li{border-top:1px solid var(--line)}
.parts li>span{font:700 24px/1 var(--ff);color:var(--blue);letter-spacing:-0.02em;padding-top:2px;font-variant-numeric:tabular-nums}
.parts b{display:block;font-size:19px;font-weight:700}
.parts p{margin:4px 0 0;color:var(--sub)}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;counter-reset:s}
.steps li{position:relative;padding:20px 2px 4px;border-top:3px solid var(--line)}
.steps li:first-child{border-top-color:var(--blue)}
.steps li::before{counter-increment:s;content:"STEP 0" counter(s);display:block;margin-bottom:8px;font:700 14px/1 var(--ff);letter-spacing:.06em;color:var(--blue)}
.steps li:not(:last-child)::after{content:"";position:absolute;right:-19px;top:-7.5px;width:8px;height:8px;border-top:2px solid #9aa0a8;border-right:2px solid #9aa0a8;transform:rotate(45deg)}
.steps b{display:block;font-size:20px;margin-bottom:6px}
/* 단계 수가 4가 아닐 때(CMS 편집) 넓은 화면의 열 수 — app.js 가 data-n 을 붙임 */
@media (min-width:1025px){
  .steps[data-n="1"]{grid-template-columns:1fr}
  .steps[data-n="2"]{grid-template-columns:repeat(2,1fr)}
  .steps[data-n="3"]{grid-template-columns:repeat(3,1fr)}
  .steps[data-n="5"]{grid-template-columns:repeat(5,1fr)}
  .steps[data-n="6"]{grid-template-columns:repeat(6,1fr)}
}
.steps p{margin:0;color:var(--sub);font-size:16px}
.qa{margin-top:44px}
.qa .sec-tit{font-size:19px;margin:28px 0 6px}
.qa p{margin:0;color:#333}

/* ───────── 상세·이력 대화상자 ───────── */
dialog{width:min(860px,calc(100vw - 32px));max-height:calc(100vh - 48px);border:0;border-radius:6px;padding:0;color:var(--txt);box-shadow:0 24px 70px rgba(0,30,70,.35)}
dialog::backdrop{background:rgba(0,20,50,.5)}
.dlg-head{display:flex;justify-content:space-between;gap:12px;padding:26px 30px 20px;background:var(--grad);color:#fff;position:sticky;top:0;z-index:1}
.dlg-no{margin:0;font:400 15px/1.4 var(--ff-dream);letter-spacing:-0.02em}
.dlg-head h2{margin:4px 0 0;font-size:24px;font-weight:700;line-height:1.35}
.dlg-en{margin:2px 0 0;font-size:15px}
/* 닫기(×): 밝은 바탕을 얹으면 흰 글자 대비가 4.5:1 아래로 떨어지므로 어둡게 얹음 */
.dlg-x{flex:none;width:42px;height:42px;border:1px solid rgba(255,255,255,.5);background:rgba(0,0,0,.12);border-radius:50%;font-size:22px;line-height:1;color:#fff;cursor:pointer}
.dlg-x:hover{background:rgba(0,0,0,.26)}
.dlg-body{padding:10px 30px 26px}
.dlg-body .sec-tit{font-size:18px;margin:22px 0 10px}
.info{display:grid;grid-template-columns:max-content 1fr;margin:0;border-top:1px solid var(--line-strong);font-size:16px}
.info dt,.info dd{padding:11px 14px;border-bottom:1px solid var(--line)}
.info dt{background:var(--th-bg);font-weight:600;color:#222;font-family:var(--ff-dream)}
.info dd{margin:0;color:#333}
table.hist{font-size:16px}
table.hist th{height:46px;font-size:16px}
table.hist td{height:50px;padding:8px}
table.hist tr.cur td{background:#eaf3fc}
.memo-btn{height:30px;padding:0 12px;border:1px solid #bbb;background:#fff;color:#333;font:400 14px/1 var(--ff-dream);cursor:pointer;white-space:nowrap}
.memo-btn:hover{border-color:var(--btn);color:var(--btn)}
dialog.memo-dlg{width:min(640px,calc(100vw - 32px))}
.memo-box{white-space:pre-wrap;background:var(--input-bg);border:1px solid var(--line);padding:16px 18px;min-height:130px;max-height:50vh;overflow:auto;font-size:16px;line-height:1.75;margin-top:16px;color:#333}
.memo-foot{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;margin-top:16px;font-size:15px;color:var(--muted)}
.memo-foot .pdf{height:40px;padding:0 18px;background:var(--btn);color:#fff}
.memo-foot .pdf:hover{background:var(--btn-hover)}
.memo-foot .pdf.alt{background:#fff;color:var(--btn);border:1px solid var(--btn)}
.memo-foot .pdf.alt:hover{background:var(--input-bg);color:var(--btn-hover)}

/* ───────── 푸터 (연구원 ft_bottom: 18/16/16) ───────── */
.ft{background:var(--ft);color:var(--ft-txt);padding:0 0 46px;font-size:17px}
.ft-links{display:flex;flex-wrap:wrap;margin:0;padding:26px 0 22px;list-style:none;border-bottom:1px solid rgba(255,255,255,.12)}
.ft-links li+li::before{content:"";display:inline-block;width:1px;height:13px;background:rgba(255,255,255,.3);margin:0 18px;vertical-align:0}
.ft-links a{color:#fff;text-decoration:none;font-size:18px}
.ft-links a.privacy{font-weight:700;color:#7fd3f0}
.ft-links a:hover{text-decoration:underline}
.ft-body{display:flex;align-items:flex-start;gap:40px;padding-top:30px}
.ft-logo{width:250px;flex:none}
.ft address{font-style:normal;line-height:1.75}
.ft address a{color:#dfe7f0}
.copyright{margin:8px 0 0;color:#fff;font-size:17px}

/* ───────── 첫 화면(#home, 2026-09-28): 검색 허브 → 최신 동향 → 분류별 규격 찾기 ─────────
   e나라표준인증 포털형 구조 + 국가기술표준원·법령정보센터식 선 중심 목록. 첫 화면일 때 body.is-home(서브비주얼·경로 막대 숨김) */
.is-home .sub-top{display:none}
.home[hidden]{display:none}
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:var(--grad-hero);color:#fff;padding:130px 20px 96px}
.hero-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hero-in{position:relative;width:100%;max-width:860px;text-align:center}
.hero-eyebrow{margin-bottom:12px}
.hero-t{margin:0 0 34px;font-size:44px;font-weight:500;line-height:1.3;letter-spacing:-.05em}
.hero-t span,.hero-t b{display:block}
.hero-t b{font-weight:700}
.hsearch{position:relative;display:flex;background:#fff;border-radius:4px;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.hsearch:focus-within{outline:3px solid var(--cyan-l);outline-offset:2px}
.hsearch input{flex:1;min-width:0;height:64px;border:0;border-radius:4px 0 0 4px;padding:0 24px;font:inherit;font-size:18px;color:#111;background:transparent}
.hsearch input:focus{outline:none}
.hsearch>button{flex:none;width:78px;border:0;border-radius:0 4px 4px 0;background:var(--sky);color:#fff;display:grid;place-items:center;cursor:pointer}
.hsearch>button:hover{background:var(--blue)}
.hsearch svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.suggest{position:absolute;left:0;right:0;top:100%;margin:6px 0 0;padding:6px 0;list-style:none;background:#fff;border-radius:4px;box-shadow:0 16px 36px rgba(0,0,0,.3);
  text-align:left;color:#111;z-index:10;max-height:360px;overflow:auto}
.suggest button{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:12px;align-items:center;width:100%;padding:9px 20px;border:0;background:none;text-align:left;font:inherit;font-size:16px;color:#111;cursor:pointer}
.suggest button:hover,.suggest button[aria-selected="true"]{background:#eef4fc}
.suggest button:focus-visible{outline-color:var(--blue);background:#eef4fc}   /* 흰 목록 위라 .hero 의 흰 초점선 대신 */
.suggest .s-no{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:0}
.suggest .s-nm{overflow:hidden}
.suggest .s-en{display:block;font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.suggest .s-st{font-size:14px;font-weight:700}
.suggest .s-all{grid-template-columns:1fr;color:var(--blue);font-weight:700;border-top:1px solid var(--line)}
.suggest .s-none{padding:12px 20px;color:var(--muted);font-size:16px}
.hot{margin:18px 0 0;font-size:16px;color:#cfe0f5}
.hot b{color:var(--cyan-l);margin-right:10px;font-weight:700}
.hot button{background:none;border:0;color:#fff;padding:2px 9px;font:inherit;font-size:16px;cursor:pointer}
.hot button:hover{text-decoration:underline}
.hq{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 28px;margin:46px 0 0}
.hq a{display:flex;flex-direction:column;align-items:center;gap:10px;width:108px;color:#fff;text-decoration:none;font-size:16px;font-weight:500}
.hq i{width:64px;height:64px;border-radius:50%;border:1.5px solid rgba(255,255,255,.55);display:grid;place-items:center;transition:background .15s,border-color .15s}
.hq i::before{content:"";width:28px;height:28px;background:#fff;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.hq a:hover i,.hq a:focus-visible i{background:var(--sky);border-color:var(--sky)}
.qi-list{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8 6h13M8 12h13M8 18h13M3.5 6h.01M3.5 12h.01M3.5 18h.01'/%3E%3C/svg%3E")}
.hstat{margin:34px 0 0;font-size:15px;color:#cfe0f5}
.hstat b{color:#fff}
.down{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;color:#cfe0f5;text-decoration:none;font-size:12px;letter-spacing:.2em}
.down i{width:18px;height:28px;border:1.5px solid currentColor;border-radius:10px;position:relative}
.down i::after{content:"";position:absolute;left:50%;top:6px;width:3px;height:6px;margin-left:-1.5px;border-radius:2px;background:currentColor;animation:krs-wheel 1.6s infinite}
@keyframes krs-wheel{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(9px)}}
/* 첫 화면 배너: 검색 영역 바로 아래(app.js 가 옮김) */
.is-home #banner-wrap{max-width:1340px;margin:0 auto}

.hwrap{max-width:1320px;margin:0 auto}
.sec-t{margin:0 0 30px;font-size:30px;font-weight:700;letter-spacing:-.05em;color:var(--ink);scroll-margin-top:100px}
.sec-t:focus{outline:0}
.plus{display:inline-flex;align-items:center;gap:8px;font-size:16px;color:#444;text-decoration:none;white-space:nowrap}
.plus::after{content:"";width:22px;height:22px;border:1px solid #c9ced6;border-radius:50%;
  background:linear-gradient(#444,#444) center/9px 1.5px no-repeat,linear-gradient(#444,#444) center/1.5px 9px no-repeat}
.plus:hover{color:var(--blue)}
.plus:hover::after{border-color:var(--blue)}
.blk-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:2px solid var(--ink)}
.blk-h h3{margin:0;font-size:22px;font-weight:700}
.news{background:#fff;padding:92px 20px 84px}
.news-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px}
.g-day{display:grid;grid-template-columns:132px minmax(0,1fr);gap:24px;padding:22px 0;border-bottom:1px solid var(--line)}
.g-date .y{display:block;font-size:15px;color:var(--muted)}
.g-date .md{display:block;font-size:30px;font-weight:700;line-height:1.15;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.g-date .sum{display:block;margin-top:8px;font-size:15px;color:#555;line-height:1.5}
.g-list{list-style:none;margin:0;padding:0}
.g-list button{display:grid;grid-template-columns:148px minmax(0,1fr) 44px;gap:14px;align-items:baseline;width:100%;padding:6px 0;border:0;background:none;text-align:left;font:inherit;cursor:pointer}
.g-list .g-no{font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:0}
.g-list .g-nm{font-size:18px;color:#222;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.g-list button:hover .g-nm,.g-list button:focus-visible .g-nm{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.gst{font-size:15px;font-weight:700;text-align:right}
.g-more{display:inline-block;margin-top:4px;font-size:15px;color:var(--muted);text-decoration:none}
.g-more:hover{color:var(--blue);text-decoration:underline}
.htabs{display:flex;align-items:center}
.htabs button{border:0;background:none;padding:0;font:700 22px/1.3 var(--ff);color:#6b7280;cursor:pointer}
.htabs button+button{margin-left:18px;padding-left:18px;border-left:1px solid #d4d8de;line-height:1}
.htabs button[aria-selected="true"],.htabs button:hover{color:var(--ink)}
.hrows{list-style:none;margin:0;padding:0}
.hrows a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:baseline;padding:17px 2px;border-bottom:1px solid var(--line);text-decoration:none}
.hrows a>span:first-child{min-width:0}
.hrows .r-tt{display:block;font-size:18px;color:#222;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hrows .r-pin{font-size:15px;font-weight:700;color:#b54708;margin-right:8px}
.hrows .r-sub{display:block;margin-top:3px;font-size:15px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hrows .r-dt{font-size:16px;color:#6b7280;font-variant-numeric:tabular-nums;letter-spacing:0}
.hrows a:hover .r-tt,.hrows a:focus-visible .r-tt{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.h-empty{padding:28px 0;color:var(--muted);font-size:17px;list-style:none}
.field{background:#f6f8fb;padding:84px 20px 92px;border-top:1px solid var(--line)}
.field-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.field-sum{margin:0;font-size:17px;color:#555}
.field-sum b{color:var(--ink)}
.index{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,2fr);border-top:2px solid var(--ink);background:#fff}
.ix{padding:26px 30px 28px;border-left:1px solid var(--line)}
.ix:first-child{border-left:0}
.ix.wide ul{column-count:2;column-gap:40px}
.ix.wide li{break-inside:avoid}
.ix-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}
.ix-h h3{margin:0;font-size:20px;font-weight:700}
.ix-h span{font-size:16px;color:var(--muted)}
.ix-h span b{font-size:24px;color:var(--blue);font-weight:700;margin-right:2px;font-variant-numeric:tabular-nums}
.ix ul{list-style:none;margin:0;padding:0}
.ix li a{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:baseline;gap:8px;padding:9px 0;border-bottom:1px solid var(--line-soft);text-decoration:none}
.ix .i-cd{font-size:14px;color:#6b7280;letter-spacing:.04em}
.ix .i-nm{font-size:17px;color:#333}
.ix .i-n{font-size:16px;color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.ix li a:hover .i-nm,.ix li a:focus-visible .i-nm{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.ix li.zero .i-nm,.ix li.zero .i-n{color:#6b7280}
@media (max-width:1180px){.index{grid-template-columns:1fr 1fr}.ix.wide{grid-column:1/-1;border-left:0;border-top:1px solid var(--line)}}
@media (max-width:1024px){
  .news-grid{grid-template-columns:1fr;gap:48px}
  .index{grid-template-columns:1fr}.ix{border-left:0;border-top:1px solid var(--line);padding:22px 22px 24px}.ix:first-child{border-top:0}
}
@media (max-width:720px){
  .hero{padding:110px 16px 84px}.hero-t{font-size:28px;margin-bottom:24px}
  .hsearch input{height:54px;font-size:16px;padding:0 16px}.hsearch>button{width:60px}
  .suggest button{grid-template-columns:minmax(0,1fr) auto;gap:2px 10px}.suggest .s-no{grid-column:1/-1}
  .hot{font-size:14px}.hot button{font-size:14px;padding:2px 6px}
  .hq{gap:18px 10px;margin-top:34px}.hq a{width:30%;font-size:14px}.hq i{width:54px;height:54px}
  .sec-t{font-size:25px;margin-bottom:22px}.news,.field{padding:60px 16px}
  .g-day{grid-template-columns:1fr;gap:10px;padding:18px 0}
  .g-date{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.g-date .md{font-size:24px}.g-date .sum{margin:0}
  .g-list button{grid-template-columns:minmax(0,1fr) 36px;gap:2px 10px}.g-list .g-no{grid-column:1/-1}
  .htabs button{font-size:19px}.blk-h h3{font-size:19px}.ix.wide ul{column-count:1}
  .field-h{display:block}.field-sum{margin:-18px 0 18px}
}

/* ───────── 오른쪽 고정 메뉴 (연구원 누리집 sideWrap: 125×110 흰 상자·1px #D4D4D4·에스코어드림 14px·아이콘 29×32, TOP 125×45 연구원 블루)
   1680 이상(본문 옆 큰 상자): 의견수렴·건의함은 처음부터 항상 보임(사용자 요청). TOP 만 아래로 200px 넘게 스크롤하면 나타남(app.js 가 .on 부여)
   — 숨김 중에도 자리는 차지해 위 버튼이 튀지 않고, visibility 로 초점도 받지 않음. 1679 이하는 아래 반응형 참고 ───────── */
.side{position:fixed;right:50px;top:50%;z-index:40;display:flex;flex-direction:column;gap:10px;transform:translateY(-50%)}
.side-top{opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.side.on .side-top{opacity:1;visibility:visible}
.side-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:125px;min-height:110px;padding:8px 6px;overflow-wrap:anywhere;background:#fff;border:1px solid #d4d4d4;color:#333;text-decoration:none;font:400 14px/1.35 var(--ff-dream);text-align:center;transition:border-color .15s,color .15s}
.side-btn:hover,.side-btn:focus-visible{border-color:var(--blue);color:var(--blue)}
/* 초점 테두리는 상자 안쪽에 — 바깥에 그리면 뒤에 어두운 푸터가 올 때 파랑 테두리 대비가 1.83:1 로 떨어짐 */
.side-btn:focus-visible{outline-offset:-5px}
.side-top:focus-visible{outline-color:#fff;outline-offset:-5px}
.side-btn img{display:block;width:29px;height:32px}
.side-top{display:flex;align-items:center;justify-content:center;gap:7px;width:125px;height:45px;padding:0;border:0;background:var(--deep);color:#fff;font:600 14px/1 var(--ff-dream);cursor:pointer}
.side-top:hover{background:var(--blue)}
.side-top img{display:block;width:7px;height:4px}

/* ───────── 반응형 ───────── */
/* 1679 이하: 본문 옆 여백(오른쪽 50px + 상자 125px)이 모자라 본문을 가리므로 오른쪽 아래에 작은 상자로 */
@media (max-width:1679px){
  .side{top:auto;bottom:16px;right:12px;gap:6px;transform:none}
  /* 작은 상자는 첫 화면에서 검색줄 오른쪽 버튼(검색·바로가기)을 가리므로(실측 1440·1366·1280·1024·768) 전체를 스크롤 후 표시로 */
  .side{opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
  .side.on{opacity:1;visibility:visible}
  .side-btn{width:66px;min-height:70px;padding:6px 3px;gap:4px;font-size:12px;line-height:1.25;box-shadow:0 6px 18px rgba(0,30,70,.14)}
  .side-btn img{width:20px;height:auto}
  .side-top{width:66px;height:34px;font-size:12px;box-shadow:0 6px 18px rgba(0,30,70,.14)}
}
@media (max-width:1280px){
  .gnb-d1{padding:12px 15px;font-size:19px}
  .gnb-d1::after{left:15px;right:15px}
  /* 바로가기: 한 줄에 다 들어가지 않으므로 막대 아래 줄로, 항목 수만큼 균등 칸 */
  .path{flex-wrap:wrap}
  .path-home,.path-dd{min-height:60px}
  .quick{order:5;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);width:100%;margin-left:0;padding:0;border-top:1px solid var(--line)}
  .quick .qi{height:54px;padding:0 8px;border-radius:0;border-left:1px solid var(--line)}
  .quick .qi:first-child{border-left:0}
  .path-btn{min-width:170px}.path-dd.cur .path-btn{min-width:210px}
}
@media (max-width:1180px){
  .hd-in{--wm-shift:5px}
  .logo img{width:190px}
  .logo .site{font-size:17px}
  .gnb-d1{padding:12px 11px;font-size:18px}
  .gnb-d1::after{left:11px;right:11px}
  .law-card:first-child .law-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .links{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* 1024 이하: 햄버거 전체 메뉴, 바로가기는 경로 막대 아래 줄 */
@media (max-width:1024px){
  .hd-in{height:auto;padding:40px 20px 18px;flex-wrap:wrap}
  /* 사이트 이름(CMS brand.name)이 길면 한 줄 말줄임 — 전체 메뉴 버튼이 다음 줄로 밀리거나 가로로 넘치지 않게(전체 이름은 로고 aria-label) */
  .logo{flex:0 1 auto;min-width:0;max-width:calc(100% - 72px)}   /* 줄바꿈 가능한 줄이라 줄어들지 않고 밀리므로 최대 폭으로 묶음(전체 메뉴 버튼 44 + 간격 28) */
  .logo img{flex:none}
  .logo .site{min-width:0;overflow:hidden;text-overflow:ellipsis;padding-right:2px}   /* 자간 -0.06em 로 마지막 글자가 1px 삐져 잘리지 않게 */
  .menu-btn{display:flex;align-items:center;justify-content:center;margin-left:auto;width:44px;height:44px;border:1px solid rgba(255,255,255,.55);border-radius:8px;background:rgba(255,255,255,.1);cursor:pointer}
  .menu-btn .bars,.menu-btn .bars::before,.menu-btn .bars::after{display:block;width:20px;height:2px;background:#fff;border-radius:1px;position:relative;transition:transform .2s,opacity .2s}
  .menu-btn .bars::before,.menu-btn .bars::after{content:"";position:absolute;left:0}
  .menu-btn .bars::before{top:-6px}.menu-btn .bars::after{top:6px}
  .hd.open .menu-btn .bars{background:transparent}
  .hd.open .menu-btn .bars::before{transform:translateY(6px) rotate(45deg)}
  .hd.open .menu-btn .bars::after{transform:translateY(-6px) rotate(-45deg)}
  .gnb{display:none;order:3;top:0;width:100%;margin:12px 0 0;background:#fff;border-radius:16px;box-shadow:0 18px 40px rgba(0,30,70,.3);max-height:calc(100vh - 140px);overflow:auto}
  .hd.open .gnb{display:block}
  .gnb-list{display:block;padding:8px 0}
  .gnb-item+.gnb-item{border-top:1px solid var(--line)}
  .gnb-d1{color:var(--navy);font-size:17px;padding:14px 22px 6px}
  .hd .gnb-d1:focus-visible{outline-color:var(--blue)}
  .gnb-d1::after{display:none}
  .gnb-sub{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border-radius:0;padding:0 0 10px;min-width:0}
  .gnb-sub a{padding:8px 34px;font-size:15px}
  /* 전체 메뉴 맨 아래: 기술기준 의견수렴·형식승인 건의함(넓은 화면의 오른쪽 고정 메뉴와 같은 링크) */
  .gnb-ext{display:flex;gap:8px;margin:0;padding:14px 16px 16px;list-style:none;border-top:1px solid var(--line)}
  .gnb-ext li{flex:1;min-width:0}
  .gnb-ext a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:6px 8px;border:1px solid #d4d4d4;border-radius:10px;color:#333;text-decoration:none;font:400 14px/1.3 var(--ff-dream);text-align:center}
  .gnb-ext a:hover{border-color:var(--blue);color:var(--blue)}
  .gnb-ext img{flex:none;width:20px;height:auto}
  .sub-top{padding-top:124px}
  .path{flex-wrap:wrap}
  .path-home,.path-dd{min-height:54px}
  .steps{grid-template-columns:1fr 1fr}
  .steps li:not(:last-child)::after{display:none}
  .steps{gap:24px}
  .board-search input{width:220px}
  .list-tbl col.c-no{width:160px}.list-tbl col.c-cls{width:128px}.list-tbl col.c-date{width:106px}.list-tbl col.c-st{width:74px}.list-tbl col.c-pdf{width:100px}
  .cm-tbl col.c-name{width:200px}
  .law-groups{grid-template-columns:minmax(0,1fr)}
  .links{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* 900 이하: 바로가기 6칸이 좁아지므로 3열 2줄 */
@media (max-width:900px){
  .quick{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr))}
  .quick .qi{border-top:1px solid var(--line)}
  .quick .qi:nth-child(-n+3){border-top:0}
  .quick .qi:nth-child(3n+1){border-left:0}
}
/* 860 이하: 목록형 표는 카드로(가로 넘침 방지) — 규격 목록 표의 최소 폭이 약 772px 이라 스크롤바(15~17px)가 있는 800~827px 창에서 넘쳤음 */
@media (max-width:860px){
  /* 기본 표 규칙(table.board …)보다 우선하도록 table.board.<종류> 로 지정 */
  table.board.list-tbl,table.board.en-tbl,table.board.ks-tbl,table.board.nt-tbl,table.board.cm-tbl{border-top:0}
  .list-tbl thead,.en-tbl thead,.ks-tbl thead,.nt-tbl thead,.cm-tbl thead{display:none}
  .list-tbl,.list-tbl tbody,.en-tbl,.en-tbl tbody,.ks-tbl,.ks-tbl tbody,.nt-tbl,.nt-tbl tbody,.cm-tbl,.cm-tbl tbody{display:block}
  table.board.list-tbl tbody tr,table.board.en-tbl tbody tr,table.board.ks-tbl tbody tr,table.board.nt-tbl tbody tr,table.board.cm-tbl tbody tr{display:grid;grid-template-columns:1fr auto;column-gap:10px;row-gap:3px;align-items:center;border:1px solid var(--line);border-top:2px solid var(--line-strong);padding:14px 16px;margin-bottom:12px;background:#fff}
  table.board.list-tbl td,table.board.en-tbl td,table.board.ks-tbl td,table.board.nt-tbl td,table.board.cm-tbl td{border:0;padding:0;height:auto;text-align:left}
  .board td[data-k]::before{content:attr(data-k) " ";color:var(--muted)}
  .board td.empty{grid-column:1 / -1}
  /* 규격 목록·최근 제개정: [번호 … 상태] / [규격명] / [분류·고시일 … 원문] */
  .list-tbl td:nth-child(1){grid-column:1;grid-row:1;color:var(--sub);font-size:15px}
  .list-tbl td.c:has(.st){grid-column:2;grid-row:1;text-align:right}
  .list-tbl td:nth-child(2){grid-column:1 / -1;grid-row:2;font-size:17px}
  .list-tbl td:nth-child(2) .name-btn{font-weight:600}
  .list-tbl td[data-k]{grid-column:1;font-size:14px;color:var(--sub)}
  .list-tbl td:last-child{grid-column:2;grid-row:3 / span 2;text-align:right}
  .en-tbl td:nth-child(1),.ks-tbl td:nth-child(1){grid-column:1 / -1;color:var(--sub);font-size:15px}
  .en-tbl td:nth-child(2),.ks-tbl td:nth-child(2){grid-column:1 / -1;font-size:17px}
  .en-tbl td:nth-child(3),.ks-tbl td[data-k]{grid-column:1;font-size:14px;color:var(--sub)}
  .en-tbl td:nth-child(4){grid-column:2;grid-row:3;text-align:right}
  .nt-tbl td:nth-child(1){display:none}
  .nt-tbl tr.pin td:nth-child(1){display:block;grid-column:1 / -1}
  .nt-tbl td:nth-child(2){grid-column:1 / -1;font-size:17px}
  .nt-tbl td:nth-child(3){grid-column:2;grid-row:3;text-align:right}
  .nt-tbl td:nth-child(4){grid-column:1;grid-row:3;font-size:14px;color:var(--sub)}
  /* 심의위원회: [회차 · 일자 … 원문] / [위원회명] / [주요내용] — 연도는 일자에 포함되므로 숨김 */
  table.board.cm-tbl tbody tr{grid-template-columns:auto 1fr auto}
  .cm-tbl td:nth-child(1){display:none}
  .cm-tbl td[data-k]::before{content:none}
  .cm-tbl td:nth-child(2){grid-column:1;grid-row:1;font-size:15px;color:var(--blue);font-weight:600}
  .cm-tbl td:nth-child(3){grid-column:2;grid-row:1;font-size:15px;color:var(--sub)}
  .cm-tbl td.cm-name{grid-column:1 / -1;grid-row:2;font-size:17px;font-weight:600}
  .cm-tbl td.cm-sum{grid-column:1 / -1;grid-row:3;font-size:16px}
  .cm-tbl td:last-child{grid-column:3;grid-row:1;text-align:right}
  .cm-tbl td:last-child .pdf{height:30px;padding:0 10px;font-size:14px}
  /* 결과 없음·불러오기 실패 안내 칸: 위의 '첫 칸 숨김'(공지 번호·심의 연도) 규칙에 가려지지 않게 */
  table.board.list-tbl td.empty,table.board.en-tbl td.empty,table.board.ks-tbl td.empty,table.board.nt-tbl td.empty,table.board.cm-tbl td.empty{display:block;grid-column:1 / -1;grid-row:auto;text-align:center;font-size:16px;color:var(--sub)}
}
@media (max-width:720px){
  .wrap{padding:0 16px}
  .util{display:none}
  .hd-in{--wm-shift:4px;padding:18px 16px 14px}
  .logo{gap:10px;max-width:calc(100% - 68px)}
  .logo img{width:150px}
  .logo .site{font-size:15px;padding-left:10px}
  .menu-btn{width:40px;height:40px}
  .sub-top{padding-top:76px}
  .sub-in{padding-top:18px;padding-bottom:44px}
  .eyebrow{font-size:11px;letter-spacing:.3em;padding-left:.3em}
  .sub-title{font-size:28px}
  .sub-desc{font-size:15px}
  .path{min-height:50px}
  .path-home{padding:0 14px}
  .path-home span,#dd1{display:none}
  .path-dd.cur{flex:1;border-right:0}
  .path-dd.cur .path-btn{min-width:0;width:100%;padding:0 16px;font-size:16px}
  /* 바로가기: 3열 타일(아이콘 위·글자 아래) — 가로 스크롤 없이 한눈에 */
  .quick .qi{flex-direction:column;gap:5px;height:auto;min-height:66px;padding:10px 4px;font-size:14px;white-space:normal;text-align:center;line-height:1.25}
  .quick .qi::before{width:22px;height:22px}
  .quick .qi.ext::after{position:absolute;top:9px;right:10px;margin:0}
  .banner{grid-template-columns:30px 1fr;padding:18px 16px;margin-top:22px;gap:12px}
  .banner .ico{width:30px;height:30px;font-size:17px}
  .panel{padding:40px 16px 64px}
  .tit{font-size:25px}
  .lead{font-size:16px;margin-bottom:26px}
  .tab-btns{margin-bottom:22px;flex-wrap:nowrap;overflow-x:auto}
  .tab-btns button{padding:10px 12px;font-size:15px;white-space:nowrap}
  .board-top{align-items:stretch}
  .total{font-size:17px}
  .board-search{width:100%}
  .board-search select{flex:1 1 calc(50% - 3px);min-width:0}
  .board-search input{flex:1 1 60%;width:auto;min-width:0}
  .btn-sky{flex:none}
  .paginate{gap:4px}
  .paginate button{width:34px;height:34px;font-size:17px}
  .links{grid-template-columns:1fr}
  .law-card{padding:20px 0 4px}
  .law-card:first-child .law-list{grid-template-columns:1fr}
  .ks-cta{padding:22px 20px}
  .law-box{padding:20px 18px}
  .parts li{grid-template-columns:48px 1fr;padding:18px 2px}
  .parts li>span{font-size:24px}
  .steps{grid-template-columns:1fr}
  .nt-v-head{padding:20px 14px}.nt-v-head h3{font-size:20px}
  .nt-v-body{padding:24px 14px;font-size:17px}
  .dlg-head{padding:20px 18px 16px}
  .dlg-head h2{font-size:20px}
  .dlg-body{padding:6px 18px 20px}
  .info{grid-template-columns:96px 1fr;font-size:15px}
  .info dt,.info dd{padding:9px 10px}
  /* 개정이력 표 → 2줄 카드: [규격번호 … 상태] / [고시일 · 원문 · 이력보기] */
  table.hist,table.hist tbody{display:block}
  table.hist thead{display:none}
  table.hist tbody tr{display:grid;grid-template-columns:1fr auto auto;column-gap:6px;row-gap:4px;align-items:center;padding:11px 4px}
  table.hist tbody tr.cur{background:#eaf3fc}
  table.hist tr.cur td{background:none}
  table.hist td{display:block;height:auto;padding:0;text-align:left}
  table.hist td:nth-child(1){grid-column:1 / 3;grid-row:1;white-space:normal;font-size:15px;color:#222}
  table.hist td:nth-child(3){grid-column:3;grid-row:1;justify-self:end}
  table.hist td:nth-child(2){grid-column:1;grid-row:2;font-size:14px;color:var(--sub)}
  table.hist td:nth-child(4){grid-column:2;grid-row:2;justify-self:end}
  table.hist td:nth-child(5){grid-column:3;grid-row:2;justify-self:end}
  table.hist td.empty{grid-column:1 / -1}
  table.hist .pdf{padding:0 9px;height:30px;font-size:14px}
  .memo-btn{padding:0 9px;height:30px}
  .ft-links a{font-size:17px}
  .ft-body{flex-direction:column;gap:18px}
  .ft-logo{width:200px}
  /* 휴대폰: 고정 메뉴는 TOP 원형 버튼만(의견수렴·건의함은 전체 메뉴 맨 아래에 있음) */
  .side{right:14px;bottom:14px}
  .side-btn{display:none}
  .side-top{flex-direction:column;gap:3px;width:46px;height:46px;border-radius:50%;font-size:11px}
}
/* 400 이하: 로고·사이트명을 줄여 전체 메뉴 버튼이 다음 줄로 밀리지 않게(360px 기준), 340 이하는 한 단계 더 */
@media (max-width:400px){
  .hd-in{--wm-shift:3px;column-gap:10px}
  .logo{gap:8px;max-width:calc(100% - 50px)}
  .logo img{width:130px}
  .logo .site{font-size:14px;padding-left:8px}
}
@media (max-width:340px){
  .logo img{width:112px}
  .logo .site{font-size:13px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{.hd,.sub-art,.path,.banner,.tab-btns,.board-search,.paginate,.ft,.quick,.side,.hero,.down{display:none}.sub-top{background:none;color:#000;padding-top:0}}
td.no a.ks-link{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
td.no a.ks-link::after{content:"\2197";font-size:.8em;margin-left:2px;text-decoration:none;display:inline-block}
td.no a.ks-link:hover,td.no a.ks-link:focus-visible{color:var(--navy)}

/* ───────── 분과별 문의처(2026-10-14) — 상단 바 맨 뒤·전체 메뉴(1024px 이하)·푸터 링크 줄 오른쪽 단추 + 팝업 ───────── */
.util-bar{position:absolute;top:10px;right:20px;display:flex;align-items:center;gap:18px}
.util-bar .util{position:static}
.util-contact{display:inline-flex;align-items:center;gap:5px;padding:0 0 0 18px;border:0;border-left:1px solid rgba(255,255,255,.3);background:none;color:var(--cyan-l);font:500 13px/1.1 var(--ff);cursor:pointer}
.util-contact:hover{color:#fff;text-decoration:underline}
@media (min-width:1025px){.hd.solid .util-bar{display:none}}
.gnb-ct{display:none}
.gnb-ct button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:50px;padding:6px 8px;border:1px solid #d4d4d4;border-radius:10px;background:#fff;color:#333;font:400 14px/1.3 var(--ff-dream);cursor:pointer}
.gnb-ct button:hover{border-color:var(--blue);color:var(--blue)}
.gnb-ct svg{color:var(--muted)}
.ft-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;padding:26px 0 22px;border-bottom:1px solid rgba(255,255,255,.12)}
.ft-top .ft-links{padding:0;border-bottom:0}
.ft-contact-btn{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 18px;border:1px solid rgba(255,255,255,.35);border-radius:20px;background:transparent;color:#fff;font:500 16px/1 var(--ff);cursor:pointer}
.ft-contact-btn:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.6)}
[data-contact-open][hidden],.gnb-ct[hidden]{display:none !important}
dialog.contact-dlg{width:min(560px,calc(100vw - 32px))}
.ct-list{margin:6px 0 0;padding:0;list-style:none}
.ct-item{padding:16px 0;border-bottom:1px solid var(--line)}
.ct-dv{margin:0 0 6px;font-size:15px;color:var(--sub)}
.ct-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px}
.ct-name{font-size:19px;color:var(--txt);margin-right:2px}
.ct-link{display:inline-flex;align-items:center;gap:7px;color:#333;font-size:16px;text-decoration:none}
a.ct-link:hover{color:var(--btn);text-decoration:underline;text-underline-offset:3px}
.ct-ico{flex:none;fill:none;stroke:var(--muted);stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
a.ct-link:hover .ct-ico{stroke:var(--btn)}
.ct-msg{padding:24px 0;color:var(--muted);text-align:center}
.ct-note{margin:18px 0 0;font-size:14px;color:var(--muted)}
.ct-note a{color:var(--blue)}
/* 오른쪽 고정 메뉴(폭 66px, 아래쪽)와 푸터 단추가 겹치는 폭에서는 단추를 그만큼 안쪽으로 */
@media (min-width:721px) and (max-width:1459px){.ft-top{padding-right:66px}}
@media (max-width:1024px){
  .gnb-ext{padding-bottom:8px}
  .gnb-ct{display:block;padding:0 16px 16px}
  .gnb-ext[hidden]+.gnb-ct{padding-top:14px;border-top:1px solid var(--line)}
}
@media (max-width:720px){
  .util-bar{display:none}
  .ft-top{padding:22px 0 18px}
  .ft-contact-btn{height:38px;font-size:15px}
  .ct-row{gap:0 18px}
  .ct-name{flex-basis:100%;margin-bottom:2px}
  .ct-link{min-height:40px}
}

/* 공지사항 안의 '규격 제ㆍ개정 의견수렴' 탭·표(2026-10-20) */
.nt-tabs{display:flex;flex-wrap:wrap;margin:0 0 28px;border-bottom:1px solid var(--line)}
.nt-tabs a{position:relative;padding:12px 18px;font:600 17px/1.3 var(--ff);color:#6b7280;text-decoration:none}
.nt-tabs a:hover{color:var(--ink)}
.nt-tabs a[aria-current="page"]{color:var(--ink)}
.nt-tabs a[aria-current="page"]::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:3px;background:var(--blue)}
.op-tbl col.c-num{width:80px}.op-tbl col.c-per{width:240px}.op-tbl col.c-att{width:80px}.op-tbl col.c-date{width:130px}
.op-tbl td:nth-child(2){text-align:left}
.st-종료{color:var(--muted)}
.op-closed .nm{color:var(--sub)}
.nt-v-closed{margin:22px 0 0;padding:16px 18px;background:var(--bg-soft);border-left:3px solid var(--blue);color:var(--td);line-height:1.8}
@media (max-width:860px){
  table.board.op-tbl{border-top:0}
  .op-tbl thead{display:none}
  .op-tbl,.op-tbl tbody{display:block}
  table.board.op-tbl tbody tr{display:grid;grid-template-columns:1fr auto;column-gap:10px;row-gap:3px;align-items:center;border:1px solid var(--line);border-top:2px solid var(--line-strong);padding:14px 16px;margin-bottom:12px}
  table.board.op-tbl td{border:0;padding:0;height:auto;text-align:left}
  .op-tbl td:nth-child(1){display:none}
  .op-tbl td:nth-child(2){grid-column:1 / -1;font-size:17px}
  .op-tbl td:nth-child(3){grid-column:1;grid-row:3;font-size:14px;color:var(--sub)}
  .op-tbl td:nth-child(4){grid-column:1;grid-row:4;font-size:14px;color:var(--sub)}
  .op-tbl td:nth-child(5){grid-column:2;grid-row:3 / span 2;text-align:right}
  .board.op-tbl td[data-k]::before{content:attr(data-k) " ";color:var(--muted)}
  .nt-tabs a{padding:10px 12px;font-size:16px}
}

/* 철도분야 KS — 폐지 규격 표시(2026-10-20): 제목 앞의 '폐지'(회색 테두리 글자) */
.ks-abol,.op-end{display:inline-block;margin-right:4px;padding:1px 9px;border:1px solid #d0d5dd;border-radius:3px;background:transparent;color:#6b7280;font:500 14px/1.5 var(--ff);vertical-align:1px;white-space:nowrap}   /* 2026-10-20 사용자 요청: 붉은색이 튀어 주변과 같은 회색으로 */
.op-ing{display:inline-block;margin-right:4px;padding:1px 9px;border:1px solid #9cc3ee;border-radius:3px;background:#eef5fd;color:var(--blue);font:600 14px/1.5 var(--ff);vertical-align:1px;white-space:nowrap}   /* 의견수렴 진행 건(2026-10-20 사용자 요청: 파란색) */