/* 세이프지 게시판 공통 가이드 (2026-10-31, 결정 38) — 목록·상세 화면 공통 스타일
   글꼴·색은 사업안내·산업안전 영상 화면과 같음: Pretendard / Navy #0E3A63 / Blue #1A6DB5 / 본문 #3F4A55 */
.sgb, #bo_v.sgb-detail{
	--sgb-navy:#0E3A63; --sgb-blue:#1A6DB5; --sgb-sky:#33A8E0; --sgb-ink:#3F4A55; --sgb-sub:#6B6D70;
	--sgb-line:#E3E7EB; --sgb-bg:#F5F7F9; --sgb-tint:#E9F5FC; --sgb-green:#3EAA49; --sgb-radius:8px;
	font-family:'Pretendard','Pretendard Variable',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
	color:var(--sgb-ink); word-break:keep-all; -webkit-font-smoothing:antialiased; text-align:left;
}
.sgb *{box-sizing:border-box}
.sgb [hidden]{display:none !important}
.sgb .blind{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap}
.sgb a{color:inherit; text-decoration:none}
.sgb ul{list-style:none; margin:0; padding:0}

/* 머리말 */
.sgb-head{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 24px; padding-bottom:22px; margin-bottom:28px; border-bottom:1px solid var(--sgb-line)}
.sgb-lead{max-width:760px; font-size:17px; line-height:1.65; color:var(--sgb-ink); margin:0}
.sgb-count{font-size:15px; color:var(--sgb-sub); white-space:nowrap}
.sgb-count b{color:var(--sgb-navy); font-variant-numeric:tabular-nums}

/* 도구: 검색·필터 */
.sgb-tools{display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-bottom:24px}
.sgb-search{position:relative; flex:1 1 280px; max-width:420px}
.sgb-search input{width:100%; height:46px; padding:0 16px 0 42px; border:1px solid #D9DDE1; border-radius:var(--sgb-radius); font:inherit; font-size:15px; color:var(--sgb-navy); background:#fff}
.sgb-search input:focus{outline:none; border-color:var(--sgb-blue); box-shadow:0 0 0 3px rgba(26,109,181,.15)}
.sgb-search:before{content:""; position:absolute; left:15px; top:50%; width:15px; height:15px; margin-top:-9px; border:2px solid #8A9199; border-radius:50%}
.sgb-search:after{content:""; position:absolute; left:28px; top:50%; width:7px; height:2px; margin-top:5px; background:#8A9199; transform:rotate(45deg)}
.sgb-chips{display:flex; flex-wrap:wrap; gap:8px}
.sgb-chip{height:38px; padding:0 16px; border:1px solid #D9DDE1; border-radius:999px; background:#fff; font:inherit; font-size:15px; font-weight:600; color:var(--sgb-ink); cursor:pointer}
.sgb-chip:hover{border-color:var(--sgb-blue); color:var(--sgb-blue)}
.sgb-chip[aria-pressed="true"]{background:var(--sgb-navy); border-color:var(--sgb-navy); color:#fff}
.sgb-chip:focus-visible,.sgb-card a:focus-visible,.sgb-row a:focus-visible{outline:3px solid var(--sgb-sky); outline-offset:2px}
.sgb-empty{display:none; padding:48px 0; text-align:center; font-size:16px; color:var(--sgb-sub)}
.sgb-empty.is-on{display:block}

/* 카드형 목록 (공지·브리핑·표지) */
.sgb-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:32px 24px}
.sgb-cards--poster{grid-template-columns:repeat(4,1fr); gap:28px 20px}
.sgb-card{min-width:0}
.sgb-card a{display:block}
.sgb-thumb{display:block; position:relative; aspect-ratio:16/10; overflow:hidden; border-radius:var(--sgb-radius); background:var(--sgb-bg); border:1px solid var(--sgb-line)}
.sgb-thumb img{width:100%; height:100%; object-fit:cover; transition:transform .25s}
.sgb-cards--poster .sgb-thumb{aspect-ratio:3/4}
.sgb-cards--poster .sgb-thumb img{object-fit:contain}
.sgb-thumb--none{display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--sgb-navy),var(--sgb-blue)); border:0}
.sgb-thumb--none span{font-size:15px; font-weight:700; letter-spacing:.04em; color:rgba(255,255,255,.85)}
.sgb-card a:hover .sgb-thumb img{transform:scale(1.04)}
/* 게시판별 섬네일 비율 — 원본이 잘리지 않게 (결정 51) */
.sgb-cards--insight .sgb-thumb{aspect-ratio:1/1; background:#fff}
.sgb-cards--insight .sgb-thumb img{object-fit:contain}
.sgb-cards--notice .sgb-thumb{aspect-ratio:4/3}
/* MSDS 카드: 요약정보 문서 윗부분(물질명·CAS·그림문자)이 보이게 (결정 51) */
/* MSDS: 이미지 없는 글자 카드를 촘촘한 격자로 (결정 53) */
.sgb-cards.sgb-cards--doc{grid-template-columns:repeat(auto-fill, minmax(210px, 1fr)); gap:14px}
.sgb-tcard{display:flex; flex-direction:column; justify-content:space-between; gap:14px; padding:18px 18px 16px; border:1px solid var(--sgb-line); border-radius:var(--sgb-radius); background:#fff; transition:border-color .15s, box-shadow .15s}
.sgb-tcard:hover{border-color:var(--sgb-blue); box-shadow:0 6px 18px rgba(14,58,99,.08)}
.sgb-tcard .sgb-tcard-name{display:block}
/* 버튼이 없어 카드 전체를 누르는 영역으로 (결정 67) */
.sgb-tcard{position:relative; justify-content:center; min-height:84px}
.sgb-tcard .sgb-tcard-name:after{content:""; position:absolute; inset:0; border-radius:var(--sgb-radius)}
.sgb-tcard:hover .sgb-tit{color:var(--sgb-blue)}
.sgb-tcard-tag{display:inline-block; padding:2px 7px; border-radius:4px; font-size:11.5px; font-weight:800; letter-spacing:.04em; color:var(--sgb-blue); background:var(--sgb-tint)}
.sgb-cards--doc .sgb-tcard .sgb-tit{margin-top:0; font-size:17px; line-height:1.4; -webkit-line-clamp:2}
.sgb-tcard .sgb-card-files{margin-top:auto}  /* 버튼은 카드 아래쪽, 명칭 글자 시작선에 맞춤 (결정 62) */
.sgb-icard .sgb-card-files{padding-left:70px}  /* 아이콘 56px + 간격 14px = 명칭 글자 시작선 */
/* MSDS 물질 아이콘 카드 (결정 61): 아이콘 · 한글명 · 영문명 · PDF */
/* 아이콘 왼쪽 · 명칭 오른쪽 가로 배치 (결정 62) */
.sgb-icard a.sgb-tcard-name{display:flex; align-items:center; gap:14px}
.sgb-icard .sgb-icard-icon{flex:0 0 auto; display:block; width:56px; height:56px}
.sgb-icard-txt{min-width:0}
.sgb-cards--doc .sgb-icard .sgb-tit{display:block}
.sgb-icard-en{display:block; margin-top:3px; font-size:12px; font-weight:700; letter-spacing:.04em; line-height:1.35; color:#7A8590; word-break:break-word}
/* (이전 시안) MSDS 비주얼 카드: 성상 그림 + 그림문자 + 영문명 — 결정 61로 사용 안 함 */
.sgb-vcard{padding:12px 12px 16px}
.sgb-vis{position:relative; display:flex; align-items:flex-end; min-height:130px; margin-bottom:12px; padding:14px; border-radius:6px; overflow:hidden; background:linear-gradient(135deg,#EEF2F6,#DDE5EE); color:var(--sgb-navy)}
.sgb-vis--solid{background:linear-gradient(135deg,#EEF1F4,#D7DEE6); color:#3B4A5A}
.sgb-vis--liquid{background:linear-gradient(135deg,#E8F4FC,#CBE6F7); color:var(--sgb-blue)}
.sgb-vis--gas{background:linear-gradient(135deg,#EEF8FC,#D9F0FA); color:#2C8FBF}
.sgb-vis-icon{position:absolute; left:14px; top:14px; display:flex; flex-direction:column; align-items:center; gap:2px}
.sgb-vis-icon svg{width:52px; height:52px}
.sgb-vis-icon b{font-size:12.5px; font-weight:800}
.sgb-vis-ghs{position:absolute; right:10px; top:10px; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:3px; max-width:60%}
.sgb-vis-ghs img{width:34px; height:34px; background:#fff; border-radius:4px}
.sgb-vis-en{display:block; font-size:11.5px; font-weight:700; letter-spacing:.04em; line-height:1.35; color:#5B6B7B; word-break:break-word}
.sgb-vcard .sgb-tit{padding:0 6px}
.sgb-vis-cas{display:block; margin:-6px 0 0; padding:0 6px; font-size:13px; color:#8A9199; font-variant-numeric:tabular-nums}
.sgb-vcard .sgb-card-files{padding:0 6px}

/* MSDS 카드: 성상 + GHS 그림문자 (결정 59) */
.sgb-ghs{display:flex; flex-wrap:wrap; align-items:center; gap:4px}
.sgb-ghs img{width:30px; height:30px}
.sgb-state-tag{margin-right:4px; padding:3px 8px; border-radius:4px; font-size:12.5px; font-weight:700; color:var(--sgb-navy); background:var(--sgb-bg); border:1px solid var(--sgb-line)}
.sgb-msds-note{margin:-12px 0 24px; font-size:13px; color:#8A9199}  /* 버튼은 카드 아래쪽에 맞춰 정렬 (제목 길이와 무관) */
/* 카드 안 링크 공통 규칙(display:block)에서 버튼만 제외 — 글자를 버튼 가운데로 */
.sgb-card a.sgb-file-chip{display:inline-flex; align-items:center; justify-content:center; line-height:1}
.sgb-card-files{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px}
.sgb-card-files .sgb-file-chip{height:36px; padding:0 12px}
.sgb-tag{display:inline-block; margin-top:14px; padding:3px 9px; border-radius:999px; font-size:12.5px; font-weight:700; color:var(--sgb-navy); background:var(--sgb-tint)}
.sgb-card .sgb-tit{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-top:10px; font-size:18px; font-weight:700; line-height:1.45; color:var(--sgb-navy)}
.sgb-cards--poster .sgb-tit{font-size:16px; margin-top:12px}
.sgb-card a:hover .sgb-tit{color:var(--sgb-blue); text-decoration:underline; text-underline-offset:3px}
.sgb-sum{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-top:8px; font-size:15px; line-height:1.6; color:var(--sgb-sub)}
.sgb-date{display:block; margin-top:8px; font-size:14px; color:#8A9199; font-variant-numeric:tabular-nums}

/* 줄 목록 (MSDS·교육 자료) */
/* 공지사항: 일반 게시판 줄 — 번호 · 제목 · 첨부 · 작성일 (결정 78) */
.sgb-board{margin:0; padding:0; list-style:none; border-top:2px solid var(--sgb-navy)}
.sgb-bhead, .sgb-brow{display:grid; grid-template-columns:80px minmax(0,1fr) 64px 120px; align-items:center; column-gap:12px; border-bottom:1px solid var(--sgb-line)}
.sgb-bhead{padding:14px 4px; background:var(--sgb-bg); font-size:14.5px; font-weight:700; color:var(--sgb-navy); text-align:center}
.sgb-brow{padding:17px 4px}
.sgb-brow:hover{background:#FAFBFC}
.sgb-b-num, .sgb-b-att, .sgb-b-date{text-align:center}
.sgb-brow .sgb-b-num{font-size:14.5px; color:#8A9199; font-variant-numeric:tabular-nums}
.sgb-brow .sgb-b-tit{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:16.5px; font-weight:500; color:var(--sgb-navy)}
.sgb-brow .sgb-b-tit:hover{color:var(--sgb-blue); text-decoration:underline; text-underline-offset:3px}
.sgb-brow .sgb-b-tit:focus-visible{outline:3px solid var(--sgb-sky); outline-offset:2px}
.sgb-bhead .sgb-b-tit{text-align:center}
.sgb-b-file{display:inline-flex; color:#8A9199}
.sgb-b-file svg{width:18px; height:18px}
.sgb-brow .sgb-b-date{font-size:14.5px; color:#8A9199; font-variant-numeric:tabular-nums}
.sgb-board .sgb-brow[hidden], .sgb-board [data-sgb-off]{display:none}
.sgb-bar--list + .sgb-board{border-top:0}  /* 머리줄 진한 선과 겹치지 않게 한 줄만 (결정 79) */
/* 상단 고정 '공지' 줄 (결정 79) */
.sgb-brow--pin{background:#F4F9FD}
.sgb-brow--pin:hover{background:#EAF4FB}
.sgb-pin{display:inline-block; padding:2px 9px; border-radius:4px; background:var(--sgb-blue); color:#fff; font-size:12.5px; font-weight:700; line-height:1.5}
.sgb-brow--pin .sgb-b-tit{font-weight:700}
/* 쪽 번호 */
.sgb-pager{display:flex; justify-content:center; flex-wrap:wrap; gap:6px; margin-top:32px}
.sgb-pager:empty{display:none}
.sgb-pg{min-width:38px; height:38px; padding:0 8px; border:1px solid #D9DDE1; border-radius:6px; background:#fff; font:inherit; font-size:15px; font-weight:600; color:var(--sgb-ink); cursor:pointer}
.sgb-pg:hover:not([disabled]){border-color:var(--sgb-blue); color:var(--sgb-blue)}
.sgb-pg[aria-current="page"]{background:var(--sgb-navy); border-color:var(--sgb-navy); color:#fff}
.sgb-pg[disabled]{opacity:.35; cursor:default}
.sgb-pg--nav{font-size:18px; line-height:1}
.sgb-pg:focus-visible{outline:3px solid var(--sgb-sky); outline-offset:2px}
.sgb-rows{border-top:2px solid var(--sgb-navy)}
.sgb-row{display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; padding:18px 4px; border-bottom:1px solid var(--sgb-line)}
.sgb-row > a{flex:1 1 360px; min-width:0; font-size:16.5px; font-weight:600; line-height:1.5; color:var(--sgb-navy)}
.sgb-row > a:hover{color:var(--sgb-blue); text-decoration:underline; text-underline-offset:3px}
.sgb-row .sgb-date{margin:0; flex:0 0 auto}
.sgb-files{display:flex; flex-wrap:wrap; gap:6px; flex:0 0 auto}
.sgb-file-chip{display:inline-flex; align-items:center; height:30px; padding:0 10px; border:1px solid #D9DDE1; border-radius:6px; font-size:13px; font-weight:700; color:var(--sgb-navy); background:#fff}
.sgb-file-chip:hover{border-color:var(--sgb-blue); color:var(--sgb-blue)}

/* 교육일정 */
.sgb-notice{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 24px; padding:20px 24px; margin-bottom:32px; border-radius:var(--sgb-radius); background:var(--sgb-tint)}
.sgb-notice p{margin:0; font-size:16px; line-height:1.6; color:var(--sgb-navy)}
.sgb-btn{display:inline-flex; align-items:center; height:44px; padding:0 20px; border-radius:6px; font-size:15px; font-weight:700; background:var(--sgb-navy); color:#fff !important; white-space:nowrap}
.sgb-btn:hover{background:var(--sgb-blue)}
.sgb-btn--line{background:#fff; color:var(--sgb-navy) !important; border:1px solid #C9D0D6}
.sgb-btn--line:hover{background:#fff; border-color:var(--sgb-blue); color:var(--sgb-blue) !important}
.sgb-sec{margin-top:56px}
.sgb-sec:first-child{margin-top:0}
.sgb-sec-tit{display:flex; align-items:baseline; gap:12px; margin:0 0 16px; font-size:24px; font-weight:700; color:var(--sgb-navy)}
.sgb-sec-tit small{font-size:15px; font-weight:500; color:var(--sgb-sub)}
.sgb-year{margin:32px 0 12px; font-size:19px; font-weight:700; color:var(--sgb-navy)}
.sgb-table{width:100%; border-collapse:collapse; border-top:2px solid var(--sgb-navy); font-size:15px}
.sgb-table th{padding:13px 12px; background:var(--sgb-bg); border-bottom:1px solid var(--sgb-line); font-weight:700; color:var(--sgb-navy); text-align:left; white-space:nowrap}
.sgb-table td{padding:16px 12px; border-bottom:1px solid var(--sgb-line); vertical-align:top; line-height:1.55}
.sgb-table td.d{white-space:nowrap; font-weight:700; color:var(--sgb-navy); font-variant-numeric:tabular-nums}
.sgb-table .t{font-weight:700; color:var(--sgb-navy)}
.sgb-table .s{display:block; margin-top:3px; font-size:14px; color:var(--sgb-sub)}
.sgb-table a.more{font-size:14px; font-weight:600; color:var(--sgb-blue); white-space:nowrap}
.sgb-table a.more:hover{text-decoration:underline}
.sgb-region{display:inline-block; min-width:44px; padding:3px 8px; border-radius:999px; font-size:13px; font-weight:700; text-align:center; color:#fff; background:var(--sgb-navy)}
.sgb-region--gangneung{background:#1A6DB5}
.sgb-region--chuncheon{background:#2E8B57}
.sgb-region--online{background:#6B5BB5}  /* 온라인(실시간 ZOOM) 교육 (2026-11-02) */
.sgb-kind{display:inline-block; white-space:nowrap; padding:2px 8px; border-radius:4px; font-size:12.5px; font-weight:700; border:1px solid currentColor}
.sgb-kind--open{color:var(--sgb-blue)}
.sgb-kind--org{color:#6B6D70}
/* 온라인 교육 — 세이프지 에듀 바로가기 (결정 85) */
.sgb-online{margin-top:64px; padding-top:40px; border-top:1px solid var(--sgb-line)}
.sgb-on-head{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 32px; margin-bottom:22px}
.sgb-on-head .sgb-sec-tit{margin-bottom:10px}
.sgb-on-lead{max-width:720px; margin:0; font-size:15.5px; line-height:1.7; color:var(--sgb-ink)}
.sgb-on-lead b{color:var(--sgb-navy)}
.sgb-on-cta{display:flex; flex-wrap:wrap; gap:8px}
.sgb-on-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:0; padding:0; list-style:none}
.sgb-on-card{padding:22px 22px 20px; border:1px solid var(--sgb-line); border-radius:var(--sgb-radius); background:#fff}
.sgb-on-card h3{margin:0; font-size:18px; font-weight:800; color:var(--sgb-navy)}
.sgb-on-card p{margin:6px 0 14px; font-size:14px; color:var(--sgb-sub)}
.sgb-on-links{display:flex; flex-wrap:wrap; gap:6px}
.sgb-on-links a{display:inline-flex; align-items:center; height:34px; padding:0 12px; border:1px solid #D9DDE1; border-radius:999px; font-size:14px; font-weight:600; color:var(--sgb-ink); background:#fff}
.sgb-on-links a:after{content:"↗"; margin-left:4px; font-size:12px; color:#9AA1A8}
.sgb-on-links a:hover{border-color:var(--sgb-blue); color:var(--sgb-blue)}
.sgb-on-links a:focus-visible{outline:3px solid var(--sgb-sky); outline-offset:2px}
.sgb-on-note{margin:16px 0 0; font-size:13.5px; color:var(--sgb-sub)}
/* 연간 교육 일정표 (결정 83): 행 = 과정·지역, 열 = 1~12월, 칸 = 날짜 버튼 */
.sgb-mx-legend{display:flex; flex-wrap:wrap; align-items:center; gap:8px 18px; margin:18px 0 12px; font-size:14px; color:var(--sgb-ink)}
.sgb-mx-legend .is-done:before, .sgb-mx-legend .is-plan:before{content:""; display:inline-block; width:14px; height:14px; margin-right:6px; border-radius:3px; vertical-align:-2px; background:#C5CCD3}
.sgb-mx-legend .is-plan:before{background:var(--sgb-blue)}
.sgb-mx-hint{margin-left:auto; color:var(--sgb-sub)}
.sgb-mx-wrap{overflow-x:auto; border:1px solid var(--sgb-line); border-radius:var(--sgb-radius); -webkit-overflow-scrolling:touch}
.sgb-mx-wrap:focus-visible{outline:3px solid var(--sgb-sky); outline-offset:2px}
.sgb-mx{width:100%; min-width:1040px; border-collapse:separate; border-spacing:0; table-layout:fixed}
.sgb-mx thead th{padding:14px 4px; background:var(--sgb-navy); color:#fff; font-size:15px; font-weight:700; text-align:center; border-left:1px solid rgba(255,255,255,.12)}
.sgb-mx thead th.is-now{background:var(--sgb-blue)}
/* 과정 칸(세로 병합) + 지역·교육장소 칸 — 둘 다 왼쪽 고정 (결정 84) */
.sgb-mx thead th.sgb-mx-c{width:150px; position:sticky; left:0; z-index:3; border-left:0}
.sgb-mx thead th.sgb-mx-h{width:190px; position:sticky; left:150px; z-index:3}
.sgb-mx tbody th{background:#fff; font-weight:400; vertical-align:middle; border-top:1px solid var(--sgb-line)}
.sgb-mx tbody th.sgb-mx-c{position:sticky; left:0; z-index:2; padding:14px 10px; text-align:center; background:#F7F9FB; border-right:1px solid var(--sgb-line)}
.sgb-mx tbody th.sgb-mx-h{position:sticky; left:150px; z-index:1; padding:12px 16px; text-align:left; border-right:1px solid var(--sgb-line); box-shadow:2px 0 4px -2px rgba(15,35,60,.08)}
.sgb-mx-c .sgb-kind{background:#fff}
.sgb-mx-cn{display:block; margin-top:8px; font-size:15px; font-weight:700; line-height:1.4; color:var(--sgb-navy); word-break:keep-all}
.sgb-mx td{height:62px; padding:8px 4px; text-align:center; vertical-align:middle; border-top:1px solid var(--sgb-line); border-left:1px solid #EEF1F4}
.sgb-mx td.is-now{background:#F1F7FC}
.sgb-mx tbody + tbody tr:first-child > *{border-top:2px solid #AEB8C2}  /* 과정 묶음 사이 굵은 선 */
.sgb-mx tbody:first-of-type tr:first-child > *{border-top:0}
.sgb-mx-r{display:block}
.sgb-mx-p{display:block; margin-top:6px; font-size:13px; line-height:1.4; color:var(--sgb-sub); word-break:keep-all}
a.sgb-mx-ev{display:block; margin:3px auto; padding:5px 4px; max-width:100px; border-radius:999px; background:#C5CCD3; color:#fff; font-size:13px; font-weight:700; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
a.sgb-mx-ev[data-state="plan"]{background:var(--sgb-blue)}
a.sgb-mx-ev[data-state="now"]{background:var(--sgb-green)}
a.sgb-mx-ev:hover{filter:brightness(.92); text-decoration:none}
a.sgb-mx-ev:focus-visible{outline:3px solid var(--sgb-sky); outline-offset:2px}
.sgb-state{font-size:14px; font-weight:700; white-space:nowrap}
.sgb-state--done{color:#8A9199}
.sgb-state--plan{color:var(--sgb-green)}
/* 교육일정 연도 탭 (결정 75): 올해 탭이 크고 진하게, 이력 탭은 작고 옅게 — 처음 화면은 올해 */
.sgb-sr{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.sgb-tabbar{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:12px 24px; margin-top:56px; border-bottom:2px solid var(--sgb-navy)}
.sgb-tabs{display:flex; align-items:flex-end; gap:28px}
.sgb-tab{position:relative; display:inline-flex; align-items:center; gap:8px; margin:0; padding:0 2px 14px; border:0; background:none; cursor:pointer;
	font:inherit; font-size:17px; font-weight:600; color:#8A9199; letter-spacing:-.02em}
.sgb-tab[aria-selected="true"]{font-size:26px; font-weight:800; color:var(--sgb-navy)}
.sgb-tab[aria-selected="true"]:after{content:""; position:absolute; left:0; right:0; bottom:-2px; height:4px; background:var(--sgb-blue)}
.sgb-tab:hover{color:var(--sgb-navy)}
.sgb-tab:focus-visible{outline:2px solid var(--sgb-blue); outline-offset:4px; border-radius:4px}
.sgb-tab-n{min-width:24px; padding:2px 8px; border-radius:999px; background:var(--sgb-bg); font-size:13px; font-weight:700; line-height:1.5; color:var(--sgb-sub); text-align:center}
.sgb-tab[aria-selected="true"] .sgb-tab-n{background:var(--sgb-tint); color:var(--sgb-blue); font-size:14px}
.sgb-tabbar .sgb-chips{padding-bottom:12px}
.sgb-panel[hidden]{display:none !important}
.sgb-panel.sgb-sec{margin-top:0}
.sgb-panel .sgb-bar{padding:16px 0 0; border-bottom:0}
.sgb-panel .sgb-table{margin-top:16px}
.sgb-tab-empty{margin:16px 0 0; padding:40px 0; text-align:center; color:var(--sgb-sub); background:var(--sgb-bg); border-radius:var(--sgb-radius)}
.sgb-past{margin-top:12px; border:1px solid var(--sgb-line); border-radius:var(--sgb-radius); background:#fff}
.sgb-past summary{cursor:pointer; padding:16px 20px; font-size:17px; font-weight:700; color:var(--sgb-navy)}
.sgb-past summary small{margin-left:8px; font-size:14px; font-weight:500; color:var(--sgb-sub)}
.sgb-past .sgb-table{border-top:1px solid var(--sgb-line)}
.sgb-state--now{color:#fff; background:var(--sgb-green); padding:2px 8px; border-radius:999px; font-size:12.5px}
.sgb-state--plan{padding:2px 8px; border-radius:999px; font-size:12.5px; color:var(--sgb-green); border:1px solid var(--sgb-green)}

/* 교육일정 상단: 안내 패널 + 일정 머리줄 (결정 52) */
.sgb-intro{display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:20px 40px; padding:28px 32px; margin-bottom:48px; border-radius:12px; background:var(--sgb-tint)}
.sgb-intro .sgb-lead{max-width:640px; margin:0; font-size:17px; color:var(--sgb-navy)}
.sgb-intro-cta{display:flex; align-items:center; gap:20px}
.sgb-intro-cta p{margin:0; text-align:right; line-height:1.35}
.sgb-intro-cta span{display:block; font-size:14px; color:var(--sgb-sub)}
.sgb-intro-cta p a{font-size:22px; font-weight:800; color:var(--sgb-navy); letter-spacing:-.01em; font-variant-numeric:tabular-nums}
.sgb-bar{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 24px; padding-bottom:18px; border-bottom:2px solid var(--sgb-navy)}
.sgb-bar .sgb-sec-tit{margin:0 0 6px}
.sgb-bar .sgb-sum-line{margin:0}
.sgb-sum-line i{font-style:normal; margin:0 4px; color:#B0B7BE}
.sgb-sum-line strong{font-size:16px; font-weight:800; color:var(--sgb-navy)}
.sgb-sum-sub{margin-left:12px; padding-left:12px; border-left:1px solid #C9D0D6; font-size:14.5px; color:var(--sgb-sub)}
.sgb-bar + .sgb-half{margin-top:24px}
/* 게시판 목록 머리줄 (결정 54) */
.sgb-bar--list{align-items:center; margin-bottom:0}
.sgb-bar--list .sgb-count{margin:0; font-size:16px; color:var(--sgb-navy)}
.sgb-bar--list .sgb-count b{font-size:18px}
.sgb-lead.sgb-lead--below{max-width:none; margin:12px 0 24px; font-size:14px; line-height:1.6; color:var(--sgb-sub)}  /* 보조 설명 — 작게 (결정 56) */
.sgb-bar--list .sgb-search{flex:0 1 360px}

/* 교육일정: 상·하반기 월별 보드 */
.sgb-sum-line{display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin:0 0 20px; font-size:15.5px; color:var(--sgb-ink)}
.sgb-sum-line b{color:var(--sgb-navy)}
.sgb-legend{display:inline-flex; gap:8px; margin-left:auto; align-items:center}
.sgb-half{margin-top:28px}
.sgb-half-t{margin:0 0 12px; font-size:19px; font-weight:700; color:var(--sgb-navy)}
.sgb-half-t small{margin-left:6px; font-size:14px; font-weight:500; color:var(--sgb-sub)}
.sgb-months{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.sgb-month{display:flex; flex-direction:column; min-height:150px; padding:16px; border:1px solid var(--sgb-line); border-radius:var(--sgb-radius); background:#fff}
.sgb-month.is-past{background:var(--sgb-bg)}
.sgb-month.is-now{border:2px solid var(--sgb-blue); padding:15px; box-shadow:0 4px 14px rgba(14,58,99,.08)}
.sgb-month-h{display:flex; align-items:center; gap:8px; padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid var(--sgb-line)}
.sgb-month-h b{font-size:18px; color:var(--sgb-navy)}
.sgb-now{padding:2px 8px; border-radius:999px; font-size:12px; font-weight:700; color:#fff; background:var(--sgb-blue)}
.sgb-month-n{margin-left:auto; font-size:13px; color:var(--sgb-sub)}
.sgb-evs{display:grid; gap:10px}
.sgb-ev{padding:12px; border-radius:6px; background:#fff; border:1px solid var(--sgb-line)}
.sgb-month.is-past .sgb-ev{background:#fff}
.sgb-ev-top{display:flex; flex-wrap:wrap; align-items:center; gap:6px}
.sgb-ev-d{margin-right:2px; font-size:15px; color:var(--sgb-navy); font-variant-numeric:tabular-nums}
.sgb-ev .sgb-region{min-width:0; padding:2px 8px; font-size:12px}
.sgb-ev .sgb-state{margin-left:auto}
.sgb-ev-t{margin:8px 0 0; font-size:15px; font-weight:700; line-height:1.45; color:var(--sgb-navy)}
.sgb-ev-s{margin:4px 0 0; font-size:13.5px; line-height:1.5; color:var(--sgb-sub)}
.sgb-ev-s .sgb-kind{font-size:11.5px; padding:1px 6px; margin-right:2px}
.sgb-ev-act{display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin-top:8px}
.sgb-ev-act:empty{display:none}
.sgb-ev-act .more{font-size:13.5px; font-weight:700; color:var(--sgb-blue)}
.sgb-ev-act .more:hover, .sgb-table a.more:hover{text-decoration:underline}
.sgb-ev-files{display:inline-flex; flex-wrap:wrap; gap:6px}
.sgb-table .sgb-ev-files{display:flex; margin-top:6px}
.sgb-ev-t a, .sgb-table a.t{display:block; padding:3px 0; color:inherit}
/* 손가락으로 누르기 쉬운 크기 (모바일 터치 영역 40px 이상) */
.sgb-ev-act .more, .sgb-table a.more{display:inline-flex; align-items:center; min-height:40px; padding:0 2px}
.sgb-ev-t a:hover, .sgb-table a.t:hover{color:var(--sgb-blue); text-decoration:underline; text-underline-offset:3px}

/* 교육 상세 레이어 (결정 46) */
dialog.sgb-modal{width:min(760px, calc(100vw - 32px)); max-height:calc(100vh - 48px); padding:0; border:0; border-radius:12px; color:var(--sgb-ink); background:#fff; box-shadow:0 24px 60px rgba(14,58,99,.25)}
dialog.sgb-modal::backdrop{background:rgba(14,30,48,.55)}
.sgb-m-in{position:relative; padding:36px 36px 32px}
/* 닫기 버튼: 내용을 스크롤해도 오른쪽 위에 고정 */
.sgb-m-x{position:sticky; top:14px; z-index:3; float:right; width:44px; height:44px; margin:-22px -22px 0 0; border:0; border-radius:50%; background:var(--sgb-bg); box-shadow:0 2px 8px rgba(14,58,99,.18); font-size:26px; line-height:1; color:var(--sgb-navy); cursor:pointer}
.sgb-m-x:hover{background:var(--sgb-tint)}
.sgb-m-x:focus-visible{outline:3px solid var(--sgb-sky)}
.sgb-m-tags{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 52px 12px 0}
.sgb-modal h2{margin:0 52px 22px 0; font-size:24px; line-height:1.4; font-weight:700; color:var(--sgb-navy)}
.sgb-m-dl{display:grid; gap:0; margin:0; border-top:2px solid var(--sgb-navy)}
.sgb-m-dl > div{display:flex; gap:16px; padding:12px 4px; border-bottom:1px solid var(--sgb-line); font-size:15.5px; line-height:1.55}
.sgb-m-dl dt{flex:0 0 76px; font-weight:700; color:var(--sgb-navy)}
.sgb-m-dl dd{margin:0}
.sgb-m-way{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px}
.sgb-m-way .sgb-btn{height:40px; font-size:14.5px}
.sgb-m-sec{margin-top:26px}
.sgb-m-sec h3{margin:0 0 10px; font-size:17px; font-weight:700; color:var(--sgb-navy)}
/* 교육 주제: 글머리 점을 직접 그려 내용 칸 안에 정렬 (사이트 기본 스타일의 목록 초기화와 무관) */
.sgb-m-topics{margin:0; padding:0; list-style:none; font-size:15.5px; line-height:1.7}
.sgb-m-topics li{position:relative; padding-left:16px; list-style:none}
.sgb-m-topics li + li{margin-top:2px}
.sgb-m-topics li:before{content:""; position:absolute; left:3px; top:.72em; width:5px; height:5px; border-radius:50%; background:var(--sgb-blue)}
.sgb-m-files{display:grid; gap:8px}
.sgb-m-files a.sgb-dl{display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--sgb-line); border-radius:6px; color:var(--sgb-navy)}
.sgb-m-files a.sgb-dl:hover{border-color:var(--sgb-blue)}
.sgb-m-files .ext{min-width:44px; padding:3px 0; border-radius:4px; font-size:12px; font-weight:800; text-align:center; color:#fff; background:var(--sgb-navy)}
.sgb-m-files .nm{font-size:14.5px; font-weight:600; overflow-wrap:anywhere}
.sgb-m-contact{display:flex; flex-wrap:wrap; gap:8px 20px; margin:0; font-size:16px; font-weight:700}
.sgb-m-contact a{color:var(--sgb-blue)}
.sgb-review{padding:20px; border-radius:var(--sgb-radius); background:var(--sgb-bg)}
.sgb-review p{margin:12px 0 14px; font-size:15px; line-height:1.7}
.sgb-review-pics{display:grid; grid-template-columns:repeat(3,1fr); gap:8px}
.sgb-review-pics img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:6px}
dialog.sgb-modal[data-state="plan"] .sgb-review{display:none}  /* 예정 교육에는 후기 숨김 */

/* 표지 상세 레이어: 왼쪽 포스터, 오른쪽 정보 (결정 47) */
dialog.sgb-modal--poster{width:min(980px, calc(100vw - 32px))}
.sgb-pm{display:grid; grid-template-columns:minmax(0,44%) minmax(0,1fr); gap:32px; align-items:start}
.sgb-pm-fig{margin:0; display:flex; align-items:center; justify-content:center; min-height:300px; padding:12px; border-radius:var(--sgb-radius); background:var(--sgb-bg); border:1px solid var(--sgb-line)}
.sgb-pm-fig img{width:100%; height:auto; max-height:calc(100vh - 140px); object-fit:contain}
.sgb-pm-info{display:flex; flex-direction:column; min-height:100%}
.sgb-pm-info h2{margin:4px 52px 20px 0}
.sgb-pm-info h3{margin:0 0 10px; font-size:16px; font-weight:700; color:var(--sgb-navy)}
.sgb-pm-langs{display:grid; gap:0; margin:0 0 24px; padding:0; list-style:none; border-top:2px solid var(--sgb-navy)}
.sgb-pm-langs li{padding:10px 4px; border-bottom:1px solid var(--sgb-line); font-size:16px; line-height:1.5; color:var(--sgb-ink)}
.sgb-pm-files{display:grid; gap:8px; margin-top:auto; padding-top:8px}
.sgb-pm-files a.sgb-dl{display:flex; align-items:center; gap:12px; padding:14px 16px; border-radius:6px; background:var(--sgb-navy); color:#fff}
.sgb-pm-files a.sgb-dl:hover{background:var(--sgb-blue)}
.sgb-pm-files .ext{min-width:44px; padding:3px 0; border-radius:4px; font-size:12px; font-weight:800; text-align:center; color:var(--sgb-navy); background:#fff}
.sgb-pm-files .nm{flex:1; font-size:15px; font-weight:700; overflow-wrap:anywhere}
.sgb-pm-files .sz{font-size:13px; opacity:.8}
/* 레이어가 열린 동안 뒤 화면은 스크롤되지 않음 (결정 49) — 위치는 그대로 유지 */
html.sgb-lock, html.sgb-lock body{overflow:hidden; overscroll-behavior:none}
dialog.sgb-modal{overscroll-behavior:contain}

.sgb-half-empty{margin:0; padding:20px; border:1px dashed #D9DDE1; border-radius:var(--sgb-radius); font-size:15px; color:#8A9199; text-align:center}
.sgb-guide{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.sgb-guide li{padding:22px; border:1px solid var(--sgb-line); border-radius:var(--sgb-radius); background:#fff}
.sgb-guide b{display:block; font-size:16px; color:var(--sgb-navy); margin-bottom:6px}
.sgb-guide p{margin:0; font-size:15px; line-height:1.6}

/* 상세 화면 */
#bo_v.sgb-detail{max-width:960px; margin:0 auto}
#bo_v.sgb-detail #bo_v_title .bo_v_tit{display:block; padding:0 0 14px; background:none; border:0; font-size:30px; font-weight:700; line-height:1.4; color:var(--sgb-navy)}
#bo_v.sgb-detail #bo_v_info{padding:12px 0 22px; margin:0 0 32px; border-top:0; border-bottom:1px solid var(--sgb-line)}
/* 옛 게시판 스타일의 선(글 정보 위·본문 위)과 본문 안쪽 여백을 걷어 선 한 줄, 제목과 같은 왼쪽 선 (결정 80) */
#bo_v.sgb-detail #bo_v_atc{border-top:0; min-height:0}
#bo_v.sgb-detail #bo_v_img:not(:has(img)){display:none}
#bo_v.sgb-detail #bo_v_con{padding:0; min-height:0}
#bo_v.sgb-detail #bo_v_info h2{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0)}
#bo_v.sgb-detail .sgb-meta{display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0; font-size:15px; color:var(--sgb-sub)}
#bo_v.sgb-detail #bo_v_con{font-size:17px; line-height:1.8; color:var(--sgb-ink)}
#bo_v.sgb-detail #bo_v_con img{max-width:100%; height:auto; border-radius:6px}
#bo_v.sgb-detail #bo_v_file{margin:40px 0 0; padding:24px; border-radius:var(--sgb-radius); background:var(--sgb-bg); border:0}
#bo_v.sgb-detail #bo_v_file h2{position:static; width:auto; height:auto; clip:auto; margin:0 0 14px; font-size:16px; font-weight:700; color:var(--sgb-navy)}
#bo_v.sgb-detail #bo_v_file ul{display:grid; gap:8px; margin:0; padding:0; list-style:none}
#bo_v.sgb-detail #bo_v_file li{margin:0; padding:0; border:0; background:none}
#bo_v.sgb-detail a.sgb-dl{display:flex; align-items:center; gap:12px; padding:14px 16px; border:1px solid var(--sgb-line); border-radius:6px; background:#fff; color:var(--sgb-navy)}
#bo_v.sgb-detail a.sgb-dl:hover{border-color:var(--sgb-blue)}
#bo_v.sgb-detail a.sgb-dl .ext{flex:0 0 auto; min-width:46px; padding:4px 0; border-radius:4px; font-size:12px; font-weight:800; text-align:center; color:#fff; background:var(--sgb-navy)}
#bo_v.sgb-detail a.sgb-dl .nm{flex:1; min-width:0; font-size:15px; font-weight:600; overflow-wrap:anywhere}
#bo_v.sgb-detail a.sgb-dl .sz{flex:0 0 auto; font-size:13px; color:var(--sgb-sub)}
#bo_v.sgb-detail .sgb-near{margin-top:56px; padding-top:28px; border-top:2px solid var(--sgb-navy)}
#bo_v.sgb-detail .sgb-near h2{margin:0 0 18px; font-size:18px; font-weight:700; color:var(--sgb-navy)}
/* 상세 화면은 폭이 좁아(960px) 카드 열 수를 줄임 (결정 65) */
#bo_v.sgb-detail .sgb-near .sgb-cards{grid-template-columns:repeat(3,1fr); gap:24px 18px}
#bo_v.sgb-detail .sgb-near .sgb-cards--doc{grid-template-columns:repeat(3,1fr); gap:12px}
#bo_v.sgb-detail .sgb-near .bo_v_nb{margin-top:0; border-top:2px solid var(--sgb-navy)}
#bo_v.sgb-detail .bo_v_nb .nb_tit{font-size:12.5px; text-align:center; padding:2px 0; border-radius:999px; background:var(--sgb-bg)}
#bo_v.sgb-detail .bo_v_nb .is-newer .nb_tit{color:var(--sgb-blue); background:var(--sgb-tint)}
#bo_v.sgb-detail .bo_v_nb{margin:40px 0 0; padding:0; list-style:none; border-top:1px solid var(--sgb-line)}
#bo_v.sgb-detail .bo_v_nb li{display:flex; gap:16px; align-items:center; padding:16px 4px; border-bottom:1px solid var(--sgb-line); font-size:15px}
#bo_v.sgb-detail .bo_v_nb .nb_tit{flex:0 0 64px; font-weight:700; color:var(--sgb-sub)}
#bo_v.sgb-detail .bo_v_nb a{flex:1; min-width:0; color:var(--sgb-navy); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
#bo_v.sgb-detail .bo_v_nb a:hover{color:var(--sgb-blue); text-decoration:underline}
#bo_v.sgb-detail .bo_v_nb .nb_date{flex:0 0 auto; color:#8A9199; font-variant-numeric:tabular-nums}
#bo_v.sgb-detail .sgb-back{display:flex; justify-content:center; margin-top:32px}
/* 공지 상세 하단: 이전글·다음글 두 줄만 (결정 81) — 진한 선은 목록 위 한 줄 */
#bo_v.sgb-detail .sgb-near--nb{padding-top:0; border-top:0}
#bo_v.sgb-detail .bo_v_nb .nb_none{flex:1; color:#9AA1A8}
/* 관련 링크의 긴 주소가 휴대폰 폭을 넘지 않게 줄바꿈 (공지 57, 결정 77) */
#bo_v.sgb-detail #bo_v_link li, #bo_v.sgb-detail #bo_v_link a, #bo_v.sgb-detail #bo_v_link strong{min-width:0; max-width:100%; white-space:normal; overflow-wrap:anywhere; word-break:break-all}
/* 관련 링크: 첨부파일 상자와 같은 모양 — 아이콘·주소 한 줄 정렬 (연결 횟수 삭제 후 옛 float 배치 정리, 결정 81) */
#bo_v.sgb-detail #bo_v_link{margin:12px 0 0; padding:16px 24px; border-radius:var(--sgb-radius); background:var(--sgb-bg)}
#bo_v.sgb-detail #bo_v_link ul{display:grid; gap:8px; margin:0; padding:0; list-style:none}
#bo_v.sgb-detail #bo_v_link li{display:flex; align-items:center; gap:10px; margin:0; padding:12px 16px; border:1px solid var(--sgb-line); border-radius:6px; background:#fff}
#bo_v.sgb-detail #bo_v_link li i{float:none; margin:0; flex:0 0 auto; font-size:17px; color:#8A9199}
#bo_v.sgb-detail #bo_v_link a{float:none; display:block; flex:1; color:var(--sgb-navy); font-size:15px}
#bo_v.sgb-detail #bo_v_link a strong{font-weight:600}
#bo_v.sgb-detail #bo_v_link li:hover{border-color:var(--sgb-blue)}
#bo_v.sgb-detail #bo_v_link li:hover a{color:var(--sgb-blue)}

/* 통합검색 화면 (결정 76) */
.sgs{max-width:960px; margin:0 auto; color:var(--sgb-ink); font-size:16px; line-height:1.6}
.sgs-form{display:flex; height:60px; border:2px solid var(--sgb-navy); border-radius:10px; overflow:hidden; background:#fff}
.sgs-form:focus-within{border-color:var(--sgb-blue); box-shadow:0 0 0 4px var(--sgb-tint)}
.sgs-form input{flex:1; min-width:0; height:100%; padding:0 20px; border:0; outline:0; font:inherit; font-size:18px; color:var(--sgb-navy); background:none}
.sgs-form input::placeholder{color:#9AA1A8}
.sgs-go{display:inline-flex; align-items:center; gap:8px; padding:0 26px; border:0; background:var(--sgb-navy); color:#fff; font:inherit; font-size:16px; font-weight:700; cursor:pointer}
.sgs-go:hover{background:var(--sgb-blue)}
.sgs-go svg{width:20px; height:20px}
.sgs-cats{display:flex; flex-wrap:wrap; gap:8px; margin-top:24px}
.sgs-cats:empty{display:none}
.sgs-cats .sgb-chip b{margin-left:4px; font-weight:800; color:var(--sgb-blue)}
.sgs-cats .sgb-chip[aria-pressed="true"] b{color:#fff}
.sgs-status{margin:24px 0 0; padding-bottom:14px; border-bottom:2px solid var(--sgb-navy); font-size:16px; color:var(--sgb-ink)}
.sgs-status strong, .sgs-status b{color:var(--sgb-navy); font-weight:800}
.sgs-list{margin:0; padding:0; list-style:none}
.sgs-item{padding:22px 4px; border-bottom:1px solid var(--sgb-line)}
.sgs-path{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 6px; font-size:13.5px; color:var(--sgb-sub)}
.sgs-kind{padding:1px 8px; border-radius:4px; background:var(--sgb-tint); color:var(--sgb-blue); font-size:12.5px; font-weight:700}
.sgs-tit{display:inline-block; font-size:19px; font-weight:700; line-height:1.45; color:var(--sgb-navy); word-break:keep-all}
.sgs-tit:hover{color:var(--sgb-blue); text-decoration:underline; text-underline-offset:3px}
.sgs-snip{margin:6px 0 0; font-size:15px; color:var(--sgb-ink); word-break:keep-all; overflow-wrap:anywhere}
.sgs mark{padding:0 1px; background:#FFF1A8; color:inherit; border-radius:2px}
.sgs-meta{display:flex; flex-wrap:wrap; gap:4px 14px; margin:6px 0 0; font-size:13px; color:#8A9199; overflow-wrap:anywhere}
.sgs-more{display:flex; justify-content:center; margin-top:28px}
.sgs-tips{margin-top:28px; padding:24px; border-radius:var(--sgb-radius); background:var(--sgb-bg)}
.sgs-tips p{margin:0 0 12px; font-weight:700; color:var(--sgb-navy)}
.sgs-tips ul{display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none}
.sgs-tips a{display:inline-block; padding:6px 14px; border:1px solid #D9DDE1; border-radius:999px; background:#fff; font-size:14.5px; color:var(--sgb-ink)}
.sgs-tips a:hover{border-color:var(--sgb-blue); color:var(--sgb-blue)}
@media (max-width:768px){
	.sgs-form{height:52px}
	.sgs-form input{padding:0 14px; font-size:16px}
	.sgs-go{padding:0 16px}
	.sgs-go span{display:none}
	.sgs-cats{flex-wrap:nowrap; overflow-x:auto; margin-right:-20px; padding-right:20px; scrollbar-width:none}
	.sgs-cats .sgb-chip{flex:0 0 auto; height:34px; padding:0 12px; font-size:14px}
	.sgs-item{padding:18px 0}
	.sgs-tit{font-size:17px}
	.sgs-snip{font-size:14.5px}
}

@media (max-width:1024px){
	.sgb-months{grid-template-columns:repeat(2,1fr)}
	.sgb-legend{margin-left:0}
	.sgb-cards{grid-template-columns:repeat(2,1fr)}
	.sgb-cards--poster{grid-template-columns:repeat(3,1fr)}
	.sgb-guide{grid-template-columns:1fr}
	.sgb-on-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:768px){
	.sgb-months{grid-template-columns:1fr; gap:10px}
	.sgb-cards.sgb-cards--doc{grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px}
	/* 공지 게시판 줄: 휴대폰은 번호·머리줄 없이 제목 한 줄(두 줄까지) + 아래에 날짜·첨부 */
	.sgb-bhead{display:none}
	.sgb-brow{grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"t t" "d a"; row-gap:6px; padding:15px 2px}
	.sgb-brow .sgb-b-num{display:none}
	.sgb-brow--pin{grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"n t t" "d d a"; column-gap:8px}
	.sgb-brow--pin .sgb-b-num{display:block; grid-area:n; align-self:start; padding-top:1px}
	.sgb-brow .sgb-b-tit{grid-area:t; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:15.5px; line-height:1.45}
	.sgb-brow .sgb-b-date{grid-area:d; text-align:left; font-size:13px}
	.sgb-brow .sgb-b-att{grid-area:a; text-align:right}
	.sgb-b-file svg{width:16px; height:16px}
	/* 하단 '다른 글' 6개: PC·태블릿 3열×2줄, 휴대폰 2열×3줄 — 사진 카드는 제목만 남겨 짧게 (결정 73) */
	#bo_v.sgb-detail .sgb-near .sgb-cards{grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px 12px}
	#bo_v.sgb-detail .sgb-near .sgb-cards--doc{grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px}
	#bo_v.sgb-detail .sgb-near .sgb-sum, #bo_v.sgb-detail .sgb-near .sgb-tag{display:none}
	#bo_v.sgb-detail .sgb-near .sgb-card .sgb-tit{font-size:14.5px; margin-top:8px}
	#bo_v.sgb-detail .sgb-near .sgb-date{font-size:12.5px}
	/* 휴대폰: 카드가 좁아 아이콘을 명칭 위로 (버튼도 글자선과 같은 왼쪽) */
	.sgb-icard a.sgb-tcard-name{flex-direction:column; align-items:flex-start; gap:8px}
	.sgb-icard .sgb-icard-icon{width:44px; height:44px}
	.sgb-icard .sgb-card-files{padding-left:0}
	.sgb-tcard{padding:14px 14px 12px}
	.sgb-cards--doc .sgb-tcard .sgb-tit{font-size:15.5px}
	.sgb-intro{grid-template-columns:1fr; padding:22px 20px; margin-bottom:36px}
	.sgb-intro-cta{flex-wrap:wrap; justify-content:space-between}
	.sgb-intro-cta p{text-align:left}
	.sgb-bar{align-items:flex-start}
	.sgb-on-grid{grid-template-columns:1fr; gap:12px}
	.sgb-on-card{padding:18px 16px}
	.sgb-on-cta{width:100%}
	.sgb-on-cta .sgb-btn{flex:1 1 auto; justify-content:center}
	/* 연간 일정표: 휴대폰은 표 안에서 옆으로 밀어 보기, 과정·지역 칸은 왼쪽에 고정 */
	.sgb-mx{min-width:900px}
	/* 휴대폰: 과정 칸은 함께 밀려 가고, 지역 칸만 왼쪽 고정 */
	.sgb-mx thead th.sgb-mx-c, .sgb-mx tbody th.sgb-mx-c{position:static; width:92px}
	.sgb-mx thead th.sgb-mx-h{width:112px; left:0}
	.sgb-mx tbody th.sgb-mx-h{left:0; padding:10px 10px}
	.sgb-mx tbody th.sgb-mx-c{padding:10px 6px}
	.sgb-mx-c .sgb-kind{font-size:11px; padding:1px 5px}
	.sgb-mx-cn{font-size:12.5px; margin-top:6px}
	.sgb-mx-p{font-size:12px}
	.sgb-mx td{height:54px; padding:6px 3px}
	a.sgb-mx-ev{font-size:12px; padding:4px 3px}
	.sgb-mx-hint{margin-left:0; flex-basis:100%; font-size:13px}
	.sgb-mx-hint:after{content:" 표는 옆으로 밀어 볼 수 있습니다."}
	.sgb-tabbar{margin-top:40px; flex-direction:column-reverse; align-items:stretch; gap:14px}
	.sgb-tabbar .sgb-chips{padding-bottom:0}
	.sgb-tabs{gap:20px}
	.sgb-tab{font-size:15px; padding-bottom:12px}
	.sgb-tab[aria-selected="true"]{font-size:20px}
	.sgb-bar--list .sgb-search{flex:1 1 100%; max-width:none}
	dialog.sgb-modal{width:100vw; max-width:100vw; height:100%; max-height:100%; margin:0; border-radius:0}
	.sgb-m-in{padding:24px 18px 32px}
	.sgb-m-x{margin:-12px -6px 0 0}
	.sgb-modal h2{font-size:20px}
	.sgb-m-dl dt{flex-basis:64px}
	.sgb-pm{grid-template-columns:1fr; gap:20px}
	.sgb-pm-fig{min-height:0}
	.sgb-pm-fig img{max-height:60vh}
	.sgb-month{min-height:0}
	.sgb-lead{font-size:16px}
	.sgb-cards{grid-template-columns:1fr; gap:28px}
	.sgb-cards--poster{grid-template-columns:repeat(2,1fr); gap:20px 12px}
	.sgb-cards--poster .sgb-tit{font-size:14.5px}
	.sgb-table thead{display:none}
	.sgb-table, .sgb-table tbody, .sgb-table tr, .sgb-table td{display:block; width:100%}
	.sgb-table tr{padding:14px 0; border-bottom:1px solid var(--sgb-line)}
	.sgb-table td{padding:3px 0; border:0}
	.sgb-table td[data-l]:before{content:attr(data-l); display:inline-block; min-width:44px; margin-right:8px; font-size:13px; color:var(--sgb-sub)}
	#bo_v.sgb-detail #bo_v_title .bo_v_tit{font-size:23px}
	#bo_v.sgb-detail #bo_v_con{font-size:16px}
	#bo_v.sgb-detail .bo_v_nb .nb_date{display:none}
}