@charset "utf-8";
/* ============================================================
   2026 제3회 시큐리티아카데미 밋업데이 — 모바일 우선 원페이지
   ------------------------------------------------------------
   · 모바일(기본) → 태블릿(640px) → PC(1024px) 순으로 확장
   · 색상/간격은 :root 변수로 관리 (키비주얼 전달 시 여기만 교체)
   ============================================================ */

/* ───────────── 디자인 토큰 ───────────── */
:root{
  /* 브랜드 — 키비주얼 확정 시 이 값들만 교체하면 전체 톤이 바뀝니다 */
  --brand:        #7ad9bd;   /* 강조색 하나만 사용 (네온기를 뺀 세이지 그린) */
  --brand-ink:    #0a1714;   /* 강조색 위에 올라가는 글자색 */

  /* 배경 — 푸른기를 줄인 중성 먹색 */
  --bg:           #0e1013;
  --bg-soft:      #131619;
  --bg-card:      #16191d;
  --bg-card-2:    #1b1f24;

  /* 텍스트 */
  --tx:           #f0f1f2;
  --tx-sub:       #a3a8ae;
  --tx-dim:       #6d737b;

  /* 선 */
  --line:         var(--fill-2);
  --line-2:       var(--line-2);

  /* 은은한 면 채움 — 테마마다 밝기 방향이 달라 토큰으로 분리 */
  --fill:         var(--fill);
  --fill-2:       var(--fill-2);
  --fill-3:       var(--fill-3);
  --grid:         var(--grid);

  /* 강조색 투명도 변형 */
  --brand-a08:    var(--brand-a08);
  --brand-a12:    var(--brand-a12);
  --brand-a20:    rgba(122,217,189,.20);
  --brand-a40:    rgba(122,217,189,.40);

  /* 영상·캔버스 위에 덮는 베일 (가독성 확보) */
  --veil-1:       rgba(14,16,19,.72);
  --veil-2:       rgba(14,16,19,.35);
  --veil-3:       rgba(14,16,19,.55);

  /* 떠 있는 면 (헤더·하단바·모달·토스트) */
  --float:        rgba(14,16,19,.78);
  --float-solid:  rgba(17,20,24,.98);
  --dim:          rgba(5,6,8,.78);
  --shadow:       rgba(0,0,0,.5);

  /* 상태색 투명도 변형 */
  --warn-a08:     rgba(255,181,71,.08);
  --warn-a24:     rgba(255,181,71,.24);
  --danger-a10:   rgba(255,107,107,.10);
  --danger-a30:   rgba(255,107,107,.30);
  --danger-tx:    #ffb3b3;

  /* 상태 */
  --warn:         #ffb547;
  --danger:       #ff6b6b;
  --ok:           var(--brand);

  /* 레이아웃 */
  --wrap:         1120px;
  --wrap-narrow:  720px;
  --hd-h:         58px;
  --fab-h:        calc(64px + env(safe-area-inset-bottom));
  --r:            6px;
  --r-lg:         10px;

  --ff:  'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo',
         'Malgun Gothic', 'Noto Sans KR', system-ui, sans-serif;
  /* 숫자·영문도 같은 글꼴을 쓰되 고정폭 숫자로 정렬을 맞춘다 */
  --ff-en: var(--ff);

  --ease: cubic-bezier(.22,.8,.3,1);
}

/* ───────────── 리셋 ───────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--hd-h) + 12px); }
body{
  margin:0; background:var(--bg); color:var(--tx);
  font-family:var(--ff); font-size:16px; line-height:1.65;
  letter-spacing:-.01em; word-break:keep-all; overflow-wrap:break-word;
  -webkit-font-smoothing:antialiased;
  padding-bottom:var(--fab-h);
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
/* 숫자가 흔들리지 않도록 고정폭 숫자 사용 */
.sec__no, .hero__meta .k, .dday__value, .tl__time b, .ft__copy,
.kw__no, .points li::before, .gauge__num b, .done__sum dd{
  font-variant-numeric:tabular-nums; font-feature-settings:'tnum' 1;
}
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input,select,textarea{ font:inherit; color:inherit; }
h1,h2,h3,h4,p,dl,dd,figure{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
fieldset{ margin:0; padding:0; border:0; min-width:0; }
legend{ padding:0; }
:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; border-radius:6px; }

/* hidden 속성은 어떤 display 선언보다 우선한다.
   (.modal{display:flex} 같은 규칙이 [hidden] 을 덮어쓰는 문제 방지) */
[hidden]{ display:none !important; }


@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
  .hero__canvas{ display:none; }
  .hero__scroll span{ animation:none; }
}

/* ───────────── 공통 레이아웃 ───────────── */
.wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding:0 20px; }
.wrap--narrow{ max-width:var(--wrap-narrow); }
.pc-only{ display:none; }

.sec{ padding:64px 0; position:relative; }
.sec--about{ background:var(--bg-soft); }
.sec--apply{ background:var(--bg-soft); }
.sec--contact{ background:var(--bg-soft); }

.sec__no{
  font-family:var(--ff-en); font-size:12px; font-weight:700; letter-spacing:.06em;
  color:var(--tx-dim); margin-bottom:14px;
  padding-bottom:12px; border-bottom:1px solid var(--line);
}
.sec__title{
  font-size:clamp(24px,6.2vw,36px); font-weight:800; line-height:1.3; letter-spacing:-.03em;
  margin-bottom:14px;
}
.sec__desc{ color:var(--tx-sub); font-size:15px; line-height:1.75; margin-bottom:32px; white-space:pre-line; }
.sec__desc--strong{ color:var(--tx); font-weight:700; }
/* 커리어 조사 혜택 안내 (커피 쿠폰) */
.careernote{
  display:flex; gap:8px; align-items:flex-start;
  margin:-20px 0 28px; padding:13px 16px; border-radius:6px;
  background:var(--brand-a08); border:1px solid var(--brand-a20);
  font-size:14px; font-weight:700; line-height:1.6; color:var(--brand);
}
.careernote::before{ content:"☕"; flex:none; font-weight:400; }
.subtitle{ font-size:17px; font-weight:700; margin:28px 0 12px; }

/* ───────────── 버튼 ───────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:48px; padding:0 22px; border-radius:6px;
  font-size:15px; font-weight:700; letter-spacing:-.02em; white-space:nowrap;
  transition:transform .18s var(--ease), background .18s var(--ease),
             border-color .18s var(--ease), opacity .18s var(--ease);
}
.btn svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.btn:active{ transform:scale(.975); }
.btn:disabled{ opacity:.4; cursor:not-allowed; }

.btn--primary{ background:var(--brand); color:var(--brand-ink); }
.btn--primary:disabled{ background:#2b3550; color:var(--tx-dim); }
.btn--ghost{ background:var(--fill); color:var(--tx); border:1px solid var(--line-2); }
.btn--line{ background:transparent; color:var(--brand); border:1px solid var(--brand-a40); }
.btn--danger{ background:var(--danger-a10); color:var(--danger); border:1px solid var(--danger-a30); }
.btn--lg{ height:54px; padding:0 26px; font-size:16px; }
.btn--full{ width:100%; }
.btn--grow{ flex:1; }

/* ───────────── 헤더 ───────────── */
.hd{
  position:fixed; inset:0 0 auto 0; z-index:90; height:var(--hd-h);
  background:var(--float); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent; transition:border-color .25s var(--ease), background .25s var(--ease);
}
.hd.is-scrolled{ border-bottom-color:var(--line); background:var(--float-solid); }
.hd__inner{
  max-width:var(--wrap); height:100%; margin:0 auto; padding:0 16px;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.hd__logo{ display:flex; align-items:center; gap:9px; min-width:0; }

.hd__logo-txt{
  font-family:var(--ff-en); font-size:11.5px; font-weight:600; letter-spacing:.045em;
  color:var(--tx-sub); line-height:1.25; min-width:0;
}
/* 행사명이 길어 좁은 화면에서는 두 줄로 접는다 */
.hd__logo-txt b{ display:block; color:var(--tx); font-weight:800; letter-spacing:.03em; }

.hd__nav{ display:none; align-items:center; gap:4px; }
.hd__link{
  padding:8px 12px; border-radius:8px; font-size:14px; font-weight:600; color:var(--tx-sub);
  transition:color .18s var(--ease), background .18s var(--ease);
}
.hd__link:hover{ color:var(--tx); background:var(--fill); }
.hd__link.is-active{ color:var(--brand); }
.hd__lookup{
  margin-left:8px; padding:8px 16px; border-radius:6px; font-size:13px; font-weight:700;
  border:1px solid var(--line-2); color:var(--tx);
  transition:border-color .18s var(--ease), background .18s var(--ease);
}
.hd__lookup:hover{ border-color:var(--brand); color:var(--brand); }

.hd__burger{ width:40px; height:40px; display:grid; place-content:center; gap:5px; margin-right:-8px; }
.hd__burger span{
  display:block; width:20px; height:2px; background:var(--tx); border-radius:2px;
  transition:transform .25s var(--ease), opacity .2s var(--ease);
}
.hd__burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.hd__burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hd__burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.mnav{
  position:absolute; inset:var(--hd-h) 0 auto 0; padding:10px 16px 20px;
  background:var(--float-solid); border-bottom:1px solid var(--line);
  display:flex; flex-direction:column; animation:drop .22s var(--ease);
}
@keyframes drop{ from{ opacity:0; transform:translateY(-8px);} to{ opacity:1; transform:none;} }
.mnav__link{ padding:14px 6px; font-size:16px; font-weight:600; border-bottom:1px solid var(--line); }
.mnav__link:last-of-type{ border-bottom:0; }
.mnav__lookup{
  margin-top:12px; height:48px; border-radius:6px; font-size:15px; font-weight:700;
  border:1px solid var(--line-2); color:var(--brand);
}

/* ───────────── 히어로 ───────────── */
.hero{
  position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:center;
  padding:calc(var(--hd-h) + 40px) 0 72px; overflow:hidden;
}
.hero__bg{ position:absolute; inset:0; z-index:0; }
.hero__grid{
  position:absolute; inset:0; opacity:.5;
  background-image:
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size:40px 40px;
  mask-image:radial-gradient(ellipse 90% 70% at 50% 35%, #000 20%, transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 35%, #000 20%, transparent 78%);
}
/* 키비주얼 영상 — 설정 시에만 노출 */
.hero__video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:0; transition:opacity 1.1s var(--ease);
}
.hero__video.is-on{ opacity:.55; }

/* 자체 애니메이션 캔버스 */
.hero__canvas{ position:absolute; inset:0; width:100%; height:100%; opacity:1; }

/* 배경 위에 덮어 글자 가독성을 확보하는 베일 */
.hero__veil{
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 120% 85% at 30% 40%, var(--veil-1) 0%, var(--veil-2) 45%, transparent 75%),
    linear-gradient(180deg, var(--veil-3) 0%, transparent 28%, transparent 62%, var(--bg) 100%);
}


.hero__inner{ position:relative; z-index:1; width:100%; max-width:var(--wrap); margin:0 auto; padding:0 20px; }

/* 첫 진입 시 위 요소부터 차례로 올라오게 한다 (총 0.8초 내외) */
.hero__badge, .hero__title, .hero__tagline, .hero__meta, .hero__cta, .hero__status{
  animation:heroUp .8s var(--ease) both;
}

.hero__kicker{
  display:inline-block; margin-bottom:22px; padding-bottom:7px;
  border-bottom:1px solid var(--brand);
  font-size:13px; font-weight:600; letter-spacing:.02em; color:var(--brand);
}

.hero__badge{
  display:inline-flex; align-items:center; gap:8px; margin-bottom:20px;
  padding:7px 14px 7px 11px; border-radius:999px;
  border:1px solid var(--brand-a40); background:var(--brand-a08);
  font-family:var(--ff-en); font-size:12px; font-weight:700; letter-spacing:.14em; color:var(--brand);
}

.hero__title{ margin-bottom:18px; }
.hero__title-sm{
  display:block; font-size:clamp(14px,4vw,18px); font-weight:600; letter-spacing:.04em;
  color:var(--tx-sub); margin-bottom:8px;
}
.hero__title-lg{
  display:block; color:var(--tx);
  font-size:clamp(40px,12vw,84px); font-weight:800; line-height:1.05; letter-spacing:-.045em;
}
.hero__tagline{ font-size:clamp(15px,4.2vw,19px); color:var(--tx-sub); margin-bottom:28px; }

.hero__meta{ display:flex; flex-direction:column; gap:10px; margin-bottom:30px; }
.hero__meta li{ display:flex; align-items:baseline; gap:14px; }
.hero__meta .k{
  flex:none; width:52px; font-family:var(--ff-en); font-size:11px; font-weight:700;
  letter-spacing:.14em; color:var(--brand);
}
.hero__meta .v{ font-size:15px; font-weight:600; color:var(--tx); }

.hero__cta{ display:flex; flex-direction:column; gap:10px; margin-bottom:34px; }

/* D-Day + 접수 현황 */
.hero__status{
  display:grid; gap:14px; padding:18px; border-radius:var(--r-lg);
  background:var(--bg-card); border:1px solid var(--line);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.dday{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.dday__label{ font-size:13px; color:var(--tx-sub); }
.dday__value{
  font-family:var(--ff-en); font-size:28px; font-weight:700; line-height:1; color:var(--brand);
}
.dday__value.is-closed{ color:var(--tx-dim); font-size:20px; }
.dday__sub{ font-size:12px; color:var(--tx-dim); width:100%; }

.gauge__top{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:8px; }
.gauge__label{ font-size:13px; color:var(--tx-sub); }
.gauge__num{ font-size:13px; color:var(--tx-sub); }
.gauge__num b{ font-family:var(--ff-en); font-size:18px; color:var(--tx); }
.gauge__bar{ height:7px; border-radius:99px; background:var(--fill-2); overflow:hidden; }
.gauge__bar i{
  display:block; height:100%; border-radius:99px;
  background:var(--brand);
  transition:width .7s var(--ease);
}
.gauge__sub{ display:block; margin-top:8px; font-size:12px; color:var(--tx-dim); }

.hero__scroll{
  position:absolute; left:50%; bottom:20px; transform:translateX(-50%); z-index:1;
  width:24px; height:38px; border:1.5px solid var(--line-2); border-radius:14px;
  display:grid; place-items:start center; padding-top:7px;
}
.hero__scroll span{ width:3px; height:7px; border-radius:2px; background:var(--brand); animation:scroll 1.7s infinite; }
@keyframes scroll{ 0%{ opacity:0; transform:translateY(0);} 35%{opacity:1;} 100%{ opacity:0; transform:translateY(12px);} }

/* ───────────── 행사 소개 — 번호 매긴 목록 ───────────── */
.points{ counter-reset:pt; border-top:1px solid var(--line); }
.points li{
  counter-increment:pt; position:relative;
  padding:22px 0 22px 46px; border-bottom:1px solid var(--line);
}
.points li::before{
  content:counter(pt,decimal-leading-zero);
  position:absolute; left:0; top:24px;
  font-family:var(--ff-en); font-size:13px; font-weight:700; color:var(--brand);
}
.points h3{ font-size:17px; font-weight:700; margin-bottom:6px; letter-spacing:-.02em; }
.points p{ font-size:14.5px; color:var(--tx-sub); line-height:1.75; }

/* ───────────── 행사 정보 카드 ───────────── */
.infocards{ display:grid; gap:12px; }
.infocard{
  padding:22px 20px; border-radius:var(--r);
  background:var(--bg-card);
  border:1px solid var(--line);
}
.infocard__ico{ display:block; font-size:22px; margin-bottom:10px; }
.infocard h3{ font-size:13px; font-weight:600; color:var(--brand); margin-bottom:6px; letter-spacing:.02em; }
.infocard__main{ font-size:18px; font-weight:700; letter-spacing:-.02em; }
.infocard__sub{ font-size:13px; color:var(--tx-sub); margin-top:4px; }
.infocard__link{ display:inline-block; margin-top:10px; font-size:13px; font-weight:600; color:var(--brand); }
.infonote{ margin-top:22px; font-size:13px; color:var(--tx-dim); text-align:center; }
.infonote b{ color:var(--tx-sub); font-weight:600; }

/* ───────────── 프로그램 타임라인 ───────────── */
.timeline{ position:relative; padding-left:4px; }
.timeline__skeleton{ color:var(--tx-dim); font-size:14px; }
.tl{ position:relative; display:grid; grid-template-columns:62px 1fr; gap:14px; padding-bottom:22px; }
.tl:last-child{ padding-bottom:0; }
.tl::before{
  content:''; position:absolute; left:6px; top:22px; bottom:0; width:1px;
  background:linear-gradient(180deg, var(--line-2), transparent);
}
.tl:last-child::before{ display:none; }
.tl__time{ position:relative; padding-left:20px; }
.tl__time::before{
  content:''; position:absolute; left:1px; top:7px; width:11px; height:11px; border-radius:50%;
  background:var(--bg); border:2px solid var(--brand);
}
.tl__time b{ font-family:var(--ff-en); font-size:15px; font-weight:700; color:var(--tx); }
.tl__time span{ display:block; font-size:11px; color:var(--tx-dim); margin-top:2px; }
.tl__body{
  padding:14px 16px; border-radius:var(--r); background:var(--bg-card); border:1px solid var(--line);
}
.tl__tag{
  display:inline-block; margin-bottom:7px; padding:3px 9px; border-radius:6px;
  font-size:11px; font-weight:700; letter-spacing:.02em;
  background:var(--brand-a12); color:var(--brand);
}
.tl__body h3{ font-size:15px; font-weight:700; margin-bottom:4px; }
.tl__body p{ font-size:13px; color:var(--tx-sub); line-height:1.65; }
.program__note{
  margin-top:26px; padding:14px 16px; border-radius:var(--r);
  background:var(--warn-a08); border:1px solid var(--warn-a24);
  font-size:13px; color:var(--warn); line-height:1.6;
}

/* ───────────── 신청 폼 ───────────── */
.notice{ padding:16px 18px; border-radius:var(--r); margin-bottom:20px; }
.notice--warn{ background:var(--warn-a08); border:1px solid var(--warn-a24); }
.notice--ok{ background:var(--brand-a08); border:1px solid var(--brand-a20); }
.notice--ok strong{ color:var(--brand); }
.notice strong{ display:block; font-size:15px; margin-bottom:4px; color:var(--warn); }
.notice p{ font-size:13px; color:var(--tx-sub); }

.formcard{
  padding:24px 18px; border-radius:var(--r-lg);
  background:var(--bg-card); border:1px solid var(--line);
}
.formcard.is-locked{ opacity:.45; pointer-events:none; filter:grayscale(.4); }

/* 단계 표시 */
.steps{ display:flex; align-items:center; gap:6px; margin-bottom:26px; }
.steps__i{ flex:1; display:flex; align-items:center; gap:7px; min-width:0; }
.steps__i b{
  flex:none; width:24px; height:24px; border-radius:50%; display:grid; place-items:center;
  font-size:12px; font-weight:700; background:var(--fill-2); color:var(--tx-dim);
  transition:background .25s var(--ease), color .25s var(--ease);
}
.steps__i span{
  font-size:12px; font-weight:600; color:var(--tx-dim); white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis;
}
.steps__i.is-on b{ background:var(--brand); color:var(--brand-ink); }
.steps__i.is-on span{ color:var(--tx); }
.steps__i.is-done b{ background:var(--brand-a20); color:var(--brand); }

.step__title{ font-size:18px; font-weight:700; margin-bottom:6px; }
.step__desc{ font-size:14px; color:var(--tx-sub); margin-bottom:18px; }
.step__nav{ margin-top:24px; }
.step__nav--row{ display:flex; gap:10px; }

/* 허니팟 */
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* 참가 구분 선택 */
.typegrid{ display:grid; gap:10px; }
.typecard{
  text-align:left; padding:16px 18px; border-radius:var(--r);
  background:var(--bg-card-2); border:1.5px solid var(--line);
  transition:border-color .2s var(--ease), background .2s var(--ease);
}
.typecard:hover{ border-color:var(--line-2); }
.typecard.is-on{ border-color:var(--brand); background:var(--brand-a08); }
.typecard b{ display:block; font-size:16px; font-weight:700; margin-bottom:3px; }
.typecard span{ font-size:13px; color:var(--tx-sub); }

/* 커리어 조사 연결 자리 */
.careerbox{
  margin-top:16px; padding:18px; border-radius:var(--r);
  border:1px dashed var(--line-2); background:var(--fill-3);
}
.careerbox__tag{
  display:inline-block; margin-bottom:8px; padding:3px 9px; border-radius:6px;
  font-size:11px; font-weight:700; background:var(--fill-2); color:var(--tx-sub);
}
.careerbox h4{ font-size:15px; font-weight:700; margin-bottom:5px; }
.careerbox p{ font-size:13px; color:var(--tx-sub); line-height:1.65; }
.careerbox .btn{ margin-top:12px; height:42px; font-size:14px; }
/* 조사가 열려 있을 때 / 이미 응답을 마쳤을 때 */
.careerbox.is-live, .careerbox.is-done{
  border-style:solid; border-color:var(--brand-a20); background:var(--brand-a08);
}
.careerbox.is-live .careerbox__tag, .careerbox.is-done .careerbox__tag{
  background:var(--brand-a12); color:var(--brand);
}

/* 만찬 키워드 선택 개수 안내 */
.kwcount{ margin-top:10px; font-size:12.5px; color:var(--tx-dim); }
.kwcount b{ color:var(--brand); font-weight:700; }
.kwcount span{ margin-left:6px; }
.kwcount span.is-short{ color:var(--warn); }

/* 조사 우선 동선의 건너뛰기 링크 */
.skiplink{
  display:block; width:100%; margin-top:12px; padding:6px 0;
  font-size:13px; color:var(--tx-dim); text-decoration:underline; text-underline-offset:3px;
}
.skiplink:hover{ color:var(--tx-sub); }

/* 선택된 구분 요약 */
.chosen{
  display:flex; align-items:center; gap:10px; margin-bottom:22px;
  padding:12px 14px; border-radius:6px; background:var(--brand-a08);
  border:1px solid var(--brand-a20);
}
.chosen span{ font-size:12px; color:var(--tx-sub); }
.chosen b{ flex:1; font-size:14px; font-weight:700; color:var(--brand); }
.chosen__edit{ font-size:12px; font-weight:600; color:var(--tx-sub); text-decoration:underline; }

/* 필드셋 */
.fs{ padding:20px 0; border-top:1px solid var(--line); }
.fs:first-of-type{ padding-top:0; border-top:0; }
.fs__legend{ font-size:15px; font-weight:700; margin-bottom:14px; }
.fs__desc{ font-size:13px; color:var(--tx-sub); margin:-8px 0 14px; }
.fs__desc b{ color:var(--brand); }

.req, .opt{
  display:inline-block; margin-left:5px; padding:2px 7px; border-radius:5px;
  font-size:10px; font-weight:700; font-style:normal; vertical-align:2px;
}
.req{ background:var(--brand-a12); color:var(--brand); }
.opt{ background:var(--fill-2); color:var(--tx-dim); }

.field{ margin-bottom:16px; }
.field:last-child{ margin-bottom:0; }
.field > label{ display:block; font-size:14px; font-weight:600; margin-bottom:8px; }
.field input[type=text],
.field input[type=tel],
.field input[type=email],
.field textarea,
.selectwrap select{
  width:100%; min-height:50px; padding:13px 16px; border-radius:6px;
  background:var(--bg-card-2); border:1.5px solid var(--line);
  /* 16px 미만이면 iOS 사파리가 입력창을 누를 때 화면을 확대한다 */
  font-size:16px; transition:border-color .18s var(--ease), background .18s var(--ease);
}
.field textarea{ resize:vertical; line-height:1.6; min-height:84px; }
.field input::placeholder, .field textarea::placeholder{ color:var(--tx-dim); }
.field input:focus, .field textarea:focus, .selectwrap select:focus{
  outline:none; border-color:var(--brand); background:var(--brand-a08);
}
.field.is-err input, .field.is-err textarea, .field.is-err .selectwrap select{ border-color:var(--danger); }

.selectwrap{ position:relative; }
.selectwrap select{ appearance:none; -webkit-appearance:none; padding-right:42px; cursor:pointer; }
.selectwrap::after{
  content:''; position:absolute; right:18px; top:50%; width:8px; height:8px;
  border-right:2px solid var(--tx-sub); border-bottom:2px solid var(--tx-sub);
  transform:translateY(-70%) rotate(45deg); pointer-events:none;
}
.selectwrap select option{ background:var(--bg-card-2); color:var(--tx); }

.hint{ font-size:12px; color:var(--tx-dim); margin-top:6px; }
.err{ font-size:12.5px; color:var(--danger); margin-top:6px; display:none; }
.err.is-on{ display:block; }
.formerr{
  margin:16px 0 0; padding:12px 14px; border-radius:6px; font-size:13.5px;
  background:var(--danger-a10); border:1px solid var(--danger-a30); color:var(--danger-tx);
}

/* 칩 선택 */
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{
  padding:10px 16px; border-radius:6px; font-size:14px; font-weight:600;
  background:var(--bg-card-2); border:1.5px solid var(--line);
  transition:border-color .18s var(--ease), background .18s var(--ease), color .18s var(--ease);
}
.chip:hover{ border-color:var(--line-2); }
.chip.is-on{ border-color:var(--brand); background:var(--brand-a12); color:var(--brand); }
.chips--lg .chip{ flex:1; min-width:140px; height:50px; }

/* 만찬 키워드 그리드 */
.kwgrid{ display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.kw{
  display:flex; align-items:center; gap:8px; padding:12px 12px; border-radius:6px;
  text-align:left; background:var(--bg-card-2); border:1.5px solid var(--line);
  transition:border-color .18s var(--ease), background .18s var(--ease);
}
.kw:hover{ border-color:var(--line-2); }
.kw.is-on{ border-color:var(--brand); background:var(--brand-a12); }
.kw__no{
  flex:none; font-family:var(--ff-en); font-size:11px; font-weight:700;
  color:var(--tx-dim); letter-spacing:.04em;
}
.kw.is-on .kw__no{ color:var(--brand); }
.kw__tx{ font-size:13px; font-weight:600; line-height:1.35; }
.kw.is-on .kw__tx{ color:var(--brand); }

/* 동의 */
.fs--agree{ padding-bottom:4px; }
.agree{ margin-bottom:18px; }
.agree:last-of-type{ margin-bottom:0; }
.check{ display:flex; align-items:flex-start; gap:10px; cursor:pointer; }
.check input{ position:absolute; opacity:0; width:0; height:0; }
.check__box{
  flex:none; width:22px; height:22px; margin-top:1px; border-radius:7px;
  background:var(--bg-card-2); border:1.5px solid var(--line-2); position:relative;
  transition:background .18s var(--ease), border-color .18s var(--ease);
}
.check__box::after{
  content:''; position:absolute; left:7px; top:3px; width:5px; height:10px;
  border-right:2px solid var(--brand-ink); border-bottom:2px solid var(--brand-ink);
  transform:rotate(45deg) scale(0); transition:transform .18s var(--ease);
}
.check input:checked + .check__box{ background:var(--brand); border-color:var(--brand); }
.check input:checked + .check__box::after{ transform:rotate(45deg) scale(1); }
.check input:focus-visible + .check__box{ outline:2px solid var(--brand); outline-offset:2px; }
.check__txt{ font-size:14px; line-height:1.5; }
.agree__more{
  margin:8px 0 0 32px; font-size:12.5px; color:var(--tx-dim); text-decoration:underline;
}
.terms{
  margin:10px 0 0 32px; padding:14px 16px; border-radius:6px;
  background:var(--fill-3); border:1px solid var(--line);
  font-size:12.5px; color:var(--tx-sub); line-height:1.7;
}
.terms dt{ font-weight:700; color:var(--tx); margin-top:10px; }
.terms dt:first-child{ margin-top:0; }
.terms dd{ margin:3px 0 0; }
/* 접기 없이 항상 펼쳐 두는 약관 — 길어지면 자체 스크롤 */
.terms--fixed{ max-height:290px; overflow-y:auto; overscroll-behavior:contain; }
.terms__sub{
  margin:16px 0 6px; padding-top:14px; border-top:1px solid var(--line);
  font-size:13px; font-weight:700; color:var(--tx);
}
.terms__lead{ margin:0 0 10px; }

/* 완료 화면 */
.done{ text-align:center; padding:12px 0; }
.done__ico{ width:72px; height:72px; margin:0 auto 20px; }
.done__ico svg{ width:100%; height:100%; fill:none; stroke:var(--brand); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.done__ico circle{ opacity:.3; }
.done__ico path{ stroke-dasharray:36; stroke-dashoffset:36; animation:draw .5s .15s var(--ease) forwards; }
@keyframes draw{ to{ stroke-dashoffset:0; } }
.done__title{ font-size:20px; font-weight:800; margin-bottom:8px; }
.done__desc{ font-size:14px; color:var(--tx-sub); line-height:1.7; margin-bottom:22px; }
.done__sum{
  text-align:left; padding:16px; border-radius:var(--r);
  background:var(--bg-card-2); border:1px solid var(--line); margin-bottom:20px;
}
.done__sum div{ display:flex; gap:12px; padding:7px 0; border-bottom:1px solid var(--line); }
.done__sum div:last-child{ border-bottom:0; }
.done__sum dt{ flex:none; width:88px; font-size:13px; color:var(--tx-dim); }
.done__sum dd{ flex:1; margin:0; font-size:13.5px; font-weight:600; }
.done__nav{ display:flex; flex-direction:column; gap:10px; }

/* ───────────── FAQ ───────────── */
.faq{ border-top:1px solid var(--line); }
.faq__i{ border-bottom:1px solid var(--line); }
.faq__q{
  width:100%; display:flex; align-items:flex-start; gap:12px; padding:20px 0;
  text-align:left; font-size:15.5px; font-weight:600; line-height:1.5;
  transition:color .2s var(--ease);
}
.faq__q .q{ flex:none; font-family:var(--ff-en); font-weight:700; color:var(--tx-dim); transition:color .2s var(--ease); }
.faq__q .t{ flex:1; }
.faq__q .arw{
  flex:none; width:18px; height:18px; margin-top:4px; position:relative;
  transition:transform .28s var(--ease);
}
.faq__q .arw::before, .faq__q .arw::after{
  content:''; position:absolute; left:50%; top:50%; background:var(--tx-sub); border-radius:2px;
  transform:translate(-50%,-50%); transition:background .2s var(--ease), opacity .2s var(--ease);
}
.faq__q .arw::before{ width:14px; height:2px; }
.faq__q .arw::after{ width:2px; height:14px; }
.faq__i.is-open .faq__q{ color:var(--brand); }
.faq__i.is-open .faq__q .q{ color:var(--brand); }
.faq__i.is-open .arw{ transform:rotate(180deg); }
.faq__i.is-open .arw::before{ background:var(--brand); }
.faq__i.is-open .arw::after{ opacity:0; }
.faq__a{ overflow:hidden; height:0; transition:height .3s var(--ease); }
.faq__a-in{
  padding:0 0 22px 28px; font-size:14px; color:var(--tx-sub); line-height:1.8; white-space:pre-line;
}

/* ───────────── 만족도 조사 ───────────── */
.surveybox{
  display:flex; flex-direction:column; align-items:center; gap:18px; padding:28px 20px;
  border-radius:var(--r-lg); background:var(--bg-card); border:1px solid var(--line);
}
.surveybox img{ width:170px; height:170px; border-radius:6px; background:#fff; padding:10px; }

/* ───────────── 문의 ───────────── */
.contactbox{
  padding:6px 18px; border-radius:var(--r-lg);
  background:var(--bg-card); border:1px solid var(--line);
}
.contactbox__row{
  display:flex; gap:14px; padding:15px 0; border-bottom:1px solid var(--line); align-items:baseline;
}
.contactbox__row:last-child{ border-bottom:0; }
.contactbox__row[hidden]{ display:none; }   /* 이메일 등 미기재 항목 숨김 */
.contactbox .k{ flex:none; width:84px; font-size:13px; color:var(--tx-dim); }
.contactbox .v{ flex:1; font-size:14.5px; font-weight:600; }
.contactbox .v a{ color:var(--brand); text-decoration:underline; text-underline-offset:3px; }

.notices li{
  position:relative; padding:0 0 0 16px; margin-bottom:10px;
  font-size:13.5px; color:var(--tx-sub); line-height:1.7;
}
.notices li::before{
  content:''; position:absolute; left:2px; top:10px; width:4px; height:4px;
  border-radius:50%; background:var(--brand); opacity:.7;
}

/* ───────────── 푸터 ───────────── */
.ft{ padding:36px 0 44px; border-top:1px solid var(--line); text-align:center; }
.ft__title{ font-size:15px; font-weight:700; margin-bottom:8px; }
.ft__meta{ font-size:12.5px; color:var(--tx-sub); margin-bottom:6px; }
.ft__copy{ font-size:11.5px; color:var(--tx-dim); font-family:var(--ff-en); letter-spacing:.04em; }

/* ───────────── 하단 고정 CTA ───────────── */
.fabbar{
  position:fixed; left:0; right:0; bottom:0; z-index:80;
  display:flex; gap:8px; padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  background:var(--float); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--line);
  transform:translateY(110%); transition:transform .3s var(--ease);
}
.fabbar.is-on{ transform:none; }
.fabbar__sub{
  flex:none; padding:0 16px; height:48px; border-radius:6px;
  font-size:14px; font-weight:700; color:var(--tx); border:1px solid var(--line-2);
}
.fabbar__main{
  flex:1; height:48px; border-radius:6px; display:grid; place-items:center;
  font-size:15px; font-weight:700; color:var(--brand-ink);
  background:var(--brand);
}

/* ───────────── 모달 ───────────── */
.modal{ position:fixed; inset:0; z-index:100; display:flex; align-items:flex-end; justify-content:center; }
.modal__dim{ position:absolute; inset:0; background:var(--dim); backdrop-filter:blur(3px); animation:fade .2s var(--ease); }
@keyframes fade{ from{opacity:0} to{opacity:1} }
.modal__panel{
  position:relative; width:100%; max-width:520px; max-height:92svh; overflow-y:auto;
  padding:28px 20px calc(28px + env(safe-area-inset-bottom));
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:var(--bg-card); border:1px solid var(--line); border-bottom:0;
  animation:up .28s var(--ease);
  -webkit-overflow-scrolling:touch;
}
@keyframes up{ from{ transform:translateY(24px); opacity:.6 } to{ transform:none; opacity:1 } }
.modal__x{
  position:absolute; right:12px; top:10px; width:40px; height:40px;
  font-size:26px; line-height:1; color:var(--tx-sub);
}
.modal__title{ font-size:19px; font-weight:800; margin-bottom:18px; padding-right:36px; }
.modal__desc{ font-size:13.5px; color:var(--tx-sub); margin-bottom:18px; }
.modal__body{ display:block; }
.modal__body .field:last-of-type{ margin-bottom:18px; }

.statusline{ display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.statusline__k{ font-size:13px; color:var(--tx-dim); }
.badge{
  padding:5px 12px; border-radius:999px; font-size:13px; font-weight:700;
  background:var(--brand-a12); color:var(--brand);
}
.badge.is-wait{ background:var(--warn-a08); color:var(--warn); }
.badge.is-cancel{ background:var(--danger-a10); color:var(--danger); }

.lk__edit{ margin-top:4px; padding-top:18px; border-top:1px solid var(--line); }
.lk__nav{ display:flex; gap:8px; margin-top:18px; }

/* ───────────── 토스트 ───────────── */
.toast{
  position:fixed; left:50%; bottom:calc(var(--fab-h) + 16px); z-index:200;
  transform:translateX(-50%) translateY(12px); opacity:0;
  padding:13px 20px; border-radius:999px; max-width:calc(100% - 40px);
  background:var(--float-solid); border:1px solid var(--line-2);
  font-size:14px; font-weight:600; text-align:center;
  box-shadow:0 10px 36px var(--shadow);
  transition:opacity .25s var(--ease), transform .25s var(--ease);
  pointer-events:none;
}
.toast.is-on{ opacity:1; transform:translateX(-50%) translateY(0); }
.toast.is-err{ border-color:var(--danger-a30); color:var(--danger-tx); }

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

/* ============================================================
   태블릿 (640px ~)
   ============================================================ */
@media (min-width:640px){
  .wrap{ padding:0 28px; }
  .hero__inner{ padding:0 28px; }
  .sec{ padding:88px 0; }

  .hero__meta{ flex-direction:row; flex-wrap:wrap; gap:10px 32px; }
  .hero__meta li{ flex-direction:column; gap:4px; }
  .hero__meta .k{ width:auto; }
  .hero__cta{ flex-direction:row; }
  .hero__status{ grid-template-columns:auto 1fr; gap:26px; align-items:center; padding:22px 24px; }
  .dday{ flex-direction:column; align-items:flex-start; gap:4px; padding-right:26px; border-right:1px solid var(--line); }
  .dday__value{ font-size:34px; }

  .feat{ grid-template-columns:repeat(2,1fr); gap:14px; }
  .infocards{ grid-template-columns:repeat(2,1fr); gap:14px; }
  .kwgrid{ grid-template-columns:repeat(3,1fr); }
  .formcard{ padding:32px 28px; }
  .done__nav{ flex-direction:row; justify-content:center; }
  .modal{ align-items:center; padding:20px; }
  .modal__panel{ border-radius:var(--r-lg); border-bottom:1px solid var(--line); padding:32px 28px; }
  .tl{ grid-template-columns:86px 1fr; gap:18px; }
}

/* ============================================================
   PC (1024px ~)
   ============================================================ */
@media (min-width:1024px){
  :root{ --hd-h:68px; --fab-h:0px; }
  body{ padding-bottom:0; }

  .pc-only{ display:inline; }
  .hd__nav{ display:flex; }
  .hd__burger{ display:none; }
  .hd__logo-txt{ font-size:13px; }
  .hd__logo-img{ width:34px; height:34px; }
  .fabbar{ display:none; }
  .toast{ bottom:30px; }

  .sec{ padding:110px 0; }
  .hero__inner{ max-width:var(--wrap); }
  .hero__status{ max-width:620px; }
  .feat{ grid-template-columns:repeat(4,1fr); }
  .infocards{ grid-template-columns:repeat(4,1fr); }
  .kwgrid{ grid-template-columns:repeat(4,1fr); }
  .typegrid{ grid-template-columns:repeat(2,1fr); }
  .formcard{ padding:40px 36px; }
  .steps__i span{ font-size:13px; }
}

/* 큰 화면에서 히어로 타이틀 과확대 방지 */
@media (min-width:1400px){
  .hero__title-lg{ font-size:72px; }
}

/* 로고 — 시큐리티아카데미 공식 엠블럼(원색 그대로) */
.hd__logo-img{
  display:block; width:30px; height:30px; flex:none;
  background:url(../img/logo-mark.png) center/contain no-repeat;
}

/* ───────────── 키비주얼 히어로 ───────────── */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

.kv{ margin:0 0 28px; }
.kv img{
  width:100%; height:auto; display:block;
  border:0; border-radius:0;
}

.hero__meta .v em{
  font-style:normal; color:var(--tx-sub); font-weight:500; margin-left:6px;
}
.hero__map{
  display:inline-block; margin-left:8px; padding:2px 8px; border-radius:4px;
  font-size:12px; font-weight:600; color:var(--brand);
  border:1px solid var(--brand-a40);
}

/* 키비주얼 테마에서는 배경 장식을 쓰지 않는다 (키비주얼 자체가 주인공) */
:root[data-theme="kv"] .hero__canvas,
:root[data-theme="kv"] .hero__veil,
:root[data-theme="kv"] .hero__grid{ display:none; }
:root[data-theme="kv"] .hero{ min-height:auto; padding-top:calc(var(--hd-h) + 28px); padding-bottom:56px; }
:root[data-theme="kv"] .hero__scroll{ display:none; }
:root[data-theme="kv"] .hero__title-lg{ color:var(--tx); }

/* 밝은 테마 공통 — 카드에 옅은 그림자를 줘 면이 구분되게 */
:root[data-theme="kv"] .formcard,
:root[data-theme="kv"] .infocard,
:root[data-theme="kv"] .tl__body,
:root[data-theme="kv"] .contactbox,
:root[data-theme="kv"] .hero__status,
:root[data-theme="kv"] .surveybox{
  box-shadow:0 1px 2px var(--shadow), 0 8px 24px rgba(12,54,88,.06);
}

/* ============================================================
   히어로 레이아웃 2종 — <html data-hero="poster | editorial">
   poster     : 키비주얼 이미지를 그대로 노출 (기본)
   editorial  : 제목을 실제 텍스트로 조판 + 키비주얼 그래픽만 배치
   ============================================================ */

/* 사용하지 않는 시안 블록은 서버가 걷어내므로 CSS 로 숨길 필요가 없다 */

/* ── 에디토리얼형 ── */
.kvsplit{ margin-bottom:34px; }

/* 그리드 칸 안에서 긴 단어가 칸을 밀어내지 않도록 */
.kvsplit__tx{ min-width:0; }

.kvsplit__round{
  font-size:clamp(15px,4vw,19px); font-weight:700; color:var(--brand);
  letter-spacing:-.02em; margin-bottom:6px;
}
.kvsplit__title{
  font-size:clamp(32px,9vw,58px); font-weight:800; line-height:1.12;
  letter-spacing:-.045em; color:var(--tx); margin-bottom:20px;
}
.kvsplit__title span{ display:block; }

.kvsplit__rule{
  width:52px; height:0; margin:0 0 20px; border:0; border-top:3px solid var(--tx);
}

.kvsplit__when{
  font-size:clamp(15px,4.2vw,18px); font-weight:700; color:var(--tx);
  letter-spacing:-.02em; line-height:1.5;
}
.kvsplit__where{
  font-size:clamp(14px,4vw,17px); font-weight:600; color:var(--tx-sub);
  letter-spacing:-.02em; line-height:1.55;
}
.kvsplit__when + .kvsplit__where{ margin-top:8px; }

.kvsplit__gr{ margin:26px 0 0; }
.kvsplit__gr img{
  display:block; width:100%; max-width:420px; height:auto; margin:0 auto;
  max-height:46svh; object-fit:contain; object-position:center;
}

/* 태블릿 이상 — 좌 텍스트 / 우 그래픽 */
@media (min-width:860px){
  .kvsplit{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,.82fr);
    gap:40px; align-items:center;
  }
  .kvsplit__gr{ margin:0; }
  .kvsplit__gr img{ max-width:100%; max-height:min(58svh,520px); }
}

/* ── 푸터 공식 로고 띠 ── */
.ft__logos{ margin:0 0 16px; }
.ft__logos img{
  width:100%; max-width:430px; height:auto; margin:0 auto; display:block;
}

/* 에디토리얼형에서는 아래 일시·장소 줄이 중복되므로 감춘다 */
:root[data-hero="editorial"] .hero__meta{ display:none; }

/* ============================================================
   키비주얼 하단 행사 개요 — 주요 정보 확대 · 가운데 정렬
   (2026-10-27 수정요청 : 일시 · 시간 · 장소 · CTA · 신청 마감까지)
   ------------------------------------------------------------
   미디어쿼리보다 뒤에 두어 화면 크기와 무관하게 중앙 정렬을 유지한다.
   ============================================================ */
.hero__inner{ text-align:center; }

/* 일시 · 시간 · 장소 */
.hero__meta{
  display:flex; flex-direction:column; align-items:center;
  gap:18px; max-width:880px; margin:4px auto 32px;
}
.hero__meta li{ display:flex; flex-direction:column; align-items:center; gap:6px; }
.hero__meta .k{
  width:auto; flex:none; font-family:var(--ff-en); font-size:12px; font-weight:700;
  letter-spacing:.2em; color:var(--brand);
}
.hero__meta .v{
  font-size:clamp(19px,5.4vw,26px); font-weight:700; letter-spacing:-.025em;
  line-height:1.35; color:var(--tx);
}
.hero__meta .v em{
  display:block; margin:3px 0 0; font-size:.78em; font-weight:600; color:var(--tx-sub);
}
.hero__map{ font-size:13px; padding:3px 10px; }

/* 참가 신청하기 · 프로그램 일정 보기 */
.hero__cta{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  flex-wrap:wrap;              /* 버튼이 3개라 좁은 화면에서 줄바꿈되게 둔다 */
  gap:12px; margin:0 auto 34px;
}
.hero__cta .btn--lg{
  height:60px; padding:0 34px; font-size:18px; font-weight:800; letter-spacing:-.02em;
}
.hero__cta .btn svg{ width:20px; height:20px; }

/* 신청 마감까지 · 접수 현황 */
.hero__status{
  max-width:720px; margin:0 auto; text-align:center;
  grid-template-columns:1fr; gap:18px; padding:22px 20px;
}
.dday{
  flex-direction:column; align-items:center; gap:6px;
  padding:0 0 18px; border-right:0; border-bottom:1px solid var(--line);
}
.dday__label{ font-size:14px; font-weight:600; color:var(--tx-sub); }
.dday__value{ font-size:clamp(38px,10vw,52px); font-weight:800; }
.dday__value.is-closed{ font-size:clamp(24px,6vw,30px); }
.dday__sub{ font-size:13px; }
.gauge__top{ justify-content:center; gap:12px; }
.gauge__label, .gauge__num{ font-size:14px; }
.gauge__num b{ font-size:21px; }
.gauge__sub{ font-size:13px; }

/* 태블릿 이상 — 한 줄에 나란히, 여전히 가운데 */
@media (min-width:700px){
  .hero__meta{
    flex-direction:row; flex-wrap:wrap; justify-content:center;
    align-items:flex-start;   /* 일시·시간·장소 라벨을 같은 높이에 맞춘다 */
    gap:14px 52px;
  }
  .hero__cta{ flex-direction:row; }
  .hero__status{ grid-template-columns:auto 1fr; gap:30px; align-items:center; padding:24px 30px; text-align:left; }
  .dday{
    align-items:flex-start; padding:0 30px 0 0;
    border-bottom:0; border-right:1px solid var(--line);
  }
  .gauge__top{ justify-content:space-between; }
}

/* 에디토리얼 시안에서는 제목 조판이 좌측 정렬이라 가운데 정렬을 풀어준다 */
:root[data-hero="editorial"] .hero__inner{ text-align:left; }

/* ============================================================
   2026-10-27 수정요청 반영분
   ============================================================ */

/* 참가 구분 배너 — 설명글 없이 구분 이름만 (가운데 정렬) */
.typecard--plain{
  display:flex; align-items:center; justify-content:center; text-align:center;
  min-height:68px; padding:18px 16px;
}
.typecard--plain b{ margin-bottom:0; font-size:17px; letter-spacing:-.02em; }

/* 참가 구분별 상단 안내문구 */
.typenotes{
  margin:0 0 20px; padding:14px 16px 14px 18px; border-radius:var(--r);
  background:var(--brand-a08); border:1px solid var(--brand-a20);
  list-style:none;
}
.typenotes li{
  position:relative; padding-left:14px; font-size:13.5px; line-height:1.7;
  color:var(--tx); font-weight:600;
}
.typenotes li + li{ margin-top:6px; }
.typenotes li::before{
  content:'*'; position:absolute; left:0; top:0; color:var(--brand); font-weight:800;
}

/* 커리어 현황 조사 — 참가신청과 분리된 독립 섹션 */
.careercard{
  margin-top:26px; padding:26px 24px; border-radius:var(--r-lg);
  background:var(--bg-card); border:1px solid var(--line);
  box-shadow:0 1px 2px var(--shadow), 0 8px 24px rgba(12,54,88,.06);
}
.careercard__tag{
  display:inline-block; margin-bottom:14px; padding:5px 12px; border-radius:999px;
  font-size:12px; font-weight:700; background:var(--brand-a12); color:var(--brand);
}
.careercard__meta{ display:grid; gap:12px; margin:0 0 16px; }
.careercard__meta dt{
  font-family:var(--ff-en); font-size:11px; font-weight:700; letter-spacing:.14em;
  color:var(--brand); margin-bottom:4px;
}
.careercard__meta dd{ margin:0; font-size:16px; font-weight:700; color:var(--tx); }
.careercard__note{
  margin:0 0 20px; padding-top:16px; border-top:1px solid var(--line);
  font-size:13.5px; line-height:1.75; color:var(--tx-sub);
}
@media (min-width:560px){
  .careercard__meta{ grid-template-columns:repeat(2,1fr); gap:20px; }
}