/**
 * 하키러브 기본 게시판 — 모던 오버라이드 (2026-10-03)
 * modules/board/skins/default 를 브랜드 토큰으로 재스킨
 */
#wrapper .board,
#wrapper .board label,
#wrapper .board table,
#wrapper .board input,
#wrapper .board button,
#wrapper .board textarea,
#wrapper .board select {
	font-family: "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif !important;
	font-size: 14px;
	color: var(--hl-ink, #111827);
}

#wrapper .board {
	letter-spacing: -0.01em;
}

/* ---------- 분류 탭 ---------- */
#wrapper .board .cTab {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 18px !important;
	padding: 0 0 12px !important;
	list-style: none;
	border-bottom: 1px solid var(--hl-line, #E5E7EB) !important;
	background: none !important;
}
#wrapper .board .cTab:after {
	display: none;
}
#wrapper .board .cTab > li {
	float: none !important;
	margin: 0 !important;
	border: 0 !important;
}
#wrapper .board .cTab > li > a {
	float: none !important;
	top: 0 !important;
	display: inline-flex;
	align-items: center;
	height: auto !important;
	line-height: 1.2 !important;
	padding: 8px 14px !important;
	border: 1px solid transparent !important;
	border-radius: 999px;
	font-size: 13px !important;
	font-weight: 600 !important;
	font-family: inherit !important;
	color: var(--hl-soft, #6B7280) !important;
	background: transparent;
	text-decoration: none !important;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
#wrapper .board .cTab > li > a:hover {
	color: var(--hl-ink, #111827) !important;
	background: var(--hl-fog, #F3F5F7);
}
#wrapper .board .cTab > li.on {
	border: 0 !important;
	margin-bottom: 0 !important;
}
#wrapper .board .cTab > li.on > a {
	color: #fff !important;
	background: var(--hl-blue, #2563EB) !important;
	border-color: var(--hl-blue, #2563EB) !important;
}
#wrapper .board .cTab > li.on ul {
	position: static !important;
	display: flex !important;
	flex-wrap: wrap;
	gap: 4px;
	width: 100%;
	margin: 8px 0 0 !important;
	padding: 0 !important;
}
#wrapper .board .cTab > li.on ul li {
	float: none !important;
	display: inline-flex !important;
	border: 0 !important;
	padding: 0 !important;
}
#wrapper .board .cTab > li.on ul li a {
	padding: 5px 10px !important;
	border-radius: 6px;
	font-size: 12px !important;
	color: var(--hl-soft, #6B7280) !important;
}
#wrapper .board .cTab > li.on ul li.on_ a {
	color: var(--hl-blue, #2563EB) !important;
	font-weight: 700 !important;
	background: rgba(37, 99, 235, 0.08);
}

/* ---------- 목록 = 홈 위젯 미리보기 스타일 ---------- */
#wrapper .board .board_list {
	background: #fff !important;
	border: 1px solid var(--hl-line, #E5E7EB);
	border-radius: 0;
	overflow: hidden;
	padding: 4px 16px 8px;
}
#wrapper .board .board_list table,
#wrapper .board .board_list thead,
#wrapper .board .board_list tbody,
#wrapper .board .board_list tr,
#wrapper .board .board_list th,
#wrapper .board .board_list td {
	display: block;
	width: auto;
	border: 0 !important;
	background: none !important;
}
#wrapper .board .board_list table {
	width: 100%;
}
#wrapper .board .board_list thead {
	display: none !important; /* 홈 미리보기처럼 헤더 컬럼 숨김 */
}
#wrapper .board .board_list tbody tr {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	margin: 0;
	padding: 10px 0 9px;
	border-bottom: 1px solid var(--hl-line, #E5E7EB) !important;
	box-sizing: border-box;
}
#wrapper .board .board_list tbody tr:last-child {
	border-bottom: 0 !important;
}
#wrapper .board .board_list tbody tr:hover {
	background: transparent;
}
#wrapper .board .board_list td {
	padding: 0 !important;
	margin: 0;
	font-size: 14px !important;
	line-height: 1.45 !important;
	color: var(--hl-soft, #6B7280) !important;
	white-space: nowrap;
}
/* 번호·조회·추천·체크 등 숨김 — 제목 중심 미리보기 */
#wrapper .board .board_list td.no,
#wrapper .board .board_list td.readNum,
#wrapper .board .board_list td.voteNum,
#wrapper .board .board_list td.lastReply,
#wrapper .board .board_list td.check,
#wrapper .board .board_list td.module_title {
	display: none !important;
}
#wrapper .board .board_list td.notice {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	order: 0;
	min-width: 36px;
	height: 22px;
	padding: 0 8px !important;
	border-radius: 4px;
	background: rgba(220, 38, 38, 0.08) !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	color: var(--hl-red, #DC2626) !important;
	letter-spacing: -0.02em;
}
#wrapper .board .board_list td.title {
	flex: 1 1 auto;
	order: 1;
	min-width: 0;
	width: auto !important;
	white-space: nowrap !important;
	overflow: hidden;
	text-overflow: ellipsis;
}
#wrapper .board .board_list td.title a {
	font-size: 14px !important;
	font-weight: 500 !important;
	color: var(--hl-ink, #111827) !important;
	text-decoration: none !important;
}
#wrapper .board .board_list td.title a:hover {
	color: var(--hl-blue, #2563EB) !important;
}
#wrapper .board .board_list tr.notice td.title a {
	font-weight: 700 !important;
}
#wrapper .board .board_list a.replyNum,
#wrapper .board .board_list a.trackbackNum {
	margin-left: 4px;
	font-size: 12px !important;
	font-weight: 700 !important;
	color: var(--hl-blue, #2563EB) !important;
	text-decoration: none !important;
}
#wrapper .board .board_list td.author {
	flex: 0 0 auto;
	order: 2;
	max-width: 88px;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: right;
	font-size: 12px !important;
}
#wrapper .board .board_list td.author a {
	color: var(--hl-soft, #6B7280) !important;
	text-decoration: none !important;
	font-size: 12px !important;
}
#wrapper .board .board_list td.author a:hover {
	color: var(--hl-ink, #111827) !important;
}
#wrapper .board .board_list td.time {
	flex: 0 0 72px;
	order: 3;
	text-align: right;
	font-size: 12px !important;
	font-family: inherit !important;
	color: var(--hl-soft, #6B7280) !important;
}
#wrapper .board .board_list tbody tr td[colspan] {
	display: block !important;
	width: 100%;
	padding: 36px 0 !important;
	text-align: center;
	color: var(--hl-soft, #6B7280) !important;
}

/* ---------- 목록 푸터: 페이지·검색·버튼 ---------- */
#wrapper .board .list_footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	margin: 18px 0 8px !important;
}
#wrapper .board .list_footer:after {
	display: none;
}
#wrapper .board .list_footer .pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
	float: none !important;
	margin: 0 !important;
	order: 2;
	width: 100%;
	justify-content: center;
	padding: 4px 0 2px;
}
#wrapper .board .list_footer .pagination a,
#wrapper .board .list_footer .pagination strong {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	height: 32px;
	padding: 0 10px;
	border-radius: 8px;
	font-size: 13px !important;
	font-weight: 600;
	color: var(--hl-soft, #6B7280) !important;
	text-decoration: none !important;
	background: transparent;
	border: 1px solid transparent;
}
#wrapper .board .list_footer .pagination a:hover {
	background: var(--hl-fog, #F3F5F7);
	color: var(--hl-ink, #111827) !important;
}
#wrapper .board .list_footer .pagination strong {
	color: #fff !important;
	background: var(--hl-blue, #2563EB) !important;
	border-color: var(--hl-blue, #2563EB);
}
#wrapper .board .list_footer .pagination .direction {
	font-size: 12px !important;
	color: var(--hl-soft, #6B7280) !important;
}
#wrapper .board .list_footer .pagination .direction span {
	display: none;
}

#wrapper .board .list_footer .btnArea {
	float: none !important;
	margin: 0 0 0 auto !important;
	order: 1;
	display: flex;
	gap: 8px;
}
#wrapper .board .list_footer .bsToggle {
	float: none !important;
	order: 0;
	width: auto !important;
	height: 36px !important;
	padding: 0 14px !important;
	overflow: visible !important;
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	border-radius: 8px;
	background: #fff !important;
	color: var(--hl-ink, #111827) !important;
	font-size: 13px !important;
	font-weight: 600;
	cursor: pointer;
}
#wrapper .board .list_footer .board_search {
	float: none !important;
	order: 0;
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0 !important;
}
#wrapper .board .list_footer .board_search .iText {
	width: 160px !important;
	height: 36px !important;
	padding: 0 12px !important;
	line-height: 36px !important;
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	border-radius: 8px !important;
	background: #fff !important;
	font-size: 13px !important;
}
#wrapper .board .list_footer .board_search select {
	position: static !important;
	top: auto !important;
	left: auto !important;
	width: auto !important;
	height: 36px !important;
	padding: 0 10px !important;
	border: 1px solid var(--hl-line, #E5E7EB);
	border-radius: 8px;
	background: #fff;
	font-size: 13px !important;
}
#wrapper .board .list_footer .tagSearch {
	order: 0;
	display: inline-flex !important;
	align-items: center;
	width: auto !important;
	height: 36px !important;
	padding: 0 12px !important;
	overflow: visible !important;
	border: 1px solid var(--hl-line, #E5E7EB);
	border-radius: 8px;
	background: #fff !important;
	color: var(--hl-soft, #6B7280) !important;
	font-size: 13px !important;
	font-weight: 600;
	text-decoration: none !important;
}

/* ---------- 공통 버튼 ---------- */
#wrapper .board a.btn,
#wrapper .board button.btn,
#wrapper .board input.btn,
#wrapper .board .btnArea a.btn,
#wrapper .board .btnArea button.btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-height: 36px;
	padding: 0 14px !important;
	margin: 0 !important;
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	border-radius: 8px !important;
	background: #fff !important;
	color: var(--hl-ink, #111827) !important;
	font-size: 13px !important;
	font-weight: 650 !important;
	font-family: inherit !important;
	line-height: 1 !important;
	text-decoration: none !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease, color .15s ease;
}
#wrapper .board a.btn:hover,
#wrapper .board button.btn:hover,
#wrapper .board .btnArea a.btn:hover {
	background: var(--hl-fog, #F3F5F7) !important;
	border-color: #CBD5E1 !important;
	color: var(--hl-ink, #111827) !important;
}
/* 글쓰기 = 프라이머리 */
#wrapper .board .list_footer .btnArea a.btn[href*="dispBoardWrite"],
#wrapper .board .btnArea a.btn[href*="dispBoardWrite"] {
	background: var(--hl-blue, #2563EB) !important;
	border-color: var(--hl-blue, #2563EB) !important;
	color: #fff !important;
}
#wrapper .board .list_footer .btnArea a.btn[href*="dispBoardWrite"]:hover,
#wrapper .board .btnArea a.btn[href*="dispBoardWrite"]:hover {
	background: #1D4ED8 !important;
	border-color: #1D4ED8 !important;
	color: #fff !important;
}

/* ---------- 글 보기 ---------- */
#wrapper .board .board_read,
#wrapper .board .board_write {
	background: none !important;
	border: 1px solid var(--hl-line, #E5E7EB);
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 20px;
}
#wrapper .board .read_header {
	position: relative;
	padding: 22px 22px 0 !important;
	background: none !important;
}
#wrapper .board .read_header h1 {
	width: auto !important;
	max-width: 100%;
	margin: 0 0 10px !important;
	padding: 0 !important;
	font-size: 20px !important;
	font-weight: 800 !important;
	line-height: 1.4 !important;
	letter-spacing: -0.03em;
	color: var(--hl-ink, #111827) !important;
	white-space: normal !important;
	overflow: visible !important;
	text-overflow: clip !important;
}
#wrapper .board .read_header h1 a {
	color: inherit !important;
	text-decoration: none !important;
}
#wrapper .board .read_header h1 .category {
	display: inline-block;
	margin: 0 8px 0 0 !important;
	padding: 3px 10px !important;
	border: 0 !important;
	border-radius: 999px;
	font-size: 12px !important;
	font-weight: 700 !important;
	color: var(--hl-blue, #2563EB) !important;
	background: rgba(37, 99, 235, 0.1);
	vertical-align: middle;
}
#wrapper .board .read_header .time {
	position: static !important;
	top: auto !important;
	right: auto !important;
	margin: 0 0 12px !important;
	font-size: 13px !important;
	color: var(--hl-soft, #6B7280) !important;
}
#wrapper .board .read_header .meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	margin: 0 -22px !important;
	padding: 12px 22px !important;
	background: var(--hl-fog, #F3F5F7) !important;
	border-top: 1px solid var(--hl-line, #E5E7EB);
	border-bottom: 1px solid var(--hl-line, #E5E7EB);
	white-space: normal !important;
}
#wrapper .board .read_header .meta:after {
	display: none;
}
#wrapper .board .read_header .meta .author {
	float: none !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	color: var(--hl-ink, #111827) !important;
	text-decoration: none !important;
}
#wrapper .board .read_header .meta .sum {
	float: none !important;
	margin-left: auto;
	font-size: 12px !important;
	color: var(--hl-soft, #6B7280) !important;
}
#wrapper .board .read_header .meta .sum .vote {
	border-left: 1px solid var(--hl-line, #E5E7EB);
	padding-left: 10px;
	margin-left: 8px;
}
#wrapper .board .read_body {
	padding: 22px !important;
	background: #fff !important;
}
#wrapper .board .read_body .xe_content,
#wrapper .board .read_body .xe_content p {
	font-size: 15px !important;
	line-height: 1.75 !important;
	color: #1F2937 !important;
}
#wrapper .board .read_footer {
	padding: 0 22px 18px;
	overflow: visible;
}
#wrapper .board .read_footer .fileList {
	float: none !important;
	display: block;
	margin: 0 0 14px !important;
}
#wrapper .board .read_footer .toggleFile {
	display: inline-flex;
	align-items: center;
	padding: 8px 12px !important;
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	border-radius: 8px;
	background: var(--hl-fog, #F3F5F7) !important;
	color: var(--hl-ink, #111827) !important;
	font-size: 13px !important;
	font-weight: 600;
}
#wrapper .board .read_footer .files {
	margin: 10px 0 0 !important;
	padding: 0;
	list-style: none;
}
#wrapper .board .read_footer .files li {
	background: none !important;
	padding: 6px 0 !important;
}
#wrapper .board .read_footer .files a {
	color: var(--hl-blue, #2563EB) !important;
	font-size: 13px;
	text-decoration: none !important;
}
#wrapper .board .read_footer .tns {
	float: none !important;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin: 0 0 14px !important;
}
#wrapper .board .read_footer .tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	height: auto !important;
	padding: 0 !important;
	background: none !important;
	font-size: 12px !important;
	color: var(--hl-soft, #6B7280) !important;
}
#wrapper .board .read_footer .tags a.tag {
	display: inline-flex;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--hl-fog, #F3F5F7);
	color: var(--hl-ink, #111827) !important;
	text-decoration: none !important;
	font-weight: 600;
}
#wrapper .board .read_footer .tags > span {
	display: none;
}
#wrapper .board .read_footer .sns {
	display: none !important; /* 구형 SNS 스프라이트 숨김 */
}
#wrapper .board .read_footer .action {
	font-size: 12px !important;
	color: var(--hl-soft, #6B7280) !important;
}
#wrapper .board .read_footer .sign {
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	border-radius: 10px;
	margin: 0 0 14px !important;
	padding: 14px 16px !important;
	background: #fff;
}
#wrapper .board .read_footer .sign .tx {
	font-size: 13px !important;
	border-left: 1px solid var(--hl-line, #E5E7EB) !important;
	color: var(--hl-soft, #6B7280) !important;
}
#wrapper .board .read_footer .btnArea {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
	gap: 8px;
	clear: both;
	padding: 14px 0 0 !important;
	border-top: 1px solid var(--hl-line, #E5E7EB) !important;
	text-align: right;
}
#wrapper .board .read_footer .btnArea .etc {
	margin-right: auto;
	display: flex;
	gap: 8px;
}

/* ---------- 글쓰기 ---------- */
#wrapper .board .write_header {
	padding: 16px 18px !important;
	background: var(--hl-fog, #F3F5F7) !important;
	border-bottom: 1px solid var(--hl-line, #E5E7EB);
}
#wrapper .board .write_header .iText {
	width: min(100%, 480px) !important;
	height: 36px !important;
	padding: 0 12px !important;
	line-height: 36px !important;
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	border-radius: 8px !important;
	background: #fff !important;
	font-size: 14px !important;
}
#wrapper .board .write_header select {
	height: 36px !important;
	padding: 0 10px !important;
	border: 1px solid var(--hl-line, #E5E7EB);
	border-radius: 8px;
	background: #fff;
}
#wrapper .board .write_footer {
	padding: 0 18px 18px;
}
#wrapper .board .write_footer .btnArea {
	float: none !important;
	display: flex;
	justify-content: flex-end;
	gap: 8px;
}

/* ---------- 댓글 / 트랙백 ---------- */
#wrapper .board .feedback {
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	border-radius: 12px;
	overflow: hidden;
	margin: 0 0 20px !important;
	color: var(--hl-ink, #111827) !important;
	background: #fff;
}
#wrapper .board .feedback .fbHeader {
	height: auto !important;
	min-height: 44px;
	padding: 12px 16px 12px 16px !important;
	line-height: 1.3 !important;
	margin: 0 !important;
	background: var(--hl-fog, #F3F5F7) !important;
	border-bottom: 1px solid var(--hl-line, #E5E7EB);
}
#wrapper .board .feedback .fbHeader h2 {
	font-size: 14px !important;
	font-weight: 800 !important;
	color: var(--hl-ink, #111827) !important;
}
#wrapper .board .feedback .fbHeader h2 em {
	color: var(--hl-blue, #2563EB) !important;
	text-decoration: none !important;
	font-weight: 800;
}
#wrapper .board #comment .fbHeader .wComment {
	top: 14px !important;
	right: 16px !important;
	padding: 0 !important;
	background: none !important;
	font-size: 13px !important;
	font-weight: 700;
	color: var(--hl-blue, #2563EB) !important;
}
#wrapper .board .feedback .fbList {
	margin: 0 !important;
	padding: 0 16px;
}
#wrapper .board .feedback .fbItem {
	padding: 16px 0 !important;
	border-bottom: 1px solid var(--hl-line, #E5E7EB) !important;
}
#wrapper .board .feedback .fbItem:last-child {
	border-bottom: 0 !important;
}
#wrapper .board .feedback .indent {
	background: none !important;
	padding-left: 20px;
	border-left: 2px solid var(--hl-line, #E5E7EB);
	margin-left: 8px;
}
#wrapper .board .feedback .fbMeta {
	float: none !important;
	width: auto !important;
	padding: 0 !important;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin-bottom: 8px;
}
#wrapper .board .feedback .fbMeta .profile {
	float: none !important;
	width: 32px !important;
	height: 32px !important;
	margin: 0 !important;
	border-radius: 50%;
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	object-fit: cover;
}
#wrapper .board .feedback .fbMeta .author,
#wrapper .board .feedback .author a {
	font-size: 13px !important;
	font-weight: 700 !important;
	color: var(--hl-ink, #111827) !important;
}
#wrapper .board .feedback .time {
	font-size: 12px !important;
	font-family: inherit !important;
	color: var(--hl-soft, #6B7280) !important;
}
#wrapper .board .feedback .xe_content {
	margin: 0 !important;
	font-size: 14px !important;
	line-height: 1.65 !important;
	color: #374151 !important;
}
#wrapper .board .feedback .xe_content p {
	font-size: 14px !important;
	line-height: 1.65 !important;
}

/* 댓글 폼 */
#wrapper .board .feedback .fbFooter,
#wrapper .board #comment .writeComment,
#wrapper .board .write_comment {
	padding: 14px 16px 16px;
}
#wrapper .board .feedback textarea,
#wrapper .board #comment textarea {
	width: 100% !important;
	min-height: 96px;
	padding: 12px !important;
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	border-radius: 10px !important;
	background: #fff !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
	box-sizing: border-box;
	resize: vertical;
}
#wrapper .board .iText {
	border: 1px solid var(--hl-line, #E5E7EB) !important;
	border-radius: 8px !important;
	background: #fff !important;
	height: 34px !important;
	padding: 0 10px !important;
	line-height: 34px !important;
}

/* 추가 입력 폼 */
#wrapper .board .exOut,
#wrapper .board .exForm {
	padding: 12px 22px !important;
	background: #fff !important;
}
#wrapper .board .exOut table,
#wrapper .board .exForm table {
	border: 0 !important;
}
#wrapper .board .exOut th,
#wrapper .board .exOut td,
#wrapper .board .exForm th,
#wrapper .board .exForm td {
	border-color: var(--hl-line, #E5E7EB) !important;
	font-size: 13px !important;
}

@media (max-width: 720px) {
	#wrapper .board .board_list th:not(.title),
	#wrapper .board .board_list td.no,
	#wrapper .board .board_list td.notice,
	#wrapper .board .board_list td.time,
	#wrapper .board .board_list td.readNum,
	#wrapper .board .board_list td.voteNum,
	#wrapper .board .board_list td.author {
		/* PC 레이아웃 유지 — 모바일은 mskin */
	}
	#wrapper .board .read_header,
	#wrapper .board .read_body,
	#wrapper .board .read_footer {
		padding-left: 16px !important;
		padding-right: 16px !important;
	}
	#wrapper .board .read_header .meta {
		margin-left: -16px !important;
		margin-right: -16px !important;
		padding-left: 16px !important;
		padding-right: 16px !important;
	}
	#wrapper .board .read_header h1 {
		font-size: 18px !important;
	}
}
