@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;800;900&display=swap');
/*
 * 채용설명회 페이지 스타일
 * 모든 규칙은 #jobFair 안에서만 적용됩니다 (사이트 공통 CSS와 충돌 방지).
 * 외부 폰트: NEXON Lv2 Gothic (jsdelivr noonfonts, 사이트 폰트와 겹치지 않게 "GS NEXON" 이름으로 등록) + Montserrat (Google Fonts, 맨 위 @import)
 */
@font-face{font-family:"GS NEXON";src:url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv2 Gothic.woff") format("woff");font-display:swap}
@font-face{font-family:"GS NEXON Bold";src:url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv2 Gothic Bold.woff") format("woff");font-display:swap}
/* ===== 학원 메인페이지 톤앤매너 (취업센터 공통) ===== */
#jobFair{scroll-behavior:smooth;--bg:#1d1f22; --bg2:#17191c; --stage:#101215; --card:#26292e; --line:#363a41;
  --text:#ffffff; --sub:#a9b0b9; --muted:#808892;
  --accent:#08cee8; --accent2:#7de8f6; --on-accent:#111316; --gold:#ffd23f; --bulb:#ffe7a8; --note:#ffd34d;
  --head:"GS NEXON Bold","GS NEXON",sans-serif;
  --en:"Montserrat","GS NEXON Bold",sans-serif;
  --max:1200px;}
#jobFair, #jobFair *{margin:0;padding:0;box-sizing:border-box}
#jobFair{background:var(--bg);color:var(--text);font-weight:400;overflow-wrap:normal;font-family:'GS NEXON',-apple-system,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;word-break:keep-all}
#jobFair a{color:inherit;text-decoration:none}
#jobFair img{display:block;max-width:100%}
#jobFair h1, #jobFair h2, #jobFair h3, #jobFair h4, #jobFair b, #jobFair strong, #jobFair .btn{font-family:var(--head);font-weight:700}
#jobFair .wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
#jobFair section{padding:130px 0;position:relative;scroll-margin-top:150px}
#jobFair .alt{background:var(--bg2)}
#jobFair .center{text-align:center}
#jobFair .scene{display:inline-flex;align-items:center;gap:10px;font-family:var(--en);font-weight:800;font-size:14px;letter-spacing:.2em;color:var(--accent);margin-bottom:16px}
#jobFair .scene::before, #jobFair .center .scene::after{content:"";width:24px;height:2px;background:var(--accent)}
#jobFair .scene em{font-style:normal;color:var(--muted)}
#jobFair h2.title{font-size:clamp(28px,4vw,46px);line-height:1.3;letter-spacing:-.03em}
#jobFair h2.title em{font-style:normal;color:var(--accent)}
#jobFair .lead{color:var(--sub);font-size:clamp(15px,1.4vw,18px);margin-top:18px}
#jobFair .center .lead{margin-left:auto;margin-right:auto;max-width:640px}
#jobFair .direction{margin-top:14px;font-size:14px;color:var(--muted);font-style:italic;letter-spacing:.02em}
#jobFair .reveal{opacity:0;transform:translateY(40px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}
#jobFair .reveal.on{opacity:1;transform:none}
#jobFair .d1{transition-delay:.12s}
#jobFair .d2{transition-delay:.24s}
#jobFair .d3{transition-delay:.36s}
#jobFair .btn{display:inline-flex;align-items:center;gap:8px;padding:17px 30px;border-radius:12px;font-size:16px;transition:transform .2s,background .2s,border-color .2s}
#jobFair .btn:hover{transform:translateY(-2px)}
#jobFair .btn.pri{background:var(--accent);color:var(--on-accent)}
#jobFair .btn.pri:hover{background:#3fdcf0}
#jobFair .btn.sec{border:1px solid #5a5f67}
#jobFair .btn.sec:hover{border-color:var(--accent)}
#jobFair .dia{list-style:none;display:flex;flex-direction:column;gap:9px;color:var(--sub);font-size:15.5px}
#jobFair .dia li{display:flex;gap:10px;align-items:flex-start}
#jobFair .dia li::before{content:"";flex:none;width:6px;height:6px;margin-top:9px;background:var(--accent);transform:rotate(45deg)}
#jobFair .ph-note{margin-top:16px;font-size:13px;color:var(--muted)}
/* ===== HERO — 커튼 + 마키(전구 간판) ===== */
#jobFair .hero{min-height:calc(100vh - 80px);display:flex;align-items:center;overflow:hidden;background:var(--stage);padding:100px 0 120px}
#jobFair .hero .beam{position:absolute;left:50%;top:-160px;width:960px;height:1160px;transform:translateX(-50%);background:radial-gradient(ellipse 38% 60% at 50% 30%,rgba(8,206,232,.2) 0%,rgba(8,206,232,.06) 45%,transparent 72%);animation:jf-beam 6s ease-in-out infinite;pointer-events:none}
@keyframes jf-beam{0%,100%{opacity:.6}50%{opacity:1}}
#jobFair .hero .floor{position:absolute;left:0;right:0;bottom:0;height:260px;background:radial-gradient(ellipse 60% 100% at 50% 100%,rgba(255,217,160,.12),transparent 70%),linear-gradient(180deg,transparent,var(--bg2));pointer-events:none}
#jobFair .hero .valance{position:absolute;left:0;right:0;top:0;height:56px;background:linear-gradient(180deg,#0b0c0f,#15171b);border-bottom:1px solid rgba(8,206,232,.4);z-index:3}
#jobFair .hero .rig{position:absolute;top:56px;left:50%;transform:translateX(-50%);display:flex;gap:120px;z-index:3}
#jobFair .hero .rig i{width:22px;height:14px;border-radius:0 0 8px 8px;background:#2a2d33;box-shadow:0 10px 30px 6px rgba(8,206,232,.25)}
#jobFair .curtain{position:absolute;top:0;bottom:0;width:15%;z-index:2;background:repeating-linear-gradient(90deg,#121418 0 22px,#1b1e24 22px 34px,#121418 34px 52px)}
#jobFair .curtain.l{left:0;box-shadow:inset -24px 0 40px rgba(0,0,0,.6),8px 0 30px rgba(0,0,0,.5);border-right:1px solid rgba(8,206,232,.25)}
#jobFair .curtain.r{right:0;box-shadow:inset 24px 0 40px rgba(0,0,0,.6),-8px 0 30px rgba(0,0,0,.5);border-left:1px solid rgba(8,206,232,.25)}
/* ===== OPENING : 막이 오르는 인트로 ===== */
#jobFair{--intro:1.45s}
#jobFair .hero.no-intro{--intro:.35s}
#jobFair .intro{position:fixed;inset:0;z-index:300;background:transparent;overflow:hidden;transition:opacity .45s ease}
#jobFair .intro.done{opacity:0;pointer-events:none}
#jobFair .intro .seam{position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%) scaleY(0);transform-origin:top;background:linear-gradient(180deg,rgba(125,232,246,0),rgba(125,232,246,.9) 30%,rgba(255,236,200,.8) 70%,rgba(125,232,246,0));box-shadow:0 0 28px 6px rgba(8,206,232,.35);z-index:3}
#jobFair .intro .halo{position:absolute;left:50%;top:-20%;width:70vw;height:140%;transform:translateX(-50%);background:radial-gradient(ellipse 30% 55% at 50% 45%,rgba(8,206,232,.16),transparent 70%);opacity:0;z-index:4;pointer-events:none}
#jobFair .intro .drape{position:absolute;top:0;bottom:0;width:50.4%;z-index:2;will-change:transform;
  background:
    linear-gradient(180deg,rgba(255,255,255,.05),transparent 30%,transparent 70%,rgba(0,0,0,.55)),
    repeating-linear-gradient(90deg,#0b0d12 0,#141820 22px,#1e2430 34px,#272e3b 40px,#1e2430 46px,#141820 58px,#0b0d12 80px)}
#jobFair .intro .drape::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.6)),repeating-linear-gradient(90deg,#b8954f 0 1px,transparent 1px 80px);border-top:2px solid #b8954f;opacity:.55}
#jobFair .intro .drape.l{left:0;transform-origin:left center;box-shadow:inset -40px 0 60px rgba(0,0,0,.65)}
#jobFair .intro .drape.r{right:0;transform-origin:right center;box-shadow:inset 40px 0 60px rgba(0,0,0,.65)}
#jobFair .intro .drape.l::before, #jobFair .intro .drape.r::before{content:"";position:absolute;top:0;bottom:0;width:1px;background:rgba(8,206,232,.45)}
#jobFair .intro .drape.l::before{right:0}
#jobFair .intro .drape.r::before{left:0}
#jobFair .intro .valance{position:absolute;left:0;right:0;top:0;height:110px;z-index:5;background:
  linear-gradient(180deg,#05060a,#12151c 70%,#0b0d12),
  #0b0d12;box-shadow:0 18px 40px rgba(0,0,0,.6)}
#jobFair .intro .valance::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,transparent,#b8954f 15%,#e2c47e 50%,#b8954f 85%,transparent)}
#jobFair .intro .title{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:6;text-align:center;opacity:0;pointer-events:none}
#jobFair .intro .title .ko{font-family:var(--head);font-size:clamp(15px,1.6vw,19px);color:rgba(255,255,255,.75);letter-spacing:.08em}
#jobFair .intro .title .en{margin-top:14px;font-family:var(--en);font-weight:700;font-size:clamp(20px,3vw,34px);color:#fff;letter-spacing:.2em}
#jobFair .intro .title .rule{width:0;height:1px;margin:18px auto 0;background:linear-gradient(90deg,transparent,#e2c47e,transparent)}
#jobFair .intro .skip{position:absolute;right:28px;bottom:26px;z-index:7;background:none;border:1px solid rgba(255,255,255,.25);color:rgba(255,255,255,.75);font-family:var(--en);font-weight:700;font-size:12px;letter-spacing:.2em;padding:10px 18px;border-radius:99px;cursor:pointer;transition:.2s}
#jobFair .intro .skip:hover{border-color:var(--accent);color:#fff}
/* 재생 타임라인 */
#jobFair .intro.play .seam{animation:jf-seam .5s cubic-bezier(.6,0,.2,1) .1s forwards, jf-seamOut .25s ease .9s forwards}
#jobFair .intro.play .halo{animation:jf-halo .7s ease .25s forwards}
#jobFair .intro.play .title{animation:jf-titleIn .55s ease .22s forwards, jf-titleOut .25s ease .8s forwards}
#jobFair .intro.play .title .en{animation:jf-track .8s cubic-bezier(.2,.8,.2,1) .22s both}
#jobFair .intro.play .title .rule{animation:jf-rule .5s ease .4s forwards}
#jobFair .intro.play .drape.l, #jobFair .intro.play .drape.r{animation:jf-gather .9s cubic-bezier(.76,0,.24,1) .9s forwards}
#jobFair .intro.play .valance{animation:jf-lift .65s cubic-bezier(.7,0,.2,1) 1.05s forwards}
@keyframes jf-seam{to{transform:translateX(-50%) scaleY(1)}}
@keyframes jf-seamOut{to{opacity:0}}
@keyframes jf-halo{to{opacity:1}}
@keyframes jf-titleIn{to{opacity:1}}
@keyframes jf-titleOut{from{opacity:1}to{opacity:0;transform:translateY(-58%)}}
@keyframes jf-track{from{letter-spacing:.08em;filter:blur(6px)}to{letter-spacing:.5em;filter:blur(0)}}
@keyframes jf-rule{to{width:180px}}
@keyframes jf-gather{0%{transform:scaleX(1)}100%{transform:scaleX(.297)}}
@keyframes jf-lift{to{transform:translateY(-100%)}}
/* 조명 속 먼지 */
#jobFair .dust{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
#jobFair .dust i{position:absolute;bottom:-10px;width:3px;height:3px;border-radius:50%;background:rgba(255,236,200,.55);filter:blur(.4px);animation:jf-mote linear infinite}
@keyframes jf-mote{0%{transform:translate(0,0);opacity:0}15%{opacity:.7}85%{opacity:.5}100%{transform:translate(var(--dx,20px),-90vh);opacity:0}}
@keyframes jf-gatherM{0%{transform:scaleX(1)}100%{transform:scaleX(.1)}}
@media (max-width:768px){
  #jobFair .intro.play .drape.l, #jobFair .intro.play .drape.r{animation-name:jf-gatherM}
  #jobFair .intro .valance{height:80px}
  #jobFair .intro .skip{right:16px;bottom:18px}
}
@media (prefers-reduced-motion:reduce){
  #jobFair .intro{display:none}
  #jobFair .dust{display:none}
}
#jobFair .footlight{position:absolute;left:15%;right:15%;bottom:48px;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);z-index:1}
#jobFair .hero .wrap{position:relative;z-index:1;max-width:960px;text-align:center;animation:jf-rise 1.1s ease var(--intro) both}
@keyframes jf-rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
#jobFair .crumb{font-size:13px;color:rgba(255,255,255,.6);margin-bottom:24px}
#jobFair .badge{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(8,206,232,.5);background:rgba(8,206,232,.08);color:var(--accent2);font-family:var(--head);font-size:14px;padding:8px 16px;border-radius:99px;margin-bottom:22px}
#jobFair .badge i{width:7px;height:7px;border-radius:50%;background:var(--accent)}
#jobFair .hero h1{font-size:clamp(20px,2.4vw,28px);line-height:1.4;letter-spacing:-.02em;color:#d5dae0}
#jobFair .hero h1 b{color:#fff}
/* 공연 포스터식 빌링 (박스 없이 타이포로만) */
#jobFair .poster-top{margin-top:30px;display:flex;align-items:center;justify-content:center;gap:16px;font-family:var(--en);font-weight:700;font-size:12px;letter-spacing:.42em;color:rgba(255,255,255,.55)}
#jobFair .poster-top::before, #jobFair .poster-top::after{content:"";width:56px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4))}
#jobFair .poster-top::after{transform:scaleX(-1)}
#jobFair .billing{list-style:none;margin:30px auto 0;max-width:820px}
#jobFair .billing li{position:relative;padding:22px 0;opacity:0;animation:jf-credit 1s cubic-bezier(.2,.8,.2,1) both}
#jobFair .billing li:nth-child(1){animation-delay:calc(var(--intro) + .45s)}
#jobFair .billing li:nth-child(2){animation-delay:calc(var(--intro) + .8s)}
#jobFair .billing li:nth-child(3){animation-delay:calc(var(--intro) + 1.15s)}
@keyframes jf-credit{from{opacity:0;transform:translateY(18px);letter-spacing:.02em}to{opacity:1;transform:none;letter-spacing:-.035em}}
#jobFair .billing li + li::before{content:"";position:absolute;top:0;left:50%;width:40px;height:1px;transform:translateX(-50%);background:rgba(255,255,255,.22)}
#jobFair .billing .act{display:block;font-family:var(--en);font-weight:700;font-size:12px;letter-spacing:.32em;color:var(--accent);margin-bottom:10px}
#jobFair .billing .ln{display:block;font-family:var(--head);font-size:clamp(24px,2.8vw,36px);line-height:1.22;letter-spacing:-.035em;color:#fff}
#jobFair .billing .ln em{font-style:normal;color:var(--accent)}
#jobFair .stage-pool{position:absolute;left:50%;bottom:70px;width:min(760px,80%);height:120px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse at center,rgba(255,236,200,.10),rgba(8,206,232,.05) 45%,transparent 70%);pointer-events:none;z-index:1}
#jobFair .hero .acts{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:40px}
/* ===== STATS ===== */
#jobFair .stats{padding:64px 0 0;background:var(--bg2)}
#jobFair .stat-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:22px;background:var(--bg);overflow:hidden}
#jobFair .stat{padding:34px 22px;text-align:center;border-right:1px solid var(--line)}
#jobFair .stat:last-child{border-right:none}
#jobFair .stat b{font-family:var(--en);font-weight:900;font-size:clamp(34px,4.2vw,52px);line-height:1;color:var(--accent)}
#jobFair .stat b small{font-size:.45em;color:#fff;margin-left:4px}
#jobFair .stat p{margin-top:10px;font-family:var(--head)}
#jobFair .stat span{display:block;font-size:13px;color:var(--muted)}
/* ===== SCENE 01 REPLAY ===== */
#jobFair .replay{padding-top:110px;padding-bottom:60px}
#jobFair .video{position:relative;margin-top:52px;aspect-ratio:16/9;border-radius:24px;overflow:hidden;border:1px solid var(--line);background:#000;box-shadow:0 40px 80px -30px rgba(8,206,232,.35)}
#jobFair .video img{width:100%;height:100%;object-fit:cover;opacity:.75;transition:opacity .4s,transform .8s;color:transparent;font-size:0;background:radial-gradient(ellipse at 50% 40%,#123b43,#111316 70%)}
#jobFair .video:hover img{opacity:.9;transform:scale(1.02)}
#jobFair .video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
#jobFair .video .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:96px;height:96px;border-radius:50%;border:0;background:var(--accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 0 0 12px rgba(8,206,232,.2);transition:transform .3s,box-shadow .3s}
#jobFair .video .play:hover{transform:translate(-50%,-50%) scale(1.08);box-shadow:0 0 0 18px rgba(8,206,232,.18)}
#jobFair .video .vcap{position:absolute;left:28px;bottom:24px;pointer-events:none}
#jobFair .video .vcap span{display:block;font-family:var(--en);font-weight:800;font-size:12px;letter-spacing:.2em;color:var(--accent)}
#jobFair .video .vcap b{font-size:clamp(18px,2vw,24px)}
#jobFair .video.playing .vcap, #jobFair .video.playing .play, #jobFair .video.playing img{display:none}
/* ===== SCENE 02 RECAP (지난 설명회 핵심 정리) ===== */
#jobFair .seasons{display:flex;gap:10px;justify-content:center;margin-top:44px;flex-wrap:wrap}
#jobFair .seasons button{min-height:48px;padding:0 24px;border-radius:99px;border:1px solid var(--line);background:transparent;color:var(--sub);font-family:var(--en);font-weight:800;font-size:14px;letter-spacing:.12em;cursor:pointer;transition:.25s}
#jobFair .seasons button:hover{border-color:var(--accent);color:#fff}
#jobFair .seasons button.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
#jobFair .recap{margin-top:36px;display:grid;grid-template-columns:1.05fr 1fr;gap:20px;animation:jf-fd .5s}
@keyframes jf-fd{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
#jobFair .recap .info{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:34px 32px}
#jobFair .recap .info .dt{font-family:var(--en);font-weight:900;font-size:13px;letter-spacing:.2em;color:var(--accent)}
#jobFair .recap .info h3{font-size:24px;margin:8px 0 6px;line-height:1.35}
#jobFair .recap .info .meta{font-size:14px;color:var(--muted)}
#jobFair .recap .info h4{margin:26px 0 12px;font-size:15px;color:var(--accent2);font-family:var(--en);letter-spacing:.14em;font-weight:800}
#jobFair .recap .qa{display:flex;flex-direction:column;gap:10px}
#jobFair .recap .qa div{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:14px 16px;font-size:15px}
#jobFair .recap .qa b{color:var(--accent);margin-right:8px}
#jobFair .recap .qa p{color:var(--sub);margin-top:4px;font-size:14px}
#jobFair .recap .pics{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:12px;min-height:420px}
#jobFair .recap .pics figure{margin:0;position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:#2a2d33}
#jobFair .recap .pics figure:first-child{grid-column:span 2}
#jobFair .recap .pics img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
#jobFair .recap .pics figcaption{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;font-size:13px;font-family:var(--head);background:linear-gradient(180deg,transparent,rgba(17,19,22,.9))}
/* ===== SCENE 04 CUE SHEET ===== */
#jobFair .cues{list-style:none;margin-top:56px;border-top:1px solid var(--line)}
#jobFair .cue{display:grid;grid-template-columns:120px 1fr 1.2fr;gap:24px;align-items:center;padding:26px 8px;border-bottom:1px solid var(--line);transition:background .3s}
#jobFair .cue:hover{background:rgba(8,206,232,.04)}
#jobFair .cue .no{font-family:var(--en);font-weight:900;font-size:13px;letter-spacing:.18em;color:var(--muted)}
#jobFair .cue .no b{display:block;font-size:34px;letter-spacing:0;color:var(--accent);line-height:1.1}
#jobFair .cue h3{font-size:21px}
#jobFair .cue p{color:var(--sub);font-size:15px}
#jobFair .cue p i{display:block;margin-top:4px;font-size:13px;color:var(--muted)}
#jobFair .cue.finale .no b{color:var(--gold)}
#jobFair .tip{margin-top:40px;display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px 28px}
#jobFair .tip .tg{font-family:var(--en);font-weight:900;font-size:13px;letter-spacing:.18em;color:var(--gold);border:1px solid rgba(255,210,63,.4);border-radius:99px;padding:6px 14px}
#jobFair .tip p{flex:1 1 360px;color:var(--sub);font-size:15.5px}
#jobFair .tip p b{color:#fff}
/* ===== THE CAST ===== */
#jobFair .cast{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:52px}
#jobFair .cast .lg{height:96px;border-radius:14px;background:var(--card);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--muted);font-family:var(--head);font-size:14px}
#jobFair .cast .lg.named{color:#fff;font-size:18px;border-color:#4a4f57}
#jobFair .cast .lg img{max-width:70%;max-height:50%;filter:grayscale(1) brightness(1.8);opacity:.85}
#jobFair .cast .lg.logo img{max-width:72%;max-height:42%;object-fit:contain;filter:brightness(0) invert(1);opacity:.92;transition:opacity .2s}
#jobFair .cast .lg.logo:hover img{opacity:1}
#jobFair .cast-yr{margin-top:44px}
#jobFair .cast-yr .yr{display:flex;align-items:baseline;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--line)}
#jobFair .cast-yr .yr b{font-family:var(--en);font-size:22px;color:var(--accent);letter-spacing:.04em}
#jobFair .cast-yr .yr span{font-size:14px;color:var(--sub)}
#jobFair .cast-yr .cast{margin-top:18px}
#jobFair .cast.c5{grid-template-columns:repeat(5,1fr)}
#jobFair .cast.c4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1024px){
  #jobFair .cast.c5, #jobFair .cast.c4{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:560px){
  #jobFair .cast.c5, #jobFair .cast.c4{grid-template-columns:1fr 1fr}
  #jobFair .cast .lg.named{font-size:15px}
}
/* ===== FAQ ===== */
#jobFair .faq-list{margin-top:48px;border-top:1px solid var(--line);max-width:880px;margin-left:auto;margin-right:auto}
#jobFair .fq{border-bottom:1px solid var(--line)}
#jobFair .fq button{width:100%;background:none;border:0;color:var(--text);font-family:var(--head);font-size:18px;text-align:left;padding:26px 48px 26px 0;cursor:pointer;position:relative}
#jobFair .fq button .q{color:var(--accent);margin-right:12px}
#jobFair .fq button::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:26px;color:var(--accent);transition:transform .3s}
#jobFair .fq.open button::after{transform:translateY(-50%) rotate(45deg)}
#jobFair .fq .ans{max-height:0;overflow:hidden;transition:max-height .4s ease;color:var(--sub);font-size:16px}
#jobFair .fq .ans p{padding:0 0 26px 30px}
/* ===== FINALE : BACKSTAGE PASS (상시 알림 신청) ===== */
#jobFair .finale-sec{background:var(--stage);overflow:hidden}
#jobFair .finale-sec .curtain{width:9%;animation:none}
#jobFair .finale-sec .glow{position:absolute;left:50%;top:-200px;width:900px;height:900px;transform:translateX(-50%);background:radial-gradient(circle,rgba(8,206,232,.15),transparent 65%);pointer-events:none}
#jobFair .pass-row{position:relative;z-index:1;margin-top:56px;display:grid;grid-template-columns:380px 1fr;gap:40px;align-items:center}
#jobFair .pass{position:relative;border-radius:22px;padding:30px 28px 26px;background:linear-gradient(160deg,#0f3b44,#151a22 55%,#1d1830);border:1px solid rgba(8,206,232,.4);box-shadow:0 40px 80px -30px rgba(8,206,232,.4);transform:rotate(-3deg)}
#jobFair .pass::before{content:"";position:absolute;top:-34px;left:50%;width:14px;height:44px;transform:translateX(-50%);border-radius:7px;background:#08cee8;opacity:.7}
#jobFair .pass .hole{width:56px;height:10px;border-radius:99px;background:var(--stage);margin:0 auto 20px;border:1px solid rgba(255,255,255,.12)}
#jobFair .pass .t1{font-family:var(--en);font-weight:900;font-size:13px;letter-spacing:.3em;color:var(--accent)}
#jobFair .pass .t2{font-family:var(--en);font-weight:900;font-size:40px;line-height:1;margin-top:8px}
#jobFair .pass .t3{margin-top:14px;font-family:var(--head);font-size:16px}
#jobFair .pass ul{list-style:none;margin-top:18px;border-top:1px dashed rgba(255,255,255,.2);padding-top:14px;display:flex;flex-direction:column;gap:6px;font-size:14px;color:#c9ced6}
#jobFair .pass ul li::before{content:"✓ ";color:var(--accent)}
#jobFair .pass .code{margin-top:18px;height:34px;background:repeating-linear-gradient(90deg,#fff 0 2px,transparent 2px 5px,#fff 5px 6px,transparent 6px 10px);opacity:.25;border-radius:4px}
#jobFair .inline-cta{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:22px 28px;border:1px dashed rgba(8,206,232,.45);border-radius:16px;background:rgba(8,206,232,.05)}
#jobFair .inline-cta p{color:var(--sub);font-size:16px}
#jobFair .inline-cta p b{color:#fff}
#jobFair .form-shell{position:relative;border-radius:22px;transition:box-shadow .6s;scroll-margin-top:100px}
#jobFair .form-shell.focus{box-shadow:0 0 0 2px var(--accent),0 0 60px 6px rgba(8,206,232,.35)}
#jobFair .cta-pulse{position:relative}
#jobFair .cta-pulse::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(8,206,232,.6);animation:jf-ring 2s infinite}
@keyframes jf-ring{0%{box-shadow:0 0 0 0 rgba(8,206,232,.55)}70%,100%{box-shadow:0 0 0 14px rgba(8,206,232,0)}}
/* 팡팡 터지는 축포 */
#jobFair .burst-layer{position:fixed;inset:0;pointer-events:none;z-index:400;overflow:hidden}
#jobFair .burst-layer i{position:absolute;left:0;top:0;will-change:transform,opacity}
/* ===== 취업상담(수강료 조회) 폼 ===== */
#jobFair .jc-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:32px 28px 26px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 30px 60px -30px rgba(0,0,0,.6);scroll-margin-top:90px}
#jobFair .jc-head{margin-bottom:22px}
#jobFair .jc-head h3{font-size:22px}
#jobFair .jc-head p{font-size:14px;color:var(--sub);margin-top:6px}
#jobFair .jc-block{margin-bottom:24px}
#jobFair .jc-step{display:block;font-size:12px;letter-spacing:.06em;color:var(--accent);margin-bottom:2px;font-family:var(--head)}
#jobFair .jc-q{display:block;font-family:var(--head);font-size:15.5px;letter-spacing:-.02em;margin-bottom:12px;color:#fff}
#jobFair .jc-chips{display:flex;flex-wrap:wrap;gap:7px}
#jobFair .jc-chip{position:relative}
#jobFair .jc-chip input{position:absolute;opacity:0;pointer-events:none}
#jobFair .jc-chip span{display:inline-block;padding:7px 12px;border:1px solid rgba(255,255,255,.18);border-radius:999px;font-size:14px;color:rgba(255,255,255,.85);background:rgba(255,255,255,.04);cursor:pointer;transition:.15s}
#jobFair .jc-chip:hover span{border-color:rgba(255,255,255,.45);color:#fff}
#jobFair .jc-chip input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-family:var(--head)}
#jobFair .jc-chip input:focus-visible+span{outline:2px solid #fff;outline-offset:2px}
#jobFair .jc-field{width:100%;height:46px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:rgba(0,0,0,.22);color:#fff;padding:0 12px;font:inherit;font-size:15px;transition:border-color .15s}
#jobFair select.jc-field option{color:#1d2433}
#jobFair .jc-field::placeholder{color:rgba(255,255,255,.4)}
#jobFair .jc-field:focus{outline:none;border-color:var(--accent);background:rgba(0,0,0,.3)}
#jobFair .jc-field.bad{border-color:#ff5a6e}
#jobFair .jc-phone{display:grid;grid-template-columns:1fr 12px 1fr 12px 1fr;gap:6px;align-items:center;margin-top:8px}
#jobFair .jc-phone span{text-align:center;color:rgba(255,255,255,.55)}
#jobFair .jc-phone input{text-align:center}
#jobFair .jc-btn{width:100%;height:56px;border:0;border-radius:10px;background:var(--accent);color:var(--on-accent);font-family:var(--head);font-size:17px;cursor:pointer;box-shadow:0 10px 30px -10px rgba(8,206,232,.7);transition:filter .15s,transform .1s}
#jobFair .jc-btn:hover{filter:brightness(1.08)}
#jobFair .jc-btn:active{transform:translateY(1px)}
#jobFair .jc-btn:disabled{opacity:.6;cursor:wait}
#jobFair .jc-agree{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:14px;font-size:13px;color:rgba(255,255,255,.55);cursor:pointer}
#jobFair .jc-agree input{width:15px;height:15px;margin:0;accent-color:var(--accent)}
#jobFair .jc-err{display:block;color:#ff7486;font-size:12.5px;margin-top:8px}
#jobFair .jc-err:empty{display:none}
#jobFair .jc-err-c{text-align:center}
#jobFair .jc-note{margin-top:12px;font-size:12px;color:var(--muted);text-align:center}
#jobFair .jc-done{text-align:center;padding:30px 0 16px;color:#fff}
#jobFair .jc-done b{display:block;font-size:21px;letter-spacing:-.03em}
#jobFair .jc-done p{margin-top:8px;color:rgba(255,255,255,.55);font-size:14px}
@media (max-width:480px){
  #jobFair .jc-card{padding:24px 18px 22px}
  #jobFair .jc-phone{grid-template-columns:minmax(78px,1fr) 10px 1fr 10px 1fr;gap:4px}
  #jobFair .jc-phone select{padding:0 6px}
}
@media (max-width:1024px){
  #jobFair .hero{min-height:0;padding-top:84px}
  #jobFair .stat-grid{grid-template-columns:1fr 1fr}
  #jobFair .stat:nth-child(2){border-right:none}
  #jobFair .stat:nth-child(-n+2){border-bottom:1px solid var(--line)}
  #jobFair .recap, #jobFair .pass-row{grid-template-columns:1fr}
  #jobFair .cast{grid-template-columns:repeat(3,1fr)}
  #jobFair .pass{max-width:380px;margin:20px auto 0}
}
@media (max-width:768px){
  #jobFair .hero{padding:76px 0 90px}
  #jobFair .hero .rig{display:none}
  #jobFair .curtain{width:5%!important;animation:none!important}
  #jobFair .hero .wrap{z-index:4;padding:0 22px}
  #jobFair .footlight{left:5%;right:5%}
  #jobFair .finale-sec .curtain{display:none}
  #jobFair .billing li{padding:16px 0}
  #jobFair .poster-top{letter-spacing:.3em}
  #jobFair section{padding:90px 0}
  #jobFair .wrap{padding:0 16px}
  #jobFair .cue{grid-template-columns:72px 1fr;gap:6px 16px}
  #jobFair .cue p{grid-column:2}
  #jobFair .cue .no b{font-size:26px}
  #jobFair .cast{grid-template-columns:1fr 1fr}
  #jobFair .recap .pics{min-height:320px}
  #jobFair .fq button{font-size:16px}
  #jobFair .fq .ans p{padding-left:0}
  #jobFair .video .vcap{left:16px;bottom:12px}
  #jobFair .video .vcap b{display:none}
  #jobFair .billing .ln{font-size:19px}
}

/* ===== 2026-10-22 검수 반영 ===== */
/* 사이트 공통 CSS 의 .wrap{overflow:hidden} 이 들어오면 영상·폼의 빛 그림자가 잘림 → 이 페이지 안에서는 보이게 */
#jobFair .wrap{overflow:visible}
/* 참여 기업 카드: 줄 끝에 1장만 혼자 남지 않게 */
@media (max-width:1024px){#jobFair .cast.c4{grid-template-columns:repeat(4,1fr)}}
@media (max-width:560px){#jobFair .cast.c4{grid-template-columns:1fr 1fr}#jobFair .cast.c5 .lg:last-child{grid-column:1/-1}}
/* 모바일·태블릿 상단 여백: 실서버는 GNB·서브메뉴가 본문 위에 따로 붙음 */
@media (max-width:1024px){#jobFair .hero{padding-top:64px}#jobFair .hero .valance{height:28px}}
@media (max-width:768px){#jobFair .hero{padding-top:44px}#jobFair .hero .valance{height:18px}}
/* 모바일 영상 캡션이 썸네일 글자와 겹치지 않게 어두운 바탕 */
@media (max-width:768px){#jobFair .video .vcap span{display:inline-block;padding:5px 10px;border-radius:6px;background:rgba(10,12,16,.78);letter-spacing:.12em}}
/* HP-IM-261023-000: 아래로 내렸다 다시 위로 올리면 #header 에 클래스가 하나도 안 남아
   공통 배경(.init_bg 흰색 50%)이 사라진다 → 어두운 본문 위에서 메뉴 글자(#24272d)가 묻힘.
   recruitment.css · recruitsystem.css 와 같게 클래스 없는 상태까지 흰 배경으로 고정 */
#header,#header.init_bg,#header.up,#header.down{background:rgba(255,255,255,.96)}