@charset "utf-8";

.list-category .div-tab.tabs { margin-bottom:0px; }

.list-board {
	--bl-border: #ece3d6;
	--bl-head: #fdf8f3;
	--bl-text: #3a342e;
	--bl-muted: #9a9084;
	--bl-title: #2c2824;
	--bl-cmt: #c45c5c;
	--bl-good: #e53935;
	margin-bottom: 20px;
	background: #fff;
	border: 1px solid var(--bl-border);
	border-radius: 12px;
	overflow: hidden;
}

/* Icon */
.list-board .wr-text { font-size:11px; letter-spacing:-0.02em; line-height:11px; font-weight:normal; }
.list-board .wr-icon { display:inline-block; padding:0; margin:0 2px 0 0; overflow:hidden; vertical-align:middle; background-repeat:no-repeat; background-position:left top; }
.list-board .wr-notice { width:auto; height:auto; padding:2px 8px; border-radius:4px; background:#e53935; color:#fff; font-size:11px; font-weight:700; line-height:1.4; }
.list-board .wr-new { width:12px; height:12px; background-image: url('../../img/icon_new.gif'); }
.list-board .wr-secret { width:12px; height:12px; background-image: url('../../img/icon_secret.gif'); }
.list-board .wr-hot { width:12px; height:12px; background-image: url('../../img/icon_hot.gif'); }
.list-board .wr-video { width:12px; height:12px; background-image: url('../../img/icon_video.gif'); }
.list-board .wr-image { width:12px; height:12px; background-image: url('../../img/icon_image.gif'); }
.list-board .wr-file { width:12px; height:12px; background-image: url('../../img/icon_file.gif'); }
.list-board .wr-vicon { position:absolute; left:4px; bottom:3px; color:#fff; font-size:16px; z-index:1; }

/* Width */
.list-board .wr-chk { width:40px; }
.list-board .wr-num { width:64px; }
.list-board .wr-thumb { width:60px; }
.list-board .wr-category { width:80px; }
.list-board .wr-name { width:130px; }
.list-board .wr-date { width:132px; }
.list-board .wr-hit { width:64px; }
.list-board .wr-down { width:50px; }
.list-board .wr-visit { width:50px; }
.list-board .wr-good { width:72px; }
.list-board .wr-comment-col { width:56px; }
.list-board .wr-nogood { width:50px; }
.list-board .wr-none { padding:48px 0; text-align:center; color:var(--bl-muted); }
.list-board .wr-comment { margin:0 8px; }
.list-board .wr-hidden { display:none; }

/* Head */
.list-board .div-head,
.list-board .list-head,
.list-board .border-black,
.list-board .border-navy,
.list-board [class*="border-"] {
	display: flex !important;
	align-items: center;
	width: 100%;
	margin: 0 !important;
	padding: 0 8px !important;
	min-height: 46px;
	background: var(--bl-head) !important;
	border: 0 !important;
	border-bottom: 1px solid var(--bl-border) !important;
	color: var(--bl-muted) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	box-shadow: none !important;
}
.list-board .div-head > span,
.list-board .list-head > span {
	display: block;
	flex: 0 0 auto;
	padding: 12px 6px !important;
	text-align: center;
	color: var(--bl-muted) !important;
	font-weight: 600 !important;
	border: 0 !important;
	background: transparent !important;
}
.list-board .div-head > span a,
.list-board .list-head > span a {
	color: var(--bl-muted) !important;
	font-weight: 600 !important;
}
.list-board .div-head .wr-num,
.list-board .list-head .wr-num {
	flex-basis: 64px;
	width: 64px;
	text-align: left !important;
	padding-left: 12px !important;
}
.list-board .div-head .wr-subject,
.list-board .list-head .wr-subject {
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	text-align: left !important;
	padding-left: 12px !important;
}
.list-board .div-head .wr-name,
.list-board .list-head .wr-name { flex-basis: 130px; width: 130px; }
.list-board .div-head .wr-date,
.list-board .list-head .wr-date { flex-basis: 132px; width: 132px; }
.list-board .div-head .wr-hit,
.list-board .list-head .wr-hit { flex-basis: 64px; width: 64px; }
.list-board .div-head .wr-good,
.list-board .list-head .wr-good { flex-basis: 72px; width: 72px; }
.list-board .div-head .wr-comment-col,
.list-board .list-head .wr-comment-col { flex-basis: 56px; width: 56px; }
.list-board .div-head .wr-name,
.list-board .div-head .wr-date,
.list-board .div-head .wr-hit,
.list-board .div-head .wr-good,
.list-board .div-head .wr-comment-col,
.list-board .list-head .wr-name,
.list-board .list-head .wr-date,
.list-board .list-head .wr-hit,
.list-board .list-head .wr-good,
.list-board .list-head .wr-comment-col {
	text-align: right !important;
	padding-right: 10px !important;
}

/* Body */
.list-board .list-body { list-style:none; padding:0; margin:0; }
.list-board .list-body li {
	display: flex;
	align-items: center;
	width: 100%;
	margin: 0;
	padding: 0 8px;
	border-bottom: 1px solid #f0e9df;
	background: #fff;
	transition: background .15s ease;
}
.list-board .list-body li:last-child { border-bottom: 0; }
.list-board .list-body li:hover { background: #fdfaf6; }
.list-board .list-body li.bg-light { background: #fcf8f1; }
.list-board .list-body li > div {
	display: block;
	flex: 0 0 auto;
	padding: 16px 6px;
	text-align: center;
	color: var(--bl-muted);
	font-size: 13px;
	line-height: 1.4;
	vertical-align: middle;
	box-sizing: border-box;
}
.list-board .list-body .wr-chk { flex-basis: 40px; width: 40px; }
.list-board .list-body .wr-num {
	flex-basis: 64px;
	width: 64px;
	text-align: left;
	padding-left: 12px;
	color: #b5aea4;
	font-weight: 500;
}
.list-board .list-body .wr-thumb { flex-basis: 60px; width: 60px; }
.list-board .list-body .wr-subject {
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	padding-left: 10px;
	text-align: left;
}
.list-board .list-body .wr-subject .item-subject {
	display: inline;
	color: var(--bl-title);
	font-size: 14px;
	font-weight: 600;
	word-break: break-all;
	letter-spacing: -0.02em;
}
.list-board .list-body .wr-subject .item-subject:hover { color: #e53935; }
.list-board .list-body .wr-subject .hm-cmt {
	display: inline;
	margin-left: 4px;
	color: var(--bl-cmt) !important;
	font-weight: 800;
	font-size: 13px;
}
.list-board .list-body .wr-name {
	flex-basis: 130px;
	width: 130px;
	text-align: right;
	padding-right: 10px;
	font-weight: 500;
	color: #6b6560;
}
.list-board .list-body .wr-name a,
.list-board .list-body .wr-name .sv_member,
.list-board .list-body .wr-name .member,
.list-board .list-body .wr-name .guest {
	color: #6b6560 !important;
	font-weight: 500 !important;
}
.list-board .list-body .wr-name a {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	gap: 4px;
	max-width: 100%;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	vertical-align: middle;
}
.list-board .list-body .wr-name .lv-img,
.list-board .list-body .wr-name img {
	width: 20px;
	height: 20px;
	object-fit: contain;
	flex-shrink: 0;
	vertical-align: middle;
}
.list-board .list-body .wr-date,
.list-board .list-body .wr-hit {
	text-align: right;
	padding-right: 10px;
	color: #a59c90;
	font-variant-numeric: tabular-nums;
}
.list-board .list-body .wr-date { flex-basis: 132px; width: 132px; }
.list-board .list-body .wr-hit { flex-basis: 64px; width: 64px; }
.list-board .list-body .wr-good {
	flex-basis: 72px;
	width: 72px;
	text-align: right;
	padding-right: 12px;
}
.list-board .list-body .wr-comment-col {
	flex-basis: 56px;
	width: 56px;
	text-align: right;
	padding-right: 12px;
}
.list-board .hm-good {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	gap: 4px;
	color: #c4bbb0;
	font-weight: 600;
}
.list-board .hm-good i { font-size: 12px; }
.list-board .hm-good.is-on { color: var(--bl-good); }
.list-board .hm-cmt-col {
	color: #c4bbb0;
	font-weight: 600;
}
.list-board .hm-cmt-col.is-on {
	color: var(--bl-cmt);
	font-weight: 800;
}

.list-board .list-body .thumb-img { position:relative; width:46px; height:46px; margin:0 auto; }
.list-board .list-body .thumb-icon { position:relative; width:46px; height:46px; display:table; margin:0 auto; }
.list-board .list-body .thumb-icon a { display:table-cell; width:1%; background:#eee; color:#fff; vertical-align:middle; font-size:30px; }
.list-board .list-body .thumb-icon img { width:46px; height:46px; margin:0 auto; }

@media all and (max-width:768px) {
	.responsive .list-board .wr-hidden { display:inline-block !important; }
	.responsive .list-board .item-subject {
		display: block;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
	}
	.responsive .list-board .item-details { margin-right:-8px; margin-top:6px; }
	.responsive .list-board .item-details > span { margin-right:12px; font-weight:normal; color:var(--bl-muted); }
	.responsive .list-board .item-details > span:last-child { margin-right:0; }
	.responsive .list-board .list-body li { padding: 4px 10px; }
	.responsive .list-board .list-body li > div { padding: 12px 4px; }
}