@charset "UTF-8";

/** header, gnb, snb, lnb, container 등 모든 페이지에 공통으로 들어가는 틀 */

.inner { position:relative; padding:0 40px; margin:0 auto; width:1440px; }
@media all and (max-width:1440px) { .inner { width:100%; } }
@media all and (max-width:1024px) { .inner { padding:0 32px; } }
@media all and (max-width:768px)  { .inner { padding:0 24px; } }
@media all and (max-width:425px)  { .inner { padding:0 16px; } }


/* ===== HEADER ===== */
#header { position:sticky; top:0; z-index:100; width:100%; background:#fff; border-bottom:1px solid #f0f0f0; transition:box-shadow .3s; }
#header.scrolled { box-shadow:0 4px 24px rgba(0,0,0,0.07); }
#top { display:none; }

/* ===== GNB ===== */
#gnb { background:#fff; box-shadow:none; border-bottom:none; }
.depth1 { display:flex; align-items:center; justify-content:space-between; width:1280px; margin:0 auto; padding:0 40px; height:68px; }
.depth1 > li { width:auto; height:auto; text-align:left; }
.depth1 > li > a { display:inline-flex; align-items:center; gap:4px; padding:8px 20px; height:40px; font-size:1.5rem; font-family:inherit; font-weight:500; color:#444; letter-spacing:0; border-radius:8px; text-decoration:none; transition:color .15s, background .15s; }
.depth1 > li > a:hover,
.depth1 > li > a:focus { color:var(--color-main); background:var(--color-p99); }

/* 로고 */
.depth1 .logo-area a { display:inline-flex; align-items:center; gap:8px; text-decoration:none; }
.depth1 .logo-area img { height:32px; width:auto; }
.depth1 .logo-area .logo-txt { font-size:2.0rem; font-weight:800; color:#111; letter-spacing:-0.5px; }
.depth1 .logo-area .logo-txt em { color:var(--color-main); font-style:normal; }

/* GNB 메뉴 */
.depth1 .gnb-menu { display:flex; align-items:center; gap:70px; }
.depth1 .gnb-menu > li { position:relative; }
.depth1 .gnb-menu > li > a .arr { font-size:1.8rem; width:18px; height:18px; color:#bbb; transition:transform .2s; vertical-align:middle; }
.depth1 .gnb-menu > li.open > a .arr { transform:rotate(180deg); }

/* depth2 드롭다운 */
.depth2 { display:none; position:absolute; top:100%; left:50%; transform:translateX(-50%);
    margin-top:4px; background:#fff; border:1px solid #efefef; border-radius:10px; padding:4px;
    min-width:auto; width:max-content; box-shadow:0 8px 32px rgba(0,0,0,0.09);
    z-index:300; overflow:visible; }
.depth2::before { content:''; position:absolute; top:-12px; left:0; width:100%; height:12px; }
.depth2.on { display:block; }
.gnb-menu > li.open .depth2 { display:block; }
.depth2 .inner { display:block; padding:0; margin:0; width:auto; }
.depth2 .leftTit { display:none; }

/* dep2 */
.dep2 { position:static; display:flex; flex-direction:column; gap:0; padding:0; width:100%; text-align:left; }
.dep2::before { display:none; }
.dep2 > li { display:block; }
.dep2 > li > a { display:block; width:100%; padding:7px 14px; min-height:auto; height:auto;
    color:#555; background:transparent; border-radius:8px; font-size:1.4rem; font-weight:400;
    text-align:left; white-space:nowrap; text-decoration:none; transition:background .12s, color .12s; }
.dep2 > li > a:hover,
.dep2 > li:hover > a { background:var(--color-p99); color:var(--color-main); }
.dep2.row { flex-direction:column; align-items:flex-start; flex-wrap:nowrap; }
.dep2.row > li > a { height:auto; min-width:auto; }

/* depth3 */
.depth3 { position:static; display:flex; flex-direction:column; gap:0;
    padding:2px 0 4px 10px; min-height:auto; width:100%; flex-wrap:nowrap; }
.depth3::before { display:none; }
.depth3 a { display:block; padding:7px 14px; font-size:1.3rem; color:#888;
    border-radius:6px; white-space:nowrap; text-decoration:none; }
.depth3 a:hover,
.depth3 a:focus { background:var(--color-p99); color:var(--color-main); }
.depth3 a .micon { display:none; }

/* 우측 유틸 */
.depth1 .gnb-util { display:flex; align-items:center; gap:8px; }
.depth1 .gnb-util .user-name { font-size:1.4rem; color:#555; font-weight:500; }
.depth1 .gnb-util .btn-login { display:inline-flex; align-items:center; padding:0 18px; height:36px; font-size:1.4rem; font-weight:500; color:#555; border:1px solid #e0e0e0; border-radius:20px; background:#fff; text-decoration:none; transition:all .15s; }
.depth1 .gnb-util .btn-login:hover { border-color:var(--color-main); color:var(--color-main); }
.depth1 .gnb-util .btn-join { display:inline-flex; align-items:center; padding:0 18px; height:36px; font-size:1.4rem; font-weight:600; color:#fff; background:var(--color-main); border:1px solid var(--color-main); border-radius:20px; text-decoration:none; transition:all .15s; }
.depth1 .gnb-util .btn-join:hover { background:var(--color-sub); border-color:var(--color-sub); }
.depth1 .gnb-util .btn-logout { font-size:1.4rem; color:#aaa; background:none; border:none; cursor:pointer; padding:8px; text-decoration:none; transition:color .15s; }
.depth1 .gnb-util .btn-logout:hover { color:#111; }

/* 햄버거 */
.depth1 .btn-hamburger { display:none; flex-direction:column; justify-content:center; gap:5px; width:40px; height:40px; padding:8px; background:none; border:none; cursor:pointer; }
.depth1 .btn-hamburger span { display:block; width:100%; height:2px; background:#333; border-radius:2px; transition:all .3s; }

@media all and (max-width:1280px) { .depth1 { width:100%; } }
@media all and (max-width:1024px) { .depth1 { padding:0 24px; } }
@media all and (max-width:768px) {
    .depth1 .gnb-menu { display:none; }
    .depth1 .gnb-util .btn-login,
    .depth1 .gnb-util .btn-join { display:none; }
    .depth1 .btn-hamburger { display:flex; }
}


/* ===== 전체메뉴 (모바일) ===== */
#allmenu {
    margin-right:-100%; z-index:102; position:fixed;
    right:0; top:0; background:#fff;
    height:100vh; width:320px;
    overflow-y:auto; overflow-x:hidden;
    box-shadow:-4px 0 24px rgba(0,0,0,0.12);
    transition:margin-right .3s ease;
    display:flex; flex-direction:column;
}
#allmenu .allHead {
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 24px;
    border-bottom:1px solid #f0f0f0;
    flex-shrink:0;
}
#allmenu .allHead .tit { font-size:1.4rem; font-family:inherit; color:#111; font-weight:600; }
#allmenu .allHead .tit.gray { color:#999; font-weight:400; }
#allmenu .allHead .tit .name { color:var(--color-main); }
#allmenu .allHead .logMenu { display:inline-flex; align-items:center; gap:8px; }
#allmenu .allHead .logMenu > li { display:inline-flex; align-items:center; }
#allmenu .allHead .logMenu a {
    display:inline-flex; align-items:center; gap:4px;
    font-size:1.3rem; color:#666; text-decoration:none;
    padding:6px 12px; border-radius:20px; border:1px solid #e0e0e0;
    transition:all .15s;
}
#allmenu .allHead .logMenu a:hover { border-color:var(--color-main); color:var(--color-main); }
#allmenu .allHead .logMenu a .micon { font-size:16px; width:16px; height:16px; }

/* 메뉴 리스트 */
#allmenu .menuListW {
    flex:1; padding:8px 0;
    background:#fff; height:auto; overflow:visible;
    padding-left:0; margin-top:0;
}
#allmenu .mGnb {
    position:static; display:flex; flex-direction:column;
    gap:0; padding:0; width:100%; height:auto;
    background:transparent;
}
#allmenu .mGnb > li { width:100%; }

/* depth1 메뉴 */
#allmenu .mGnb > li > a {
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 24px; width:100%;
    font-size:1.5rem; font-weight:600; color:#111;
    border-radius:0; background:transparent;
    border-bottom:1px solid #f0f0f0;
    transition:color .15s, background .15s;
    min-height:auto; text-decoration:none;
}
#allmenu .mGnb > li > a:hover { color:var(--color-main); background:var(--color-p99); }
#allmenu .mGnb > li > a.on { color:var(--color-main); background:var(--color-p99); }
#allmenu .mGnb > li > a .arr { font-size:1.8rem; width:18px; height:18px; transition:transform .2s; flex-shrink:0; }
#allmenu .mGnb > li > a.on .arr { transform:rotate(180deg); }

/* depth2 하위메뉴 */
#allmenu .mGnb .dep02 { display:none; width:100%; background:#f9f9f9; }
#allmenu .mGnb .dep02 > li { border-bottom:1px solid #eee; }
#allmenu .mGnb .dep02 > li:last-child { border-bottom:none; }
#allmenu .mGnb .dep02 > li > a.tit {
    display:flex; align-items:center;
    padding:11px 24px 11px 36px;
    font-size:1.4rem; font-weight:400; color:#777;
    text-decoration:none; width:100%;
    background:#f9f9f9; border-bottom:none; border-radius:0;
    border-left:3px solid var(--color-p80);
    min-height:auto; transition:color .15s, background .15s;
}
#allmenu .mGnb .dep02 > li > a.tit:hover { color:var(--color-main); background:var(--color-p99); }

/* 닫기 버튼 */
#allmenu .close {
    position:static; display:flex; align-items:center; justify-content:center;
    width:32px; height:32px; border-radius:100%;
    background:#f5f5f5; color:#666;
    text-decoration:none; flex-shrink:0;
    transition:background .15s;
}
#allmenu .close:hover { background:#e0e0e0; }
#allmenu .close .micon { font-size:18px; width:18px; height:18px; }

/* 언어선택 */
#allmenu .lang { display:none; margin:0; width:100%; padding:16px 24px; border-top:1px solid #f0f0f0; }

@media all and (max-width:425px) {
    #allmenu { width:100%; }
    #allmenu a { font-size:1.4rem !important; }
}


/* ===== 서브 히어로 ===== */
#subHero { background:linear-gradient(135deg, #fff9f7 0%, #fff 60%, #f0f3ff 100%); border-bottom:1px solid #f0f0f0; padding:56px 0 48px; }
#subHero .hero-inner { width:1280px; margin:0 auto; padding:0 40px; }
#subHero .hero-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 14px; background:var(--color-p20); color:#fff; font-size:1.2rem; font-weight:700; border-radius:20px; letter-spacing:0.5px; margin-bottom:16px; }
#subHero .hero-title { font-size:3.6rem; font-weight:900; color:#111; letter-spacing:-1.5px; line-height:1.2; margin-bottom:12px; }
#subHero .hero-desc { font-size:1.6rem; color:#888; line-height:1.6; }

@media all and (max-width:1280px) { #subHero .hero-inner { width:100%; } }
@media all and (max-width:1024px) { #subHero .hero-inner { padding:0 24px; } }
@media all and (max-width:768px) {
    #subHero { padding:40px 0 32px; }
    #subHero .hero-inner { padding:0 20px; }
    #subHero .hero-title { font-size:2.8rem; }
    #subHero .hero-desc { font-size:1.4rem; }
}


/* ===== 서브 탭 메뉴 ===== */
#subTabMenu { background:#fff; border-bottom:1px solid #efefef; }
#subTabMenu .tab-inner { display:flex; align-items:center; width:1280px; margin:0 auto; padding:0 40px; }
.sub-tab-list { display:flex; align-items:center; gap:0; list-style:none; padding:0; margin:0; }
.sub-tab-list li a { display:inline-flex; align-items:center; padding:14px 22px; font-size:1.45rem; font-weight:500; color:#999; text-decoration:none; white-space:nowrap; border-bottom:2px solid transparent; transition:color .15s, border-color .15s; }
.sub-tab-list li a:hover { color:#333; }
.sub-tab-list li a.on { color:var(--color-main); font-weight:700; border-bottom:2px solid var(--color-main); }

@media all and (max-width:1280px) { #subTabMenu .tab-inner { width:100%; } }
@media all and (max-width:1024px) { #subTabMenu .tab-inner { padding:0 24px; } }
@media all and (max-width:768px) {
    #subTabMenu .tab-inner { padding:0; overflow-x:auto; -webkit-overflow-scrolling:touch; }
    #subTabMenu .tab-inner::-webkit-scrollbar { display:none; }
    .sub-tab-list li a { padding:12px 16px; font-size:1.35rem; }
}


/* ===== 푸터 ===== */
#footer { position:relative; bottom:0; margin-top:0; width:100%; background:#fff; border-top:1px solid #f0f0f0; }
#footer .fotT { background:#fff; }
#footer .fotT .inner { display:grid; grid-template-columns:280px 1fr 1fr; gap:60px; padding-top:56px; padding-bottom:48px; align-items:start; height:auto; text-align:left; justify-content:initial; }
.fot-brand .fot-logo { font-size:2.0rem; font-weight:800; color:#111; letter-spacing:-0.5px; margin-bottom:12px; display:block; text-decoration:none; }
.fot-brand .fot-logo em { color:var(--color-main); font-style:normal; }
.fot-brand .fot-tagline { font-size:1.4rem; color:#777; line-height:1.7; margin-bottom:24px; }
.fot-brand .fot-info { display:flex; flex-direction:column; gap:8px; }
.fot-brand .fot-info li { display:flex; align-items:center; gap:8px; font-size:1.4rem; color:#666; }
.fot-brand .fot-info li .micon { font-size:16px; width:16px; height:16px; color:#aaa; }
.fot-col .fot-col-title { font-size:1.5rem; font-weight:700; color:#111; margin-bottom:16px; }
.fot-col ul { display:flex; flex-direction:column; gap:10px; }
.fot-col ul li a { font-size:1.4rem; color:#777; text-decoration:none; transition:color .2s; }
.fot-col ul li a:hover { color:var(--color-main); }
#footer .fotB { background:#fff; }
#footer .fotB .inner { display:flex; align-items:center; justify-content:space-between; padding-top:20px; padding-bottom:20px; height:auto; border-top:1px solid #f0f0f0; }
#footer .fotB ul li { display:flex; gap:0; color:#aaa; flex-wrap:nowrap; }
#footer .fotB ul li.fotC { font-size:1.3rem; }
.fot-policy { display:flex; align-items:center; gap:24px; }
.fot-policy a { font-size:1.3rem; color:#777; text-decoration:none; transition:color .2s; }
.fot-policy a:hover { color:#111; }
.fot-policy a.strong { font-weight:600; color:#444; }
#footer .fotT ul, #footer .fotT .fotLink { display:block; gap:0; height:auto; }
#footer .fotT li, #footer .fotT li a { display:block; height:auto; color:inherit; }

@media all and (max-width:1024px) {
    #footer .fotT .inner { grid-template-columns:1fr 1fr; gap:40px; }
    .fot-brand { grid-column:1 / -1; }
}
@media all and (max-width:768px) {
    #footer .fotT .inner { grid-template-columns:1fr 1fr; gap:32px; padding-top:40px; padding-bottom:32px; }
    .fot-brand { grid-column:1 / -1; }
    #footer .fotB .inner { flex-direction:column; gap:12px; text-align:center; padding-top:16px; padding-bottom:24px; }
}
@media all and (max-width:425px) { #footer .fotT .inner { grid-template-columns:1fr; } }


/* ===== CONTAINER ===== */
#container { position:relative; margin-bottom:80px; min-height:calc(100vh - 400px); }
#container .inner { display:flex; align-items:flex-start; gap:56px; margin-top:32px; }
#conArea { width:100%; }

@media all and (max-width:1024px) { #container .inner { margin-top:32px; } }
@media all and (max-width:768px)  { #container .inner { margin-top:24px; } }
@media all and (max-width:425px)  { #container .inner { margin-top:16px; } }


/* ===== SNB (사용 시) ===== */
#snb { position:relative; width:280px; border-radius:24px; overflow:hidden; background:linear-gradient(290deg, #E67B63, #B35F4E); }
#snb .snbTit { display:flex; align-items:center; justify-content:center; height:130px; font-size:2.8rem; font-family:'Godo'; color:#fff; text-shadow:2px 2px 0 rgba(0,0,0,0.2); }
#snb .list { position:relative; display:flex; flex-direction:column; padding:8px 24px; background:#fff; border-radius:24px; border:1px solid #dbdbdb; }
#snb .list .dep02 > .txt { display:inline-flex; align-items:center; justify-content:space-between; padding:8px 16px; height:60px; width:100%; border-bottom:1px solid #dbdbdb; font-size:1.8rem; text-decoration:none; }
#snb .list .dep02:last-child > .txt { border-bottom:0; }
#snb .list .dep02 > .txt.on { color:var(--color-main); font-weight:500; }
#snb .dep03 { display:none; flex-direction:column; padding:4px 16px; border-top:1px solid var(--color-main); border-bottom:1px solid var(--color-main); }
#snb .dep03.on { display:flex; }
#snb .dep03 > li > a { display:inline-flex; align-items:center; justify-content:space-between; height:48px; width:100%; color:#777; }
#snb .dep03 > li > a:hover { color:#111; }
#snb .dep04 { display:none; flex-direction:column; gap:8px; padding:12px 16px; background:#f9f9f9; border-radius:8px; font-size:1.4rem; }
#snb .dep04.on { display:flex; }
#snb .dep04 > li > a { display:inline-flex; align-items:center; color:#777; width:100%; }
#snb .dep04 > li > a:hover { text-decoration:underline; color:var(--color-main); }
@media all and (max-width:1024px) { #snb { display:none; } }


/* ===== 서브타이틀 ===== */
.title_area { display:flex; flex-direction:row; align-items:flex-end; justify-content:space-between; padding-bottom:16px; margin-bottom:32px; border-bottom:1px solid #dbdbdb; }
.title_area .left { display:flex; flex-direction:column; gap:8px; }
.title_area .left .lnb { display:flex; align-items:center; gap:32px; }
.title_area .left .lnb > li { display:flex; align-items:center; justify-content:center; }
.title_area .left .lnb a { position:relative; display:inline-flex; align-items:center; justify-content:center; color:#999; text-decoration:none; cursor:default; }
.title_area .left .lnb > li:not(:first-of-type) a:hover { text-decoration:none; }
.title_area .left .lnb > li:not(:last-of-type) a::before { position:absolute; content:''; right:-16px; top:50%; width:8px; height:8px; border-right:1px solid #999; border-bottom:1px solid #999; transform:translateY(-50%) rotate(315deg); }
.title_area .right { display:flex; align-items:center; gap:8px; }
.title_area .right a { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; background:#f5f5f5; border-radius:100%; transition:.3s; text-decoration:none; }
.title_area .right a .micon { width:16px; height:16px; font-size:1.6rem; color:#777; transition:.3s; }
.title_area .right a:hover { background:var(--color-main); }
.title_area .right a:hover .micon { color:#fff; }
.title_area .right a.on { background:var(--color-main); }
.title_area .right a.on .micon { color:#fff; }
.title_area .right.util > li { position:relative; }
.title_area .right .snsList { z-index:1; position:absolute; display:inline-flex; flex-direction:column; gap:4px; padding:4px; right:0; top:48px; background:#f5f5f5; border-radius:100px; box-shadow:0 0 15px rgba(65,57,147,0.3); }
.title_area .right .snsList a { text-indent:-9999px; font-size:0; width:32px; height:32px; }
.title_area .right .snsList a.shareKa { background:#FEE500 url(../images/common/kakao.svg) no-repeat 50% 50%; }
.title_area .right .snsList a.shareNa { background:#03C75A url(../images/common/naver.svg) no-repeat 50% 50%; }
.title_area .right .snsList a:hover { box-shadow:none; }

.subTit { margin-top:24px; margin-bottom:56px; font-size:3.6rem; font-weight:600; line-height:normal; text-align:center; }
.title_area .subTit { text-align:left; margin-top:0; margin-bottom:0; display:none; }

@media all and (max-width:1440px) {
    .subTit { font-size:2.8rem; margin-top:8px; margin-bottom:32px; }
    .title_area .left .lnb a { font-size:1.4rem; }
}
@media all and (max-width:1024px) {
    .subTit { font-size:2.4rem; }
    .title_area .left .lnb { gap:16px; }
    .title_area .left .lnb > li:not(:last-of-type) a::before { right:-9px; width:4px; height:4px; }
    .title_area .left .lnb a { font-size:1.2rem; }
}
@media all and (max-width:768px) {
    .title_area { margin-bottom:24px; }
    .title_area .left { gap:4px; }
}
@media all and (max-width:425px) {
    .title_area { flex-direction:column; align-items:center; justify-content:flex-start; gap:8px 0; margin-bottom:16px; }
    .title_area .left { align-items:center; }
    .title_area .left .lnb { display:none; }
    .title_area .right a { width:32px; height:32px; }
    .title_area .right a .micon { width:14px; height:14px; font-size:1.4rem; }
    .subTit { margin-top:0; margin-bottom:24px; }
    .title_area .right .snsList { right:auto; left:50%; transform:translateX(-50%); top:36px; }
}


/* ===== 공지사항, 게시판 ===== */
.listTop { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:8px; }
.listTop .total { display:inline-flex; align-items:center; gap:4px; font-size:var(--fz-bodyM); }
.listTop .total .micon { font-size:var(--fz-bodyM); width:var(--fz-bodyM); }
.listTop .total .em { color:var(--color-main); font-weight:500; }
.listTop .srhS { display:flex; gap:8px; }
.listTop .srhS .select { min-width:120px; }
.listTop .srhS .select select { height:40px; width:100%; border:0; box-shadow:0 0 4px rgba(0,0,0,0.2); }
.listTop .srhS .inpEnroll { display:flex; align-items:center; height:40px; border-radius:8px; box-shadow:0 0 4px rgba(0,0,0,0.2); background:#fff; overflow:hidden; }
.listTop .srhS .inpEnroll .txtinp { width:calc(100% - 40px); }
.listTop .srhS .inpEnroll .txtinp input { width:100%; height:40px; font-size:1.4rem; border:0; }
.listTop .srhS .inpEnroll .btn.search { height:100%; width:40px; min-width:auto; background:var(--color-main); border:0; border-radius:0; }
.listTop .srhS .inpEnroll .btn.search .micon { font-size:18px; width:18px; height:18px; color:#fff; }
.subSet { display:flex; flex-direction:column; gap:8px; }

.tbl { width:100%; max-width:100%; overflow:hidden; table-layout:fixed; border-top:2px solid var(--color-main); border-bottom:1px solid #dbdbdb; }
.tbl th { padding:12px 8px; overflow:hidden; }
.tbl td { padding:16px 8px; overflow:hidden; }
.tbl tr { border-bottom:1px solid #e5e5e5; }
.tbl tbody tr:last-child { border-bottom:0; }
.tbl thead { background:#f5f5f5; }
.tbl thead th { text-align:center; font-size:1.4rem; color:#111; font-weight:600; }
.tbl tbody tr { background:#fff; }
.tbl tbody td:not(.cont) { text-align:center; font-size:1.4rem; }
.tbl tbody td.cont * { display:inline-block; width:100%; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; }
.tbl tbody td.cont a { position:relative; padding-left:24px; }
.tbl tbody td.cont a .micon { position:absolute; left:0; top:4px; width:18px; height:18px; font-size:18px; color:#777; }
.tbl tbody td .state { font-weight:500; color:#777; }
.tbl tbody td .state.ok { color:var(--color-main); }
.tbl tbody td .micon { display:block; margin:0 auto; width:20px; height:20px; font-size:20px; }
.wd01 { width:8%; } .wd02 { width:14%; } .wd03 { width:20%; } .wd04 { width:40%; } .wd05 { width:50%; } .wd06 { width:60%; }

@media all and (max-width:768px) {
    .listTop .srhS .select { min-width:100px; }
    .listTop .srhS .select select, .listTop .srhS .inpEnroll { height:32px; }
    .listTop .srhS .inpEnroll .txtinp { width:calc(100% - 32px); }
    .listTop .srhS .inpEnroll .txtinp input { height:32px; font-size:1.2rem; }
    .listTop .srhS .inpEnroll .btn.search { width:32px; }
    .tbl colgroup, .tbl thead, .tbl .web { display:none; }
    .tbl tbody tr { display:block; padding:8px; }
    .tbl tbody tr td { display:inline-block; }
    .tbl tbody tr td.cont { display:block; width:100%; }
    .tbl tbody td { padding:0; }
    .tbl tbody td:not(.cont) { margin-right:1.5rem; font-size:1.4rem; color:#444; }
    .tbl tbody td:not(.cont):last-child { margin-right:0; }
    .tbl tbody td:not(.cont)::before { display:inline-block; content:attr(data-cell-header); margin-right:4px; color:#999; }
    .tbl tbody td.cont { margin-bottom:.5rem; }
    .tbl tbody td.cont * { font-weight:500; }
}
@media all and (max-width:425px) {
    .tbl tbody td.cont { margin-bottom:0; }
    .tbl tbody td:not(.cont) { font-size:1.2rem; }
    .tbl tbody td.mob { display:none; }
}


/* ===== 상세화면 ===== */
.detPage .thead { padding:32px; background:#f5f5f5; border-radius:16px 16px 0 0; }
.detPage .thead .label, .detPage .thead .state { display:inline-flex; align-items:center; justify-content:center; margin-bottom:8px; background:#fff; padding:4px 16px; border-radius:100px; border:1px solid #dbdbdb; color:#777; font-weight:500; font-size:1.4rem; }
.detPage .thead .label.ok { color:var(--color-main); border:1px solid var(--color-main); }
.detPage .thead .tit { font-size:2.4rem; font-weight:500; }
.detPage .thead .etc { display:flex; align-items:center; flex-wrap:wrap; gap:0 24px; }
.detPage .thead .etc li { position:relative; display:inline-flex; align-items:center; gap:4px; font-size:1.4rem; color:#444; }
.detPage .thead .etc li:not(:last-of-type)::before { position:absolute; content:''; right:-14px; top:50%; transform:translateY(-50%); width:2px; height:2px; border-radius:100%; background:#444; }
.detPage .fileDwn { padding:16px 32px; border-bottom:1px solid #dbdbdb; }
.detPage .fileDwn .list { display:flex; flex-direction:column; width:100%; }
.detPage .fileDwn .list li { display:inline-flex; align-items:center; gap:8px; width:100%; }
.detPage .fileDwn .list li .micon { width:16px; height:16px; font-size:16px; color:var(--color-main); }
.detPage .fileDwn .list li a { max-width:calc(100% - 90px); overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#444; font-size:1.4rem; }
.detPage .fileDwn .list li .kb { font-size:1.2rem; color:#777; }
.detPage .tbody { padding:32px; min-height:400px; border-bottom:1px solid #dbdbdb; }
.detPage .tbody * { font-family:'NSN' !important; line-height:1.7 !important; letter-spacing:-.05em !important; }
.detPage .tbody img { display:block; margin:0 auto; max-width:100%; }
.detPage .tfoot { display:flex; border-bottom:1px solid #bdbdbd; min-height:200px; }
.detPage .tfoot .tit { display:inline-flex; align-items:center; justify-content:center; gap:4px; background:#f9f9f9; width:140px; font-size:1.8rem; font-weight:500; }
.detPage .tfoot .tit .micon { width:18px; height:18px; font-size:18px; color:var(--color-main); }
.detPage .tfoot .text_area { display:inline-flex; justify-content:center; flex-direction:column; gap:24px; padding:32px; width:calc(100% - 140px); }
.detPage .tfoot .text_area .etc { display:inline-flex; align-items:center; gap:24px; }
.detPage .tfoot .text_area .etc li { position:relative; font-size:1.4rem; color:#777; }
.detPage .tfoot .text_area .etc li:not(:last-of-type)::before { position:absolute; content:''; right:-14px; top:50%; transform:translateY(-50%); width:2px; height:2px; border-radius:100%; background:#777; }

@media all and (max-width:1024px) {
    .detPage .thead .tit { font-size:2.0rem; }
    .detPage .thead .label, .detPage .thead .state { height:32px; }
}
@media all and (max-width:768px) {
    .detPage .thead, .detPage .tbody { padding:24px; }
    .detPage .fileDwn { padding:16px; }
    .detPage .tfoot { flex-direction:column; }
    .detPage .tfoot .tit { width:100%; height:48px; font-size:1.6rem; }
    .detPage .tfoot .text_area { padding:24px; width:100%; }
}
@media all and (max-width:425px) {
    .detPage .thead { border-radius:8px 8px 0 0; }
    .detPage .thead, .detPage .tbody, .detPage .tfoot .text_area { padding:16px; }
    .detPage .tbody { min-height:240px; }
    .detPage .tfoot .tit { height:40px; font-size:1.4rem; }
    .detPage .tfoot .text_area { gap:16px; }
}


/* ===== 앨범형 리스트 ===== */
.album { display:flex; gap:24px; flex-wrap:wrap; margin-top:16px; }
.album > li { position:relative; width:calc(100%/3 - 16px); }
.album > li a { position:relative; display:inline-flex; flex-direction:column; width:100%; height:100%; border-radius:16px; overflow:hidden; text-decoration:none; transition:.3s; }
.album > li a .imgW { position:relative; padding-top:65%; border-radius:16px; background:#f5f5f5; overflow:hidden; transition:.3s; }
.album > li a .imgW img { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); min-width:100%; }
.album > li a .txt_W { display:flex; flex-direction:column; gap:12px; padding:24px 8px; transition:.3s; }
.album > li a .txt_W .tit { font-weight:600; height:55px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.album > li a .etc { display:flex; align-items:center; justify-content:space-between; }
.album > li a .etc li { display:inline-flex; gap:8px; font-size:1.4rem; color:#777; }
.album > li a:hover, .album > li a:focus { box-shadow:0 0 15px rgba(238,79,127,0.2); }
.album > li a:hover .imgW img, .album > li a:focus .imgW img { filter:blur(5px); }
.album > li a:hover .txt_W, .album > li a:focus .txt_W { padding:24px; }
.album > li a:hover .txt_W .tit, .album > li a:focus .txt_W .tit { color:var(--color-point); }

@media all and (max-width:768px) {
    .album { gap:16px; }
    .album > li { width:calc(50% - 8px); }
    .album > li a { border:1px solid #dbdbdb; }
    .album > li a .imgW { border-radius:16px 16px 0 0; }
    .album > li a .txt_W { padding:16px; }
}
@media all and (max-width:425px) {
    .album > li { width:100%; }
    .album > li a .imgW { padding-top:55%; }
}


/* ===== 탭 on/off ===== */
.tab_list > li { display:none; }
.tab_list > li.on { display:block; }


/* ===== 검색박스 ===== */
.srhBox { display:flex; flex-direction:column; gap:8px; align-items:center; justify-content:center; padding:24px; margin-bottom:24px; background:#f5f5f5; border-radius:16px; }
.srhBox .srhTop { display:flex; flex-wrap:wrap; gap:8px; }
.srhBox .srhTop > li { display:flex; flex-wrap:wrap; gap:8px; }
.srhBox .calenSet { border:0; box-shadow:0 0 4px rgba(0,0,0,0.2); height:40px; border-radius:8px; }
.srhBox .calenSet .calendar { width:220px; }
.srhBox select { border:0; box-shadow:0 0 4px rgba(0,0,0,0.2); height:40px; }
.srhBox .inpEnroll { display:flex; align-items:center; height:40px; border-radius:8px; box-shadow:0 0 4px rgba(0,0,0,0.2); background:#fff; overflow:hidden; }
.srhBox .inpEnroll .txtinp { width:calc(100% - 40px); }
.srhBox .inpEnroll .txtinp input { width:100%; height:40px; font-size:1.4rem; border:0; outline:none; }
.srhBox .inpEnroll .btn.search { height:100%; width:40px; min-width:auto; background:var(--color-main); border:0; border-radius:0; }
.srhBox .inpEnroll .btn.search .micon { font-size:18px; width:18px; height:18px; color:#fff; }
.srhBox3 { flex-direction:row; }
.srhBox3 .srhTop { flex-direction:row; flex-wrap:nowrap; }
.srhBox3 select { max-width:200px; }
.srhBox3 .inpEnroll .txtinp { width:auto; }

@media all and (max-width:768px) {
    .srhBox { padding:16px; }
    .srhBox .srhTop { flex-direction:column; gap:8px; width:100%; max-width:350px; }
    .srhBox .srhTop > li, .srhBox label, .srhBox select { width:100%; max-width:350px; }
    .srhBox .inpEnroll { width:100% !important; max-width:350px; }
    .srhBox .calenSet { width:100%; max-width:350px; }
    .srhBox .calenSet .calendar { width:50%; }
    .srhBox3 { flex-direction:column; }
    .srhBox3 .inpEnroll .txtinp { width:100%; }
}
@media all and (max-width:425px) {
    .srhBox .calenSet { display:flex; flex-direction:column; height:auto; }
    .srhBox .calenSet .calendar { width:100%; height:40px; }
}

.srhBoxNew .stage { display:flex; flex-direction:column; gap:8px; margin:0 auto; }
.srhBoxNew .stage > .stageDiv { display:flex; gap:16px; }
.srhBoxNew .stage > .stageDiv .div { display:flex; gap:8px; width:100%; }
.srhBoxNew .stage .tit { position:relative; transform:translateY(10px); font-size:1.4rem; font-weight:500; color:#777; text-align:justify; width:60px; height:40px; }
.srhBoxNew .stage .tit::after { content:''; display:inline-block; width:100%; }
.srhBoxNew .stage .inp { width:234px; }
.srhBoxNew .stage .inp.block { width:calc(100% - 58px); }
.srhBoxNew .stage .selDiv { display:flex; gap:8px; width:calc(100% - 58px); }
.srhBoxNew .stage .selDiv .inp { display:inline-block; width:113px; }
.srhBoxNew .inpDate { box-shadow:none; width:115px; }
.srhBoxNew .inpEnroll, .srhBoxNew .calenSet { width:calc(100% - 58px); }
.srhBoxNew .inpEnroll .inp { width:calc(100% - 40px) !important; height:40px; border:0; }

@media all and (max-width:768px) {
    .srhBoxNew .stage { width:auto; }
    .srhBoxNew .stage .tit { font-size:1.2rem; }
    .srhBoxNew .stage .inp { width:calc(100% - 58px); }
    .srhBoxNew .stage .selDiv .inp { width:calc(50% - 4px); }
    .srhBoxNew .stage > .stageDiv { flex-direction:column; gap:8px; }
    .srhBoxNew .calenSet { flex-direction:column; height:auto; width:calc(100% - 58px); }
    .srhBoxNew .calenSet .calendar { width:100%; height:40px; }
    .srhBoxNew .inpEnroll { width:calc(100% - 58px) !important; }
}
@media all and (max-width:425px) { .srhBoxNew .stage { width:100%; } }


/* ===== 카테고리 ===== */
.borad_Category_area > ul { display:flex; flex-direction:row; gap:8px; }
.borad_Category_area > ul > li { margin-bottom:5px; }
.borad_Category_area > ul > li > a { display:inline-block; padding:2px 20px; font-size:14px; color:#666; font-weight:400; border:1px solid #e5e5e5; text-align:center; border-radius:15px; }
.borad_Category_area > ul > li > a.on { border:1px solid var(--color-main); background-color:var(--color-main); color:#fff; }
.borad_Category_area > ul > li > a:hover { text-decoration:none; border:1px solid var(--color-main); color:var(--color-main); }
.borad_Category_area > ul > li > a.on:hover { color:#fff; }
