/* 케이비즈파트너스 서브 페이지 공통 스타일 — index.html의 색상·상단메뉴·하단 스타일을 그대로 가져옴 */
/* ===== 색상·글꼴 설정 (여기 값만 바꾸면 사이트 전체 색이 바뀝니다) ===== */
:root{
  --ink:#0F1C2E;        /* 본문 글자 */
  --ink-2:#4A5668;      /* 보조 글자 */
  --paper:#F5F6F8;      /* 바탕 */
  --surface:#FFFFFF;    /* 카드·폼 바탕 */
  --line:#DDE2E9;       /* 구분선 */
  --navy:#003A8C;       /* 브랜드 코발트(짙은) */
  --navy-deep:#0047AB;  /* 코발트 블루 구역 바탕 */
  --brass:#A8823A;      /* 강조(황동색) */
  --blue:#1D5AA8;       /* 메뉴 강조(파랑) */
  --brass-soft:#EFE6D3;
  --brass-ink:#A8823A;  /* 작은 골드 글자 */
  --on-dark:#E9EDF3;
  --on-dark-2:#C5D3EA;
  --brass-on-dark:#E3C27A; /* 코발트 바탕 위 골드 */
  --serif:"Noto Serif KR","Nanum Myeongjo","Batang",serif;
  --sans:"IBM Plex Sans KR","Malgun Gothic","Apple SD Gothic Neo",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"Consolas",monospace;
  --wrap:1180px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --ink:#E7EBF1; --ink-2:#A6B0BF; --paper:#0C1522; --surface:#121E2F; --line:#243247;
    --navy:#8FB0E0; --navy-deep:#061A3F; --brass:#D2AE64; --brass-soft:#2A2416; --brass-ink:#D2AE64; --blue:#7FB2F5;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --ink:#E7EBF1; --ink-2:#A6B0BF; --paper:#0C1522; --surface:#121E2F; --line:#243247;
  --navy:#8FB0E0; --navy-deep:#061A3F; --brass:#D2AE64; --brass-soft:#2A2416; --brass-ink:#D2AE64; --blue:#7FB2F5;
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:84px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased;word-break:keep-all}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:24px}
@media (max-width:560px){.wrap{padding-inline:18px}}

.eyebrow{font-family:var(--mono);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-ink);display:flex;align-items:center;gap:12px;margin:0 0 18px}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;text-wrap:balance;margin:0}
h2{font-size:clamp(28px,3.4vw,40px);line-height:1.35}
.lead{font-size:17.5px;color:var(--ink-2);max-width:62ch;margin:20px 0 0}
section{padding-block:clamp(48px,5vw,64px)}

.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;font-weight:600;font-size:15.5px;text-decoration:none;border:1px solid transparent;transition:background .2s,color .2s,border-color .2s;cursor:pointer;font-family:var(--sans)}
.btn-primary{background:var(--navy-deep);color:#fff}
.btn-primary:hover{background:var(--brass);color:#fff}
:root[data-theme="dark"] .btn-primary{background:var(--brass);color:#141414}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .btn-primary{background:var(--brass);color:#141414}}
.btn-line{border-color:var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--brass);border-color:var(--brass);color:#fff}

/* ===== 상단 메뉴 ===== */
.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:76px;gap:20px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{height:40px;width:auto;padding:0}
:root[data-theme="dark"] .brand img{background:#fff;padding:4px;border-radius:6px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .brand img{background:#fff;padding:4px;border-radius:6px}}
.brand-text{display:flex;flex-direction:column;line-height:1.25}
.brand-text small{font-size:11.5px;color:var(--ink-2);letter-spacing:.02em}
.brand-text strong{font-size:17px;font-weight:700}
.gnb{display:flex;gap:30px;font-size:15px}
.gnb a{text-decoration:none;color:var(--ink-2);padding-block:6px;border-bottom:1px solid transparent}
.gnb a:hover{color:var(--ink);border-bottom-color:var(--brass)}
/* 주요 메뉴 5개: 마우스를 올리면 밑줄 + 굵은 파란 글자. ::after가 굵은 글자 폭을 미리 잡아 두어 옆 메뉴가 밀리지 않음 */
.gnb a[data-t]{display:inline-flex;flex-direction:column;align-items:center;transition:color .15s ease}
.gnb a[data-t]::after{content:attr(data-t);font-weight:700;height:0;overflow:hidden;visibility:hidden;pointer-events:none;user-select:none}
.gnb a[data-t]{color:var(--navy-deep);font-weight:700}
.gnb a[data-t]:hover,.gnb a[data-t]:focus-visible{color:var(--brass);font-weight:700;border-bottom-color:var(--brass)}
:root[data-theme="dark"] .gnb a[data-t]{color:var(--blue)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .gnb a[data-t]{color:var(--blue)}}
:root[data-theme="dark"] .gnb a[data-t]:hover{color:var(--brass)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .gnb a[data-t]:hover{color:var(--brass)}}
.header-cta{padding:11px 20px;font-size:14.5px;white-space:nowrap}
.header-ahp{padding:10px 16px;border-color:var(--brass);color:var(--ink)}
.header-ahp:hover{background:var(--brass);border-color:var(--brass);color:#fff}
.site-header .wrap>.header-ahp{margin-left:auto}
.header-match{padding:10px 16px;border-color:var(--navy);color:var(--ink)}
.header-match:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.site-header .wrap>.header-match{margin-left:auto}
.site-header .wrap>.header-match+.header-ahp{margin-left:0}
@media (min-width:1181px){
  .site-header .wrap{gap:14px}
  .gnb{gap:20px}
  .gnb a{white-space:nowrap}
  .header-cta,.header-ahp,.header-match{padding:10px 14px;font-size:14px}
  .brand-text small{white-space:nowrap}
}
@media (min-width:1181px) and (max-width:1440px){
  .site-header .wrap{gap:10px}
  .gnb{gap:14px}
  .header-cta,.header-ahp,.header-match{padding:9px 11px;font-size:13px}
}
.gnb .gnb-ahp,.gnb .gnb-match{display:none}
.menu-btn{display:none;background:none;border:1px solid var(--line);color:var(--ink);padding:9px 12px;font-size:14px;font-family:var(--sans)}
@media (max-width:1180px){
  .gnb,.header-cta{display:none}
  .site-header.open .gnb .gnb-ahp{display:block;color:var(--brass);font-weight:600}
  .site-header.open .gnb .gnb-match{display:block;color:var(--navy);font-weight:600}
  .menu-btn{display:block}
  .site-header.open .gnb{display:flex;position:absolute;left:0;right:0;top:76px;flex-direction:column;gap:0;background:var(--surface);border-bottom:1px solid var(--line);padding:8px 24px 16px}
  .site-header.open .gnb a{padding-block:12px;border-bottom:1px solid var(--line)}
  .site-header.open .gnb a[data-t]{align-items:flex-start}
}


/* ===== 하단 ===== */
footer{background:var(--navy-deep);color:var(--on-dark-2);font-size:14px;padding-block:26px 20px}
footer .wrap{display:grid;grid-template-columns:1fr auto;gap:14px 28px;align-items:end}
footer strong{color:#fff;font-size:16px;display:block;margin-bottom:10px;font-family:var(--serif);font-weight:600}
footer p{margin:0 0 4px}
footer nav{display:flex;flex-wrap:wrap;gap:10px 20px}
footer nav a{text-decoration:none;color:var(--on-dark);white-space:nowrap}
footer .copy{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.14);padding-top:12px;font-family:var(--mono);font-size:12px;letter-spacing:.06em}
@media (min-width:901px){footer .wrap{grid-template-columns:auto 1fr}footer .wrap>div:first-child p{white-space:nowrap}footer nav{justify-content:flex-end}}
@media (max-width:900px){footer .wrap{grid-template-columns:1fr}}

/* ===================================================================
   서브 페이지 공통 구성요소 (센터·전문위원·파트너사·지원사례·공지사항)
   =================================================================== */
.gnb a[aria-current="page"]{border-bottom-color:var(--brass)}
.eyebrow{font-family:var(--mono);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-ink);display:flex;align-items:center;gap:12px;margin:0 0 18px}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;text-wrap:balance;margin:0}
.lead{font-size:17px;color:var(--ink-2);max-width:62ch;margin:18px 0 0}

.page-hero{padding-block:clamp(32px,4.4vw,56px) clamp(22px,3vw,32px);border-bottom:1px solid var(--line)}
.page-hero h1{font-size:clamp(32px,4.4vw,50px);line-height:1.25}
.page-body{padding-block:clamp(24px,3.5vw,44px) clamp(48px,5.5vw,72px);min-height:40vh}

/* 탭 */
.tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin:0 0 32px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;padding:14px 22px;font:inherit;font-size:16px;font-weight:600;color:var(--ink-2);cursor:pointer;white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--brass)}
.tabs button:hover{color:var(--ink)}
.tabs .n{font-family:var(--mono);font-size:12px;color:var(--brass);margin-left:6px;font-weight:500}

/* 표시 */
.chip{display:inline-block;font-size:12.5px;padding:3px 10px;border:1px solid var(--line);color:var(--ink-2);background:var(--surface);line-height:1.5}
.chip.solid{background:var(--brass-soft);border-color:transparent;color:var(--ink)}
.badge{display:inline-block;font-size:11.5px;font-weight:600;padding:2px 8px;letter-spacing:.02em;vertical-align:middle;line-height:1.5}
.badge.sample{background:var(--brass-soft);color:var(--brass)}
.badge.draft{background:var(--line);color:var(--ink-2)}
.preview-bar{background:var(--navy-deep);color:var(--on-dark);font-size:14px}
.preview-bar .wrap{display:flex;gap:12px;align-items:center;justify-content:space-between;padding-block:10px;flex-wrap:wrap}
.preview-bar a{color:#fff;font-weight:600}
.empty{border:1px dashed var(--line);padding:44px 24px;text-align:center;color:var(--ink-2);background:var(--surface)}
.empty strong{display:block;color:var(--ink);font-size:17px;margin-bottom:6px;font-family:var(--serif)}
.empty a{color:var(--navy);font-weight:600}
.loading{color:var(--ink-2);padding:40px 0;text-align:center}
.toolbar-line{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:22px}
.toolbar-line .count{font-size:14px;color:var(--ink-2)}
.search{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);padding:0 12px;min-width:min(320px,100%)}
.search input{border:0;background:none;font:inherit;font-size:15px;padding:11px 0;color:var(--ink);width:100%;outline:none}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.filters button{font:inherit;font-size:14px;padding:7px 14px;border:1px solid var(--line);background:var(--surface);color:var(--ink-2);cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* 사진·이니셜 */
.avatar{position:relative;background:var(--brass-soft);overflow:hidden;aspect-ratio:4/5;display:grid;place-items:center}
.avatar img{width:100%;height:100%;object-fit:cover;object-position:center 25%}
.avatar .ini{font-family:var(--serif);font-weight:600;color:var(--brass);font-size:clamp(28px,4vw,40px)}
.avatar.sm{width:56px;flex:none;aspect-ratio:1}
.avatar.sm .ini{font-size:20px}
.logo{height:64px;display:flex;align-items:center}
.logo img{max-height:64px;width:auto;max-width:180px;object-fit:contain}
.logo .mono{width:64px;height:64px;display:grid;place-items:center;background:var(--navy-deep);color:#fff;font-family:var(--serif);font-size:24px;font-weight:600}

/* 센터 */
.center-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.center{background:var(--surface);border:1px solid var(--line);padding:26px 26px 22px;display:flex;flex-direction:column;gap:14px;min-width:0}
.center.hit{border-color:var(--brass);box-shadow:inset 3px 0 0 var(--brass)}
.center.dim{opacity:.45}
.center h3{font-size:22px}
.center .region{font-size:14.5px;color:var(--ink);display:flex;gap:10px;align-items:baseline}
.center .region b{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;color:var(--brass);font-weight:500;flex:none}
.center .intro{font-size:15px;color:var(--ink-2);margin:0}
.center .head{display:flex;gap:14px;align-items:center;border-top:1px solid var(--line);padding-top:16px;text-align:left;background:none;border-left:0;border-right:0;border-bottom:0;font:inherit;color:inherit;cursor:pointer;width:100%}
.center .head:hover .nm{color:var(--blue)}
.center .head .nm{font-weight:700;font-size:16px}
.center .head .tt{font-size:13.5px;color:var(--ink-2)}
.center .contact{font-size:14px;color:var(--ink-2);display:flex;flex-direction:column;gap:2px}
@media (max-width:820px){.center-grid{grid-template-columns:1fr}}

/* 인물 카드 */
.people-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.person{background:none;border:0;padding:0;text-align:left;font:inherit;color:inherit;cursor:pointer;display:flex;flex-direction:column;gap:12px;min-width:0}
.person:hover .nm{color:var(--blue)}
.person .nm{font-family:var(--serif);font-size:20px;font-weight:600;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.person .tt{font-size:13.5px;color:var(--brass);font-weight:600}
.person .fd{font-size:14.5px;color:var(--ink)}
.person .sm{font-size:14px;color:var(--ink-2);margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:1000px){.people-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.people-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}

/* 파트너사 */
.partner-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.partner{background:var(--surface);border:1px solid var(--line);padding:24px;display:flex;flex-direction:column;gap:14px;min-width:0}
.partner h3{font-size:19px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.partner p{margin:0;font-size:14.5px;color:var(--ink-2)}
.partner .site{font-size:14px;color:var(--navy);font-weight:600;text-decoration:none;margin-top:auto;word-break:break-all}
@media (max-width:900px){.partner-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.partner-grid{grid-template-columns:1fr}}

/* 지원사례 */
.case-list{display:flex;flex-direction:column;border-top:2px solid var(--ink)}
.case{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) auto;gap:8px 28px;padding:24px 0;border-bottom:1px solid var(--line);align-items:start}
.case .co{font-family:var(--serif);font-size:21px;font-weight:600;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.case .meta{font-size:14px;color:var(--ink-2);margin-top:4px}
.case .prog{font-size:15px}
.case .prog small{display:block;color:var(--ink-2);font-size:13px}
.case .amt{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:22px;font-weight:500;color:var(--navy);white-space:nowrap;text-align:right}
.case .amt small{display:block;font-size:12px;color:var(--ink-2);font-family:var(--sans)}
.case details{grid-column:1/-1}
.case summary{cursor:pointer;font-size:14px;color:var(--navy);font-weight:600;list-style:none}
.case summary::-webkit-details-marker{display:none}
.case summary::after{content:" ＋"}
.case details[open] summary::after{content:" －"}
.case dl{display:grid;grid-template-columns:7em minmax(0,1fr);gap:8px 16px;margin:14px 0 0;font-size:15px;background:var(--surface);border:1px solid var(--line);padding:18px 20px}
.case dt{color:var(--brass);font-weight:600;font-size:13.5px;padding-top:2px}
.case dd{margin:0}
@media (max-width:760px){.case{grid-template-columns:1fr auto}.case .prog{grid-column:1/-1;order:3}.case dl{grid-template-columns:1fr;gap:2px}.case dd{margin-bottom:8px}}

/* 공지사항 */
.notice-list{width:100%;border-collapse:collapse;border-top:2px solid var(--ink)}
.notice-list td{padding:18px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.notice-list .cat{width:90px}
.notice-list .date{width:120px;font-family:var(--mono);font-size:13px;color:var(--ink-2);text-align:right;white-space:nowrap}
.notice-list a{text-decoration:none;font-size:16.5px;font-weight:600}
.notice-list a:hover{color:var(--blue)}
.notice-list tr.pin td{background:color-mix(in srgb,var(--brass-soft) 45%,transparent)}
@media (max-width:640px){.notice-list .cat{display:none}.notice-list .date{width:auto}}
.article{max-width:820px}
.article .a-head{border-bottom:2px solid var(--ink);padding-bottom:20px;margin-bottom:28px}
.article h1{font-size:clamp(26px,3.4vw,36px);line-height:1.35;margin-top:12px}
.article .a-meta{font-family:var(--mono);font-size:13px;color:var(--ink-2);margin-top:12px}
.article .a-body{font-size:16.5px;line-height:1.85}
.article .a-body p{margin:0 0 16px}
.article .a-body h2{font-size:21px;margin:30px 0 12px;padding-left:12px;border-left:3px solid var(--brass)}
.article .a-body ul{margin:0 0 18px;padding-left:22px}
.article .a-body li{margin-bottom:6px}
.article .a-body img{margin:0 0 24px;border:1px solid var(--line)}
.article .a-foot{margin-top:40px;padding-top:20px;border-top:1px solid var(--line);display:flex;gap:12px;flex-wrap:wrap}

/* 프로필 창 */
dialog.profile{border:0;padding:0;max-width:760px;width:calc(100% - 32px);background:var(--surface);color:var(--ink);box-shadow:0 24px 60px rgba(0,0,0,.3)}
dialog.profile::backdrop{background:rgba(11,31,61,.55)}
.profile .p-wrap{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;padding:32px}
.profile .p-x{position:absolute;top:10px;right:12px;background:none;border:0;font-size:26px;line-height:1;color:var(--ink-2);cursor:pointer;padding:6px}
.profile h2{font-size:28px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.profile .p-tt{color:var(--brass);font-weight:600;margin-top:6px}
.profile .p-fd{margin-top:4px;font-size:15px}
.profile .p-sm{margin:16px 0 0;font-size:15.5px;color:var(--ink-2)}
.profile h4{font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--brass);margin:22px 0 8px;font-weight:500}
.profile ul{margin:0;padding-left:18px;font-size:15px}
.profile li{margin-bottom:4px}
.profile .p-ct{margin-top:18px;font-size:14px;color:var(--ink-2)}
@media (max-width:640px){.profile .p-wrap{grid-template-columns:1fr;padding:28px 20px}.profile .avatar{max-width:200px}}

/* 사이트 안내 줄 */
.cta-band{background:var(--navy-deep);color:var(--on-dark);padding-block:32px}
.cta-band .wrap{display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cta-band strong{font-family:var(--serif);font-size:22px;font-weight:600;color:#fff}
.cta-band p{margin:6px 0 0;color:var(--on-dark-2)}
.cta-band .btn-primary{background:var(--brass)}
.cta-band .btn-primary:hover{background:#fff;color:var(--navy-deep)}

/* ===== 맨 위 바로가기 줄 (경영지원센터·AHP분석센터) — PC에서만 표시, 모바일은 메뉴 안에 있음 ===== */
.util-bar{background:var(--navy-deep);font-size:13px}
.util-bar .wrap{display:flex;justify-content:flex-end;align-items:center;gap:6px;height:36px}
.util-bar a{color:var(--on-dark);text-decoration:none;padding:4px 12px;border:1px solid rgba(255,255,255,.22);line-height:1.4;font-weight:600}
.util-bar a:hover{background:var(--brass);border-color:var(--brass);color:#fff}
.util-bar a.match{border-color:rgba(255,255,255,.5);font-weight:600}
@media (max-width:1180px){.util-bar{display:none}}
