@charset "utf-8";
/* ==========================================================================
   PLAYWEBON BOARD - 목록 댓글수 표시 (.cnum)
   디자인 10종 (.cnum_s1 ~ .cnum_s10)
   ========================================================================== */

.board_list td.title a.cnum {
	--cn: #e2692f;
	--cn-soft: color-mix(in srgb, var(--cn) 12%, transparent);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 3px;
	vertical-align: middle;
	position: relative;
	top: -1px;
	margin-left: 6px;
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.02em;
	white-space: nowrap;
	text-decoration: none;
	transition: all .18s ease;
}
.board_list td.title a.cnum .cnum_ico { display: none; width: 12px; height: 12px; }
.board_list td.title a.cnum em { font-style: normal; }
.board_list td.title a.cnum:hover { filter: brightness(1.08); }

/* ---------- 01. 브래킷 텍스트 ---------- */
.board_list td.title a.cnum_s1 { color: var(--cn); }
.board_list td.title a.cnum_s1 em::before { content: "["; }
.board_list td.title a.cnum_s1 em::after { content: "]"; }

/* ---------- 02. 원형 뱃지 ---------- */
.board_list td.title a.cnum_s2 {
	min-width: 19px;
	height: 19px;
	padding: 0 6px;
	border-radius: 10px;
	background: var(--cn);
	color: #fff;
	font-size: 11.5px;
}

/* ---------- 03. 소프트 필 ---------- */
.board_list td.title a.cnum_s3 {
	height: 20px;
	padding: 0 9px;
	border-radius: 10px;
	background: var(--cn-soft);
	color: var(--cn);
}

/* ---------- 04. 아이콘 + 숫자 ---------- */
.board_list td.title a.cnum_s4 { color: var(--cn); gap: 4px; font-size: 12.5px; }
.board_list td.title a.cnum_s4 .cnum_ico { display: block; width: 13px; height: 13px; position: relative; top: -.5px; }

/* ---------- 05. 말풍선 ---------- */
.board_list td.title a.cnum_s5 {
	min-width: 22px;
	height: 20px;
	margin-bottom: 2px;
	padding: 0 7px;
	border-radius: 6px;
	background: var(--cn);
	color: #fff;
	font-size: 11.5px;
}
.board_list td.title a.cnum_s5::after {
	content: "";
	position: absolute;
	left: 7px;
	bottom: -4px;
	width: 0;
	height: 0;
	border-top: 5px solid var(--cn);
	border-right: 5px solid transparent;
}

/* ---------- 06. 아웃라인 ---------- */
.board_list td.title a.cnum_s6 {
	min-width: 20px;
	height: 20px;
	padding: 0 7px;
	border: 1px solid var(--cn);
	border-radius: 10px;
	background: transparent;
	color: var(--cn);
	font-size: 11.5px;
}

/* ---------- 07. 스퀘어 ---------- */
.board_list td.title a.cnum_s7 {
	min-width: 19px;
	height: 19px;
	padding: 0 6px;
	border-radius: 4px;
	background: var(--cn);
	color: #fff;
	font-size: 11.5px;
}

/* ---------- 08. 형광펜 ---------- */
.board_list td.title a.cnum_s8 {
	padding: 0 3px;
	color: var(--cn);
	box-shadow: inset 0 -7px 0 var(--cn-soft);
}

/* ---------- 09. 도트 + 숫자 ---------- */
.board_list td.title a.cnum_s9 { gap: 5px; color: #8a909c; font-weight: 600; }
.board_list td.title a.cnum_s9::before {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--cn);
}

/* ---------- 10. 그라데이션 필 ---------- */
.board_list td.title a.cnum_s10 {
	min-width: 22px;
	height: 20px;
	padding: 0 9px;
	border-radius: 10px;
	background: linear-gradient(135deg, var(--cn), color-mix(in srgb, var(--cn) 55%, #111));
	color: #fff;
	font-size: 11.5px;
	box-shadow: 0 2px 6px color-mix(in srgb, var(--cn) 30%, transparent);
}

/* ---------- 트랙백 (댓글수와 동일 톤, 서브 컬러) ---------- */
.board_list td.title a.tnum {
	margin-left: 4px;
	color: #a9aeb6;
	font-size: 11.5px;
	font-weight: 600;
	text-decoration: none;
}

/* ---------- 모바일 ---------- */
@media (max-width: 768px) {
	.board_list tbody td.title a.cnum { margin-left: 5px; font-size: 11.5px; }
	.board_list tbody td.title a.cnum_s2,
	.board_list tbody td.title a.cnum_s5,
	.board_list tbody td.title a.cnum_s7,
	.board_list tbody td.title a.cnum_s10 { min-width: 18px; height: 18px; font-size: 11px; }
	.board_list tbody td.title a.cnum_s3,
	.board_list tbody td.title a.cnum_s6 { height: 19px; padding: 0 7px; }
}