/*
 * BBSS003 카드 기본 / 블로그형 스킨 전용 CSS
 *  - list.html : .card_wrap > .card_item (썸네일+제목+발췌+메타)
 *  - view.html : article.card_article (큰 썸네일 hero + 본문)
 *  - write.html : .bbs_write_inner (BBSS001 폼 공유)
 *
 *  디자이너 작업 영역. 기본 룩만 잡아두고 사이트 톤에 맞춰 자유 수정.
 */

/* === list — 가로형 (이미지 좌 + 날짜/제목/발췌/태그 우) === */
.card_wrap { display: flex; flex-direction: column; }

.card_item {
	display: flex;
	align-items: center;
	gap: 2.5rem;
	padding: 2.2rem 0;
	border-bottom: 1px solid #e9ecef;
	text-decoration: none; color: inherit;
}
.card_item:first-child { padding-top: 0; }

.card_item .thumb {
	flex: 0 0 360px;
	width: 360px;
	aspect-ratio: 3 / 2;
	background: #f1f3f5;
	border-radius: 1rem;
	overflow: hidden;
}
.card_item .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.35s ease; }
.card_item:hover .thumb img { transform: scale(1.1); }
.card_item .thumb .none_image { width: 100%; height: 100%; }   /* 논이미지 placeholder (common.css .none_image) */

.card_item .body {
	flex: 1 1 auto;
	min-width: 0;   /* 말줄임(.ellipsis) 위해 flex 자식 축소 허용 */
	display: flex; flex-direction: column;
}
.card_item .body .date { font-size: 0.9rem; color: #adb5bd; margin-bottom: 0.9rem; }
.card_item .title { font-size: 1.4rem; font-weight: 700; color: #222; margin: 0 0 0.7rem; line-height: 1.35; }
.card_item .excerpt { font-size: 0.95rem; color: #868e96; line-height: 1.6; margin: 0 0 1.4rem; }

.card_item .tags { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }   /* 배지는 공통 .cate (common.css) */
.card_item .title .lock { font-size: 1.3rem; color: #888a9e; vertical-align: middle; margin-right: 0.2em; }   /* 제목 앞 자물쇠 — 공지사항과 동일 */

/* 모바일 — 세로 스택 */
@media (max-width: 768px) {
	.card_item { flex-direction: column; align-items: stretch; gap: 1.1rem; padding: 1.6rem 0; }
	.card_item .thumb { flex: none; width: 100%; }
	.card_item .title { font-size: 1.15rem; }
}

/* 페이징 */
.card_paging { display: flex; gap: 0.3rem; justify-content: center; margin-top: 2rem; }
.card_paging a {
	min-width: 2rem; padding: 0.4rem 0.6rem;
	border: 1px solid #dee2e6; border-radius: 0.25rem;
	text-align: center; text-decoration: none; color: #495057;
}
.card_paging a.on { background: #0076ff; border-color: #0076ff; color: #fff; }

/* === view === */
.card_view_main { max-width: 800px; margin: 0 auto; padding: 3rem 1rem; }
.card_article_head { margin-bottom: 2rem; }
.card_article_head .thumb_hero { aspect-ratio: 16 / 9; border-radius: 0.5rem; overflow: hidden; margin-bottom: 1.5rem; }
.card_article_head .thumb_hero img { width: 100%; height: 100%; object-fit: cover; }
.card_article_head .title_area .cate {
	display: inline-block; padding: 0.2rem 0.6rem;
	background: #e7f5ff; color: #1971c2;
	border-radius: 0.25rem; font-size: 0.85rem; margin-bottom: 0.6rem;
}
.card_article_head .title_area .title { font-size: 1.8rem; font-weight: 700; margin: 0 0 1rem; line-height: 1.3; }

/* === write — BBSS001 의 bbs-form.css 와 공통, 카드형 폼 wrapper 만 살짝 */
.bbs_card_write .bbs_write_inner { max-width: 800px; margin: 0 auto; padding: 2rem 1rem; }