/* theme-nlscs2.css — 국민생명안전위원회 시안 2 (WebZan project 53 이식, 2026-09-06)
   시각 기준: WebZan preview UI_HOME 스크린샷 — 진청록 풀블리드 히어로, 중앙 정렬 카피 + 퀵아이콘 + 추모관 카드.
   krds_tokens.css 원본은 수정하지 않는다 — 오버라이드는 전부 여기서. */

/* 1. 브랜드 토큰 오버라이드 (시안 2 팔레트 — 진청록 계열) */
:root {
	--nlsc-teal: #0E4A46;
	--nlsc-teal-2: #146058;
	--nlsc-teal-bg: #E8F2F0;
	--nlsc-on-teal-dim: rgba(255, 255, 255, 0.75);
	--nlsc-glass: rgba(255, 255, 255, 0.08);
	--nlsc-glass-line: rgba(255, 255, 255, 0.3);
}

:root { --krds-contents-size: 1380; }

/* 섹션 엔진(.main-sect .inner) 안에서 풀블리드로 탈출 — 시안은 히어로가 화면 전폭이다 */
.nlsc-hero { width: 100vw; margin-left: calc(50% - 50vw); }

/* 2. 사이트 커스텀 (G5 허용 클래스 — KRDS 토큰 + §1 변수만 참조) */

/* ---------- 공통 섹션 골격 ---------- */
.nlsc-section { padding: 5.6rem 0; }
.nlsc-section .inner { max-width: calc(var(--krds-contents-size, 1380) * 0.1rem); margin: 0 auto; padding: 0 1.6rem; }

/* 그리드 유틸 (시안 전용) */
.krds-grid { display: grid; gap: 1.6rem; }
.krds-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1024px) {
	.krds-grid--3 { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- 히어로 (진청록 풀블리드 · 중앙 정렬) ---------- */
.nlsc-hero { position: relative; background: var(--nlsc-teal); overflow: hidden; padding: 8rem 0 6.4rem; }
.nlsc-hero__bg { position: absolute; inset: 0; pointer-events: none; }
.nlsc-hero__bg svg { width: 100%; height: 100%; display: block; }
.nlsc-hero .inner { position: relative; max-width: calc(var(--krds-contents-size, 1380) * 0.1rem); margin: 0 auto; padding: 0 1.6rem; text-align: center; }
.nlsc-hero__copy { margin-bottom: 2.4rem; }
.nlsc-hero__sub { font-size: var(--krds-pc-font-size-heading-medium); color: #FFFFFF; line-height: 1.5; margin-bottom: 1.2rem; }
.nlsc-hero__title { font-size: 4.8rem; font-weight: var(--krds-font-weight-bold); color: #FFFFFF; line-height: 1.25; }
.nlsc-hero__ctrl { display: flex; align-items: center; justify-content: center; gap: 1.2rem; margin-bottom: 4rem; }
.nlsc-hero__ctrl-btn {
	width: 3.2rem; height: 3.2rem; border-radius: 50%; cursor: pointer;
	border: 1px solid var(--nlsc-glass-line); background: var(--nlsc-glass);
	display: inline-flex; align-items: center; justify-content: center; color: #FFFFFF;
}
.nlsc-hero__ctrl-btn svg { width: 1.4rem; height: 1.4rem; display: block; }
.nlsc-hero__ctrl-num { color: var(--nlsc-on-teal-dim); font-size: var(--krds-pc-font-size-body-medium); letter-spacing: 0.1em; }
.nlsc-hero__ctrl-num strong { color: #FFFFFF; }
.nlsc-hero__ctrl-bar { position: relative; width: 12rem; height: 2px; background: var(--nlsc-glass-line); border-radius: 1px; overflow: hidden; }
.nlsc-hero__ctrl-bar i { position: absolute; left: 0; top: 0; height: 100%; width: 33%; background: #FFFFFF; }
.nlsc-hero__quick { display: flex; justify-content: center; gap: 4.8rem; margin-bottom: 4.8rem; flex-wrap: wrap; }
.nlsc-hero__quick a { display: flex; flex-direction: column; align-items: center; gap: 1.2rem; text-decoration: none; }
.nlsc-hero__quick-ico {
	width: 8.8rem; height: 8.8rem; border-radius: 50%;
	background: var(--nlsc-glass); border: 1px solid var(--nlsc-glass-line);
	display: flex; align-items: center; justify-content: center;
}
.nlsc-hero__quick-ico svg { width: 4rem; height: 4rem; display: block; }
.nlsc-hero__quick a:hover .nlsc-hero__quick-ico { background: rgba(255, 255, 255, 0.18); }
.nlsc-hero__quick-tit { color: #FFFFFF; font-size: var(--krds-pc-font-size-body-large); font-weight: var(--krds-font-weight-bold); }
.nlsc-hero__memorial { display: grid; grid-template-columns: repeat(2, minmax(0, 42rem)); justify-content: center; gap: 1.6rem; }
.nlsc-memorial {
	display: flex; align-items: center; gap: 1.6rem; padding: 2rem 2.4rem; text-align: left;
	background: var(--nlsc-glass); border: 1px solid var(--nlsc-glass-line); border-radius: 1.2rem; text-decoration: none;
}
.nlsc-memorial:hover strong { text-decoration: underline; }
.nlsc-memorial__ico {
	flex: 0 0 auto; width: 5.6rem; height: 5.6rem; border-radius: 50%;
	background: var(--krds-light-color-surface-white);
	display: flex; align-items: center; justify-content: center;
}
.nlsc-memorial__ico svg { width: 2.8rem; height: 2.8rem; display: block; }
.nlsc-memorial__txt { display: flex; flex-direction: column; gap: 0.4rem; min-width: 0; }
.nlsc-memorial__txt strong { color: #FFFFFF; font-size: var(--krds-pc-font-size-body-large); }
.nlsc-memorial__txt > span { color: var(--nlsc-on-teal-dim); font-size: var(--krds-pc-font-size-body-small); line-height: 1.5; }
.nlsc-memorial__link { margin-left: auto; align-self: flex-start; color: #FFFFFF; }
.nlsc-memorial__link svg { width: 1.6rem; height: 1.6rem; display: block; }
@media (max-width: 1024px) {
	.nlsc-hero__quick { gap: 2.4rem; }
	.nlsc-hero__memorial { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- 주요 안내 (종합계획 카드 + 사이드 카드) ---------- */
.nlsc-plan__grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1.6rem; }
.nlsc-plan__side { display: flex; flex-direction: column; gap: 1.6rem; }
.nlsc-card {
	background: var(--krds-light-color-surface-white);
	border: 1px solid var(--krds-light-color-divider-gray-light);
	border-radius: 1.2rem; padding: 2.8rem;
}
.nlsc-card__tit {
	display: flex; align-items: center; gap: 0.8rem;
	font-size: var(--krds-pc-font-size-heading-xsmall); font-weight: var(--krds-font-weight-bold);
	color: var(--krds-light-color-text-bolder); margin-bottom: 1.2rem;
}
.nlsc-card__ico { display: inline-flex; width: 3.2rem; height: 3.2rem; align-items: center; justify-content: center; background: var(--nlsc-teal-bg); border-radius: 0.8rem; }
.nlsc-card__ico svg { width: 2rem; height: 2rem; display: block; }
.nlsc-card__desc { color: var(--krds-light-color-text-subtle); line-height: 1.6; margin-bottom: 1.6rem; }
.nlsc-card__more { margin-top: auto; }
.nlsc-more { color: var(--nlsc-teal); font-weight: var(--krds-font-weight-bold); text-decoration: none; }
.nlsc-more:hover { text-decoration: underline; }
.nlsc-card--basis, .nlsc-card--sub { display: flex; flex-direction: column; }
.nlsc-plan__items { margin-bottom: 1.6rem; }
.nlsc-plan__item {
	display: flex; flex-direction: column; align-items: center; gap: 1.2rem; padding: 2.4rem 1.2rem;
	border-radius: 1.2rem; text-decoration: none; text-align: center;
	background: var(--krds-light-color-surface-gray-subtler);
}
.nlsc-plan__item--y { background: #FBF4E4; }
.nlsc-plan__item--g { background: #EAF4EC; }
.nlsc-plan__item--b { background: #E8F0F8; }
.nlsc-plan__item:hover .nlsc-plan__item-tit { text-decoration: underline; }
.nlsc-plan__item-ico { width: 5.6rem; height: 5.6rem; display: flex; align-items: center; justify-content: center; }
.nlsc-plan__item-ico svg { width: 100%; height: 100%; display: block; }
.nlsc-plan__item-tit { color: var(--krds-light-color-text-bolder); font-weight: var(--krds-font-weight-bold); line-height: 1.4; }
@media (max-width: 1024px) {
	.nlsc-plan__grid { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- 소식마당 (탭 게시대 + 멀티미디어) ---------- */
.nlsc-news { background: var(--krds-light-color-surface-gray-subtler); }
.nlsc-news__head { font-size: var(--krds-pc-font-size-heading-large); font-weight: var(--krds-font-weight-bold); color: var(--krds-light-color-text-bolder); margin-bottom: 2.4rem; }
.nlsc-news__grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1.6rem; align-items: start; }
.nlsc-news__col { background: var(--krds-light-color-surface-white); border: 1px solid var(--krds-light-color-divider-gray-light); border-radius: 1.2rem; padding: 2.4rem; }
.nlsc-news__more { display: inline-flex; align-items: center; gap: 0.4rem; color: var(--krds-light-color-text-subtle); text-decoration: none; font-size: var(--krds-pc-font-size-body-small); white-space: nowrap; }
.nlsc-news__more:hover { text-decoration: underline; }
.nlsc-news__more svg { width: 1.2rem; height: 1.2rem; display: block; }
.nlsc-tab__bar { display: flex; align-items: center; justify-content: space-between; gap: 1.6rem; border-bottom: 1px solid var(--krds-light-color-divider-gray-light); margin-bottom: 0.8rem; }
.nlsc-tab .tab-list { display: flex; gap: 0.4rem; list-style: none; margin: 0; padding: 0; }
.nlsc-tab .tab-list [role="tab"] { cursor: pointer; }
.nlsc-tab .tab-list [role="tab"] button {
	background: none; border: 0; cursor: pointer; padding: 1.2rem 1.6rem;
	font-size: var(--krds-pc-font-size-body-large); color: var(--krds-light-color-text-subtle);
	border-bottom: 2px solid transparent;
}
.nlsc-tab .tab-list [role="tab"][aria-selected="true"] button {
	color: var(--nlsc-teal); font-weight: var(--krds-font-weight-bold); border-bottom-color: var(--nlsc-teal);
}
.nlsc-tab__panel[hidden] { display: none; }
.nlsc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.nlsc-list li { border-bottom: 1px solid var(--krds-light-color-divider-gray-light); }
.nlsc-list li:last-child { border-bottom: 0; }
.nlsc-list a { display: flex; align-items: center; gap: 1.2rem; padding: 1.4rem 0.4rem; text-decoration: none; }
.nlsc-list__badge {
	flex: 0 0 auto; font-size: var(--krds-pc-font-size-body-small); font-weight: var(--krds-font-weight-bold);
	color: var(--nlsc-teal); background: var(--nlsc-teal-bg); border-radius: 999px; padding: 0.3rem 1rem;
}
.nlsc-list__tit { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--krds-light-color-text-basic); }
.nlsc-list a:hover .nlsc-list__tit { text-decoration: underline; }
.nlsc-list__date { flex: 0 0 auto; font-size: var(--krds-pc-font-size-body-small); color: var(--krds-light-color-text-subtle); }
.nlsc-media__head { display: flex; align-items: center; justify-content: space-between; gap: 1.6rem; margin-bottom: 1.2rem; }
.nlsc-media__tit { font-size: var(--krds-pc-font-size-body-large); font-weight: var(--krds-font-weight-bold); color: var(--krds-light-color-text-bolder); }
.nlsc-media__main { display: block; text-decoration: none; margin-bottom: 1.2rem; }
.nlsc-media__thumb { display: block; background: var(--nlsc-teal-bg); border-radius: 0.8rem; overflow: hidden; margin-bottom: 1rem; }
.nlsc-media__thumb svg { width: 100%; height: auto; display: block; }
.nlsc-media__info { display: flex; flex-direction: column; gap: 0.4rem; }
.nlsc-media__info strong { color: var(--krds-light-color-text-basic); line-height: 1.5; }
.nlsc-media__main:hover strong { text-decoration: underline; }
.nlsc-media__date { font-size: var(--krds-pc-font-size-body-small); color: var(--krds-light-color-text-subtle); }
.nlsc-media__thumbs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.8rem; }
.nlsc-media__thumbs a { display: block; background: var(--nlsc-teal-bg); border-radius: 0.6rem; overflow: hidden; }
.nlsc-media__thumbs svg { width: 100%; height: auto; display: block; }
@media (max-width: 1024px) {
	.nlsc-news__grid { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- 콘텐츠(상세 목업) 페이지 보조 ---------- */
.h3-tit { font-size: var(--krds-pc-font-size-heading-xsmall); font-weight: var(--krds-font-weight-bold); color: var(--krds-light-color-text-bolder); margin-bottom: 0.8rem; }
.text-left { text-align: left; }
.krds-card { border: 1px solid var(--krds-light-color-divider-gray-light); border-radius: 0.8rem; padding: 2rem 2.4rem; background: var(--krds-light-color-surface-white); }
.card-title { font-size: var(--krds-pc-font-size-body-large); font-weight: var(--krds-font-weight-bold); margin-bottom: 1.2rem; }
.krds-card .krds-info-list a { display: flex; align-items: center; gap: 0.8rem; text-decoration: none; padding: 0.6rem 0; }
.krds-card .krds-info-list .title { color: var(--krds-light-color-text-basic); }
.krds-card .krds-info-list .date { margin-left: auto; font-size: var(--krds-pc-font-size-body-small); color: var(--krds-light-color-text-subtle); }