@charset "UTF-8";

/* =========================
   qna.css
   - 吏덈Ц?섍린(Q&A) 紐⑤뱢 ?꾩슜 ?ㅽ???   - notice.css ?⑦꽩??理쒕????좎?
   ========================= */

#qna_wrap {
	padding: .25rem 0;
}

/* 怨듯넻 移대뱶 (diary ?⑦꽩怨??숈씪) */
#qna_wrap .card-soft {
	background: #fff;
	border: 1px solid rgba(0, 0, 0, .12);
	border-radius: 14px;
	box-shadow: 0 6px 16px rgba(0, 0, 0, .06);
}

#qna_wrap .section-hd {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	padding: 14px 16px;
	border-bottom: 1px solid rgba(0, 0, 0, .12);
}

#qna_wrap .section-bd {
	padding: 14px 16px;
}

#qna_wrap .field {
	margin-bottom: 0;
}

#qna_wrap .field-label {
	font-size: 13px;
	color: rgba(0, 0, 0, .55);
	margin-bottom: 6px;
	display: flex;
	align-items: center;
	gap: 6px;
}


#qna_wrap .qna-topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	padding: .25rem 0 .75rem;
}

#qna_wrap .qna-tabs {
	display: flex;
	gap: .5rem;
	flex-wrap: wrap;
}

#qna_wrap .qna-tab {
	border: 1px solid rgba(0, 0, 0, .12);
	background: #fff;
	border-radius: 999px;
	padding: .38rem .9rem;
	font-size: .95rem;
	line-height: 1;
	cursor: pointer;
}

#qna_wrap .qna-tab.is-on {
	border-color: rgba(13, 110, 253, .45);
	box-shadow: 0 4px 12px rgba(13, 110, 253, .10);
}

#qna_wrap .qna-card {
	border: 1px solid rgba(0, 0, 0, .10);
	border-radius: 14px;
	background: #fff;
	overflow: hidden;
}

#qna_wrap .qna-card-hd {
	padding: .85rem 1rem;
	border-bottom: 1px solid rgba(0, 0, 0, .06);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
}

#qna_wrap .qna-card-title {
	font-weight: 500;
	font-size: 1rem;
	color: #5c7cfa;
}

/* #qna_write_title {
	font-size: 1rem;
	font-weight: 500 !important;
	color: #5c7cfa;
} */

#qna_wrap .qna-card-bd {
	padding: 1rem;
}

#qna_wrap .qna-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

#qna_wrap .qna-item {
	padding: .85rem 1rem;
	border-bottom: 1px solid rgba(0, 0, 0, .06);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

#qna_wrap .qn-head {
	display: flex;
	align-items: center;
	gap: 5px !important;
	min-width: 0;
	flex: 1 1 auto;
}

#qna_wrap .qn-num {
	flex: 0 0 32px;
	font-size: 0.85rem;
	color: rgba(0, 0, 0, .45);
	text-align: center;
	font-family: monospace;
}

#qna_wrap .qn-badges {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
}

#qna_wrap .qn-badges i,
#qna_wrap .qn-legend i {
	font-size: 0.85rem;
	color: #7F7F7F;
	vertical-align: middle;
}

#qna_wrap .qn-badges .lock-icon,
#qna_wrap .qn-legend .bi-lock-fill {
	font-size: 0.8rem;
	color: #7F7F7F;
	margin-left: 2px;
	vertical-align: 1px;
}

#qna_wrap .qna-link {
	color: inherit;
	text-decoration: none;
	font-weight: 400 !important;
	font-size: 1.03rem !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}

#qna_wrap .badge-pin,
#qna_wrap .badge-private {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	padding: 0 !important;
	border: none !important;
	background: transparent !important;
	border-radius: 0;
}

#qna_wrap .badge-pin .badgetxt,
#qna_wrap .badge-private .badgetxt {
	display: none !important;
}

#qna_wrap .badge-pin i,
#qna_wrap .badge-private i {
	display: inline-block !important;
	color: rgba(0, 0, 0, 0.45) !important; /* ?룹? 寃€?뺤깋 */
	font-size: 0.95rem !important;
	margin: 0 !important;
}

#qna_wrap .qn-meta {
	display: flex;
	gap: .75rem;
	flex: 0 0 auto;
	white-space: nowrap;
	color: rgba(0, 0, 0, .55);
	font-size: .88rem;
	align-items: center;
}

#qna_wrap .form-row {
	display: flex;
	gap: .75rem;
	flex-wrap: wrap;
	align-items: center;
}

#qna_wrap .form-row .form-check {
	margin: 0;
}

#qna_wrap .qna-actions {
	display: flex;
	gap: .5rem;
	justify-content: flex-end;
	padding: .85rem 1rem;
	border-top: 1px solid rgba(0, 0, 0, .06);
	background: transparent;
}

/* 蹂닿린 紐⑤떖 ??*/
#qna_view_modal .modal-dialog {
	width: calc(100% - 2rem);
	max-width: 900px;
}

/* ?대?吏€/?꾪삎?€ ??뿉 留욎떠 蹂댁씠?꾨줉 */
#qna_view_modal .ck-content img {
	max-width: 100% !important;
	height: auto !important;
}

/* =========================================================
   ??Q&A 議고쉶 紐⑤떖?? ?곸꽭 ?좎쭨 ?고듃 異뺤냼 諛??대컮 媛뺤젣 ?④?
   ========================================================= */
#qna_view_modal #qna_view_question_at,
#qna_view_modal #qna_view_answered_at {
	font-size: 0.8rem !important; /* ?고듃 異뺤냼 */
	color: #999;
}

/* 議고쉶 紐⑤떖 ?덉쓽 CKEditor ?대컮 ?꾨㈃ 李⑤떒 */
#qna_view_modal .ck.ck-editor__top,
#qna_view_modal .ck-toolbar {
	display: none !important;
}



/* 議고쉶 紐⑤떖 蹂몃Ц ?곸뿭 ?ㅽ???蹂댁젙 */
#qna_view_modal .ck-editor__editable { padding: 20px 0px !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }

#qna_view_modal .qna-view-block {
	border: 1px solid rgba(0, 0, 0, .06);
	border-radius: 14px;
	padding: 1rem;
	background: transparent;
}


/* =========================================================
   ??[諛섏쓳?? Q&A 紐⑸줉 理쒖쟻??(768px ?댄븯)
   ========================================================= */
@media (max-width: 768px) {
	/* 1. ?곷떒 踰붾? ?띿뒪??異뺤냼 */
	#qna_wrap .qn-legend {
		gap: 0.5rem !important;
	}
	#qna_wrap .qn-legend span {
		font-size: 0.75rem !important;
		opacity: 0.9;
	}
	#qna_wrap .qn-legend i {
		font-size: 0.75rem !important;
	}

	/* 2. 紐⑸줉 ??ぉ ?덉씠?꾩썐 蹂€寃?(?몃줈 諛곗튂) */
	#qna_wrap .qna-item {
		flex-wrap: wrap !important;
		flex-direction: row !important;
		align-items: center !important;
		gap: 0.35rem !important;
		padding: 0.85rem 1rem !important;
	}

	#qna_wrap .qn-head {
		flex: 1 1 0 !important;
		min-width: 0 !important;
	}
	
	/* 3. ?쒕ぉ ??以?吏€??(line-clamp) */
	#qna_wrap .qna-link {
		white-space: normal !important;
		display: -webkit-box !important;
		-webkit-line-clamp: 2 !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		line-height: 1.4 !important;
		max-height: 2.8em !important;
	}

	/* 4. 硫뷀? ?뺣낫: ?ㅼ쓬 以??곗륫 ?뺣젹 */
	#qna_wrap .qn-meta {
		width: 100% !important;
		align-self: flex-end !important;
		justify-content: flex-end !important;
		font-size: 0.78rem !important;
		opacity: 0.8;
		gap: 0.5rem !important;
		margin-top: 2px;
	}

	#qna_wrap .qn-num {
		margin-right: 4px;
	}

	/* 5. section-hd (?€?댄?, ?≪뀡 踰꾪듉) ??以?諛곗튂 */
	#qna_wrap .section-hd {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 1rem !important;
	}
}