@charset "utf-8";
/*
 * PC 게시판 다듬기 — 배치·구조는 그대로 두고 글꼴·색·간격·버튼·입력칸 모양만 정리한다.
 * theme/dm/head.sub.php 에서 PC(모바일 아님)의 게시판 페이지(board.php, write.php)에만 custom.css 다음에 불러온다.
 * 대상: skin/board/basic(고객지원 목록·글보기·글쓰기), skin/board/gallery(설치사례), theme/dm/skin/board/gallery(제품)
 * 색: 본문 #222 / 보조 #666·#888 / 선 #e5e8ec / 강조(기존 메뉴 활성색) #008299 / 주요 버튼 #333
 */

#bo_list, #bo_gall, #bo_v, #bo_w {color:#222;word-break:keep-all;letter-spacing:-0.01em}

/* ---------- 공통 버튼 (글쓰기·목록·수정·삭제 등) ---------- */
#bo_list .btn_bo_user a, #bo_gall .btn_bo_user a,
#bo_v .btn_b01, #bo_v .btn_b02,
#bo_list .btn_b01, #bo_gall .btn_b01 {
  display:inline-flex;align-items:center;justify-content:center;gap:5px;height:38px;padding:0 16px;
  border:1px solid #cfd4da;border-radius:4px;background:#fff;color:#333;font-size:14px;line-height:1;
  text-decoration:none;white-space:nowrap;transition:background .15s,border-color .15s}
#bo_list .btn_bo_user a.btn_b02, #bo_gall .btn_bo_user a.btn_b02, #bo_v .btn_b02 {border-color:#333;background:#333;color:#fff}
#bo_list .btn_bo_user a:hover, #bo_gall .btn_bo_user a:hover, #bo_v .btn_b01:hover {border-color:#333;background:#f6f7f9}
#bo_list .btn_bo_user a.btn_b02:hover, #bo_gall .btn_bo_user a.btn_b02:hover, #bo_v .btn_b02:hover {background:#111}

/* ---------- 목록 상단: 합계 ---------- */
#bo_list_total {height:auto;padding:0;background:none;color:#888;font-size:14px;line-height:38px}
#bo_list_total span {display:inline;padding:0;margin:0 4px 0 0;border-radius:0;background:none;color:#333;font-weight:500}

/* ---------- 목록 표 ---------- */
#bo_list .tbl_head01 table {border-top:2px solid #333}
#bo_list .tbl_head01 thead th {height:50px;padding:0 10px;border-top:0;border-bottom:1px solid #dfe3e8;background:#f7f8fa;
  color:#444;font-size:14px;font-weight:500}
#bo_list .tbl_head01 thead th a {color:#444}
#bo_list .tbl_head01 td {height:54px;padding:0 10px;border-top:0;border-bottom:1px solid #eceef1;color:#666;font-size:14px}
#bo_list tbody tr:hover {background:#f8fafc}
#bo_list .bo_tit, #bo_list .bo_tit a {color:#222;font-size:15px;font-weight:500}
#bo_list .bo_tit a:hover {color:#008299;text-decoration:none}
#bo_list .td_num, #bo_list .td_num2 {color:#999;font-size:13px}
#bo_list .td_date, #bo_list .td_datetime {font-style:normal;color:#888;font-size:13px}
#bo_list .td_name {color:#555}
#bo_list .bo_notice td {background:#f9fbfc}
#bo_list .bo_tit .fa-download, #bo_list .bo_tit .fa-lock, #bo_list .bo_tit .fa-link {color:#9aa3ad}

/* ---------- 검색 ---------- */
#bo_sch {border:1px solid #cfd4da;border-radius:4px;overflow:hidden}
#bo_sch select {color:#333;font-size:14px}
#bo_sch .sch_input {font-size:14px;color:#222}
#bo_sch .sch_btn {color:#555}
/* 제품 게시판 검색(select + 입력칸 + 검색 버튼) */
#bo_gall #bo_sch form, #bo_sch form:has(.btn_submit) {display:inline-flex;align-items:center;gap:6px}
#bo_sch form:has(.btn_submit) {border:0}
#bo_sch:has(.btn_submit) {border:0;overflow:visible}
#bo_sch form:has(.btn_submit) select,
#bo_sch form:has(.btn_submit) .frm_input {height:40px;padding:0 10px;border:1px solid #cfd4da;border-radius:4px;background-color:#fff;font-size:14px;box-sizing:border-box}
#bo_sch form:has(.btn_submit) .frm_input {width:220px}
#bo_sch form:has(.btn_submit) .btn_submit {height:40px;padding:0 18px;border:0;border-radius:4px;background:#333;color:#fff;font-size:14px;cursor:pointer}

/* ---------- 페이지 번호 ---------- */
.pg_wrap {padding-top:28px}
.pg_wrap .pg_page, .pg_wrap .pg_current {min-width:34px;height:34px;margin:0 2px;padding:0 8px;border:1px solid #dde1e6;border-radius:4px;
  background:#fff;color:#555;font-size:14px;line-height:32px;text-align:center;box-sizing:border-box}
.pg_wrap .pg_page:hover {border-color:#333;color:#111}
.pg_wrap .pg_current {border-color:#333;background:#333;color:#fff;font-weight:500}

/* ---------- 글 보기 ---------- */
#bo_v_title .bo_v_tit {font-size:28px;font-weight:500;line-height:1.4;letter-spacing:-0.03em;color:#111}
#bo_v_info {padding:12px 0 16px;border-bottom:1px solid #e5e8ec;color:#888;font-size:13px}
#bo_v_info strong {font-weight:400;color:#777}
#bo_v_info .sv_member, #bo_v_info .sv_guest {font-weight:500;color:#333}
#bo_v_info .if_date {font-style:normal;color:#999}
#bo_v_con {color:#333;font-size:16px;line-height:1.8}
#bo_v_file, #bo_v_link {border:1px solid #e5e8ec;border-radius:4px;overflow:hidden}
#bo_v_file h2, #bo_v_link h2 {background:#f7f8fa;color:#333;font-weight:500}
#bo_v_file a, #bo_v_link a {color:#1f5fa8;font-weight:500}
#bo_v_top {margin:20px 0 12px}
/* 이전글·다음글 */
.bo_v_nb {border:1px solid #e5e8ec;border-radius:4px;overflow:hidden}
.bo_v_nb li {padding:14px 16px;border:0;border-top:1px solid #eef0f3}
.bo_v_nb li:first-child {border-top:0}
.bo_v_nb li:hover {background:#f8fafc}
.bo_v_nb li .nb_tit {color:#888;font-size:14px}
.bo_v_nb li a {color:#222;font-size:15px}
.bo_v_nb li .nb_date {color:#999;font-size:13px}
/* 댓글 */
#bo_vc h2, .cmt_btn {color:#333}
.cmt_btn {font-size:16px;font-weight:500}
.cmt_btn i {color:#008299}

/* ---------- 글쓰기 ---------- */
#bo_w .frm_input {height:44px;padding:0 12px;border:1px solid #d5dbe0;border-radius:4px;background-color:#fff;color:#222;font-size:15px;box-sizing:border-box}
#bo_w textarea, #bo_w #wr_content {width:100%;max-width:100%;padding:12px 14px;border:1px solid #d5dbe0;border-radius:4px;color:#222;
  font-size:15px;line-height:1.7;box-sizing:border-box}
#bo_w .frm_input:focus, #bo_w textarea:focus {border-color:#333;outline:0}
/* 필수칸: 테마가 회색 배경을 !important 로 강제 → 필수 표시(모서리 삼각형)는 두고 배경만 흰색으로 맞춘다 */
#bo_w .frm_input.required, #bo_w textarea.required {background-color:#fff !important}
#bo_w input[type=checkbox] {width:16px;height:16px;vertical-align:middle}
#bo_w label {color:#444}
#bo_w #captcha #captcha_key {height:46px;border:1px solid #d5dbe0;border-radius:4px;font-size:18px}
#bo_w .btn_confirm {margin:24px 0 10px;text-align:center}
#bo_w .btn_confirm .btn_cancel,
#bo_w .btn_confirm .btn_submit {display:inline-flex;align-items:center;justify-content:center;min-width:130px;height:48px;margin:0 3px;padding:0 20px;
  border-radius:4px;font-size:16px;line-height:1;text-decoration:none;box-sizing:border-box;vertical-align:middle;cursor:pointer}
#bo_w .btn_confirm .btn_cancel {border:1px solid #cfd4da;background:#fff;color:#333}
#bo_w .btn_confirm .btn_submit {border:1px solid #333;background:#333;color:#fff;font-weight:500}

/* ---------- 설치사례 카드 (skin/board/gallery) ---------- */
#bo_gall .gall_box {border:1px solid #e3e6ea;border-radius:4px;overflow:hidden;transition:box-shadow .2s,border-color .2s}
#bo_gall .gall_box:hover {border-color:#cfd4da;box-shadow:0 6px 18px rgba(0,0,0,.08)}
#bo_gall .gall_text_href a, #bo_gall .bo_tit {color:#222;font-size:15px;font-weight:500}
#bo_gall .gall_name {color:#777;font-size:13px}
#bo_gall .gall_info {background:#f7f8fa;color:#888;font-size:13px}
#bo_gall .gall_info .gall_date, #bo_gall .gall_date {font-style:normal}

/* ---------- 제품 카드 (theme/dm/skin/board/gallery) — 제목 줄 hover 파란색 효과(custom.css)는 그대로 ---------- */
#bo_gall .gall_con li.gall_href {border-color:#dde1e6}
#bo_gall .gall_con li.gall_text_href {border-color:#dde1e6;background:#f3f5f7;transition:background .15s}
#bo_gall .gall_con li.gall_text_href a {color:#333}
#bo_gall .gall_con li.gall_text_href:hover a {color:#fff}
/* 검색어 칸: 필수칸 회색 배경(!important) 대신 흰색 */
#bo_sch .frm_input.required {background-color:#fff !important}