@charset "utf-8";
/* ============================================================================
   이너컴 홈페이지 — 공통 레이아웃
   ----------------------------------------------------------------------------
   기존 사이트(inc/style_white.css, inc/layout.css)의 치수와 색을 유지하되
   아래를 정리했다.

     · 웹폰트 @font-face 오타 수정
       기존:  src: lpcal, url(...) fomat('woff')   ← local / format 오타
       결과적으로 woff 가 적용된 적이 없었다.
     · 좌측메뉴가 id 를 반복 사용하던 것을 class 로
     · 메가메뉴 펼침 높이 380px 하드코딩 제거 (JS 실측으로 이동)
     · 현재 위치(활성 메뉴) 표시 추가

   폭 990px 고정은 기존 그대로 둔다. 모바일은 별도 페이지로 운영 중.

   작성: 2026-09-09
   ============================================================================ */

/* ---------- 웹폰트 ---------- */
@font-face {
    font-family: 'ng';
    /* 원본이 /title/ 아래에 두었다. woff2 는 원본에 없다. */
    src: url('/title/NanumGothic.woff') format('woff');
    font-weight: normal;
    font-display: swap;
}

/* ---------- 리셋 ---------- */
* { margin: 0; padding: 0; }
html { overflow-y: scroll; }
body { font: 12px 'ng', 'Malgun Gothic', '맑은 고딕', sans-serif; color: #333; }
ul, ol, li { list-style: none; }
img { border: 0; vertical-align: middle; max-width: 100%; }
table { border-collapse: collapse; }
a { color: #333; text-decoration: none; }
a:hover, a:focus { text-decoration: underline; }
address { font-style: normal; }

/* 스크린리더 전용 */
.blind {
    position: absolute; width: 1px; height: 1px;
    margin: -1px; padding: 0; overflow: hidden;
    clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* 키보드 포커스는 반드시 보이게 */
a:focus, button:focus, input:focus, select:focus, textarea:focus {
    outline: 2px solid #b99a61;
    outline-offset: 1px;
}

/* ============================================================================
   상단 유틸
   기존에는 u1/u2/u3.gif 이미지 + onclick 이동이라 검색엔진과
   스크린리더가 읽지 못했다. 텍스트 링크로 바꾼다.
   ============================================================================ */
.util_wrap { width: 100%; min-width: 1040px; background: #fff; }
.util { width: 990px; text-align: right; padding: 6px 0; }
/* #888 은 흰 배경에서 3.54:1 로 기준(4.5) 미달이라 내렸다 */
.util li { display: inline-block; margin-left: 14px; font-size: 11px; color: #6b6b6b; }
.util li a { color: #6b6b6b; }
.util li a:hover { color: #82632f; }

/* 글자 앞 붉은 삼각형.
   원본은 u1.gif(HOME) / u2.gif(CONTACT US) / u3.gif(ADMIN) 이미지 3장이었고
   화살표가 글자와 함께 그림 안에 박혀 있었다. 글자를 텍스트로 바꾸면서
   화살표만 없어졌던 것이다.

   이미지를 다시 쓰지 않고 테두리로 삼각형을 그린다.
     - 파일이 늘지 않는다
     - 확대해도 안 깨진다 (원본 GIF 는 8px 짜리라 흐려진다)
     - 색을 글자와 함께 관리할 수 있다
   색 #a71515 는 원본 u1/u2/u3.gif 팔레트에서 그대로 뽑은 값이다.

   장식이므로 화면낭독기가 읽지 않도록 content 는 비워 둔다. */
.util li a::before {
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    margin-right: 4px;
    vertical-align: 1px;                /* 글자 가운데에 맞춘다 */
    border-style: solid;
    border-width: 3px 0 3px 4px;        /* 오른쪽을 가리키는 삼각형 */
    border-color: transparent transparent transparent #a71515;
}

/* ============================================================================
   헤더 + 상단 메가메뉴
   마우스를 어느 1depth 에 올려도 5개 컬럼이 동시에 펼쳐진다 (기존 동작 유지).
   ============================================================================ */
.header_wrap {
    position: relative;
    height: 44px;
    width: 100%;
    border-bottom: 2px solid #b99a61;
    z-index: 9999;
}
.topmenu_wrap {
    width: 100%; min-width: 1040px;   /* 항목 합 1021px + 여유 */
    position: absolute; left: 0; top: 0;
    overflow: hidden;                       /* 접혔을 때 잘라낸다 */
    background: url('/images/ttbg.gif') repeat-x;
}
/* 원본과 같이 폭 100% 다.
   본문(.container)은 990px 로 가운데 정렬하지만 메뉴 바는 화면 전체를 쓴다.
   항목 합이 1021px 라 990px 로 좁히면 마지막 '고객지원'이 다음 줄로 밀린다.
     로고 160 + 회사소개 173 + (172 x 4) = 1021px
   그래서 래퍼에 min-width 1040px 를 두어 줄바꿈을 막는다. */
.topmenu {
    position: relative;
    width: 100%;
    border-left: 1px solid #e6e6e6;
}
.topmenu > li { width: 171px; text-align: center; float: left; padding-right: 1px; }
.topmenu > li.logo { width: 160px; padding: 0; }
.topmenu > li.logo a { border: 0; height: 44px; line-height: 44px; }
.topmenu > li.fst { width: 172px; }

.topmenu > li > a {
    display: block; width: 100%;
    height: 44px; line-height: 44px;
    border-top: 1px solid #e6e6e6;
    border-right: 1px solid #e6e6e6;
    color: #000; font-size: 13px;
}
.topmenu > li > a strong { font-weight: bold; }

/* 마우스가 올라간 / 현재 위치인 1depth */
.topmenu > li.on > a,
.topmenu > li.active > a {
    /* 흰 글씨를 얹으므로 #b99a61(2.67:1) 로는 안 된다 */
    background-color: #8f7038;
    color: #fff;
    text-decoration: none;
}

/* 하위 컬럼 — 기본은 접힘. 높이는 JS 가 실측해 넣는다 (하드코딩 제거) */
.topmenu > li > ul {
    height: 0;
    padding-top: 0;
    overflow: hidden;
    background: #f4f4f4;
    border-left: 1px solid #e6e6e6;
}
.topmenu > li.on > ul { background: #fff; }
.topmenu > li > ul > li {
    width: 160px; text-align: left; float: none;
    margin: 0 6px 12px; padding: 0;
}
.topmenu > li > ul > li > a {
    display: block; height: 20px; line-height: 20px;
    color: #000; font-weight: bold; font-size: 12px;
    background: none;
}
.topmenu > li > ul > li > a:hover,
.topmenu > li > ul > li > a.active2 {
    /* #f4f4f4 배경에서 #b99a61 은 2.43:1. 현재 위치 표시가 가장 안 보였다. */
    color: #82632f; text-decoration: underline;
}

/* ============================================================================
   본문 레이아웃
   ============================================================================ */
/* 원본은 전체가 화면 왼쪽에 붙는다 (실측: 고객센터 배너 left=16, 본문 left=240).
   margin:0 auto 로 가운데 정렬하면 왼쪽 끝에 붙는 상단 메뉴와 어긋난다. */
.container { width: 990px; overflow: hidden; padding: 20px 0 40px; }
.left_wrap { float: left; width: 240px; }
.content_wrap { float: left; width: 730px; padding-left: 20px; }

/* ---------- 좌측 서브메뉴 (기존 id → class) ---------- */
.sm { width: 240px; }
.sbox { border: 1px solid #e0e0e0; background: #fff; }
.stit {
    height: 46px; line-height: 46px;
    background: #8f7038; color: #fff;      /* 흰 글씨 대비 4.62:1 */
    font-size: 16px; font-weight: bold; text-align: center;
}
.sm_box { padding: 10px 0; }
.smenu li { border-bottom: 1px solid #f0f0f0; }
.smenu li:last-child { border-bottom: 0; }
.smenu li a {
    display: block; padding: 9px 12px 9px 22px;
    color: #4a341d; font-size: 12px;
    background: url('/title/icon.gif') no-repeat 10px 14px;
}
.smenu li a:hover { background-color: #faf7f1; text-decoration: none; }
/* 현재 보고 있는 페이지 — 기존 사이트에는 없던 표시 */
/* #faf7f1 배경에서 #b99a61 은 2.50:1 이었다 */
.smenu li.active2 a { color: #82632f; font-weight: bold; background-color: #faf7f1; }

/* ---------- 좌측 배너 ---------- */
.left_banner { margin-top: 12px; width: 220px; }
.left_banner img { display: block; margin-bottom: 3px; width: 220px; height: auto; }
.left_banner a { display: block; }
/* 원본이 인라인 style 로 주던 테두리 */
.left_banner .boxed {
    border: 2px solid #a6acaf; border-radius: 5px; box-sizing: border-box;
}
.left_banner .banner_mail {
    width: 220px; padding: 6px 0; margin-bottom: 3px;
    text-align: center; font-size: 13px; line-height: 1.5; color: #444;
}
.left_banner .banner_mail a { display: inline; color: #4a341d; }   /* 11.67:1 — 그대로 */

/* ============================================================================
   푸터
   기존에는 footer.gif 이미지 한 장 + 이미지맵이라 회사 정보를
   검색엔진이 전혀 읽지 못했다. 텍스트로 전환.
   ============================================================================ */
.footer_wrap {
    border-top: 1px solid #e0e0e0;
    background: #f4f4f4;
    padding: 13px 0;
}
/* 원본 footer.gif 를 로고 + 텍스트로 나눈 구조.
   로고는 왼쪽에 두고 회사정보가 그 오른쪽에 두 줄로 붙는다.

   푸터 높이는 로고 높이가 결정한다.
   회사정보는 두 줄이라 41px 밖에 안 되는데 로고가 원본 65px 이면
   그만큼이 통째로 푸터 높이가 되고 위아래 여백까지 붙어 106px 이 됐다.
   로고를 45px 로 줄여(가로세로비 유지) 두 줄 글 높이에 맞췄다.
   가로는 원본 196x65 비율 그대로 136px 이다. */
.footer_inner { width: 990px; padding-left: 10px; display: flex; align-items: center; gap: 18px; }
.footer_logo { flex: 0 0 auto; margin: 0; }
.footer_logo img { display: block; width: 136px; height: 45px; }

.footer_wrap address,
.footer_info {
    /* #f4f4f4 배경에서 #777 은 4.07:1 로 기준 미달이라 내렸다 */
    font-size: 12px; color: #5f5f5f; line-height: 1.7;
}
/* 항목 사이 간격.
   ★ 반드시 자식 선택자(>)여야 한다.
     그냥 .footer_info span 으로 하면 안쪽에 중첩된 span 까지 걸린다.
     주소는 검색엔진용 itemprop 때문에 이렇게 두 겹이다.
         <span itemprop="address">주소:
             <span itemprop="addressLocality">서울시 금천구</span>
             <span itemprop="streetAddress">가산동 481-4 ...</span>
         </span>
     안쪽 둘에도 14px 이 붙어 "금천구" 와 "가산동" 사이가 벌어졌다.
     FAX 의 itemprop="faxNumber" 도 같은 경우다.
   white-space 는 상속되므로 바깥에만 걸어도 안쪽까지 적용된다. */
.footer_info > span { margin-right: 14px; white-space: nowrap; }
.footer_info > span:last-child { margin-right: 0; }
.footer_info strong { font-weight: bold; color: #4a4a4a; }
.footer_wrap address a,
.footer_info a { color: #5f5f5f; }
.footer_info a:hover { color: #82632f; }

/* ============================================================================
   게시판
   ============================================================================ */
.board_title { font-size: 20px; color: #b99a61; margin-bottom: 16px; padding-bottom: 10px; border-bottom: 2px solid #b99a61; }
.board_title small { font-size: 13px; color: #888; font-weight: normal; margin-left: 8px; }

.board_list { width: 100%; border-top: 2px solid #666; }
.board_list th {
    padding: 10px 4px; font-size: 12px; color: #444;
    background: #f7f7f7; border-bottom: 1px solid #ddd;
}
.board_list td { padding: 9px 4px; border-bottom: 1px solid #eee; text-align: center; color: #555; }
.board_list td.subject { text-align: left; padding-left: 8px; }
.board_list td.subject a { color: #333; }
.board_list tr:hover td { background: #fafafa; }

.board_list .row_notice td { background: #fcfaf5; }
.board_list .num .notice { color: #b99a61; font-weight: bold; }
.board_list .row_reply td.subject { padding-left: 24px; }
.reply_mark {
    display: inline-block; padding: 1px 4px; margin-right: 4px;
    font-size: 10px; color: #fff; background: #b99a61; border-radius: 2px;
}
.ico_secret, .ico_file { font-size: 11px; }

.board_empty { padding: 60px 0; text-align: center; color: #888; border-top: 2px solid #666; border-bottom: 1px solid #ddd; }

/* ---------- 페이징 ---------- */
.board_paging { margin: 20px 0; text-align: center; }
.board_paging a,
.board_paging strong {
    display: inline-block; min-width: 26px; padding: 5px 7px; margin: 0 1px;
    border: 1px solid #ddd; font-size: 12px; color: #666; text-align: center;
}
.board_paging a:hover { border-color: #b99a61; color: #b99a61; text-decoration: none; }
.board_paging .current { background: #b99a61; border-color: #b99a61; color: #fff; }

/* ---------- 검색 ---------- */
.board_search { margin: 16px 0; text-align: center; }
.board_search select,
.board_search input[type=text] { height: 26px; border: 1px solid #ccc; padding: 0 6px; }
.board_search input[type=submit] { height: 28px; padding: 0 14px; border: 1px solid #8f7038; background: #8f7038; color: #fff; cursor: pointer; }

/* ---------- 버튼 ----------
   채움색은 #8f7038 이다. 사이트 강조색 #b99a61 을 그대로 쓰면
   흰 글씨와의 대비비가 2.67:1 밖에 안 나와 글자가 흐릿하다 (WCAG AA 는 4.5:1).
   같은 금색 계열에서 4.62:1 이 되는 지점까지만 어둡게 내렸다.
   테두리·제목 밑줄 같은 장식에는 원래 #b99a61 을 그대로 쓴다 — 글자가 아니라
   대비 기준을 적용할 대상이 아니다.

   ★ 링크 상태 선택자(a:link / a:visited)를 반드시 같이 써야 한다.

   원본 css.css 가 a:link { color:#909090 } 을 전역으로 잡고 있는데,
   명시도가 (0,1,1) 이라 클래스 하나짜리 .btn_write (0,1,0) 보다 세다.
   순서를 뒤로 미뤄도 소용없다. 명시도가 먼저다.

   그래서 <a class="btn btn_write"> 가 금색 배경 위에 회색 글씨로 나와
   글자가 안 보였다. asp:Button 은 <input> 이라 a:link 에 안 걸려 멀쩡했다.
   같은 클래스인데 컨트롤 종류에 따라 달라 보이던 이유가 이것이다. */
.board_btns { margin-top: 16px; text-align: right; }
.btn,
a.btn:link, a.btn:visited {
    display: inline-block; padding: 7px 18px; margin-left: 4px;
    border: 1px solid #ccc; background: #fff; color: #555; font-size: 12px; cursor: pointer;
}
.btn:hover,
a.btn:hover { text-decoration: none; border-color: #b99a61; color: #b99a61; }

/* ★ background 가 아니라 background-color 다.
   축약형 background 를 쓰면 아래에서 넣는 연필 아이콘(background-image)이 지워진다. */
.btn_write, .btn_submit,
a.btn_write:link, a.btn_write:visited,
a.btn_submit:link, a.btn_submit:visited { background-color: #8f7038; border-color: #8f7038; color: #fff; }

.btn_delete,
a.btn_delete:link, a.btn_delete:visited { border-color: #c66; color: #c33; }
.btn_delete:hover,
a.btn_delete:hover { background: #c33; border-color: #c33; color: #fff; }

.btn_write:hover, .btn_submit:hover,
a.btn_write:hover, a.btn_submit:hover { color: #fff; background-color: #7a5c2a; }

/* 글쓰기 / 등록 / 저장 버튼의 연필 아이콘.

   원본은 btn_write.gif(73x25) 한 장에 연필과 '글쓰기' 글자가 함께 그려져 있었다.
   글자를 텍스트로 바꾸면서 연필이 없어졌다.

   이미지를 다시 쓰지 않고 SVG 를 data: 로 박아 넣는다.
     - 파일이 늘지 않는다
     - 확대해도 안 깨진다 (원본은 13px 짜리 GIF 라 흐려진다)
     - 버튼 글자색(#fff)과 같은 색으로 맞춰 둘 수 있다

   ::before 를 쓰지 않는 이유 — .btn_submit 이 붙는 곳이 <input type=submit> 인데
   <input> 은 가짜 요소를 만들지 못한다. 배경 이미지는 <a> 와 <input> 둘 다 된다.

   .btn_submit 이 붙는 곳
     board/write.aspx  '등록'
     board/edit.aspx   '저장'
   둘 다 글을 남기는 동작이라 같은 아이콘을 쓴다. */
.btn_write, .btn_submit,
a.btn_write:link, a.btn_write:visited {
    padding-left: 34px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M12.9 1.3a1.6 1.6 0 0 1 2.3 2.3l-.9.9-2.3-2.3.9-.9z'/%3E%3Cpath d='M11.3 2.9l2.3 2.3-7.5 7.5-2.3-2.3 7.5-7.5z'/%3E%3Cpath d='M3.2 11.2l2.3 2.3-3.2.9.9-3.2z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 14px center;
    background-size: 13px 13px;
}

/* btn_primary — 관리자 화면의 주 버튼(차단 추가, 조회).
   btn_reply   — 게시글 보기의 답변 버튼.
   둘 다 마크업에서는 쓰고 있었는데 정의가 없어 기본 흰 버튼으로만 보였다. */
.btn_primary, .btn_reply,
a.btn_primary:link, a.btn_primary:visited,
a.btn_reply:link, a.btn_reply:visited { background: #8f7038; border-color: #8f7038; color: #fff; }
.btn_primary:hover, .btn_reply:hover,
a.btn_primary:hover, a.btn_reply:hover { color: #fff; background: #7a5c2a; }

/* 작은 버튼 (게시글 보기의 IP 차단 등) */
.btn_small, a.btn_small:link, a.btn_small:visited { padding: 3px 9px; font-size: 11px; margin-left: 2px; }
.btn_warn, a.btn_warn:link, a.btn_warn:visited { border-color: #c66; color: #c33; background: #fff; }
.btn_warn:hover, a.btn_warn:hover { background: #c33; border-color: #c33; color: #fff; }

/* ---------- 글 보기 ---------- */
.board_view { border-top: 2px solid #666; }
.view_head { padding: 14px 10px; border-bottom: 1px solid #ddd; background: #fafafa; }
.view_subject { font-size: 15px; color: #333; margin-bottom: 6px; }
.view_meta { font-size: 11px; color: #888; }
.view_meta span { margin-right: 12px; }
.view_files { padding: 10px; border-bottom: 1px solid #eee; background: #fcfcfc; }
.view_files li { padding: 3px 0; font-size: 12px; }
.view_files .size { color: #999; font-size: 11px; }
.view_content { padding: 24px 10px; min-height: 180px; line-height: 1.7; font-size: 13px; word-break: break-all; }
.view_content img { max-width: 700px; height: auto; }

.view_replies { border-top: 1px solid #ddd; background: #fbfaf7; }
.reply_item { padding: 16px 10px 16px 30px; border-bottom: 1px solid #eee; }
.reply_meta { font-size: 11px; color: #888; margin-bottom: 6px; }
.reply_meta strong { color: #b99a61; margin-right: 8px; }
.reply_content { font-size: 13px; line-height: 1.7; }

/* ---------- 비밀글 잠금 ---------- */
.secret_gate {
    margin: 40px auto; padding: 34px 20px; width: 90%;
    border: 2px solid #333; background: #f1f1f1; text-align: center;
}
.secret_msg { font-size: 13px; color: #444; margin-bottom: 16px; }
.secret_form label { font-size: 13px; font-weight: bold; margin-right: 8px; }
.secret_form input[type=password] { height: 26px; border: 1px solid #ccc; padding: 0 6px; }
.secret_form input[type=submit] { height: 28px; padding: 0 16px; border: 1px solid #b99a61; background: #b99a61; color: #fff; cursor: pointer; }
.secret_error { display: block; margin-top: 12px; color: #c00; font-size: 12px; }
.secret_help { margin-top: 14px; font-size: 11px; color: #888; }

/* ---------- 글쓰기 ---------- */
.board_write { border-top: 2px solid #666; }
.form_table { width: 100%; }
.form_table th {
    padding: 10px; text-align: left; font-size: 12px; color: #444;
    background: #fafafa; border-bottom: 1px solid #eee; vertical-align: top;
}
.form_table td { padding: 8px 10px; border-bottom: 1px solid #eee; }
.form_table input[type=text], .form_table input[type=password],
.form_table input[type=email], .form_table textarea {
    border: 1px solid #ccc; padding: 5px 6px; font-family: inherit; font-size: 12px;
}
.w100 { width: 100px; } .w150 { width: 150px; }
.w200 { width: 200px; } .w300 { width: 300px; }
.w100p { width: 98%; }
.editor { line-height: 1.6; }
/* #999 는 흰 배경에서 2.85:1 로 기준 미달이었다. 입력 규칙을 알려주는
   문구라 안 보이면 그대로 입력 실패로 이어진다. */
.form_help { display: inline-block; margin-left: 8px; font-size: 11px; color: #6b6b6b; }
.form_error { display: block; margin: 12px 0; padding: 10px 12px; border: 1px solid #e0b4b4; background: #fdf5f5; color: #c00; font-size: 12px; }

/* ============================================================================
   관리자
   ============================================================================ */
.admin_note {
    margin: 0 0 14px; padding: 10px 12px;
    border: 1px solid #e6dcc4; background: #fdfaf3;
    font-size: 12px; color: #6b5a35; line-height: 1.6;
}
.admin_table td { padding: 6px 4px; }
.admin_table input[type=text], .admin_table select {
    border: 1px solid #ccc; padding: 3px 5px; font-size: 12px;
}
.w50 { width: 50px; }
.w70 { width: 70px; }

.form_ok {
    display: block; margin: 12px 0; padding: 10px 12px;
    border: 1px solid #bcd; background: #f5faff; color: #16609a; font-size: 12px;
}

/* ============================================================================
   메인
   ============================================================================ */
/* float 로 2열을 만들면 박스 높이가 다를 때 다음 박스가 계단식으로 밀린다.
   (콜센터 12줄 / 선거 6줄 처럼 높이 차가 크다)
   flex + wrap 으로 행 단위로 끊는다. */
/* align-items 를 stretch 로 두어 같은 줄의 두 상자가 같은 높이가 되게 한다.
   flex-start 로 두면 상자마다 내용만큼만 높아져 좌우 아래끝이 어긋난다.
   (아래 줄이 어쩌다 같아 보였던 것은 .box_body 의 min-height:150px 에
    양쪽 다 걸려서였을 뿐이다) */
.main_boxes { display: flex; flex-wrap: wrap; gap: 16px; align-items: stretch; }
.main_box {
    width: calc(50% - 8px); box-sizing: border-box;
    border: 1px solid #d3dee9; background: #fff;   /* 원본 테두리색 */

    /* 늘어난 높이를 본문이 받아 배경·테두리가 아래까지 이어지게 한다.
       이게 없으면 상자만 커지고 안쪽 .box_body 는 그대로라 빈 칸이 뜬다. */
    display: flex; flex-direction: column;
}
.main_box .box_body { flex: 1 1 auto; }
/* 원본 .solution_title */
.main_box h2 {
    padding: 5px; background-color: #fdf2e9;
    font-size: 18px; font-weight: bold; color: #2c3e50;
    text-align: center; position: relative;
}
.main_box h2 .more {
    position: absolute; right: 10px; top: 0;
    font-size: 11px; font-weight: normal; color: #999;
}
/* 원본 #boxv2 / #boxv3 — 왼쪽 위에 100x120 배경 이미지, 목록은 100px 들여쓰기 */
.main_box .box_body { min-height: 150px; overflow: hidden; }
.main_box.box_service  .box_body { background: url('/images/main_service_bg.png')  no-repeat left top; background-size: 100px 120px; }
.main_box.box_election .box_body { background: url('/images/main_solution_bg.png') no-repeat left top; background-size: 100px 120px; }
.main_box.box_service  .box_links,
.main_box.box_election .box_links { margin-left: 100px; }

/* 원본 #box_etc — 배경 없이 10px 들여쓰기 */
.box_links { margin-left: 10px; line-height: 200%; padding: 4px 0; }
.box_links li { font-size: 14px; }
.box_links li img { vertical-align: middle; }
.box_links li a { font-size: 14px; color: #3471aa; }   /* 원본 링크색 */
.box_links li a:hover { text-decoration: underline; }
.ico_dot { height: 9px; }
.icon_main_go { height: 15px; }
.notice_list li { padding: 4px 0; font-size: 12px; overflow: hidden; }
.notice_list li .date { float: right; color: #999; font-size: 11px; }
.box_empty { padding: 40px 0; text-align: center; color: #999; font-size: 12px; }

/* ── 게시판 본문 편집기 (inc/editor.js) ─────────────────────────────
   원본 cheditor5(1.3MB)를 대신하는 최소 편집기.
   기존 글 473건에 표 0건·이미지 2건뿐이라 굵게·색·크기만 둔다. */
.ed_wrap { border: 1px solid #ccc; background: #fff; }
.ed_bar {
    padding: 5px 6px; background: #f7f7f7; border-bottom: 1px solid #ddd;
    display: flex; flex-wrap: wrap; gap: 4px; align-items: center;
}
.ed_btn {
    padding: 3px 9px; font-size: 12px; line-height: 1.6;
    border: 1px solid #c8c8c8; background: #fff; color: #333;
    border-radius: 2px; cursor: pointer;
}
.ed_btn:hover { background: #eaf2fb; border-color: #8ab4e8; }
.ed_btn:active { background: #dbe8f7; }
.ed_sel {
    padding: 3px 4px; font-size: 12px; height: 26px;
    border: 1px solid #c8c8c8; background: #fff; border-radius: 2px;
}
.ed_body {
    min-height: 260px; padding: 10px; font-size: 14px; line-height: 1.7;
    overflow-y: auto; outline: none; word-break: break-all;
}
.ed_body:focus { background: #fffef8; }
