@charset "utf-8";

/* ------------------------------------------------------------------
   PIMZ 공고 목록 / 상세 (notice-list.html, notice-view.html)
------------------------------------------------------------------ */

:root {
	--board-bg: #f4f4f5;
	--board-card: #fff;
	--board-title: #111;
	--board-text: #1a1a1a;
	--board-muted: #8e8e93;
	--board-line: #ececed;
	--board-arrow: #b5b5ba;
}

* { box-sizing: border-box; }

/*
html, body {
	margin: 0;
	padding: 0;
}

body {
	min-height: 100vh;
	background: var(--board-bg);
	color: var(--board-text);
	font-family: "Paperlogy", "DM Sans", "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", sans-serif;
	font-size: 15px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	word-break: keep-all;
}


img { border: 0; vertical-align: middle; }

.non-astyle,
.non-astyle:hover,
.non-astyle:focus {
	text-decoration: none;
	color: inherit;
}
*/

/* ============ 공통 레이아웃 ============ */

.board-page {
	padding: 48px 0 72px;
	background: var(--board-bg);
}

.board-cont {
	max-width: 60%;
	margin: 0 auto;
	padding: 0 20px;
}

/* ============ 페이지 타이틀 ============ */

.board-head {
	margin: 0 0 22px;
}

.board-title {
	margin: 0;
	font-size: 40px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -.02em;
	color: var(--board-title);
}

.board-desc {
	margin: 6px 0 0;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;
	color: var(--board-muted);
}

/* ============ 목록 ============ */

.board-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.board-list li + li { margin-top: 8px; }

.board-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	margin: 0;
	padding: 16px 20px;
	border: 1px solid var(--board-line);
	border-left: 0;
	border-right: 0;
	/*border-radius: 8px;*/
	background: var(--board-card);
	font-family: inherit;
	text-align: left;
	transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

a.board-item:hover {
	border-color: #dcdcdf;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .05);
	transform: translateY(-1px);
}

a.board-item:hover .board-item-arrow { color: #7a7a80; }

.board-item-text {
	display: block;
	min-width: 0;
}

.board-item-title {
	display: block;
	font-size: 14px;
	font-weight: 800;
	line-height: 1.45;
	color: var(--board-title);
}

.board-item-date {
	display: block;
	margin-top: 3px;
	font-size: 11px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--board-muted);
}

.board-item-arrow {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	color: var(--board-arrow);
	transition: color .15s ease, transform .25s ease;
}

.board-empty {
	margin: 0;
	padding: 48px 20px;
	border: 1px solid var(--board-line);
	border-radius: 8px;
	background: var(--board-card);
	font-size: 13px;
	color: var(--board-muted);
	text-align: center;
}

/* ============ 페이징 ============ */

.board-paging {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	margin-top: 18px;
}

.board-paging-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 26px;
	height: 26px;
	padding: 0 6px;
	border-radius: 6px;
	font-size: 12px;
	font-weight: 600;
	color: var(--board-muted);
	text-decoration: none;
	transition: background-color .15s ease, color .15s ease;
}

.board-paging-link:hover { background: #ebebed; color: #55555a; }

.board-paging-link.is-current {
	color: var(--board-title);
	font-weight: 800;
}

/* ============ 상세 ============ */

.board-head-view { margin-bottom: 18px; }

.board-back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 17px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--board-title);
	transition: opacity .15s ease;
}

.board-back:hover { opacity: .55; }

.board-back-arrow {
	display: inline-flex;
	align-items: center;
	color: var(--board-title);
}

/* 상세 상단의 제목 줄은 목록 아이템과 동일한 모양 */
.board-item-head {
	border: 1px solid var(--board-line);
	border-left: 0;
	border-right: 0;
}

.board-view-body {
	padding: 24px 20px 4px;
}

.board-view-paragraph {
	margin: 0 0 6px;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.85;
	color: #3a3a3c;
}

.board-view-paragraph:last-child { margin-bottom: 0; }

.board-view-paragraph b { font-weight: 800; color: var(--board-title); }

/* 첨부파일 */

.board-file-wrap {
	margin: 26px 0 0;
}

.board-file {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 800;
	line-height: 1.4;
	color: var(--board-title);
	transition: opacity .15s ease;
}

.board-file:hover { opacity: .55; }

.board-file-icon {
	display: inline-flex;
	align-items: center;
	color: var(--board-title);
}

.board-file-meta {
	font-weight: 500;
	color: var(--board-muted);
}

/* ============ 등장 효과 (js/notice-board.js) ============ */

.js-reveal {
	opacity: 0;
	transform: translateY(10px);
}

.js-reveal.is-shown {
	opacity: 1;
	transform: none;
	transition: opacity .45s ease, transform .45s ease;
}

/* ============ 반응형 ============ */

@media (max-width: 767px) {
	.board-page { padding: 64px 0 56px; }

	.board-cont { 
		padding: 0; 
		margin: 0;
		max-width: 100%;
	}
	.board-head {
		padding: 0 16px;
	}

	.board-title { font-size: 28px; }

	.board-item { padding: 14px 16px; gap: 12px; }

	.board-item-title { font-size: 13.5px; }

	.board-view-body { padding: 20px 16px 4px; }

	.board-view-paragraph { font-size: 12.5px; line-height: 1.8; }
}

/* ============ 인쇄 ============ */

@media print {
	body { background: #fff; }

	.board-back,
	.board-paging { display: none !important; }

	.js-reveal { opacity: 1 !important; transform: none !important; }

	.board-item { border-color: #999; }

	.board-view-body { display: block !important; }
}