@charset "utf-8";
/* =========================================================================
 * JDH 프론트 게시판 — 공지사항(/board/notice) · 언론보도(/board/press) 공용
 * Figma node 593:936 기준 / 로드 순서: main_hero.css → jdh_sub.css → 이 파일
 *
 * 두 게시판이 같은 레이아웃이라 CSS 도 하나로 쓴다. 배지 색만 modifier 로 구분
 *   .dctb_badge--notice(그린) / .dctb_badge--press(골드)
 * 상세(read.jsp)는 모듈 기본 마크업을 그대로 두고 이 파일 하단에서 톤만 덮어쓴다.
 * ========================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@600;700&display=swap');

.dctb {
	--dctb-green:    #24382C;
	--dctb-green-2:  #3B5843;
	--dctb-gold:     #C2A878;
	--dctb-gold-ink: #A5854B;
	--dctb-gold-3:   #CDBF9C;
	--dctb-ink:      #1C1E1A;
	--dctb-body:     #55594F;
	--dctb-mute:     #9A978E;
	--dctb-line:     #EEE8DD;
	--dctb-zebra:    #FCFBF7;
	font-family: 'Pretendard', sans-serif;
	color: var(--dctb-ink);
	background: #fff;
	overflow-x: clip;
}
.dctb .dctb_inner { max-width: 1000px; margin: 0 auto; padding: 0 24px; }
.dctb .blind {
	position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ===== 히어로 ===== */
.dctb_hero {
	background: var(--dctb-green-2);
	background-image:
		radial-gradient(120% 90% at 12% 0%, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 58%),
		linear-gradient(180deg, rgba(10,16,12,.10) 0%, rgba(10,16,12,.28) 100%);
	padding: 62px 24px 66px;
	text-align: center;
}
.dctb_hero__eng {
	display: block;
	font-family: 'Cormorant Garamond', serif;
	font-weight: 700; font-size: 17px; letter-spacing: 4.6px; text-transform: uppercase;
	color: var(--dctb-gold-3);
}
.dctb_hero__title {
	margin: 14px 0 0;
	font-weight: 700; font-size: 38px; line-height: 1.2; letter-spacing: -0.4px; color: #fff;
}
.dctb_hero__desc {
	margin: 14px 0 0;
	font-weight: 400; font-size: 15.5px; line-height: 1.7; color: rgba(233,240,232,.76);
	word-break: keep-all;
}

/* ===== 게시판 전환 탭 ===== */
.dctb_tabs {
	display: flex; justify-content: center; gap: 8px;
	max-width: 1000px; margin: 0 auto; padding: 34px 24px 0;
}
.dctb_tab {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 11px 26px; border-radius: 999px;
	border: 1px solid #E2DCCF; background: #fff;
	font-weight: 600; font-size: 15px; letter-spacing: -0.2px; color: var(--dctb-body);
	transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.dctb_tab:hover { border-color: var(--dctb-green-2); color: var(--dctb-green-2); text-decoration: none; }
.dctb_tab em {
	font-style: normal; font-size: 13px; font-weight: 600; opacity: .72;
}
.dctb_tab.is-on {
	background: var(--dctb-green-2); border-color: var(--dctb-green-2); color: #fff;
}
.dctb_tab.is-on:hover { color: #fff; }

/* ===== 본문 ===== */
.dctb_main { padding: 30px 0 92px; }

/* 검색 */
.dctb_tools { display: flex; justify-content: flex-end; padding-bottom: 22px; }
.dctb_search {
	position: relative;
	display: flex; align-items: center;
	width: 300px; max-width: 100%;
}
.dctb_search input[type="text"] {
	width: 100%; height: 44px;
	padding: 0 48px 0 20px;
	border: 1px solid #E2DCCF; border-radius: 999px;
	background: #fff;
	font-family: inherit; font-size: 14.5px; color: var(--dctb-ink);
	transition: border-color .25s ease;
}
.dctb_search input[type="text"]::placeholder { color: #AFACA3; }
.dctb_search input[type="text"]:focus { outline: none; border-color: var(--dctb-green-2); }
.dctb_search__btn {
	position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
	width: 34px; height: 34px; padding: 0;
	border: 0; border-radius: 50%; background: transparent;
	cursor: pointer;
}
/* 돋보기 아이콘(CSS 도형) */
.dctb_search__btn i {
	position: absolute; left: 11px; top: 10px;
	width: 11px; height: 11px; border: 1.5px solid var(--dctb-green-2); border-radius: 50%;
}
.dctb_search__btn i::after {
	content: '';
	position: absolute; right: -5px; bottom: -4px;
	width: 7px; height: 1.5px; background: var(--dctb-green-2);
	transform: rotate(45deg);
}

/* ===== 목록 ===== */
.dctb_list__head,
.dctb_row > a {
	display: flex; align-items: center; gap: 12px;
}
.dctb_list__head {
	padding: 0 20px 13px;
	border-bottom: 2px solid var(--dctb-green);
	font-size: 11.5px; letter-spacing: 1.6px; text-transform: uppercase; color: var(--dctb-mute);
}
.dctb_c--no   { flex: 0 0 64px;  text-align: center; }
.dctb_c--cat  { flex: 0 0 108px; text-align: center; }
.dctb_c--tit  { flex: 1 1 auto;  min-width: 0; text-align: left; }
.dctb_c--date { flex: 0 0 116px; text-align: center; }
.dctb_c--hit  { flex: 0 0 74px;  text-align: center; }

.dctb_list__body { margin: 0; padding: 0; list-style: none; }
.dctb_row { border-bottom: 1px solid var(--dctb-line); }
.dctb_row:nth-child(odd) { background: var(--dctb-zebra); }
.dctb_row > a {
	padding: 18px 20px;
	color: inherit; text-decoration: none;
	transition: background .22s ease;
}
.dctb_row > a:hover { background: rgba(59,88,67,.05); text-decoration: none; }

.dctb_c--no  { font-size: 14px; color: #A6A399; }
.dctb_c--no em {
	font-style: normal; font-weight: 600; font-size: 13px; color: var(--dctb-gold-ink);
}
.dctb_c--date { font-size: 14px; color: #8D8A80; }
.dctb_c--hit  { font-size: 14px; color: #A6A399; }

/* 구분 배지 */
.dctb_badge {
	display: inline-block; padding: 5px 13px; border-radius: 999px;
	font-style: normal; font-weight: 600; font-size: 12.5px; letter-spacing: -0.2px;
	white-space: nowrap;
}
.dctb_badge--notice { background: #E8F0E8; color: #35523E; }
.dctb_badge--press  { background: #F5EBDA; color: #8A6A2F; }

/* 제목 + 매체명 */
.dctb_c--tit strong {
	display: block;
	font-weight: 600; font-size: 16.5px; line-height: 1.45; letter-spacing: -0.3px; color: var(--dctb-ink);
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	transition: color .22s ease;
}
.dctb_row > a:hover .dctb_c--tit strong { color: var(--dctb-green-2); }
.dctb_c--tit .dctb_media {
	display: block; margin-top: 4px;
	font-size: 13px; letter-spacing: -0.2px; color: var(--dctb-gold-ink);
}
.dctb_new {
	display: inline-block; margin-left: 8px; transform: translateY(-1px);
	font-style: normal; font-weight: 700; font-size: 10.5px; letter-spacing: .6px; color: #B4532F;
	vertical-align: middle;
}
.dctb_row--top .dctb_c--tit strong { font-weight: 700; }

.dctb_empty {
	margin: 0; padding: 90px 0; text-align: center;
	font-size: 16px; color: #8D8A80;
	border-bottom: 1px solid var(--dctb-line);
}

/* ===== 페이징 — 모듈이 출력하는 마크업(a/span/strong)을 원형 버튼으로 덮어쓴다 ===== */
.dctb_paging { padding-top: 34px; text-align: center; }
.dctb_paging * { float: none !important; }
.dctb_paging ul { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
.dctb_paging li { display: inline-flex; margin: 0; padding: 0; }
.dctb_paging a,
.dctb_paging strong,
.dctb_paging span {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 38px; height: 38px; margin: 0 3px; padding: 0 6px;
	border-radius: 999px;
	font-size: 14.5px; font-weight: 500; color: var(--dctb-body);
	background: transparent; border: 0; text-decoration: none;
	transition: background .22s ease, color .22s ease;
}
.dctb_paging a:hover { background: #F2EFE7; color: var(--dctb-green-2); text-decoration: none; }
.dctb_paging strong,
.dctb_paging a.on,
.dctb_paging a.active,
.dctb_paging span.on {
	background: var(--dctb-green-2); color: #fff; font-weight: 600;
}

/* =========================================================================
 * 상세(read.jsp) — 모듈 기본 마크업 위에 JDH 톤만 얹는다
 * ========================================================================= */
.dctb_read { background: #fff; padding: 30px 0 92px; }
.dctb_read .inner { max-width: 1000px; margin: 0 auto; padding: 0 24px; }
.dctb_read .programCon { padding: 0; }
.dctb_read .prd_tab_wrapper { display: none; }   /* 상단 Back 바 — 하단 목록 버튼으로 대체 */

.dctb_read .recruitment_detail_top_box {
	padding: 0 4px 22px;
	border-bottom: 2px solid var(--dctb-green);
}
.dctb_read .recruitment_tit {
	margin: 0;
	font-weight: 700; font-size: 26px; line-height: 1.4; letter-spacing: -0.5px; color: var(--dctb-ink);
	word-break: keep-all;
}
/* 언론보도 상세의 매체명 */
.dctb_read__media {
	margin: 10px 0 0;
	font-weight: 600; font-size: 14.5px; letter-spacing: -0.2px; color: var(--dctb-gold-ink);
}
.dctb_read .recruitment_alt {
	margin-top: 10px;
	font-size: 14px; color: #8D8A80;
}
/* 주변 글 목록/이전·다음 네비 — 글이 없을 때 나오는 안내는 숨긴다(하단 '목록' 버튼으로 충분) */
.dctb_read .ej_du_wrap { margin-top: 30px; font-size: 15px; }
.dctb_read .ej_du_wrap a { color: var(--dctb-body); }
.dctb_read .ej_du_wrap a:hover { color: var(--dctb-green-2); }
.dctb_read .recruitment_alt i { display: none; }
.dctb_read .readEdit {
	padding: 40px 4px 48px;
	font-size: 16px; line-height: 1.85; color: var(--dctb-body);
	border-bottom: 1px solid var(--dctb-line);
}
.dctb_read .readEdit img { max-width: 100%; height: auto; }
.dctb_read .urlFile {
	margin-top: 22px; padding: 18px 22px;
	background: var(--dctb-zebra); border: 1px solid var(--dctb-line); border-radius: 8px;
	font-size: 14.5px;
}
.dctb_read .urlFile p { margin: 0; }
.dctb_read .urlFile p + p { margin-top: 8px; }
.dctb_read .urlFile a { color: var(--dctb-gold-ink); }
.dctb_read .readAnswer {
	margin-top: 22px; padding: 20px 22px;
	background: #F4F7F3; border-radius: 8px;
}

/* 상세 하단 목록/이전·다음 */
.dctb_read .ej_du_wrap { margin-top: 34px; }
.dctb_read__foot { margin-top: 34px; text-align: center; }
.dctb_read__list-btn {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 150px; height: 48px; padding: 0 26px;
	border-radius: 999px; background: var(--dctb-green-2); color: #fff;
	font-weight: 600; font-size: 15px; letter-spacing: -0.2px;
	transition: background .25s ease;
}
.dctb_read__list-btn:hover { background: var(--dctb-green); color: #fff; text-decoration: none; }

/* =========================================================================
 * 반응형
 * ========================================================================= */
@media all and (max-width: 768px) {
	.dctb .dctb_inner { padding: 0 18px; }
	.dctb_hero { padding: 46px 18px 50px; }
	.dctb_hero__eng { font-size: 15px; letter-spacing: 3.4px; }
	.dctb_hero__title { font-size: 27px; }
	.dctb_hero__desc { font-size: 14.5px; }
	.dctb_tabs { padding: 26px 18px 0; }
	.dctb_tab { padding: 10px 20px; font-size: 14px; }
	.dctb_main { padding: 24px 0 64px; }
	.dctb_tools { justify-content: stretch; }
	.dctb_search { width: 100%; }

	/* 표 → 카드형: 헤더/조회수 숨기고 [구분+날짜 / 제목] 2줄로 쌓는다 */
	.dctb_list__head { display: none; }
	.dctb_row > a {
		display: grid; grid-template-areas: "cat date" "tit tit";
		grid-template-columns: auto 1fr; align-items: center;
		gap: 8px 10px; padding: 16px 4px;
	}
	.dctb_c--no, .dctb_c--hit { display: none; }
	.dctb_c--cat  { grid-area: cat;  flex: none; text-align: left; }
	.dctb_c--date { grid-area: date; flex: none; text-align: right; font-size: 13px; }
	.dctb_c--tit  { grid-area: tit;  flex: none; }
	.dctb_c--tit strong { white-space: normal; font-size: 15.5px; }
	.dctb_row:nth-child(odd) { background: transparent; }
	.dctb_row > a:hover { background: transparent; }
	/* 공지글은 배지 앞에 '공지' 표시를 되살린다 */
	.dctb_row--top .dctb_c--no {
		display: block; grid-area: cat; flex: none;
		text-align: left; font-size: 0;
	}

	.dctb_paging a, .dctb_paging strong, .dctb_paging span { min-width: 34px; height: 34px; font-size: 14px; }

	.dctb_read { padding: 24px 0 64px; }
	.dctb_read .recruitment_tit { font-size: 21px; }
	.dctb_read .readEdit { padding: 30px 0 36px; font-size: 15.5px; }
}
