@charset "utf-8";
/* ==========================================================
   creon.kr Notice(뉴스룸) 스킨 — 2026.07 리디자인
   목록(.nt_list) / 본문(.nt_view) 공용 시트
   포인트 컬러 #2188d8, 서체는 테마 공통(Noto Sans KR)
   ========================================================== */

.nt_wrap { max-width: 1080px; margin: 0 auto; padding: 70px 20px 110px; letter-spacing: -0.3px; }
.nt_wrap, .nt_wrap * { box-sizing: border-box; }

/* ---------- 페이지 헤더 ---------- */
.nt_head { text-align: center; margin-bottom: 52px; }
.nt_head .nt_label { display: inline-block; font-family: 'Pretendard', 'Open Sans', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 4px; color: #2188d8; text-transform: uppercase; margin-bottom: 14px; }
.nt_head h2 { font-size: 34px; font-weight: 700; color: #111; line-height: 1.25; margin: 0 0 12px; }
.nt_head .nt_desc { font-size: 15px; font-weight: 300; color: #888; margin: 0; }

/* ---------- 툴바 : 카테고리 탭 + 검색 ---------- */
.nt_toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding-bottom: 18px; border-bottom: 2px solid #111; margin-bottom: 0; }
.nt_tabs { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.nt_tabs li { margin: 0; padding: 0; }
.nt_tabs a { display: inline-block; padding: 8px 18px; border: 1px solid #ddd; border-radius: 30px; font-size: 14px; color: #666; text-decoration: none; transition: all .2s; background: #fff; }
.nt_tabs a:hover { border-color: #2188d8; color: #2188d8; }
.nt_tabs a#bo_cate_on, .nt_tabs a.nt_on { background: #111; border-color: #111; color: #fff; font-weight: 500; }

.nt_sch { display: flex; align-items: center; gap: 0; }
.nt_sch select { height: 40px; padding: 0 10px; border: 1px solid #ddd; border-right: 0; border-radius: 20px 0 0 20px; font-size: 13px; color: #666; background: #fff; outline: none; }
.nt_sch .nt_sch_inner { position: relative; }
.nt_sch input[type=text] { height: 40px; width: 180px; padding: 0 42px 0 16px; border: 1px solid #ddd; border-radius: 0 20px 20px 0; font-size: 14px; color: #333; outline: none; transition: border-color .2s; }
.nt_sch input[type=text]:focus { border-color: #2188d8; }
.nt_sch .nt_sch_btn { position: absolute; right: 4px; top: 4px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: transparent; color: #999; cursor: pointer; transition: all .2s; }
.nt_sch .nt_sch_btn:hover { background: #2188d8; color: #fff; }

/* 총 게시물 + 관리자 버튼 줄 */
.nt_meta_bar { display: flex; align-items: center; justify-content: space-between; padding: 14px 4px; font-size: 13px; color: #999; }
.nt_meta_bar .nt_total strong { color: #2188d8; font-weight: 600; }
.nt_adm_btns { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; }
.nt_adm_btns li { margin: 0; position: relative; }
.nt_adm_btns a, .nt_adm_btns button { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 1px solid #e5e5e5; border-radius: 8px; background: #fff; color: #888; font-size: 13px; cursor: pointer; text-decoration: none; transition: all .2s; }
.nt_adm_btns a:hover, .nt_adm_btns button:hover { border-color: #2188d8; color: #2188d8; }
.nt_adm_btns .more_opt { display: none; position: absolute; top: 40px; right: 0; z-index: 50; min-width: 130px; background: #fff; border: 1px solid #e5e5e5; border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.09); list-style: none; padding: 6px; margin: 0; }
.nt_adm_btns .more_opt li { width: 100%; }
.nt_adm_btns .more_opt button { width: 100%; height: auto; border: 0; padding: 9px 12px; justify-content: flex-start; gap: 8px; font-size: 13px; border-radius: 6px; }
.nt_adm_btns .more_opt button:hover { background: #f4f8fc; }

/* ---------- 뉴스 목록 ---------- */
.nt_list { list-style: none; margin: 0; padding: 0; border-top: 1px solid #eee; }
.nt_list > li { display: flex; align-items: center; margin: 0; padding: 0; border-bottom: 1px solid #eee; }
.nt_list > li.nt_empty { display: block; }
.nt_item { position: relative; display: flex; flex: 1 1 auto; min-width: 0; align-items: center; gap: 34px; padding: 30px 10px; text-decoration: none; transition: background .2s; }
.nt_item:hover { background: #fafcfe; }

/* 관리자 체크박스 */
.nt_chk { flex: 0 0 auto; padding-left: 6px; }
.nt_chk input { width: 16px; height: 16px; accent-color: #2188d8; cursor: pointer; }

/* 날짜 블록 */
.nt_date { flex: 0 0 74px; text-align: center; color: #111; }
.nt_date .nt_d { display: block; font-family: 'Pretendard', 'Open Sans', sans-serif; font-size: 32px; font-weight: 700; line-height: 1; letter-spacing: 0; }
.nt_date .nt_ym { display: block; font-family: 'Pretendard', 'Open Sans', sans-serif; font-size: 12.5px; font-weight: 400; color: #aaa; margin-top: 7px; letter-spacing: .5px; }
.nt_item:hover .nt_date .nt_d { color: #2188d8; }

/* 본문 영역 */
.nt_body { flex: 1 1 auto; min-width: 0; }
.nt_badges { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.nt_badge { display: inline-block; padding: 4px 11px; border-radius: 4px; font-size: 12px; font-weight: 500; line-height: 1.4; background: #eef5fc; color: #2188d8; }
.nt_badge.nt_badge_press { background: #f3f3f3; color: #666; }
.nt_badge.nt_badge_notice { background: #2188d8; color: #fff; }
.nt_tit { display: block; font-size: 19px; font-weight: 500; color: #222; line-height: 1.45; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; transition: color .2s; }
.nt_item:hover .nt_tit { color: #2188d8; }
.nt_tit .nt_new { display: inline-block; vertical-align: 3px; margin-left: 6px; width: 6px; height: 6px; border-radius: 50%; background: #e8590c; }
.nt_tit .nt_cmt { font-size: 13px; color: #2188d8; font-weight: 600; margin-left: 6px; }
.nt_info { margin-top: 9px; font-size: 13px; color: #aaa; }
.nt_info span + span::before { content: ""; display: inline-block; width: 1px; height: 10px; background: #e0e0e0; margin: 0 10px; vertical-align: -1px; }

/* 화살표 */
.nt_arrow { flex: 0 0 46px; height: 46px; display: flex; align-items: center; justify-content: center; border: 1px solid #e8e8e8; border-radius: 50%; color: #bbb; font-size: 14px; transition: all .25s; }
.nt_item:hover .nt_arrow { background: #2188d8; border-color: #2188d8; color: #fff; transform: translateX(4px); }

/* 빈 목록 */
.nt_empty { padding: 90px 0; text-align: center; color: #aaa; font-size: 15px; }
.nt_empty i { display: block; font-size: 34px; color: #ddd; margin-bottom: 14px; }

/* ---------- 페이지네이션 오버라이드 ---------- */
.nt_wrap .pg_wrap { float: none; display: block; text-align: center; margin-top: 46px; }
.nt_wrap .pg { display: inline-flex; align-items: center; gap: 5px; }
.nt_wrap .pg_page, .nt_wrap .pg_current { background: #fff; border: 0; height: 38px; min-width: 38px; line-height: 38px; padding: 0; border-radius: 50%; font-size: 14px; color: #888; }
.nt_wrap .pg_page:hover { background: #f2f6fa; color: #2188d8; }
.nt_wrap .pg_current { background: #111; color: #fff; font-weight: 600; }
.nt_wrap .pg_start, .nt_wrap .pg_prev, .nt_wrap .pg_next, .nt_wrap .pg_end { background: #fff !important; border: 1px solid #e5e5e5 !important; border-radius: 50%; text-indent: 0; overflow: hidden; }

/* ==========================================================
   본문(view)
   ========================================================== */
.nt_view { max-width: 860px; margin: 0 auto; padding: 70px 20px 110px; letter-spacing: -0.3px; }
.nt_view, .nt_view * { box-sizing: border-box; }

.nt_v_head { text-align: center; padding-bottom: 34px; border-bottom: 1px solid #eee; margin-bottom: 44px; }
.nt_v_head .nt_badges { justify-content: center; margin-bottom: 18px; }
.nt_v_head h2 { font-size: 30px; font-weight: 700; color: #111; line-height: 1.4; margin: 0 0 20px; word-break: keep-all; }
.nt_v_meta { font-size: 14px; color: #999; }
.nt_v_meta span + span::before { content: ""; display: inline-block; width: 1px; height: 11px; background: #ddd; margin: 0 12px; vertical-align: -1px; }
.nt_v_meta i { margin-right: 5px; color: #bbb; }

.nt_v_con { font-size: 16px; font-weight: 300; line-height: 1.85; color: #333; min-height: 200px; }
.nt_v_con img { max-width: 100%; height: auto; }

/* 첨부파일 / 관련링크 */
.nt_v_files { margin-top: 44px; border: 1px solid #eee; border-radius: 12px; padding: 8px 22px; }
.nt_v_files h3 { font-size: 13px; font-weight: 600; color: #888; margin: 14px 0 4px; }
.nt_v_files ul { list-style: none; margin: 0; padding: 0; }
.nt_v_files li { padding: 10px 0; border-top: 1px solid #f4f4f4; font-size: 14px; }
.nt_v_files li:first-child { border-top: 0; }
.nt_v_files a { color: #333; text-decoration: none; }
.nt_v_files a:hover { color: #2188d8; text-decoration: underline; }
.nt_v_files i { color: #2188d8; margin-right: 8px; }
.nt_v_files .nt_v_file_sub { display: block; margin-top: 3px; font-size: 12px; color: #aaa; }

/* 하단 버튼 */
.nt_v_btns { display: flex; justify-content: center; gap: 8px; margin-top: 50px; }
.nt_v_btns a { display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 30px; border-radius: 30px; font-size: 14px; text-decoration: none; transition: all .2s; }
.nt_v_btns .nt_btn_list { background: #111; color: #fff; }
.nt_v_btns .nt_btn_list:hover { background: #2188d8; }
.nt_v_btns .nt_btn_line { border: 1px solid #ddd; color: #666; background: #fff; }
.nt_v_btns .nt_btn_line:hover { border-color: #2188d8; color: #2188d8; }

/* 이전/다음 글 */
.nt_v_nav { margin-top: 60px; border-top: 1px solid #eee; list-style: none; padding: 0; }
.nt_v_nav li { border-bottom: 1px solid #eee; }
.nt_v_nav a { display: flex; align-items: center; gap: 18px; padding: 19px 8px; text-decoration: none; color: #444; font-size: 15px; transition: background .2s; }
.nt_v_nav a:hover { background: #fafcfe; color: #2188d8; }
.nt_v_nav .nt_v_nav_label { flex: 0 0 auto; font-size: 12.5px; font-weight: 600; color: #999; letter-spacing: 1px; text-transform: uppercase; }
.nt_v_nav .nt_v_nav_label i { margin-right: 6px; }
.nt_v_nav .nt_v_nav_tit { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nt_v_nav .nt_v_nav_date { flex: 0 0 auto; font-size: 13px; color: #bbb; }

/* ---------- 반응형 ---------- */
@media (max-width: 900px) {
  .nt_wrap { padding: 50px 16px 80px; }
  .nt_head h2 { font-size: 28px; }
  .nt_item { gap: 20px; padding: 24px 4px; }
  .nt_arrow { display: none; }
}
@media (max-width: 640px) {
  .nt_head { margin-bottom: 36px; }
  .nt_head h2 { font-size: 24px; }
  .nt_toolbar { flex-direction: column; align-items: stretch; }
  .nt_sch { width: 100%; }
  .nt_sch .nt_sch_inner { flex: 1 1 auto; }
  .nt_sch input[type=text] { width: 100%; }
  .nt_item { gap: 16px; padding: 22px 2px; }
  .nt_date { flex-basis: 56px; }
  .nt_date .nt_d { font-size: 24px; }
  .nt_date .nt_ym { font-size: 11px; margin-top: 5px; }
  .nt_tit { font-size: 16px; }
  .nt_info { margin-top: 7px; font-size: 12px; }
  .nt_view { padding: 50px 16px 80px; }
  .nt_v_head h2 { font-size: 22px; }
  .nt_v_meta span + span::before { margin: 0 8px; }
  .nt_v_con { font-size: 15px; }
  .nt_v_nav a { gap: 12px; font-size: 14px; }
  .nt_v_btns a { padding: 0 24px; height: 42px; }
}