/* =========================================================
   NEIMIN — Sub-page shared styles
   Used by: notices/ (list + articles), performance-list/
   Aligns with main page design language: dark navy gradient,
   brand blue accents, motion reveals, refined typography.
   ========================================================= */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
    font-family:'Noto Sans KR','Montserrat',sans-serif;
    color:#fff;
    background:linear-gradient(180deg,#1a3a6b 0%,#0f2748 50%,#081a35 100%);
    min-height:100vh;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    -webkit-tap-highlight-color:transparent;
}
a{text-decoration:none;color:inherit;-webkit-tap-highlight-color:transparent}
ul,li{list-style:none}
img{max-width:100%;display:block}
em,i{font-style:normal}
button{border:none;background:none;cursor:pointer;font-family:inherit;color:inherit}

:root{
    --primary:#1E90FF;
    --primary-2:#4FB3FF;
    --primary-3:#7FCFFF;
    --bg:#0f2748;
    --bg-2:#1a3a6b;
}

/* Respect reduced motion */
@media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* Accessibility */
.skip-link{
    position:fixed;top:-80px;left:16px;z-index:4000;
    padding:12px 20px;background:var(--primary);color:#001833;
    font-size:14px;font-weight:700;letter-spacing:.3px;
    border-radius:0 0 8px 8px;transition:top .25s;
}
.skip-link:focus{top:0;outline:3px solid #fff;outline-offset:2px}
a:focus-visible,button:focus-visible{outline:2px solid var(--primary-2);outline-offset:3px;border-radius:4px}

/* Ambient backdrop — subtle blue glow in top-left, matches main hero vibe */
body::before{
    content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
    background:
        radial-gradient(60vw 50vh at 5% -10%, rgba(30,144,255,0.15), transparent 60%),
        radial-gradient(50vw 40vh at 95% 110%, rgba(79,179,255,0.08), transparent 60%);
}

/* =========== HEADER =========== */
header{
    position:sticky;top:0;z-index:100;
    padding:18px 5vw;
    background:rgba(15,39,72,0.86);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    border-bottom:1px solid rgba(255,255,255,0.08);
    display:flex;align-items:center;justify-content:space-between;
}
header .logo{display:inline-flex;align-items:center;gap:12px}
header .logo img{
    height:32px;width:auto;
    filter:brightness(0) invert(1);
    transition:transform .4s cubic-bezier(.25,.46,.45,.94),filter .3s;
}
header .logo:hover img{
    transform:scale(1.06);
    filter:brightness(0) invert(1) drop-shadow(0 0 12px rgba(30,144,255,0.5));
}
header .logo .kr{
    font-size:13px;font-weight:500;color:rgba(255,255,255,0.7);
    border-left:1px solid rgba(255,255,255,0.2);
    padding-left:12px;letter-spacing:-.3px;line-height:1;
}
header .back{
    font-size:13px;font-weight:600;color:rgba(255,255,255,0.75);
    padding:8px 18px;border:1px solid rgba(255,255,255,0.2);border-radius:20px;
    display:inline-flex;align-items:center;gap:6px;
    transition:all .3s;
}
header .back:hover{color:#fff;border-color:var(--primary);background:rgba(30,144,255,0.08);transform:translateY(-1px)}

/* =========== PAGE HEAD (shared) =========== */
.eyebrow{
    font-family:'Montserrat',sans-serif;
    font-size:12px;font-weight:600;letter-spacing:3px;
    color:var(--primary);
    display:inline-flex;align-items:center;gap:10px;
    margin-bottom:18px;
}
.eyebrow::before{content:'';width:30px;height:1px;background:var(--primary)}

/* =========== REVEAL MOTION =========== */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .9s cubic-bezier(.25,.46,.45,.94),transform .9s cubic-bezier(.25,.46,.45,.94)}
.reveal.on{opacity:1;transform:translateY(0)}
.reveal.d1{transition-delay:.1s}
.reveal.d2{transition-delay:.2s}
.reveal.d3{transition-delay:.3s}

/* =========== NOTICE LIST =========== */
main.notices-list-main{max-width:1100px;margin:0 auto;padding:80px 5vw 120px}

.page_head{margin-bottom:60px;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,0.1)}
.page_head h1{
    font-family:'Montserrat',sans-serif;
    font-size:clamp(44px,6vw,72px);font-weight:800;line-height:1;letter-spacing:-2px;
    color:var(--primary);
}
.page_head h1 em{color:inherit;font-weight:inherit;font-style:normal}
.page_head p{margin-top:18px;font-size:15px;color:rgba(255,255,255,0.6);line-height:1.85;max-width:560px;word-break:keep-all;text-wrap:pretty}

/* Category tabs (게시판 분리 — 일반 공지 / 채용공고) */
.notice_tabs{
    display:flex;gap:6px;flex-wrap:wrap;
    margin:0 0 28px;
}
.notice_tabs button{
    font-family:'Montserrat','Noto Sans KR',sans-serif;
    font-size:13px;font-weight:600;letter-spacing:.4px;
    color:rgba(255,255,255,0.65);
    background:transparent;
    border:1px solid rgba(255,255,255,0.18);
    border-radius:999px;
    padding:9px 18px;
    cursor:pointer;
    transition:color .25s, background .25s, border-color .25s;
}
.notice_tabs button:hover{color:#fff;border-color:rgba(255,255,255,0.4)}
.notice_tabs button.active{
    color:#fff;
    background:var(--primary);
    border-color:var(--primary);
}

/* Category tag chips inside list items */
.notice_item .tag{
    display:inline-flex;align-items:center;justify-content:center;
    font-family:'Montserrat','Noto Sans KR',sans-serif;
    font-size:11px;font-weight:600;letter-spacing:.4px;
    padding:5px 10px;border-radius:4px;
    white-space:nowrap;
}
.notice_item .tag-recruit{background:rgba(30,144,255,0.18);color:var(--primary-2);border:1px solid rgba(30,144,255,0.3)}
.notice_item .tag-general{background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.75);border:1px solid rgba(255,255,255,0.15)}

.notice_empty{
    text-align:center;padding:60px 20px;
    color:rgba(255,255,255,0.5);font-size:14px;
}

/* Notice list — editorial 라인: 위/아래 hairline + 항목 사이 hairline divider, 박스 없음 */
.notice_list{
    display:flex;flex-direction:column;gap:0;
    border-top:1px solid rgba(255,255,255,0.14);
    border-bottom:1px solid rgba(255,255,255,0.14);
}
.notice_item{
    border-bottom:1px solid rgba(255,255,255,0.08);
    transition:background .25s ease;
}
.notice_item[hidden]{display:none}
.notice_item:last-child{border-bottom:none}
.notice_item:hover{background:rgba(30,144,255,0.04)}
.notice_item a{
    display:grid;grid-template-columns:64px 92px 1fr 130px 24px;gap:24px;align-items:center;
    padding:clamp(22px, 2.4vw, 32px) clamp(8px, 1.4vw, 18px);
    transition:padding-left .35s ease;
}
.notice_item:hover a{padding-left:clamp(14px, 2vw, 24px)}
/* 번호를 워터마크 스타일로 키워서 시각적 앵커 */
.notice_item .num{
    font-family:'Montserrat',sans-serif;
    font-size:clamp(28px, 2.6vw, 40px);
    font-weight:800;
    color:rgba(30,144,255,0.22);
    letter-spacing:-1px;
    line-height:1;
}
.notice_item:hover .num{color:rgba(30,144,255,0.45)}
.notice_item .title{font-size:17px;font-weight:500;color:#fff;letter-spacing:-.2px;line-height:1.45;word-break:keep-all;text-wrap:pretty;transition:color .25s}
.notice_item:hover .title{color:var(--primary-2)}
.notice_item .date{font-family:'Montserrat',sans-serif;font-size:13px;color:var(--primary);text-align:right;letter-spacing:.5px}
.notice_item .arrow{display:flex;align-items:center;justify-content:flex-end;color:rgba(255,255,255,0.4);transition:all .3s}
.notice_item:hover .arrow{color:var(--primary);transform:translateX(4px)}

/* =========== NOTICE ARTICLE =========== */
main.notice-article-main{max-width:860px;margin:0 auto;padding:80px 5vw 120px}
.breadcrumb{font-family:'Montserrat',sans-serif;font-size:12px;letter-spacing:2px;color:rgba(255,255,255,0.4);margin-bottom:24px}
.breadcrumb a{color:var(--primary);transition:color .2s}
.breadcrumb a:hover{color:var(--primary-2)}
.breadcrumb span{margin:0 10px;color:rgba(255,255,255,0.3)}

article header.art_head{padding:0;background:none;border:none;position:static;display:block}
article h1{font-size:clamp(30px,4vw,44px);font-weight:700;line-height:1.3;letter-spacing:-1px;color:#fff;word-break:keep-all;text-wrap:pretty;margin-top:4px}
article .meta{margin-top:20px;padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,0.1);display:flex;flex-wrap:wrap;gap:18px;font-size:13px;color:rgba(255,255,255,0.5)}
article .meta .cat{padding:4px 12px;background:rgba(30,144,255,0.12);color:var(--primary-2);border-radius:20px;font-weight:600;letter-spacing:.5px}

article .body{padding:40px 0 60px;font-size:16px;line-height:1.9;color:rgba(255,255,255,0.8);word-break:keep-all;text-wrap:pretty}
article .body h2{font-size:22px;font-weight:600;color:#fff;margin:44px 0 16px;letter-spacing:-.3px;position:relative;padding-left:18px}
article .body h2::before{content:'';position:absolute;left:0;top:.38em;width:4px;height:.72em;background:var(--primary);border-radius:2px}
article .body h2:first-child{margin-top:0}
article .body p{margin-bottom:18px}
article .body ul{padding-left:20px;margin-bottom:20px}
article .body ul li{margin-bottom:10px;position:relative;list-style:disc;color:rgba(255,255,255,0.8)}
article .body ul li::marker{color:var(--primary)}
article .body strong{color:#fff;font-weight:600}
article .body a.inline_link{color:var(--primary-2);text-decoration:underline;text-underline-offset:3px}
article .body table{width:100%;border-collapse:collapse;margin:20px 0;font-size:14px;background:rgba(255,255,255,0.02);border-radius:10px;overflow:hidden}
article .body table th,article .body table td{padding:14px 16px;border-bottom:1px solid rgba(255,255,255,0.08);text-align:left;vertical-align:top}
article .body table th{background:rgba(30,144,255,0.09);color:var(--primary-2);font-weight:600;letter-spacing:.3px;font-size:12px;text-transform:uppercase}
article .body .callout{padding:20px 24px;background:rgba(30,144,255,0.06);border-left:3px solid var(--primary);border-radius:0 10px 10px 0;margin-top:28px}

.pager{display:flex;justify-content:space-between;gap:12px;padding-top:36px;border-top:1px solid rgba(255,255,255,0.1)}
.pager a{padding:14px 24px;border:1px solid rgba(255,255,255,0.15);border-radius:30px;font-size:13px;font-weight:500;color:rgba(255,255,255,0.75);transition:all .3s;display:inline-flex;align-items:center;gap:8px}
.pager a:hover{border-color:var(--primary);color:#fff;background:rgba(30,144,255,0.06);transform:translateY(-1px)}
.pager a.disabled{opacity:.35;pointer-events:none}

/* =========== PERFORMANCE LIST =========== */
main.perf-main{max-width:1440px;margin:0 auto;padding:80px 5vw 120px}
.perf-head{margin-bottom:60px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,0.1);display:grid;grid-template-columns:1fr auto;gap:40px;align-items:flex-end}
.perf-head h1{font-family:'Montserrat',sans-serif;font-size:clamp(44px,6vw,72px);font-weight:800;line-height:1;letter-spacing:-2px;color:var(--primary)}
.perf-head h1 em{color:inherit;font-weight:inherit;font-style:normal}
.perf-head p{margin-top:18px;font-size:15px;color:rgba(255,255,255,0.6);line-height:1.85;max-width:480px;word-break:keep-all;text-wrap:pretty}
.stats{display:flex;gap:30px;flex-wrap:wrap}
.stats .item{text-align:right}
.stats .num{font-family:'Montserrat',sans-serif;font-size:36px;font-weight:800;color:#fff;letter-spacing:-1.5px}
.stats .num em{color:var(--primary);font-weight:300}
.stats .num small{font-size:13px;color:rgba(255,255,255,0.5);font-weight:500;margin-left:3px}
.stats .lbl{font-size:11px;color:rgba(255,255,255,0.55);margin-top:8px;letter-spacing:.5px}

/* (.filters 연도 필터 CSS 제거됨 — 사업실적은 최신순 일괄 노출) */

/* Performance card grid — editorial: 박스 chrome 제거, 이미지 + 캡션 매거진 스타일 */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(28px, 3vw, 48px) clamp(20px, 2.4vw, 32px)}
.card{
    position:relative;
    overflow:visible;
    border:none;
    border-radius:0;
    background:transparent;
    display:flex;flex-direction:column;
    transition:none;
}
.card:hover{
    border-color:transparent;
    background:transparent;
    transform:none;
    box-shadow:none;
}
.card .thumb{
    position:relative;
    aspect-ratio:16/10;
    overflow:hidden;       /* 이미지 scale 시 클리핑 — radius 없이도 깔끔 */
    background:#0a1628;
}
.card .thumb img{width:100%;height:100%;object-fit:cover;filter:saturate(1.08) brightness(.9);transition:transform .8s cubic-bezier(.25,.46,.45,.94),filter .35s}
.card:hover .thumb img{transform:scale(1.06);filter:saturate(1.15) brightness(1)}
/* 진주 어옥리 — 게시판에서 모듈이 더 잘 보이도록 추가 확대 */
.card .thumb img[src*="jinju-eook"]{transform:scale(1.32);transform-origin:center 55%}
.card:hover .thumb img[src*="jinju-eook"]{transform:scale(1.40)}
.card .thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(10,14,24,0.78));pointer-events:none}
.card .cap_ov{position:absolute;bottom:14px;left:16px;z-index:2;font-family:'Montserrat',sans-serif;font-size:24px;font-weight:800;color:#fff;letter-spacing:-.8px;text-shadow:0 2px 12px rgba(0,0,0,0.6)}
.card .cap_ov small{font-size:12px;font-weight:600;color:var(--primary-2);margin-left:3px;letter-spacing:.5px}
/* 캡션 영역 — 좌우 padding 0 (이미지 가장자리와 정렬). 위쪽만 띄움. */
.card .body{padding:clamp(14px, 1.6vw, 22px) 0 clamp(4px, 0.6vw, 8px);display:flex;flex-direction:column;gap:6px}
.card .type{font-family:'Montserrat',sans-serif;font-size:10px;font-weight:700;letter-spacing:2px;color:var(--primary)}
.card .nm{font-size:17px;font-weight:600;color:#fff;letter-spacing:-.3px;line-height:1.35}
.card .d{font-family:'Montserrat',sans-serif;font-size:12px;color:rgba(255,255,255,0.5);letter-spacing:.5px}

/* =========== FOOTER =========== */
/* (서브페이지 footer 카피라이트 바 제거됨 — 사용자 요청) */

/* =========== RESPONSIVE =========== */
@media(max-width:1024px){
    .grid{grid-template-columns:repeat(2,1fr)}
    .perf-head{grid-template-columns:1fr;gap:30px;align-items:flex-start}
    .stats{gap:24px}
    .stats .item{text-align:left}
}
@media(max-width:768px){
    header{padding:14px 16px}
    header .logo img{height:26px}
    header .logo .kr{display:none}
    header .back{font-size:11px;padding:7px 14px}
    main.notices-list-main,main.notice-article-main,main.perf-main{padding:50px 20px 80px}
    .page_head,.perf-head{margin-bottom:40px;padding-bottom:24px}
    .page_head h1,.perf-head h1{font-size:38px}
    article h1{font-size:26px}
    article .body{font-size:15px;padding:30px 0 40px}
    article .body h2{font-size:18px;margin:32px 0 12px}
    /* 모바일 1열 stack — 워터마크 num 은 작은 라벨로 (단일 컬럼에선 시각 앵커 효과 없음) */
    .notice_item a{grid-template-columns:1fr;gap:8px;padding:20px 8px}
    .notice_item:hover a{padding-left:16px}
    .notice_item .num{font-size:11px;font-weight:600;color:rgba(255,255,255,0.4);letter-spacing:.5px;order:-2}
    .notice_item:hover .num{color:rgba(255,255,255,0.4)}
    .notice_item .tag{order:-1;justify-self:start;font-size:10px;padding:3px 8px}
    .notice_item .date{text-align:left;font-size:12px;order:-1;justify-self:end}
    .notice_item .title{font-size:15px}
    .notice_item .arrow{display:none}
    .notice_tabs button{padding:8px 14px;font-size:12px}
    .stats .num{font-size:28px}
    .grid{grid-template-columns:repeat(2,1fr);gap:24px 14px}
    .card .body{padding:12px 0 4px}
    .card .nm{font-size:14px}
    .card .cap_ov{font-size:18px;bottom:10px;left:12px}
    .pager a{padding:11px 16px;font-size:12px}
    .pager a span{display:none}
}
@media(max-width:420px){.grid{grid-template-columns:1fr}}
