@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 {
  /* 폭·오른쪽 넘침은 시안(10943:3306 / 858x662, 오른쪽으로 44)을 따르고,
     세로는 시안의 "아래에서 155" 대신 바닥까지 내린다(요청).
     % 로 주면 콘텐츠 길이에 따라 위로 밀리므로 bottom:0 으로 고정한다. */
  right: -2.292%;
  bottom: 0;
  width: 44.688%; aspect-ratio: 858 / 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);   /* 시안: 제목 y170 */
  padding-bottom: 0;
  /* 폼 안쪽 글자가 시작하는 자리 — 입력칸·신청 경로 머리글·별표가 모두 이 선에 맞는다.
     시안 실측 1920: 23 / 430: 20 */
  --fm-pad: clamp(20px, 1.198vw, 23px);
  --fm-bd: 3px;   /* 입력칸 테두리 — 모바일은 2 */
}
.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 */
  padding-inline: var(--fm-pad);
  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)의 꺽쇠는 아래를 향한 채워진 삼각형이다.
     실측 — 1920: 26x17, 테두리 안쪽에서 오른쪽으로 30 / 430: 20x12, 18.
     기본 select 화살표를 끄고 배경으로 직접 그린다. */
  --arrow-w: clamp(20px, 1.354vw, 26px);
  --arrow-h: clamp(12px, 0.885vw, 17px);
  --arrow-r: clamp(18px, 1.563vw, 30px);
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 17'%3E%3Cpath d='M0 0h26L13 17z' fill='%231cabe2'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--arrow-r) center;
  background-size: var(--arrow-w) var(--arrow-h);
  /* 긴 항목이 삼각형 아래로 파고들지 않도록 자리만큼 비운다 */
  padding-right: calc(var(--arrow-r) + var(--arrow-w) + 10px);
}
/* 화살표를 끄면 IE/구형 엣지가 남기는 자체 버튼도 지운다 */
.fm__fields .select::-ms-expand { display: none; }

/* 신청 경로 — 시안(10800:23667): 헤더 칸 799x76(y1126) + 패널 799x347(y1202)
   라디오 두 칸은 패널 왼쪽에서 113 / 482 지점, 행 간격 55 */
.route {
  max-width: 799px;
  /* 위 간격은 다른 입력칸 사이와 같은 15 (기존 40 이었다) */
  margin: clamp(10px, 0.781vw, 15px) auto 0;
  border: 0;
  padding: 0;
  /* 라디오 동그라미 폭과 글자까지의 간격 — 기타 입력칸을 글자 선에 맞출 때 쓴다 */
  --radio-w: clamp(14px, 1.042vw, 20px);
  --radio-gap: clamp(4px, 0.313vw, 6px);
}
.route__head {
  display: flex;
  align-items: center;
  min-height: clamp(48px, 3.958vw, 76px);
  padding-inline: var(--fm-pad);
  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;
  /* 좌우 동일: 왼쪽 여백(패딩+라디오 3.05)과 오른쪽 열 끝글자~박스 끝이 같아지는 값.
     min-height 를 두면 내용보다 상자가 커져 아래만 벌어지므로 뺀다. */
  padding: clamp(14px, 1.51vw, 29px) 10.68%;
}
.route__list {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(5, auto);
  /* 시안 1열 369 를 고정하면 오른쪽 열이 3px 모자라 "소속 기관 / 학교 / 학회 공문 안내" 가 접힌다.
     오른쪽을 내용 폭(max-content)으로 두고 왼쪽이 나머지를 갖게 하면 한 줄로 떨어지고,
     오른쪽 끝이 패딩 경계에 맞아 좌우 여백 대칭도 유지된다. */
  grid-template-columns: minmax(0, 1fr) max-content;
  column-gap: 0;
  row-gap: clamp(8px, 1.198vw, 23px);   /* 시안: 행 pitch 55 - 항목 높이 32 = 간격 23 */
  align-content: start;
}
/* 예 / 아니오 두 개짜리 — 아래 패널 없이 제목 바로 뒤에 붙는다 */
.route__head--yn { justify-content: flex-start; gap: 0; }
.route__head--yn > .route__list--yn { margin-left: clamp(12px, 1.8vw, 35px); }
.route__head--yn > span { white-space: nowrap; }
.route__list--yn {
  grid-auto-flow: row;
  grid-template-rows: auto;
  grid-template-columns: max-content max-content;
  column-gap: clamp(20px, 2.6vw, 50px);
}
.route__list .check {
  display: flex;
  align-items: center;
  gap: var(--radio-gap);
  font-size: clamp(13px, 0.938vw, 18px);   /* 시안 18 */
  line-height: 1.8;
  color: #000;
}
.route__list .check input {
  appearance: none;
  flex-shrink: 0;
  width: var(--radio-w);    /* 시안 20 */
  height: var(--radio-w);
  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);
  padding: 0 clamp(8px, 0.833vw, 16px);
  margin-left: calc(var(--radio-w) + var(--radio-gap));
  width: calc(100% - (var(--radio-w) + var(--radio-gap)));
  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);
}

/* 날짜 선택 위의 프로그램 링크 — 시안 10800:23667 */
.fm__golink {
  margin: clamp(10px, 1.042vw, 20px) auto 0;
  text-align: center;
  font-size: clamp(14px, 1.146vw, 22px);
  font-weight: 700;
}
.fm__golink a {
  color: var(--c-primary);
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

/* 필수 항목 — 시안은 입력칸 왼쪽에 빨간 별표를 둔다.
   클래스 이름을 .field 로 두면 common.css 의 옛 폼 규칙(.field{margin-bottom:22px})이
   같이 걸려 필수 칸 아래만 벌어진다. 그래서 이 폼 전용 이름을 쓴다. */
.fm__req { position: relative; display: block; }
.fm__req > .input { width: 100%; }
.fm__req::before {
  content: "*";
  position: absolute;
  /* 별표의 왼쪽 끝을 입력칸 안쪽 여백에 맞춘다 — 별표가 없는 칸의 글자와 같은 선 */
  left: calc(var(--fm-pad) + var(--fm-bd));
  top: 50%;
  transform: translateY(-50%);
  color: #e8404a;
  font-size: clamp(15px, 1.458vw, 28px);
  line-height: 1;
  pointer-events: none;
}
/* 시안 실측 — 1920: 별표 23 / 글자 50, 430: 별표 20 / 글자 31 */
.fm__fields .fm__req > .input { padding-left: clamp(31px, 2.6vw, 50px); }
.route__head--req::before {
  content: "*";
  color: #e8404a;
  margin-right: 0.25em;
}

/* 날짜/세션 선택 */
.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);
  column-gap: clamp(14px, 1.667vw, 32px);   /* 시안 카드 639 · 간격 32 */
  row-gap: 28px;                            /* 한 줄로 쌓일 때 DAY1 / DAY2 사이 */
}
.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;
}
/* 날짜 체크박스: 안 눌렀을 땐 흰 네모, 누르면 시안색 바탕에 흰 체크 (모서리는 각지게 — radius 0) */
.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;
  border-radius: 0;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.daypick__label input:checked { background: var(--c-primary); }
.daypick__label input::after {
  content: "";
  width: 55%; height: 30%;
  border: solid #fff;
  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; }
/* 시안 라디오는 얇은 시안색 원 테두리 + 안쪽 원 채움(route__list 라디오와 동일 스타일).
   common.css 의 기본 .check input 은 네이티브(accent-color) 라디오라 시안과 다르게 그려진다. */
/* 시안(10800:23718~23721 + Ellipse 924/926): 바깥 33 · 테두리 3 · 안쪽 원 21.
   신청경로 라디오(20/2/12.38)와 크기가 다르므로 따로 준다.
   안쪽 원 지름 21 = 반지름 10.5, 33x33 상자의 farthest-corner 반지름 23.33 -> 45%. */
.agree__opts .check input {
  appearance: none;
  flex-shrink: 0;
  width: clamp(22px, 1.719vw, 33px);
  height: clamp(22px, 1.719vw, 33px);
  border: clamp(2px, 0.157vw, 3px) solid var(--c-primary);
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
}
/* 안쪽 원: 45% 는 시안과 같은 21. 요청대로 조금 키워 50%(=23.3) 로 둔다. */
.agree__opts .check input:checked { background: radial-gradient(var(--c-primary) 0 50%, #fff 51%); }
/* 라벨이 위로 붙지 않도록 — .check 기본값이 flex-start 라 글자가 5.5 위에 있었다 */
.agree__opts .check { align-items: center; }
/* 라벨을 span 으로 감싸 인라인 요소가 되면 align-items:center 가 잉크까지 맞춰 준다
   (감싸기 전에는 익명 인라인 박스라 2.25 위로 떠 있었다) — 별도 보정 불필요 */
.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);
}
/* 시안(10800:23883): 라벨 칸 567→864 = 297. 값이 라벨 칸 끝에서 바로 시작하므로 gap 은 0 이다.
   라벨과 값 사이의 35 여백은 gap 이 아니라 라벨 글자가 262 로 끝나서 생기는 것이다. */
/* 라벨(픽셀 44.12)과 값(30.69)은 서체가 달라 baseline 을 맞추면 잉크 중심이 3 어긋난다.
   시안(10929:30935/30936)은 두 상자가 같은 y 에서 시작하므로 가운데로 맞춘다. */
.infowin__row { display: grid; grid-template-columns: clamp(150px, 15.469vw, 297px) 1fr; gap: 0; align-items: center; }
.infowin__row dt {
  font-family: var(--ff-pixel);
  font-size: clamp(20px, 2.298vw, 44.12px);   /* 시안 44.12 */
  line-height: 1.3;
  /* 자간 0.04em(=1.7648px) x 13자 = 22.9 만큼 글자가 길어져 값과의 간격이 12 로 좁아졌다.
     시안 글자 폭이 262 이고 자간을 빼면 정확히 262 가 된다. */
  letter-spacing: 0;
  color: #717071;
}
/* 라벨(픽셀)과 값(Pretendard)은 서체 메트릭이 달라 상자를 가운데로 맞춰도
   글자 잉크가 5 정도 내려앉는다(실측). 그만큼 올려 눈으로 가운데가 되게 한다. */
.infowin__row dd { margin: 0; position: relative; top: -0.1em; 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); }

/* 라벨 칸은 가장 긴 "2025 더아동페스타 참석 여부"(1920 에서 284.3)가 한 줄에 들어가야 한다.
   두 칸 사이를 벌린 만큼(10 → 40) 전체 폭도 같이 키워야 값 칸이 안 줄어든다. */
.deflist { display: grid; gap: clamp(10px, 1.198vw, 23px); max-width: 490px; margin-inline: auto; }
/* 글꼴은 14px 에서 멈추는데 칸만 vw 로 계속 줄면 좁은 화면에서 라벨이 접힌다.
   14px 기준 가장 긴 라벨이 165.8 이라 바닥을 168 로 둔다(모바일과 같은 값). */
.deflist > div { display: grid; grid-template-columns: clamp(168px, 15.417vw, 296px) 1fr; column-gap: clamp(16px, 2.083vw, 40px); }
.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; }

/* align-items:start 면 짧은 쪽 칸이 내용 높이에서 끝나 가운데 구분선도 거기서 끊긴다.
   stretch(기본값)로 두면 두 칸이 같은 높이가 되어 선이 위아래 끝까지 이어진다. */
/* 참석 날짜는 DAY 별로 테두리를 나눈다 — 하나로 감싸면 사이를 띄워도
   좌우 테두리가 이어져 두 날이 붙어 보인다. 바깥 .card 는 자리만 잡는다. */
.card--days { background: none; border: 0; }
.card--days > .my__day,
.card--days > .card__body {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #d9d9d9;
}
/* DAY 를 둘 다 신청했을 때만 두 블록 사이를 띄운다 */
.my__day + .my__day { margin-top: 28px; }

.my__tracks { display: grid; grid-template-columns: repeat(2, 1fr); }
.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-bd: 2px; }
  .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 var(--fm-pad);
    border-width: 2px;
    font-size: clamp(13px, 3.72vw, 16px);
  }
  /* 시안(10800:26302) 실측: 삼각형 20x12, 테두리 안쪽에서 오른쪽으로 18 */
  .fm__fields .select {
    --arrow-w: 20px;
    --arrow-h: 12px;
    --arrow-r: 18px;
    padding-right: calc(18px + 20px + 8px);
  }

  .route { margin-top: 15px; --radio-w: 14px; --radio-gap: 10px; }
  .route__head {
    min-height: 53px;
    padding-inline: var(--fm-pad);
    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--yn { grid-template-columns: max-content max-content; column-gap: clamp(14px, 4vw, 24px); }
  .route__list--yn > li:nth-child(1),
  .route__list--yn > li:nth-child(2) { order: 0; }
  .route__list .check { align-items: flex-start; font-size: 12px; line-height: 1.5; }
  .route__list .check input { margin-top: 2px; }
  .route__etc { max-width: none; min-height: 29px; height: 29px; }

  .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: 28px;
  }
  .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; }
  /* 트랙 타이틀(제목+질문) 과 아래 구분선 사이 마진 — padding-bottom:0 이라 선이 텍스트에 붙어 있었다 */
  /* 시안(11024:28432): 블록 상단 기준 글자 h11 · 구분선 42.44 · 잉크→선 8.12.
     줄높이 1.8 이면 상자가 16.7 이라 선이 8px 아래로 내려간다. */
  .daypick__track-q { font-size: 9.3px; line-height: 1.2; padding-bottom: 6px; }
  .daypick__ses { margin-top: 17px; gap: 6px; }
  /* 마이페이지 카드에서는 구분선이 제목 쪽에 붙어 보여(위 7.2 / 아래 19.0)
     위아래 합(23)은 유지한 채 가운데로 옮긴다 → 위 13.2 / 아래 13.0 */
  .my__track .daypick__track-q { padding-bottom: 12px; }
  .my__track .daypick__ses { margin-top: 11px; }
  .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); }
  /* 시안(11024:31276): 서브 문구 잉크 y263 -> 창 상단 y285 = 21 · 창 170x32.
     메인 히어로(.kv__terminal)와 같은 컴포넌트지만 main.css 는 이 페이지에 없다. */
  .authkv__terminal { margin-top: 21px; width: clamp(136px, 39.53vw, 170px); }
  .authkv__terminal .sys-win__bar {
    height: 6px;
    gap: 4px;
    padding-inline: 3px;
    font-size: 4px;
    letter-spacing: 0.04em;
  }
  .authkv__terminal .sys-win__body { min-height: 24px; padding-inline: 6px; }
  .authkv__terminal .sys-win__text { font-size: clamp(8px, 2.33vw, 10px); letter-spacing: 0.04em; }

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

  /* 로그인 폼 = 히어로의 흰 카드 */
  .authform {
    display: block;
    /* 시안(11024:31276) 카드 상단 y346. 79 는 서브 문구(254~266) 아래로 잰 값이었는데
       그 사이 터미널 창이 흐름에 들어가 있어 카드가 51px 내려가 배경(660) 밖으로 나갔다.
       터미널 창(286.5~318.5) 아래 28 로 잡아야 시안 좌표에 앉는다. */
    margin: 28px calc(22px - var(--gutter)) 0;
    padding: 37px 31px 26px;
    /* 시안(11024:32937) 카드 채우기는 흰색 77% — 뒤 픽셀 패턴이 살짝 비친다 */
    background: rgba(255, 255, 255, 0.77);
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
  }
  .authform__title {
    display: block;
    margin: 0 0 10px 6px;
    font-family: var(--ff-pixel);   /* 시안: NeoDunggeunmo Pro 16 / 400 */
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    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"); }
  /* 시안(11024:31276)은 왼쪽 그라디언트도 오른쪽 점 패턴도 웨이브도 y659 에서 같이 끝난다.
     위에서 px 로 고정하면 장식 높이만 폭에 딸려 줄어 시안 폭(430)이 아닌 화면에서
     셋이 제각각 떨어지므로(360 에서 596/615/660), 위가 아니라 "경계에서 위로" 붙인다.
     경계값 --kv-band 는 common.js 가 [data-kv-band] 를 재서 넣는다. */
  .authkv__mesh-br,
  .authkv__dots-br,
  .authkv__wave { top: auto; bottom: calc(100% - var(--kv-band, 660px)); }

  .authkv__mesh-br { left: 3.02%; right: auto; width: 111.63%; aspect-ratio: 480 / 396; }
  .authkv__dots-br { left: 32.33%; right: auto; width: 82.33%; aspect-ratio: 354 / 274; }
  .authkv__wave { 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; }
  /* 좌우 56 이면 신청정보 목록이 264 밖에 안 돼 "2025 더아동페스타 참석 여부"(165.8)가 접힌다 */
  .card__body { padding: 21px 40px; }
  /* 신청정보는 라벨 칸이 168 로 고정이라, 두 칸 사이를 벌리려면 패딩에서 가져오는 수밖에 없다.
     값은 짧아서 오른쪽이 좁아도 괜찮으므로 좌우를 다르게 준다. */
  .card__body:has(.deflist) { padding-left: 24px; padding-right: 10px; }

  .deflist { max-width: none; gap: 0; }
  /* 라벨 칸은 가장 긴 "2025 더아동페스타 참석 여부"(165.8)가 한 줄에 들어가는 168.
     그 라벨은 칸을 꽉 채우므로 값이 바로 붙지 않도록 34 를 띄운다. */
  .deflist > div { grid-template-columns: 168px 1fr; column-gap: 34px; 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; }

/* PC 의 .authform 은 [입력칸 | 로그인버튼] 가로 배치라, 오류 문구를 그대로 두면
   둘 사이에 끼어 들어가 버린다. 한 줄을 통째로 차지하며 아래로 내려가게 한다. */
@media (min-width: 768px) {
  .authform__error { flex-basis: 100%; order: 1; margin-top: 16px; }
}

.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); }

/* REGISTER 아래 안내 — 시안 10800:5201 */
.register__note {
  max-width: 1200px;
  margin: clamp(18px, 2.083vw, 40px) auto 0;
  text-align: center;
  font-size: clamp(14px, 1.25vw, 24px);   /* 시안 24 */
  font-weight: 600;
  line-height: 1.8;                       /* 시안 180% */
  color: #717071;
}
.register__note b { color: #1cabe2; font-weight: 600; }

@media (max-width: 767px) {
  .register__note { margin-top: 20px; font-size: 14px; line-height: 1.6; }
  .fm__golink { font-size: 14px; }
}

/* 온라인 참석자의 마이페이지 — QR 자리에 들어가는 안내 */
.qr__online {
  margin: clamp(16px, 1.667vw, 32px) auto 0;
  max-width: 800px;
  text-align: center;
  font-size: clamp(13px, 1.042vw, 20px);
  line-height: 1.8;
  color: #525252;
}

/* 참석 방법 변경 팝업 — 시안 11327:12172 (1044x276, 안내 한 줄 + 파란 링크) */
.modal__act {
  margin-top: clamp(10px, 1.042vw, 20px);
  text-align: center;
}
.modal__link {
  display: inline-flex;
  align-items: center;
  gap: 0.15em;
  padding: 0;
  border: 0;
  background: none;
  color: var(--c-primary);
  font-size: clamp(14px, 1.25vw, 24px);
  font-weight: 700;
  line-height: 1.8;
  text-decoration: underline;
  text-underline-offset: 0.2em;
  cursor: pointer;
}
.modal__link[disabled] { opacity: 0.6; cursor: default; }

/* 시안 11327:9835 — 참석 방법 변경이 날짜 변경 위에 세로로 쌓인다 */
.btn-row--stack {
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.btn-row--stack .btn { min-width: clamp(200px, 19.323vw, 371px); min-height: clamp(42px, 3.594vw, 69px); font-size: clamp(14px, 1.25vw, 24px); }

/* 온라인 참석자의 QR 칸 — 시안 실측: 바탕 #E1E1E1, 테두리 시안색 */
.qr__box--note {
  background: #E1E1E1;
  border: 1px solid var(--c-primary);
}
.qr__none {
  display: block;
  text-align: center;
  font-size: clamp(16px, 2.396vw, 46px);   /* 시안 46 */
  font-weight: 500;
  line-height: 1.8;                        /* 시안 180% */
  color: #000;
}