@charset "utf-8";
/* ==========================================================================
   참가신청 · 등록확인 · 로그인 플로우
   ========================================================================== */

/* --------------------------------------------------------------------------
   픽셀 필드가 깔린 밝은 페이지 (참가신청 · 마이페이지 등)
   Figma "참가신청 본문"(10800:23667 / 1920x3102)
   · 상단 픽셀 필드 : 10943:4389 (0,-218 / 1578x999)
   · 하단 픽셀 필드 : 10943:3306 (1106,2285 / 814x662)
   -------------------------------------------------------------------------- */
.pagebg {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: #ffffff;
}
.pagebg > .container,
.pagebg > .fm__head,
.pagebg > form { position: relative; z-index: 1; }

.pagebg__dots-top {
  left: 0; top: 0;
  width: 82.19%; aspect-ratio: 1578 / 999;
  background-image: url("../images/deco/form-dots-top.svg");
}
.pagebg__dots-bottom {
  right: 0; bottom: 5%;
  width: 42.40%; aspect-ratio: 814 / 662;
  background-image: url("../images/deco/form-dots-bottom.svg");
}

/* ==========================================================================
   1. REGISTER 안내 (apply.html)
   ========================================================================== */
/* 시안(10800:5201 / 1920x1478): 제목 y606 · 행 y785부터 115 간격
   라벨 x368(46 픽셀) · 값 x761(32) · 버튼 338x69 · 하단 바 1920x155 */
.register { text-align: center; padding-top: clamp(48px, 4.323vw, 83px); padding-bottom: clamp(60px, 6.927vw, 133px); }
.register__title {
  font-family: var(--ff-pixel);
  font-size: clamp(30px, 3.333vw, 64px);
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: #000;
}

.register__list {
  margin: clamp(40px, 4.323vw, 83px) auto 0;
  max-width: 1185px;
  display: grid;
  gap: clamp(22px, 2.865vw, 55px);
  text-align: left;
}
.register__row {
  display: grid;
  grid-template-columns: clamp(180px, 20.469vw, 393px) 1fr;
  gap: 0;
  align-items: center;
}
.register__row dt {
  font-family: var(--ff-pixel);
  font-size: clamp(22px, 2.396vw, 46px);
  line-height: 1.3;
  letter-spacing: 0.04em;
  color: #717071;
}
.register__row dd {
  margin: 0;
  font-size: clamp(16px, 1.667vw, 32px);
  font-weight: 600;
  line-height: 1.8;
  color: #717071;
}
.register__row dd small { font-size: 0.75em; color: inherit; }
.register__row dd .bar { color: var(--c-line-dark); margin-inline: 10px; }

.register__choice { display: flex; gap: clamp(8px, 0.833vw, 16px); flex-wrap: wrap; }
.register__choice .btn {
  min-width: clamp(150px, 17.604vw, 338px);
  min-height: clamp(42px, 3.594vw, 69px);
  font-size: clamp(16px, 1.667vw, 32px);
  font-weight: 600;
}

/* 모바일 시안 10800:20729 (430x656) — 라벨·값 모두 가운데, 버튼은 245x31 두 줄 */
@media (max-width: 767px) {
  .register { padding-top: 64px; padding-bottom: 64px; }
  .register__title { font-size: 24px; line-height: 1.5; }
  .register__list { max-width: none; margin-top: 45px; gap: 30px; text-align: center; }
  .register__row { grid-template-columns: 1fr; gap: 12px; justify-items: center; }
  .register__row dt { font-size: 16px; line-height: 1.3; }
  .register__row dd { font-size: 14px; line-height: 1.8; }
  .register__row dd small { font-size: 11px; }
  .register__row dd .bar { margin-inline: 6px; }
  .register__choice { flex-direction: column; gap: 3px; width: 245px; }
  .register__choice .btn { width: 100%; min-width: 0; min-height: 31px; font-size: 14px; }
}

/* 하단 CTA 바 — 배경 섹션(.pagebg) 바로 뒤, 푸터에 맞닿게 놓는다 */
.submit-bar {
  display: block;
  width: 100%;
  margin-bottom: 0;
  background: var(--c-primary);
  color: #fff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(84px, 8.073vw, 155px);   /* 시안 155 */
  padding-block: 0;
  font-family: var(--ff-pixel);
  font-size: clamp(26px, 3.333vw, 64px);   /* 시안 64 */
  letter-spacing: 0.1em;
  transition: background-color 0.2s var(--ease);
}
.submit-bar:hover { background: var(--c-primary-dark); }
.submit-bar[disabled],
.submit-bar.is-disabled { background: #b9b9b9; cursor: not-allowed; }

/* ==========================================================================
   2. 신청 폼 (apply-form.html)
   ========================================================================== */
.fm { padding-top: clamp(64px, 6.458vw, 124px); padding-bottom: 0; }   /* 시안: 제목 y170 */
.fm__head { text-align: center; }
.fm__mark { display: flex; justify-content: center; }
/* kv-title.svg 는 글자 블록(0~713) 오른쪽에 픽셀 흩뿌림 효과(713~809)가 붙어 있다.
   효과를 뺀 글자 블록이 아래 "참가신청" 과 같은 축에 오도록 꼬리 폭의 절반만큼 민다.
   (809-713)/2 / 809 = 5.93% */
.fm__mark img {
  width: clamp(150px, 15vw, 290px);
  height: auto;
  transform: translateX(5.93%);
}
.fm__title {
  margin-top: clamp(4px, 0.417vw, 8px);
  font-size: clamp(26px, 3.333vw, 64px);   /* 시안 64 */
  font-weight: 700;
  line-height: 1.5;
  color: #000;
}
.fm__meta {
  margin-top: clamp(8px, 0.677vw, 13px);
  font-family: var(--ff-base);           /* "Pretendard Variable" */
  font-size: clamp(14px, 1.25vw, 24px);  /* 시안 1920 기준 24px */
  font-weight: 600;
  line-height: 180%;
  color: #717071;
  text-align: center;
}
.fm__meta .bar { color: var(--c-line-dark); margin-inline: 8px; }

.fm__fields {
  max-width: 799px;
  margin: clamp(16px, 1.406vw, 27px) auto 0;
  display: grid;
  gap: clamp(8px, 0.781vw, 15px);   /* 시안: 칸 76 · 피치 91 */
}
.fm__fields .input,
.fm__fields .select {
  min-height: clamp(48px, 3.958vw, 76px);   /* 시안 76 */
  font-size: clamp(15px, 1.458vw, 28px);   /* 시안 28 */
  color: #525252;
  border: 3px solid rgba(28, 171, 226, 0.72);
  background: rgba(28, 171, 226, 0.06);
}
/* 참석 방법 선택 — 시안상 한 단계 진한 강조 */
.fm__fields .select {
  border: 3px solid #1cabe2;
  background: rgba(28, 171, 226, 0.33);
  color: var(--c-text);
}

/* 신청 경로 — 시안(10800:23667): 헤더 칸 799x76(y1126) + 패널 799x347(y1202)
   라디오 두 칸은 패널 왼쪽에서 113 / 482 지점, 행 간격 55 */
.route {
  max-width: 799px;
  margin: clamp(20px, 2.083vw, 40px) auto 0;
  border: 0;
  padding: 0;
}
.route__head {
  display: flex;
  align-items: center;
  min-height: clamp(48px, 3.958vw, 76px);
  padding-inline: clamp(10px, 1.198vw, 23px);
  border: 3px solid rgba(28, 171, 226, 0.72);
  background: rgba(28, 171, 226, 0.06);
  font-size: clamp(15px, 1.458vw, 28px);
  color: #000;
}
.route__panel {
  border: 3px solid rgba(28, 171, 226, 0.72);
  border-top: 0;
  min-height: clamp(210px, 18.073vw, 347px);
  padding: clamp(14px, 1.51vw, 29px) 0 clamp(10px, 0.885vw, 17px) 11.76%;   /* 시안: 왼쪽 칸 x674 */
}
.route__list {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(5, auto);
  grid-template-columns: 54.03% 45.97%;   /* 시안 369 / 314 */
  column-gap: 0;
  row-gap: clamp(8px, 1.198vw, 23px);
  align-content: start;
}
.route__list .check {
  display: flex;
  align-items: center;
  gap: clamp(4px, 0.313vw, 6px);
  font-size: clamp(13px, 0.938vw, 18px);   /* 시안 18 */
  line-height: 1.8;
  color: #000;
}
.route__list .check input {
  appearance: none;
  flex-shrink: 0;
  width: clamp(13px, 0.938vw, 18px);
  height: clamp(13px, 0.938vw, 18px);
  border: 2px solid var(--c-primary);
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
}
.route__list .check input:checked { background: radial-gradient(var(--c-primary) 0 42%, #fff 44%); }
.route__etc {
  margin-top: clamp(4px, 0.417vw, 8px);
  width: 100%;
  max-width: clamp(240px, 33.333vw, 640px);
  min-height: clamp(26px, 1.667vw, 32px);
  border: 1px solid rgba(28, 171, 226, 0.72);
  background: #fff;
  font-size: clamp(12px, 0.833vw, 16px);
}

.fm__note {
  max-width: 799px;
  margin: clamp(6px, 0.521vw, 10px) auto 0;
  text-align: center;
  font-size: clamp(13px, 1.042vw, 20px);   /* 시안 20 */
  line-height: 1.8;
  color: var(--c-primary);
}

/* 날짜/세션 선택 */
.fm__subtitle {
  margin-top: clamp(48px, 5.26vw, 101px);
  text-align: center;
  font-size: clamp(26px, 3.333vw, 64px);   /* 시안 64 */
  font-weight: 700;
  line-height: 1.5;
  color: #000;
}
.fm__subdesc {
  margin-top: clamp(14px, 1.458vw, 28px);
  text-align: center;
  font-size: clamp(13px, 1.042vw, 20px);   /* 시안 20 */
  color: #000;
  line-height: 1.8;
}
.fm__subdesc strong { display: block; color: var(--c-text); }

.daypick {
  max-width: 1310px;
  margin: clamp(24px, 2.448vw, 47px) auto 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(14px, 1.667vw, 32px);   /* 시안 카드 639 · 간격 32 */
}
.daypick__item { background: rgba(255, 255, 255, 0.9); border: 1px solid #d8ecf6; }

.daypick__label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: clamp(52px, 4.427vw, 85px);   /* 시안 85 */
  padding-inline: clamp(14px, 1.979vw, 38px);
  background: var(--c-primary);
  color: #fff;
  font-size: clamp(17px, 1.667vw, 32px);   /* 시안 32 */
  font-weight: 700;
  cursor: pointer;
}
/* 시안: 날짜 체크박스는 흰 바탕 · 흰 테두리 · 시안색 체크 */
.daypick__label input {
  appearance: none;
  flex-shrink: 0;
  width: clamp(18px, 1.51vw, 29px);
  height: clamp(18px, 1.51vw, 29px);
  border: 2px solid #fff;
  background: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.daypick__label input::after {
  content: "";
  width: 55%; height: 30%;
  border: solid var(--c-primary);
  border-width: 0 0 2px 2px;
  transform: translateY(-15%) rotate(-45deg);
  opacity: 0;
}
.daypick__label input:checked::after { opacity: 1; }
.daypick__date { font-size: 0.62em; font-weight: 400; opacity: 0.92; margin-left: 6px; }

.daypick__body { padding: clamp(14px, 1.5vw, 28px) clamp(14px, 1.5vw, 28px) clamp(18px, 1.9vw, 36px); }
/* 신청 폼의 날짜 카드 안에서만 세로로 쌓인다 (마이페이지는 좌우 2열) */
.daypick__item .daypick__track + .daypick__track {
  margin-top: clamp(16px, 1.7vw, 32px);
  padding-top: clamp(16px, 1.7vw, 32px);
  border-top: 1px solid var(--c-line);   /* 트랙 사이 가로줄 */
}
.daypick__track-name {
  font-size: clamp(13px, 1.042vw, 20px);   /* 시안 20 */
  font-weight: 700;
  color: var(--c-track-a);
}
.daypick__track--f .daypick__track-name,
.daypick__track--e .daypick__track-name { color: var(--c-track-b); }
.daypick__track-name small { color: inherit; font-weight: 400; margin-left: 6px; }   /* 시안: 트랙명과 같은 주황 */
.daypick__track-q {
  margin-top: 4px;
  padding-bottom: clamp(8px, 0.8vw, 14px);
  border-bottom: 1px solid var(--c-line);
  font-size: clamp(12px, 0.833vw, 16px);   /* 시안 16 */
  font-weight: 700;
  line-height: 1.8;
  color: #000;
}
.daypick__ses { margin-top: clamp(10px, 1vw, 18px); display: grid; gap: clamp(8px, 0.85vw, 16px); }
.daypick__ses dt { font-size: clamp(14px, 1.25vw, 24px); font-weight: 700; line-height: 1.5; color: #000; }   /* 시안 24 */
.daypick__ses dd {
  margin: 2px 0 0 12px;
  font-size: clamp(13px, 1.042vw, 20px);   /* 시안 20 */
  font-weight: 500;
  color: #000;
  line-height: 1.5;
}

/* 모달 안 날짜 선택 — 세로로 쌓고, 트랙은 카드 안에서 2열 */
.daypick--modal {
  grid-template-columns: 1fr;
  gap: clamp(8px, 0.573vw, 11px);
  margin-top: clamp(20px, 2.604vw, 50px);
  max-width: none;
}
.daypick--modal .daypick__item { border: 1px solid #e0e0e0; background: #fff; }
.daypick--modal .daypick__label {
  justify-content: flex-start;
  gap: clamp(12px, 1.25vw, 24px);
  background: #fff;
  color: #000;
  border-bottom: 1px solid #e0e0e0;
}
.daypick--modal .daypick__label input { border-color: var(--c-primary); background: #fff; }
.daypick--modal .daypick__label input::after { border-color: var(--c-primary); }
.daypick--modal .daypick__label input:checked { background: var(--c-primary); }
.daypick--modal .daypick__label input:checked::after { border-color: #fff; }
.daypick--modal .daypick__body { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 2.604vw, 50px); }
.daypick--modal .daypick__item .daypick__track + .daypick__track { margin-top: 0; padding-top: 0; border-top: 0; }
.daypick--modal .daypick__track-q { border-bottom: 0; padding-bottom: 0; }

@media (max-width: 767px) {
  .daypick { grid-template-columns: 1fr; }
  .daypick--modal .daypick__body { grid-template-columns: 1fr; }
}

/* 동의 영역
   시안: 질문은 왼쪽 정렬, 라디오 2개는 모든 행에서 같은 x 축에 정렬된다.
   .agree 에 공통 컬럼 트랙을 두고 행·옵션을 display:contents 로 펼쳐 축을 공유시킨다. */
.agree {
  /* 시안에서 블록 전체가 화면 폭의 약 50% 를 차지하며 가운데 정렬된다 */
  max-width: clamp(320px, 53.229vw, 1022px);
  margin: clamp(46px, 6.615vw, 127px) auto clamp(46px, 6.615vw, 127px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(96px, 8.021vw, 154px) clamp(96px, 8.646vw, 166px);
  column-gap: 0;
  row-gap: clamp(12px, 1.51vw, 29px);
  align-items: start;
  font-size: clamp(14px, 1.25vw, 24px);   /* 시안 24 */
  font-weight: 700;
  line-height: 1.5;
  color: #888888;
}
.agree__row { display: contents; }
.agree__q { grid-column: 1; }
.agree__q .req { color: var(--c-text-sub); }
.agree__link {
  margin-left: 10px;
  text-decoration: underline;
  text-underline-offset: 3px;
  color: var(--c-text);
}
.agree__link:hover { color: var(--c-primary); }
/* 라디오 2개가 각각 2·3번 컬럼 트랙에 놓이도록 펼친다 */
.agree__opts { display: contents; }
.agree__opts .check { white-space: nowrap; }
.agree__note { grid-column: 1 / -1; font-size: inherit; color: inherit; }

@media (max-width: 767px) {
  .agree { grid-template-columns: 1fr; row-gap: 8px; }
  .agree__opts { display: flex; gap: 20px; margin-bottom: 8px; }
}

/* 초청코드 */
.invite { max-width: 800px; margin: clamp(30px, 3.4vw, 64px) auto 0; text-align: center; }
.invite__title { font-size: clamp(18px, 1.7vw, 32px); font-weight: 700; }
.invite .input { margin-top: clamp(12px, 1.2vw, 22px); }

/* ==========================================================================
   3. 로그인 / 조회 결과 없음 (login.html · check.html · no-history.html)
   ========================================================================== */
.authkv {
  position: relative;
  overflow: hidden;
  padding-top: calc(var(--header-h) + clamp(44px, 6.51vw, 125px));   /* 시안: 타이틀 y234 */
  padding-bottom: clamp(48px, 5vw, 96px);
  /* 시안 1920x958 비율 유지 — 장식 레이어 비례를 맞추기 위한 최소 높이 */
  min-height: min(958px, 49.9vw);
  background: #ffffff;
}
/* 시안(10800:21735 / 1920x958): 콘텐츠 왼쪽 x127 · 타이틀 y234 · 문구 y370
   입력 563x76 (y481/572) · 로그인 167x165 (x722) · 링크 y741/814 */
.authkv__inner {
  position: relative;
  z-index: 1;
  max-width: 100%;
  margin-inline: 0;
  padding-inline: clamp(20px, 6.615vw, 127px);
}
/* 글자 블록 끝이 로그인 버튼 오른쪽 끝(시안 x889)과 맞도록 762 폭 */
.authkv__mark { max-width: clamp(280px, 39.688vw, 762px); }
.authkv__mark img { width: 113.45%; max-width: none; height: auto; }
.authkv__sub {
  margin-top: clamp(26px, 3.594vw, 69px);
  font-size: clamp(20px, 2.236vw, 42.94px);   /* 시안 42.94 */
  font-weight: 500;
  line-height: 1.2;
  color: var(--c-primary);
}
.authkv__sub .kv__block {
  display: inline-block;
  width: 0.26em;
  height: 0.88em;
  margin-left: 0.22em;
  background: var(--c-primary);
  vertical-align: -0.06em;
}

.authform {
  margin-top: clamp(26px, 3.125vw, 60px);
  display: flex;
  gap: clamp(12px, 1.563vw, 30px);
  align-items: stretch;
  flex-wrap: wrap;
}
.authform__fields { display: grid; gap: clamp(8px, 0.781vw, 15px); width: min(100%, 563px); }
.authform__fields .input {
  min-height: clamp(48px, 3.958vw, 76px);   /* 시안 76 */
  border-width: 3px;
  font-size: clamp(15px, 1.458vw, 28px);
  font-weight: 500;
  color: #525252;
  padding-inline: clamp(12px, 1.198vw, 23px);
  border: 3px solid rgba(28, 171, 226, 0.72);
  background: rgba(255, 255, 255, 0.9);
}
.authform__submit {
  min-width: clamp(110px, 8.698vw, 167px);   /* 시안 167x165 */
  font-weight: 400;
  background: var(--c-primary);
  color: #fff;
  font-family: var(--ff-pixel);
  font-size: clamp(17px, 1.667vw, 32px);   /* 시안 32 */
  letter-spacing: 0.06em;
  display: grid;
  place-items: center;
  transition: background-color 0.2s var(--ease);
}
.authform__submit:hover { background: var(--c-primary-dark); }

.authlinks { margin-top: clamp(40px, 4.844vw, 93px); display: grid; gap: clamp(10px, 1.198vw, 23px); justify-items: start; }
.authlinks a {
  font-family: var(--ff-pixel);
  font-size: clamp(15px, 1.25vw, 24px);   /* 시안 24 */
  font-weight: 400;
  line-height: 1.5;
  padding-bottom: clamp(4px, 0.417vw, 8px);
  border-bottom: 4px solid var(--c-primary);
  color: #000;
}
.authlinks a:hover { color: var(--c-primary); border-bottom-color: var(--c-primary); }

/* 조회 결과 없음 */
.authkv__msg { width: min(100%, 700px); margin-top: clamp(20px, 2.2vw, 42px); }
.authkv__msg .sys-win__body {
  display: grid;
  place-items: center;
  min-height: clamp(70px, 6vw, 110px);
}
.authkv__msg-text {
  font-size: clamp(14px, 1.15vw, 22px);
  font-weight: 500;
}
.authkv__btns { margin-top: clamp(16px, 1.7vw, 32px); display: flex; gap: clamp(8px, 0.85vw, 16px); flex-wrap: wrap; }
.authkv__btns .btn { min-width: clamp(140px, 10vw, 194px); min-height: clamp(44px, 3.2vw, 56px); }

@media (max-width: 767px) {
  .authform { flex-direction: column; }
  .authform__submit { min-height: 52px; }
  .authkv__btns .btn { flex: 1; }
}

/* ==========================================================================
   4. 신청 완료 (apply-complete.html)
   ========================================================================== */
/* 시안(10800:23883 / 1920x784): 제목 64 y107 · 부제 46 y223 · 창 1421 폭
   창 왼쪽 시안색 판 279x224 안에 2줄짜리 더아동페스타 마크(190x97) */
.done { text-align: center; padding-block: clamp(44px, 5.573vw, 107px) clamp(44px, 5vw, 96px); }
.done__title { font-size: clamp(24px, 3.333vw, 64px); font-weight: 700; line-height: 1.5; color: #000; }
.done__sub {
  margin-top: clamp(10px, 1.042vw, 20px);
  font-size: clamp(18px, 2.396vw, 46px);
  font-weight: 700;
  line-height: 1.5;
  color: #000;
}
.done__sub .hl { color: var(--c-primary); }

.infowin {
  width: min(100%, 1421px);
  margin: clamp(40px, 5.469vw, 105px) auto 0;
  text-align: left;
}
.infowin .sys-win__body { padding: 0; }
.infowin__grid {
  display: grid;
  grid-template-columns: clamp(130px, 14.531vw, 279px) 1fr;
  align-items: stretch;
}
.infowin__mark {
  display: grid;
  place-items: center;
  background: var(--c-primary);
  padding: clamp(18px, 1.9vw, 36px) clamp(12px, 1.2vw, 22px);
}
.infowin__mark img { width: clamp(110px, 9.896vw, 190px); height: auto; }
.infowin__list {
  display: grid;
  gap: 0;
  align-content: center;
  padding: clamp(20px, 2.865vw, 55px) clamp(18px, 1.9vw, 36px) clamp(20px, 2.865vw, 55px) clamp(16px, 1.979vw, 38px);
}
.infowin__row { display: grid; grid-template-columns: clamp(150px, 15.469vw, 297px) 1fr; gap: 0; align-items: baseline; }
.infowin__row dt {
  font-family: var(--ff-pixel);
  font-size: clamp(20px, 2.298vw, 44.12px);   /* 시안 44.12 */
  line-height: 1.3;
  letter-spacing: 0.04em;
  color: #717071;
}
.infowin__row dd { margin: 0; font-size: clamp(14px, 1.599vw, 30.69px); font-weight: 600; color: #717071; }
.infowin__row dd small { font-size: 0.72em; color: var(--c-text-sub); }
.infowin__row dd .bar { color: var(--c-line-dark); margin-inline: 8px; }

@media (max-width: 767px) {
  .infowin__grid { grid-template-columns: 1fr; }
  .infowin__row { grid-template-columns: 1fr; gap: 2px; }
}

/* ==========================================================================
   5. 신청 내역 (mypage.html)
   ========================================================================== */
.my { padding-block: clamp(40px, 4.4vw, 84px); }
/* 시안(10800:23922 / 1920x3315): 인사말 y107(64) · 소제목 y286/898(46)
   카드 1310x(450/537) x306 · 헤더 85 · 표 라벨 x767 / 값 x1049 (24)
   버튼 371x69 · QR 774x774 */
.my__hello {
  margin-top: clamp(12px, 1.198vw, 23px);
  text-align: center;
  font-size: clamp(26px, 3.333vw, 64px);
  font-weight: 700;
  line-height: 1.5;
}
.my__hello .hl { color: var(--c-primary); }

.my__title {
  margin-top: clamp(34px, 4.323vw, 83px);
  text-align: center;
  font-size: clamp(22px, 2.396vw, 46px);
  font-weight: 700;
  line-height: 1.5;
  color: #000;
}

.card {
  width: min(100%, 1310px);
  margin: clamp(20px, 2.135vw, 41px) auto 0;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #d9d9d9;
}
.card__head {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(52px, 4.427vw, 85px);
  padding-inline: clamp(14px, 2.031vw, 39px);
  background: var(--c-primary);
  color: #fff;
  font-size: clamp(17px, 1.667vw, 32px);
  font-weight: 700;
  text-align: center;
}
.card__head--left { justify-content: flex-start; text-align: left; }
.card__head small { font-size: 0.625em; font-weight: 500; opacity: 0.92; margin-left: 14px; }
.card__body { padding: clamp(14px, 1.406vw, 27px) clamp(16px, 1.7vw, 32px); }

.deflist { display: grid; gap: clamp(10px, 1.198vw, 23px); max-width: 400px; margin-inline: auto; }
.deflist > div { display: grid; grid-template-columns: clamp(110px, 14.688vw, 282px) 1fr; gap: 0; }
.deflist dt { font-weight: 700; font-size: clamp(14px, 1.25vw, 24px); line-height: 1.5; color: #000; }
.deflist dd { margin: 0; font-size: clamp(14px, 1.25vw, 24px); line-height: 1.5; color: #000; }

.my__tracks { display: grid; grid-template-columns: repeat(2, 1fr); align-items: start; }
.my__track { padding: clamp(16px, 1.7vw, 32px); }
.my__track + .my__track { border-left: 1px solid var(--c-line); }

@media (max-width: 767px) {
  .my__tracks { grid-template-columns: 1fr; }
  .my__track + .my__track { border-left: 0; border-top: 1px solid var(--c-line); }
  .deflist > div { grid-template-columns: 100px 1fr; }
}

/* QR */
.qr { text-align: center; margin-top: clamp(64px, 10.573vw, 203px); }   /* 시안: QR 상자 y1981 */
.qr__box {
  width: min(78vw, clamp(220px, 40.313vw, 774px));   /* 시안 774 */
  margin: clamp(20px, 2.2vw, 42px) auto 0;
  aspect-ratio: 1 / 1;
  background: #8c8c8c;
  color: #fff;
  display: grid;
  place-items: center;
  font-size: clamp(15px, 1.35vw, 26px);
  font-weight: 700;
}
.qr__notes {
  margin: clamp(24px, 2.708vw, 52px) auto 0;
  max-width: 900px;
  display: grid;
  gap: clamp(10px, 1.302vw, 25px);
  font-size: clamp(13px, 1.042vw, 20px);
  color: #000;
  line-height: 1.5;
}
.qr__notes li { position: relative; padding-left: 14px; }
.qr__notes li::before {
  content: "";
  position: absolute; left: 2px; top: 0.6em;
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--c-text-mute);
}

.my__actions { margin-top: clamp(30px, 3.281vw, 63px); display: grid; gap: 10px; justify-items: center; }
.my__actions .btn { min-width: clamp(200px, 19.323vw, 371px); min-height: clamp(42px, 3.594vw, 69px); font-size: clamp(14px, 1.25vw, 24px); }   /* 시안 371x69 */

/* ==========================================================================
   등록확인 / 로그인 / 조회내역 없음 — 키비주얼 장식
   Figma "상단 키비주얼"(10939:3 / PC 1920x958)
   ========================================================================== */
.authkv__mesh-br {                                /* 10939:5  (386,-135 / 1535x958) */
  right: 0; top: 0; bottom: 0;
  width: 79.95%;
  background-image: url("../images/deco/authkv-mesh-br.svg");
}
.authkv__dots-br {                                /* 10939:6  (862,147 / 1058x812) */
  right: 0; bottom: 0;
  width: 55.10%; aspect-ratio: 1058 / 812;
  background-image: url("../images/deco/authkv-dots-br.svg");
}
.authkv__wave {                                   /* 10939:4  (0,725 / 1920x237) */
  left: 0; right: 0; bottom: 0;
  height: 24.74%;
  min-height: 80px;
  background-image: linear-gradient(180deg, rgba(28, 171, 226, 0) 33.8%, rgba(28, 171, 226, 0.25) 100%);
}

/* 포인트 마크 — 헤더 아래 영역(958 - 109 = 849px) 기준 */
.authkv__deco .deco__mark { --deco-band: calc(100% - var(--header-h)); }

.authkv__plus-1 { left: 93.59%; top: calc(var(--header-h) + 0.0777 * var(--deco-band)); width: 1.98%; }               /* 10939:1176 (1797,175) */
.authkv__plus-2 { left: 66.56%; top: calc(var(--header-h) + 0.8610 * var(--deco-band)); width: 1.98%; opacity: 0.2; } /* 10939:1879 (733,840)  */
.authkv__plus-3 { left:  3.02%; top: calc(var(--header-h) + 0.9223 * var(--deco-band)); width: 1.98%; }               /* 10939:1885 (58,892)   */
.authkv__plus-4 { left: 66.56%; top: calc(var(--header-h) + 0.3746 * var(--deco-band)); width: 2.24%; opacity: 0.2; } /* 10939:1894 (1278,427) */

/* 픽셀 캐릭터 */
.authkv__char-heart  { left: 68.33%; top: calc(var(--header-h) + 0.1119 * var(--deco-band)); width: 4.53%; aspect-ratio: 87 / 78;
  background-image: url("../images/char-heart.svg"); }                    /* 10939:1183 (1312,204) */
.authkv__char-flower { left: 54.79%; top: calc(var(--header-h) + 0.6867 * var(--deco-band)); width: 3.96%; aspect-ratio: 1;
  background-image: url("../images/char-flower.svg"); }                   /* 10939:1233 (1052,692) */
.authkv__char-smile  { left: 85.89%; top: calc(var(--header-h) + 0.3663 * var(--deco-band)); width: 3.85%; aspect-ratio: 1;
  background-image: url("../images/char-smile.svg"); }                    /* 10939:1311 (1649,420) */

@media (max-width: 767px) {
  /* 모바일에서는 캐릭터만 남기고 포인트 마크는 숨김 */
  .authkv__deco .deco__mark--plus { display: none; }
}

/* 본문 포인트 마크 — Figma 참가신청 본문(10800:23667 / 1920x3102) 좌표의 % 환산 */
.pg-chev-r { left: 83.28%; top:  5.58%; width: 4.95%; opacity: 0.3; }  /* 10943:5472 */
.pg-chev-b { left:  7.29%; top: 74.76%; width: 4.95%; opacity: 0.3; }  /* 10943:5539 */
.pg-chev-l { left: 15.73%; top: 33.27%; width: 2.60%; opacity: 0.3; }  /* 10943:5485 */
.pg-plus-1 { left: 13.33%; top:  5.74%; width: 1.72%; }                /* 10943:5506 */
.pg-plus-2 { left: 92.97%; top: 13.93%; width: 1.72%; }                /* 10943:5501 */
.pg-plus-3 { left: 77.97%; top: 18.99%; width: 1.72%; opacity: 0.2; }  /* 10943:5512 */
.pg-plus-4 { left:  4.01%; top: 26.60%; width: 1.72%; opacity: 0.2; }  /* 10943:5495 */
.pg-plus-5 { left: 10.05%; top: 45.03%; width: 1.72%; }                /* 10943:5552 */
.pg-plus-6 { left: 88.23%; top: 66.70%; width: 1.72%; opacity: 0.2; }  /* 10943:5533 */
.pg-plus-7 { left: 93.39%; top: 86.62%; width: 1.72%; }                /* 10943:5528 */
.pg-plus-8 { left:  3.65%; top: 91.59%; width: 1.72%; opacity: 0.2; }  /* 10943:5557 */

@media (max-width: 767px) {
  .pagebg__deco .deco__mark--chev-l,
  .pagebg__deco .deco__mark--chev-u { display: none; }
}

/* ==========================================================================
   MOBILE — 신청 폼 / 날짜 선택 (시안 10800:26302 / 430x2731)
   · 입력칸 368x53 (피치 68) · 신청 경로는 1단 (행 39)
   · DAY 카드 371 (헤드 49) · 트랙 본문 x52 · 하단 바 85
   ========================================================================== */
@media (max-width: 767px) {
  .fm { padding-top: 40px; }
  .fm__meta { margin-top: 8px; font-size: 12px; line-height: 1.5; }

  .fm__fields { margin-top: 20px; gap: 15px; }
  .fm__fields .input,
  .fm__fields .select {
    min-height: 53px;
    padding: 0 20px;
    border-width: 2px;
    font-size: clamp(13px, 3.72vw, 16px);
  }

  .route { margin-top: 15px; }
  .route__head {
    min-height: 53px;
    padding-inline: 20px;
    border-width: 2px;
    font-size: clamp(13px, 3.72vw, 16px);
  }
  .route__panel {
    border-width: 2px;
    min-height: 0;
    padding: 16px 12px 18px 20px;
  }
  /* 시안: 모바일은 한 줄에 하나씩. PC 는 세로로 채우는 2단이라 DOM 순서가
     1~5=왼쪽 / 6~9=오른쪽 이다. 한 줄로 펴면서 시안의 읽는 순서로 되돌린다. */
  .route__list {
    grid-auto-flow: row;
    grid-template-rows: none;
    grid-template-columns: 1fr;
    row-gap: 18px;
  }
  .route__list > li:nth-child(1) { order: 1; }
  .route__list > li:nth-child(2) { order: 3; }
  .route__list > li:nth-child(3) { order: 5; }
  .route__list > li:nth-child(4) { order: 7; }
  .route__list > li:nth-child(5) { order: 9; }
  .route__list > li:nth-child(6) { order: 2; }
  .route__list > li:nth-child(7) { order: 4; }
  .route__list > li:nth-child(8) { order: 6; }
  .route__list > li:nth-child(9) { order: 8; }
  .route__list .check { align-items: flex-start; gap: 10px; font-size: 12px; line-height: 1.5; }
  .route__list .check input { width: 14px; height: 14px; margin-top: 2px; }
  .route__etc { max-width: none; min-height: 28px; }

  .fm__note { margin-top: 12px; font-size: 11px; line-height: 1.4; }

  .fm__subtitle { margin-top: 42px; font-size: 24px; line-height: 1.5; }
  .fm__subdesc { margin-top: 15px; font-size: 11px; line-height: 1.4; }

  /* DAY 카드 — 시안 371 폭, 컨테이너보다 좌우 2 넓다 */
  .daypick {
    margin: 30px calc(30px - var(--gutter)) 0;
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .daypick__label { min-height: 49px; padding-inline: 22px; font-size: 18.6px; }
  .daypick__label input { width: 28px; height: 28px; }
  .daypick__body { padding: 16px 22px 21px; }
  .daypick__item .daypick__track + .daypick__track { margin-top: 15px; padding-top: 15px; }
  .daypick__track-name { font-size: 14px; line-height: 1.5; }
  .daypick__track-name small { font-size: 9.3px; }
  .daypick__track-q { font-size: 9.3px; line-height: 1.8; padding-bottom: 0; }
  .daypick__ses { margin-top: 17px; gap: 6px; }
  .daypick__ses dt { font-size: 14px; line-height: 1.5; }
  .daypick__ses dd { font-size: 11.6px; line-height: 1.5; }

  .agree { margin-top: 40px; font-size: 11px; line-height: 1.6; }
  .invite { margin-top: 36px; }
  .invite__title { font-size: 16px; }

  /* 하단 신청 바 — 시안 430x85 */
  .submit-bar { min-height: 85px; font-size: 24px; }
}

/* ==========================================================================
   MOBILE — 로그인 / 등록확인 / 조회결과 없음
   시안 11024:31276 (430x860) · 11024:33479 (430x540)
   메인 히어로(11022:362)와 같은 좌표계: 아이브로우 108 · 로고 138 (2줄 210x107)
   · 문구 254 · 창 285 (170x31) · 로그인 카드 345 (387x284)
   ========================================================================== */
.authkv__eyebrow { display: none; }
.authform__title,
.authform__save { display: none; }

@media (max-width: 767px) {
  .authkv {
    padding-top: calc(var(--header-h) + 23px);
    padding-bottom: 64px;
    min-height: 0;
  }
  .authkv__inner { padding-inline: var(--gutter); }

  .authkv__eyebrow { display: block; line-height: 0; }
  .authkv__eyebrow img { width: clamp(104px, 30.7vw, 132px); height: auto; }

  .authkv__mark { max-width: none; margin-top: 16px; line-height: 0; }
  .authkv__mark img { width: clamp(168px, 48.84vw, 210px); }

  .authkv__sub { margin-top: 9px; font-size: clamp(8px, 2.247vw, 9.7px); line-height: 1.22; }

  /* 로그인 폼 = 히어로의 흰 카드 */
  .authform {
    display: block;
    /* 시안: 문구(254~266) 아래 79 */
    margin: 79px calc(22px - var(--gutter)) 0;
    padding: 37px 31px 26px;
    background: #fff;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
  }
  .authform__title {
    display: block;
    margin: 0 0 10px 6px;
    font-size: 16px;
    line-height: 1;
    color: var(--c-primary);
  }
  .authform__fields {
    width: auto;
    padding: 26px 9px 0;
    gap: 18px;
    border-top: 1px solid var(--c-primary);
  }
  .authform__fields .input {
    min-height: 36px;
    padding: 0 11px;
    border: 1.5px solid var(--c-primary);
    font-size: 16px;
  }
  .authform__save {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 16px 0 0 9px;
    font-size: 11px;
    font-weight: 300;
    line-height: 1;
    color: var(--c-primary);
    cursor: pointer;
  }
  .authform__save input {
    appearance: none;
    width: 11px;
    height: 11px;
    margin: 0;
    border: 1px solid var(--c-primary);
    background: #fff;
    cursor: pointer;
  }
  .authform__save input:checked { background: var(--c-primary); box-shadow: inset 0 0 0 2px #fff; }
  .authform__submit {
    width: 165px;
    min-width: 0;
    height: 28px;
    min-height: 28px;
    margin: 24px auto 0;
    font-family: var(--ff-base);
    font-size: 15px;
    font-weight: 700;
  }

  /* 바로가기 링크 — 시안 689 / 750, 가운데 정렬 */
  .authlinks { margin-top: 60px; gap: 15px; justify-items: center; }
  .authlinks a { font-size: 16px; line-height: 1.5; padding-bottom: 6px; border-bottom-width: 2px; }

  /* 장식 — 시안 11024:31276 은 메인 히어로(11022:362)와 같은 배치 */
  .authkv__mesh-tl { left: -34.42%; top: var(--header-h); width: 180.93%; aspect-ratio: 778 / 385;
    background-image: url("../images/deco/kv-mesh-tl.svg"); }
  .authkv__dots-tl { left: -8%; top: var(--header-h); width: 120%; aspect-ratio: 796 / 615;
    background-image: url("../images/deco/kv-dots-tl.svg"); }
  .authkv__mesh-br { left: 3.02%; right: auto; top: 264px; bottom: auto; width: 111.63%; aspect-ratio: 480 / 396; }
  .authkv__dots-br { left: 32.33%; right: auto; top: 387px; bottom: auto; width: 82.33%; aspect-ratio: 354 / 274; }
  .authkv__wave { top: 549px; bottom: auto; height: 111px; min-height: 0; }

  /* 포인트 — 시안 좌표 그대로 (프레임 430 기준) */
  .authkv__chev-r      { left: 82.79%; top: 118px; width: 11.16%; }
  .authkv__chev-l      { left: 52.09%; top: 271px; width: 11.16%; }
  .authkv__char-heart  { left: 63.49%; top: 122px; width: 6.74%; aspect-ratio: 29 / 26; }
  .authkv__char-flower { left: 80.93%; top: 207px; width: 6.28%; aspect-ratio: 1; }
  .authkv__char-smile  { left: 60.00%; top: 297px; width: 6.28%; aspect-ratio: 1; }
  .authkv__plus-1      { left: 69.07%; top: 238px; width: 3.95%; opacity: 1; }
  .authkv__plus-2      { left: 91.16%; top: 281px; width: 3.95%; opacity: 1; }
  .authkv__plus-3      { left:  6.74%; top: 337px; width: 3.95%; opacity: 1; }
  .authkv__plus-4      { display: none; }

  /* 조회 결과 없음 — 시안 창 365x96, 버튼 165x28 두 줄 */
  .authkv__msg { width: 100%; margin-top: 35px; }
  .authkv__msg .sys-win__bar { height: 14px; font-size: 6px; }
  .authkv__msg .sys-win__body { min-height: 82px; }
  .authkv__msg-text { font-size: clamp(12px, 3.72vw, 16px); }
  .authkv__btns { margin-top: 22px; flex-direction: column; align-items: center; gap: 8px; }
  .authkv__btns .btn { width: 165px; min-width: 0; min-height: 28px; font-size: 14px; }
}

/* --------------------------------------------------------------------------
   MOBILE — 신청완료 (시안 10800:18856 / 430x567)
   제목 24 · 부제 16 2줄 · 창 370x293 (시안색 띠 106, 로고타입은 1줄 311)
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .done { padding-block: 64px; }
  .done__title { font-size: 24px; line-height: 1.5; }
  .done__sub { margin-top: 19px; font-size: 16px; line-height: 1.5; }

  .infowin { width: auto; margin: 43px calc(30px - var(--gutter)) 0; }
  .infowin .sys-win__bar { height: 14px; font-size: 6px; }
  .infowin__grid { display: block; }
  .infowin__mark { padding-block: 35px 31px; }
  .infowin__mark img { width: clamp(240px, 72.33vw, 311px); }
  .infowin__list { padding: 19px 20px 20px 60px; display: grid; gap: 21px; }
  .infowin__row { grid-template-columns: 1fr; gap: 5px; }
  .infowin__row dt { font-size: 16px; line-height: 1.3; }
  .infowin__row dd { font-size: 14px; line-height: 1.8; }
  .infowin__row dd small { font-size: 11px; }
  .infowin__row dd .bar { margin-inline: 6px; }
}

/* --------------------------------------------------------------------------
   MOBILE — 마이페이지 (시안 11024:35628 / 430x2330)
   인사 24 · 소제목 14 · 카드 370(371) · 카드 헤드 49 · 버튼 309
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .my { padding-block: 64px; }
  .my__hello { font-size: 24px; line-height: 1.5; }
  .my__title { margin-top: 32px; font-size: 14px; line-height: 1.5; }
  .qr .my__title { font-size: 24px; line-height: 1.5; }

  .card { margin: 12px calc(30px - var(--gutter)) 0; }
  .card__head { min-height: 49px; font-size: 24px; }
  .card__head small { font-size: 0.58em; margin-left: 10px; }
  .card__body { padding: 21px 56px; }

  .deflist { max-width: none; gap: 0; }
  .deflist > div { grid-template-columns: 148px 1fr; min-height: 40px; align-items: center; }
  .deflist dt,
  .deflist dd { font-size: 14px; line-height: 1.5; }

  /* 시안: 트랙이 세로로 쌓이고 사이에 가로줄 */
  .my__tracks { grid-template-columns: 1fr; }
  .my__track { padding: 16px 22px 21px; }
  .my__track + .my__track { border-left: 0; border-top: 1px solid var(--c-line); }

  /* 시안: 참석 날짜 변경하기 309x50 */
  .my .btn-row > .btn { width: 309px; min-width: 0; min-height: 50px; font-size: 20px; }
  .my__actions { margin-top: 30px; gap: 12px; }
  .my__actions .btn { min-width: 0; width: 309px; min-height: 49px; font-size: 20px; }

  .qr { margin-top: 64px; }
  .qr__box { width: 309px; margin-inline: auto; aspect-ratio: 1; }
  /* 시안: 251 폭 블록을 가운데 두고 글머리 점은 글자 옆에 붙인다 */
  .qr__notes { margin: 22px auto 0; max-width: 262px; text-align: left; font-size: 11px; line-height: 1.6; gap: 8px; }
}

/* --------------------------------------------------------------------------
   MOBILE 보정 — 신청 폼 하단
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  /* 시안: 배경 픽셀이 신청하기 바 바로 위까지 내려온다 */
  .pagebg__dots-bottom { bottom: 0; }

  /* 약관 동의 — 질문·선택지 모두 가운데 정렬 */
  .agree {
    display: block;
    max-width: none;
    margin-block: 40px 40px;
    text-align: center;
  }
  .agree__row { display: block; }
  .agree__row + .agree__row { margin-top: 18px; }
  .agree__q { display: block; }
  .agree__link { display: inline-block; margin-left: 8px; }
  .agree__opts {
    display: flex;
    justify-content: center;
    gap: 22px;
    margin-top: 8px;
  }
  .agree__note { display: block; margin-top: 18px; }
}

/* ==========================================================================
   기능 연동용 상태 스타일
   퍼블리싱 시안에는 없지만 실제 동작(검증 실패·전송 중·비활성)에 필요한 것만
   최소한으로 추가한다. 시안에 있는 요소의 크기·색은 건드리지 않는다.
   ========================================================================== */
.fm__error,
.authform__error {
  margin: 0 0 16px;
  padding: 12px 16px;
  border: 1px solid #e05252;
  background: #fdeaea;
  color: #c0392b;
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
}

.authform__error { margin: 12px 0 0; }

.submit-bar:disabled,
.authform__submit:disabled,
.kvlogin__submit:disabled,
.btn:disabled {
  opacity: 0.55;
  cursor: progress;
}

/* 신청 경로 "기타" 를 고르기 전에는 직접 입력칸을 잠근다 */
.route__etc:disabled {
  background: var(--c-bg-gray);
  color: var(--c-text-mute);
  cursor: not-allowed;
}

/* 마이페이지 QR — 시안의 회색 자리표시 박스에 실제 QR 을 채울 때 */
.qr__box--live {
  background: var(--c-white);
  border: 1px solid var(--c-line);
  padding: clamp(12px, 1.2vw, 28px);
}
.qr__box--live svg { display: block; width: 100%; height: 100%; }

/* 안내 메시지 모달 (승인 대기 등) — 한 문장짜리라 note 패널보다 좁게 */
.modal__panel--msg { max-width: 640px; }
.modal__panel--msg .modal__note { font-size: clamp(15px, 1.15vw, 22px); }
