/* ============================================================
   KM Laps — 아카이브 홈 디자인 시스템 (목표 시안 기준)
   km-theme.css(토큰) 이후 로드. 색/로고는 토큰으로 화이트라벨 대응.
   ============================================================ */
:root{
  --km-navy:      #0a1b3d;
  --km-navy-2:    #13315c;
  --km-bg-soft:   #eef4ff;   /* 옅은 블루 섹션 배경 */
  --km-bg-soft2:  #f5f9ff;
  --km-star:      #f6b73c;
  --km-badge-best:#00489c;
  --km-badge-new: #f97316;
  --km-file-pdf:  #e23b3b;
  --km-file-doc:  #2b6cb0;
  --km-file-ppt:  #d97706;
  --km-file-xls:  #15803d;
  --km-maxw:      1180px;
}

/* ---- 아이콘(Lucide 인라인) ---- */
.kmIco{width:1em;height:1em;display:inline-block;vertical-align:-0.12em;stroke-width:2;}
.kmCatItem .ic .kmIco{width:24px;height:24px;}
.kmStats .it .ic .kmIco{width:26px;height:26px;}
.kmSearchTabs a .ic .kmIco{width:20px;height:20px;}
.kmMy .av .kmIco,.kmIconBtn .kmIco{width:18px;height:18px;}

/* ---- 공통 레이아웃 ---- */
.kmHome{font-family:var(--km-font);color:var(--km-ink);background:#fff;}
.kmHome *{box-sizing:border-box;}
.kmWrap{max-width:var(--km-maxw);margin:0 auto;padding:0 20px;}
.kmSection{padding:44px 0;}
.kmSection.soft{background:var(--km-bg-soft2);}
.kmSecHead{display:flex;align-items:center;justify-content:space-between;margin:0 0 20px;}
.kmSecHead h2{font-size:22px;font-weight:800;margin:0;letter-spacing:-.5px;}
.kmMore{font-size:13px;color:var(--km-ink-soft);text-decoration:none;display:inline-flex;align-items:center;gap:3px;}
.kmMore:hover{color:var(--km-primary);}
.kmMore::after{content:"›";font-size:16px;line-height:1;}

/* ---- 상단 네비 ---- */
.kmNav{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid var(--km-line);}
.kmNav .kmWrap{display:flex;align-items:center;height:68px;gap:20px;}
.kmLogo{display:flex;align-items:center;font-size:24px;font-weight:800;letter-spacing:-1px;text-decoration:none;white-space:nowrap;}
.kmLogo .a{color:var(--km-navy);} .kmLogo .b{color:var(--km-primary);margin:0 1px;} .kmLogo .c{color:var(--km-ink);}
.kmMenu{display:flex;gap:22px;margin:0;padding:0;list-style:none;flex:1;min-width:0;}
.kmMenu a{color:var(--km-ink);font-weight:700;font-size:14.5px;text-decoration:none;padding:8px 0;position:relative;white-space:nowrap;}
.kmMenu a:hover{color:var(--km-primary);}
.kmNavRight{display:flex;align-items:center;gap:14px;}
.kmSearchTop{display:flex;align-items:center;background:#f1f5fb;border:1px solid var(--km-line);border-radius:999px;padding:7px 14px;width:180px;flex:none;}
.kmSearchTop input{border:none;background:none;outline:none;padding:0;flex:1;font-size:13px;}
.kmSearchTop button{border:none;background:none;cursor:pointer;color:var(--km-muted);}
.kmIconBtn{position:relative;background:none;border:none;cursor:pointer;color:var(--km-ink-soft);font-size:18px;}
.kmIconBtn .dot{position:absolute;top:-4px;right:-6px;background:var(--km-primary);color:#fff;font-size:10px;font-weight:700;border-radius:999px;padding:1px 5px;}
.kmMy{display:flex;align-items:center;gap:7px;color:var(--km-ink);font-weight:700;font-size:14px;text-decoration:none;}
.kmMy .av{width:30px;height:30px;border-radius:50%;background:var(--km-primary-light);display:flex;align-items:center;justify-content:center;color:var(--km-primary-dark);}

/* ---- 히어로 (라이트 기본) ---- */
.kmHero{background:linear-gradient(180deg,var(--km-bg-soft) 0%,#fff 100%);overflow:hidden;}
.kmHero .kmWrap{display:flex;align-items:center;gap:30px;padding-top:54px;padding-bottom:54px;}
.kmHeroText{flex:1;min-width:0;}
.kmHeroText h1{font-size:42px;line-height:1.25;font-weight:800;margin:0 0 18px;letter-spacing:-1px;}
.kmHeroText h1 .hl{color:var(--km-primary);}
.kmHeroText p{font-size:16px;color:var(--km-ink-soft);margin:0 0 26px;line-height:1.6;}
.kmHeroBtns{display:flex;gap:12px;flex-wrap:wrap;}
.kmHeroBtns .km-btn{font-size:15px;padding:13px 24px;border-radius:10px;}
.kmHeroArt{flex:1;display:flex;align-items:center;justify-content:center;min-height:240px;}
.kmHeroArt img{max-width:100%;height:auto;}
.kmHeroArt .ph{position:relative;width:100%;height:280px;border-radius:20px;overflow:hidden;background:
   radial-gradient(160px 160px at 72% 30%, rgba(37,99,235,.16), transparent),
   linear-gradient(135deg,#dce7ff,#eef4ff);display:flex;align-items:center;justify-content:center;}
.kmHeroArt .ph .kmIco{width:104px;height:104px;color:var(--km-primary);opacity:.55;stroke-width:1.5;}
.kmHeroArt .ph::before,.kmHeroArt .ph::after{content:"";position:absolute;border-radius:14px;background:#fff;box-shadow:var(--km-shadow);}
.kmHeroArt .ph::before{width:120px;height:74px;top:34px;left:34px;transform:rotate(-8deg);opacity:.92;}
.kmHeroArt .ph::after{width:96px;height:62px;bottom:36px;right:40px;transform:rotate(7deg);opacity:.92;background:linear-gradient(135deg,#eaf1ff,#fff);}
/* 히어로 위 미니 통계 (시안 2의 카드) */
.kmHeroStats{display:flex;gap:8px;margin-top:26px;background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:14px 8px;box-shadow:var(--km-shadow-sm);max-width:520px;}
.kmHeroStats .it{flex:1;text-align:center;padding:4px 6px;border-right:1px solid var(--km-line);}
.kmHeroStats .it:last-child{border-right:none;}
.kmHeroStats .lb{font-size:12px;color:var(--km-ink-soft);display:block;margin-bottom:4px;}
.kmHeroStats .vl{font-size:18px;font-weight:800;color:var(--km-primary);}

/* 다크 히어로 테마(옵션): body.kmHeroDark 일 때 */
body.kmHeroDark .kmHero{background:linear-gradient(135deg,var(--km-navy) 0%,var(--km-navy-2) 100%);}
body.kmHeroDark .kmHeroText h1{color:#fff;}
body.kmHeroDark .kmHeroText p{color:#c7d3e6;}
body.kmHeroDark .kmHeroText .eyebrow{color:#7fb0ff;}

/* ---- 검색 패널 ---- */
.kmSearchPanel{background:#fff;border:1px solid var(--km-line);border-radius:16px;box-shadow:var(--km-shadow);padding:24px 26px;margin-top:-34px;position:relative;z-index:5;}
.kmSearchPanel .row1{display:flex;align-items:center;gap:18px;}
.kmSearchPanel .q{font-size:18px;font-weight:800;white-space:nowrap;}
.kmSearchBox{flex:1;display:flex;align-items:center;border:1.5px solid var(--km-line);border-radius:12px;overflow:hidden;}
.kmSearchBox input{flex:1;border:none;outline:none;padding:14px 16px;font-size:15px;}
.kmSearchBox button{border:none;background:var(--km-primary);color:#fff;padding:0 20px;align-self:stretch;cursor:pointer;font-size:17px;}
.kmRecs{display:flex;flex-direction:column;gap:7px;min-width:230px;}
.kmRecs .lb{font-size:13px;color:var(--km-ink-soft);font-weight:700;}
.kmRecs .tags{display:flex;flex-wrap:wrap;gap:6px;}
.kmTag{font-size:12px;color:var(--km-primary-dark);background:var(--km-primary-light);border-radius:999px;padding:4px 10px;text-decoration:none;font-weight:600;}
.kmTag:hover{background:var(--km-primary);color:#fff;}
.kmSearchTabs{display:flex;gap:24px;margin-top:18px;border-top:1px solid var(--km-line);padding-top:14px;}
.kmSearchTabs a{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--km-ink-soft);font-size:13px;text-decoration:none;font-weight:600;}
.kmSearchTabs a.on,.kmSearchTabs a:hover{color:var(--km-primary);}
.kmSearchTabs a .ic{font-size:18px;}

/* ---- 과정 카드 ---- */
.kmCourseRow{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
.kmCourseCard{background:#fff;border:1px solid var(--km-line);border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:.15s;}
.kmCourseCard:hover{box-shadow:var(--km-shadow);transform:translateY(-3px);}
.kmCourseCard .thumb{position:relative;aspect-ratio:16/10;background:#e8eefc center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:#9fb3d9;font-weight:700;}
.kmCourseCard .badge{position:absolute;top:10px;left:10px;font-size:11px;font-weight:800;color:#fff;border-radius:6px;padding:3px 8px;}
.kmCourseCard .badge.best{background:var(--km-badge-best);}
.kmCourseCard .badge.new{background:var(--km-badge-new);}
.kmCourseCard .body{padding:14px;display:flex;flex-direction:column;gap:8px;flex:1;}
.kmCourseCard .cName{font-size:15px;font-weight:700;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px;}
.kmCourseCard .meta{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--km-ink-soft);margin-top:auto;}
.kmStar{color:var(--km-star);font-weight:800;}
.kmStar .cnt{color:var(--km-muted);font-weight:600;margin-left:2px;}

/* 캐러셀 화살표 */
.kmCarousel{position:relative;}
.kmArrow{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--km-line);box-shadow:var(--km-shadow-sm);cursor:pointer;font-size:18px;color:var(--km-ink-soft);z-index:3;display:flex;align-items:center;justify-content:center;}
.kmArrow.prev{left:-19px;} .kmArrow.next{right:-19px;}

/* ---- 아카이브(자료) 카드 ---- */
.kmArchiveRow{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.kmArchiveCard{background:#fff;border:1px solid var(--km-line);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;transition:.15s;}
.kmArchiveCard:hover{box-shadow:var(--km-shadow);border-color:#cfe0ff;}
.kmArchiveCard .top{display:flex;align-items:center;justify-content:space-between;}
.kmFileTag{font-size:11px;font-weight:700;border-radius:5px;padding:3px 8px;}
.kmFileTag.doc{background:#e7f0fb;color:var(--km-file-doc);}
.kmFileTag.pdf{background:#fdeaea;color:var(--km-file-pdf);}
.kmFileTag.ppt{background:#fdf0e0;color:var(--km-file-ppt);}
.kmFileTag.xls{background:#e7f5ec;color:var(--km-file-xls);}
.kmFileTag.vid{background:#ede9fe;color:#6d28d9;}
.kmFileIco{width:34px;height:40px;border-radius:5px;background:#f1f5fb;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:var(--km-muted);}
.kmArchiveCard .aName{font-size:15px;font-weight:700;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px;}
.kmArchiveCard .aMeta{font-size:12px;color:var(--km-muted);display:flex;justify-content:space-between;}

/* ---- 주제별(아이콘 그리드) ---- */
.kmCatGrid{display:grid;grid-template-columns:repeat(8,1fr);gap:14px;}
.kmCatItem{background:#fff;border:1px solid var(--km-line);border-radius:12px;padding:18px 8px;text-align:center;text-decoration:none;color:var(--km-ink);transition:.15s;}
.kmCatItem:hover{border-color:var(--km-primary);box-shadow:var(--km-shadow-sm);transform:translateY(-2px);}
.kmCatItem .ic{width:46px;height:46px;margin:0 auto 8px;border-radius:12px;background:var(--km-bg-soft);display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--km-primary);}
.kmCatItem .nm{font-size:13px;font-weight:700;}

/* ---- 학습 로드맵 ---- */
.kmRoadRow{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.kmRoadCard{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:22px;}
.kmRoadCard h3{margin:0 0 6px;font-size:17px;font-weight:800;color:var(--km-primary-dark);}
.kmRoadCard p{margin:0 0 18px;font-size:13px;color:var(--km-ink-soft);line-height:1.5;min-height:38px;}
.kmRoadSteps{display:flex;align-items:center;justify-content:space-between;position:relative;}
.kmRoadSteps::before{content:"";position:absolute;top:9px;left:8%;right:8%;height:2px;background:var(--km-line);}
.kmRoadSteps .st{display:flex;flex-direction:column;align-items:center;gap:7px;position:relative;z-index:1;}
.kmRoadSteps .st .dot{width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid var(--km-primary);}
.kmRoadSteps .st .nm{font-size:12px;color:var(--km-ink-soft);font-weight:600;}

/* ---- 통계 바 ---- */
.kmStats{background:linear-gradient(135deg,var(--km-navy),var(--km-navy-2));border-radius:16px;padding:26px 20px;display:grid;grid-template-columns:repeat(4,1fr);}
.kmStats .it{display:flex;align-items:center;gap:14px;justify-content:center;color:#fff;border-right:1px solid rgba(255,255,255,.12);}
.kmStats .it:last-child{border-right:none;}
.kmStats .it .ic{font-size:24px;opacity:.85;}
.kmStats .it .lb{font-size:13px;color:#aebfdb;display:block;margin-bottom:2px;}
.kmStats .it .vl{font-size:24px;font-weight:800;}
.kmStats .it .vl small{font-size:14px;font-weight:600;margin-left:2px;}

/* ---- 공지/커뮤니티 + 이벤트 ---- */
.kmBottomGrid{display:grid;grid-template-columns:1fr 1fr 0.8fr;gap:18px;}
.kmPanel{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:20px;}
.kmTabs{display:flex;gap:8px;margin-bottom:12px;}
.kmTabs button{border:none;background:#f1f5fb;color:var(--km-ink-soft);font-weight:700;font-size:12px;border-radius:999px;padding:5px 12px;cursor:pointer;}
.kmTabs button.on{background:var(--km-primary);color:#fff;}
.kmList{list-style:none;margin:0;padding:0;}
.kmList li{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #f1f4f8;font-size:13px;}
.kmList li:last-child{border-bottom:none;}
.kmList li a{color:var(--km-ink);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmList li a:hover{color:var(--km-primary);}
.kmList li .dt{color:var(--km-muted);font-size:12px;white-space:nowrap;}
.kmEvent{background:linear-gradient(135deg,#e0ecff,#eef4ff);border:1px solid #d6e4ff;border-radius:14px;padding:24px;display:flex;flex-direction:column;justify-content:center;}
.kmEvent h3{margin:0 0 6px;font-size:18px;font-weight:800;color:var(--km-navy);}
.kmEvent p{margin:0 0 16px;font-size:13px;color:var(--km-ink-soft);}

/* ---- 목록 페이지 ---- */
.kmPageHead{background:linear-gradient(180deg,var(--km-bg-soft),#fff);padding:38px 0 26px;}
.kmPageHead .bc{font-size:12px;color:var(--km-muted);margin-bottom:8px;}
.kmPageHead h1{font-size:28px;font-weight:800;margin:0 0 6px;letter-spacing:-.5px;}
.kmPageHead p{color:var(--km-ink-soft);margin:0;font-size:14px;}
.kmFilterBar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:24px 0;padding-bottom:16px;border-bottom:1px solid var(--km-line);}
.kmChips{display:flex;gap:8px;flex-wrap:wrap;flex:1;}
.kmChip{font-size:13px;font-weight:600;color:var(--km-ink-soft);background:#fff;border:1px solid var(--km-line);border-radius:999px;padding:7px 14px;text-decoration:none;}
.kmChip:hover{border-color:var(--km-primary);color:var(--km-primary);}
.kmChip.on{background:var(--km-primary);border-color:var(--km-primary);color:#fff;}
.kmFilterBar .right{display:flex;gap:10px;align-items:center;}
.kmFilterBar select{border:1px solid var(--km-line);border-radius:8px;padding:8px 12px;font-size:13px;}
.kmCount{font-size:13px;color:var(--km-ink-soft);margin-bottom:16px;}
.kmCount b{color:var(--km-primary);}
.kmCourseGrid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.kmEnrollBtn{margin-top:6px;width:100%;font-size:13px;padding:9px;border-radius:8px;}
.kmCourseCard .pName{font-size:12px;color:var(--km-muted);}
.kmPager{display:flex;justify-content:center;gap:6px;margin:36px 0 10px;}
.kmPager a,.kmPager span{min-width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--km-line);border-radius:8px;text-decoration:none;color:var(--km-ink-soft);font-size:13px;background:#fff;}
.kmPager a:hover{border-color:var(--km-primary);color:var(--km-primary);}
.kmPager .on{background:var(--km-primary);border-color:var(--km-primary);color:#fff;}
.kmEmpty{text-align:center;padding:60px 0;color:var(--km-muted);}

/* ---- 과정 상세 ---- */
.kmDetailHero{background:linear-gradient(180deg,var(--km-bg-soft),#fff);padding:34px 0;}
.kmDetailHero .kmWrap{display:flex;gap:30px;align-items:stretch;}
.kmDetailThumb{width:380px;flex-shrink:0;border-radius:14px;background:#e8eefc center/cover no-repeat;min-height:230px;border:1px solid var(--km-line);}
.kmDetailInfo{flex:1;display:flex;flex-direction:column;}
.kmDetailInfo .cat{display:inline-block;font-size:12px;font-weight:700;color:var(--km-primary-dark);background:var(--km-primary-light);border-radius:999px;padding:4px 12px;width:fit-content;margin-bottom:12px;}
.kmDetailInfo h1{font-size:26px;font-weight:800;margin:0 0 12px;line-height:1.35;letter-spacing:-.5px;}
.kmDetailMeta{display:flex;gap:18px;flex-wrap:wrap;color:var(--km-ink-soft);font-size:14px;margin-bottom:18px;}
.kmDetailMeta .it{display:flex;align-items:center;gap:6px;}
.kmDetailMeta .it .kmIco{width:16px;height:16px;color:var(--km-primary);}
.kmDetailBuy{margin-top:auto;display:flex;align-items:center;gap:16px;padding-top:18px;border-top:1px solid var(--km-line);}
.kmDetailBuy .price{font-size:24px;font-weight:800;color:var(--km-navy);}
.kmDetailBuy .free{font-size:22px;font-weight:800;color:var(--km-success);}
.kmDetailBuy .km-btn{font-size:16px;padding:13px 32px;border-radius:10px;}
.kmDetailBody{display:grid;grid-template-columns:1fr 300px;gap:30px;padding:40px 0;}
.kmDetailMain h2{font-size:19px;font-weight:800;margin:0 0 14px;padding-bottom:10px;border-bottom:2px solid var(--km-ink);}
.kmDetailMain .introTxt{font-size:15px;line-height:1.8;color:var(--km-ink-soft);white-space:pre-line;margin-bottom:36px;}
.kmCurri{list-style:none;margin:0 0 36px;padding:0;border:1px solid var(--km-line);border-radius:12px;overflow:hidden;}
.kmCurri li{display:flex;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid var(--km-line);font-size:14px;}
.kmCurri li:last-child{border-bottom:none;}
.kmCurri li:nth-child(even){background:#f9fbfe;}
.kmCurri li .no{width:26px;height:26px;flex-shrink:0;border-radius:50%;background:var(--km-primary-light);color:var(--km-primary-dark);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;}
.kmDetailSide{position:sticky;top:88px;align-self:start;}
.kmSideCard{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:20px;box-shadow:var(--km-shadow-sm);}
.kmSideCard .row{display:flex;justify-content:space-between;font-size:13px;padding:8px 0;border-bottom:1px solid #f1f4f8;}
.kmSideCard .row:last-of-type{border-bottom:none;}
.kmSideCard .row .k{color:var(--km-ink-soft);} .kmSideCard .row .v{font-weight:700;}

/* ---- 인증(로그인/회원) ---- */
.kmAuth{min-height:calc(100vh - 68px);background:linear-gradient(135deg,var(--km-bg-soft),#fff);display:flex;align-items:center;justify-content:center;padding:40px 20px;}
.kmAuthCard{display:flex;width:100%;max-width:860px;background:#fff;border:1px solid var(--km-line);border-radius:20px;box-shadow:var(--km-shadow-lg);overflow:hidden;}
.kmAuthArt{flex:1;background:linear-gradient(150deg,var(--km-navy),var(--km-navy-2));color:#fff;padding:44px 36px;display:flex;flex-direction:column;justify-content:center;background-size:cover;background-position:center;}
.kmAuthArt h2{font-size:26px;font-weight:800;margin:0 0 12px;line-height:1.35;}
.kmAuthArt p{font-size:14px;opacity:.85;line-height:1.6;margin:0;}
.kmAuthForm{flex:1;padding:44px 40px;display:flex;flex-direction:column;justify-content:center;}
.kmAuthForm .logo{font-size:26px;font-weight:800;color:var(--km-primary);letter-spacing:-1px;margin-bottom:6px;}
.kmAuthForm h1{font-size:20px;font-weight:800;margin:0 0 24px;}
.kmField{margin-bottom:14px;}
.kmField label{display:block;font-size:13px;font-weight:600;color:var(--km-ink-soft);margin-bottom:6px;}
.kmField input{width:100%;border:1.5px solid var(--km-line);border-radius:10px;padding:12px 14px;font-size:15px;}
.kmField input:focus{border-color:var(--km-primary);box-shadow:0 0 0 3px var(--km-primary-light);outline:none;}
.kmAuthBtn{width:100%;font-size:16px;padding:13px;border-radius:10px;margin-top:8px;}
.kmAuthLinks{display:flex;justify-content:center;gap:14px;margin-top:18px;font-size:13px;color:var(--km-ink-soft);}
.kmAuthLinks a{color:var(--km-ink-soft);text-decoration:none;}
.kmAuthLinks a:hover{color:var(--km-primary);}
.kmAuthChk{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--km-ink-soft);margin:4px 0 8px;}

/* ---- 마이페이지 ---- */
.kmMyWrap{background:var(--km-bg-soft2);min-height:60vh;padding:34px 0 50px;}
.kmMyGrid{display:grid;grid-template-columns:240px 1fr;gap:26px;}
.kmMySide{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:8px;align-self:start;position:sticky;top:88px;}
.kmMyProfile{padding:20px 16px;text-align:center;border-bottom:1px solid var(--km-line);margin-bottom:8px;}
.kmMyProfile .av{width:60px;height:60px;border-radius:50%;background:var(--km-primary-light);color:var(--km-primary-dark);display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:800;margin:0 auto 10px;}
.kmMyProfile .nm{font-weight:800;font-size:16px;} .kmMyProfile .lv{font-size:12px;color:var(--km-muted);margin-top:2px;}
.kmMyNav{list-style:none;margin:0;padding:0;}
.kmMyNav a{display:flex;align-items:center;gap:10px;padding:11px 14px;color:var(--km-ink);text-decoration:none;border-radius:8px;font-size:14px;font-weight:600;}
.kmMyNav a .kmIco{width:18px;height:18px;color:var(--km-ink-soft);}
.kmMyNav a:hover,.kmMyNav a.on{background:var(--km-primary-light);color:var(--km-primary-dark);}
.kmMyNav a.on .kmIco{color:var(--km-primary-dark);}
.kmMyMain{}
.kmMyHead{margin-bottom:20px;}
.kmMyHead h1{font-size:24px;font-weight:800;margin:0 0 4px;}
.kmMyHead p{color:var(--km-ink-soft);margin:0;font-size:14px;}
.kmStatCards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px;}
.kmStatCard{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:20px;display:flex;align-items:center;gap:14px;}
.kmStatCard .ic{width:44px;height:44px;border-radius:12px;background:var(--km-bg-soft);display:flex;align-items:center;justify-content:center;color:var(--km-primary);}
.kmStatCard .ic .kmIco{width:22px;height:22px;}
.kmStatCard .lb{font-size:12px;color:var(--km-ink-soft);} .kmStatCard .vl{font-size:22px;font-weight:800;}
.kmMyList{background:#fff;border:1px solid var(--km-line);border-radius:14px;overflow:hidden;}
.kmMyList .hd{padding:16px 20px;font-weight:800;border-bottom:1px solid var(--km-line);display:flex;justify-content:space-between;align-items:center;}
.kmStudyRow{display:flex;align-items:center;gap:16px;padding:16px 20px;border-bottom:1px solid #f1f4f8;}
.kmStudyRow:last-child{border-bottom:none;}
.kmStudyRow .th{width:84px;height:54px;border-radius:8px;background:#e8eefc center/cover no-repeat;flex-shrink:0;}
.kmStudyRow .info{flex:1;min-width:0;}
.kmStudyRow .nm{font-weight:700;font-size:14px;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmProg{height:7px;background:#eef2f7;border-radius:999px;overflow:hidden;}
.kmProg span{display:block;height:100%;background:var(--km-primary);}
.kmStudyRow .pct{font-size:13px;font-weight:700;color:var(--km-primary);white-space:nowrap;}
.kmStudyRow .st{font-size:12px;color:var(--km-muted);margin-top:3px;}

/* ---- 게시판 ---- */
.kmBoardTabs{display:flex;gap:8px;margin:0 0 18px;}
.kmBoardTabs a{font-size:14px;font-weight:700;color:var(--km-ink-soft);background:#fff;border:1px solid var(--km-line);border-radius:999px;padding:8px 18px;text-decoration:none;}
.kmBoardTabs a.on,.kmBoardTabs a:hover{background:var(--km-primary);border-color:var(--km-primary);color:#fff;}
.kmBoardTop{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.kmBoardSearch{display:flex;gap:8px;}
.kmBoardSearch input{border:1px solid var(--km-line);border-radius:8px;padding:9px 13px;font-size:14px;min-width:220px;}
.kmTable{width:100%;border-collapse:collapse;background:#fff;border-top:2px solid var(--km-ink);border-radius:0 0 12px 12px;overflow:hidden;}
.kmTable th{font-size:13px;font-weight:700;color:var(--km-ink-soft);padding:14px 12px;border-bottom:1px solid var(--km-line);background:#f8fafc;}
.kmTable td{font-size:14px;padding:15px 12px;border-bottom:1px solid #f1f4f8;text-align:center;color:var(--km-ink-soft);}
.kmTable td.subj{text-align:left;}
.kmTable td.subj a{color:var(--km-ink);text-decoration:none;font-weight:600;}
.kmTable td.subj a:hover{color:var(--km-primary);}
.kmTable tr:hover td{background:#fafcff;}
.kmTable .pin{background:#fff7ed;}
.kmBadgeNotice{font-size:11px;font-weight:800;color:var(--km-badge-new);background:#fff1e6;border-radius:5px;padding:2px 7px;margin-right:6px;}
.kmLock{color:var(--km-muted);}
/* 상세 */
.kmView{background:#fff;border:1px solid var(--km-line);border-top:2px solid var(--km-ink);border-radius:0 0 12px 12px;}
.kmViewHd{padding:24px 26px;border-bottom:1px solid var(--km-line);}
.kmViewHd h1{font-size:22px;font-weight:800;margin:0 0 12px;line-height:1.4;}
.kmViewMeta{display:flex;gap:18px;font-size:13px;color:var(--km-muted);}
.kmViewBody{padding:30px 26px;min-height:200px;font-size:15px;line-height:1.8;color:var(--km-ink);}
.kmViewBody img{max-width:100%;height:auto;}
.kmViewFiles{padding:16px 26px;border-top:1px solid var(--km-line);background:#f8fafc;font-size:13px;}
.kmViewFiles a{color:var(--km-primary);text-decoration:none;display:inline-flex;align-items:center;gap:6px;}
.kmViewNav{margin-top:14px;border:1px solid var(--km-line);border-radius:12px;overflow:hidden;}
.kmViewNav a{display:flex;gap:14px;padding:14px 20px;text-decoration:none;color:var(--km-ink-soft);font-size:14px;border-bottom:1px solid #f1f4f8;}
.kmViewNav a:last-child{border-bottom:none;} .kmViewNav a:hover{background:#fafcff;color:var(--km-primary);}
.kmViewNav a .dir{font-weight:700;color:var(--km-muted);min-width:50px;}

/* ---- 고객지원 허브 ---- */
.kmSupportTop{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:26px 0;}
.kmContactCard{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:24px;text-align:center;}
.kmContactCard .ic{width:52px;height:52px;margin:0 auto 12px;border-radius:14px;background:var(--km-bg-soft);display:flex;align-items:center;justify-content:center;color:var(--km-primary);}
.kmContactCard .ic .kmIco{width:26px;height:26px;}
.kmContactCard .lb{font-size:13px;color:var(--km-ink-soft);margin-bottom:4px;}
.kmContactCard .vl{font-size:18px;font-weight:800;color:var(--km-navy);}
.kmContactCard .sub{font-size:12px;color:var(--km-muted);margin-top:4px;}
.kmQuickLinks{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:8px 0 30px;}
.kmQuickLink{background:#fff;border:1px solid var(--km-line);border-radius:12px;padding:20px;text-decoration:none;color:var(--km-ink);display:flex;align-items:center;gap:14px;transition:.15s;}
.kmQuickLink:hover{border-color:var(--km-primary);box-shadow:var(--km-shadow-sm);}
.kmQuickLink .ic{width:42px;height:42px;border-radius:11px;background:var(--km-primary-light);display:flex;align-items:center;justify-content:center;color:var(--km-primary-dark);}
.kmQuickLink .ic .kmIco{width:20px;height:20px;}
.kmQuickLink .t{font-weight:700;font-size:15px;} .kmQuickLink .d{font-size:12px;color:var(--km-muted);}
.kmFaq{border:1px solid var(--km-line);border-radius:14px;overflow:hidden;background:#fff;}
.kmFaqItem{border-bottom:1px solid var(--km-line);}
.kmFaqItem:last-child{border-bottom:none;}
.kmFaqQ{width:100%;text-align:left;background:none;border:none;padding:18px 22px;font-size:15px;font-weight:700;color:var(--km-ink);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;}
.kmFaqQ .qm{color:var(--km-primary);font-weight:800;margin-right:8px;}
.kmFaqQ .ar{transition:.2s;color:var(--km-muted);}
.kmFaqItem.open .kmFaqQ .ar{transform:rotate(180deg);}
.kmFaqA{display:none;padding:0 22px 20px 48px;font-size:14px;line-height:1.7;color:var(--km-ink-soft);}
.kmFaqItem.open .kmFaqA{display:block;}

/* ---- 회사소개 ---- */
.kmAboutHero{background:linear-gradient(135deg,var(--km-navy),var(--km-navy-2));color:#fff;padding:60px 0;text-align:center;}
.kmAboutHero h1{font-size:34px;font-weight:800;margin:0 0 14px;letter-spacing:-1px;}
.kmAboutHero p{font-size:16px;opacity:.85;margin:0;line-height:1.7;}
.kmAboutBody{max-width:860px;margin:0 auto;padding:50px 20px;font-size:16px;line-height:1.9;color:var(--km-ink);}
.kmAboutBody img{max-width:100%;height:auto;border-radius:12px;margin:16px 0;}
.kmAboutBody h2,.kmAboutBody h1{font-size:24px;font-weight:800;margin:30px 0 14px;}
.kmAboutFeat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1000px;margin:0 auto 50px;padding:0 20px;}
.kmFeatCard{text-align:center;padding:28px 20px;background:#fff;border:1px solid var(--km-line);border-radius:14px;}
.kmFeatCard .ic{width:54px;height:54px;margin:0 auto 14px;border-radius:14px;background:var(--km-bg-soft);display:flex;align-items:center;justify-content:center;color:var(--km-primary);}
.kmFeatCard .ic .kmIco{width:26px;height:26px;}
.kmFeatCard h3{font-size:17px;font-weight:800;margin:0 0 8px;} .kmFeatCard p{font-size:13px;color:var(--km-ink-soft);margin:0;line-height:1.6;}

/* ---- 관리자 사이트 설정 ---- */
.kmSetCard{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:22px 24px;margin-bottom:16px;box-shadow:0 1px 4px rgba(20,30,60,.04);}
.kmSetCard h2{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:800;margin:0 0 4px;color:var(--km-ink);}
.kmSetCard h2 .kmIco{width:18px;height:18px;color:var(--km-primary);}
.kmSetCard .d{font-size:13px;color:var(--km-ink-soft);margin:0 0 16px;}
.kmSetGrid{display:grid;grid-template-columns:150px 1fr;gap:10px 14px;align-items:center;max-width:620px;}
.kmSetGrid label{font-size:14px;color:var(--km-ink-soft);font-weight:600;}
.kmSetGrid input,.kmSetGrid select{width:100%;height:40px;padding:0 12px;border:1px solid var(--km-line);border-radius:8px;font-size:14px;}
.kmSetGrid input:focus,.kmSetGrid select:focus{outline:none;border-color:var(--km-primary);box-shadow:0 0 0 3px rgba(37,99,235,.12);}
.kmModeSel{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;}
.kmModeOpt{display:flex;align-items:center;gap:10px;padding:14px 16px;border:1.5px solid var(--km-line);border-radius:12px;cursor:pointer;transition:.12s;}
.kmModeOpt:hover{border-color:var(--km-primary);}
.kmModeOpt.on{border-color:var(--km-primary);background:#f0f5ff;}
.kmModeOpt input{accent-color:var(--km-primary);width:18px;height:18px;}
.kmModeOpt b{font-size:14px;font-weight:600;color:var(--km-ink);}
.kmSetArea{width:100%;min-height:200px;margin-top:12px;padding:14px;border:1px solid var(--km-line);border-radius:10px;font-size:14px;line-height:1.7;font-family:inherit;resize:vertical;}
.kmSetArea:focus{outline:none;border-color:var(--km-primary);box-shadow:0 0 0 3px rgba(37,99,235,.12);}
.kmSetActions{display:flex;gap:10px;align-items:center;margin:6px 0 40px;}
@media (max-width:600px){ .kmSetGrid{grid-template-columns:1fr;} .kmSetGrid label{margin-top:6px;} }

/* ---- 운영 모드 안내 스트립(홈) ---- */
.kmModeGuide{margin:22px 0 4px;border:1px solid var(--km-line);border-radius:14px;padding:16px 20px;background:#fff;display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;box-shadow:0 1px 4px rgba(20,30,60,.04);}
.kmModeGuide .gt{display:flex;align-items:center;gap:8px;font-weight:800;color:var(--km-ink);font-size:15px;}
.kmModeGuide .gt .kmIco{width:19px;height:19px;color:var(--km-primary);}
.kmModeGuide ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 10px;}
.kmModeGuide li{font-size:13px;color:var(--km-ink-soft);background:var(--km-bg-soft);border:1px solid var(--km-line);border-radius:999px;padding:5px 13px;}
.kmModeGuide.mode-refund{border-color:#cfe0ff;} .kmModeGuide.mode-refund .gt .kmIco{color:#2554c7;}
.kmModeGuide.mode-archive{border-color:#c8ecd6;} .kmModeGuide.mode-archive .gt .kmIco{color:#1c8a52;}
@media (max-width:768px){ .kmModeGuide{flex-direction:column;align-items:flex-start;} }

/* ---- 범용 내부 페이지(서브네비 + 본문) : 소개/안내/인증 등 ---- */
.kmPageHero{background:linear-gradient(135deg,var(--km-navy),var(--km-navy-2));color:#fff;padding:46px 0;}
.kmPageHero .kmCrumb{font-size:13px;opacity:.7;margin:0 0 8px;}
.kmPageHero h1{font-size:30px;font-weight:800;margin:0;letter-spacing:-.5px;}
.kmPageWrap{max-width:1080px;margin:0 auto;padding:0 20px 60px;}
.kmSubNav{display:flex;flex-wrap:wrap;gap:6px;margin:22px 0 28px;border-bottom:1px solid var(--km-line);padding-bottom:14px;}
.kmSubNav a{display:inline-block;padding:9px 16px;border-radius:999px;font-size:14px;font-weight:600;color:var(--km-ink-soft);text-decoration:none;border:1px solid transparent;}
.kmSubNav a:hover{color:var(--km-primary);background:var(--km-bg-soft);}
.kmSubNav a.on{background:var(--km-primary);color:#fff;}
.kmPageBody{font-size:15.5px;line-height:1.9;color:var(--km-ink);}
.kmPageBody img{max-width:100%;height:auto;}
.kmPageBody h2{font-size:22px;font-weight:800;margin:30px 0 14px;}
.kmPageBody h3{font-size:18px;font-weight:700;margin:24px 0 10px;}
.kmPageBody ol,.kmPageBody ul{padding-left:22px;margin:8px 0;}
.kmPageBody li{margin:6px 0;}
.kmPageBody .titleBlue{color:var(--km-primary);font-weight:800;}
.kmPageBody .skyblue{color:#1d8cd0;} .kmPageBody .blue{color:var(--km-primary);} .kmPageBody .red{color:#c0392b;}
.kmPageBody table{width:100%;border-collapse:collapse;margin:14px 0;}
.kmPageBody table th,.kmPageBody table td{border:1px solid var(--km-line);padding:10px 12px;font-size:14px;}
.kmPageBody table th{background:var(--km-bg-soft);font-weight:700;text-align:left;}
.kmPageBody .kmTableScroll{overflow-x:auto;}
/* 레거시 내부 콘텐츠(.rule/.card/.designImage 등) 모바일 오버플로 방지 */
.kmPageBody .designImage,.kmPageBody .rule,.kmPageBody [class^="card"],.kmPageBody [class*=" card"]{width:auto!important;max-width:100%!important;padding-left:0!important;padding-right:0!important;}
.kmPageBody .designImage img,.kmPageBody .rule img{display:block;margin:10px auto;}
.kmPageBody [class^="card"] img,.kmPageBody [class*=" card"] img{max-width:100%;height:auto;}
/* 레거시 결제/강의 목록(.lecture/.lectureList) 고정폭 → 유동 */
.kmPageBody .lecture>div,.kmPageBody #contentsArea>h2,.kmPageBody #contentsArea dl{width:auto!important;max-width:100%!important;}
.kmPageBody .lectureList>li{float:none!important;width:auto!important;margin:14px 0!important;}
.kmPageBody .lectureList>li>.img{height:180px!important;}
.kmPageBody .lecture .searchForm{background-position:14px 14px!important;}
/* 정보 카드(연락처/오시는길 등) */
.kmInfoGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:18px 0;}
.kmInfoCard{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:20px 22px;}
.kmInfoCard .lb{font-size:12px;font-weight:700;color:var(--km-primary);letter-spacing:.4px;text-transform:uppercase;margin:0 0 6px;}
.kmInfoCard .vl{font-size:15px;color:var(--km-ink);margin:0;line-height:1.6;}
.kmMapBox{width:100%;border-radius:14px;overflow:hidden;border:1px solid var(--km-line);margin:8px 0 6px;}
.kmMapBox > div,.kmMapBox iframe{width:100%!important;max-width:100%!important;}
/* 비전 이미지 스택 */
.kmVision{text-align:center;}
.kmVision .vt{font-size:26px;font-weight:800;margin:8px 0;color:var(--km-ink);}
.kmVision .vp{color:var(--km-ink-soft);margin:0 0 22px;}
.kmVision img{display:block;margin:14px auto;border-radius:12px;}
@media (max-width:768px){
  .kmPageHero{padding:34px 0;} .kmPageHero h1{font-size:24px;}
  .kmSubNav a{padding:8px 13px;font-size:13px;}
  .kmVision .vt{font-size:21px;}
}

/* ---- 이용안내(가이드 스텝) ---- */
.kmSteps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:10px 0 36px;}
.kmStep{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:26px 20px;text-align:center;position:relative;}
.kmStep .num{width:36px;height:36px;border-radius:50%;background:var(--km-primary);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:15px;}
.kmStep .ic{width:48px;height:48px;margin:0 auto 12px;border-radius:13px;background:var(--km-bg-soft);display:flex;align-items:center;justify-content:center;color:var(--km-primary);}
.kmStep .ic .kmIco{width:24px;height:24px;}
.kmStep h3{font-size:16px;font-weight:800;margin:0 0 7px;}
.kmStep p{font-size:13px;color:var(--km-ink-soft);margin:0;line-height:1.6;}
/* 세로 번호형 진행 절차(긴 설명용) — ol.kmFlow > li > span.no + div(b,p) */
.kmFlow{list-style:none;counter-reset:kmflow;margin:10px 0 32px;padding:0;display:flex;flex-direction:column;gap:12px;}
.kmFlow li{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:18px 22px;position:relative;}
.kmFlow li .no{flex-shrink:0;width:34px;height:34px;border-radius:50%;background:var(--km-primary);color:#fff;font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;margin-top:1px;}
.kmFlow li b{display:block;font-size:16px;font-weight:800;margin:4px 0 5px;color:var(--km-ink);}
.kmFlow li p{font-size:14px;color:var(--km-ink-soft);margin:0;line-height:1.65;}
.kmGuideCards{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:8px 0 30px;}
.kmGuideCard{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:24px;display:flex;gap:16px;align-items:flex-start;}
.kmGuideCard .ic{width:44px;height:44px;flex-shrink:0;border-radius:11px;background:var(--km-primary-light);display:flex;align-items:center;justify-content:center;color:var(--km-primary-dark);}
.kmGuideCard .ic .kmIco{width:22px;height:22px;}
.kmGuideCard h3{font-size:16px;font-weight:800;margin:0 0 8px;}
.kmGuideCard p{font-size:14px;color:var(--km-ink-soft);margin:0;line-height:1.7;}

/* ---- 1:1 문의 ---- */
.kmInquiryForm{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:26px;margin-top:18px;}
.kmInquiryForm .kmField textarea{width:100%;border:1.5px solid var(--km-line);border-radius:10px;padding:13px 14px;font-size:15px;font-family:var(--km-font);resize:vertical;min-height:180px;}
.kmInquiryForm .kmField textarea:focus{border-color:var(--km-primary);box-shadow:0 0 0 3px var(--km-primary-light);outline:none;}
.kmAnsBadge{font-size:11px;font-weight:800;border-radius:5px;padding:2px 8px;}
.kmAnsBadge.done{background:#e7f5ec;color:var(--km-file-xls);}
.kmAnsBadge.wait{background:#fff1e6;color:var(--km-badge-new);}

/* ---- 훈련 유의사항(규정) ---- */
.kmNotice{list-style:none;margin:0 0 36px;padding:18px 22px;background:var(--km-bg-soft);border:1px solid #dde9ff;border-radius:12px;}
.kmNotice li{position:relative;padding:7px 0 7px 20px;font-size:14px;line-height:1.65;color:var(--km-ink-soft);}
.kmNotice li::before{content:"✓";position:absolute;left:0;top:7px;color:var(--km-primary);font-weight:800;}
.kmNotice li b{color:var(--km-ink);}
.kmTypeBadge{display:inline-block;font-size:12px;font-weight:800;border-radius:6px;padding:3px 10px;margin-bottom:10px;}
.kmTypeBadge.archive{background:#ecfeff;color:#0e7490;}
.kmTypeBadge.refund{background:#eef2ff;color:#00489c;}
.kmTypeBadge.general{background:#ecfdf3;color:#15803d;}

/* ============ 내 강의실(대시보드) ============ */
.kmRoom{background:var(--km-bg-soft2);min-height:calc(100vh - 68px);}
.kmRoom .kmWrap{display:grid;grid-template-columns:240px 1fr;gap:28px;padding-top:30px;padding-bottom:50px;align-items:start;}
/* 사이드바 */
.kmRoomSide{position:sticky;top:88px;display:flex;flex-direction:column;gap:16px;}
.kmRoomNav{background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:10px;}
.kmRoomNav a{display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:10px;color:var(--km-ink);text-decoration:none;font-weight:700;font-size:14.5px;}
.kmRoomNav a .kmIco{width:19px;height:19px;color:var(--km-ink-soft);}
.kmRoomNav a:hover{background:var(--km-bg-soft);}
.kmRoomNav a.on{background:var(--km-primary);color:#fff;box-shadow:var(--km-shadow-sm);}
.kmRoomNav a.on .kmIco{color:#fff;}
.kmSideHelp{background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:18px;}
.kmSideHelp .lb{font-size:12px;color:var(--km-muted);margin-bottom:4px;}
.kmSideHelp .tel{display:flex;align-items:center;gap:8px;font-size:20px;font-weight:800;color:var(--km-navy);}
.kmSideHelp .tel .kmIco{width:22px;height:22px;color:var(--km-primary);}
.kmSideHelp .hr{font-size:12px;color:var(--km-ink-soft);margin-top:6px;line-height:1.5;}
.kmSideHelp.tealp{background:var(--km-bg-soft);border-color:#d6e4ff;}
.kmSideHelp .t2{font-size:14px;font-weight:800;margin-bottom:4px;}
.kmSideHelp .p2{font-size:12px;color:var(--km-ink-soft);margin-bottom:12px;}
/* 대시보드 헤더 */
.kmRoomMain{min-width:0;}
.kmRoomTop{display:flex;justify-content:flex-end;align-items:center;gap:16px;margin-bottom:14px;}
.kmRoomTop .me{display:flex;align-items:center;gap:10px;font-size:14px;}
.kmRoomTop .me .nm{font-weight:800;} .kmRoomTop .me .co{color:var(--km-muted);font-size:12px;}
.kmRoomTop .av{width:38px;height:38px;border-radius:50%;background:var(--km-primary-light);display:flex;align-items:center;justify-content:center;color:var(--km-primary-dark);font-weight:800;}
.kmRoomHead h1{font-size:28px;font-weight:800;margin:0 0 6px;letter-spacing:-.5px;}
.kmRoomHead p{color:var(--km-ink-soft);margin:0 0 20px;font-size:14px;}
/* 학습현황 대시보드 카드 */
.kmDash{background:linear-gradient(135deg,#eef4ff,#f6f9ff);border:1px solid #e1ebfb;border-radius:18px;padding:28px 30px;display:grid;grid-template-columns:1.3fr 1fr;gap:24px;margin-bottom:26px;}
.kmDash .dTitle{font-size:18px;font-weight:800;margin:0 0 18px;}
.kmDash .dTitle small{font-size:12px;color:var(--km-muted);font-weight:600;margin-left:6px;}
.kmDashStats{display:flex;align-items:center;justify-content:space-between;gap:6px;}
.kmDashStats .it{text-align:center;flex:1;position:relative;}
.kmDashStats .it .ic{width:54px;height:54px;margin:0 auto 8px;border-radius:16px;background:#fff;box-shadow:var(--km-shadow-sm);display:flex;align-items:center;justify-content:center;}
.kmDashStats .it .ic .kmIco{width:26px;height:26px;}
.kmDashStats .it .lb{font-size:13px;color:var(--km-ink-soft);}
.kmDashStats .it .vl{font-size:22px;font-weight:800;margin-top:2px;}
.kmDashStats .arrow{color:var(--km-muted);font-size:16px;flex:0 0 auto;align-self:flex-start;margin-top:22px;}
.ic.ing{color:var(--km-primary);} .ic.done{color:var(--km-success);} .ic.soon{color:var(--km-warning);} .ic.fail{color:var(--km-muted);}
.kmDashRight{border-left:1px solid #dde7f7;padding-left:24px;display:flex;align-items:center;gap:20px;}
.kmDonut{--p:65;width:128px;height:128px;border-radius:50%;flex-shrink:0;
  background:conic-gradient(var(--km-primary) calc(var(--p)*1%), #dde7f7 0);
  display:flex;align-items:center;justify-content:center;position:relative;}
.kmDonut::before{content:"";position:absolute;inset:14px;background:#fff;border-radius:50%;}
.kmDonut .v{position:relative;font-size:26px;font-weight:800;color:var(--km-primary-dark);}
.kmDonut .v small{font-size:13px;}
.kmDashRight .info{flex:1;min-width:0;}
.kmDashRight .info .lb{font-size:13px;color:var(--km-ink-soft);}
.kmDashRight .info .big{font-size:22px;font-weight:800;color:var(--km-primary);margin:2px 0 12px;}
.kmDashRight .info .cr{font-size:12px;color:var(--km-ink-soft);display:flex;justify-content:space-between;margin-bottom:5px;}
.kmDashBar{height:8px;background:#dde7f7;border-radius:999px;overflow:hidden;margin-bottom:14px;}
.kmDashBar span{display:block;height:100%;background:linear-gradient(90deg,var(--km-primary),var(--km-accent));}
/* 탭 + 정렬 */
.kmRoomTabbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--km-line);margin-bottom:18px;}
.kmRoomTabs2{display:flex;gap:26px;}
.kmRoomTabs2 a{padding:12px 2px;color:var(--km-ink-soft);font-weight:700;font-size:15px;text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px;}
.kmRoomTabs2 a.on{color:var(--km-primary);border-color:var(--km-primary);}
.kmRoomTabs2 a .cnt{font-size:12px;color:var(--km-muted);}
/* 가로형 학습 카드 */
.kmStudyList2{display:flex;flex-direction:column;gap:14px;}
.kmStudyItem{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:16px;display:flex;align-items:center;gap:20px;transition:.15s;}
.kmStudyItem:hover{box-shadow:var(--km-shadow);}
.kmStudyItem .th{width:150px;height:92px;border-radius:10px;background:#e8eefc center/cover no-repeat;flex-shrink:0;}
.kmStudyItem .mid{flex:1;min-width:0;}
.kmStudyItem .badge2{display:inline-block;font-size:11px;font-weight:800;border-radius:6px;padding:3px 9px;margin-bottom:7px;}
.kmStudyItem .badge2.ing{background:var(--km-primary-light);color:var(--km-primary-dark);}
.kmStudyItem .badge2.done{background:#e7f5ec;color:var(--km-file-xls);}
.kmStudyItem .badge2.soon{background:#fff1e6;color:var(--km-badge-new);}
.kmStudyItem .badge2.fail{background:#f1f5f9;color:var(--km-muted);}
.kmStudyItem .nm2{font-size:16px;font-weight:700;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.kmStudyItem .meta2{font-size:12.5px;color:var(--km-muted);display:flex;gap:16px;flex-wrap:wrap;}
.kmStudyItem .meta2 .kmIco{width:14px;height:14px;vertical-align:-2px;margin-right:3px;}
.kmStudyItem .prog{width:200px;flex-shrink:0;}
.kmStudyItem .prog .top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px;}
.kmStudyItem .prog .top .l{font-size:12px;color:var(--km-ink-soft);}
.kmStudyItem .prog .top .pc{font-size:18px;font-weight:800;color:var(--km-primary);}
.kmStudyItem .prog .sub{font-size:11px;color:var(--km-muted);margin-top:5px;}
.kmStudyItem .acts{display:flex;flex-direction:column;gap:8px;width:120px;flex-shrink:0;}
.kmStudyItem .acts .km-btn{font-size:13px;padding:10px;border-radius:9px;}
.kmRoomFoot{text-align:center;color:var(--km-muted);font-size:12.5px;margin-top:26px;display:flex;align-items:center;justify-content:center;gap:6px;}

/* ============ 관리자(디자인 시스템) ============ */
.kmAdmin{background:var(--km-bg-soft2);min-height:100vh;font-family:var(--km-font);color:var(--km-ink);}
.kmAdminBar{background:#0a1b3d;color:#fff;height:58px;display:flex;align-items:center;gap:18px;padding:0 22px;}
.kmAdminBar .lg{font-size:18px;font-weight:800;letter-spacing:-.5px;}
.kmAdminBar .lg b{color:#7fb0ff;}
.kmAdminBar .sp{flex:1;}
.kmAdminBar a{color:#cdd9ec;text-decoration:none;font-size:13px;}
.kmAdminBar a:hover{color:#fff;}
.kmAdminWrap{max-width:1100px;margin:0 auto;padding:26px 20px 50px;}
.kmAdminHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:12px;}
.kmAdminHead h1{font-size:24px;font-weight:800;margin:0;}
.kmAdminHead p{color:var(--km-ink-soft);margin:4px 0 0;font-size:13px;}
.kmAdminStats{display:flex;gap:10px;}
.kmAdminStat{background:#fff;border:1px solid var(--km-line);border-radius:12px;padding:10px 18px;text-align:center;}
.kmAdminStat .v{font-size:20px;font-weight:800;color:var(--km-primary);} .kmAdminStat .l{font-size:11px;color:var(--km-muted);}
.kmAdminToolbar{display:flex;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap;}
.kmAdminToolbar input,.kmAdminToolbar select{border:1px solid var(--km-line);border-radius:8px;padding:9px 12px;font-size:13px;}
.kmEditRow{background:#f8fbff;}
.kmEditForm{display:flex;gap:18px;flex-wrap:wrap;align-items:flex-end;padding:8px 0;}
.kmEditForm .fld{display:flex;flex-direction:column;gap:5px;}
.kmEditForm .fld label{font-size:11px;color:var(--km-ink-soft);font-weight:700;}
.kmEditForm .fld input,.kmEditForm .fld select{border:1px solid var(--km-line);border-radius:7px;padding:7px 10px;font-size:13px;}
.kmEditForm .seg{display:flex;border:1px solid var(--km-line);border-radius:7px;overflow:hidden;}
.kmEditForm .seg label{padding:7px 12px;font-size:12.5px;cursor:pointer;background:#fff;}
.kmEditForm .seg label.on{background:var(--km-primary);color:#fff;}
.kmEditForm .seg input{display:none;}
.kmAdminMsg{background:#e7f5ec;color:var(--km-file-xls);border:1px solid #bce3c9;border-radius:10px;padding:12px 16px;font-size:14px;margin-bottom:16px;}

/* ============ 학습 플레이어(전체화면) ============ */
.kmPlayerPage{background:#0f1420;color:#e7ecf3;min-height:100vh;font-family:var(--km-font);}
.kmPlayerBar{position:sticky;top:0;z-index:20;background:#141b2b;border-bottom:1px solid #243049;display:flex;align-items:center;gap:18px;padding:0 20px;height:58px;}
.kmPlayerBar .back{display:flex;align-items:center;gap:6px;color:#aebbd0;text-decoration:none;font-size:14px;font-weight:600;}
.kmPlayerBar .back:hover{color:#fff;}
.kmPlayerBar .ttl{font-size:16px;font-weight:700;color:#fff;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmPlayerBar .prog{display:flex;align-items:center;gap:10px;font-size:13px;color:#aebbd0;}
.kmPlayerBar .prog .bar{width:120px;height:7px;background:#243049;border-radius:999px;overflow:hidden;}
.kmPlayerBar .prog .bar span{display:block;height:100%;background:linear-gradient(90deg,var(--km-primary),var(--km-accent));}
.kmPlayerBar .prog b{color:#fff;}
.kmPlayerWrap{display:grid;grid-template-columns:1fr 340px;gap:0;align-items:start;}
.kmPlayerMain{padding:0;}
.kmVideo{position:relative;width:100%;aspect-ratio:16/9;background:#000 center/cover no-repeat;display:flex;align-items:center;justify-content:center;}
.kmVideo .ph{text-align:center;color:#7c8aa6;}
.kmVideo .ph .ic{width:70px;height:70px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.kmVideo .ph .ic .kmIco{width:34px;height:34px;color:#cfe0ff;}
.kmVideo .ph .t{font-size:15px;color:#cdd9ec;font-weight:600;}
.kmVideo .ph .s{font-size:12px;color:#7c8aa6;margin-top:4px;}
.kmVideoInfo{padding:18px 24px;border-bottom:1px solid #243049;}
.kmVideoInfo .badge2{display:inline-block;font-size:11px;font-weight:800;border-radius:6px;padding:3px 9px;background:#1b2740;color:#7fb0ff;margin-bottom:8px;}
.kmVideoInfo h1{font-size:19px;font-weight:800;color:#fff;margin:0 0 6px;}
.kmVideoInfo .meta{font-size:12.5px;color:#8b99b3;display:flex;gap:16px;flex-wrap:wrap;}
.kmPlayTabs{display:flex;gap:0;border-bottom:1px solid #243049;padding:0 24px;}
.kmPlayTabs button{background:none;border:none;color:#8b99b3;font-size:14px;font-weight:700;padding:15px 16px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;}
.kmPlayTabs button.on{color:#fff;border-color:var(--km-primary);}
.kmPlayBody{padding:24px;font-size:14px;line-height:1.8;color:#c4cee0;}
.kmPlayBody .pane{display:none;} .kmPlayBody .pane.on{display:block;}
.kmPlayBody h3{font-size:15px;color:#fff;margin:0 0 10px;font-weight:700;}
.kmInfoRow{display:flex;padding:9px 0;border-bottom:1px solid #1d2740;font-size:13.5px;}
.kmInfoRow .k{width:120px;color:#8b99b3;flex-shrink:0;} .kmInfoRow .v{color:#dde6f4;}
.kmDownList{list-style:none;margin:0;padding:0;}
.kmDownList li{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;background:#161e30;border:1px solid #243049;border-radius:10px;margin-bottom:9px;}
.kmDownList li .nm{display:flex;align-items:center;gap:10px;font-size:13.5px;color:#dde6f4;}
.kmDownList li .nm .kmIco{width:18px;height:18px;color:#7fb0ff;}
.kmDownList li a{color:#7fb0ff;text-decoration:none;font-size:12.5px;display:flex;align-items:center;gap:5px;}
.kmDownEmpty{color:#7c8aa6;font-size:13px;padding:20px;text-align:center;}
/* 차시 사이드바 */
.kmChapSide{background:#141b2b;border-left:1px solid #243049;min-height:calc(100vh - 58px);position:sticky;top:58px;}
.kmChapHd{padding:18px 18px 12px;border-bottom:1px solid #243049;}
.kmChapHd .t{font-size:15px;font-weight:800;color:#fff;} .kmChapHd .s{font-size:12px;color:#8b99b3;margin-top:3px;}
.kmChapList{max-height:calc(100vh - 130px);overflow-y:auto;}
.kmChapItem{display:flex;gap:12px;padding:14px 18px;border-bottom:1px solid #1d2740;cursor:pointer;align-items:flex-start;}
.kmChapItem:hover{background:#1a2336;}
.kmChapItem.on{background:#1b2740;border-left:3px solid var(--km-primary);padding-left:15px;}
.kmChapItem.locked{opacity:.5;cursor:not-allowed;}
.kmChapItem .no{width:26px;height:26px;border-radius:8px;background:#243049;color:#aebbd0;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.kmChapItem.done .no{background:var(--km-success);color:#fff;}
.kmChapItem .ci{flex:1;min-width:0;}
.kmChapItem .cn{font-size:13.5px;color:#dde6f4;line-height:1.4;margin-bottom:5px;}
.kmChapItem .cm{font-size:11.5px;color:#8b99b3;display:flex;gap:10px;align-items:center;}
.kmChapItem .cm .st{font-weight:700;} .kmChapItem.done .cm .st{color:var(--km-success);} .kmChapItem .cm .st.ing{color:#7fb0ff;}
.kmChapItem .cbar{height:4px;background:#243049;border-radius:999px;margin-top:6px;overflow:hidden;}
.kmChapItem .cbar span{display:block;height:100%;background:var(--km-primary);}
.kmChapItem .lock .kmIco{width:16px;height:16px;color:#5b6b85;}

/* ============ 반응형 ============ */
/* 모바일 네비 기본(데스크톱: 햄버거/모바일전용 숨김) */
.kmNavToggle{display:none;width:40px;height:40px;border:none;background:none;cursor:pointer;flex-direction:column;justify-content:center;gap:5px;padding:8px;margin-left:-4px;}
.kmNavToggle span{display:block;height:2px;background:var(--km-ink);border-radius:2px;transition:.2s;}
.kmMenuMobileOnly{display:none;}
.kmNavBackdrop{display:none;position:fixed;inset:0;background:rgba(10,20,40,.4);z-index:998;}
body.kmNavOpen .kmNavBackdrop{display:block;}

/* 태블릿 ~1024 */
@media (max-width:1024px){
  :root{ --km-maxw:100%; }
  .kmWrap{padding:0 18px;}
  .kmCourseRow{grid-template-columns:repeat(3,1fr);}
  .kmCourseGrid4{grid-template-columns:repeat(3,1fr);}
  .kmArchiveRow{grid-template-columns:repeat(2,1fr);}
  .kmCatGrid{grid-template-columns:repeat(4,1fr);}
  .kmBottomGrid{grid-template-columns:1fr 1fr;}
  .kmStats{grid-template-columns:repeat(2,1fr);}
  .kmStats .it{border-right:none;}
  .kmRoadRow{grid-template-columns:1fr;}
  .kmDetailBody{grid-template-columns:1fr;}
  .kmDetailSide{position:static;}
  .kmRoom .kmWrap{grid-template-columns:1fr;}
  .kmRoomSide{position:static;flex-direction:row;flex-wrap:wrap;}
  .kmRoomNav{flex:1;min-width:240px;} .kmSideHelp{flex:1;}
  .kmDash{grid-template-columns:1fr;}
  .kmDashRight{border-left:none;border-top:1px solid #dde7f7;padding:18px 0 0;}
}

/* 모바일 ~768 */
@media (max-width:768px){
  /* 네비 → 햄버거 */
  .kmNav .kmWrap{height:58px;gap:10px;}
  .kmNavToggle{display:flex;}
  body.kmNavOpen .kmNavToggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  body.kmNavOpen .kmNavToggle span:nth-child(2){opacity:0;}
  body.kmNavOpen .kmNavToggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .kmLogo{font-size:20px;flex:1;}
  .kmMenu{position:fixed;top:0;left:0;bottom:0;width:78%;max-width:300px;background:#fff;flex-direction:column;
    gap:0;padding:70px 0 20px;box-shadow:2px 0 20px rgba(0,0,0,.15);transform:translateX(-100%);transition:transform .25s;z-index:999;overflow-y:auto;}
  body.kmNavOpen .kmMenu{transform:translateX(0);}
  .kmMenu li{width:100%;border-bottom:1px solid var(--km-line);}
  .kmMenu a{display:block;padding:15px 22px;font-size:15px;}
  .kmMenuMobileOnly{display:block;}
  .kmSearchTop{width:auto;padding:6px 10px;} .kmSearchTop input{width:90px;}
  .kmHideSm{display:none !important;}
  .kmMy .av{margin:0;}

  /* 히어로/검색 */
  .kmHero .kmWrap{flex-direction:column;padding:34px 18px;} .kmHeroArt{order:-1;width:100%;}
  .kmHeroText h1{font-size:28px;} .kmHeroStats{flex-wrap:wrap;}
  .kmHeroStats .it{flex:1 1 40%;border-right:none;}
  .kmSearchPanel{margin-top:-20px;padding:18px;}
  .kmSearchPanel .row1{flex-direction:column;align-items:stretch;gap:12px;}
  .kmRecs{min-width:0;} .kmSearchTabs{overflow-x:auto;gap:16px;padding-bottom:6px;}

  /* 그리드 → 2/1열 */
  .kmCourseRow,.kmCourseGrid4,.kmArchiveRow{grid-template-columns:repeat(2,1fr);gap:12px;}
  .kmCatGrid{grid-template-columns:repeat(3,1fr);}
  .kmBottomGrid,.kmStats,.kmSupportTop,.kmQuickLinks,.kmGuideCards,.kmSteps,.kmAboutFeat{grid-template-columns:1fr;}
  .kmStats .it{justify-content:flex-start;padding:10px 16px;}
  .kmSecHead h2{font-size:19px;}
  .kmPageHead h1{font-size:22px;} .kmPageHead{padding:26px 0 20px;}

  /* 인증 카드 */
  .kmAuthCard{flex-direction:column;max-width:420px;} .kmAuthArt{display:none;}
  .kmAuthForm{padding:32px 24px;}

  /* 마이페이지/강의실 */
  .kmMyGrid{grid-template-columns:1fr;} .kmMySide{position:static;}
  .kmStatCards{grid-template-columns:repeat(2,1fr);}
  .kmStudyRow{flex-wrap:wrap;} .kmStudyRow .th{width:64px;height:42px;}
  .kmDashStats{flex-wrap:wrap;gap:10px;} .kmDashStats .it{flex:1 1 40%;} .kmDashStats .arrow{display:none;}
  .kmDonut{width:104px;height:104px;}
  .kmStudyItem{flex-wrap:wrap;gap:12px;} .kmStudyItem .th{width:100%;height:120px;}
  .kmStudyItem .mid{flex:1 1 100%;} .kmStudyItem .prog{width:100%;} .kmStudyItem .acts{flex-direction:row;width:100%;}
  .kmStudyItem .acts .km-btn{flex:1;}
  .kmRoomTabs2{gap:14px;overflow-x:auto;white-space:nowrap;} .kmRoomTabs2 a{font-size:14px;}
  .kmRoomTop{justify-content:space-between;}

  /* 과정 상세 */
  .kmDetailHero .kmWrap{flex-direction:column;} .kmDetailThumb{width:100%;min-height:180px;}
  .kmDetailMeta{gap:10px;font-size:13px;} .kmDetailBuy{flex-wrap:wrap;}

  /* 게시판 표 → 가로 스크롤 */
  .kmTable{display:block;overflow-x:auto;white-space:nowrap;}
  .kmFilterBar{flex-direction:column;align-items:stretch;} .kmFilterBar .right{width:100%;}

  /* 푸터 */
  footer .kmWrap{flex-direction:column;gap:14px;}

  /* 학습 플레이어 → 세로 스택 */
  .kmPlayerWrap{grid-template-columns:1fr;}
  .kmChapSide{position:static;min-height:auto;border-left:none;border-top:1px solid #243049;}
  .kmChapList{max-height:380px;}
  .kmPlayerBar .ttl{font-size:14px;} .kmPlayerBar .prog .bar{width:70px;}
}

/* 소형 ~480 */
@media (max-width:480px){
  .kmCourseRow,.kmCourseGrid4,.kmArchiveRow,.kmStatCards{grid-template-columns:1fr;}
  .kmCatGrid{grid-template-columns:repeat(2,1fr);}
  .kmHeroText h1{font-size:24px;}
  .kmDashStats .it .vl{font-size:18px;}
  .km-btn{font-size:14px;}
}

/* ---- 수강후기(홈) ---- */
.kmReviewRow{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.kmReviewCard{position:relative;background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:26px 24px 20px;box-shadow:var(--km-shadow);}
.kmReviewCard .q{position:absolute;top:18px;right:20px;color:var(--km-primary);opacity:.18;}
.kmReviewCard .q .kmIco{width:34px;height:34px;}
.kmReviewCard .tx{margin:0 0 16px;font-size:14px;line-height:1.75;color:var(--km-ink-soft);min-height:72px;}
.kmReviewCard .who{display:flex;flex-direction:column;gap:2px;border-top:1px dashed var(--km-line);padding-top:12px;}
.kmReviewCard .who b{font-size:13.5px;color:var(--km-ink);}
.kmReviewCard .who span{font-size:12px;color:var(--km-muted);}
@media (max-width:860px){ .kmReviewRow{grid-template-columns:1fr;} .kmReviewCard .tx{min-height:0;} }

/* ---- 스크롤 등장 애니메이션 ---- */
.kmReveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease;}
.kmReveal.kmIn{opacity:1;transform:none;}

/* ---- 서비스 소개(운영 모드별, 홈) ---- */
.kmIntroRow{display:grid;gap:14px;}
.kmIntroRow.n4{grid-template-columns:repeat(4,1fr);}
.kmIntroRow.n3{grid-template-columns:repeat(3,1fr);}
.kmIntroCard{display:flex;flex-direction:column;gap:8px;padding:22px 20px;background:#fff;border:1px solid var(--km-line);
  border-radius:14px;text-decoration:none;box-shadow:var(--km-shadow);transition:transform .16s ease,box-shadow .16s ease,border-color .16s;}
.kmIntroCard:hover{transform:translateY(-3px);border-color:var(--km-primary);box-shadow:0 10px 28px rgba(20,40,80,.10);}
.kmIntroCard .ic{display:inline-flex;width:44px;height:44px;border-radius:11px;background:#eaf1ff;color:var(--km-primary);align-items:center;justify-content:center;}
.kmIntroCard .ic .kmIco{width:22px;height:22px;}
.kmIntroCard b{font-size:15px;color:var(--km-ink);}
.kmIntroCard p{margin:0;font-size:13px;line-height:1.65;color:var(--km-ink-soft);}
@media (max-width:1000px){ .kmIntroRow.n4{grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .kmIntroRow.n4,.kmIntroRow.n3{grid-template-columns:1fr;} }

/* ---- 내 강의실: 과정 유형 필터 ---- */
.kmRoomTabbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.kmTypeFilter{display:flex;gap:6px;}
.kmTypeFilter a{padding:7px 14px;border:1px solid var(--km-line);border-radius:999px;font-size:12.5px;font-weight:600;color:var(--km-ink-soft);text-decoration:none;transition:.12s;}
.kmTypeFilter a:hover{border-color:var(--km-primary);color:var(--km-primary);}
.kmTypeFilter a.on{background:var(--km-primary);border-color:var(--km-primary);color:#fff;}

/* ---- 플레이어: 평가/과제 카드 ---- */
.kmEvalBox{margin:14px 14px 4px;border:1px solid #2c3a55;background:#1b2538;border-radius:12px;padding:14px;}
.kmEvalBox .kmEvalHd{display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:800;color:#fff;margin-bottom:10px;}
.kmEvalBox .kmEvalHd .kmIco{width:16px;height:16px;color:#7da7ff;}
.kmEvalBox .kmEvalHd span{margin-left:auto;font-size:11px;font-weight:600;color:#8fa3c8;}
.kmEvalItem{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px dashed #2c3a55;}
.kmEvalItem .ei{display:flex;flex-direction:column;gap:2px;}
.kmEvalItem .ei b{font-size:13px;color:#e8eefb;}
.kmEvalItem .ei .cond{font-size:11.5px;color:#8fa3c8;}
.kmEvalItem button[disabled]{opacity:.55;cursor:not-allowed;}
.kmEvalFt{margin-top:10px;font-size:11px;color:#8fa3c8;border-top:1px dashed #2c3a55;padding-top:9px;}

/* ---- 훈련 진행 유의사항(홈, 공단 점검 필수 안내) ---- */
.kmNoticeStrip{background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:24px 26px;box-shadow:var(--km-shadow);}
.kmNoticeStrip .hd{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:800;color:var(--km-ink);margin-bottom:14px;}
.kmNoticeStrip .hd .kmIco{width:19px;height:19px;color:var(--km-primary);}
.kmNoticeStrip ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:7px 26px;}
.kmNoticeStrip li{display:flex;gap:9px;font-size:13px;line-height:1.65;color:var(--km-ink-soft);}
.kmNoticeStrip li b{flex:none;width:20px;height:20px;border-radius:50%;background:#eaf1ff;color:var(--km-primary);font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;margin-top:1px;}
.kmNoticeStrip .ft{margin:12px 0 0;font-size:12px;color:var(--km-muted);}
.kmNoticeStrip .ft a{color:var(--km-primary);font-weight:600;}
@media (max-width:760px){ .kmNoticeStrip ol{grid-template-columns:1fr;} }

/* ============================================================
   kmK* — 메인 홈 KMA 컨셉 리뉴얼(홈 전용, 격리 프리픽스)
   화이트 베이스 + 다크 악센트 · 타이포 비비드 카드 · 탭 큐레이션
   ============================================================ */
/* ── 히어로(다크) ── */
.kmKHero{background:#101114;color:#fff;padding:46px 0 0;}
.kmKHeroIn{display:grid;grid-template-columns:300px 1fr 230px;gap:34px;align-items:center;}
.kmKPoster{position:relative;height:330px;border-radius:14px;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#ff4e9b 0%,#7b2ff7 55%,#36d1dc 110%);box-shadow:0 18px 50px rgba(123,47,247,.35);}
.kmKPoster::before{content:"";position:absolute;inset:0;background:
  radial-gradient(120px 120px at 85% 12%,rgba(255,255,255,.35),transparent),
  radial-gradient(160px 160px at 10% 90%,rgba(0,0,0,.18),transparent);}
.kmKPoster .big{position:relative;font-size:64px;line-height:1.08;font-weight:900;letter-spacing:-2px;color:#fff;
  text-shadow:0 6px 24px rgba(0,0,0,.25);transform:rotate(-4deg);text-align:center;}
.kmKPoster .tag{position:absolute;left:16px;bottom:14px;font-size:11px;font-weight:700;color:rgba(255,255,255,.85);
  background:rgba(0,0,0,.28);padding:4px 10px;border-radius:999px;}
.kmKHeroTxt h1{margin:0 0 14px;font-size:34px;line-height:1.35;font-weight:800;letter-spacing:-.5px;}
.kmKHeroTxt h1 .em{font-size:28px;}
.kmKHeroTxt p{margin:0 0 22px;font-size:15px;color:#b9bdc7;}
.kmKHeroTxt .btns{display:flex;gap:10px;}
.kmKHeroTxt .bt1{display:inline-block;background:#fff;color:#101114;font-weight:800;font-size:14px;padding:13px 22px;border-radius:10px;text-decoration:none;}
.kmKHeroTxt .bt1:hover{background:var(--km-primary);color:#fff;}
.kmKHeroTxt .bt2{display:inline-block;border:1px solid #3a3d46;color:#d6d9e0;font-weight:600;font-size:14px;padding:13px 22px;border-radius:10px;text-decoration:none;}
.kmKHeroTxt .bt2:hover{border-color:#fff;color:#fff;}
.kmKHeroSide{display:flex;flex-direction:column;gap:12px;}
.kmKHeroSide .mini{position:relative;display:flex;flex-direction:column;gap:3px;background:#1b1d22;border:1px solid #2a2d35;
  border-radius:12px;padding:16px 16px 14px;text-decoration:none;transition:.15s;overflow:hidden;}
.kmKHeroSide .mini::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--mc,#fff);}
.kmKHeroSide .mini b{color:#fff;font-size:15px;}
.kmKHeroSide .mini span{color:#9aa0ac;font-size:12px;}
.kmKHeroSide .mini i{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-style:normal;color:#6c717d;}
.kmKHeroSide .mini:hover{border-color:#4a4e59;} .kmKHeroSide .mini:hover i{color:#fff;}
.kmKHeroStats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;border-top:1px solid #26282e;
  margin-top:38px;padding:20px 0 24px;}
.kmKHeroStats div{display:flex;align-items:baseline;gap:8px;justify-content:center;}
.kmKHeroStats b{font-size:24px;font-weight:800;color:#fff;letter-spacing:-.5px;}
.kmKHeroStats span{font-size:12.5px;color:#9aa0ac;}
/* ── 섹션 헤드/탭 ── */
.kmKSec .kmKHead{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:18px;}
.kmKSec .kmKHead h2{margin:0;font-size:22px;font-weight:800;letter-spacing:-.4px;color:var(--km-ink);}
.kmKSec .kmKHead a{font-size:13px;color:var(--km-muted);text-decoration:none;font-weight:600;}
.kmKSec .kmKHead a:hover{color:var(--km-primary);}
.kmKSec .kmKHead .d{font-size:13.5px;color:var(--km-ink-soft);}
.kmKTabs{display:flex;gap:26px;border-bottom:1px solid var(--km-line);margin-bottom:22px;overflow-x:auto;}
.kmKTabs button{background:none;border:0;padding:12px 2px 13px;font-size:16px;font-weight:700;color:var(--km-muted);
  cursor:pointer;border-bottom:2.5px solid transparent;white-space:nowrap;font-family:inherit;}
.kmKTabs button.on{color:var(--km-ink);border-bottom-color:#101114;}
/* ── 과정 카드(4열, 타이포 썸네일) ── */
.kmKPane{display:none;} .kmKPane.on{display:grid;}
.kmKGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 18px;}
.kmKCard{display:flex;flex-direction:column;text-decoration:none;border-radius:12px;overflow:hidden;
  transition:transform .16s ease,box-shadow .16s ease;background:#fff;border:1px solid var(--km-line);}
.kmKCard:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(20,30,60,.12);}
.kmKCard .th{aspect-ratio:16/10;background-size:cover;background-position:center;}
.kmKCard .th.typo{display:flex;align-items:center;justify-content:center;padding:18px;}
.kmKCard .th.typo span{font-size:21px;line-height:1.3;font-weight:900;color:#fff;letter-spacing:-.5px;
  text-shadow:0 3px 14px rgba(0,0,0,.22);text-align:left;width:100%;}
.kmKCard .bd{padding:13px 14px 15px;display:flex;flex-direction:column;gap:5px;}
.kmKCard .ct{font-size:11.5px;color:var(--km-muted);font-weight:600;}
.kmKCard .nm{font-size:14.5px;font-weight:700;color:var(--km-ink);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px;}
.kmKCard .mt{font-size:12px;color:var(--km-muted);}
.kmKCard .pr{margin-top:4px;display:flex;align-items:center;gap:8px;}
.kmKCard .pr b{font-size:16px;font-weight:800;color:var(--km-ink);letter-spacing:-.3px;}
.kmKCard .pr b.fr{color:var(--km-success);} .kmKCard .pr b.rf{color:#00489c;font-size:14px;}
.kmKCard .pr .sb{font-size:12px;color:var(--km-muted);}
/* ── 다크 후기 섹션 ── */
.kmKDark{background:#101114;padding:60px 0;}
.kmKDarkIn{display:grid;grid-template-columns:260px 1fr;gap:36px;align-items:center;}
.kmKDarkTxt .ov{margin:0 0 8px;font-size:12px;font-weight:800;letter-spacing:2px;color:#7b8090;}
.kmKDarkTxt h2{margin:0 0 16px;font-size:24px;line-height:1.45;font-weight:800;color:#fff;letter-spacing:-.4px;}
.kmKDarkTxt a{font-size:13px;color:#b9bdc7;text-decoration:none;font-weight:600;}
.kmKDarkTxt a:hover{color:#fff;}
.kmKRevRow{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.kmKRev{position:relative;border-radius:14px;padding:22px 20px 18px;background:#1b1d22;border:1px solid #2a2d35;overflow:hidden;}
.kmKRev::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--rg);}
.kmKRev .tx{margin:0 0 14px;font-size:13.5px;line-height:1.75;color:#d6d9e0;min-height:70px;}
.kmKRev .who{display:flex;flex-direction:column;gap:2px;border-top:1px dashed #2f323b;padding-top:11px;}
.kmKRev .who b{font-size:13px;color:#fff;} .kmKRev .who span{font-size:11.5px;color:#8e93a0;}
/* ── 블랙 CTA 스트립 ── */
.kmKStrip{padding:8px 0 40px;}
.kmKStrip a{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;background:#101114;
  border-radius:14px;padding:26px 20px;text-decoration:none;overflow:hidden;}
.kmKStrip b{color:#fff;font-size:18px;font-weight:800;letter-spacing:-.3px;}
.kmKStrip i{font-style:normal;color:#fff;font-size:18px;transition:transform .15s;}
.kmKStrip a:hover i{transform:translateX(5px);}
.kmKStrip .deco{position:absolute;border-radius:50%;}
.kmKStrip .d1{width:46px;height:46px;background:#ffd200;right:12%;top:-12px;}
.kmKStrip .d2{width:22px;height:22px;background:#3f5efb;left:14%;bottom:-6px;border-radius:4px;transform:rotate(18deg);}
.kmKStrip .d3{width:14px;height:14px;background:#ff4e9b;left:24%;top:12px;}
/* ── 인기 카테고리 ── */
.kmKCats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.kmKCats a{display:flex;flex-direction:column;gap:3px;border:1px solid var(--km-line);border-radius:10px;
  padding:18px 18px 15px;text-decoration:none;transition:.13s;background:#fff;}
.kmKCats a:hover{border-color:#101114;}
.kmKCats b{font-size:15px;color:var(--km-ink);} .kmKCats span{font-size:12px;color:var(--km-muted);}
/* ── 하단 검색 스트립 ── */
.kmKFind{background:var(--km-bg-soft);padding:44px 0;}
.kmKFindIn{display:flex;align-items:center;gap:34px;}
.kmKFindIn h2{margin:0;font-size:21px;font-weight:800;line-height:1.45;color:var(--km-ink);letter-spacing:-.4px;flex:none;}
.kmKFindIn form{display:flex;gap:8px;flex:1;flex-wrap:wrap;}
.kmKFindIn select,.kmKFindIn input{height:46px;border:1px solid var(--km-line-2,#cfd6e1);border-radius:9px;padding:0 14px;
  font-size:13.5px;background:#fff;font-family:inherit;color:var(--km-ink);}
.kmKFindIn select{flex:0 0 150px;} .kmKFindIn input{flex:1;min-width:160px;}
.kmKFindIn button{height:46px;padding:0 26px;background:#101114;color:#fff;border:0;border-radius:9px;
  font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;}
.kmKFindIn button:hover{background:var(--km-primary);}
/* ── 공지 리스트 ── */
.kmKNotice{list-style:none;margin:0;padding:0;border-top:2px solid #101114;}
.kmKNotice li a{display:flex;align-items:center;gap:14px;padding:13px 4px;border-bottom:1px solid var(--km-line);text-decoration:none;}
.kmKNotice .t{flex:1;font-size:14px;color:var(--km-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmKNotice .d{font-size:12px;color:var(--km-muted);flex:none;}
.kmKNotice li a:hover .t{color:var(--km-primary);}
/* ── 반응형 ── */
@media (max-width:1100px){
  .kmKHeroIn{grid-template-columns:240px 1fr;gap:24px;}
  .kmKHeroSide{display:none;}
  .kmKGrid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:860px){
  .kmKHeroIn{grid-template-columns:1fr;}
  .kmKPoster{height:220px;} .kmKPoster .big{font-size:48px;}
  .kmKHeroTxt h1{font-size:26px;}
  .kmKGrid{grid-template-columns:repeat(2,1fr);gap:16px 12px;}
  .kmKDarkIn{grid-template-columns:1fr;gap:22px;}
  .kmKRevRow{grid-template-columns:1fr;}
  .kmKCats{grid-template-columns:repeat(2,1fr);}
  .kmKFindIn{flex-direction:column;align-items:stretch;gap:16px;}
  .kmKHeroStats b{font-size:18px;} .kmKHeroStats span{font-size:11px;}
}
@media (max-width:480px){
  .kmKGrid{grid-template-columns:1fr;}
  .kmKHeroStats{grid-template-columns:repeat(2,1fr);gap:14px 8px;}
  .kmKTabs{gap:18px;} .kmKTabs button{font-size:14.5px;}
}

/* ============================================================
   kmV* — 메인 홈 v3: 밝은 톤 × 영상 강의 플랫폼(홈 전용 격리)
   라운드 크게 · 소프트 섀도 · 파스텔 포인트 · 플레이/재생시간 모티프
   ============================================================ */
/* ── 히어로 슬라이더 ── */
.kmVHero{padding:26px 0 0;background:linear-gradient(180deg,var(--km-bg-soft),#fff 80%);}
.kmVSlides{position:relative;border-radius:24px;overflow:hidden;min-height:320px;box-shadow:0 16px 44px rgba(20,40,80,.10);}
.kmVSlide{display:none;grid-template-columns:1.25fr 1fr;align-items:center;min-height:320px;padding:38px 48px;}
.kmVSlide.on{display:grid;animation:kmvFade .45s ease;}
@keyframes kmvFade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.kmVSlide.s-blue{background:linear-gradient(120deg,#eaf2ff 0%,#dbeafe 55%,#eff6ff 100%);}
.kmVSlide.s-navy{background:linear-gradient(120deg,#062b57,#00489c);}
.kmVSlide.s-green{background:linear-gradient(120deg,#0c3b33,#11675a);}
.kmVSlide .kk{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.4px;padding:6px 13px;border-radius:999px;margin-bottom:14px;
  background:rgba(37,99,235,.1);color:var(--km-primary-dark);}
.kmVSlide h1{margin:0 0 12px;font-size:32px;line-height:1.35;font-weight:800;letter-spacing:-.6px;color:var(--km-ink);}
.kmVSlide h1 b,.kmVSlide h1 .hl{color:var(--km-primary);}
.kmVSlide p{margin:0 0 22px;font-size:14.5px;line-height:1.7;color:var(--km-ink-soft);}
.kmVSlide .go{display:inline-block;background:var(--km-primary);color:#fff;font-weight:800;font-size:14px;
  padding:13px 24px;border-radius:12px;text-decoration:none;box-shadow:0 8px 20px rgba(37,99,235,.3);}
.kmVSlide .go:hover{background:var(--km-primary-dark);}
.kmVSlide.s-navy .kk,.kmVSlide.s-green .kk{background:rgba(255,255,255,.14);color:#fff;}
.kmVSlide.s-navy h1,.kmVSlide.s-green h1{color:#fff;}
.kmVSlide.s-navy h1 b{color:#9cc1ff;} .kmVSlide.s-green h1 b{color:#7ef0cf;}
.kmVSlide.s-navy p,.kmVSlide.s-green p{color:rgba(255,255,255,.72);}
.kmVSlide.s-navy .go{background:#fff;color:#062b57;box-shadow:none;}
.kmVSlide.s-green .go{background:#fff;color:#0c3b33;box-shadow:none;}
.kmVSlide .vis{display:flex;align-items:center;justify-content:center;}
.kmVSlide .vis img{max-width:88%;max-height:280px;}
.kmVSlide .vis.deco{position:relative;min-height:200px;}
.kmVSlide .vis.deco .c1{position:absolute;width:130px;height:130px;border-radius:50%;background:rgba(255,255,255,.10);right:22%;top:8%;}
.kmVSlide .vis.deco .c2{position:absolute;width:60px;height:60px;border-radius:18px;background:rgba(255,255,255,.14);right:10%;bottom:14%;transform:rotate(14deg);}
.kmVSlide .vis.deco .c3{position:absolute;left:34%;top:50%;transform:translateY(-50%);width:84px;height:84px;border-radius:50%;
  background:rgba(255,255,255,.92);display:flex;align-items:center;justify-content:center;font-size:26px;color:#062b57;padding-left:6px;}
.kmVDots{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:center;gap:7px;}
.kmVDots button{width:8px;height:8px;border-radius:999px;border:0;background:rgba(0,0,0,.18);cursor:pointer;padding:0;transition:.15s;}
.kmVSlide.s-navy ~ .kmVDots button{background:rgba(255,255,255,.3);}
.kmVDots button.on{width:22px;background:var(--km-primary);}
.kmVStats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:20px 10px 6px;}
.kmVStats div{display:flex;align-items:baseline;justify-content:center;gap:7px;}
.kmVStats b{font-size:22px;font-weight:800;color:var(--km-ink);letter-spacing:-.5px;}
.kmVStats span{font-size:12.5px;color:var(--km-muted);}
/* ── 섹션 타이틀 ── */
.kmVTitle{margin:0 0 20px;font-size:24px;font-weight:800;letter-spacing:-.5px;color:var(--km-ink);text-align:center;}
.kmVTitle u{text-decoration:none;border-bottom:3px solid var(--km-primary);padding-bottom:2px;}
/* ── 퀵패널 ── */
.kmVQuickRow{display:grid;grid-template-columns:1.7fr 1fr;gap:16px;}
.kmVQuick,.kmVCs{background:#fff;border:1px solid #eef1f5;border-radius:16px;padding:26px 28px;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.05);}
.kmVQuick{display:flex;align-items:center;gap:30px;}
.kmVQuick .qh h2{margin:0 0 6px;font-size:16px;font-weight:800;color:var(--km-ink);letter-spacing:-.3px;}
.kmVQuick .qh p{margin:0;font-size:12.5px;color:var(--km-muted);line-height:1.6;}
.kmVQuick .qi{display:flex;gap:6px;flex:1;justify-content:space-between;}
.kmVQuick .qi a{display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;font-size:12.5px;font-weight:600;color:var(--km-ink-soft);transition:.14s;}
.kmVQuick .qi .ic{width:50px;height:50px;border-radius:14px;display:flex;align-items:center;justify-content:center;transition:.16s;}
.kmVQuick .qi .ic .kmIco{width:22px;height:22px;}
.kmVCs h2{margin:0 0 14px;font-size:16px;font-weight:800;color:var(--km-ink);letter-spacing:-.3px;}
.kmVCs a{display:flex;align-items:center;gap:10px;padding:13px 2px;font-size:13.5px;font-weight:600;color:var(--km-ink-soft);text-decoration:none;border-top:1px solid #eef1f5;transition:.13s;}
.kmVCs a:first-of-type{border-top:0;}
.kmVCs a .kmIco{width:17px;height:17px;color:var(--km-primary);}
.kmVCs a i{margin-left:auto;font-style:normal;color:#c2cad6;font-size:16px;transition:.13s;}
.kmVCs a:hover{color:var(--km-primary);} .kmVCs a:hover i{color:var(--km-primary);transform:translateX(3px);}
/* ── 퀵링크 4종(에디토리얼 — 화이트 카드 + 좌측 액센트 + 정제 아이콘) ── */
.kmVLinks{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.kmVLinks a{position:relative;display:flex;align-items:center;gap:14px;background:#fff;border:1px solid #eef1f5;border-radius:14px;
  padding:20px 20px;text-decoration:none;overflow:hidden;
  box-shadow:0 1px 2px rgba(16,24,40,.03);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;}
.kmVLinks a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--qi,var(--km-primary));opacity:0;transition:.15s;}
.kmVLinks a:hover{transform:translateY(-3px);border-color:#e2e8f1;box-shadow:0 12px 26px rgba(16,24,40,.08);}
.kmVLinks a:hover::before{opacity:1;}
.kmVLinks .tx{display:flex;flex-direction:column;gap:3px;min-width:0;}
.kmVLinks b{font-size:14.5px;font-weight:700;color:var(--km-ink);letter-spacing:-.2px;}
.kmVLinks span{font-size:12px;color:var(--km-muted);line-height:1.4;}
.kmVLinks i{flex:none;width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  margin-left:auto;background:#f1f5fb;background:color-mix(in srgb,var(--qi,var(--km-primary)) 9%,#fff);color:var(--qi,var(--km-primary));transition:.15s;}
.kmVLinks i .kmIco{width:20px;height:20px;stroke-width:1.8;}
.kmVLinks a:hover i{background:var(--qi,var(--km-primary));color:#fff;}
/* ── 영상형 카드 ── */
.kmVGrid{display:grid;grid-template-columns:repeat(4,1fr);column-gap:22px;row-gap:28px;}
.kmVCard{display:flex;flex-direction:column;text-decoration:none;}
.kmVCard .th{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background-size:cover;background-position:center;
  box-shadow:0 6px 18px rgba(20,40,80,.08);transition:transform .16s ease;}
.kmVCard:hover .th{transform:translateY(-4px);}
.kmVCard .th.typo{display:flex;align-items:center;padding:16px 18px;}
.kmVCard .th.typo .tt{font-size:18px;line-height:1.35;font-weight:900;letter-spacing:-.4px;}
.kmVCard .play,.kmVFeatTh .play{position:absolute;right:12px;bottom:12px;width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.94);box-shadow:0 4px 12px rgba(0,0,0,.18);}
.kmVCard .play::before,.kmVFeatTh .play::before{content:"";position:absolute;left:55%;top:50%;transform:translate(-50%,-50%);
  border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent #1b2433;}
.kmVCard .dur,.kmVFeatTh .dur{position:absolute;left:12px;bottom:12px;background:rgba(16,17,20,.78);color:#fff;
  font-size:11.5px;font-weight:700;padding:4px 9px;border-radius:7px;}
.kmVCard .bd{padding:12px 4px 0;display:flex;flex-direction:column;gap:4px;flex:1;}
.kmVCard .ct{font-size:11.5px;color:var(--km-muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* 제목 2줄 고정 높이 — 1줄/2줄 혼재로 카드 높이가 들쭉날쭉해 그리드에 빈칸 생기는 것 방지 */
.kmVCard .nm{font-size:14.5px;font-weight:700;color:var(--km-ink);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  min-height:calc(1.45em * 2);}
/* 가격/메타 한 줄 고정(넘치면 생략) — 줄바꿈으로 인한 높이 변동 방지 */
.kmVCard .pr{display:flex;align-items:center;gap:8px;margin-top:auto;flex-wrap:nowrap;white-space:nowrap;overflow:hidden;}
.kmVCard .pr .pp{margin-left:auto;}
.kmVCard .pr b{font-size:15px;font-weight:800;color:var(--km-ink);}
.kmVCard .pr b.fr{color:var(--km-success);} .kmVCard .pr b.rf{color:#00489c;font-size:13.5px;}
.kmVCard .pr .sb,.kmVCard .pr .pp{font-size:11.5px;color:var(--km-muted);}
.kmVCard .pr .st{font-size:12px;font-weight:700;color:#f59e0b;}
/* ── 탭 ── */
.kmVTabs{display:flex;justify-content:center;gap:8px;margin-bottom:24px;flex-wrap:wrap;}
.kmVTabs button{border:1px solid var(--km-line);background:#fff;border-radius:999px;padding:9px 20px;
  font-size:14px;font-weight:700;color:var(--km-ink-soft);cursor:pointer;font-family:inherit;transition:.13s;}
.kmVTabs button.on{background:var(--km-ink);border-color:var(--km-ink);color:#fff;}
.kmVMoreWrap{text-align:center;margin-top:26px;}
.kmVMore{display:inline-block;background:var(--km-primary);color:#fff;font-weight:700;font-size:14px;
  padding:13px 34px;border-radius:999px;text-decoration:none;}
.kmVMore:hover{background:var(--km-primary-dark);}
.kmVMore.ghost{background:#fff;color:var(--km-ink-soft);border:1px solid var(--km-line);}
.kmVMore.ghost:hover{border-color:var(--km-primary);color:var(--km-primary);}
/* ── 피처드 ── */
.kmVFeat{display:grid;grid-template-columns:1.35fr 1fr .72fr;gap:26px;align-items:center;background:#fff;
  border:1px solid var(--km-line);border-radius:22px;padding:26px;box-shadow:var(--km-shadow);}
.kmVFeatTh{position:relative;display:block;aspect-ratio:16/10;border-radius:16px;overflow:hidden;background-size:cover;background-position:center;text-decoration:none;}
.kmVFeatTh.typo{display:flex;align-items:center;padding:26px;}
.kmVFeatTh.typo .tt{font-size:25px;line-height:1.4;font-weight:900;letter-spacing:-.5px;}
.kmVFeatTh .play.big{width:54px;height:54px;right:auto;left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%);}
.kmVFeatBd .tg{display:flex;gap:6px;margin-bottom:10px;}
.kmVFeatBd .tg span{font-size:11.5px;font-weight:700;padding:4px 11px;border-radius:999px;}
.kmVFeatBd .t1{background:#eaf2ff;color:var(--km-primary-dark);}
.kmVFeatBd .t2{background:#f1f5f0;color:#3f6212;}
.kmVFeatBd h3{margin:0 0 14px;font-size:20px;line-height:1.45;font-weight:800;letter-spacing:-.4px;}
.kmVFeatBd h3 a{color:var(--km-ink);text-decoration:none;}
.kmVFeatBd .pts{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:7px;}
.kmVFeatBd .pts li{position:relative;padding-left:16px;font-size:13.5px;color:var(--km-ink-soft);}
.kmVFeatBd .pts li::before{content:"";position:absolute;left:0;top:7px;width:7px;height:7px;border-radius:2px;background:var(--km-primary);}
.kmVFeatBd .go{display:inline-block;font-size:13.5px;font-weight:800;color:var(--km-primary);text-decoration:none;}
.kmVFeatSide{display:flex;flex-direction:column;gap:10px;border-left:1px dashed var(--km-line);padding-left:22px;}
.kmVFeatSide a{display:flex;align-items:center;gap:11px;text-decoration:none;}
.kmVFeatSide .mth{flex:none;width:74px;aspect-ratio:16/10;border-radius:9px;background-size:cover;background-position:center;
  display:flex;align-items:center;justify-content:center;font-size:13px;}
.kmVFeatSide .mnm{font-size:12.5px;line-height:1.45;color:var(--km-ink-soft);font-weight:600;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.kmVFeatSide a:hover .mnm{color:var(--km-primary);}
/* ── 후기 ── */
.kmVRevRow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.kmVRev{background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:20px;box-shadow:var(--km-shadow);display:flex;flex-direction:column;}
.kmVRev .av{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;margin-bottom:12px;}
.kmVRev .tx{margin:0 0 14px;font-size:13px;line-height:1.75;color:var(--km-ink-soft);flex:1;}
.kmVRev .who{display:flex;flex-direction:column;gap:2px;border-top:1px dashed var(--km-line);padding-top:10px;}
.kmVRev .who b{font-size:13px;color:var(--km-ink);} .kmVRev .who span{font-size:11.5px;color:var(--km-muted);}
/* ── 가이드 스트립 ── */
.kmVGuide{display:flex;align-items:center;justify-content:center;gap:14px;background:linear-gradient(120deg,#fef9e7,#fdf0d5);
  border-radius:16px;padding:20px;text-decoration:none;}
.kmVGuide .bk{font-size:22px;}
.kmVGuide b{font-size:16px;color:#713f12;font-weight:800;}
.kmVGuide .ar{font-size:13px;color:#a16207;font-weight:700;}
.kmVGuide:hover .ar{text-decoration:underline;}
/* ── 소식 카드 ── */
.kmVNews{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.kmVNews a{display:flex;flex-direction:column;gap:9px;background:#fff;border:1px solid var(--km-line);border-radius:16px;
  padding:22px;text-decoration:none;box-shadow:var(--km-shadow);transition:transform .14s ease;}
.kmVNews a:hover{transform:translateY(-3px);}
.kmVNews .bd2{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;color:var(--km-primary);}
.kmVNews .bd2 .kmIco{width:14px;height:14px;}
.kmVNews b{font-size:15px;color:var(--km-ink);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.kmVNews p{margin:0;font-size:12.5px;color:var(--km-ink-soft);line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.kmVNews .dt{font-size:11.5px;color:var(--km-muted);}
/* ── 반응형 ── */
@media (max-width:1100px){
  .kmVGrid{grid-template-columns:repeat(3,1fr);}
  .kmVFeat{grid-template-columns:1fr 1fr;}
  .kmVFeatSide{display:none;}
  .kmVRevRow{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:860px){
  .kmVSlide{grid-template-columns:1fr;padding:28px 24px 40px;}
  .kmVSlide .vis{display:none;}
  .kmVSlide h1{font-size:24px;}
  .kmVStats{grid-template-columns:repeat(2,1fr);gap:12px 6px;}
  .kmVQuickRow{grid-template-columns:1fr;}
  .kmVQuick{flex-direction:column;align-items:stretch;gap:16px;}
  .kmVLinks{grid-template-columns:repeat(2,1fr);}
  .kmVGrid{grid-template-columns:repeat(2,1fr);column-gap:14px;row-gap:24px;}
  .kmVFeat{grid-template-columns:1fr;padding:18px;}
  .kmVNews{grid-template-columns:1fr;}
}
@media (max-width:480px){
  .kmVGrid{grid-template-columns:1fr;}
  .kmVLinks{grid-template-columns:1fr;}
  .kmVRevRow{grid-template-columns:1fr;}
  .kmVTitle{font-size:20px;}
}

/* ============================================================
   kmV 디테일 강화 — 배경 무늬 · 아이콘 디테일 · 사진 프레임 · 호버
   ============================================================ */
/* ── 배경 무늬: 은은한 도트 그리드(soft 섹션) + 히어로 글로우 ── */
body.kmHome .kmSection.soft{
  background-image:radial-gradient(rgba(37,99,235,.07) 1.2px, transparent 1.2px);
  background-size:22px 22px;
  background-color:var(--km-bg-soft);}
.kmVHero{position:relative;}
.kmVHero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(420px 260px at 12% 0%, rgba(37,99,235,.10), transparent 70%),
    radial-gradient(360px 240px at 92% 18%, rgba(14,165,183,.10), transparent 70%),
    radial-gradient(rgba(37,99,235,.05) 1.2px, transparent 1.2px);
  background-size:auto,auto,26px 26px;}
.kmVHero .kmWrap{position:relative;}
.kmVSlide{position:relative;}
.kmVSlide::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:24px;
  background-image:radial-gradient(rgba(255,255,255,.16) 1px, transparent 1px);background-size:18px 18px;opacity:.4;}
.kmVSlide.s-blue::after{background-image:radial-gradient(rgba(37,99,235,.10) 1px, transparent 1px);}
.kmVSlide > *{position:relative;z-index:1;}
/* 검색 스트립에도 살짝 */
.kmKFind{background-image:radial-gradient(rgba(37,99,235,.06) 1.2px, transparent 1.2px);background-size:20px 20px;background-color:var(--km-bg-soft);}
/* ── 히어로 사진 프레임(배너 사진) ── */
.kmVSlide .vis.photo{position:relative;}
.kmVSlide .vis.photo img{width:100%;max-width:430px;max-height:265px;object-fit:cover;border-radius:18px;
  box-shadow:0 20px 44px rgba(0,0,0,.28), 0 0 0 6px rgba(255,255,255,.14);}
.kmVSlide .vis.photo::after{content:"▶";position:absolute;width:56px;height:56px;border-radius:50%;
  background:rgba(255,255,255,.95);color:#062b57;display:flex;align-items:center;justify-content:center;
  font-size:18px;padding-left:5px;box-shadow:0 8px 24px rgba(0,0,0,.3);left:50%;top:50%;transform:translate(-50%,-50%);}
.kmVSlide.s-blue .vis img{filter:drop-shadow(0 16px 30px rgba(37,99,235,.25));}
/* ── 정제 톤온톤(브랜드 네이비) — 캔디 4색 제거 ── */
.kmVQuick .qi .ic{background:#f4f7fb;border:1px solid #e7edf5;color:var(--km-primary);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);}
.kmVQuick .qi a:nth-child(n) .ic{background:#f4f7fb;color:var(--km-primary);border-color:#e7edf5;}
.kmVQuick .qi a:hover .ic{background:var(--km-primary);color:#fff;border-color:var(--km-primary);
  transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,72,156,.22);}
.kmVQuick .qi .ic .kmIco{stroke-width:1.7;}
.kmVQuick .qi a:hover{color:var(--km-primary);}
.kmVLinks i .kmIco{width:34px;height:34px;stroke-width:1.6;}
.kmVCs a .kmIco{width:18px;height:18px;}
/* ── 섹션 타이틀 장식 ── */
.kmVTitle{position:relative;}
.kmVTitle::before{content:"";display:block;width:34px;height:5px;border-radius:99px;margin:0 auto 12px;
  background:linear-gradient(90deg,var(--km-primary),#7dd3fc);}
/* ── 카드 사진/호버 디테일 ── */
.kmVCard .th{box-shadow:0 6px 18px rgba(20,40,80,.10), inset 0 0 0 1px rgba(0,0,0,.04);}
.kmVCard .th::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.22));opacity:0;transition:.18s;}
.kmVCard .th.typo::before{display:none;}
.kmVCard:hover .th::before{opacity:1;}
.kmVCard .play{transition:.18s;}
.kmVCard:hover .play{transform:scale(1.14);box-shadow:0 6px 18px rgba(0,0,0,.3);}
.kmVCard:hover .nm{color:var(--km-primary);}
.kmVFeatTh{box-shadow:0 10px 28px rgba(20,40,80,.14);}
.kmVFeatTh .play.big{transition:.18s;}
.kmVFeatTh:hover .play.big{transform:translate(-50%,-50%) scale(1.1);}
/* 후기 아바타 링 */
.kmVRev .av{box-shadow:0 0 0 3px #fff, 0 0 0 5px rgba(37,99,235,.18);}
/* 소식 카드 상단 라인 */
.kmVNews a{position:relative;overflow:hidden;}
.kmVNews a::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg,var(--km-primary),#7dd3fc);opacity:0;transition:.15s;}
.kmVNews a:hover::before{opacity:1;}
/* 가이드 스트립 무늬 */
.kmVGuide{position:relative;overflow:hidden;}
.kmVGuide::after{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;
  background:rgba(255,255,255,.45);}

/* ============================================================
   kmN* — 구독형(스트리밍) 메인 히어로 + 혜택/고객센터 (홈 전용)
   ============================================================ */
.kmNHero{position:relative;min-height:520px;display:flex;align-items:center;overflow:hidden;background:#0a0c12;}
.kmNSlides{position:absolute;inset:0;}
.kmNSlide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;background-size:cover;background-position:center;background-image:var(--bg);}
.kmNSlide.on{opacity:1;}
.kmNHero::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(8,10,16,.92) 0%,rgba(8,10,16,.78) 42%,rgba(8,10,16,.30) 78%,rgba(8,10,16,.55) 100%),
            linear-gradient(0deg,rgba(8,10,16,.85),transparent 45%);}
.kmNHeroIn{position:relative;z-index:2;padding:60px 0;max-width:680px;}
.kmNHeroIn .badge{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:800;letter-spacing:.3px;
  color:#dbe7ff;background:rgba(37,99,235,.22);border:1px solid rgba(120,160,255,.35);padding:7px 14px;border-radius:999px;margin-bottom:18px;}
.kmNHeroIn .badge .kmIco{width:15px;height:15px;}
.kmNHeroIn h1{margin:0 0 14px;font-size:42px;line-height:1.28;font-weight:900;letter-spacing:-1px;color:#fff;
  text-shadow:0 4px 20px rgba(0,0,0,.4);}
.kmNHeroIn h1 b{color:#7fb0ff;} .kmNHeroIn h1 .hl,.kmNHeroIn h1 .em{color:#7fb0ff;}
.kmNHeroIn p{margin:0 0 24px;font-size:16px;line-height:1.6;color:#c9cedb;text-shadow:0 2px 12px rgba(0,0,0,.4);}
.kmNSearch{display:flex;gap:8px;background:rgba(255,255,255,.10);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:9px;max-width:620px;flex-wrap:wrap;}
.kmNSearch select,.kmNSearch input{height:46px;border:0;border-radius:9px;padding:0 14px;font-size:14px;font-family:inherit;background:rgba(255,255,255,.92);color:#1b2433;}
.kmNSearch select{flex:0 0 130px;} .kmNSearch input{flex:1;min-width:160px;}
.kmNSearch button{height:46px;padding:0 22px;border:0;border-radius:9px;background:var(--km-primary);color:#fff;font-weight:800;font-size:14px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-family:inherit;}
.kmNSearch button .kmIco{width:16px;height:16px;}
.kmNSearch button:hover{background:var(--km-primary-dark);}
.kmNGo{display:inline-block;margin-top:18px;color:#fff;font-weight:700;font-size:14px;text-decoration:none;border-bottom:2px solid rgba(255,255,255,.4);padding-bottom:3px;}
.kmNGo:hover{border-color:#fff;}
.kmNDots{display:flex;gap:8px;margin-top:24px;}
.kmNDots button{width:9px;height:9px;border-radius:999px;border:0;background:rgba(255,255,255,.35);cursor:pointer;padding:0;transition:.15s;}
.kmNDots button.on{width:26px;background:#fff;}
/* 혜택 스트립 */
.kmNPerks{background:#12151c;}
.kmNPerks .kmWrap{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:22px 0;}
.kmNPerks .it{display:flex;align-items:center;gap:13px;padding:6px 14px;border-left:1px solid rgba(255,255,255,.08);}
.kmNPerks .it:first-child{border-left:0;}
.kmNPerks .ic{width:44px;height:44px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,rgba(37,99,235,.25),rgba(37,99,235,.10));color:#9cc1ff;}
.kmNPerks .ic .kmIco{width:22px;height:22px;}
.kmNPerks b{display:block;font-size:15px;color:#fff;font-weight:800;}
.kmNPerks .vlwrap b{display:inline;} .kmNPerks .vlwrap .suf{font-size:13px;color:#fff;font-weight:700;}
.kmNPerks .it span:not(.ic):not(.suf):not(.vlwrap){font-size:12px;color:#9aa2b2;}
.kmNPerks .it > div{display:flex;flex-direction:column;gap:2px;}
/* 퀵링크 3종 */
.kmVLinks.n3{grid-template-columns:repeat(3,1fr);}
/* 후기 별점 */
.kmVRev .stars{color:#f5a623;font-size:14px;letter-spacing:1px;margin-bottom:8px;}
/* 고객센터 안내 */
.kmVHelp{display:grid;grid-template-columns:1.1fr 1fr;gap:0;border:1px solid var(--km-line);border-radius:20px;overflow:hidden;box-shadow:var(--km-shadow);}
.kmVHelp .hl{display:flex;gap:18px;align-items:center;padding:34px 36px;background:linear-gradient(135deg,#062b57,#00489c);color:#fff;}
.kmVHelp .hl .ic{width:60px;height:60px;border-radius:16px;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.14);}
.kmVHelp .hl .ic .kmIco{width:30px;height:30px;}
.kmVHelp .hl .ov{margin:0 0 5px;font-size:11px;font-weight:800;letter-spacing:2px;color:#9cc1ff;}
.kmVHelp .hl h2{margin:0 0 8px;font-size:21px;font-weight:800;}
.kmVHelp .hl .ds{margin:0;font-size:13px;line-height:1.7;color:rgba(255,255,255,.78);}
.kmVHelp .hr{padding:30px 36px;display:flex;flex-direction:column;gap:12px;justify-content:center;background:#fff;}
.kmVHelp .hr .tel{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--km-ink-soft);}
.kmVHelp .hr .tel .kmIco{width:20px;height:20px;color:var(--km-primary);}
.kmVHelp .hr .tel b{font-size:27px;font-weight:900;color:var(--km-ink);letter-spacing:-.5px;}
.kmVHelp .hr .hours{font-size:12.5px;color:var(--km-muted);line-height:1.6;}
.kmVHelp .hr .ch{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px;}
.kmVHelp .hr .ch a{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--km-ink-soft);
  border:1px solid var(--km-line);border-radius:999px;padding:8px 14px;text-decoration:none;transition:.13s;}
.kmVHelp .hr .ch a .kmIco{width:15px;height:15px;color:var(--km-primary);}
.kmVHelp .hr .ch a:hover{border-color:var(--km-primary);color:var(--km-primary);}
/* ── 반응형 ── */
@media (max-width:1000px){
  .kmNPerks .kmWrap{grid-template-columns:repeat(2,1fr);gap:14px 8px;}
  .kmNPerks .it:nth-child(3){border-left:0;}
  .kmVHelp{grid-template-columns:1fr;}
}
@media (max-width:860px){
  .kmNHero{min-height:auto;}
  .kmNHeroIn{padding:44px 0;max-width:none;}
  .kmNHeroIn h1{font-size:30px;}
  .kmNSearch{max-width:none;}
  .kmVLinks.n3{grid-template-columns:1fr;}
  .kmVGrid{column-gap:16px;row-gap:22px;}
}
@media (max-width:480px){
  .kmNPerks .kmWrap{grid-template-columns:1fr;}
  .kmNPerks .it{border-left:0;}
  .kmNHeroIn h1{font-size:25px;}
  .kmVHelp .hl,.kmVHelp .hr{padding:24px;}
}

/* ── 영상 카드 별점(분류 줄 우측, 만족도 실데이터 기준) ── */
.kmVCard .ct{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.kmVCard .ct .cl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmVCard .ct .rt{flex:none;color:#f5a623;font-size:11px;letter-spacing:-1px;display:inline-flex;align-items:center;gap:3px;}
.kmVCard .ct .rt b{font-size:11.5px;font-weight:800;color:var(--km-ink-soft);letter-spacing:0;}
.kmVFeatBd .tg .t3{background:#fff7e6;color:#b45309;font-weight:800;}

/* ── 교육담당자(B2B) 패널 — 환급 절차 아래 ── */
.kmVBiz{margin-top:22px;display:grid;grid-template-columns:1.3fr 1fr;gap:20px;align-items:center;
  background:linear-gradient(120deg,#062b57,#00489c);border-radius:20px;padding:30px 36px;box-shadow:0 14px 36px rgba(22,35,74,.25);}
.kmVBiz .ov{margin:0 0 6px;font-size:11px;font-weight:800;letter-spacing:2px;color:#9cc1ff;}
.kmVBiz h3{margin:0 0 10px;font-size:22px;font-weight:800;color:#fff;letter-spacing:-.4px;}
.kmVBiz .ds{margin:0;font-size:13.5px;line-height:1.75;color:rgba(255,255,255,.78);}
.kmVBiz .br{display:flex;flex-direction:column;gap:9px;}
.kmVBiz .br a{display:flex;align-items:center;gap:9px;justify-content:center;font-size:14px;font-weight:700;
  border-radius:11px;padding:13px 18px;text-decoration:none;transition:.13s;}
.kmVBiz .br a .kmIco{width:17px;height:17px;}
.kmVBiz .br .b1{background:#fff;color:#062b57;}
.kmVBiz .br .b1:hover{background:var(--km-primary);color:#fff;}
.kmVBiz .br .b2{border:1px solid rgba(255,255,255,.35);color:#fff;}
.kmVBiz .br .b2:hover{border-color:#fff;background:rgba(255,255,255,.08);}
@media (max-width:860px){ .kmVBiz{grid-template-columns:1fr;padding:24px;} }

/* ── finecyber 적용: 카드 훈련등급/환급 뱃지 + 강사 ── */
.kmVCard .th .badges{position:absolute;left:10px;top:10px;display:flex;gap:5px;}
.kmVCard .th .badges .gr{background:rgba(16,17,20,.82);color:#fff;font-size:10.5px;font-weight:800;padding:4px 8px;border-radius:6px;}
.kmVCard .th .badges .rfb{background:var(--km-primary);color:#fff;font-size:10.5px;font-weight:800;padding:4px 8px;border-radius:6px;}
.kmVCard .pr .prof{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--km-ink-soft);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmVCard .pr .prof .kmIco{width:13px;height:13px;color:var(--km-muted);flex:none;}
/* ── 협력·인증 기관 스트립 ── */
.kmVOrgs{text-align:center;}
.kmVOrgs .ov{display:block;font-size:12px;font-weight:700;letter-spacing:.5px;color:var(--km-muted);margin-bottom:14px;}
.kmVOrgs .logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 14px;}
.kmVOrgs .logos span{font-size:15px;font-weight:800;color:var(--km-ink-soft);letter-spacing:-.3px;
  padding:10px 20px;border:1px solid var(--km-line);border-radius:10px;background:#fff;opacity:.85;}
@media (max-width:640px){ .kmVOrgs .logos span{font-size:13px;padding:8px 14px;} }

/* ── 로고 이미지(파일 있을 때) ── */
.kmLogo.hasimg{padding:0;}
.kmLogo.hasimg img{height:38px;width:auto;display:block;}
@media (max-width:600px){ .kmLogo.hasimg img{height:32px;} }

/* ── 퀵링크 아이콘 색(개별 톤) + 4열 ── */
.kmVLinks.n4{grid-template-columns:repeat(4,1fr);}
.kmVLinks a i{color:var(--qi,rgba(0,0,0,.18));opacity:.9;}
/* ── 바로가기 서비스 배너(비상식) ── */
.kmVServ{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.kmVServ a{display:flex;align-items:center;justify-content:space-between;gap:14px;border-radius:18px;padding:24px 26px;
  text-decoration:none;overflow:hidden;position:relative;transition:transform .15s ease,box-shadow .15s ease;color:#fff;}
.kmVServ a:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(20,40,80,.16);}
.kmVServ .s1{background:linear-gradient(120deg,#00489c,#2f7fd6);}
.kmVServ .s2{background:linear-gradient(120deg,#00489c,#22b3a3);}
.kmVServ .s3{background:linear-gradient(120deg,#7c3aed,#a78bfa);}
.kmVServ .tx b{display:block;font-size:17px;font-weight:800;margin-bottom:5px;letter-spacing:-.3px;}
.kmVServ .tx span{font-size:12.5px;opacity:.86;line-height:1.5;}
.kmVServ .ic{flex:none;width:52px;height:52px;border-radius:14px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;}
.kmVServ .ic .kmIco{width:26px;height:26px;}
@media (max-width:860px){ .kmVServ{grid-template-columns:1fr;} .kmVLinks.n4{grid-template-columns:repeat(2,1fr);} }
@media (max-width:480px){ .kmVLinks.n4{grid-template-columns:1fr;} }

/* ============================================================
   kmB* — 풀폭 배너(단일 슬라이드 크로스페이드, 좌우 peek 없음)
   ============================================================ */
.kmBHero.full{padding:0;overflow:hidden;}
.kmBFull{position:relative;height:380px;}
.kmBSlide{position:absolute;inset:0;display:flex;align-items:center;text-decoration:none;opacity:0;
  background:#062b57;background-image:var(--bg);background-size:cover;background-position:center;
  transition:opacity .8s ease;pointer-events:none;}
.kmBSlide.on{opacity:1;pointer-events:auto;}
.kmBSlide::after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(4,16,38,.88) 0%,rgba(4,16,38,.66) 42%,rgba(4,16,38,.18) 78%,rgba(4,16,38,.40) 100%);}
.kmBSlide .kmWrap{position:relative;z-index:2;width:100%;}
.kmBSlide .tx{max-width:620px;}
.kmBSlide .kk{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;letter-spacing:.3px;
  color:#cfe0ff;background:rgba(47,127,214,.28);border:1px solid rgba(120,160,255,.4);padding:6px 13px;border-radius:999px;margin-bottom:16px;}
.kmBSlide .kk .kmIco{width:14px;height:14px;}
.kmBSlide .tx h2{margin:0 0 14px;font-size:38px;line-height:1.3;font-weight:900;letter-spacing:-1px;color:#fff;text-shadow:0 3px 18px rgba(0,0,0,.4);}
.kmBSlide .tx h2 b{color:#7fb6ff;}
.kmBSlide .tx p{margin:0 0 22px;font-size:16px;line-height:1.6;color:#d7e1f2;}
.kmBSlide .tx .go{display:inline-block;background:#fff;color:#00386f;font-weight:800;font-size:14.5px;padding:13px 24px;border-radius:10px;}
.kmBSlide:hover .tx .go{background:var(--km-accent);color:#fff;}
.kmBArrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:48px;height:48px;border-radius:50%;
  border:0;background:rgba(255,255,255,.18);backdrop-filter:blur(4px);color:#fff;font-size:26px;line-height:1;
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;}
.kmBArrow.prev{left:24px;} .kmBArrow.next{right:24px;}
.kmBArrow:hover{background:rgba(255,255,255,.32);}
.kmBDots{position:absolute;left:0;right:0;bottom:20px;z-index:5;display:flex;justify-content:center;gap:8px;}
.kmBDots button{width:9px;height:9px;border-radius:999px;border:0;background:rgba(255,255,255,.4);cursor:pointer;padding:0;transition:.15s;}
.kmBDots button.on{width:26px;background:#fff;}
@media (max-width:860px){
  .kmBFull{height:300px;}
  .kmBSlide .tx h2{font-size:25px;}
  .kmBSlide .tx p{font-size:13.5px;}
  .kmBArrow{display:none;}
}

/* GNB 좁은 폭: 검색창 숨겨 메뉴 한 줄 유지(통합검색은 모바일 메뉴/과정목록에서) */
@media (max-width:1100px) and (min-width:1025px){ .kmSearchTop{display:none;} /* GNB압축 */ }

/* ── 과정목록(archive.php) 환급 영상형 카드 ── */
.kmCourseGrid4 .kmCourseCard{display:flex;flex-direction:column;background:#fff;border:1px solid #eef1f5;border-radius:14px;overflow:hidden;
  box-shadow:0 1px 2px rgba(16,24,40,.03);transition:transform .15s ease,box-shadow .15s ease;}
.kmCourseGrid4 .kmCourseCard:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(16,24,40,.10);}
.kmCourseGrid4 .thumb{position:relative;aspect-ratio:16/10;background-size:cover;background-position:center;}
.kmCourseGrid4 .thumb .cbadges{position:absolute;left:10px;top:10px;display:flex;gap:5px;}
.kmCourseGrid4 .thumb .cbadges .gr{background:rgba(16,17,20,.82);color:#fff;font-size:10.5px;font-weight:800;padding:4px 8px;border-radius:6px;}
.kmCourseGrid4 .thumb .cbadges .rf{background:var(--km-primary);color:#fff;font-size:10.5px;font-weight:800;padding:4px 8px;border-radius:6px;}
.kmCourseGrid4 .thumb .play{position:absolute;right:12px;bottom:12px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.94);box-shadow:0 4px 12px rgba(0,0,0,.18);}
.kmCourseGrid4 .thumb .play::before{content:"";position:absolute;left:55%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent #1b2433;}
.kmCourseGrid4 .thumb .dur{position:absolute;left:12px;bottom:12px;background:rgba(16,17,20,.78);color:#fff;font-size:11px;font-weight:700;padding:4px 9px;border-radius:7px;}
.kmCourseGrid4 .body{padding:13px 14px 15px;display:flex;flex-direction:column;gap:5px;flex:1;}
.kmCourseGrid4 .ctop{font-size:11.5px;color:var(--km-muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.kmCourseGrid4 .cName{font-size:14.5px;font-weight:700;color:var(--km-ink);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:calc(1.45em * 2);}
.kmCourseGrid4 .meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--km-muted);}
.kmCourseGrid4 .meta .prof{display:inline-flex;align-items:center;gap:4px;color:var(--km-ink-soft);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmCourseGrid4 .meta .prof .kmIco{width:13px;height:13px;color:var(--km-muted);flex:none;}
.kmCourseGrid4 .meta span:last-child{margin-left:auto;flex:none;}
.kmCourseGrid4 .cspec{font-size:11.5px;color:var(--km-primary);font-weight:600;}

/* ============================================================
   디지털 아카이브 — 과정목록 카드 / 차시 담기 / 내 강의실 세로카드 / 담기 모달
   ============================================================ */
:root{ --km-arc:#00489c; --km-arc-dark:#00386f; --km-arc-soft:#e3edf9; }

/* 과정목록 카드 */
.kmArcGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin:6px 0 30px;}
.kmArcCard{background:#fff;border:1px solid var(--km-line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:.15s;}
.kmArcCard:hover{box-shadow:var(--km-shadow);transform:translateY(-3px);}
.kmArcCard .th{position:relative;display:block;aspect-ratio:16/10;background:#dfe7f5 center/cover no-repeat;}
.kmArcCard .th .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:rgba(15,23,42,.55);backdrop-filter:blur(2px);transition:.15s;}
.kmArcCard .th .play::after{content:"";position:absolute;left:53%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent #fff;}
.kmArcCard:hover .th .play{background:var(--km-arc);}
.kmArcCard .cbadges{position:absolute;top:10px;left:10px;display:flex;gap:5px;}
.kmArcCard .cbadges span{font-size:11px;font-weight:800;color:#fff;border-radius:6px;padding:3px 8px;letter-spacing:.02em;}
.kmArcCard .cbadges .new{background:var(--km-badge-new,#f97316);}
.kmArcCard .cbadges .hot{background:#e11d48;}
.kmArcCard .th .free{position:absolute;top:10px;right:10px;font-size:11px;font-weight:800;border-radius:6px;padding:3px 8px;color:#fff;}
.kmArcCard .th .free.on{background:var(--km-arc);}
.kmArcCard .th .free.paid{background:#475569;}
.kmArcCard .th .dur{position:absolute;right:10px;bottom:10px;background:rgba(15,23,42,.78);color:#fff;font-size:11.5px;font-weight:700;border-radius:6px;padding:3px 8px;}
.kmArcCard .body{padding:14px 14px 16px;display:flex;flex-direction:column;gap:9px;flex:1;}
.kmArcCard .ctop{display:flex;align-items:center;gap:8px;font-size:12px;}
.kmArcCard .ctop .cat{background:var(--km-arc-soft);color:var(--km-arc-dark);font-weight:700;border-radius:6px;padding:2px 8px;}
.kmArcCard .ctop .ses{color:var(--km-muted);}
.kmArcCard .cName{font-size:15px;font-weight:700;line-height:1.45;color:inherit;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:calc(1.45em * 2);}
.kmArcCard .cName:hover{color:var(--km-arc-dark);}
.kmArcCard .rate{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--km-muted);}
.kmArcCard .rate .stars{color:#f5a623;letter-spacing:-1px;font-size:13px;}
.kmArcCard .rate .stars.off{color:#d4d9e2;}
.kmArcCard .rate b{color:var(--km-ink);font-weight:800;}
.kmArcCard .rate .rc{color:var(--km-muted);}
.kmArcCard .rate .enr{margin-left:auto;display:inline-flex;align-items:center;gap:3px;}
.kmArcCard .rate .enr .kmIco{width:13px;height:13px;}
.kmArcCard .acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px;}
.kmArcCard .acts .km-btn{font-size:13px;padding:9px 0;border-radius:9px;text-align:center;}
.kmArcCard .acts .km-btn-primary{background:var(--km-arc);border-color:var(--km-arc);}
.kmArcCard .acts .km-btn-primary:hover{background:var(--km-arc-dark);border-color:var(--km-arc-dark);}

/* 과정상세 — 차시 담기 테이블 */
.kmChapHead{margin:6px 0 10px;}
.kmChapGuide{font-size:13px;color:var(--km-ink-soft);margin:6px 0 0;}
.kmChapToolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--km-arc-soft);border:1px solid #cfe7e3;border-radius:12px;padding:11px 14px;margin-bottom:10px;}
.kmChapToolbar .all{font-size:13.5px;font-weight:700;display:inline-flex;align-items:center;gap:7px;cursor:pointer;}
.kmChapToolbar .cnt{font-size:12.5px;color:var(--km-arc-dark);font-weight:700;}
.kmChapToolbar .acts{margin-left:auto;display:flex;gap:8px;}
.kmChapToolbar .acts .km-btn{font-size:13px;padding:8px 14px;border-radius:9px;}
.kmChapToolbar .acts .km-btn-primary{background:var(--km-arc);border-color:var(--km-arc);}
.kmChapTable{border:1px solid var(--km-line);border-radius:12px;overflow:hidden;}
.kmChapTr{display:grid;grid-template-columns:88px 1fr 96px 70px;align-items:center;gap:10px;padding:12px 14px;border-top:1px solid var(--km-line);font-size:14px;cursor:pointer;margin:0;}
.kmChapTr:first-child{border-top:none;}
.kmChapTr.head{background:#f5f8fc;font-size:12.5px;font-weight:700;color:var(--km-ink-soft);cursor:default;}
.kmChapTr:not(.head):hover{background:#f7fbfa;}
.kmChapTr.has{background:var(--km-arc-soft);}
.kmChapTr .c1{font-weight:700;color:var(--km-arc-dark);}
.kmChapTr .c2{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmChapTr .c3{color:var(--km-muted);font-size:13px;}
.kmChapTr .c4{text-align:center;}
.kmChapTr .c4 .done{font-style:normal;font-size:12px;font-weight:800;color:var(--km-arc);background:#fff;border:1px solid var(--km-arc);border-radius:6px;padding:2px 8px;}
.kmChapTr input[type=checkbox]{width:18px;height:18px;accent-color:var(--km-arc);cursor:pointer;}
.kmChapFoot{min-height:24px;margin-top:12px;font-size:13.5px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.kmChapFoot .ok,.kmBsktFoot .ok{color:var(--km-arc-dark);font-weight:700;}
.kmChapFoot .warn,.kmBsktFoot .warn{color:#dc2626;font-weight:700;}
.km-btn.sm{padding:6px 12px;font-size:12.5px;border-radius:8px;}

/* 내 강의실 — 세로 카드 */
.kmArcMyGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:18px;}
.kmArcMyCard{background:#fff;border:1px solid var(--km-line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:.15s;}
.kmArcMyCard:hover{box-shadow:var(--km-shadow);transform:translateY(-3px);}
.kmArcMyCard .th{position:relative;display:block;aspect-ratio:16/9;background:#dfe7f5 center/cover no-repeat;}
.kmArcMyCard .th .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:rgba(15,23,42,.5);}
.kmArcMyCard .th .play::after{content:"";position:absolute;left:53%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent #fff;}
.kmArcMyCard:hover .th .play{background:var(--km-arc);}
.kmArcMyCard .dday{position:absolute;top:10px;right:10px;background:var(--km-primary);color:#fff;font-size:12px;font-weight:800;border-radius:8px;padding:4px 10px;letter-spacing:.02em;}
.kmArcMyCard .dday.end{background:#94a3b8;}
.kmArcMyCard .bd{padding:14px 15px 16px;display:flex;flex-direction:column;gap:9px;flex:1;}
.kmArcMyCard .badge2{align-self:flex-start;font-size:11px;font-weight:800;border-radius:6px;padding:3px 9px;}
.kmArcMyCard .badge2.ing{background:var(--km-primary-light);color:var(--km-primary-dark);}
.kmArcMyCard .badge2.done{background:#e7f5ec;color:var(--km-success,#16a34a);}
.kmArcMyCard .badge2.soon{background:#fff1e6;color:var(--km-badge-new,#f97316);}
.kmArcMyCard .badge2.fail{background:#f1f5f9;color:var(--km-muted);}
.kmArcMyCard .nm2{font-size:15.5px;font-weight:700;line-height:1.4;color:inherit;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:calc(1.4em * 2);}
.kmArcMyCard .nm2:hover{color:var(--km-arc-dark);}
.kmArcMyCard .meta2{font-size:12.5px;color:var(--km-muted);display:flex;flex-direction:column;gap:4px;}
.kmArcMyCard .meta2 span{display:inline-flex;align-items:center;gap:5px;}
.kmArcMyCard .meta2 .kmIco{width:14px;height:14px;flex:none;}
.kmArcMyCard .meta2 b{color:var(--km-arc-dark);}
.kmArcMyCard .prog .top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:5px;}
.kmArcMyCard .prog .top .l{font-size:12px;color:var(--km-ink-soft);}
.kmArcMyCard .prog .top .pc{font-size:16px;font-weight:800;color:var(--km-primary);}
.kmArcMyCard .acts{display:flex;gap:8px;margin-top:4px;}
.kmArcMyCard .acts .km-btn{flex:1;font-size:13px;padding:10px 0;border-radius:9px;text-align:center;display:inline-flex;align-items:center;justify-content:center;gap:5px;}
.kmArcMyCard .acts .km-btn .kmIco{width:15px;height:15px;}
.kmArcMyCard .acts .km-btn-primary{background:var(--km-arc);border-color:var(--km-arc);}
.kmArcMyCard .acts .km-btn-primary:hover{background:var(--km-arc-dark);border-color:var(--km-arc-dark);}

/* 차시 담기 모달 */
.kmBsktModal{position:fixed;inset:0;z-index:1200;display:none;}
.kmBsktModal.on{display:block;}
.kmBsktDim{position:absolute;inset:0;background:rgba(15,23,42,.55);}
.kmBsktBox{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(720px,92vw);max-height:88vh;overflow:auto;background:#fff;border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.3);padding:22px;}
.kmBsktX{position:absolute;top:14px;right:16px;background:none;border:none;font-size:26px;line-height:1;color:var(--km-muted);cursor:pointer;}
.kmBsktHead{display:flex;gap:16px;padding-right:28px;margin-bottom:16px;}
.kmBsktHead .th{width:120px;height:74px;border-radius:10px;flex:none;background:var(--km-arc-soft);}
.kmBsktHead .info{min-width:0;}
.kmBsktHead .tag{display:inline-block;font-size:11px;font-weight:800;color:var(--km-arc-dark);background:var(--km-arc-soft);border-radius:6px;padding:2px 8px;margin-bottom:6px;}
.kmBsktHead h3{font-size:18px;font-weight:800;margin:0 0 6px;line-height:1.35;}
.kmBsktHead .meta{font-size:12.5px;color:var(--km-muted);}
.kmBsktHead .desc{font-size:12.5px;color:var(--km-ink-soft);margin:8px 0 0;}
.kmBsktToolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--km-arc-soft);border-radius:12px;padding:10px 13px;margin-bottom:8px;}
.kmBsktToolbar .all{font-size:13.5px;font-weight:700;display:inline-flex;align-items:center;gap:7px;cursor:pointer;}
.kmBsktToolbar .all input{width:18px;height:18px;accent-color:var(--km-arc);}
.kmBsktToolbar .cnt{font-size:12.5px;color:var(--km-arc-dark);font-weight:700;}
.kmBsktToolbar .acts{margin-left:auto;display:flex;gap:8px;}
.kmBsktToolbar .acts .km-btn{font-size:13px;padding:8px 14px;border-radius:9px;}
.kmBsktToolbar .acts .km-btn-primary{background:var(--km-arc);border-color:var(--km-arc);}
.kmBsktListHead,.kmBsktRow{display:grid;grid-template-columns:80px 1fr 84px 64px;align-items:center;gap:8px;padding:11px 12px;font-size:14px;margin:0;}
.kmBsktListHead{background:#f5f8fc;border-radius:9px;font-size:12.5px;font-weight:700;color:var(--km-ink-soft);margin-bottom:2px;}
.kmBsktList{border:1px solid var(--km-line);border-radius:11px;overflow:hidden;}
.kmBsktRow{border-top:1px solid var(--km-line);cursor:pointer;}
.kmBsktRow:first-child{border-top:none;}
.kmBsktRow:hover{background:#f7fbfa;}
.kmBsktRow.has{background:var(--km-arc-soft);}
.kmBsktRow .c1{font-weight:700;color:var(--km-arc-dark);}
.kmBsktRow .c2{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmBsktRow .c3{color:var(--km-muted);font-size:13px;}
.kmBsktRow .c4{text-align:center;}
.kmBsktRow .c4 .done{font-style:normal;font-size:12px;font-weight:800;color:var(--km-arc);background:#fff;border:1px solid var(--km-arc);border-radius:6px;padding:2px 8px;}
.kmBsktRow input[type=checkbox]{width:18px;height:18px;accent-color:var(--km-arc);cursor:pointer;}
.kmBsktEmpty{padding:30px;text-align:center;color:var(--km-muted);}
.kmBsktFoot{min-height:22px;margin-top:12px;font-size:13.5px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

@media (max-width:1024px){
  .kmArcGrid{grid-template-columns:repeat(3,1fr);}
  .kmArcMyGrid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:768px){
  .kmArcGrid{grid-template-columns:repeat(2,1fr);gap:16px;}
  .kmArcMyGrid{grid-template-columns:1fr;}
  .kmChapToolbar .acts{margin-left:0;width:100%;}
  .kmChapToolbar .acts .km-btn{flex:1;}
  .kmChapTr{grid-template-columns:64px 1fr 56px;}
  .kmChapTr .c3{display:none;}
  .kmChapTr.head .c3{display:none;}
  .kmBsktHead .th{display:none;}
  .kmBsktToolbar .acts{margin-left:0;width:100%;}
  .kmBsktToolbar .acts .km-btn{flex:1;}
  .kmBsktListHead,.kmBsktRow{grid-template-columns:60px 1fr 56px;}
  .kmBsktListHead .c3,.kmBsktRow .c3{display:none;}
}
@media (max-width:480px){
  .kmArcGrid{grid-template-columns:1fr;}
  .kmArcCard .acts{grid-template-columns:1fr;}
}

/* 상단 유틸 바 — 회사 사업 사이트 전환(패밀리 사이트) + 로그인/고객센터 */
.kmTopBar{background:#f4f6fa;border-bottom:1px solid var(--km-line);font-size:13px;}
.kmTopBar .kmWrap{display:flex;align-items:stretch;justify-content:space-between;}
.kmFamily{display:flex;align-items:stretch;}
.kmFamily a{display:inline-flex;align-items:center;padding:9px 18px;color:var(--km-ink-soft);font-weight:700;text-decoration:none;border-right:1px solid var(--km-line);position:relative;transition:.12s;}
.kmFamily a:first-child{border-left:1px solid var(--km-line);}
.kmFamily a:hover{background:#fff;color:var(--km-primary-dark);}
.kmFamily a.on{background:var(--km-primary);color:#fff;border-color:var(--km-primary);}
.kmFamily a.on::after{content:"";position:absolute;left:50%;bottom:-1px;transform:translateX(-50%);width:0;height:0;border-style:solid;border-width:5px 5px 0 5px;border-color:var(--km-primary) transparent transparent transparent;}
.kmTopUtil{display:flex;align-items:center;gap:2px;}
.kmTopUtil .hi{color:var(--km-ink-soft);padding:0 12px;}
.kmTopUtil .hi b{color:var(--km-primary-dark);}
.kmTopUtil a{color:var(--km-ink-soft);text-decoration:none;padding:9px 12px;font-weight:600;}
.kmTopUtil a:hover{color:var(--km-primary-dark);text-decoration:underline;}
@media (max-width:768px){
  .kmFamily a{padding:8px 13px;font-size:12.5px;}
  .kmTopUtil{display:none;}
}
@media (max-width:480px){
  .kmFamily{width:100%;}
  .kmFamily a{flex:1;justify-content:center;padding:8px 6px;font-size:12px;}
}

/* 아카이브 내 강의실 — 연도 기수 패널(세로 카드형) + 담긴 차시 목록 */
.kmTermBox{margin-top:22px;border:1px solid var(--km-line);border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.05);}
.kmTermPanel{padding:20px 22px 18px;border-bottom:1px solid var(--km-line);background:linear-gradient(180deg,var(--km-arc-soft,#e3edf9),#fff);}
.kmTermPanel.done{background:linear-gradient(180deg,#e7f5ec,#fff);}
.kmTermPanel.end{background:linear-gradient(180deg,#f1f5f9,#fff);}
.kmTermPanel .hd{display:flex;align-items:center;gap:14px;}
.kmTermPanel .hd .cover{flex:none;position:relative;width:84px;height:58px;border-radius:11px;background:#dfe7f5 center/cover no-repeat;box-shadow:0 2px 6px rgba(15,23,42,.18);overflow:hidden;}
.kmTermPanel .hd .cover .yb{position:absolute;left:0;bottom:0;right:0;background:linear-gradient(180deg,rgba(0,72,156,0),rgba(0,56,111,.92));color:#fff;font-size:15px;font-weight:900;letter-spacing:-.01em;text-align:center;padding:9px 0 4px;}
.kmTermPanel.done .hd .cover .yb{background:linear-gradient(180deg,rgba(22,163,74,0),rgba(20,120,55,.92));}
.kmTermPanel.end .hd .cover .yb{background:linear-gradient(180deg,rgba(71,85,105,0),rgba(51,65,85,.92));}
.kmTermPanel .hd .tt{flex:1;min-width:0;}
.kmTermPanel .hd .tt h2{font-size:17px;font-weight:800;margin:0 0 4px;line-height:1.3;color:var(--km-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.kmTermPanel .hd .tt .pd{font-size:12.5px;color:var(--km-ink-soft);display:inline-flex;align-items:center;gap:5px;}
.kmTermPanel .hd .tt .pd .kmIco{width:14px;height:14px;}
.kmTermPanel .hd .st{flex:none;font-size:12px;font-weight:800;border-radius:999px;padding:6px 13px;}
.kmTermPanel .hd .st.ing{background:var(--km-arc,#00489c);color:#fff;}
.kmTermPanel .hd .st.done{background:var(--km-success,#16a34a);color:#fff;}
.kmTermPanel .hd .st.end{background:#e2e8f0;color:#475569;}
/* 수료기준 학습시간 — 포인트 */
.kmTermPanel .goal{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin:16px 0 10px;}
.kmTermPanel .goal .gtime{display:flex;align-items:baseline;gap:10px;min-width:0;}
.kmTermPanel .goal .gtime .cap{font-size:12.5px;font-weight:700;color:var(--km-ink-soft);display:inline-flex;align-items:center;gap:5px;}
.kmTermPanel .goal .gtime .cap .kmIco{width:15px;height:15px;color:var(--km-arc,#00489c);}
.kmTermPanel .goal .gtime .now{font-size:27px;font-weight:900;color:var(--km-arc,#00489c);line-height:1;letter-spacing:-.02em;}
.kmTermPanel.done .goal .gtime .now{color:var(--km-success,#16a34a);}
.kmTermPanel .goal .gtime .req{font-size:13px;font-weight:700;color:#fff;background:var(--km-arc,#00489c);border-radius:999px;padding:4px 11px;align-self:center;}
.kmTermPanel.done .goal .gtime .req{background:var(--km-success,#16a34a);}
.kmTermPanel.end .goal .gtime .req{background:#64748b;}
.kmTermPanel .goal .rem{font-size:13px;font-weight:700;color:var(--km-arc-dark,#00386f);background:#fff;border:1px solid var(--km-primary-light,#e3edf9);border-radius:10px;padding:8px 13px;display:inline-flex;align-items:center;gap:6px;}
.kmTermPanel .goal .rem b{color:var(--km-arc,#00489c);}
.kmTermPanel .goal .rem .kmIco{width:15px;height:15px;}
.kmTermPanel .goal .rem.done{color:#fff;background:var(--km-success,#16a34a);border-color:var(--km-success,#16a34a);}
.kmTermPanel .goal .rem.end{color:#64748b;background:#f1f5f9;border-color:#e2e8f0;}
.kmTermPanel .kmProg.lg{position:relative;height:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--km-line);border-radius:999px;}
.kmTermPanel .kmProg.lg span{background:linear-gradient(90deg,var(--km-accent,#2f7fd6),var(--km-arc,#00489c));transition:width .5s ease;}
.kmTermPanel.done .kmProg.lg span{background:var(--km-success,#16a34a);}
.kmTermPanel .kmProg.lg .pct{position:absolute;top:50%;right:9px;transform:translateY(-50%);font-size:10.5px;font-weight:800;font-style:normal;color:var(--km-ink-soft);}
.kmTermPanel .ft{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px;}
.kmTermPanel .ft .m{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--km-ink-soft);background:#fff;border:1px solid var(--km-line);border-radius:9px;padding:7px 12px;}
.kmTermPanel .ft .m .kmIco{width:14px;height:14px;color:var(--km-arc,#00489c);}
.kmTermPanel .ft .m b{color:var(--km-ink);font-weight:800;}
.kmTermPanel .ft .m em{font-style:normal;color:var(--km-muted);}

.kmTermList{padding:6px 8px 8px;}
.kmTermList .hd{display:grid;grid-template-columns:74px 1fr 150px 96px 96px;gap:10px;padding:11px 14px;font-size:12px;font-weight:700;color:var(--km-muted);}
.kmTermList .cgroup{display:flex;align-items:center;gap:13px;padding:13px 14px 11px;border-top:1px solid var(--km-line);margin-top:2px;}
.kmTermList .cgroup .cth{flex:none;width:108px;height:68px;border-radius:10px;background:#dfe7f5 center/cover no-repeat;box-shadow:0 2px 6px rgba(15,23,42,.14);}
.kmTermList .cgroup .cmeta{flex:1;min-width:0;}
.kmTermList .cgroup .cnm{font-size:15px;font-weight:800;color:var(--km-ink);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmTermList .cgroup .cnm .cn{font-size:12px;font-weight:600;color:var(--km-muted);}
.kmTermList .cgroup .cds{margin:4px 0 0;font-size:12.5px;color:var(--km-ink-soft);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.kmTermList .cgroup .go{flex:none;align-self:center;font-size:12.5px;font-weight:700;color:var(--km-arc,#00489c);text-decoration:none;white-space:nowrap;}
.kmTermList .cgroup .go{margin-left:auto;font-size:12.5px;font-weight:700;color:var(--km-arc,#00489c);text-decoration:none;}
.kmTermList .cgroup .go:hover{text-decoration:underline;}
.kmTermList .row{display:grid;grid-template-columns:74px 1fr 150px 96px 96px;gap:10px;align-items:center;padding:9px 14px;font-size:13.5px;border-radius:9px;}
.kmTermList .row:hover{background:#f7fbfa;}
.kmTermList .row.done .c2{color:var(--km-muted);}
.kmTermList .row .c1{font-weight:700;color:var(--km-arc-dark,#00386f);}
.kmTermList .row .c2{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmTermList .row .c3{display:flex;align-items:center;gap:7px;}
.kmTermList .row .c3 b{font-size:12px;color:var(--km-ink-soft);min-width:30px;}
.kmTermList .row .c4{font-size:12.5px;color:var(--km-muted);}
.kmTermList .kmProg.sm{height:6px;flex:1;}
.kmTermList .row .c5 .dis{font-size:12px;color:var(--km-muted);}
.km-btn.km-btn-primary.sm{background:var(--km-arc,#00489c);border-color:var(--km-arc,#00489c);padding:6px 12px;font-size:12.5px;border-radius:8px;}
.km-btn.km-btn-primary.sm:hover{background:var(--km-arc-dark,#00386f);}
.kmTermFoot{display:flex;gap:10px;justify-content:flex-end;padding:14px 18px;border-top:1px solid var(--km-line);background:#fafbfc;}
.kmTermFoot .km-btn{padding:9px 18px;border-radius:9px;font-size:13.5px;}
.kmTermFoot .km-btn-primary{background:var(--km-arc,#00489c);border-color:var(--km-arc,#00489c);}

/* 관리자 기수 개강 폼 */
.kmTermNew{border:1px solid var(--km-line);border-radius:12px;padding:12px 16px;background:#fafbfc;}
.kmTermNew>summary{cursor:pointer;font-weight:700;color:var(--km-primary-dark);list-style:none;}
.kmTermNew>summary::-webkit-details-marker{display:none;}

@media (max-width:900px){
  .kmTermPanel .hd .tt h2{white-space:normal;}
  .kmTermPanel .hd .st{align-self:flex-start;}
  .kmTermList .hd{display:none;}
  .kmTermList .row{grid-template-columns:58px 1fr 70px;gap:8px;}
  .kmTermList .row .c3,.kmTermList .row .c4{display:none;}
  .kmTermList .cgroup{flex-wrap:wrap;}
  .kmTermList .cgroup .go{font-size:12px;margin-left:0;}
}
@media (max-width:520px){
  .kmTermPanel .hd{flex-wrap:wrap;}
  .kmTermPanel .hd .tt{flex:1 1 calc(100% - 76px);}
  .kmTermPanel .hd .st{order:3;}
}

/* ============================================================
   디지털 아카이브 메인 — "지식 스트리밍 라이브러리" 컨셉(사업주 사이트와 구분)
   ============================================================ */
/* 검색 히어로(네이비) */
.kmAHero{position:relative;overflow:hidden;background:linear-gradient(120deg,#00386f 0%,#00489c 55%,#0a57b8 100%);color:#fff;}
.kmAHero .dots{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.13) 1.3px,transparent 1.3px);background-size:22px 22px;mask-image:linear-gradient(90deg,transparent,#000 30%,#000 100%);pointer-events:none;}
.kmAHero .kmWrap{position:relative;display:grid;grid-template-columns:1.55fr .9fr;gap:32px;align-items:center;padding:54px 0 50px;}
.kmAHero .lead .kk{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;letter-spacing:.04em;color:#bcd4f5;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:6px 14px;}
.kmAHero .lead .kk .kmIco{width:15px;height:15px;}
.kmAHero .lead h1{font-size:38px;line-height:1.22;font-weight:800;margin:16px 0 12px;letter-spacing:-.02em;}
.kmAHero .lead h1 b{font-weight:900;color:#fff;background:linear-gradient(transparent 62%, rgba(95,170,255,.45) 62%);}
.kmAHero .lead>p{font-size:15.5px;color:#dbe6f6;margin:0 0 22px;line-height:1.6;}
.kmAHero .lead>p .hl{color:#fff;background:rgba(255,255,255,.16);border-radius:6px;padding:1px 8px;font-weight:700;}
.kmASearch{display:flex;align-items:center;gap:10px;background:#fff;border-radius:14px;padding:8px 8px 8px 16px;max-width:560px;box-shadow:0 14px 34px rgba(0,20,60,.3);}
.kmASearch .kmIco{width:20px;height:20px;color:#00489c;flex:none;}
.kmASearch input{flex:1;border:none;outline:none;font-size:15px;color:#13203a;background:none;min-width:0;}
.kmASearch button{flex:none;background:#00489c;color:#fff;border:none;border-radius:10px;padding:12px 22px;font-size:15px;font-weight:800;cursor:pointer;transition:.15s;}
.kmASearch button:hover{background:#00386f;}
.kmAKw{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:16px;}
.kmAKw .lb{font-size:12.5px;color:#aac4ec;font-weight:700;margin-right:2px;}
.kmAKw a{font-size:13px;color:#eaf1fb;text-decoration:none;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:6px 13px;transition:.15s;}
.kmAKw a:hover{background:#fff;color:#00489c;border-color:#fff;}
.kmAHero .stat{display:grid;grid-template-columns:1fr;gap:12px;}
.kmAHero .stat .si{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:16px 18px;display:flex;align-items:baseline;gap:10px;}
.kmAHero .stat .si b{font-size:28px;font-weight:900;letter-spacing:-.02em;color:#fff;}
.kmAHero .stat .si b.kmCount{color:#fff;}
.kmAHero .stat .si span{font-size:13px;color:#cdddf3;}

/* 스포트라이트 */
.kmASpotWrap{background:linear-gradient(180deg,#0a57b8,#f4f7fb 62%);padding:0 0 6px;}
.kmASpot{position:relative;border-radius:20px;overflow:hidden;min-height:300px;display:flex;align-items:flex-end;margin-top:-18px;box-shadow:0 18px 44px rgba(0,20,60,.22);background:#16223c var(--bg) center/cover no-repeat;}
.kmASpot .ov{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,18,40,.92) 0%,rgba(8,18,40,.74) 42%,rgba(8,18,40,.18) 100%);}
.kmASpot .in{position:relative;padding:34px 38px;color:#fff;max-width:660px;}
.kmASpot .tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;background:#00489c;border-radius:999px;padding:5px 13px;}
.kmASpot h2{font-size:28px;font-weight:900;line-height:1.25;margin:13px 0 12px;letter-spacing:-.02em;}
.kmASpot .meta{display:flex;flex-wrap:wrap;gap:8px 14px;font-size:13.5px;color:#d6e2f4;margin-bottom:20px;align-items:center;}
.kmASpot .meta .st{color:#ffd34d;font-weight:700;}
.kmASpot .meta .pz{background:rgba(255,255,255,.16);border-radius:6px;padding:2px 9px;font-weight:700;}
.kmASpot .cta{display:flex;gap:10px;flex-wrap:wrap;}
.kmASpot .cta .km-btn{padding:12px 22px;border-radius:11px;font-size:14.5px;}
.kmASpot .cta .ghostw{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.4);color:#fff;}
.kmASpot .cta .ghostw:hover{background:rgba(255,255,255,.22);}

/* 가로 레일(셸프) */
.kmARailSec{padding:26px 0 6px;}
.kmARailHd{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.kmARailHd h2{font-size:20px;font-weight:800;display:inline-flex;align-items:center;gap:9px;margin:0;letter-spacing:-.01em;}
.kmARailHd h2 .kmIco{width:21px;height:21px;color:#00489c;}
.kmARailHd .nav{display:flex;align-items:center;gap:8px;}
.kmARailHd .more{font-size:13px;font-weight:700;color:#00489c;text-decoration:none;margin-right:4px;}
.kmARailHd .more:hover{text-decoration:underline;}
.kmARailHd .arw{width:34px;height:34px;border-radius:50%;border:1px solid var(--km-line);background:#fff;color:#33405c;font-size:19px;line-height:1;cursor:pointer;transition:.15s;}
.kmARailHd .arw:hover{background:#00489c;color:#fff;border-color:#00489c;}
.kmARailTrack{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x proximity;scroll-behavior:smooth;padding:4px 2px 16px;-ms-overflow-style:none;scrollbar-width:none;}
.kmARailTrack::-webkit-scrollbar{display:none;}
.kmACard{flex:0 0 246px;scroll-snap-align:start;background:#fff;border:1px solid var(--km-line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:.15s;}
.kmACard:hover{box-shadow:0 12px 26px rgba(15,23,42,.12);transform:translateY(-3px);}
.kmACard .th{position:relative;display:block;aspect-ratio:16/9;background:#dfe7f5 center/cover no-repeat;}
.kmACard .th .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:42px;height:42px;border-radius:50%;background:rgba(8,18,40,.5);transition:.15s;}
.kmACard .th .play::after{content:"";position:absolute;left:53%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent #fff;}
.kmACard:hover .th .play{background:#00489c;}
.kmACard .th .badge{position:absolute;top:9px;left:9px;font-size:11px;font-weight:800;color:#fff;border-radius:6px;padding:3px 8px;}
.kmACard .th .badge.free{background:#00489c;}
.kmACard .th .badge.paid{background:#475569;}
.kmACard .th .dur{position:absolute;right:9px;bottom:9px;background:rgba(8,18,40,.8);color:#fff;font-size:11px;font-weight:700;border-radius:6px;padding:2px 7px;}
.kmACard .bd{padding:12px 13px 13px;display:flex;flex-direction:column;gap:7px;flex:1;}
.kmACard .bd .cat{font-size:11.5px;color:var(--km-muted);font-weight:600;}
.kmACard .bd .nm{font-size:14.5px;font-weight:700;line-height:1.4;color:inherit;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:calc(1.4em * 2);}
.kmACard .bd .nm:hover{color:#00489c;}
.kmACard .bd .ft{display:flex;align-items:center;justify-content:space-between;margin-top:auto;}
.kmACard .bd .ft .rt{font-size:12.5px;color:var(--km-ink-soft);font-weight:700;}
.kmACard .bd .ft .rt .s{color:#f5a623;font-weight:400;letter-spacing:-1px;}
.kmACard .bd .ft .rt .muted{color:var(--km-muted);font-weight:500;}
.kmACard .bd .ft .add{display:inline-flex;align-items:center;gap:3px;font-size:12.5px;font-weight:800;color:#00489c;background:var(--km-primary-light,#e3edf9);border:none;border-radius:8px;padding:6px 11px;cursor:pointer;transition:.15s;}
.kmACard .bd .ft .add:hover{background:#00489c;color:#fff;}
.kmACard .bd .ft .add .kmIco{width:13px;height:13px;}

/* 이용 방법 3스텝 */
.kmASteps{padding:38px 0 22px;}
.kmASteps .hd{text-align:center;margin-bottom:26px;}
.kmASteps .hd h2{font-size:23px;font-weight:800;margin:0 0 7px;}
.kmASteps .hd p{font-size:14px;color:var(--km-ink-soft);margin:0;}
.kmASteps .row{display:flex;align-items:stretch;justify-content:center;gap:8px;}
.kmASteps .step{flex:1;max-width:300px;background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:24px 22px;text-align:center;position:relative;}
.kmASteps .step .no{position:absolute;top:14px;right:16px;font-size:13px;font-weight:900;color:var(--km-primary-light,#e3edf9);}
.kmASteps .step .ic{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:15px;background:var(--km-primary-light,#e3edf9);color:#00489c;margin-bottom:13px;}
.kmASteps .step .ic .kmIco{width:26px;height:26px;}
.kmASteps .step b{display:block;font-size:16px;font-weight:800;margin-bottom:6px;}
.kmASteps .step p{font-size:13px;color:var(--km-ink-soft);margin:0;line-height:1.55;}
.kmASteps .ar{display:flex;align-items:center;color:#c2cee0;}
.kmASteps .ar .kmIco{width:24px;height:24px;}

/* 소식 + 고객센터 밴드 */
.kmABand{padding:14px 0 46px;}
.kmABand .kmWrap{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;}
.kmABand .news{background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:8px 20px 12px;}
.kmABand .news .bh{display:flex;align-items:center;justify-content:space-between;padding:12px 0 8px;border-bottom:1px solid var(--km-line);}
.kmABand .news .bh b{font-size:15px;display:inline-flex;align-items:center;gap:7px;}
.kmABand .news .bh b .kmIco{width:17px;height:17px;color:#00489c;}
.kmABand .news .bh a{font-size:12.5px;color:var(--km-muted);text-decoration:none;}
.kmABand .news .ni{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 2px;border-bottom:1px solid #f1f4f8;text-decoration:none;color:var(--km-ink);}
.kmABand .news .ni:last-child{border-bottom:none;}
.kmABand .news .ni:hover .t{color:#00489c;}
.kmABand .news .ni .t{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmABand .news .ni .d{font-size:12px;color:var(--km-muted);flex:none;}
.kmABand .help{background:linear-gradient(135deg,#00489c,#00386f);color:#fff;border-radius:16px;padding:24px;display:flex;flex-direction:column;align-items:flex-start;gap:12px;justify-content:center;}
.kmABand .help .ic{display:inline-flex;width:46px;height:46px;border-radius:13px;background:rgba(255,255,255,.16);align-items:center;justify-content:center;}
.kmABand .help .ic .kmIco{width:24px;height:24px;}
.kmABand .help b{font-size:17px;font-weight:800;}
.kmABand .help p{font-size:13px;color:#d3e0f3;margin:2px 0 6px;}
.kmABand .help .km-btn{background:#fff;color:#00489c;border-color:#fff;font-weight:800;}
.kmABand .help .km-btn:hover{background:#eaf1fb;}

@media (max-width:980px){
  .kmAHero .kmWrap{grid-template-columns:1fr;gap:22px;padding:40px 0 36px;}
  .kmAHero .lead h1{font-size:30px;}
  .kmAHero .stat{grid-template-columns:repeat(3,1fr);}
  .kmAHero .stat .si{flex-direction:column;gap:2px;align-items:flex-start;}
  .kmAHero .stat .si b{font-size:22px;}
  .kmABand .kmWrap{grid-template-columns:1fr;}
}
@media (max-width:720px){
  .kmAHero .lead h1{font-size:25px;}
  .kmASearch{flex-wrap:wrap;}
  .kmASpot .in{padding:24px;}
  .kmASpot h2{font-size:22px;}
  .kmASteps .row{flex-direction:column;align-items:center;}
  .kmASteps .ar{transform:rotate(90deg);}
  .kmACard{flex-basis:200px;}
}

/* 관리자 — 큐레이션 과정 선택 */
.kmCurPick{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px;}
.kmCurPick .it{display:flex;align-items:center;gap:9px;border:1px solid var(--km-line);border-radius:10px;padding:9px 11px;cursor:pointer;background:#fff;transition:.12s;}
.kmCurPick .it.on{border-color:var(--km-primary);background:var(--km-primary-light,#e3edf9);}
.kmCurPick .it input[type=checkbox]{width:17px;height:17px;accent-color:var(--km-primary);flex:none;}
.kmCurPick .it .nm{flex:1;min-width:0;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmCurPick .it .nm em{font-style:normal;color:var(--km-muted);font-weight:500;font-size:11.5px;}
.kmCurPick .it .ord{width:52px;flex:none;border:1px solid var(--km-line);border-radius:7px;padding:5px 7px;font-size:12.5px;text-align:center;}

/* 디지털 아카이브 — 큐레이션(운영자 추천 컬렉션) */
.kmCurSec{padding:34px 0 10px;}
.kmCurIntro{text-align:center;margin-bottom:20px;}
.kmCurIntro .ek{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;letter-spacing:.08em;color:#00489c;background:var(--km-primary-light,#e3edf9);border-radius:999px;padding:5px 14px;}
.kmCurIntro .ek .kmIco{width:14px;height:14px;}
.kmCurIntro h2{font-size:25px;font-weight:900;margin:12px 0 6px;letter-spacing:-.02em;}
.kmCurIntro p{font-size:14px;color:var(--km-ink-soft);margin:0;}
.kmCurBlock{margin-top:30px;padding-left:2px;}
.kmCurBlock:first-of-type{margin-top:0;}
/* 에디터 큐레이션 헤더(매거진 스타일 — 인덱스 번호 + 좌측 컬러 바) */
.kmCurHd{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px;}
.kmCurHd .tx{display:flex;align-items:flex-start;gap:14px;min-width:0;}
.kmCurHd .tx .ix{flex:none;font-size:30px;font-weight:900;line-height:1;color:var(--km-primary-light,#e3edf9);letter-spacing:-.03em;-webkit-text-stroke:1px #c9d8ee;}
.kmCurBlock.lead .kmCurHd .tx .ix{color:#00489c;-webkit-text-stroke:0;}
.kmCurHd .tt{min-width:0;border-left:3px solid var(--km-primary,#00489c);padding-left:13px;}
.kmCurHd .badge{display:inline-block;font-size:11px;font-weight:800;color:#00489c;background:var(--km-primary-light,#e3edf9);border-radius:6px;padding:3px 9px;margin-bottom:7px;letter-spacing:.02em;}
.kmCurHd .tt h2{font-size:21px;font-weight:900;margin:0;letter-spacing:-.02em;line-height:1.25;}
.kmCurBlock.lead .kmCurHd .tt h2{font-size:24px;}
.kmCurHd .tt p{font-size:13.5px;color:var(--km-ink-soft);margin:6px 0 0;line-height:1.5;}
.kmCurHd .nav{display:flex;align-items:center;gap:8px;flex:none;}
.kmCurHd .nav .cn{font-size:12px;color:var(--km-muted);font-weight:600;margin-right:2px;}
.kmCurHd .nav .arw{width:34px;height:34px;border-radius:50%;border:1px solid var(--km-line);background:#fff;color:#33405c;font-size:19px;line-height:1;cursor:pointer;transition:.15s;}
.kmCurHd .nav .arw:hover{background:#00489c;color:#fff;border-color:#00489c;}

@media (max-width:720px){
  .kmCurHd{flex-direction:column;gap:10px;}
  .kmCurHd .tx .ix{font-size:24px;}
  .kmCurBlock.lead .kmCurHd .tt h2,.kmCurHd .tt h2{font-size:19px;}
}

/* ============================================================
   역량 진단 — 좌측 스텝퍼 위저드 + 세그먼트 척도(브랜드 네이비)
   ============================================================ */
.kmDxWrap{padding:34px 0 60px;background:#eef2f8;min-height:62vh;}
.kmDxHead{margin-bottom:22px;}
.kmDxHead .ek{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;letter-spacing:.08em;color:#00489c;background:#fff;border:1px solid var(--km-primary-light,#e3edf9);border-radius:999px;padding:5px 13px;}
.kmDxHead .ek .kmIco{width:14px;height:14px;}
.kmDxHead h1{font-size:27px;font-weight:900;margin:12px 0 6px;letter-spacing:-.02em;color:var(--km-ink);}
.kmDxHead p{font-size:14.5px;color:var(--km-ink-soft);margin:0;}
.kmDxGrid{display:grid;grid-template-columns:280px 1fr;gap:20px;align-items:start;}
/* 좌측 스텝퍼 */
.kmDxSteps{position:sticky;top:84px;background:#0e2c54;border-radius:18px;padding:18px 16px;color:#fff;}
.kmDxSteps .prog{margin-bottom:14px;}
.kmDxSteps .prog .t{font-size:12.5px;color:#a9c4e6;}
.kmDxSteps .prog .t b{color:#fff;font-size:15px;font-weight:900;}
.kmDxSteps .prog .track{display:block;height:7px;background:rgba(255,255,255,.16);border-radius:999px;overflow:hidden;margin-top:7px;}
.kmDxSteps .prog .track span{display:block;height:100%;width:0;background:linear-gradient(90deg,#5fa0ff,#fff);transition:width .35s;}
.kmDxSteps ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}
.kmDxSteps li{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:12px;cursor:pointer;transition:.15s;}
.kmDxSteps li:hover{background:rgba(255,255,255,.07);}
.kmDxSteps li.on{background:rgba(255,255,255,.14);}
.kmDxSteps li .no{flex:none;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;}
.kmDxSteps li.on .no{background:#fff;color:#0e2c54;}
.kmDxSteps li.done .no{background:#22c55e;color:#fff;}
.kmDxSteps li .tx{min-width:0;flex:1;}
.kmDxSteps li .tx b{display:block;font-size:14px;font-weight:700;}
.kmDxSteps li .tx span{display:block;font-size:11.5px;color:#a9c4e6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmDxSteps li .ck{flex:none;opacity:0;color:#22c55e;}
.kmDxSteps li .ck .kmIco{width:18px;height:18px;}
.kmDxSteps li.done .ck{opacity:1;}
/* 우측 문항 */
.kmDxMain{min-width:0;}
.kmDxPane{display:none;background:#fff;border:1px solid var(--km-line);border-radius:18px;padding:8px 24px 18px;}
.kmDxPane.on{display:block;animation:dxIn .25s ease;}
@keyframes dxIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.kmDxPane .ph{padding:18px 0 10px;border-bottom:1px solid var(--km-line);margin-bottom:6px;}
.kmDxPane .ph .step{font-size:12px;font-weight:800;color:#00489c;}
.kmDxPane .ph h2{font-size:20px;font-weight:800;margin:6px 0 4px;}
.kmDxPane .ph p{font-size:13px;color:var(--km-muted);margin:0;}
.kmDxPane .dxq{padding:17px 0;border-bottom:1px dashed var(--km-line);}
.kmDxPane .dxq:last-of-type{border-bottom:none;}
.kmDxPane .dxq .qt{font-size:15px;font-weight:600;margin-bottom:12px;display:flex;align-items:baseline;gap:8px;}
.kmDxPane .dxq .qt .qn{flex:none;font-size:12px;font-weight:800;color:#fff;background:#00489c;border-radius:6px;padding:2px 8px;}
/* 세그먼트 척도 */
.kmDxPane .seg{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;}
.kmDxPane .seg label{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid var(--km-line);border-radius:10px;padding:11px 6px;font-size:13px;font-weight:600;color:var(--km-ink-soft);cursor:pointer;transition:.12s;}
.kmDxPane .seg label:hover{border-color:#9db4e8;background:#f6f9ff;}
.kmDxPane .seg input{position:absolute;opacity:0;pointer-events:none;}
.kmDxPane .seg label:has(input:checked){border-color:#00489c;background:#00489c;color:#fff;font-weight:800;box-shadow:0 4px 12px rgba(0,72,156,.28);}
.kmDxNav{display:flex;justify-content:space-between;gap:10px;margin-top:20px;}
.kmDxNav .km-btn{padding:12px 24px;border-radius:11px;font-size:14.5px;}
.kmDxNav .km-btn-primary{background:#00489c;border-color:#00489c;margin-left:auto;}

/* 결과 */
.kmDxResHead{text-align:center;margin-bottom:24px;}
.kmDxResHead .bk{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;color:#0a7a43;background:#e7f5ec;border-radius:999px;padding:6px 14px;}
.kmDxResHead .bk .kmIco{width:15px;height:15px;}
.kmDxResHead h1{font-size:26px;font-weight:900;margin:12px 0 7px;letter-spacing:-.02em;}
.kmDxResHead p{font-size:14.5px;color:var(--km-ink-soft);margin:0;}
.kmDxResHead p b{color:#00489c;}
.kmDxResGrid{display:grid;grid-template-columns:.85fr 1.15fr;gap:20px;align-items:start;}
.kmDxScores,.kmDxReco{background:#fff;border:1px solid var(--km-line);border-radius:18px;padding:22px 24px;}
.kmDxScores h2,.kmDxReco h2{font-size:16px;font-weight:800;margin:0 0 16px;display:flex;align-items:center;gap:7px;}
.kmDxReco h2 .kmIco{width:18px;height:18px;color:#00489c;}
.kmDxScores .row{display:flex;align-items:center;gap:12px;padding:11px 0;}
.kmDxScores .row .lab{flex:none;width:128px;display:flex;flex-direction:column;gap:3px;}
.kmDxScores .row .lab .nm{font-size:13.5px;font-weight:700;}
.kmDxScores .row .lab .tag{align-self:flex-start;font-size:10px;font-weight:800;color:#dc2626;background:#fde7e7;border-radius:5px;padding:1px 6px;}
.kmDxScores .row .bar{flex:1;height:11px;background:#eef2f7;border-radius:999px;overflow:hidden;}
.kmDxScores .row .bar span{display:block;height:100%;background:linear-gradient(90deg,#2f7fd6,#00489c);border-radius:999px;}
.kmDxScores .row.low .bar span{background:linear-gradient(90deg,#f87171,#dc2626);}
.kmDxScores .row .pc{flex:none;width:46px;text-align:right;font-size:16px;font-weight:900;color:var(--km-ink);}
.kmDxScores .row .pc i{font-size:11px;font-style:normal;font-weight:700;}
.kmDxScores .hint{font-size:12px;color:var(--km-muted);margin:14px 0 0;}
.kmACardRow{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:14px;}
.kmACardRow .kmACard{flex:none;}
.kmDxReco .empty{font-size:13.5px;color:var(--km-muted);padding:20px 0;}
.kmDxReco .acts{display:flex;gap:10px;justify-content:flex-end;margin-top:18px;}
.kmDxReco .acts .km-btn{padding:11px 20px;border-radius:11px;font-size:13.5px;}
.kmDxReco .acts .km-btn-primary{background:#00489c;border-color:#00489c;}

@media (max-width:880px){
  .kmDxGrid{grid-template-columns:1fr;}
  .kmDxSteps{position:static;}
  .kmDxSteps ol{flex-direction:row;flex-wrap:wrap;}
  .kmDxSteps li{flex:1 1 calc(50% - 6px);}
  .kmDxSteps li .tx span{display:none;}
  .kmDxResGrid{grid-template-columns:1fr;}
  .kmDxPane .seg{grid-template-columns:repeat(5,1fr);gap:4px;}
  .kmDxPane .seg label{padding:9px 2px;font-size:11.5px;}
}

/* 관리자 — 과정 역량 태깅 선택 */
.cmCompPick{display:flex;flex-wrap:wrap;gap:7px;}
.cmCompPick label{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--km-line);border-radius:999px;padding:6px 13px;font-size:13px;cursor:pointer;background:#fff;transition:.12s;}
.cmCompPick label.on{border-color:var(--km-primary);background:var(--km-primary-light,#e3edf9);color:var(--km-primary-dark);font-weight:700;}
.cmCompPick label input{accent-color:var(--km-primary);width:15px;height:15px;}

/* 학습 여정 4단계 + 진단 CTA */
.kmJourney{padding:38px 0 30px;}
.kmJourney .jhd{text-align:center;margin-bottom:24px;}
.kmJourney .jhd .ek{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;letter-spacing:.06em;color:#00489c;background:var(--km-primary-light,#e3edf9);border-radius:999px;padding:5px 14px;}
.kmJourney .jhd .ek .kmIco{width:14px;height:14px;}
.kmJourney .jhd h2{font-size:24px;font-weight:900;margin:12px 0 6px;letter-spacing:-.02em;}
.kmJourney .jhd p{font-size:14px;color:var(--km-ink-soft);margin:0;}
.kmJourney .jsteps{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;margin-bottom:22px;}
.kmJourney .jstep{flex:0 0 168px;display:flex;flex-direction:column;align-items:center;text-align:center;text-decoration:none;color:inherit;padding:8px;border-radius:16px;transition:.15s;}
.kmJourney .jstep:hover{transform:translateY(-3px);}
.kmJourney .jstep .cir{display:flex;align-items:center;justify-content:center;width:104px;height:104px;border-radius:50%;background:#fff;border:1px solid var(--km-line);box-shadow:0 8px 20px rgba(15,23,42,.08);margin-bottom:12px;color:#00489c;transition:.15s;}
.kmJourney .jstep .cir .kmIco{width:38px;height:38px;}
.kmJourney .jstep.hot .cir{background:linear-gradient(135deg,#3b5bd9,#6a5ae0);border-color:transparent;color:#fff;}
.kmJourney .jstep:hover .cir{box-shadow:0 12px 26px rgba(0,72,156,.22);}
.kmJourney .jstep b{font-size:15px;font-weight:800;}
.kmJourney .jstep .t{font-size:13px;color:var(--km-ink-soft);margin-top:2px;}
.kmJourney .jstep.hot b,.kmJourney .jstep.hot .t{color:#3a2d7a;}
.kmJourney .jar{color:#c2cee0;flex:none;}
.kmJourney .jar .kmIco{width:22px;height:22px;}
.kmJourney .jcta{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;}
.kmJourney .jcta .km-btn{padding:13px 26px;border-radius:11px;font-size:15px;background:#00489c;border-color:#00489c;display:inline-flex;align-items:center;gap:7px;}
.kmJourney .jcta .km-btn .kmIco{width:17px;height:17px;}
.kmJourney .jcta .done{font-size:13px;font-weight:700;color:#0a7a43;display:inline-flex;align-items:center;gap:5px;}
.kmJourney .jcta .done .kmIco{width:15px;height:15px;}
/* 맞춤 추천 섹션 강조 */
.kmMyReco{background:linear-gradient(180deg,#eef3fb,#fff);border-radius:18px;padding:20px 22px 8px;margin-top:6px;}
.kmMyReco .kmARailHd h2 .kmIco{color:#6a5ae0;}

@media (max-width:760px){
  .kmJourney .jsteps{gap:2px;}
  .kmJourney .jstep{flex-basis:124px;}
  .kmJourney .jstep .cir{width:78px;height:78px;}
  .kmJourney .jstep .cir .kmIco{width:30px;height:30px;}
  .kmJourney .jar{display:none;}
}

/* ============================================================
   디지털 아카이브 메인 v2 — 지식 라이브러리 레이아웃(레퍼런스형)
   ============================================================ */
.kmArchiveHome{background:#f6f8fc;}
/* 히어로 */
.kmHHero{position:relative;background:radial-gradient(1200px 500px at 78% -10%, #1b50a8 0%, transparent 60%), linear-gradient(160deg,#0a1f44 0%,#0c2b63 52%,#0f3580 100%);color:#fff;padding:46px 0 64px;overflow:hidden;}
.kmHHero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.10) 1px,transparent 1px);background-size:26px 26px;mask-image:radial-gradient(900px 400px at 75% 10%, #000 30%, transparent 75%);pointer-events:none;}
.kmHHeroIn{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:center;}
.kmHHero .lead h1{font-size:42px;line-height:1.2;font-weight:900;letter-spacing:-.025em;margin:0 0 14px;}
.kmHHero .lead h1 b{color:#7fb0ff;font-weight:900;}
.kmHHero .lead>p{font-size:15.5px;color:#c9d8f2;line-height:1.6;margin:0 0 22px;}
.kmHSearch{display:flex;align-items:center;gap:8px;background:#fff;border-radius:14px;padding:7px 7px 7px 16px;max-width:520px;box-shadow:0 18px 40px rgba(0,16,50,.35);}
.kmHSearch>.kmIco{width:20px;height:20px;color:#0c2b63;flex:none;}
.kmHSearch input{flex:1;border:none;outline:none;font-size:15px;color:#13203a;min-width:0;}
.kmHSearch button{flex:none;width:46px;height:46px;border:none;border-radius:11px;background:#0c2b63;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;}
.kmHSearch button:hover{background:#0a1f44;}
.kmHSearch button .kmIco{width:20px;height:20px;}
.kmHTags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;}
.kmHTags a{font-size:13px;color:#d8e4f7;text-decoration:none;transition:.12s;}
.kmHTags a:hover{color:#fff;}
/* 아이콘 클러스터(글래스 타일) */
.kmHHero .art{position:relative;height:340px;}
.kmHHero .art .heroimg{position:relative;z-index:2;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 24px 50px rgba(0,12,40,.45));animation:hfloat 6s ease-in-out infinite;}
.kmHHero .art .orb{position:absolute;border-radius:50%;filter:blur(2px);opacity:.6;}
.kmHHero .art .o1{width:230px;height:230px;right:30px;top:30px;background:radial-gradient(circle,#3b82f6,transparent 70%);}
.kmHHero .art .o2{width:160px;height:160px;left:40px;bottom:10px;background:radial-gradient(circle,#22d3ee,transparent 70%);opacity:.35;}
.kmHHero .art .tile{position:absolute;display:flex;align-items:center;justify-content:center;border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(8px);box-shadow:0 14px 30px rgba(0,16,50,.3);color:#fff;font-weight:900;animation:hfloat 6s ease-in-out infinite;}
.kmHHero .art .tile .kmIco{width:46px;height:46px;}
.kmHHero .art .t1{width:118px;height:118px;right:130px;top:96px;animation-delay:0s;}
.kmHHero .art .t1 .kmIco{width:54px;height:54px;color:#bcd4ff;}
.kmHHero .art .t2{width:88px;height:88px;right:48px;top:40px;font-size:30px;color:#9be7ff;animation-delay:.8s;}
.kmHHero .art .t3{width:84px;height:84px;right:24px;top:170px;animation-delay:1.5s;}
.kmHHero .art .t4{width:80px;height:80px;right:150px;top:228px;animation-delay:1.1s;}
.kmHHero .art .t4 .kmIco{color:#ffd98a;}
.kmHHero .art .t5{width:74px;height:74px;right:250px;top:48px;animation-delay:2s;}
.kmHHero .art .t5 .kmIco{color:#9be7ff;}
.kmHHero .art .t6{width:64px;height:64px;right:300px;top:200px;animation-delay:.4s;}
.kmHHero .art .t6 .kmIco{width:30px;height:30px;color:#ffd98a;}
@keyframes hfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
/* 신뢰 스트립(오버랩) */
.kmHTrust{position:relative;margin-top:30px;margin-bottom:-94px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;background:#fff;border:1px solid var(--km-line);border-radius:18px;box-shadow:0 16px 40px rgba(10,31,68,.12);padding:18px 10px;}
.kmHTrust .it{display:flex;align-items:center;gap:13px;padding:8px 16px;}
.kmHTrust .it+.it{border-left:1px solid var(--km-line);}
.kmHTrust .it .ic{flex:none;width:44px;height:44px;border-radius:12px;background:var(--km-primary-light,#e3edf9);color:#00489c;display:flex;align-items:center;justify-content:center;}
.kmHTrust .it .ic .kmIco{width:23px;height:23px;}
.kmHTrust .it b{display:block;font-size:16px;font-weight:800;color:var(--km-ink);}
.kmHTrust .it span{display:block;font-size:12.5px;color:var(--km-muted);margin-top:1px;}

/* 레일 공통 */
.kmHRailSec{padding:30px 0 8px;}
.kmHRailSec:first-of-type{padding-top:122px;}  /* 신뢰스트립 오버랩 보정 */
.kmHRailHd{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.kmHRailHd h2{font-size:21px;font-weight:900;margin:0;letter-spacing:-.02em;display:flex;align-items:center;gap:8px;}
.kmHRailHd h2 .kmIco{width:20px;height:20px;color:#6a5ae0;}
.kmHRailHd .nav{display:flex;align-items:center;gap:8px;}
.kmHRailHd .more{font-size:13px;font-weight:700;color:var(--km-ink-soft);text-decoration:none;}
.kmHRailHd .more:hover{color:#00489c;}
.kmHRailHd .arw{width:32px;height:32px;border-radius:50%;border:1px solid var(--km-line);background:#fff;color:#33405c;font-size:17px;cursor:pointer;transition:.15s;}
.kmHRailHd .arw:hover{background:#00489c;color:#fff;border-color:#00489c;}
.kmHRail{display:flex;gap:18px;overflow-x:auto;scroll-behavior:smooth;padding:4px 2px 18px;-ms-overflow-style:none;scrollbar-width:none;}
.kmHRail::-webkit-scrollbar{display:none;}
/* 카드 */
.kmHCard{flex:0 0 232px;background:#fff;border:1px solid var(--km-line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:.16s;}
.kmHCard:hover{box-shadow:0 14px 30px rgba(15,23,42,.13);transform:translateY(-4px);}
.kmHCard .th{position:relative;display:block;aspect-ratio:16/10;background:#16223c center/cover no-repeat;}
.kmHCard .th::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,20,45,.05),rgba(10,20,45,.45));}
.kmHCard .th .rk{position:absolute;top:10px;left:10px;z-index:2;width:30px;height:30px;border-radius:50%;background:#fff;color:#00489c;font-size:15px;font-weight:900;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 8px rgba(0,0,0,.25);}
.kmHCard .th .nw{position:absolute;top:10px;left:10px;z-index:2;font-size:11px;font-weight:900;color:#fff;background:#e11d48;border-radius:6px;padding:3px 8px;letter-spacing:.03em;}
.kmHCard .th .cat{position:absolute;left:10px;bottom:10px;z-index:2;font-size:11px;font-weight:700;color:#0c2b63;background:rgba(255,255,255,.92);border-radius:6px;padding:3px 9px;}
.kmHCard .th .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;width:44px;height:44px;border-radius:50%;background:rgba(10,20,45,.5);transition:.15s;}
.kmHCard .th .play::after{content:"";position:absolute;left:53%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent #fff;}
.kmHCard:hover .th .play{background:#00489c;}
.kmHCard .bd{padding:13px 14px 14px;display:flex;flex-direction:column;gap:8px;flex:1;}
.kmHCard .bd .nm{font-size:14.5px;font-weight:700;line-height:1.4;color:inherit;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:calc(1.4em * 2);}
.kmHCard .bd .nm:hover{color:#00489c;}
.kmHCard .bd .rt{font-size:13px;color:var(--km-ink-soft);display:flex;align-items:center;gap:4px;}
.kmHCard .bd .rt .s{color:#f5a623;}
.kmHCard .bd .rt .s.off{color:#d4d9e2;}
.kmHCard .bd .rt b{font-weight:800;color:var(--km-ink);}
.kmHCard .bd .rt .cnt{color:var(--km-muted);}
.kmHCard .bd .mt{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;color:var(--km-muted);margin-top:auto;}
.kmHCard .bd .mt .lv{font-weight:700;color:#00489c;background:var(--km-primary-light,#e3edf9);border-radius:6px;padding:2px 9px;}

/* 직무별 찾기 */
.kmHJobs{padding:26px 0 6px;}
.kmHJobs .jobs{display:grid;grid-template-columns:repeat(9,1fr);gap:10px;}
.kmHJobs .job{display:flex;flex-direction:column;align-items:center;gap:9px;text-decoration:none;color:var(--km-ink-soft);background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:18px 6px;font-size:13px;font-weight:700;transition:.15s;}
.kmHJobs .job:hover,.kmHJobs .job.on{border-color:#00489c;color:#00489c;box-shadow:0 8px 20px rgba(0,72,156,.1);}
.kmHJobs .job .ic{width:30px;height:30px;display:flex;align-items:center;justify-content:center;}
.kmHJobs .job .ic .kmIco{width:26px;height:26px;}

/* 추천 학습 로드맵 */
.kmHRoad{padding:30px 0 8px;}
.kmHRoad .roads{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.kmHRoad .road{position:relative;overflow:hidden;display:block;text-decoration:none;color:var(--km-ink);background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:20px 18px 18px;transition:.16s;border-top:4px solid var(--rc,#00489c);}
.kmHRoad .road:hover{box-shadow:0 14px 30px rgba(15,23,42,.12);transform:translateY(-4px);}
.kmHRoad .road .bd2{font-size:11px;font-weight:900;letter-spacing:.04em;color:#fff;background:var(--rc,#00489c);border-radius:6px;padding:3px 9px;}
.kmHRoad .road h3{font-size:17px;font-weight:800;margin:12px 0 7px;letter-spacing:-.01em;line-height:1.3;}
.kmHRoad .road p{font-size:13px;color:var(--km-ink-soft);line-height:1.5;margin:0 0 18px;min-height:38px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.kmHRoad .road .cnt{display:inline-flex;align-items:center;gap:3px;font-size:13px;font-weight:800;color:var(--rc,#00489c);}
.kmHRoad .road .cnt .kmIco{width:15px;height:15px;}
.kmHRoad .road .ic{position:absolute;right:14px;bottom:12px;color:var(--rc,#00489c);opacity:.16;}
.kmHRoad .road .ic .kmIco{width:64px;height:64px;}

/* 왜 우리인가 */
.kmHWhy{padding:42px 0 28px;}
.kmHWhy .ttl{text-align:center;font-size:25px;font-weight:900;margin:0 0 28px;letter-spacing:-.02em;}
.kmHWhy .ttl span{color:#00489c;}
.kmHWhy .grid{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:18px;align-items:center;}
.kmHWhy .col{display:flex;flex-direction:column;gap:18px;}
.kmHWhy .feat{text-align:center;}
.kmHWhy .feat .ic{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:15px;background:var(--km-primary-light,#e3edf9);color:#00489c;margin-bottom:10px;}
.kmHWhy .feat .ic .kmIco{width:26px;height:26px;}
.kmHWhy .feat b{display:block;font-size:15.5px;font-weight:800;margin-bottom:5px;}
.kmHWhy .feat p{font-size:12.5px;color:var(--km-ink-soft);line-height:1.5;margin:0;}
.kmHWhy .whyCta{position:relative;overflow:hidden;border-radius:18px;background:linear-gradient(150deg,#0c2b63,#1b50a8);color:#fff;padding:30px 30px;text-align:center;box-shadow:0 14px 34px rgba(10,31,68,.22);}
.kmHWhy .whyCta .ek{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;letter-spacing:.06em;color:#bcd4ff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:5px 13px;}
.kmHWhy .whyCta .ek .kmIco{width:13px;height:13px;}
.kmHWhy .whyCta h3{font-size:23px;font-weight:900;margin:14px 0 8px;letter-spacing:-.02em;}
.kmHWhy .whyCta>p{font-size:13.5px;color:#cfddf5;line-height:1.6;margin:0 0 18px;}
.kmHWhy .whyCta .nums{display:flex;justify-content:center;gap:10px;margin-bottom:20px;}
.kmHWhy .whyCta .nums div{flex:1;max-width:120px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:12px 6px;}
.kmHWhy .whyCta .nums b{display:block;font-size:21px;font-weight:900;letter-spacing:-.02em;}
.kmHWhy .whyCta .nums span{display:block;font-size:11.5px;color:#bcd0ee;margin-top:2px;}
.kmHWhy .whyCta .btns{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;}
.kmHWhy .whyCta .btns .km-btn{background:#fff;color:#0c2b63;border:none;border-radius:11px;padding:12px 20px;font-size:14px;font-weight:800;text-decoration:none;transition:.15s;}
.kmHWhy .whyCta .btns .km-btn:hover{background:#eaf1fb;}
.kmHWhy .whyCta .btns .km-btn.gh{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.4);}
.kmHWhy .whyCta .btns .km-btn.gh:hover{background:rgba(255,255,255,.24);}

/* 공지 + 이벤트 */
.kmHNews{padding:10px 0 50px;}
.kmHNews .kmWrap{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;}
.kmHNews .news{background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:6px 20px 12px;}
.kmHNews .news .bh{display:flex;align-items:center;justify-content:space-between;padding:13px 0 9px;border-bottom:1px solid var(--km-line);}
.kmHNews .news .bh b{font-size:15px;display:inline-flex;align-items:center;gap:7px;}
.kmHNews .news .bh b .kmIco{width:17px;height:17px;color:#00489c;}
.kmHNews .news .bh a{font-size:12.5px;color:var(--km-muted);text-decoration:none;}
.kmHNews .news .ni{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 2px;border-bottom:1px solid #f1f4f8;text-decoration:none;color:var(--km-ink);}
.kmHNews .news .ni:last-child{border-bottom:none;}
.kmHNews .news .ni:hover .t{color:#00489c;}
.kmHNews .news .ni .t{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.kmHNews .news .ni .d{font-size:12px;color:var(--km-muted);flex:none;}
.kmHCs{background:linear-gradient(135deg,#0c2b63,#1b50a8);color:#fff;border-radius:16px;padding:20px 22px;display:flex;flex-direction:column;}
.kmHCs .hd{display:flex;align-items:center;gap:11px;}
.kmHCs .hd .ic{flex:none;width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;}
.kmHCs .hd .ic .kmIco{width:22px;height:22px;}
.kmHCs .hd b{display:block;font-size:16px;font-weight:800;}
.kmHCs .hd span{display:block;font-size:12px;color:#bcd0ee;margin-top:1px;}
.kmHCs .tel{font-size:26px;font-weight:900;letter-spacing:-.01em;margin:14px 0 4px;}
.kmHCs .hr{font-size:12px;color:#bcd0ee;line-height:1.6;}
.kmHCs .lk{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px;}
.kmHCs .lk a{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;color:#fff;text-decoration:none;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:9px;padding:7px 11px;transition:.15s;}
.kmHCs .lk a:hover{background:rgba(255,255,255,.22);}
.kmHCs .lk a .kmIco{width:14px;height:14px;}

@media (max-width:1024px){
  .kmHHeroIn{grid-template-columns:1fr;}
  .kmHHero .art{height:220px;order:-1;}
  .kmHJobs .jobs{grid-template-columns:repeat(5,1fr);}
  .kmHRoad .roads{grid-template-columns:repeat(2,1fr);}
  .kmHWhy .grid{grid-template-columns:1fr;}
  .kmHWhy .whyCta{order:-1;max-width:560px;margin:0 auto;width:100%;}
  .kmHNews .kmWrap{grid-template-columns:1fr;}
}
@media (max-width:768px){
  .kmHHero{padding:34px 0 54px;}
  .kmHHero .lead h1{font-size:30px;}
  .kmHTrust{grid-template-columns:repeat(2,1fr);margin-bottom:-120px;}
  .kmHTrust .it:nth-child(odd){border-left:none;}
  .kmHRailSec:first-of-type{padding-top:150px;}
  .kmHJobs .jobs{grid-template-columns:repeat(3,1fr);}
  .kmHCard{flex-basis:200px;}
}

/* 교육안내(eduinfo) 허브 보조 타이포 */
.kmPageHero .kmPageLead{font-size:15px;color:var(--km-ink-soft);margin:10px 0 0;line-height:1.6;}
.kmPageHero .kmPageLead b{color:var(--km-primary);}
.kmInfoLead{background:var(--km-primary-light,#e3edf9);border-radius:14px;padding:22px 24px;margin:8px 0 30px;}
.kmInfoLead h2{font-size:18px;font-weight:800;margin:0 0 8px;color:var(--km-primary-dark,#00386f);}
.kmInfoLead p{font-size:14px;color:var(--km-ink-soft);line-height:1.7;margin:0;}
.kmInfoH{font-size:20px;font-weight:800;margin:34px 0 16px;letter-spacing:-.01em;}

/* ============================================================
   내일배움카드 안내(card01~04) 레거시 마크업 → 디자인시스템 톤
   콘텐츠 재작성 없이 .kmPageBody 스코프로 표면만 현대화.
   ============================================================ */
/* 서브 탭(card 4종 전환) — 알약형 탭바 */
.kmPageBody .tabWrap{margin:0 0 26px;}
.kmPageBody .tabWrap ul.eduinfoTab{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0;border:0;}
.kmPageBody .tabWrap ul.eduinfoTab:after{content:none;}
.kmPageBody .eduinfoTab li{float:none;margin:0;border:1px solid var(--km-line);border-radius:999px;line-height:normal;background:#fff;transition:all .15s ease;}
.kmPageBody .eduinfoTab li a{display:block;padding:9px 18px;font-size:14px;font-weight:700;color:var(--km-ink-soft);text-decoration:none;letter-spacing:-.01em;}
.kmPageBody .eduinfoTab li:hover{border-color:var(--km-primary);}
.kmPageBody .eduinfoTab li:hover a{color:var(--km-primary);}
.kmPageBody .eduinfoTab li.select{background:var(--km-primary);border-color:var(--km-primary);box-shadow:var(--km-shadow-sm);}
.kmPageBody .eduinfoTab li.select a{color:#fff;}

/* 카드 본문 컨테이너 */
.kmPageBody .cardArea,.kmPageBody .cardBox{margin:0;}
.kmPageBody .tit_box{margin:0 0 18px;}
.kmPageBody .main_tit{font-size:24px;font-weight:800;color:var(--km-ink);letter-spacing:-.02em;line-height:1.35;margin:0 0 6px;}
.kmPageBody .main_tit span{color:var(--km-primary);}
.kmPageBody .second_tit{font-size:15px;color:var(--km-ink-soft);margin:0 0 4px;}
.kmPageBody .tit_box img{max-width:100%;height:auto;border-radius:12px;margin-top:12px;}

/* 2열 레이아웃(좌/우, flex) */
.kmPageBody .txt_box,.kmPageBody .txt_wrap,.kmPageBody .flex_box,.kmPageBody .box_wrap{
  display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;margin:0 0 18px;}
.kmPageBody .box_left,.kmPageBody .box_right{min-width:0;}

/* 콘텐츠 블록 카드 */
.kmPageBody .box_sort{background:#fff;border:1px solid var(--km-line);border-left:4px solid var(--km-primary);
  border-radius:12px;padding:18px 20px;margin:0 0 14px;box-shadow:var(--km-shadow-sm);}
.kmPageBody .txt_tit{display:block;font-size:16px;font-weight:800;color:var(--km-ink);margin:0 0 8px;letter-spacing:-.01em;}
.kmPageBody .txt_tit_in{display:block;font-weight:700;color:var(--km-primary-dark);font-size:15px;margin-top:2px;}
.kmPageBody .txt_paragraph{font-size:14px;color:var(--km-ink-soft);line-height:1.7;margin:0 0 8px;}
.kmPageBody .txt_paragraph:last-child{margin-bottom:0;}
.kmPageBody .strong_p,.kmPageBody .strong_b{color:var(--km-primary);font-weight:700;}
.kmPageBody .red{color:var(--km-danger);font-weight:700;}

/* 콜아웃(유의/안내) 박스 */
.kmPageBody .notice_box,.kmPageBody .information_box{
  background:var(--km-primary-light);border-radius:12px;padding:18px 20px;margin:18px 0;}
.kmPageBody .notice_box .txt_tit,.kmPageBody .information_box .txt_tit{color:var(--km-primary-dark);}

/* 절차/단계 박스 */
.kmPageBody .process_box{background:#fff;border:1px solid var(--km-line);border-radius:12px;padding:18px 20px;margin:0 0 14px;}

/* 이미지/버튼 */
.kmPageBody .img_box img,.kmPageBody .img_txt img{max-width:100%;height:auto;border-radius:12px;}
.kmPageBody .btn_box{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.kmPageBody .btn_box a,.kmPageBody .btn_sort a{display:inline-flex;align-items:center;gap:6px;
  padding:11px 18px;border-radius:999px;font-size:14px;font-weight:700;text-decoration:none;
  background:var(--km-primary);color:#fff;transition:background .15s ease;}
.kmPageBody .btn_box a:hover,.kmPageBody .btn_sort a:hover{background:var(--km-primary-dark);color:#fff;}
.kmPageBody .btn_sort{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;}
.kmPageBody .btn_sort a{background:#fff;color:var(--km-primary);border:1px solid var(--km-line);}
.kmPageBody .btn_sort a:hover{border-color:var(--km-primary);background:var(--km-primary-light);color:var(--km-primary-dark);}

/* 표 */
.kmPageBody .table_content,.kmPageBody .table_box table,.kmPageBody .table_light{
  border-collapse:collapse;width:100%;margin:8px 0 16px;font-size:14px;}
.kmPageBody .table_content th,.kmPageBody .table_box th{background:#f1f5f9;font-weight:700;color:var(--km-ink);
  border:1px solid var(--km-line);padding:11px 12px;}
.kmPageBody .table_content td,.kmPageBody .table_box td{border:1px solid var(--km-line);padding:11px 12px;color:var(--km-ink-soft);}

@media(max-width:760px){
  .kmPageBody .txt_box,.kmPageBody .txt_wrap,.kmPageBody .flex_box,.kmPageBody .box_wrap{grid-template-columns:1fr;}
  .kmPageBody .main_tit{font-size:20px;}
}

/* ============================================================
   인터랙션: 스크롤 리빌 · 맨 위로 (js/km-ui.js와 연동)
   no-JS 안전: html.kmReveal-on 일 때만 숨김 → JS 없으면 정상 노출
   ============================================================ */
html.kmReveal-on body.kmHome [data-kmreveal]{opacity:0;transform:translateY(20px);will-change:opacity,transform;}
body.kmHome [data-kmreveal]{transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);}
body.kmHome [data-kmreveal].kmIn{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){
  html.kmReveal-on body.kmHome [data-kmreveal]{opacity:1!important;transform:none!important;}
}
/* 맨 위로 버튼 */
.kmToTop{position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;border:none;
  background:var(--km-primary);color:#fff;box-shadow:var(--km-shadow-lg);cursor:pointer;
  display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .25s ease,transform .25s ease,visibility .25s ease,background .15s ease;z-index:90;}
.kmToTop.show{opacity:1;visibility:visible;transform:none;}
.kmToTop:hover{background:var(--km-primary-dark);}
@media(max-width:760px){.kmToTop{right:14px;bottom:14px;width:42px;height:42px;}}

/* ---- 메인 신뢰 통계 밴드(실데이터 카운트업) ---- */
.kmStatBand{padding:30px 0 14px;}
.kmStatBand .kmWrap{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;}
.kmStatCell{flex:1 1 200px;max-width:280px;background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:22px 18px;text-align:center;box-shadow:var(--km-shadow-sm);transition:transform .16s ease,box-shadow .16s ease;}
.kmStatCell:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(20,40,80,.10);}
.kmStatCell .ic{display:inline-flex;width:46px;height:46px;border-radius:12px;background:var(--km-primary-light);color:var(--km-primary);align-items:center;justify-content:center;margin-bottom:10px;}
.kmStatCell .ic .kmIco{width:24px;height:24px;}
.kmStatCell .num{display:block;font-size:30px;font-weight:800;color:var(--km-primary-dark);letter-spacing:-.02em;line-height:1;}
.kmStatCell .num i{font-size:17px;font-weight:700;margin-left:2px;font-style:normal;color:var(--km-primary);}
.kmStatCell .lb{display:block;font-size:13.5px;color:var(--km-ink-soft);margin-top:8px;font-weight:600;}
@media(max-width:560px){.kmStatBand .kmStatCell{flex-basis:44%;padding:18px 12px;}.kmStatCell .num{font-size:24px;}}

/* ============================================================
   메인 슬라이딩 배너 (관리자 등록 · 자동 회전)
   include/km_banner_slider.php 가 출력하는 마크업 전용 스타일
   ============================================================ */
.kmBannerSlider{ position:relative; overflow:hidden; background:#0B1220; }
.kmBannerSlider .track{ display:flex; transition: transform .55s cubic-bezier(.22,.61,.36,1); will-change:transform; }
.kmBannerSlider .slide{ flex:0 0 100%; min-height:480px; position:relative; overflow:hidden; color:#fff; }
.kmBannerSlider .slide .sBg{ position:absolute; inset:0; z-index:0; background-size:cover; background-position:center; }
.kmBannerSlider .slide .sOverlay{ position:absolute; inset:0; z-index:1; }
.kmBannerSlider .slide .sIn{
  position:relative; z-index:2; max-width:1240px; margin:0 auto;
  padding:120px 24px; min-height:480px;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
}
.kmBannerSlider .slide.alignCenter .sIn{ align-items:center; text-align:center; }
.kmBannerSlider .slide .lead{ max-width:640px; display:flex; flex-direction:column; align-items:flex-start; }
.kmBannerSlider .slide.alignCenter .lead{ align-items:center; }
.kmBannerSlider .sEyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  padding:6px 12px; border-radius:999px; background:rgba(255,255,255,.12); color:#fff;
  backdrop-filter:blur(8px);
}
.kmBannerSlider .sTitle{
  font-size:clamp(28px,4.5vw,56px); line-height:1.06; letter-spacing:-.035em;
  font-weight:800; margin:18px 0 18px; color:#fff;
}
.kmBannerSlider .sTitle .hl{
  background:var(--hlGrad, linear-gradient(90deg,#FFD66E,#FFBA38));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.kmBannerSlider .sLead{ color:rgba(255,255,255,.85); font-size:17px; max-width:560px; margin:0; line-height:1.55; }
.kmBannerSlider .sCtas{ display:flex; gap:10px; margin-top:28px; flex-wrap:wrap; }
.kmBannerSlider .btn{
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:700; font-size:15px; padding:14px 22px; border-radius:14px;
  border:1px solid transparent; transition:transform .08s ease,box-shadow .2s ease,background .15s ease;
}
.kmBannerSlider .btn:active{ transform:translateY(1px); }
.kmBannerSlider .btn-accent{ background:#F8C740; color:#6B4E00; }
.kmBannerSlider .btn-accent:hover{ background:#FBD96B; }
.kmBannerSlider .btn-ghost{ background:#fff; color:#0B1220; border-color:#E7EAEE; }
.kmBannerSlider .btn-ghost.km-onHero{ background:transparent; border-color:rgba(255,255,255,.28); color:#fff; }
.kmBannerSlider .btn-ghost.km-onHero:hover{ background:rgba(255,255,255,.12); }
.kmBannerSlider .btn-lg{ padding:18px 28px; font-size:16px; border-radius:16px; }

/* 배경 프리셋 */
.kmBannerSlider .slide.bg-navy  { background:linear-gradient(180deg,#0B1832,#0B1220); --hlGrad:linear-gradient(90deg,#FFD66E,#FFBA38); }
.kmBannerSlider .slide.bg-navy   .sOverlay{ background:radial-gradient(60% 60% at 90% 0%,rgba(248,199,64,.18),transparent 60%),radial-gradient(50% 50% at 0% 100%,rgba(63,108,219,.22),transparent 60%); }
.kmBannerSlider .slide.bg-amber { background:linear-gradient(135deg,#3D2A00 0%,#6B4E00 60%,#0B1220 100%); --hlGrad:linear-gradient(90deg,#fff,#FFE0A6); }
.kmBannerSlider .slide.bg-amber  .sOverlay{ background:radial-gradient(50% 50% at 90% 100%,rgba(248,199,64,.32),transparent 60%); }
.kmBannerSlider .slide.bg-deep  { background:linear-gradient(135deg,#03132E,#0E2A5E 60%,#00489c); --hlGrad:linear-gradient(90deg,#FFD66E,#fff); }
.kmBannerSlider .slide.bg-deep   .sOverlay{ background:radial-gradient(50% 50% at 100% 0%,rgba(255,255,255,.18),transparent 60%); }
.kmBannerSlider .slide.bg-violet{ background:linear-gradient(135deg,#1A1233,#3D31C7 55%,#5A4BFF); --hlGrad:linear-gradient(90deg,#A9F5DA,#fff); }
.kmBannerSlider .slide.bg-violet .sOverlay{ background:radial-gradient(60% 60% at 0% 100%,rgba(169,245,218,.22),transparent 60%); }
.kmBannerSlider .slide.bg-mint  { background:linear-gradient(135deg,#064E45,#0D8A77 50%,#16B79E); --hlGrad:linear-gradient(90deg,#fff,#D7F8F0); }
.kmBannerSlider .slide.bg-mint   .sOverlay{ background:radial-gradient(50% 50% at 100% 100%,rgba(255,255,255,.2),transparent 60%); }
.kmBannerSlider .slide.bg-pink  { background:linear-gradient(135deg,#3A0F2A,#B91C7B 50%,#EC4899); --hlGrad:linear-gradient(90deg,#FFE2EF,#fff); }
.kmBannerSlider .slide.bg-custom{ background:#0B1220; }
.kmBannerSlider .slide.bg-custom .sOverlay{ background:linear-gradient(90deg,rgba(11,18,32,.65),rgba(11,18,32,.25) 60%,transparent); }

/* 좌우 네비/도트 */
.kmBannerSlider .nav-prev,.kmBannerSlider .nav-next{
  position:absolute; top:50%; transform:translateY(-50%); z-index:6;
  width:48px; height:48px; border-radius:50%;
  background:rgba(255,255,255,.14); color:#fff; border:1px solid rgba(255,255,255,.24);
  display:grid; place-items:center; cursor:pointer; transition:.2s; backdrop-filter:blur(10px);
}
.kmBannerSlider .nav-prev:hover,.kmBannerSlider .nav-next:hover{ background:rgba(255,255,255,.28); transform:translateY(-50%) scale(1.05); }
.kmBannerSlider .nav-prev{ left:24px; } .kmBannerSlider .nav-next{ right:24px; }
@media(max-width:960px){ .kmBannerSlider .nav-prev,.kmBannerSlider .nav-next{ display:none; } }

.kmBannerSlider .dots{
  position:absolute; left:50%; bottom:24px; transform:translateX(-50%); z-index:6;
  display:flex; gap:8px; align-items:center;
  background:rgba(11,18,32,.45); padding:8px 14px; border-radius:999px; backdrop-filter:blur(10px);
}
.kmBannerSlider .dots button{
  width:8px; height:8px; border-radius:50%; border:none; background:rgba(255,255,255,.5);
  padding:0; transition:.2s; cursor:pointer;
}
.kmBannerSlider .dots button.on{ background:#fff; width:22px; border-radius:6px; }
.kmBannerSlider .dots .pp{
  width:22px; height:22px; border-radius:50%; background:rgba(255,255,255,.16); color:#fff;
  font-size:10px; display:grid; place-items:center; margin-left:6px;
}
.kmBannerSlider .dots .ix{ color:#fff; font-size:12px; font-weight:700; margin-left:8px; letter-spacing:.05em; }
.kmBannerSlider .dots .ix b{ font-weight:900; }
@media(max-width:600px){ .kmBannerSlider .dots .ix{ display:none; } }

@media(max-width:960px){
  .kmBannerSlider .slide{ min-height:auto; }
  .kmBannerSlider .slide .sIn{ padding:64px 20px 80px; min-height:auto; }
  .kmBannerSlider .sLead{ font-size:15px; }
}

/* ============================================================
   메인 — 환급 절차 4단계 + 환급액 계산 CTA (판매 전환 섹션)
   ============================================================ */
.kmRefundFlow{ padding:88px 0; background:linear-gradient(180deg,#FAFAFC 0%,#fff 100%); }
.kmFlowGrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; max-width:1240px; margin:0 auto; }
.kmFlowCard{
  position:relative; background:#fff; border:1px solid var(--km-line);
  border-radius:18px; padding:28px 24px; transition:.18s;
}
.kmFlowCard:hover{ transform:translateY(-4px); box-shadow:0 16px 36px rgba(16,24,40,.08); border-color:transparent; }
.kmFlowCard .no{
  width:42px; height:42px; border-radius:11px; background:var(--km-primary); color:#fff;
  display:grid; place-items:center; font-weight:900; font-size:16px; margin-bottom:12px;
  font-family:'Inter',var(--km-font); letter-spacing:-.02em;
}
.kmFlowCard h3{ font-weight:800; font-size:17px; letter-spacing:-.02em; margin:0 0 8px; color:var(--km-ink); }
.kmFlowCard p{ color:var(--km-ink-soft); font-size:13.5px; margin:0; line-height:1.6; }
.kmFlowCard .arr{ position:absolute; right:-12px; top:46px; font-size:22px; color:var(--km-muted); font-weight:900; z-index:2; }
@media(max-width:960px){ .kmFlowGrid{ grid-template-columns:repeat(2,1fr); } .kmFlowCard .arr{ display:none; } }
@media(max-width:560px){ .kmFlowGrid{ grid-template-columns:1fr; } }

.kmRefundCta{
  max-width:1240px; margin:48px auto 0;
  background:linear-gradient(135deg,#0E2A5E 0%,#00489c 60%,#0B1220 100%);
  color:#fff; border-radius:24px; padding:48px;
  display:grid; grid-template-columns:1.2fr .8fr; gap:48px; align-items:center;
  position:relative; overflow:hidden;
}
.kmRefundCta::after{ content:""; position:absolute; right:-80px; top:-80px; width:300px; height:300px; border-radius:50%; background:radial-gradient(circle,rgba(248,199,64,.22),transparent 60%); }
.kmRefundCta .cl,.kmRefundCta .cr{ position:relative; z-index:1; }
.kmRefundCta .chip{ display:inline-block; padding:5px 11px; border-radius:999px; background:rgba(255,255,255,.16); color:#FBD96B; font-size:12px; font-weight:800; letter-spacing:.06em; backdrop-filter:blur(8px); }
.kmRefundCta h3{ font-size:28px; line-height:1.2; letter-spacing:-.02em; font-weight:800; margin:14px 0 12px; color:#fff; }
.kmRefundCta p{ color:rgba(255,255,255,.86); font-size:15px; margin:0 0 22px; max-width:440px; line-height:1.65; }
.kmRefundCta .btns{ display:flex; gap:10px; flex-wrap:wrap; }
.kmRefundCta .km-btn-accent{ background:#F8C740; color:#6B4E00; border-color:#F8C740; }
.kmRefundCta .km-btn-accent:hover{ background:#FBD96B; }
.kmRefundCta .km-btn-ghost{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.28); }
.kmRefundCta .km-btn-ghost:hover{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.48); }
.kmRefundCta .km-btn-lg{ padding:14px 22px; font-size:15px; border-radius:12px; }
.kmRefundCta .cr .card{
  background:#F8C740; color:#6B4E00; padding:24px 28px; border-radius:18px;
  text-align:center; margin-bottom:14px;
  box-shadow:0 18px 36px -12px rgba(248,199,64,.5);
}
.kmRefundCta .cr .card .lbl{ font-size:12.5px; font-weight:800; letter-spacing:.08em; }
.kmRefundCta .cr .card .big{ display:block; font-size:54px; font-weight:900; letter-spacing:-.04em; line-height:1; margin:6px 0 4px; }
.kmRefundCta .cr .card small{ font-size:12px; font-weight:700; }
.kmRefundCta .cr .cardSub{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.kmRefundCta .cr .cardSub div{ background:rgba(255,255,255,.08); border-radius:12px; padding:14px 8px; text-align:center; }
.kmRefundCta .cr .cardSub b{ display:block; font-size:18px; font-weight:900; letter-spacing:-.02em; }
.kmRefundCta .cr .cardSub span{ font-size:11px; color:rgba(255,255,255,.74); }
@media(max-width:900px){ .kmRefundCta{ grid-template-columns:1fr; padding:32px; } }

/* 섹션 간 간격 통일 — 기존 inline padding 잡음 정리 */
body.kmHome .kmSection{ padding:72px 0; }
body.kmHome .kmSection.kmRefundFlow{ padding:88px 0; }
body.kmHome .kmSection.soft{ background:#FAFAFC; }

/* ============================================================
   약관 · 개인정보 · 환불규정 — 본문 가독성/구조 강화
   ============================================================ */
.kmPageHero{
  background:linear-gradient(135deg,#0E2A5E 0%, #00489c 60%, #0B1220 100%);
  color:#fff; padding:64px 0; position:relative; overflow:hidden;
}
.kmPageHero::after{
  content:""; position:absolute; right:-80px; top:-80px;
  width:280px; height:280px; border-radius:50%;
  background:radial-gradient(circle,rgba(248,199,64,.18),transparent 60%);
  pointer-events:none;
}
.kmPageHero .kmPageWrap{ position:relative; z-index:1; padding-bottom:0; }
.kmPageHero .kmCrumb{
  display:inline-flex; align-items:center; gap:8px;
  padding:5px 12px; border-radius:999px;
  background:rgba(255,255,255,.14); color:#FBD96B;
  font-size:12px; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; backdrop-filter:blur(8px);
  margin-bottom:14px;
}
.kmPageHero h1{
  font-size:clamp(28px,3.8vw,40px); letter-spacing:-.03em;
  line-height:1.15; font-weight:800; margin:0;
}

/* 본문: 카드 컨테이너 + 사이드 메타 */
.kmPageBody{
  background:#fff; border:1px solid var(--km-line); border-radius:22px;
  padding:40px 44px; box-shadow:0 6px 20px rgba(16,24,40,.04);
  font-size:15.5px; line-height:1.85; color:var(--km-ink);
}
.kmPageBody h2{
  font-size:22px; font-weight:800; margin:36px 0 14px;
  padding-top:24px; border-top:1px solid var(--km-line-2, #F1F3F6);
  letter-spacing:-.02em; color:var(--km-ink);
}
.kmPageBody h2:first-child{ border-top:none; padding-top:0; margin-top:0; }
.kmPageBody h3{ font-size:17px; font-weight:800; margin:24px 0 10px; color:var(--km-ink); letter-spacing:-.02em; }
.kmPageBody p{ margin:0 0 14px; }
.kmPageBody ul, .kmPageBody ol{ padding-left:22px; margin:8px 0 16px; }
.kmPageBody li{ margin:8px 0; }
.kmPageBody table{ width:100%; border-collapse:collapse; margin:16px 0; border-radius:8px; overflow:hidden; }
.kmPageBody table th{ background:var(--km-primary-light); color:var(--km-primary-dark); font-weight:800; padding:12px 14px; font-size:13.5px; text-align:left; border:none; }
.kmPageBody table td{ padding:12px 14px; font-size:14px; border:1px solid var(--km-line-2,#F1F3F6); }
.kmPageBody a{ color:var(--km-primary); font-weight:600; }
.kmPageBody blockquote{ border-left:4px solid var(--km-primary); padding:14px 20px; background:var(--km-primary-light); border-radius:0 12px 12px 0; margin:18px 0; }

/* 빈 본문 안내 카드 */
.kmPageBody .kmEmptyHint{
  text-align:center; padding:60px 20px; color:var(--km-ink-soft);
  background:linear-gradient(180deg,#FAFAFC 0%,#fff 100%);
  border:2px dashed var(--km-line); border-radius:18px;
  margin:0;
}
.kmPageBody .kmEmptyHint .ic{
  display:inline-flex; width:60px; height:60px; border-radius:16px;
  background:var(--km-primary-light); color:var(--km-primary);
  align-items:center; justify-content:center; margin-bottom:14px;
}

/* 서브내비 강화 (chip → segmented) */
.kmSubNav{
  display:flex; flex-wrap:wrap; gap:6px; margin:24px 0 28px;
  border-bottom:1px solid var(--km-line); padding-bottom:0;
}
.kmSubNav a{
  display:inline-block; padding:12px 18px;
  font-size:14.5px; font-weight:700; color:var(--km-ink-soft);
  border:none; border-bottom:3px solid transparent;
  border-radius:0; background:transparent !important;
  transition:.15s;
}
.kmSubNav a:hover{ color:var(--km-primary); background:transparent; }
.kmSubNav a.on{
  color:var(--km-primary) !important; background:transparent !important;
  border-bottom:3px solid var(--km-primary);
}

@media(max-width:760px){
  .kmPageBody{ padding:28px 22px; border-radius:16px; }
  .kmPageHero{ padding:42px 0; }
}

/* ============================================================
   메인 — kmVCard / kmVBiz 시안 톤 보강 (2026 리뉴얼)
   ============================================================ */
.kmVCard .th{ border-radius:18px; box-shadow:0 10px 28px rgba(20,40,80,.10); }
.kmVCard:hover .th{ transform:translateY(-6px); box-shadow:0 20px 40px rgba(20,40,80,.16); }
.kmVCard .nm{ font-size:15px; letter-spacing:-.02em; }
.kmVTitle{ font-size:30px; letter-spacing:-.03em; margin:0 0 28px; }

.kmVTabs button{
  padding:11px 22px; border-radius:999px; font-size:14.5px;
  transition:transform .12s ease, background .15s ease, border-color .15s ease;
}
.kmVTabs button:hover:not(.on){ transform:translateY(-1px); border-color:var(--km-primary); color:var(--km-primary); }
.kmVTabs button.on{ background:#0B1220; border-color:#0B1220; box-shadow:0 6px 14px rgba(11,18,32,.18); }

/* kmVBiz — 기업 도입 / 수강 후기 등 양쪽 영역 박스 통일 */
.kmVBiz{
  display:grid; grid-template-columns:1.2fr .8fr; gap:32px; align-items:center;
  background:linear-gradient(135deg,#0E2A5E 0%, #00489c 60%, #0B1220 100%);
  color:#fff; border-radius:24px; padding:40px 44px;
  position:relative; overflow:hidden;
  box-shadow:0 20px 44px -16px rgba(0,72,156,.32);
}
.kmVBiz::after{
  content:""; position:absolute; right:-80px; top:-80px;
  width:280px; height:280px; border-radius:50%;
  background:radial-gradient(circle,rgba(248,199,64,.22),transparent 60%);
  pointer-events:none;
}
.kmVBiz .bl,.kmVBiz .br{ position:relative; z-index:1; }
.kmVBiz .ov{
  display:inline-block; padding:5px 12px; border-radius:999px;
  background:rgba(255,255,255,.16); color:#FBD96B;
  font-size:12px; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; margin:0 0 12px; backdrop-filter:blur(8px);
}
.kmVBiz h3{
  color:#fff; font-size:24px; line-height:1.25; letter-spacing:-.025em;
  font-weight:800; margin:0 0 10px;
}
.kmVBiz .ds{ color:rgba(255,255,255,.84); font-size:14.5px; line-height:1.6; margin:0; }
.kmVBiz .br{ display:flex; flex-direction:column; gap:10px; }
.kmVBiz .br a{
  display:inline-flex; align-items:center; gap:8px; justify-content:center;
  padding:14px 22px; border-radius:12px; text-decoration:none;
  font-weight:800; font-size:14.5px; transition:.18s;
}
.kmVBiz .br .b1{
  background:#F8C740; color:#3D2A00 !important;
  box-shadow:0 8px 20px -6px rgba(248,199,64,.4);
}
.kmVBiz .br .b1:hover{ background:#FBD96B; transform:translateY(-2px); }
.kmVBiz .br .b2{
  background:rgba(255,255,255,.12); color:#fff !important;
  border:1px solid rgba(255,255,255,.24); backdrop-filter:blur(8px);
}
.kmVBiz .br .b2:hover{ background:rgba(255,255,255,.22); transform:translateY(-2px); }
@media(max-width:760px){ .kmVBiz{ grid-template-columns:1fr; padding:28px; gap:20px; } .kmVBiz h3{ font-size:20px; } }

/* 신뢰 통계 밴드 — 메인 상단 stat 칸 — 시안 톤 라운드 + 호버 */
body.kmHome .kmStatBand .kmStatCell{
  border-radius:18px; padding:24px 16px; transition:.18s;
}
body.kmHome .kmStatBand .kmStatCell:hover{
  transform:translateY(-3px); box-shadow:0 14px 28px rgba(20,40,80,.10);
  border-color:var(--km-primary);
}
body.kmHome .kmStatBand .num{ font-size:32px; letter-spacing:-.03em; }

/* 메인 NPerks(혜택 4) 카드 톤 보강 */
.kmNPerks .kmIntroCard{ border-radius:18px; transition:.18s; }
.kmNPerks .kmIntroCard:hover{ transform:translateY(-3px); box-shadow:0 14px 28px rgba(20,40,80,.08); }

/* ============================================================
   메인 신뢰 스트립 — 시안 톤 (4개 신뢰배지 카드)
   ============================================================ */
.kmTrustStrip{ padding:0; margin:-32px auto 64px; position:relative; z-index:5; }
.kmTrustStrip .kmWrap{
  max-width:1240px;
  background:#fff; border:1px solid var(--km-line); border-radius:24px;
  padding:28px 32px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
  box-shadow:0 24px 60px -16px rgba(11,18,32,.18);
}
.kmTrustStrip .it{
  display:flex; gap:16px; align-items:center;
  padding:0; background:transparent; border:none;
}
.kmTrustStrip .it .ic{
  width:54px; height:54px; border-radius:14px;
  background:var(--km-primary-light); color:var(--km-primary);
  display:grid; place-items:center; flex-shrink:0;
}
.kmTrustStrip .it .ic .kmIco,
.kmTrustStrip .it .ic svg{
  width:28px; height:28px; stroke:var(--km-primary);
}
.kmTrustStrip .it b{ display:block; font-weight:800; font-size:15.5px; letter-spacing:-.02em; color:var(--km-ink); margin-bottom:4px; }
.kmTrustStrip .it span{ font-size:12.5px; color:var(--km-ink-soft); line-height:1.5; display:block; }
@media(max-width:960px){
  .kmTrustStrip{ margin:-16px auto 40px; }
  .kmTrustStrip .kmWrap{
    grid-template-columns:repeat(2,1fr);
    padding:20px; gap:16px; border-radius:18px;
  }
  .kmTrustStrip .it .ic{ width:46px; height:46px; }
  .kmTrustStrip .it b{ font-size:14px; }
  .kmTrustStrip .it span{ font-size:11.5px; }
}
@media(max-width:560px){
  .kmTrustStrip .kmWrap{ grid-template-columns:1fr; }
}

/* ============================================================
   우선순위 1 — 전환 경로 디자인 톤 통일 (2026 리뉴얼)
   /study/archive.php · /study/course.php · /member/login.php · /member/join.php
   기존 컴포넌트(kmCourseCard, kmDetailHero, kmAuthCard 등) 위에 시안 톤만 덧칠.
   ============================================================ */

/* 과정 카드 — 시안 톤 (라운드 18 + 부드러운 호버 -5px float) */
.kmCourseCard{
  border-radius:18px !important;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}
.kmCourseCard:hover{
  transform:translateY(-5px) !important;
  box-shadow:0 22px 44px -12px rgba(20,40,80,.16), 0 6px 16px rgba(20,40,80,.06) !important;
  border-color:transparent !important;
}
.kmCourseCard .thumb{ border-radius:0; }
.kmCourseCard .badge{
  padding:5px 10px; font-size:11.5px; letter-spacing:.04em;
  border-radius:7px; backdrop-filter:blur(4px);
}
.kmCourseCard .body{ padding:18px 18px 18px; gap:10px; }
.kmCourseCard .cName{ font-size:15.5px; line-height:1.45; letter-spacing:-.02em; }
.kmCourseCard .meta{ padding-top:10px; border-top:1px solid var(--km-line-2, #F1F3F6); }

/* 칩 필터 - 시안 톤 */
.kmFilterBar{ padding:16px 0 24px; }
.kmChips{ gap:8px; }
.kmChip{
  padding:10px 18px; border-radius:999px;
  font-size:14px; font-weight:700; transition:.15s;
  background:#fff; border:1px solid var(--km-line); color:var(--km-ink-2,#1f2937);
}
.kmChip:hover{ border-color:var(--km-primary); color:var(--km-primary); transform:translateY(-1px); }
.kmChip.on{ background:#0B1220; border-color:#0B1220; color:#fff; box-shadow:0 6px 14px rgba(11,18,32,.18); }

/* 과정 상세 히어로 — 시안 톤 */
.kmDetailHero{
  background:linear-gradient(135deg,#0E2A5E 0%, #00489c 60%, #0B1220 100%) !important;
  color:#fff;
  padding:64px 0 !important;
  position:relative; overflow:hidden;
}
.kmDetailHero::after{
  content:""; position:absolute; right:-100px; top:-100px;
  width:380px; height:380px; border-radius:50%;
  background:radial-gradient(circle,rgba(248,199,64,.18),transparent 60%);
  pointer-events:none;
}
.kmDetailHero .kmWrap{ position:relative; z-index:1; }
.kmDetailHero h1, .kmDetailHero .cName{ color:#fff; letter-spacing:-.025em; }

/* 과정 상세 — 메인/사이드 카드 */
.kmDetailMain, .kmDetailSide{ background:#fff; }
.kmDetailMain .kmDetailInfo,
.kmDetailBuy{
  background:#fff; border:1px solid var(--km-line); border-radius:20px;
  padding:24px; box-shadow:0 6px 18px rgba(20,40,80,.04);
}
.kmDetailBuy{
  position:sticky; top:88px;
  background:linear-gradient(180deg,#FAFAFC 0%,#fff 30%);
}

/* 커리큘럼 */
.kmCurri{ border:1px solid var(--km-line); border-radius:18px; overflow:hidden; background:#fff; }
.kmCurri .it{ padding:14px 18px; border-bottom:1px solid var(--km-line-2,#F1F3F6); transition:.15s; }
.kmCurri .it:hover{ background:#FAFAFC; }
.kmCurri .it:last-child{ border-bottom:none; }
.kmCurri .it .ord{ font-weight:800; color:var(--km-primary); letter-spacing:-.02em; }

/* 회원가입/로그인 카드 — 시안 톤 */
.kmAuth{ padding:60px 24px; min-height:calc(100vh - 200px); }
.kmAuthCard{
  border-radius:24px !important;
  box-shadow:0 32px 80px -16px rgba(20,40,80,.20), 0 8px 24px rgba(20,40,80,.06) !important;
  border:none !important;
}
.kmAuthArt{
  background:linear-gradient(135deg,#0E2A5E 0%, #00489c 60%, #0B1220 100%) !important;
  position:relative; overflow:hidden;
}
.kmAuthArt::after{
  content:""; position:absolute; right:-60px; bottom:-60px;
  width:240px; height:240px; border-radius:50%;
  background:radial-gradient(circle,rgba(248,199,64,.2),transparent 60%);
  pointer-events:none;
}
.kmAuthArt > *{ position:relative; z-index:1; }
.kmAuthArt h2{ font-size:30px; line-height:1.2; letter-spacing:-.03em; margin:0 0 14px; }
.kmAuthArt p{ font-size:15px; line-height:1.7; opacity:.88; }
.kmAuthArt .ek{
  display:inline-block; padding:5px 12px; border-radius:999px;
  background:rgba(255,255,255,.16); color:#FBD96B;
  font-size:11.5px; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; margin-bottom:18px; backdrop-filter:blur(6px);
}

/* 폼 필드 */
.kmField{ margin-bottom:16px; }
.kmField label{ font-size:12.5px; font-weight:700; color:var(--km-ink-soft); margin-bottom:7px; letter-spacing:.01em; }
.kmField input,
.kmField select,
.kmField textarea{
  width:100%; padding:14px 16px; border:1px solid var(--km-line); border-radius:12px;
  font-size:15px; font-family:inherit; background:#fff;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.kmField input:focus,
.kmField select:focus,
.kmField textarea:focus{
  outline:none; border-color:var(--km-primary);
  box-shadow:0 0 0 3px var(--km-primary-light);
}
.kmField .hint{ font-size:12px; color:var(--km-muted); margin-top:6px; }
.kmField .err{ font-size:12px; color:#DC2626; margin-top:6px; font-weight:600; }

/* 로그인 큰 버튼 */
.kmAuthBtn{
  width:100%; padding:16px 24px !important;
  border-radius:14px !important; font-size:15.5px !important; font-weight:800 !important;
  letter-spacing:-.01em; box-shadow:0 10px 22px var(--km-primary-glow, rgba(0,72,156,.22));
  transition:transform .08s ease, box-shadow .2s ease;
}
.kmAuthBtn:hover{ transform:translateY(-1px); box-shadow:0 14px 28px var(--km-primary-glow, rgba(0,72,156,.32)); }

/* 보조 링크 묶음 */
.kmAuthLinks{
  display:flex; gap:8px; align-items:center; justify-content:center;
  margin-top:18px; font-size:13.5px; color:var(--km-ink-soft);
}
.kmAuthLinks a{ color:var(--km-ink-2,#1f2937); font-weight:600; }
.kmAuthLinks a:hover{ color:var(--km-primary); }
.kmAuthLinks .sep{ color:var(--km-line); }

/* 약관 체크 */
.kmAuthChk{
  display:flex; align-items:flex-start; gap:10px; font-size:13.5px;
  color:var(--km-ink-soft); margin:8px 0 18px;
}
.kmAuthChk input[type=checkbox]{
  width:18px; height:18px; accent-color:var(--km-primary);
  margin-top:1px; flex-shrink:0;
}
.kmAuthChk a{ color:var(--km-primary); font-weight:700; text-decoration:underline; text-underline-offset:3px; }

/* 모바일 반응 */
@media(max-width:760px){
  .kmAuthCard{ flex-direction:column !important; max-width:100% !important; }
  .kmAuthArt{ padding:32px 24px !important; }
  .kmAuthArt h2{ font-size:22px; }
  .kmAuthForm{ padding:32px 24px !important; }
}

/* ============================================================
   학습 플레이어 — 시안 톤 마감 보강 (다크 UI)
   ============================================================ */
.kmPlayerPage{ background:#0B1220; color:#E5E9F0; }
.kmPlayerBar{
  background:#11192A; border-bottom:1px solid #1F2B45;
  backdrop-filter:blur(12px);
  box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.kmPlayerBar .ttl{ letter-spacing:-.02em; }
.kmPlayerBar .prog .bar{
  background:#1F2B45; border-radius:999px;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.3);
}
.kmPlayerBar .prog .bar span{
  background:linear-gradient(90deg,#3C66C9,#5A8DFF);
  box-shadow:0 0 8px rgba(60,102,201,.6);
}

.kmChapSide{ background:#0F1726; border-left:1px solid #1F2B45; }
.kmChapHd{ padding:20px 20px 14px; border-bottom:1px solid #1F2B45; }
.kmChapHd .t{ letter-spacing:-.02em; }

.kmChapItem{
  padding:14px 18px; border-bottom:1px solid #182137;
  transition:background .15s ease, padding .15s ease;
}
.kmChapItem:hover{ background:#15203A; }
.kmChapItem.on{
  background:linear-gradient(90deg,#1A2748,#11192A 60%);
  border-left:3px solid #3C66C9; padding-left:15px;
}
.kmChapItem .no{
  background:#1F2B45; color:#9AAACB; font-weight:800;
  border-radius:8px; transition:.15s;
}
.kmChapItem.on .no{ background:#3C66C9; color:#fff; }
.kmChapItem.locked{ opacity:.45; }

/* 영상 영역 */
.kmVideo{
  border-radius:14px; overflow:hidden;
  box-shadow:0 16px 36px rgba(0,0,0,.4);
}
.kmVideoInfo{
  padding:18px 20px 8px; color:#C5CDD9;
}
.kmVideoInfo h1, .kmVideoInfo .nm{
  color:#fff; letter-spacing:-.025em; font-weight:800;
}

/* 학습 탭 */
.kmPlayTabs{
  display:flex; gap:6px; padding:0 20px;
  border-bottom:1px solid #1F2B45; margin:8px 0 0;
}
.kmPlayTabs a, .kmPlayTabs button{
  padding:14px 16px; font-size:14px; font-weight:700;
  color:#9AAACB; background:transparent; border:none;
  border-bottom:3px solid transparent; cursor:pointer;
  transition:.15s;
}
.kmPlayTabs a:hover, .kmPlayTabs button:hover{ color:#fff; }
.kmPlayTabs a.on, .kmPlayTabs button.on{
  color:#fff; border-bottom-color:#3C66C9;
}

/* 평가 박스 */
.kmEvalBox{
  background:#11192A; border:1px solid #1F2B45; border-radius:14px;
  padding:18px 20px; margin:14px 20px;
}
.kmEvalHd{ display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.kmEvalHd .t{ font-size:15px; font-weight:800; color:#fff; letter-spacing:-.02em; }
.kmEvalItem{
  background:#0B1220; border:1px solid #1F2B45; border-radius:10px;
  padding:12px 14px; margin-top:8px;
  display:flex; gap:12px; align-items:center;
}
.kmEvalItem .lbl{ color:#9AAACB; font-size:13px; }
.kmEvalItem .val{ color:#fff; font-weight:800; margin-left:auto; }

/* 자료 다운로드 */
.kmDownList{ padding:14px 20px; display:flex; flex-direction:column; gap:8px; }
.kmDownList a{
  background:#11192A; border:1px solid #1F2B45; border-radius:10px;
  padding:12px 14px; color:#E5E9F0; text-decoration:none;
  display:flex; align-items:center; gap:10px; font-size:14px;
  transition:.15s;
}
.kmDownList a:hover{ border-color:#3C66C9; background:#15203A; transform:translateX(2px); }
.kmDownEmpty{ padding:30px; text-align:center; color:#9AAACB; font-size:13.5px; }

/* 정보 row */
.kmInfoRow{
  display:flex; gap:18px; padding:14px 20px;
  border-bottom:1px solid #1F2B45; font-size:13.5px;
}
.kmInfoRow .lbl{ color:#9AAACB; min-width:90px; }
.kmInfoRow .val{ color:#fff; flex:1; }

/* 모바일 — 사이드 차시목록 하단으로 이동 */
@media(max-width:960px){
  .kmPlayerWrap{ grid-template-columns:1fr; }
  .kmChapSide{ position:relative; top:0; min-height:auto; max-height:none; border-left:none; border-top:1px solid #1F2B45; }
  .kmChapList{ max-height:50vh; }
}

/* ============================================================
   2026 리뉴얼 — UI 디테일 수정 ('26.6 hotfix)
   1) reveal 안전망 — 어떤 조건에서도 본문이 영구히 안 보이는 일 방지
   2) GNB 폭 정리 (메뉴 다수 + 검색바 + 강조링크 겹침)
   3) 로고 크기
   4) 카테고리 이미지(투명 PNG) 카드 배경
   ============================================================ */

/* 1) reveal 안전망 — html.kmReveal-on 이면서 JS가 .kmIn을 못 붙인 경우(브라우저/관측 누락 등)
      에도 본문 콘텐츠는 보여야 한다. CSS 자체에 2초 페이드인 폴백을 깐다. */
html.kmReveal-on body.kmHome .kmIntroRow,
html.kmReveal-on body.kmHome .kmIntroRow .kmIntroCard,
html.kmReveal-on body.kmHome .kmInfoLead,
html.kmReveal-on body.kmHome .kmInfoH,
html.kmReveal-on body.kmHome .kmInfoGrid,
html.kmReveal-on body.kmHome .kmFlow,
html.kmReveal-on body.kmHome .kmNotice,
html.kmReveal-on body.kmHome .kmVBiz,
html.kmReveal-on body.kmHome .kmSecHead,
html.kmReveal-on body.kmHome .kmSteps,
html.kmReveal-on body.kmHome .kmGuideCards,
html.kmReveal-on body.kmHome .kmCourseRow,
html.kmReveal-on body.kmHome .kmArchiveRow,
html.kmReveal-on body.kmHome .kmCatGrid,
html.kmReveal-on body.kmHome .kmBottomGrid{
  opacity:1 !important;
  transform:none !important;
  animation:kmRevealSafe .8s ease forwards;
}
@keyframes kmRevealSafe { from{opacity:.4;transform:translateY(8px);} to{opacity:1;transform:none;} }

/* 2) GNB 폭 — 검색바 폭 줄이고 정렬 안정화, 강조링크는 검색바보다 우측 */
.kmNav .kmWrap{ gap:16px; flex-wrap:nowrap; }
.kmNav .kmMenu{ flex:1 1 auto; min-width:0; flex-wrap:nowrap; overflow:hidden; }
.kmNav .kmMenu li a{
  padding:10px 12px; font-size:14.5px;
  white-space:nowrap;
}
@media (min-width: 1401px){
  .kmNav .kmMenu li a{ padding:10px 14px; font-size:15px; }
}
/* 1200~1400px: 메뉴 항목 너무 빡빡할 때 일부 텍스트 좁힘 */
@media (min-width: 901px) and (max-width: 1280px){
  .kmNav .kmMenu li a{ padding:10px 10px; font-size:13.5px; }
}
/* 검색바 폭 축소 — 메뉴 다수 환경 */
.kmNav .kmSearchTop{ max-width:200px; flex-shrink:0; }
@media (min-width: 901px) and (max-width: 1280px){
  .kmNav .kmSearchTop{ display:none; }
}
.kmNav .kmNavRight{ gap:8px; flex-shrink:0; min-width:0; }

/* 강조링크 — 검색바 옆에 안정 배치 */
.kmMenu .kmMenuArchiveLink{
  margin-left:auto; flex-shrink:0;
}
.kmMenu .kmMenuArchiveLink > a{
  padding:8px 12px; font-size:13.5px; gap:5px;
}
.kmMenu .kmMenuArchiveLink .badge{ font-size:9.5px; padding:2px 5px; }
.kmMenu .kmMenuArchiveLink .arr{ font-size:12px; }

/* 3) 로고 — 작아 보이지 않게 확실히 키움 */
.kmLogo, .kmNav .kmLogo{
  display:inline-flex; align-items:center;
  flex-shrink:0;
}
.kmLogo img, .kmNav .kmLogo img{
  height:44px !important; width:auto;
  display:block;
}
@media (max-width: 900px){
  .kmLogo img, .kmNav .kmLogo img{ height:38px !important; }
}

/* nav 자체 높이 안정화 */
.kmNav{ min-height:78px; }
.kmNav .kmWrap{ min-height:78px; }

/* 4) 카테고리 이미지(투명 PNG) 카드 배경 — 체크무늬 보이지 않게 */
.kmVCard .th,
.kmCourseCard .thumb{
  background-color:#F1F5F9 !important; /* 안전한 라이트 배경 — 그라데이션과 합쳐짐 */
}
.kmVCard .th[style*="cat_"],
.kmCourseCard .thumb[style*="cat_"]{
  background-color:#fff !important; /* PNG 일러스트는 흰 배경 */
  background-size:contain !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
}
/* 안전 fallback — 어떤 카드든 투명 배경 노출 방지 */
.kmVGrid .kmVCard .th,
.kmCourseCard .thumb{
  background-color:#F1F5F9;
}

/* topbar/패밀리바 정리 — 패밀리바가 nav 위로 침범 안 하게 */
.kmTopBar{ padding:0; }
.kmTopBar .kmWrap{ min-height:38px; padding-top:0; padding-bottom:0; }
.kmTopBar .kmFamily{ padding:8px 0; }

/* GNB 드롭다운 (환급 카테고리 4종 단일 진입점) */
.kmMenuDrop{ position:relative; }
.kmMenuDrop > a{ display:inline-flex; align-items:center; gap:4px; }
.kmMenuDrop > a .caret{ font-size:10px; opacity:.7; transition:transform .15s; }
.kmMenuDrop:hover > a .caret{ transform:rotate(180deg); }
.kmMenuSub{
  position:absolute; top:100%; left:0; min-width:220px;
  background:#fff; border:1px solid var(--km-line);
  border-radius:14px; padding:8px;
  box-shadow:0 16px 40px -8px rgba(11,18,32,.18), 0 4px 12px rgba(11,18,32,.06);
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .15s ease, transform .15s ease, visibility .15s;
  list-style:none; margin:0;
  z-index:50;
}
.kmMenuDrop:hover .kmMenuSub,
.kmMenuDrop:focus-within .kmMenuSub{
  opacity:1; visibility:visible; transform:translateY(0);
}
.kmMenuSub li{ list-style:none; }
.kmMenuSub li a{
  display:block; padding:10px 14px !important; border-radius:10px;
  font-size:14px !important; color:var(--km-ink-2,#1f2937);
  background:transparent;
  white-space:nowrap;
}
.kmMenuSub li a:hover{
  background:var(--km-primary-light, #EAF2FF) !important;
  color:var(--km-primary) !important;
}

/* 모바일에서는 드롭다운 → 인라인 항목으로 펼침 */
@media(max-width: 900px){
  .kmMenuDrop > a .caret{ display:none; }
  .kmMenuSub{
    position:static; opacity:1; visibility:visible; transform:none;
    box-shadow:none; border:none; border-radius:0; padding:0;
    background:transparent;
  }
  .kmMenuSub li a{
    padding:14px 14px 14px 30px !important;
    font-size:14px !important;
    color:var(--km-ink-soft) !important;
  }
}

/* ============================================================
   2026 hotfix #2 — kmTrustStrip 양옆 검정 / GNB caret / 카드 contain
   ============================================================ */

/* kmTrustStrip — 슬라이더의 검정 배경(#0B1220) 이 양옆에 노출되지 않도록 통째로 흰 영역 위에 띄움 */
.kmTrustStrip{
  background:#fff !important; /* 양옆까지 흰색 */
  margin-top:0 !important;
  padding:32px 24px 0 !important;
  position:relative; z-index:5;
}
.kmTrustStrip .kmWrap{
  max-width:1240px; margin:0 auto;
  background:#fff; border:1px solid var(--km-line);
  border-radius:24px;
  padding:28px 32px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
  box-shadow:0 16px 40px -16px rgba(11,18,32,.12);
}
/* 슬라이더가 끝나는 자리에 흰 배경 보장 — body 자체 색 통일 */
body.kmHome{ background:#fff; }

/* GNB caret 정렬 — 상위 줄간격에 살짝 어긋난 것 보정 */
.kmMenuDrop > a{
  display:inline-flex !important; align-items:center !important;
  line-height:1 !important;
}
.kmMenuDrop > a .caret{
  display:inline-block; line-height:1; margin-top:1px;
}

/* 카드 카테고리 이미지 — 흰 배경 PNG로 바꿔 체크무늬 제거됐고,
   inline shorthand 안전성 강화 + cover로 카드 꽉차게 */
.kmVCard .th[style*="cat_"],
.kmCourseCard .thumb[style*="cat_"]{
  background-color:#fff !important;
  background-size:cover !important;   /* contain → cover, 카드 꽉 채움 */
  background-position:center !important;
  background-repeat:no-repeat !important;
}
.kmVCard .th[style*="categories/"]{
  background-color:#fff !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}

/* 슬라이더 아래쪽 색 누수 방지 — 슬라이더 끝에 흰 transition strip */
.kmBannerSlider{ margin-bottom:0; }
.kmBannerSlider + section{ background:#fff; }

/* topbar 파랑 잔존 영역 제거 — 패밀리바 하위 a.on의 호버/포커스 상태 색 정리 */
.kmTopBar .kmFamily a.on,
.kmTopBar .kmFamily a.on:hover{
  background:transparent !important;
  border:none !important;
}

/* nav + topbar 색/z-index 안정화 — 슬라이더 그라데이션이 nav 위로 침범하는 케이스 방지 */
.kmTopBar{
  background:#FAFAFC !important;
  border-bottom:1px solid #ECEFF3;
  position:relative; z-index:5;
}
.kmTopBar .kmWrap{ background:transparent; }
.kmTopBar .kmFamily a.on{
  background:transparent !important;
  border:none !important;
  padding:0 !important;
}

.kmNav{
  background:#fff !important;
  position:sticky; top:0;
  z-index:1001 !important;
  border-bottom:1px solid var(--km-line);
}

/* 슬라이더는 nav 보다 항상 아래 */
.kmBannerSlider{ position:relative; z-index:1; }