/* ==========================================================================
   KOCS 문화체육진흥원 — KRDS(대한민국 디자인시스템) 기반 스타일
   - KRDS 컬러 토큰/타이포그래피 준용, 템플릿 기존 CSS와 공존(신규 k- 클래스만 사용)
   ========================================================================== */

:root {
    /* KRDS Color Tokens */
    /* 문화체육진흥원 로고 색상 기반 — 남색(navy) + 짙은 붉은색 */
    --krds-primary: #1E3E7E;
    --krds-primary-dark: #16305F;
    --krds-primary-darker: #0E2044;
    --krds-secondary: #14284B;
    --krds-point: #9E1B24;
    --krds-gray-0: #FFFFFF;
    --krds-gray-5: #F8F8F8;
    --krds-gray-10: #F4F5F6;
    --krds-gray-20: #E6E8EA;
    --krds-gray-30: #CDD1D5;
    --krds-gray-40: #B1B8BE;
    --krds-gray-50: #8A949E;
    --krds-gray-60: #6D7882;
    --krds-gray-70: #464C53;
    --krds-gray-80: #33363D;
    --krds-gray-90: #1E2124;
    --krds-bg-sub: #E9EEF7;
    --k-max-width: 1400px;
    --k-radius: 8px;
    --k-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

/* Pretendard GOV 우선 적용 */
body,
button, input, select, textarea {
    font-family: "Pretendard GOV", "Pretendard", -apple-system, BlinkMacSystemFont, "Malgun Gothic", "맑은 고딕", sans-serif;
    color: var(--krds-gray-90);
}

/* 구 layout.css의 body{min-width:1400px}가 모바일에서 가로 스크롤을 유발 → 무력화 */
body {min-width: 0 !important;}
html, body {max-width: 100%; overflow-x: hidden;}

.k-inner {max-width: var(--k-max-width); margin: 0 auto; padding: 0 24px;}
.k-blind {position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0);}

/* 접근성 스킵링크: 평소 숨김, 키보드 포커스 시에만 표시 */
.skip_navi {position: absolute; left: 0; top: -60px; z-index: 2000; padding: 12px 24px; background: var(--krds-primary-dark); color: #fff; font-weight: 700; text-decoration: none; transition: top .15s;}
.skip_navi:focus {top: 0;}

/* ==========================================================================
   Header
   ========================================================================== */
.kheader {background: #fff; border-bottom: 1px solid var(--krds-gray-20);}

/* 최상단 네이비 유틸바 */
.kheader .k-topbar {background: #14284B;}
.kheader .k-topbar .k-inner {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; min-height: 46px; gap: 8px;}
.kheader .k-topbar-left, .kheader .k-topbar-right {display: flex; align-items: center; gap: 14px;}
.kheader .k-tb-link {font-size: 13.5px; color: #fff; text-decoration: none; font-weight: 600;}
.kheader .k-tb-link:hover {text-decoration: underline;}
.kheader .k-tb-div {width: 1px; height: 12px; background: rgba(255,255,255,.3);}
.kheader .k-tb-label {font-size: 13px; color: rgba(255,255,255,.85); font-weight: 600;}
.kheader .k-fontsize {display: flex; align-items: center; gap: 6px;}
.kheader .k-fontsize button {width: 26px; height: 26px; border-radius: 50%; border: 1px solid rgba(255,255,255,.55); background: transparent; color: #fff; font-size: 14px; font-weight: 700; cursor: pointer; line-height: 1; padding: 0;}
.kheader .k-fontsize button:hover {background: rgba(255,255,255,.15);}
.kheader .k-tb-select {height: 30px; padding: 0 26px 0 14px; border-radius: 15px; border: 1px solid rgba(255,255,255,.55); background: transparent; color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23ffffff' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 10px center;}
.kheader .k-tb-select option {color: var(--krds-gray-90);}
.kheader .k-tb-pill {display: inline-flex; align-items: center; height: 30px; padding: 0 18px; border-radius: 15px; background: #fff; color: #14284B !important; font-size: 13px; font-weight: 700; text-decoration: none;}
.kheader .k-tb-pill:hover {background: var(--krds-gray-10);}
@media (max-width: 900px) {
    .kheader .k-topbar-right {display: none;}
}

/* 로고 영역 */
.kheader .k-idbar .k-inner {display: flex; justify-content: space-between; align-items: center; height: 100px;}
.kheader .k-logo a {display: flex; align-items: center; gap: 12px; text-decoration: none; position: relative; overflow: hidden;}
.kheader .k-logo-img {height: 52px; width: auto; display: block;}
/* 로고 빛나는(shine) 효과 — 대각선 하이라이트가 주기적으로 지나감 */
.kheader .k-logo a::after {content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; z-index: 2;
    background: linear-gradient(105deg, transparent 0%, rgba(255,255,255,0) 30%, rgba(255,255,255,.75) 50%, rgba(255,255,255,0) 70%, transparent 100%);
    transform: skewX(-18deg); animation: kLogoShine 4.5s ease-in-out infinite;}
@keyframes kLogoShine {0% {left: -60%;} 22%, 100% {left: 130%;}}
.kheader .k-logo-on-dark {display: none;}
html[data-kocs-mode="dark"] .kheader .k-logo-on-light {display: none;}
html[data-kocs-mode="dark"] .kheader .k-logo-on-dark {display: block;}
/* 통합검색창 (로고~기부하기 사이) */
.kheader .k-search {display: flex; align-items: center; flex: 1; max-width: 420px; margin: 0 32px; height: 48px; border: 2px solid var(--krds-primary); border-radius: 24px; overflow: hidden; background: #fff;}
.kheader .k-search input {flex: 1; min-width: 0; height: 100%; border: 0; padding: 0 20px; font-size: 15px; background: transparent;}
.kheader .k-search input:focus {outline: none;}
.kheader .k-search button {flex-shrink: 0; width: 52px; height: 100%; border: 0; background: var(--krds-primary); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center;}
.kheader .k-search button:hover {background: var(--krds-primary-dark);}
.kheader .k-idbar .k-head-cta {display: flex; gap: 10px; flex-shrink: 0;}

/* 언어 팝업 옵션 */
.k-lang-opt {display: flex; align-items: center; gap: 8px; width: 100%; padding: 14px 18px; border: 1px solid var(--krds-gray-20); border-radius: 8px; background: #fff; font-size: 15.5px; font-weight: 600; color: var(--krds-gray-80); cursor: pointer; text-decoration: none; text-align: left;}
.k-lang-opt:hover {border-color: var(--krds-primary); background: var(--krds-gray-5);}
.k-lang-opt.k-on {border-color: var(--krds-primary); background: var(--krds-bg-sub); color: var(--krds-primary-dark);}
.k-lang-opt span {margin-left: auto; font-size: 12.5px; font-weight: 400; color: var(--krds-gray-50);}
.k-btn-donate {display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 22px; border-radius: 24px; background: var(--krds-point); color: #fff !important; font-size: 15px; font-weight: 700; text-decoration: none; transition: background .2s;}
.k-btn-donate:hover {background: #7E1219;}

/* GNB */
.kgnb {position: relative; background: #fff; border-top: 1px solid var(--krds-gray-30);}
.kgnb .k-inner {display: flex; align-items: stretch; padding: 0 24px;}
.kgnb .k-gnb-list {display: flex; flex: 1; min-width: 0;}
.kgnb .k-gnb-list > li {flex: 1; text-align: center;}
.kgnb .k-gnb-list > li > a {display: block; padding: 16px 8px 14px; font-size: 17px; font-weight: 700; color: var(--krds-gray-80); text-decoration: none; border-bottom: 3px solid transparent; transition: color .15s, border-color .15s;}
.kgnb .k-gnb-list > li:hover > a,
.kgnb .k-gnb-list > li > a:focus {color: var(--krds-primary); border-bottom-color: var(--krds-primary);}
.k-allmenu-btn {display: flex; flex: 0 0 54px; align-items: center; justify-content: center; margin-left: 12px; border: 0; border-left: 1px solid var(--krds-gray-20); background: #fff; color: var(--krds-gray-80); cursor: pointer; transition: color .15s, background .15s;}
.k-allmenu-btn:hover, .k-allmenu-btn:focus-visible {background: var(--krds-gray-5); color: var(--krds-primary); outline: 2px solid var(--krds-primary); outline-offset: -2px;}
.k-sr-only {position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important;}
.kgnb .k-gnb-sub {display: none; position: absolute; left: 0; right: 0; top: 100%; margin-top: 1px; z-index: 100; background: #fff; border-bottom: 1px solid var(--krds-gray-20); box-shadow: 0 12px 20px rgba(0,0,0,.08);}
.kgnb .k-gnb-list > li:hover .k-gnb-sub,
.kgnb .k-gnb-list > li:focus-within .k-gnb-sub {display: block;}

/* 메가메뉴: 패널은 전체폭 흰배경(block), 내용물(k-inner)만 콘텐츠 폭 중앙정렬, 그 안에서 flex */
.kgnb .k-mega {padding: 0; background: #fff;}
.kgnb .k-mega-inner {display: flex; align-items: stretch; gap: 0; min-height: 240px; background: #fff;}
.kgnb .k-mega-img {flex-shrink: 0; width: 300px; align-self: stretch; background: #fff center/contain no-repeat;}
/* 텍스트/그라데이션 없음 — 이미지만 */
.kgnb .k-mega-links {display: flex; flex-flow: column wrap; align-content: flex-start; max-height: 190px; gap: 2px 0; flex: 1; padding: 26px 0 26px 40px; text-align: left;}
.kgnb .k-mega-links li {width: 230px; padding-right: 40px; border-right: 1px solid var(--krds-gray-10);}
.kgnb .k-mega-links li a {display: block; padding: 11px 16px; border-radius: 8px; font-size: 15.5px; color: var(--krds-gray-70); text-decoration: none;}
.kgnb .k-mega-links li a:hover {background: var(--krds-bg-sub); color: var(--krds-primary-dark); font-weight: 600;}

/* ==========================================================================
   Footer
   ========================================================================== */
.kfooter {margin-top: 60px; background: var(--krds-gray-80); color: var(--krds-gray-30);}

/* 관련사이트(패밀리사이트) 바 — 위로 펼쳐지는 드롭다운 */
.k-familysite {background: #14284B; border-top: 2px solid #C9A227;}
.k-fs-inner {display: flex; gap: 0;}
.k-fs-item {position: relative; flex: 1; border-left: 1px solid rgba(255,255,255,.12);}
.k-fs-item:last-child {border-right: 1px solid rgba(255,255,255,.12);}
.k-fs-toggle {display: flex; justify-content: space-between; align-items: center; width: 100%; height: 56px; padding: 0 22px; border: 0; background: none; color: #fff; font-size: 15px; font-weight: 600; cursor: pointer;}
.k-fs-toggle:hover {background: rgba(255,255,255,.06);}
.k-fs-item.k-open .k-fs-toggle {background: var(--krds-primary);}
.k-fs-arrow {font-size: 14px; opacity: .8; transition: transform .2s;}
.k-fs-item.k-open .k-fs-arrow {transform: rotate(180deg);}
.k-fs-list {position: absolute; left: 0; right: 0; bottom: 100%; z-index: 20; background: #0E1C36; border: 1px solid rgba(255,255,255,.12); max-height: 300px; overflow-y: auto;}
.k-fs-list[hidden] {display: none;}
.k-fs-list a {display: block; padding: 13px 22px; color: var(--krds-gray-20); font-size: 14px; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.06);}
.k-fs-list a:hover {background: rgba(255,255,255,.08); color: #fff;}
@media (max-width: 800px) {
    .k-fs-inner {flex-wrap: wrap;}
    .k-fs-item {flex: 1 1 50%; border-top: 1px solid rgba(255,255,255,.12);}
}
.kfooter .k-foot-links {border-bottom: 1px solid rgba(255,255,255,.12);}
.kfooter .k-foot-links .k-inner {display: flex; gap: 28px; height: 52px; align-items: center;}
.kfooter .k-foot-links a {font-size: 14px; color: var(--krds-gray-20); text-decoration: none;}
.kfooter .k-foot-links a:hover {text-decoration: underline;}
.kfooter .k-foot-links a.k-privacy {color: #FFD262; font-weight: 700;}
.kfooter .k-foot-body .k-inner {display: flex; justify-content: space-between; gap: 24px; padding: 28px 24px 36px;}
.kfooter .k-foot-org strong {display: block; font-size: 18px; color: #fff; font-weight: 700; margin-bottom: 12px;}
.kfooter address {font-style: normal; font-size: 14px; line-height: 1.7; color: var(--krds-gray-30);}
.kfooter .k-copy {margin-top: 14px; font-size: 13px; color: var(--krds-gray-50);}
.kfooter .k-foot-extra {font-size: 13px; text-align: right; color: var(--krds-gray-40); line-height: 1.8;}
.k-foot-sns {display: flex; justify-content: flex-end; gap: 9px; margin-bottom: 16px;}
.k-foot-sns-link {display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: #fff; text-decoration: none; transition: transform .18s, box-shadow .18s;}
.k-foot-sns-link:hover {transform: translateY(-3px); box-shadow: 0 6px 14px rgba(0,0,0,.22);}
.k-foot-sns-link img {display: block; width: 21px; height: 21px; object-fit: contain;}
.k-foot-sns-kakao {background: #fee500; color: #191919; font-size: 12px; font-weight: 800;}
.k-foot-extra-text {white-space: nowrap;}

/* ==========================================================================
   메인 페이지
   ========================================================================== */
.k-main {background: #fff;}

/* Hero 슬라이더 */
.k-hero {position: relative; overflow: hidden; background: linear-gradient(120deg, var(--krds-primary-darker) 0%, var(--krds-primary) 55%, #3358A0 100%); color: #fff;}
/* 메인 배경 이미지 슬라이드쇼 (랜덤) */
.k-hero-bgshow {position: absolute; inset: 0; z-index: 0;}
.k-hero-bgimg {position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1.4s ease; transform: scale(1.04);}
.k-hero-bgimg.k-on {opacity: 1; animation: kBgZoom 8s ease-out forwards;}
@keyframes kBgZoom {from {transform: scale(1.04);} to {transform: scale(1.12);}}
.k-hero-bgshow::after {content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,32,80,.82) 0%, rgba(8,32,80,.55) 50%, rgba(8,32,80,.28) 100%);}
.k-hero .k-hero-track {position: relative; z-index: 1;}
.k-hero .k-hero-slide {position: relative;}
.k-hero .k-inner {display: flex; flex-direction: column; justify-content: center; min-height: 660px; padding-top: 48px; padding-bottom: 48px; position: relative; z-index: 2;}
/* 이미지 배경 슬라이드 */
.k-hero .k-hero-img {background-size: cover; background-position: center;}
.k-hero .k-hero-img::before {content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(8,32,80,.78) 0%, rgba(8,32,80,.45) 55%, rgba(8,32,80,.15) 100%);}

/* 효과: fade (겹쳐놓고 투명도 전환) */
.k-hero-fx-fade .k-hero-track {display: grid;}
.k-hero-fx-fade .k-hero-slide {grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity .7s ease;}
.k-hero-fx-fade .k-hero-slide.k-on {opacity: 1; visibility: visible; z-index: 1;}
/* 효과: slide (가로 이동) */
.k-hero-fx-slide .k-hero-track {display: flex; transition: transform .6s cubic-bezier(.4,0,.2,1);}
.k-hero-fx-slide .k-hero-slide {flex: 0 0 100%;}
/* 효과: none (즉시 전환) */
.k-hero-fx-none .k-hero-track {display: grid;}
.k-hero-fx-none .k-hero-slide {grid-area: 1 / 1; opacity: 0; visibility: hidden;}
.k-hero-fx-none .k-hero-slide.k-on {opacity: 1; visibility: visible;}

/* 슬라이드 진입 시 텍스트 살짝 떠오르는 애니메이션 */
.k-hero-slide.k-on h2, .k-hero-slide.k-on p, .k-hero-slide.k-on .k-hero-badge, .k-hero-slide.k-on .k-hero-btns {animation: kHeroUp .7s ease both;}
.k-hero-slide.k-on p {animation-delay: .08s;}
.k-hero-slide.k-on .k-hero-btns {animation-delay: .16s;}
@keyframes kHeroUp {from {opacity: 0; transform: translateY(16px);} to {opacity: 1; transform: translateY(0);}}

/* 화살표 */
.k-hero-arrow {position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,255,255,.5); background: rgba(0,0,0,.2); color: #fff; font-size: 26px; line-height: 1; cursor: pointer; transition: background .15s;}
.k-hero-arrow:hover {background: rgba(0,0,0,.45);}
.k-hero-prev {left: 24px;}
.k-hero-next {right: 24px;}
/* 도트 */
.k-hero-dots {position: absolute; left: 0; right: 0; bottom: 20px; z-index: 5; display: flex; justify-content: center; gap: 9px;}
.k-hero-dot {width: 10px; height: 10px; border-radius: 50%; border: 0; background: rgba(255,255,255,.45); cursor: pointer; padding: 0; transition: background .15s, width .15s;}
.k-hero-dot.k-on {background: #fff; width: 26px; border-radius: 5px;}
.k-hero .k-hero-badge {display: inline-flex; width: fit-content; padding: 6px 14px; border-radius: 16px; background: rgba(255,255,255,.16); font-size: 13px; font-weight: 600; letter-spacing: .5px; margin-bottom: 18px;}
.k-hero h2 {font-size: 40px; font-weight: 800; line-height: 1.3; letter-spacing: -1px; margin-bottom: 14px;}
.k-hero p {font-size: 17px; line-height: 1.6; color: rgba(255,255,255,.85); margin-bottom: 28px;}
.k-hero .k-hero-btns {display: flex; gap: 12px;}
.k-hero .k-hero-btns a {display: inline-flex; align-items: center; height: 48px; padding: 0 26px; border-radius: 26px; font-size: 16px; font-weight: 700; text-decoration: none; transition: transform .15s;}
.k-hero .k-hero-btns a:hover {transform: translateY(-2px);}
.k-hero .k-hero-btns .k-cta-1 {background: #fff; color: var(--krds-primary-dark);}
.k-hero .k-hero-btns .k-cta-2 {background: var(--krds-point); color: #fff;}
.k-hero .k-hero-btns .k-cta-3 {background: rgba(255,255,255,.16); color: #fff; border: 1px solid rgba(255,255,255,.45);}

/* 퀵메뉴 */
.k-quick {position: relative; margin-top: -36px; z-index: 5;}
.k-quick .k-quick-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;}
.k-quick .k-quick-item {display: flex; flex-direction: column; gap: 8px; padding: 24px; background: #fff; border: 1px solid var(--krds-gray-20); border-radius: var(--k-radius); box-shadow: var(--k-shadow); text-decoration: none; transition: border-color .15s, transform .15s;}
.k-quick .k-quick-item:hover {border-color: var(--krds-primary); transform: translateY(-3px);}
.k-quick .k-quick-item .k-q-icon {width: 44px; height: 44px; border-radius: 10px; background: var(--krds-bg-sub); display: flex; align-items: center; justify-content: center;}
.k-quick .k-quick-item .k-q-icon svg {width: 24px; height: 24px; stroke: var(--krds-primary-dark);}
.k-quick .k-quick-item strong {font-size: 17px; color: var(--krds-gray-90);}
.k-quick .k-quick-item span {font-size: 13.5px; color: var(--krds-gray-60); line-height: 1.5;}

/* 메인 주요 서비스 가로 바로가기 */
.k-service-shortcuts{padding:38px 0 2px;background:#fff}
.k-service-bar{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));overflow:hidden;border-radius:14px;background:linear-gradient(120deg,#1e3e7e,#285fc2);box-shadow:0 12px 30px rgba(20,40,75,.16)}
.k-service-bar a{position:relative;display:flex;min-width:0;min-height:132px;padding:20px 8px 17px;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#fff;text-align:center;text-decoration:none;box-sizing:border-box;transition:background .2s,transform .2s}
.k-service-bar a:not(:last-child)::after{content:"";position:absolute;right:0;top:28px;bottom:28px;width:1px;background:rgba(255,255,255,.18)}
.k-service-bar a:hover{background:rgba(255,255,255,.12);transform:translateY(-2px)}
.k-service-icon{display:flex;width:48px;height:48px;align-items:center;justify-content:center}
.k-service-icon svg{width:44px;height:44px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s}
.k-service-bar a:hover .k-service-icon svg{stroke:#ffd52a}
.k-service-bar strong{font-size:14px;line-height:1.35;word-break:keep-all}
@media(max-width:900px){.k-service-bar{grid-template-columns:repeat(4,1fr)}.k-service-bar a:nth-child(4)::after{display:none}}
@media(max-width:560px){.k-service-shortcuts{padding-top:28px}.k-service-bar{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;border-radius:10px}.k-service-bar a{flex:0 0 132px;min-height:116px;scroll-snap-align:start}.k-service-icon{width:40px;height:40px}.k-service-icon svg{width:38px;height:38px}}

/* 섹션 공통 */
.k-section {padding: 56px 0 0;}
.k-section .k-sec-head {display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 22px;}
.k-section .k-sec-head h2 {font-size: 26px; font-weight: 800; letter-spacing: -.5px;}
.k-section .k-sec-head .k-more {font-size: 14px; color: var(--krds-gray-60); text-decoration: none;}
.k-section .k-sec-head .k-more:hover {color: var(--krds-primary);}

/* 소식(공지/갤러리 탭) + 기부 배너 2단 */
.k-news-grid {display: grid; grid-template-columns: 1fr 380px; gap: 24px; align-items: stretch;}
.k-board-box {height: 478px; overflow: hidden; border: 1px solid var(--krds-gray-20); border-radius: var(--k-radius); padding: 8px 24px 20px; background: #fff; box-sizing: border-box;}
.k-news-grid .k-donate-banner {height: 478px; box-sizing: border-box;}
@media (max-width: 700px) {.k-board-box,.k-news-grid .k-donate-banner {height: auto; overflow: visible;}}
.k-board-box .k-tabs {display: flex; gap: 4px; border-bottom: 1px solid var(--krds-gray-20); margin-bottom: 6px;}
.k-board-box .k-tabs button {padding: 14px 18px 12px; border: 0; background: none; font-size: 17px; font-weight: 700; color: var(--krds-gray-50); cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -1px;}
.k-board-box .k-tabs button.k-on {color: var(--krds-gray-90); border-bottom-color: var(--krds-primary);}
.k-board-box .k-board-list li a {display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 13px 4px; border-bottom: 1px solid var(--krds-gray-10); text-decoration: none;}
.k-board-box .k-board-list li:last-child a {border-bottom: 0;}
.k-board-box .k-board-list .k-b-tit {flex: 1; font-size: 15.5px; color: var(--krds-gray-80); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.k-board-box .k-board-list li a:hover .k-b-tit {color: var(--krds-primary-dark); text-decoration: underline;}
.k-board-box .k-board-list .k-b-date {font-size: 13.5px; color: var(--krds-gray-50); flex-shrink: 0;}
.k-board-box .k-photo-list li a {min-height: 54px;}
.k-board-box .k-photo-list img {width: 70px; height: 46px; flex: 0 0 70px; border-radius: 6px; object-fit: cover; background: #f2f5fa;}
.k-board-box .k-board-empty {padding: 36px 0; text-align: center; color: var(--krds-gray-50); font-size: 14.5px;}

/* 기부 배너 */
.k-donate-banner {display: flex; flex-direction: column; justify-content: center; gap: 12px; padding: 32px 30px; border-radius: var(--k-radius); background: linear-gradient(135deg, #8A1620 0%, var(--krds-point) 100%); color: #fff;}
.k-donate-banner .k-d-badge {width: fit-content; padding: 4px 12px; border-radius: 13px; background: rgba(255,255,255,.2); font-size: 12.5px; font-weight: 600;}
.k-donate-banner strong {font-size: 24px; font-weight: 800; line-height: 1.35; letter-spacing: -.5px;}
.k-donate-banner p {font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.9);}
.k-donate-banner .k-d-btns {display: flex; gap: 8px; margin-top: 6px;}
.k-donate-banner .k-d-btns a {display: inline-flex; align-items: center; height: 40px; padding: 0 18px; border-radius: 20px; font-size: 14px; font-weight: 700; text-decoration: none;}
.k-donate-banner .k-d-btns .k-d-1 {background: #fff; color: var(--krds-point);}
.k-donate-banner .k-d-btns .k-d-2 {background: rgba(255,255,255,.18); color: #fff; border: 1px solid rgba(255,255,255,.5);}

/* 사업 카드 */
.k-biz-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;}
.k-biz-card {display: block; padding: 26px 24px 24px; border: 1px solid var(--krds-gray-20); border-radius: var(--k-radius); background: #fff; text-decoration: none; transition: border-color .15s, box-shadow .15s;}
.k-biz-card:hover {border-color: var(--krds-primary); box-shadow: var(--k-shadow);}
.k-biz-card .k-biz-num {font-size: 13px; font-weight: 700; color: var(--krds-primary); letter-spacing: 1px;}
.k-biz-card strong {display: block; margin: 8px 0 10px; font-size: 18.5px; font-weight: 700; color: var(--krds-gray-90);}
.k-biz-card p {font-size: 14px; line-height: 1.6; color: var(--krds-gray-60);}

/* 메인 하단 여백 */
.k-main-bottom {padding-bottom: 72px;}

/* ==========================================================================
   서브페이지 공통
   ========================================================================== */
.k-sub-visual {background: linear-gradient(120deg, var(--krds-primary-darker) 0%, var(--krds-primary) 40%, #2E5AA8 70%, var(--krds-primary-dark) 100%); background-size: 300% 300%; color: #fff;}
@media (prefers-reduced-motion: no-preference) {
    .k-sub-visual {animation: kSubGrad 16s ease infinite;}
    @keyframes kSubGrad {0% {background-position: 0% 50%;} 50% {background-position: 100% 50%;} 100% {background-position: 0% 50%;}}
}
.k-sub-visual .k-inner {padding-top: 44px; padding-bottom: 44px;}
.k-sub-visual h2 {font-size: 32px; font-weight: 800; letter-spacing: -.5px;}
.k-sub-visual p {margin-top: 8px; font-size: 15px; color: rgba(255,255,255,.8);}

.k-sub-layout {display: flex; gap: 48px; align-items: flex-start; padding-top: 44px;}

/* 좌측 메뉴 */
.k-snb {width: 240px; flex-shrink: 0;}
.k-snb h2 {position: relative; min-height: 68px; display: flex; align-items: center; padding: 18px 24px; border-radius: 8px 8px 0 0; background: var(--krds-primary-dark); color: #fff; font-size: 20px; font-weight: 700;}
.k-snb h2::after {content: ""; display: none;}
.k-snb ul {margin-top: 0; border: 1px solid var(--krds-gray-20); border-top: 0; border-radius: 0 0 8px 8px; background: #fff; overflow: hidden;}
.k-snb ul li + li {border-top: 1px solid var(--krds-gray-10);}
.k-snb ul li a {position: relative; display: block; padding: 14px 24px; font-size: 15px; color: var(--krds-gray-70); text-decoration: none; transition: background .15s, color .15s;}
.k-snb ul li a::after {display: none;}
.k-snb ul li a:hover {background: var(--krds-gray-5); color: var(--krds-primary-dark);}
.k-snb ul li a:hover::after {color: var(--krds-primary);}
.k-snb ul li a.k-cur {background: #e8edf5; color: var(--krds-primary-dark); font-weight: 700; box-shadow: inset 3px 0 0 var(--krds-primary);}
.k-snb-contact {display: flex; align-items: flex-start; gap: 11px; margin-top: 18px; padding: 20px 16px; border: 1px solid var(--krds-gray-10); border-radius: 10px; background: #fff; box-shadow: 0 5px 16px rgba(20,40,75,.09);}
.k-snb-contact-icon {display: flex; flex: 0 0 30px; align-items: center; justify-content: center; padding-top: 2px; color: var(--krds-primary);}
.k-snb-contact-info {display: flex; min-width: 0; flex-direction: column;}
.k-snb-contact-info strong {margin-bottom: 2px; color: var(--krds-gray-70); font-size: 13px; font-weight: 700;}
.k-snb-contact-info a {margin-bottom: 7px; color: var(--krds-primary-dark); font-size: 18px; font-weight: 800; line-height: 1.25; text-decoration: none; white-space: nowrap;}
.k-snb-contact-info a:hover {text-decoration: underline;}
.k-snb-contact-info span {color: var(--krds-gray-60); font-size: 11.5px; line-height: 1.65; white-space: nowrap;}

/* 본문 */
.k-content {flex: 1; min-width: 0; padding-bottom: 80px;}
.k-breadcrumb {display: flex; align-items: center; gap: 8px; margin-bottom: 20px; font-size: 13.5px; color: var(--krds-gray-50);}
.k-breadcrumb a {color: var(--krds-gray-50); text-decoration: none;}
.k-breadcrumb a:hover {color: var(--krds-primary);}
.k-breadcrumb li {display: flex; align-items: center; gap: 8px;}
.k-breadcrumb li + li::before {content: "›"; color: var(--krds-gray-40);}
.k-breadcrumb .k-bc-home {display: inline-flex; align-items: center; color: var(--krds-gray-50);}
.k-breadcrumb .k-bc-home:hover {color: var(--krds-primary);}
.k-content > h1, .k-content .k-page-title {font-size: 30px; font-weight: 800; letter-spacing: -.5px; padding-bottom: 18px; margin-bottom: 28px; border-bottom: 2px solid var(--krds-gray-90);}
/* 제목 + 우측 도구(공유/인쇄) 행 */
.k-page-head {display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; padding-bottom: 18px; margin-bottom: 28px; border-bottom: 2px solid var(--krds-gray-90);}
.k-page-head .k-page-title {padding-bottom: 0; margin-bottom: 0; border-bottom: 0;}
.k-page-tools {display: flex; gap: 8px; flex: none; padding-bottom: 4px;}
.k-tool-btn {width: 42px; height: 42px; border: 1px solid var(--krds-gray-30); border-radius: 50%; background: #fff; color: var(--krds-gray-70); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: all .15s;}
.k-tool-btn:hover {border-color: var(--krds-primary); color: var(--krds-primary); background: var(--krds-bg-sub);}
html[data-kocs-mode="dark"] .k-page-head {border-bottom-color: #4A5561;}
html[data-kocs-mode="dark"] .k-tool-btn {background: #242B34; border-color: #3A424C; color: #CDD1D5;}
@media (max-width: 600px) {
    .k-page-head {flex-wrap: wrap; align-items: center;}
    .k-tool-btn {width: 38px; height: 38px;}
}
@media print {
    .k-header, header, .k-snb, .k-sub-visual, .k-breadcrumb, .k-page-tools, .k-bsearch, .k-board-top, .k-paging,
    .k-survey, .k-fab, #kocsPopupLayer, .k-nubi, .skip_navi, footer, .k-footer {display: none !important;}
    .k-sub-layout, .k-content {display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important;}
    body {background: #fff !important;}
}

/* 본문 요소 */
.k-content h3 {position: relative; margin: 36px 0 14px; padding-left: 14px; font-size: 21px; font-weight: 700;}
.k-content h3::before {content: ""; position: absolute; left: 0; top: 6px; width: 4px; height: 18px; border-radius: 2px; background: var(--krds-primary);}
.k-content p.k-txt {font-size: 15.5px; line-height: 1.8; color: var(--krds-gray-70); margin-bottom: 12px;}
.k-content .k-lead {font-size: 18px; line-height: 1.7; color: var(--krds-gray-80); margin-bottom: 20px;}
.k-content .k-lead strong {color: var(--krds-primary-dark);}

.k-info-box {padding: 22px 26px; border-radius: var(--k-radius); background: var(--krds-gray-5); border: 1px solid var(--krds-gray-20); margin: 18px 0;}
.k-info-box.k-blue {background: var(--krds-bg-sub); border-color: #C7D8F0;}
.k-info-box ul li {position: relative; padding-left: 14px; font-size: 15px; line-height: 1.9; color: var(--krds-gray-70);}
.k-info-box ul li::before {content: ""; position: absolute; left: 0; top: 12px; width: 5px; height: 5px; border-radius: 50%; background: var(--krds-primary);}

/* 표 */
.k-table {width: 100%; border-collapse: collapse; margin: 16px 0; border-top: 2px solid var(--krds-gray-90); font-size: 15px;}
.k-table th {padding: 13px 16px; background: var(--krds-gray-5); border-bottom: 1px solid var(--krds-gray-20); font-weight: 700; text-align: left; color: var(--krds-gray-80);}
.k-table td {padding: 13px 16px; border-bottom: 1px solid var(--krds-gray-20); color: var(--krds-gray-70); line-height: 1.6;}
.k-table.k-center th, .k-table.k-center td {text-align: center;}

/* 연혁 */
.k-history {margin: 20px 0;}
.k-history .k-h-year {display: flex; gap: 28px; padding: 22px 0; border-bottom: 1px solid var(--krds-gray-20);}
.k-history .k-h-year > strong {width: 90px; flex-shrink: 0; font-size: 24px; font-weight: 800; color: var(--krds-primary-dark);}
.k-history .k-h-year ul li {display: flex; gap: 14px; font-size: 15px; line-height: 2; color: var(--krds-gray-70);}
.k-history .k-h-year ul li em {font-style: normal; font-weight: 700; color: var(--krds-gray-50); width: 44px; flex-shrink: 0;}

/* 단계(Step) 안내 */
.k-steps {display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 18px 0;}
.k-steps .k-step {position: relative; padding: 20px 18px; border: 1px solid var(--krds-gray-20); border-radius: var(--k-radius); background: #fff;}
.k-steps .k-step .k-step-no {display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--krds-primary); color: #fff; font-size: 13px; font-weight: 700; margin-bottom: 10px;}
.k-steps .k-step strong {display: block; font-size: 15.5px; margin-bottom: 6px;}
.k-steps .k-step p {font-size: 13.5px; line-height: 1.55; color: var(--krds-gray-60);}

/* 버튼 */
.k-btn {display: inline-flex; align-items: center; justify-content: center; height: 46px; padding: 0 26px; border-radius: 6px; font-size: 15.5px; font-weight: 700; text-decoration: none; cursor: pointer; border: 0; transition: background .15s;}
.k-btn-primary {background: var(--krds-primary); color: #fff !important;}
.k-btn-primary:hover {background: var(--krds-primary-dark);}
.k-btn-line {background: #fff; color: var(--krds-gray-70) !important; border: 1px solid var(--krds-gray-30);}
.k-btn-line:hover {border-color: var(--krds-gray-60);}
.k-btn-point {background: var(--krds-point); color: #fff !important;}
.k-btn-point:hover {background: #7E1219;}
.k-btn-area {display: flex; gap: 10px; margin: 24px 0;}

/* 기부 참여 폼 */
.k-donate-wrap {max-width: 640px; margin: 0 auto;}
.k-donate-card {margin: 16px 0 8px; padding: 30px 34px; background: #fff; border: 1px solid var(--krds-gray-20); border-radius: 14px; box-shadow: 0 6px 22px rgba(20,40,75,.06);}
.k-donate-card .k-fld {margin-bottom: 22px;}
.k-donate-card .k-fld:last-of-type {margin-bottom: 24px;}
.k-donate-card .k-fld-label {font-weight: 700; font-size: 15px; color: var(--krds-gray-90); margin-bottom: 10px; display: block;}
.k-donate-card .k-input {width: 100%; padding: 13px 15px; border: 1px solid var(--krds-gray-30); border-radius: 8px; font-size: 15px; box-sizing: border-box;}
.k-donate-card .k-input:focus {outline: none; border-color: var(--krds-primary); box-shadow: 0 0 0 3px rgba(30,62,126,.12);}
.k-donate-card .k-input + .k-input {margin-top: 9px;}
.k-amt-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin-bottom: 10px;}
.k-amt-grid .don-amt {height: 50px; padding: 0; font-size: 15.5px; border-radius: 8px;}
.k-pay-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;}
.k-pay-grid .don-pay {height: 52px; border-radius: 8px; font-size: 15.5px;}
.k-pay-grid .don-pay.on {outline: 3px solid var(--krds-primary); outline-offset: -1px;}
.k-donate-card .k-receipt {display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 14.5px; color: var(--krds-gray-70); cursor: pointer;}
.k-donate-card .k-receipt input {width: 17px; height: 17px; accent-color: var(--krds-primary);}
.k-donate-card .k-donate-submit {width: 100%; height: 56px; font-size: 17px; border-radius: 10px; margin-top: 4px;}
.k-donate-card .k-donate-msg {font-size: 13.5px; color: var(--krds-point); margin-top: 10px; text-align: center;}
html[data-kocs-mode="dark"] .k-donate-card {background: #1B2027; border-color: #2C333C; box-shadow: none;}
html[data-kocs-mode="dark"] .k-donate-card .k-input {background: #242B34; border-color: #3A424C; color: #E6E8EA;}
html[data-kocs-mode="dark"] .k-donate-card .k-fld-label {color: #E6E8EA;}
@media (max-width: 560px) {
    .k-donate-card {padding: 22px 18px;}
    .k-amt-grid {grid-template-columns: repeat(2, 1fr);}
}

/* ===== 게시판 KFTC 스타일 ===== */
/* 검색 영역 */
.k-bsearch {margin: 4px 0 20px;}
.k-bsearch-row {display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap;}
.k-bs-sel {height: 46px; padding: 0 34px 0 14px; border: 1px solid var(--krds-gray-30); border-radius: 8px; font-size: 15px; background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23667' stroke-width='1.8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E") no-repeat right 12px center; appearance: none; cursor: pointer; color: var(--krds-gray-80);}
.k-bs-input {position: relative; flex: 1; min-width: 220px;}
.k-bs-input input {width: 100%; height: 46px; padding: 0 46px 0 16px; border: 1px solid var(--krds-gray-30); border-radius: 8px; font-size: 15px; box-sizing: border-box;}
.k-bs-input input:focus {outline: none; border-color: var(--krds-primary); box-shadow: 0 0 0 3px rgba(30,62,126,.12);}
.k-bs-go {position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border: 0; background: transparent; color: var(--krds-gray-60); cursor: pointer; display: flex; align-items: center; justify-content: center;}
.k-bs-go:hover {color: var(--krds-primary);}
.k-bs-adv {height: 46px; padding: 0 16px; border: 1px solid var(--krds-primary); border-radius: 8px; background: #fff; color: var(--krds-primary); font-size: 15px; font-weight: 700; cursor: pointer; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px;}
.k-bs-adv:hover {background: var(--krds-bg-sub);}
.k-bs-adv-ic {font-size: 16px;}
/* 상세검색 슬라이드(미끄러지듯 펼침) */
.k-bsearch-adv {display: grid; grid-template-rows: 0fr; transition: grid-template-rows .38s cubic-bezier(.22,1,.36,1);}
.k-bsearch-adv.k-open {grid-template-rows: 1fr;}
.k-bsearch-adv-clip {overflow: hidden; min-height: 0;}
.k-bsearch-adv-box {margin-top: 10px; padding: 22px 24px; background: var(--krds-gray-5); border: 1px solid var(--krds-gray-20); border-radius: 10px;}
.k-bsa-line {display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 14px;}
.k-bsa-label {width: 72px; font-weight: 700; font-size: 14.5px; color: var(--krds-gray-80);}
.k-bsa-dates {display: flex; align-items: center; gap: 8px;}
.k-bsa-dates input {height: 42px; padding: 0 12px; border: 1px solid var(--krds-gray-30); border-radius: 8px; font-size: 14px;}
.k-bsa-quick {display: flex; gap: 6px; flex-wrap: wrap;}
.k-bsa-quick button {height: 38px; padding: 0 14px; border: 1px solid var(--krds-primary); border-radius: 8px; background: #fff; color: var(--krds-primary); font-size: 13.5px; font-weight: 600; cursor: pointer;}
.k-bsa-quick button:hover {background: var(--krds-primary); color: #fff;}
.k-bsa-apply {display: flex; justify-content: center; padding-top: 4px; border-top: 1px solid var(--krds-gray-20); margin-top: 4px;}
.k-bsa-apply .k-btn {margin-top: 16px; min-width: 100px;}

/* 목록 상단(건수/글쓰기) */
.k-board-top {display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;}
.k-board-total {font-size: 14.5px; color: var(--krds-gray-70);}
.k-board-total strong {color: var(--krds-primary-dark);}

/* KFTC 목록 테이블 */
.k-btable-wrap {overflow-x: auto;}
.k-btable {width: 100%; border-collapse: collapse; border-top: 2px solid var(--krds-gray-90); font-size: 15px;}
.k-btable th {padding: 14px 12px; background: var(--krds-gray-5); border-bottom: 1px solid var(--krds-gray-20); font-weight: 700; color: var(--krds-gray-80); text-align: center;}
.k-btable td {padding: 15px 12px; border-bottom: 1px solid var(--krds-gray-20); color: var(--krds-gray-70); vertical-align: middle;}
.k-btable td.k-c {text-align: center; white-space: nowrap;}
.k-btable td.k-t {text-align: left;}
.k-btable td.k-t a {color: var(--krds-gray-90); font-weight: 500;}
.k-btable td.k-t a:hover {color: var(--krds-primary); text-decoration: underline;}
.k-btable td.k-dept {color: var(--krds-gray-60); font-size: 14px;}
.k-btable tbody tr:hover {background: #fafbfd;}
.k-atch-ic {display: inline-flex; align-items: center; gap: 8px; justify-content: center; color: var(--krds-gray-50);}
.k-atch-ic a {color: var(--krds-primary); display: inline-flex;}
.k-atch-ic a:hover {color: var(--krds-primary-dark);}
.k-atch-prev {border: 0; background: transparent; color: var(--krds-gray-50); font-size: 17px; cursor: pointer; line-height: 1; padding: 0; text-decoration: none; display: inline-flex; align-items: center;}
.k-atch-prev:hover {color: var(--krds-primary);}
.k-atch-none {color: var(--krds-gray-30);}

/* 페이징 */
.k-paging {display: flex; justify-content: center; align-items: center; gap: 4px; margin: 30px 0 8px; flex-wrap: wrap;}
.k-paging a {min-width: 38px; height: 38px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; font-size: 14.5px; color: var(--krds-gray-70); text-decoration: none;}
.k-paging a:hover {background: var(--krds-gray-5);}
.k-paging a.k-pg-cur {background: var(--krds-primary); color: #fff; font-weight: 700;}
.k-paging a.k-pg-arrow {color: var(--krds-gray-60);}
.k-paging a.k-pg-off {opacity: .4; pointer-events: none;}
.k-paging .k-pg-dots {padding: 0 4px; color: var(--krds-gray-40);}

/* 상세 첨부 박스 */
.k-view-atch {margin: 4px 0 24px; border: 1px solid var(--krds-gray-20); border-radius: 10px; overflow: hidden;}
.k-va-head {display: flex; align-items: center; justify-content: space-between; padding: 12px 18px; background: var(--krds-gray-5); border-bottom: 1px solid var(--krds-gray-20);}
.k-va-head strong {font-size: 15px; color: var(--krds-gray-90);}
.k-va-zip {display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 700; color: var(--krds-primary); padding: 6px 12px; border: 1px solid var(--krds-primary); border-radius: 7px;}
.k-va-zip:hover {background: var(--krds-primary); color: #fff;}
.k-va-list {list-style: none; margin: 0; padding: 0;}
.k-va-list li {display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 18px; border-bottom: 1px solid var(--krds-gray-10); font-size: 14.5px;}
.k-va-list li:last-child {border-bottom: 0;}
.k-va-name {color: var(--krds-gray-80);}
.k-va-name em {color: var(--krds-gray-50); font-style: normal; font-size: 13px;}
.k-va-btns {display: inline-flex; align-items: center; gap: 12px; white-space: nowrap;}
.k-va-btns a {color: var(--krds-primary); display: inline-flex;}
.k-view-meta {display: flex; flex-wrap: wrap; gap: 6px 18px;}
.k-view-meta span {position: relative;}

/* 미리보기 팝업 */
.k-pv-overlay {position: fixed; inset: 0; z-index: 9500; background: rgba(10,18,34,.6); display: flex; align-items: center; justify-content: center; padding: 24px;}
.k-pv-box {width: 100%; max-width: 900px; max-height: 90vh; background: #fff; border-radius: 12px; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.4);}
.k-pv-head {display: flex; align-items: center; justify-content: space-between; padding: 12px 18px; background: var(--krds-secondary); color: #fff;}
.k-pv-title {font-size: 15px;}
.k-pv-actions {display: flex; align-items: center; gap: 10px;}
.k-pv-dl {color: #fff; display: inline-flex;}
.k-pv-dl:hover {opacity: .8;}
.k-pv-close {border: 0; background: transparent; color: #fff; font-size: 18px; cursor: pointer; line-height: 1;}
.k-pv-body {flex: 1; overflow: auto; background: #f4f6fa; display: flex; align-items: center; justify-content: center; min-height: 300px;}
.k-pv-body img {max-width: 100%; height: auto; display: block;}
.k-pv-body iframe {width: 100%; height: 78vh; border: 0; background: #fff;}
.k-pv-msg {text-align: center; padding: 40px 20px; color: var(--krds-gray-60);}
.k-pv-msg p {margin: 0 0 16px; font-size: 15px;}
@media (max-width: 600px) {
    .k-bs-sel, .k-bs-adv {height: 44px;}
    .k-bsa-label {width: 100%;}
    .k-btable td.k-dept {display: none;}
    .k-btable th:nth-child(4) {display: none;}
    .k-pv-body iframe {height: 70vh;}
}

/* 회원가입 약관 동의 */
.k-join-agree {margin: 18px 0; padding: 14px 18px; background: var(--krds-gray-5); border: 1px solid var(--krds-gray-20); border-radius: 8px;}
.k-agree-item {display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14.5px; color: var(--krds-gray-80); cursor: pointer;}
.k-agree-item input {width: 17px; height: 17px; accent-color: var(--krds-primary);}
.k-agree-item strong {color: var(--krds-point);}
.k-agree-item a {color: var(--krds-primary); text-decoration: underline;}

/* 웹에디터 */
.k-ed-wrap {border: 1px solid var(--krds-gray-30); border-radius: 8px; overflow: hidden; background: #fff;}
.k-ed-bar {display: flex; flex-wrap: wrap; align-items: center; gap: 2px; padding: 6px 8px; border-bottom: 1px solid var(--krds-gray-20); background: var(--krds-gray-5); position: relative;}
.k-ed-btn {min-width: 30px; height: 30px; padding: 0 7px; border: 0; background: transparent; border-radius: 6px; cursor: pointer; font-size: 14px; color: var(--krds-gray-80); line-height: 1;}
.k-ed-btn:hover {background: var(--krds-gray-20);}
.k-ed-sep {width: 1px; height: 18px; background: var(--krds-gray-30); margin: 0 4px;}
.k-ed-area {min-height: 300px; max-height: 640px; overflow-y: auto; padding: 16px 18px; font-size: 15px; line-height: 1.75; color: var(--krds-gray-90); outline: none;}
.k-ed-area h2 {font-size: 22px; font-weight: 800; margin: 14px 0 8px;}
.k-ed-area h3 {font-size: 18px; font-weight: 700; margin: 12px 0 6px;}
.k-ed-area p {margin: 0 0 10px;}
.k-ed-area img {max-width: 100%; height: auto;}
.k-ed-area ul, .k-ed-area ol {margin: 0 0 10px; padding-left: 24px;}
.k-ed-area a {color: var(--krds-primary); text-decoration: underline;}
.k-ed-colors {position: absolute; top: 44px; left: 8px; z-index: 10; display: flex; gap: 4px; padding: 6px; background: #fff; border: 1px solid var(--krds-gray-20); border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.12);}
.k-ed-colors button {width: 22px; height: 22px; border: 1px solid rgba(0,0,0,.1); border-radius: 5px; cursor: pointer;}

/* 메인 팝업 */
.k-popup-layer {position: fixed; inset: 0; z-index: 9000; pointer-events: none;}
.k-popup {position: absolute; width: 360px; max-width: calc(100vw - 32px); background: #fff; border-radius: 12px; box-shadow: 0 18px 50px rgba(15,25,45,.35); overflow: hidden; pointer-events: auto; animation: kPopIn .35s cubic-bezier(.22,1,.36,1) both;}
@keyframes kPopIn {from {opacity: 0; transform: translateY(14px) scale(.98);} to {opacity: 1; transform: none;}}
.k-popup-body {line-height: 0; background: #f4f6fa;}
.k-popup-body img {display: block; width: 100%; height: auto;}
.k-popup-body a {display: block;}
.k-popup-foot {display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; background: var(--krds-secondary); color: #fff;}
.k-popup-today {display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: #E6ECF6; cursor: pointer;}
.k-popup-today input {width: 15px; height: 15px; accent-color: #fff; cursor: pointer;}
.k-popup-close {background: transparent; border: 0; color: #fff; font-size: 13.5px; font-weight: 700; cursor: pointer; padding: 4px 6px;}
.k-popup-close:hover {opacity: .8;}
@media (max-width: 600px) {
    .k-popup {position: relative; left: 0 !important; top: 0 !important; width: 100%; margin: 0 auto 12px;}
    .k-popup-layer {position: fixed; inset: 60px 0 0 0; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; align-items: center; background: rgba(10,18,34,.45); pointer-events: auto;}
}

/* 행사일정 목록 */
.k-ev-list {display: flex; flex-direction: column; gap: 14px; margin-top: 8px;}
.k-ev-item {display: flex; gap: 20px; padding: 20px 22px; border: 1px solid var(--krds-gray-20); border-radius: var(--k-radius); background: #fff; transition: box-shadow .15s;}
.k-ev-item:hover {box-shadow: var(--k-shadow);}
.k-ev-date {flex-shrink: 0; width: 84px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 8px; background: var(--krds-primary-dark); color: #fff; padding: 12px 0;}
.k-ev-date .k-ev-mo {font-size: 13px; font-weight: 600;}
.k-ev-date .k-ev-d {font-size: 30px; font-weight: 800; line-height: 1.1;}
.k-ev-date .k-ev-y {font-size: 12px; opacity: .8;}
.k-ev-body {flex: 1; min-width: 0;}
.k-ev-body strong {display: block; font-size: 18px; font-weight: 700; margin-bottom: 8px;}
.k-ev-meta {display: flex; flex-wrap: wrap; gap: 16px; font-size: 14px; color: var(--krds-gray-60);}
.k-ev-cn {margin-top: 10px; font-size: 14.5px; color: var(--krds-gray-70); line-height: 1.6;}
html[data-kocs-mode="dark"] .k-ev-item {background: #1B2027; border-color: #2C333C;}
html[data-kocs-mode="dark"] .k-ev-body strong {color: #F4F5F6;}

/* 준비중 안내 */
.k-ready {padding: 60px 20px; text-align: center; border: 1px dashed var(--krds-gray-30); border-radius: var(--k-radius); background: var(--krds-gray-5); margin-top: 20px;}
.k-ready strong {display: block; font-size: 18px; color: var(--krds-gray-70); margin-bottom: 8px;}
.k-ready p {font-size: 14.5px; color: var(--krds-gray-50); line-height: 1.6;}

/* ==========================================================================
   글자·화면 표시 설정 모달
   ========================================================================== */
.k-modal-backdrop {position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.55); display: flex; align-items: center; justify-content: center; padding: 20px;}
.k-modal-backdrop[hidden] {display: none !important;}
.k-modal {position: relative; width: 560px; max-width: 100%; background: #fff; border-radius: 12px; padding: 34px 38px 28px;}
.k-modal h2 {font-size: 22px; font-weight: 800; margin-bottom: 24px;}
.k-modal-close {position: absolute; right: 20px; top: 16px; width: 36px; height: 36px; border: 0; background: none; font-size: 26px; color: var(--krds-gray-60); cursor: pointer;}
.k-modal-body {display: flex; gap: 40px; flex-wrap: wrap;}
.k-modal-col {flex: 1; min-width: 180px;}
.k-modal-col h3 {font-size: 15.5px; font-weight: 700; margin-bottom: 14px;}
.k-modal-col label {display: flex; align-items: center; gap: 8px; padding: 8px 0; font-size: 15px; color: var(--krds-gray-70); cursor: pointer;}
.k-modal-col input[type="radio"] {width: 18px; height: 18px; accent-color: var(--krds-primary);}
.k-modal-foot {display: flex; justify-content: flex-end; gap: 8px; margin-top: 24px;}

/* 화면 표시 모드 미리보기 썸네일 (CSS로 그린 미니 화면) */
.k-mode-option {align-items: center;}
.k-mode-thumb {position: relative; flex-shrink: 0; width: 86px; height: 56px; border-radius: 8px; overflow: hidden; border: 1px solid var(--krds-gray-20); margin-right: 4px;}
.k-thumb-light {background: #EEF2F7;}
.k-thumb-dark {background: #1B2735;}
.k-thumb-system {background: linear-gradient(90deg, #EEF2F7 50%, #1B2735 50%);}
.k-mode-thumb .k-mt-bar {position: absolute; top: 0; left: 0; right: 0; height: 12px; background: #1F3A5F;}
.k-thumb-dark .k-mt-bar {background: #0E1620;}
.k-mode-thumb .k-mt-line {position: absolute; top: 18px; left: 8px; width: 34px; height: 5px; border-radius: 2px; background: #9FB3CC;}
.k-thumb-dark .k-mt-line {background: #3D5470;}
.k-mode-thumb .k-mt-box {position: absolute; top: 28px; left: 8px; right: 8px; bottom: 7px; border-radius: 3px; background: #fff;}
.k-thumb-dark .k-mt-box {background: #2A3B52;}
.k-mode-thumb .k-mt-box::after {content: ""; position: absolute; right: 4px; bottom: 4px; width: 12px; height: 5px; border-radius: 2px; background: var(--krds-primary);}
.k-thumb-system .k-mt-half {position: absolute; inset: 0;}

/* ==========================================================================
   확장형 플로팅 버튼 (FAB)
   ========================================================================== */
.k-fab {position: fixed; right: 26px; bottom: 26px; z-index: 900; display: flex; flex-direction: column; align-items: flex-end; gap: 12px;}
.k-fab-main {width: 56px; height: 56px; border-radius: 50%; border: 0; background: var(--krds-primary); color: #fff; font-size: 28px; font-weight: 400; cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.25); transition: transform .2s, background .2s; line-height: 1;}
.k-fab.k-open .k-fab-main {transform: rotate(45deg); background: var(--krds-primary-darker);}
.k-fab-menu {display: flex; flex-direction: column; align-items: flex-end; gap: 10px;}
.k-fab-menu[hidden] {display: none !important;}
.k-fab-item {display: flex; align-items: center; gap: 10px; text-decoration: none;}
.k-fab-label {padding: 6px 12px; border-radius: 15px; background: rgba(30,33,36,.85); color: #fff; font-size: 13px; font-weight: 600; white-space: nowrap;}
.k-fab-icon {display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: #fff; color: var(--krds-gray-80); font-size: 19px; box-shadow: 0 3px 10px rgba(0,0,0,.22);}
.k-fab-item:hover .k-fab-icon {background: var(--krds-bg-sub);}

/* ==========================================================================
   화면 표시 모드 — 선명하게 (어두운 배경)
   ========================================================================== */
html[data-kocs-mode="dark"] body {background: #14181D; color: #E6E8EA;}
html[data-kocs-mode="dark"] .k-main,
html[data-kocs-mode="dark"] .wrap {background: #14181D;}
html[data-kocs-mode="dark"] .kheader,
html[data-kocs-mode="dark"] .kgnb,
html[data-kocs-mode="dark"] .kgnb .k-gnb-sub {background: #1B2027; border-color: #2C333C;}
html[data-kocs-mode="dark"] .kheader .k-logo .k-logo-text strong,
html[data-kocs-mode="dark"] .kgnb .k-gnb-list > li > a {color: #E6E8EA;}
html[data-kocs-mode="dark"] .kgnb .k-gnb-sub ul li a {color: #B1B8BE;}
html[data-kocs-mode="dark"] .kgnb .k-gnb-sub ul li a:hover {background: #242B34;}
html[data-kocs-mode="dark"] .k-quick .k-quick-item,
html[data-kocs-mode="dark"] .k-board-box,
html[data-kocs-mode="dark"] .k-biz-card,
html[data-kocs-mode="dark"] .k-steps .k-step,
html[data-kocs-mode="dark"] .k-snb ul,
html[data-kocs-mode="dark"] .k-snb-contact,
html[data-kocs-mode="dark"] .k-modal {background: #1B2027; border-color: #2C333C; color: #E6E8EA;}
html[data-kocs-mode="dark"] .k-quick .k-quick-item strong,
html[data-kocs-mode="dark"] .k-biz-card strong,
html[data-kocs-mode="dark"] .k-modal h2,
html[data-kocs-mode="dark"] .k-steps .k-step strong,
html[data-kocs-mode="dark"] .k-board-box .k-tabs button.k-on,
html[data-kocs-mode="dark"] .k-board-box .k-board-list .k-b-tit,
html[data-kocs-mode="dark"] .k-content > h1, html[data-kocs-mode="dark"] .k-content .k-page-title,
html[data-kocs-mode="dark"] .k-content h3,
html[data-kocs-mode="dark"] .k-modal-col h3 {color: #F4F5F6;}
html[data-kocs-mode="dark"] .k-content p.k-txt, html[data-kocs-mode="dark"] .k-content .k-lead,
html[data-kocs-mode="dark"] .k-modal-col label,
html[data-kocs-mode="dark"] .k-info-box ul li {color: #CDD1D5;}
html[data-kocs-mode="dark"] .k-info-box {background: #1B2027; border-color: #2C333C;}
html[data-kocs-mode="dark"] .k-info-box.k-blue {background: #17233A; border-color: #24406B;}
html[data-kocs-mode="dark"] .k-table th {background: #242B34; color: #E6E8EA; border-color: #2C333C;}
html[data-kocs-mode="dark"] .k-table td {color: #B1B8BE; border-color: #2C333C;}
html[data-kocs-mode="dark"] .k-table {border-top-color: #4A5561;}
html[data-kocs-mode="dark"] .k-content > h1, html[data-kocs-mode="dark"] .k-page-title {border-bottom-color: #4A5561;}
html[data-kocs-mode="dark"] .k-snb ul li a {color: #B1B8BE;}
html[data-kocs-mode="dark"] .k-snb ul li a:hover {background: #242B34;}
html[data-kocs-mode="dark"] .k-snb ul li a.k-cur {background: #17233A;}
html[data-kocs-mode="dark"] .k-snb-contact-info strong {color: #D8DCE0;}
html[data-kocs-mode="dark"] .k-snb-contact-info a {color: #9DB9F1;}
html[data-kocs-mode="dark"] .k-snb-contact-info span {color: #B1B8BE;}
html[data-kocs-mode="dark"] .k-ready {background: #1B2027; border-color: #3A424C;}
html[data-kocs-mode="dark"] .k-history .k-h-year {border-color: #2C333C;}
html[data-kocs-mode="dark"] .k-history .k-h-year ul li {color: #B1B8BE;}
html[data-kocs-mode="dark"] .k-btn-line {background: transparent; color: #CDD1D5 !important; border-color: #4A5561;}
html[data-kocs-mode="dark"] .k-fab-icon {background: #242B34; color: #E6E8EA;}
html[data-kocs-mode="dark"] .k-sub-layout, html[data-kocs-mode="dark"] .container, html[data-kocs-mode="dark"] .sub_layout {background: #14181D;}
html[data-kocs-mode="dark"] .content, html[data-kocs-mode="dark"] .content_wrap {background: #14181D; color: #CDD1D5;}

/* ==========================================================================
   만족도 조사 위젯
   ========================================================================== */
.k-survey {background: transparent;}
.k-survey-inner {display: flex; gap: 20px; align-items: stretch; padding-top: 40px; padding-bottom: 40px;}
.k-survey-main {flex: 1; min-width: 0; background: #fff; border: 1px solid var(--krds-gray-20); border-radius: 12px; padding: 20px 24px; box-shadow: 0 2px 10px rgba(0,0,0,.05);}
.k-survey-head {display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px;}
.k-survey-badge {padding: 4px 10px; border-radius: 6px; background: var(--krds-bg-sub); color: var(--krds-primary-dark); font-size: 11.5px; font-weight: 800; letter-spacing: .5px;}
.k-survey-head strong {font-size: 19px; font-weight: 800;}
.k-survey-q {font-size: 14px; color: var(--krds-gray-60);}
.k-survey-scale {display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-bottom: 10px;}
.k-sv-opt {height: 46px; border: 1px solid var(--krds-gray-30); border-radius: 8px; background: #fff; font-size: 14.5px; font-weight: 600; color: var(--krds-gray-70); cursor: pointer; transition: all .12s;}
.k-sv-opt:hover {border-color: var(--krds-primary);}
.k-sv-opt.k-on {background: var(--krds-primary); border-color: var(--krds-primary); color: #fff; font-weight: 700;}
.k-survey-input {display: flex; gap: 8px;}
.k-survey-input input {flex: 1; height: 46px; padding: 0 14px; border: 1px solid var(--krds-gray-30); border-radius: 8px; font-size: 14.5px;}
.k-sv-submit {flex-shrink: 0; height: 46px; padding: 0 26px; border: 0; border-radius: 8px; background: var(--krds-secondary); color: #fff; font-size: 14.5px; font-weight: 700; cursor: pointer;}
.k-sv-submit:hover {background: var(--krds-primary-dark);}
.k-survey-msg {margin-top: 8px; font-size: 13.5px; min-height: 18px;}
.k-survey-msg.k-err {color: var(--krds-point);}
.k-survey-thanks {padding: 24px 0; text-align: center; font-size: 16px; font-weight: 700; color: var(--krds-primary-dark);}
.k-survey-side {flex-shrink: 0; width: 200px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 10px; background: transparent; padding: 0;}
/* 말풍선 (캐릭터 오른쪽 위 대각선) — 테두리는 조사박스와 동일(회색 1px), 글씨는 본문 회색톤 */
.k-nubi-bubble {position: absolute; top: -62px; right: -34px; z-index: 3; padding: 9px 15px; border-radius: 16px; background: #fff; border: 1px solid var(--krds-gray-20); color: var(--krds-gray-70); font-size: 14px; font-weight: 400; text-align: center; white-space: nowrap; animation: kBubbleIn .35s ease;}
/* 꼬리: 왼쪽 아래(캐릭터 방향) 대각선 — 회색 1px 테두리 */
.k-nubi-bubble::before {content: ""; position: absolute; left: 13px; bottom: -11px; width: 0; height: 0; border-top: 11px solid var(--krds-gray-20); border-right: 11px solid transparent; transform: rotate(8deg);}
.k-nubi-bubble::after {content: ""; position: absolute; left: 14px; bottom: -9px; width: 0; height: 0; border-top: 10px solid #fff; border-right: 10px solid transparent; transform: rotate(8deg);}
@keyframes kBubbleIn {from {opacity: 0; transform: translate(-4px, 4px) scale(.9);} to {opacity: 1; transform: translate(0,0) scale(1);}}
/* 캐릭터 무대: overflow 허용(잘림 방지), 말풍선 절대배치 기준. 상단 여백으로 말풍선 공간 확보 */
.k-nubi-stage {position: relative; width: 150px; height: 150px; margin-top: 66px; display: flex; align-items: flex-end; justify-content: center;}
.k-nubi {max-width: 140px; max-height: 150px; width: auto; height: auto; object-fit: contain; transform-origin: bottom center; animation: kNubiIdle 3s ease-in-out infinite;}
/* 캐릭터 전환 애니메이션 (bottom 기준으로 잘림 없이) */
.k-nubi-fade {opacity: 0; transform: translateY(6px) scale(.92); transition: opacity .18s ease, transform .18s ease;}
.k-nubi-pop {animation: kNubiPop .5s cubic-bezier(.34,1.56,.64,1);}
@keyframes kNubiIdle {0%,100% {transform: translateY(0);} 50% {transform: translateY(-5px);}}
@keyframes kNubiPop {0% {transform: translateY(6px) scale(.85); opacity: .4;} 60% {transform: translateY(-3px) scale(1.06);} 100% {transform: translateY(0) scale(1); opacity: 1;}}

html[data-kocs-mode="dark"] .k-survey-main {background: #1B2027; border-color: #2C333C;}
html[data-kocs-mode="dark"] .k-sv-opt {background: #242B34; border-color: #3A424C; color: #CDD1D5;}
@media (max-width: 800px) {
    .k-survey-inner {flex-direction: column;}
    .k-survey-side {width: 100%; flex-direction: row; gap: 14px; padding: 14px;}
    .k-survey-scale {grid-template-columns: repeat(3, 1fr);}
    .k-survey-input {flex-direction: column;}
}

/* ==========================================================================
   KOCS 자체 게시판 (분류탭 / 목록 / 앨범 / 웹진 / 영상 / 상세)
   ========================================================================== */
/* 분류 탭 */
.k-cat-tabs {display: flex; flex-wrap: wrap; gap: 6px;}
.k-cat-tabs a {display: inline-flex; align-items: center; height: 36px; padding: 0 16px; border-radius: 18px; border: 1px solid var(--krds-gray-30); font-size: 14px; color: var(--krds-gray-70); text-decoration: none;}
.k-cat-tabs a:hover {border-color: var(--krds-primary); color: var(--krds-primary-dark);}
.k-cat-tabs a.k-on {background: var(--krds-primary); border-color: var(--krds-primary); color: #fff; font-weight: 700;}
/* 분류 태그 */
.k-cat-tag {display: inline-block; padding: 3px 12px; border-radius: 7px; background: #fff; border: 1px solid #C7D8F0; color: var(--krds-primary-dark); font-size: 12px; font-weight: 700;}
html[data-kocs-mode="dark"] .k-cat-tag {background: #17233A; border-color: #2F4A74; color: #A9C4EC;}
.k-board-empty {padding: 40px 0; text-align: center; color: var(--krds-gray-50);}

/* 앨범형 */
.k-alb-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px;}
.k-alb-card {display: flex; flex-direction: column; text-decoration: none; border: 1px solid var(--krds-gray-20); border-radius: 10px; overflow: hidden; background: #fff; transition: box-shadow .15s, transform .15s;}
.k-alb-card:hover {box-shadow: var(--k-shadow); transform: translateY(-3px);}
.k-alb-thumb, .k-vid-thumb {position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 4/3; background: var(--krds-gray-10) center/cover no-repeat;}
.k-alb-noimg {font-size: 34px; opacity: .4;}
.k-alb-body {display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 16px;}
.k-alb-body strong {font-size: 15.5px; color: var(--krds-gray-90); line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.k-alb-body .k-cat-tag {align-self: flex-start;}
.k-alb-date {font-size: 13px; color: var(--krds-gray-50);}
/* 영상형 재생버튼 */
.k-vid-play {position: absolute; width: 48px; height: 48px; border-radius: 50%; background: rgba(0,0,0,.6); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 16px; padding-left: 3px;}

/* 웹진형 */
.k-wz-list {display: flex; flex-direction: column; border-top: 2px solid var(--krds-gray-90);}
.k-wz-item {display: flex; gap: 20px; padding: 20px 8px; border-bottom: 1px solid var(--krds-gray-20); text-decoration: none;}
.k-wz-item:hover {background: var(--krds-gray-5);}
.k-wz-thumb {flex-shrink: 0; width: 180px; aspect-ratio: 16/10; border-radius: 8px; background: var(--krds-gray-10) center/cover no-repeat; display: flex; align-items: center; justify-content: center;}
.k-wz-body {display: flex; flex-direction: column; gap: 8px; min-width: 0;}
.k-wz-body .k-cat-tag {align-self: flex-start;}
.k-wz-body strong {font-size: 18px; color: var(--krds-gray-90); line-height: 1.4;}
.k-wz-summary {font-size: 14.5px; color: var(--krds-gray-60); line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.k-wz-meta {font-size: 13px; color: var(--krds-gray-50);}

/* 상세 */
.k-view {padding-top: 4px;}

/* FAQ 아코디언 */
.k-faq {display: flex; flex-direction: column; gap: 10px; margin-top: 8px;}
.k-faq-item {border: 1px solid var(--krds-gray-20); border-radius: 12px; background: #fff; overflow: hidden; transition: box-shadow .2s, border-color .2s;}
.k-faq-item[open] {box-shadow: 0 8px 24px rgba(20,40,75,.08); border-color: var(--krds-primary);}
.k-faq-q {display: flex; align-items: center; gap: 14px; padding: 18px 22px; cursor: pointer; list-style: none; font-size: 16px; font-weight: 700; color: var(--krds-gray-90);}
.k-faq-q::-webkit-details-marker {display: none;}
.k-faq-q:hover {background: var(--krds-gray-5);}
.k-faq-badge {flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--krds-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800;}
.k-faq-badge-a {background: var(--krds-point);}
.k-faq-qtext {flex: 1; line-height: 1.5;}
.k-faq-arrow {flex: none; width: 11px; height: 11px; border-right: 2px solid var(--krds-gray-50); border-bottom: 2px solid var(--krds-gray-50); transform: rotate(45deg) translateY(-2px); transition: transform .25s; margin-right: 4px;}
.k-faq-item[open] .k-faq-arrow {transform: rotate(-135deg);}
.k-faq-a {display: flex; gap: 14px; padding: 16px 22px 22px; background: var(--krds-bg-sub); border-top: 1px solid var(--krds-gray-20); animation: kFaqOpen .28s ease;}
.k-faq-atext {flex: 1; padding-top: 3px; color: var(--krds-gray-80); line-height: 1.8; font-size: 15px;}
.k-faq-atext img {max-width: 100%; height: auto;}
@keyframes kFaqOpen {from {opacity: 0; transform: translateY(-6px);} to {opacity: 1; transform: none;}}
html[data-kocs-mode="dark"] .k-faq-item {background: #1B2027; border-color: #2C333C;}
html[data-kocs-mode="dark"] .k-faq-q {color: #E6E8EA;}
html[data-kocs-mode="dark"] .k-faq-q:hover {background: #242B34;}
html[data-kocs-mode="dark"] .k-faq-a {background: #17233A; border-color: #24406B;}
html[data-kocs-mode="dark"] .k-faq-atext {color: #CDD1D5;}
.k-view-head {padding: 24px 4px; border-bottom: 1px solid var(--krds-gray-20);}
.k-view-head .k-cat-tag {margin-bottom: 10px;}
.k-view-head h2 {font-size: 24px; font-weight: 800; line-height: 1.4;}
.k-view-meta {margin-top: 12px; font-size: 14px; color: var(--krds-gray-50);}
.k-view-video {margin: 22px 0;}
.k-view-video iframe {width: 100%; aspect-ratio: 16/9; border-radius: 10px;}
.k-view-body {min-height: 160px; padding: 28px 4px; font-size: 15.5px; line-height: 1.8; color: var(--krds-gray-80); white-space: pre-line; border-bottom: 1px solid var(--krds-gray-20);}
.k-view-body img {max-width: 100%; height: auto; border-radius: 8px;}
.k-view-nav {margin: 8px 0 24px; border-bottom: 1px solid var(--krds-gray-20);}
.k-view-nav li {display: flex; align-items: center; gap: 16px; padding: 14px 4px; border-top: 1px solid var(--krds-gray-10);}
.k-view-nav .k-vn-label {flex-shrink: 0; width: 60px; font-size: 14px; font-weight: 700; color: var(--krds-gray-60);}
.k-view-nav a {color: var(--krds-gray-80); text-decoration: none; font-size: 14.5px;}
.k-view-nav a:hover {color: var(--krds-primary); text-decoration: underline;}
.k-view-nav .k-vn-none {font-size: 14.5px; color: var(--krds-gray-40);}

/* 다크모드 보정 */
html[data-kocs-mode="dark"] .k-alb-card, html[data-kocs-mode="dark"] .k-wz-item:hover {background: #1B2027; border-color: #2C333C;}
html[data-kocs-mode="dark"] .k-alb-body strong, html[data-kocs-mode="dark"] .k-wz-body strong, html[data-kocs-mode="dark"] .k-view-head h2 {color: #F4F5F6;}
html[data-kocs-mode="dark"] .k-cat-tabs a {border-color: #3A424C; color: #B1B8BE;}

@media (max-width: 900px) {
    .k-alb-grid {grid-template-columns: repeat(2, 1fr);}
    .k-wz-thumb {width: 130px;}
}
@media (max-width: 560px) {
    .k-alb-grid {grid-template-columns: 1fr 1fr; gap: 12px;}
    .k-wz-item {flex-direction: column; gap: 12px;}
    .k-wz-thumb {width: 100%;}
}

/* ==========================================================================
   구 템플릿(게시판 등) 페이지 호환 — 기존 .layout(table) 안에서 새 좌측메뉴 배치
   ========================================================================== */
.layout .k-snb {display: table-cell; width: 240px; vertical-align: top; padding-top: 44px;}
.layout .content_wrap {padding-top: 24px;}

/* ==========================================================================
   모바일 햄버거 버튼 & 전체메뉴
   ========================================================================== */
.k-hamburger {display: none; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; border: 0; background: none; cursor: pointer; padding: 0;}
.k-hamburger span {display: block; width: 24px; height: 2px; margin: 0 auto; background: var(--krds-gray-80); border-radius: 2px;}

.k-mnav {position: fixed; inset: 0; z-index: 1100; background: #fff; color: var(--krds-gray-90); overflow-y: auto; -webkit-overflow-scrolling: touch;}
.k-mnav[hidden] {display: none;}
.k-mnav .k-mnav-head {display: flex; justify-content: space-between; align-items: center; height: 58px; padding: 0 20px; border-bottom: 1px solid var(--krds-gray-20); position: sticky; top: 0; background: #fff;}
.k-mnav .k-mnav-head strong {font-size: 17px; font-weight: 800;}
.k-mnav .k-mnav-head button {width: 40px; height: 40px; border: 0; background: none; font-size: 28px; color: var(--krds-gray-70); cursor: pointer;}
.k-mnav .k-macc {border-bottom: 1px solid var(--krds-gray-10);}
.k-mnav .k-macc-t {display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 16px 20px; border: 0; background: none; font-size: 16px; font-weight: 700; color: var(--krds-gray-90); cursor: pointer; text-align: left;}
.k-mnav .k-macc-t::after {content: "+"; font-size: 20px; color: var(--krds-gray-50); font-weight: 400;}
.k-mnav .k-macc.k-open .k-macc-t::after {content: "−";}
.k-mnav .k-macc.k-open .k-macc-t {color: var(--krds-primary-dark);}
.k-mnav .k-macc-p {display: none; padding: 4px 0 12px; background: var(--krds-gray-5);}
.k-mnav .k-macc.k-open .k-macc-p {display: block;}
.k-mnav .k-macc-p a {display: block; padding: 11px 30px; font-size: 15px; color: var(--krds-gray-70); text-decoration: none;}
.k-mnav .k-macc-p a:hover {color: var(--krds-primary);}

/* PC 전체메뉴: 전체 화면에서 모든 메뉴를 한 번에 표시 */
@media (min-width: 901px) {
    .k-mnav .k-mnav-head {height: 92px; padding: 0 max(32px, calc((100% - 1200px) / 2)); border-bottom: 2px solid var(--krds-primary);}
    .k-mnav .k-mnav-head strong {font-size: 28px; color: var(--krds-primary-dark);}
    .k-mnav .k-mnav-head .k-mnav-close {width: 52px; height: 52px; font-size: 40px; line-height: 1;}
    .k-mnav .k-mnav-body {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; width: min(1200px, calc(100% - 64px)); margin: 0 auto; padding: 48px 0 72px;}
    .k-mnav .k-mnav-search {display: none !important;}
    .k-mnav .k-macc {border: 1px solid var(--krds-gray-20); border-radius: 12px; overflow: hidden; align-self: start;}
    .k-mnav .k-macc-t {padding: 20px 24px; background: var(--krds-primary); color: #fff; font-size: 19px; cursor: default;}
    .k-mnav .k-macc-t::after {display: none;}
    .k-mnav .k-macc-p {display: block; padding: 12px 0; background: #fff;}
    .k-mnav .k-macc-p a {position: relative; padding: 11px 24px 11px 38px; font-size: 15.5px;}
    .k-mnav .k-macc-p a::before {content: ""; position: absolute; left: 24px; top: 50%; width: 4px; height: 4px; border-radius: 50%; background: var(--krds-gray-40); transform: translateY(-50%);}
    .k-mnav .k-macc-p a:hover {background: var(--krds-bg-sub);}
}

/* ==========================================================================
   반응형
   ========================================================================== */
@media (max-width: 1024px) {
    .k-quick .k-quick-grid, .k-biz-grid {grid-template-columns: repeat(2, 1fr);}
    .k-news-grid {grid-template-columns: 1fr;}
    .k-steps {grid-template-columns: repeat(2, 1fr);}
    .k-hero h2 {font-size: 30px;}
    .k-sub-layout {flex-direction: column; gap: 20px;}
    .k-snb {width: 100%;}
    /* 좌측 메뉴 접기: 대메뉴 바만 보이고 탭하면 펼침 */
    .k-snb h2 {min-height: 76px; cursor: pointer; border-radius: 10px;}
    .k-snb.k-open h2 {border-radius: 10px;}
    .k-snb h2::after {display: block; content: "▾"; position: absolute; right: 22px; top: 50%; transform: translateY(-50%); font-size: 16px; transition: transform .2s;}
    .k-snb.k-open h2::after {transform: translateY(-50%) rotate(180deg);}
    .k-snb ul {display: none;}
    .k-snb.k-open ul {display: block;}
    .k-snb-contact {display: none;}
    .k-snb.k-open .k-snb-contact {display: flex;}
}

/* GNB 숨기고 햄버거 노출 (태블릿~모바일) */
@media (max-width: 900px) {
    .kheader .k-topbar {display: none;}
    .kgnb {display: none;}
    .k-hamburger {display: flex;}
    .kheader .k-search {display: none;}
    .kheader .k-idbar .k-inner {height: 68px;}
    .kheader .k-logo-img {height: 42px;}
    .k-hero-arrow {width: 38px; height: 38px; font-size: 22px;}
    .k-hero-prev {left: 10px;} .k-hero-next {right: 10px;}
}

@media (max-width: 640px) {
    .k-quick .k-quick-grid, .k-biz-grid, .k-steps {grid-template-columns: 1fr;}
    .kheader .k-head-cta {display: none;}
    .k-hero .k-inner {min-height: 600px;}
    .k-hero h2 {font-size: 24px;}
    .k-hero .k-hero-btns {flex-wrap: wrap;}
    .k-hero .k-hero-btns a {height: 44px; padding: 0 18px; font-size: 14.5px;}
    .k-news-grid {grid-template-columns: 1fr;}
    .k-section .k-sec-head h2 {font-size: 22px;}
    .kfooter .k-foot-body .k-inner {flex-direction: column;}
    .kfooter .k-foot-extra {text-align: left;}
    .k-foot-sns {justify-content: flex-start;}
    .kfooter .k-foot-links .k-inner {flex-wrap: wrap; height: auto; padding: 14px 24px; gap: 14px;}
    .k-sub-visual h2 {font-size: 26px;}
    .k-content > h1, .k-content .k-page-title {font-size: 24px;}
    .k-table {font-size: 13.5px;}
    .k-table th, .k-table td {padding: 9px 8px;}
}
/* 메인 최하단 수행·협력기관 슬라이드: 고유 클래스명으로 기존 스타일 충돌 방지 */
.k-sns-section{clear:both;width:100%;padding:56px 0 48px;background:#fff;box-sizing:border-box}.k-sns-inner{width:100%;padding:0 10.5%;box-sizing:border-box}.k-sns-head{display:flex;align-items:center;gap:18px;margin-bottom:28px}.k-sns-head h2{margin:0;color:#111827;font-size:26px;letter-spacing:-.04em}.k-sns-channels{display:flex;gap:10px}.k-sns-channel{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:#fff;color:#172033;font-size:12px;font-weight:900;text-decoration:none;box-shadow:0 5px 13px rgba(15,23,42,.14)}.k-sns-youtube{color:#e60012}.k-sns-instagram{color:#f03b72}.k-sns-blog{color:#03a94d}.k-sns-facebook{color:#1877f2}.k-sns-kakao{color:#2b2418;background:#fee500}.k-sns-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px}.k-sns-card{position:relative;overflow:hidden;min-width:0;border:1px solid #edf0f4;border-radius:20px;background:#fff;box-shadow:0 8px 18px rgba(15,23,42,.13)}.k-sns-card-meta{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 12px;color:#334155;font-size:14px}.k-sns-card-meta b{color:#1e3e7e}.k-sns-card img,.k-sns-placeholder{display:flex;width:calc(100% - 40px);height:190px;margin:0 20px;object-fit:cover;border-radius:2px}.k-sns-placeholder{flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#14284b,#1e3e7e 62%,#941313);color:#fff;text-align:center}.k-sns-placeholder span{margin-bottom:14px;font-size:10px;font-weight:800;letter-spacing:.18em;opacity:.72}.k-sns-placeholder strong{font-size:20px;line-height:1.45}.k-sns-card-body{position:relative;padding:16px 20px 20px}.k-sns-card-body p{display:-webkit-box;overflow:hidden;margin:0 0 12px;color:#475569;font-size:14px;line-height:1.75;-webkit-line-clamp:3;-webkit-box-orient:vertical}.k-sns-card-body h3{overflow:hidden;margin:0;color:#111827;font-size:15px;line-height:1.45;text-overflow:ellipsis;white-space:nowrap}.k-sns-card-body>a{position:absolute;inset:0}.k-sns-card:hover{transform:translateY(-3px);transition:.2s}.k-client-slider{clear:both;position:relative;width:100%;padding:38px 0 44px;background:#f7f9fc;border-top:1px solid #d8e0ea;border-bottom:1px solid #d8e0ea;box-sizing:border-box}
.k-sns-inner{max-width:var(--k-max-width);margin:0 auto;padding:0 24px}
.k-sns-channel{width:40px;height:40px;overflow:hidden;font-size:0;transition:transform .2s,box-shadow .2s}
.k-sns-channel img{display:block;width:100%;height:100%;object-fit:contain}
.k-sns-channel:hover{transform:translateY(-2px);box-shadow:0 7px 17px rgba(15,23,42,.2)}
.k-sns-channel.is-disabled{cursor:default;filter:grayscale(1);opacity:.45}.k-sns-channel.is-disabled:hover{transform:none;box-shadow:0 5px 13px rgba(15,23,42,.14)}
.k-client-slider{clear:both;position:relative;width:100%;padding:38px 0 44px;background:#f7f9fc;border-top:1px solid #d8e0ea;border-bottom:1px solid #d8e0ea;box-sizing:border-box}
.k-client-full{width:100%;max-width:none;margin:0;padding:0;box-sizing:border-box}.k-client-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;max-width:var(--k-max-width);margin:0 auto 16px;padding:0 24px;box-sizing:border-box}
.k-client-heading span{display:block;margin-bottom:3px;color:#124b9a;font-size:11px;font-weight:800;letter-spacing:.16em}
.k-client-heading h2{margin:0;color:#111827;font-size:24px;line-height:1.25}
.k-client-controls{display:flex;gap:6px}
.k-client-controls button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin:0;padding:0;border:1px solid #d9e0ea;border-radius:50%;background:#fff;color:#334155;cursor:pointer;font-size:11px;line-height:1}
.k-client-controls button:hover{border-color:#246beb;color:#246beb}
.k-client-group-window{position:relative;overflow:hidden;width:100%;padding:0;background:transparent;box-sizing:border-box}
.k-client-row{display:flex!important;align-items:stretch;width:max-content!important;min-width:100%;transform:translate3d(0,0,0);transition:transform .45s ease;will-change:transform}
.k-client-unit{display:block!important;flex:0 0 210px!important;width:210px!important;min-width:210px!important;max-width:210px!important;padding:6px!important;box-sizing:border-box!important}
.k-client-unit>a,.k-client-box{display:flex!important;flex-direction:column;align-items:center;justify-content:center;width:100%!important;height:96px!important;min-height:96px;padding:10px 14px!important;overflow:hidden;border:1px solid #e3e8ef;border-radius:10px;background:#fff;color:#172033;text-align:center;text-decoration:none;box-sizing:border-box!important;transition:background .2s,transform .2s,border-color .2s}
.k-client-unit>a:hover{background:#eef5ff;transform:translateY(-2px)}
.k-client-unit img{display:block!important;width:auto!important;max-width:174px!important;height:auto!important;max-height:56px!important;object-fit:contain!important}
.k-client-unit strong{display:block!important;width:100%;margin:0!important;color:#172033!important;font-size:14px!important;font-weight:700!important;line-height:1.35!important;letter-spacing:-.02em!important;white-space:normal!important;word-break:keep-all!important;overflow-wrap:normal!important}
.k-client-unit small{display:block!important;margin-top:5px!important;color:#64748b!important;font-size:11px!important;line-height:1.2!important;white-space:nowrap!important}
@media(max-width:900px){.k-sns-inner{padding:0 24px}.k-sns-cards{gap:16px}.k-client-unit{flex-basis:200px!important;width:200px!important;min-width:200px!important;max-width:200px!important}}
@media(max-width:700px){.k-sns-head{align-items:flex-start;flex-direction:column}.k-sns-cards{grid-template-columns:1fr}.k-sns-card img,.k-sns-placeholder{height:220px}.k-client-slider{padding:28px 0 34px}.k-client-heading h2{font-size:21px}.k-client-unit{flex-basis:160px!important;width:160px!important;min-width:160px!important;max-width:160px!important}.k-client-unit>a,.k-client-box{height:84px!important;min-height:84px}.k-client-unit strong{font-size:13px!important}}

/* ===== 웹진 (호 기반 발행) ===== */
.k-wzi-cover {display: flex; gap: 30px; padding: 0 0 34px; margin-bottom: 30px; border-bottom: 1px solid var(--krds-gray-20);}
.k-wzi-cover-img {flex-shrink: 0; width: 240px; aspect-ratio: 3/4; border-radius: 10px; border: 1px solid var(--krds-gray-20); background: var(--krds-gray-10) center/cover no-repeat; display: flex; align-items: center; justify-content: center;}
.k-wzi-noimg {font-size: 13px; color: var(--krds-gray-40);}
.k-wzi-cover-body {display: flex; flex-direction: column; align-items: flex-start; gap: 12px; min-width: 0; padding-top: 4px;}
.k-wzi-badge {display: inline-block; padding: 5px 13px; border-radius: 999px; background: var(--krds-primary); color: #fff; font-size: 13.5px; font-weight: 700;}
.k-wzi-cover-body h3 {font-size: 27px; font-weight: 800; color: var(--krds-gray-90); line-height: 1.3; letter-spacing: -.02em; word-break: keep-all;}
.k-wzi-meta {font-size: 14px; color: var(--krds-gray-50);}
.k-wzi-intro {font-size: 15px; color: var(--krds-gray-70); line-height: 1.75; word-break: keep-all;}
.k-wzi-archive {height: 40px; margin-top: 4px;}

.k-wzi-toc-title {display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px; font-size: 20px; font-weight: 800; color: var(--krds-gray-90);}
.k-wzi-toc-title span {font-size: 14.5px; font-weight: 500; color: var(--krds-gray-50);}
.k-wzi-section {margin: 26px 0 10px; padding-left: 11px; border-left: 4px solid var(--krds-primary); font-size: 16.5px; font-weight: 700; color: var(--krds-primary-dark);}
.k-wzi-arts {display: flex; flex-direction: column; border-top: 1px solid var(--krds-gray-20);}
.k-wzi-art {display: flex; gap: 20px; padding: 18px 8px; border-bottom: 1px solid var(--krds-gray-10); text-decoration: none;}
.k-wzi-art:hover {background: var(--krds-gray-5);}
.k-wzi-art-thumb {flex-shrink: 0; width: 150px; aspect-ratio: 4/3; border-radius: 8px; background: var(--krds-gray-10) center/cover no-repeat; display: flex; align-items: center; justify-content: center;}
.k-wzi-art-body {display: flex; flex-direction: column; gap: 6px; min-width: 0;}
.k-wzi-art-body strong {font-size: 17.5px; color: var(--krds-gray-90); line-height: 1.4; word-break: keep-all;}
.k-wzi-art-sub {font-size: 14.5px; font-weight: 500; color: var(--krds-primary-dark); line-height: 1.5;}
.k-wzi-nav {margin-top: 34px;}

.k-wzi-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px 20px;}
.k-wzi-card {display: flex; flex-direction: column; gap: 11px; text-decoration: none;}
.k-wzi-card-cover {position: relative; aspect-ratio: 3/4; border-radius: 10px; border: 1px solid var(--krds-gray-20); background: var(--krds-gray-10) center/cover no-repeat; display: flex; align-items: center; justify-content: center; transition: transform .2s, box-shadow .2s;}
.k-wzi-card:hover .k-wzi-card-cover {transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0, 0, 0, .12);}
.k-wzi-card-no {position: absolute; left: 10px; top: 10px; padding: 4px 11px; border-radius: 999px; background: rgba(0, 0, 0, .62); color: #fff; font-size: 12.5px; font-weight: 700;}
.k-wzi-card-body {display: flex; flex-direction: column; gap: 5px; min-width: 0;}
.k-wzi-card-body strong {font-size: 16px; color: var(--krds-gray-90); line-height: 1.4; word-break: keep-all;}

html[data-kocs-mode="dark"] .k-wzi-art:hover {background: #1B2027;}
html[data-kocs-mode="dark"] .k-wzi-cover-img,
html[data-kocs-mode="dark"] .k-wzi-card-cover,
html[data-kocs-mode="dark"] .k-wzi-art-thumb {background-color: #1B2027; border-color: #2C333C;}

@media (max-width: 1024px) {.k-wzi-grid {grid-template-columns: repeat(3, 1fr);}}
@media (max-width: 780px) {
    .k-wzi-cover {flex-direction: column; gap: 20px;}
    .k-wzi-cover-img {width: 180px;}
    .k-wzi-cover-body h3 {font-size: 22px;}
    .k-wzi-grid {grid-template-columns: repeat(2, 1fr); gap: 20px 14px;}
    .k-wzi-art {gap: 14px; padding: 15px 4px;}
    .k-wzi-art-thumb {width: 104px;}
    .k-wzi-art-body strong {font-size: 15.5px;}
}