/* 블로그 목록·글 보기 — 옛 게시판(공지·QnA) 표 모양을 따른다 */
.blogpage .boardwrap .bl-wrap { background-color: #eee; padding: 30px 0 60px; min-height: 300px; }
.blogpage .boardwrap .bl-wrap > * { margin-left: 20px; margin-right: 20px; }
.blogpage h1.maintit { text-align: center; font-family: Pretendard-Medium; font-size: 2.25rem; line-height: 1.35; padding: 0 20px; }

.bl-list { font-family: 'Pretendard-Regular', 'Malgun Gothic', dotum, sans-serif; font-size: 0.9rem; color: #333; }
.bl-total { margin: 0 0 10px; color: #666; font-size: 0.85rem; }
.bl-list .tbl_wrap table { width: 100%; border-collapse: collapse; border: 1px solid #ccc; background: #fff; }
.bl-list caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.bl-list thead th { padding: 10px 0; font-weight: normal; text-align: center; border-bottom: 1px solid #ddd; background: #fafafa; height: 40px; }
.bl-list .th_num { width: 80px; }
.bl-list .th_date { width: 120px; }
.bl-list td { color: #666; background: #fff; padding: 14px 10px; border-top: 1px solid #ecf0f1; line-height: 1.5em; height: 60px; word-break: keep-all; }
.bl-list tbody tr:hover td { background: #fafafa; }
.bl-list .td_num, .bl-list .td_datetime { text-align: center; }
.bl-list .td_datetime { font-style: italic; }
.bl-list .td_subject a { color: #333; font-family: 'Pretendard-Medium', 'Malgun Gothic', sans-serif; }
.bl-list .td_subject a:hover { text-decoration: underline; }
.bl-list .bl-sum { margin-top: 4px; color: #888; font-size: 0.82rem; }
.bl-list .empty_table { padding: 50px 0; text-align: center; }

.bl-list .pg_wrap { margin: 30px 0 0; text-align: center; }
.bl-list .pg_page, .bl-list .pg_current { display: inline-block; vertical-align: middle; min-width: 30px; height: 30px; line-height: 28px; margin: 0 2px; padding: 0 6px; border-radius: 3px; font-size: 0.85rem; }
.bl-list .pg_page { color: #555; background: #f3f3f3; border: 1px solid #bbbcc3; text-decoration: none; }
.bl-list .pg_page:hover { background-color: #ddd; }
.bl-list .pg_current { color: #fff; background: var(--primary, #633d8c); border: 1px solid var(--primary, #633d8c); font-weight: bold; }

.bl-view { background: #fff; border: 1px solid #ccc; padding: 30px 40px 40px; font-family: 'Pretendard-Regular', 'Malgun Gothic', dotum, sans-serif; color: #333; }
.bl-view .bl-info { padding: 0 0 15px; margin: 0 0 30px; border-bottom: 1px solid #ddd; color: #666; font-size: 0.85rem; display: flex; flex-wrap: wrap; gap: 4px 14px; }
.bl-view .bl-date { font-style: italic; color: #888; }
.bl-view .bl-con { font-size: 1rem; line-height: 1.8; word-break: keep-all; overflow-wrap: anywhere; }
.bl-view .bl-con p { margin: 0 0 1em; }
.bl-view .bl-con h2, .bl-view .bl-con h3, .bl-view .bl-con h4 { font-family: 'Pretendard-Medium', sans-serif; margin: 1.6em 0 0.6em; line-height: 1.4; text-align: left; }
.bl-view .bl-con h2 { font-size: 1.35rem; }
.bl-view .bl-con h3 { font-size: 1.15rem; }
.bl-view .bl-con h4 { font-size: 1.05rem; font-family: 'Pretendard-Medium', sans-serif; }
.bl-view .bl-con ul, .bl-view .bl-con ol { margin: 0 0 1em 1.4em; }
.bl-view .bl-con ul li { list-style: disc; }
.bl-view .bl-con ol li { list-style: decimal; }
.bl-view .bl-con img, .bl-view .bl-con video { max-width: 100%; height: auto; }
.bl-view .bl-con table { width: 100%; border-collapse: collapse; margin: 0 0 1em; }
.bl-view .bl-con th, .bl-view .bl-con td { border: 1px solid #ddd; padding: 8px; }
.bl-view .bl-con a { color: var(--primary2, #8a63b5); text-decoration: underline; }
.bl-view .bl-con blockquote { border-left: 3px solid #ddd; padding-left: 1em; color: #666; }
.bl-view .bl-nb { margin: 30px 0 0; border-top: 1px solid #ddd; }
.bl-view .bl-nb li { list-style: none; padding: 12px 0; border-bottom: 1px solid #eee; font-size: 0.9rem; }
.bl-view .bl-nb .nb_tit { display: inline-block; width: 70px; color: #888; }
.bl-view .bl-nb a { color: #333; }
.bl-view .bl-btns { margin-top: 25px; text-align: right; }
.bl-view .bl-btn-list { display: inline-block; padding: 8px 20px; border: 1px solid #ccc; border-radius: 3px; background: #f3f3f3; color: #333; font-size: 0.9rem; }

@media all and (max-width: 860px) {
  .lnb:has(> .blog_lnb) { display: none; }
  .blogpage h1.maintit { font-size: 2rem; }
}
@media all and (max-width: 540px) {
  .blogpage h1.maintit { font-size: 1.5rem; }
  .blogpage .boardwrap .bl-wrap > * { margin-left: 10px; margin-right: 10px; }
  .bl-list .th_num, .bl-list .td_num { display: none; }
  .bl-list .th_date { width: 86px; }
  .bl-list td { padding: 12px 8px; }
  .bl-view { padding: 20px 16px 30px; }
}