@charset "utf-8";
/* ==========================================================================
   BMTECH — 게시판 목록 (뉴스 · 홍보)
   --------------------------------------------------------------------------
   원본: webdot-blueprints/08_news/list/_code/a1_kookje_list_table-style
         (국제티엔씨 공사실적 목록)

   그누보드 기본 스킨의 표는 헤더가 짙은 회색(#3f3c3b)으로 채워져 있고
   줄마다 위아래 보더가 겹쳐 그어진다. 서브 페이지의 표(.tb2)는 이미
   에디토리얼 레이어에서 '굵은 상단선 + 헤어라인' 으로 바뀌었는데
   게시판만 옛 모습으로 남아 있었다.

   원본 클래스 매핑:
     .wd-list__search      → .bo_head          (건수 좌측 + 검색 우측)
     .wd-list__total       → #bo_list_total
     .wd-list__input       → .bo_sch_input
     .wd-list__btn-search  → .bo_sch_btn
     .wd-list__table       → #bo_list .tbl_head01
     .wd-list__td--subject → #bo_list .td_subject
     .wd-list__paginate    → .pg_wrap
     .wd-list__page-num    → .pg_page / .pg_current

   색만 --bmt-* 토큰으로 매핑하고 치수(53px 행높이·44px 인풋·38px 페이지
   버튼)는 원본 값 그대로다. 마크업 이동은 스킨 2개
   (skin/board/{news,promotion}/list.skin.php) 에만 있다.
   ========================================================================== */

/* ── 건수 + 검색 줄 ── */
.bo_head { margin-bottom: 20px; }
.bo_head::after { content: ""; display: block; clear: both; }

#bo_list_total {
  float: left;
  color: var(--bmt-muted);
  font-size: 14px;
  line-height: 44px;
}
#bo_list_total span { color: var(--bmt-body); font-weight: 600; }

#bo_sch {
  float: right;
  margin: 0;
  padding: 0;
  border: 0;
}
#bo_sch legend { position: absolute; width: 0; height: 0; overflow: hidden; font-size: 0; line-height: 0; }
#bo_sch form { display: flex; gap: 8px; }
.bo_sch_box { position: relative; display: flex; }

.bo_sch_input {
  height: 44px;
  padding: 6px 16px;
  color: var(--bmt-body);
  font-family: inherit;
  font-size: 16px;
  line-height: 1.5em;
  border: 1px solid var(--bmt-line);
  border-radius: 0;
  outline: none;
  box-sizing: border-box;
}
.bo_sch_input:focus { border-color: var(--bmt-accent); }
.bo_sch_input::placeholder { color: var(--bmt-muted); font-size: 14px; font-weight: 400; }

select.bo_sch_input {
  padding-right: 40px;
  background: var(--bmt-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23878787' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") right 14px center no-repeat;
  -webkit-appearance: none;
  appearance: none;
}
input.bo_sch_input[type="text"] { width: 300px; }

.bo_sch_btn {
  height: 44px;
  padding: 0 20px;
  font-family: inherit;
  font-size: 16px;
  color: var(--bmt-inverse);
  background: var(--bmt-ink);
  border: 1px solid var(--bmt-ink);
  border-radius: 0;
  cursor: pointer;
  white-space: nowrap;
}
.bo_sch_btn:hover { background: var(--bmt-accent); border-color: var(--bmt-accent); }

/* ── 목록 표 ── */
#bo_list .tbl_head01 { margin: 0; }
#bo_list .tbl_head01 table {
  width: 100%;
  border-collapse: collapse;
  border-top: 2px solid var(--bmt-ink);
}
#bo_list .tbl_head01 thead th {
  height: 53px;
  padding: 9px 5px;
  background: var(--bmt-surface-alt);
  border-top: 0;
  border-bottom: 1px solid var(--bmt-line);
  color: var(--bmt-ink);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5em;
  letter-spacing: -0.02em;
  text-align: center;
}
#bo_list .tbl_head01 thead a { color: var(--bmt-ink); }
#bo_list .tbl_head01 thead th.th_subject { text-align: left; padding-left: 15px; }

#bo_list .tbl_head01 td {
  height: 53px;
  padding: 9px 5px;
  border-top: 0;
  border-bottom: 1px solid var(--bmt-line);
  color: var(--bmt-body);
  font-size: 15px;
  line-height: 1.5em;
  text-align: center;
}
#bo_list .tbl_head01 .td_subject { text-align: left; padding-left: 30px; }

/* 원본은 colgroup 으로 폭을 잡는다. 그누보드 스킨엔 colgroup 이 없어 셀에 직접 준다 —
   안 주면 날짜가 '2026-' / '08-01' 로 접혀 행 높이가 53px 을 넘긴다 */
#bo_list .tbl_head01 .td_num  { width: 85px; }
#bo_list .tbl_head01 .td_name { width: 120px; }
#bo_list .tbl_head01 .td_date { width: 120px; white-space: nowrap; }
#bo_list .tbl_head01 td a { color: var(--bmt-body); text-decoration: none; }
#bo_list .tbl_head01 td a:hover { text-decoration: underline; }
#bo_list .tbl_head01 tbody tr:hover td { background-color: var(--bmt-surface-alt); }
#bo_list .tbl_head01 tr.bo_notice td { background-color: var(--bmt-surface-alt); }
#bo_list .tbl_head01 tr.bo_notice .td_num strong { color: var(--bmt-accent); font-weight: 600; }
#bo_list td.empty_table { color: var(--bmt-muted); }

/* ── 페이지네이션 ── */
.pg_wrap { clear: both; margin: 60px 0 0; padding: 0; text-align: center; }
.pg { display: inline-block; }
.pg_page, .pg_current {
  display: inline-block;
  width: 38px;
  height: 38px;
  margin: 0 3px;
  padding: 0;
  background: none;
  color: var(--bmt-body);
  font-size: 15px;
  font-weight: 500;
  line-height: 38px;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
}
.pg_current {
  background-color: var(--bmt-accent);
  border-radius: 100%;
  color: var(--bmt-inverse);
  font-weight: 600;
}
a.pg_page:hover { background-color: var(--bmt-surface-alt); }

/* ── 좁은 화면 ── */
@media screen and (max-width: 640px) {
  #bo_sch { float: none; }
  #bo_sch form { flex-wrap: wrap; }
  .bo_sch_box { flex: 1 1 auto; min-width: 0; }
  input.bo_sch_input[type="text"] { flex: 1 1 auto; min-width: 0; width: auto; }
  #bo_list_total { float: none; line-height: 2; }

  /* 글쓴이·조회는 좁은 화면에서 정보 가치가 낮다. 제목과 날짜만 남긴다 */
  #bo_list .tbl_head01 .td_name,
  #bo_list .tbl_head01 .td_num:last-child,
  #bo_list .tbl_head01 thead th:nth-child(3),
  #bo_list .tbl_head01 thead th:nth-child(5) { display: none; }
  #bo_list .tbl_head01 .td_subject { padding-left: 12px; }
  .pg_page, .pg_current { width: 30px; height: 30px; margin: 0 1px; font-size: 14px; line-height: 30px; }
}

/* ==========================================================================
   게시글 상세 (뉴스 · 홍보)
   원본: webdot-blueprints/08_news/detail/_code/a1_kookje_news-detail_standard

   그누보드 기본 읽기 화면은 제목 위에 3px 검정선, 아래 2px 검정선이 겹쳐
   들어가 표보다 무거웠다. 원본처럼 상단 굵은 선 하나 + 헤어라인 구획으로 간다.

   ⚠️ 선택자에 id 를 두 번 쓴 이유: 스킨의 style.css(add_stylesheet)가
   </head> 직전에 삽입돼 이 파일보다 뒤에 온다. `#bo_v_title` 한 겹으로는
   skin/board/news/style.css:173 의 값에 진다.

   원본 클래스 매핑:
     .wd-board-view          → #bo_v
     .wd-board-view__title   → #bo_v_title
     .wd-board-view__info    → #bo_v_info
     .wd-board-view__content → #bo_v_atc
     .wd-btn--medium         → .btn_b01 / .btn_b02 / .btn_admin
     .wd-board-view__buttons → #bo_v_bot
   ========================================================================== */

.s_wrap #bo_v {
  width: 100% !important;
  border-top: 2px solid var(--bmt-ink);
}
/* 게시판 이름을 빨간 배지로 띄우던 요소. 서브비주얼이 같은 걸 이미 말한다 */
.s_wrap #bo_v_table { display: none; }

#bo_v #bo_v_title {
  padding: 16px;
  border: 0;
  border-bottom: 1px solid var(--bmt-line);
  color: var(--bmt-ink);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.015em;
}

#bo_v #bo_v_info {
  display: flex;
  align-items: center;
  padding: 13px 16px;
  border: 0;
  border-bottom: 1px solid var(--bmt-line);
  color: var(--bmt-muted);
  font-size: 15px;
  line-height: 1.3;
}
#bo_v #bo_v_info strong {
  display: inline-block;
  margin: 0 15px 0 5px;
  color: var(--bmt-ink);
  font-weight: 500;
}

#bo_v #bo_v_atc {
  padding: 15px 16px 60px;
  border-bottom: 1px solid var(--bmt-line);
  color: var(--bmt-body);
  font-size: 16px;
  line-height: 1.8;
}
#bo_v #bo_v_atc_title { position: absolute; width: 0; height: 0; overflow: hidden; font-size: 0; line-height: 0; }
#bo_v #bo_v_con img { display: block; max-width: 100%; height: auto; margin: 0 auto; }
#bo_v #bo_v_con p { margin-bottom: 8px; }
#bo_v #bo_v_con ul { list-style: disc; margin-left: 1.25em; }
#bo_v #bo_v_con ol { list-style: decimal; margin-left: 1em; }

/* 첨부파일 · 관련링크 */
#bo_v #bo_v_file,
#bo_v #bo_v_link { padding: 14px 16px; border-bottom: 1px solid var(--bmt-line); font-size: 15px; }
/* 스킨은 이 라벨을 position:absolute 로 화면 밖에 보낸다 — 되돌려 세운다 */
#bo_v #bo_v_file h2,
#bo_v #bo_v_link h2 { position: static; display: inline-block; margin-right: 12px; color: var(--bmt-ink); font-size: 15px; font-weight: 500; line-height: 1.5; overflow: visible; }
#bo_v #bo_v_file li,
#bo_v #bo_v_link li { padding: 0; border: 0; background: none; }
#bo_v #bo_v_file a { display: inline; padding: 0; width: auto; }
#bo_v #bo_v_file ul,
#bo_v #bo_v_link ul { display: inline-block; list-style: none; margin: 0; padding: 0; vertical-align: top; }
#bo_v #bo_v_file a,
#bo_v #bo_v_link a { color: var(--bmt-body); text-decoration: none; }
#bo_v #bo_v_file a:hover,
#bo_v #bo_v_link a:hover { color: var(--bmt-accent); text-decoration: underline; }

/* 버튼 — 상단 묶음은 숨긴다. 그누보드가 같은 버튼을 위아래 두 번 그린다 */
#bo_v #bo_v_top { display: none; }
#bo_v #bo_v_bot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 20px 0 0;
}
#bo_v #bo_v_bot ul { display: flex; gap: 8px; list-style: none; margin: 0; padding: 0; }
#bo_v #bo_v_bot .bo_v_nb { margin-right: auto; }
#bo_v #bo_v_bot a {
  display: inline-block;
  height: 44px;
  padding: 0 20px;
  background: var(--bmt-surface-alt);
  border: 1px solid var(--bmt-line);
  color: var(--bmt-ink);
  font-size: 16px;
  line-height: 42px;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s, color .2s, border-color .2s;
}
#bo_v #bo_v_bot a:hover {
  background: var(--bmt-accent);
  border-color: var(--bmt-accent);
  color: var(--bmt-inverse);
}
#bo_v #bo_v_bot a.btn_b02 {
  background: var(--bmt-accent);
  border-color: var(--bmt-accent);
  color: var(--bmt-inverse);
}
#bo_v #bo_v_bot a.btn_b02:hover { background: var(--bmt-accent-hover); border-color: var(--bmt-accent-hover); }

@media screen and (max-width: 640px) {
  #bo_v #bo_v_title { padding: 14px 6px; font-size: 17px; }
  #bo_v #bo_v_info  { padding: 13px 6px; font-size: 12px; }
  #bo_v #bo_v_info strong { margin: 0 10px 0 4px; }
  #bo_v #bo_v_atc   { padding: 15px 6px 40px; }
  #bo_v #bo_v_bot a { height: 40px; padding: 0 16px; font-size: 15px; line-height: 38px; }
}