:root{
  --bg:#FAF6F0;
  --surface:#FFFFFF;
  --ink:#322F2B;
  --ink-soft:#7A746C;
  --line:#EDE6DA;
  --line-strong:#E0D7C8;
  --coral:#F0795B;
  --coral-deep:#E25C3D;
  --coral-soft:#FFF1EB;
  --mint:#34B49B;
  --mint-soft:#E7F6F1;
  --gold:#F0A92B;
  --gold-soft:#FFF6E4;
  --shadow:0 6px 28px rgba(80,55,35,.07);
  --shadow-sm:0 2px 10px rgba(80,55,35,.05);
  --r-lg:22px;
  --r-md:14px;
  --r-sm:10px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;overflow-x:hidden;}
body{
  margin:0;
  width:100%;
  max-width:100%;
  overflow-x:hidden; /* 가로 스크롤/뷰포트 확장 차단 → 모달(fixed) 중앙정렬 어긋남 방지 */
  font-family:'Pretendard',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.55;
  letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;
}
.page{max-width:620px;margin:0 auto;padding:0 16px 64px;}

/* ---------- BRAND ---------- */
.brand{
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 4px 6px;
}
.brand__logo{
  font-size:21px;font-weight:800;letter-spacing:-.03em;color:var(--coral-deep);
  text-transform:lowercase;display:inline-flex;align-items:center;gap:7px;
}
.brand__logo::before{
  content:"";width:10px;height:10px;border-radius:50%;
  background:var(--coral);box-shadow:0 0 0 4px var(--coral-soft);
}
.brand__links{display:flex;align-items:center;gap:8px;}
.brand__links a{
  font-size:12.5px;font-weight:700;color:var(--ink-soft);text-decoration:none;
  border:1px solid var(--line-strong);border-radius:999px;padding:6px 13px;
  transition:all .15s;white-space:nowrap;
}
.brand__links a:hover{color:var(--coral-deep);border-color:var(--coral);background:var(--coral-soft);}
@media (max-width:380px){
  .brand__links a{padding:6px 10px;font-size:12px;}
}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  margin-top:24px;
  background:linear-gradient(150deg,#FFF6F0 0%,#FDEEF0 45%,#EAF6F1 100%);
  border:1px solid #F3E7DC;
  border-radius:var(--r-lg);
  padding:30px 26px 28px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
.hero__badge{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--coral);color:#fff;
  font-size:12.5px;font-weight:700;
  padding:6px 12px;border-radius:999px;
  letter-spacing:.01em;
}
.hero__badge::before{content:"🎁";font-size:13px;}
.hero h1{
  margin:14px 0 8px;
  font-size:27px;font-weight:800;line-height:1.25;letter-spacing:-.02em;
}
.hero h1 b{color:var(--coral-deep);font-weight:800;}
.hero p{margin:0;color:var(--ink-soft);font-size:14.5px;max-width:380px;}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;}
.chip{
  background:rgba(255,255,255,.8);
  border:1px solid #EFE3D6;
  color:#5C564E;
  font-size:12.5px;font-weight:600;
  padding:7px 12px;border-radius:999px;
  display:inline-flex;align-items:center;gap:5px;
}
.chip i{font-style:normal;}
.hero__box{
  position:absolute;right:-10px;bottom:-14px;width:118px;height:118px;opacity:.9;
  pointer-events:none;
}
@media (max-width:430px){
  .hero__box{width:88px;height:88px;right:-6px;bottom:-8px;opacity:.55;}
  .hero h1{font-size:23px;}
}

/* ---------- SECTION CARD ---------- */
.card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:24px 22px;
  margin-top:18px;
  box-shadow:var(--shadow-sm);
}
.card__head{display:flex;align-items:center;gap:10px;margin-bottom:4px;}
.card__num{
  flex:0 0 auto;
  width:26px;height:26px;border-radius:8px;
  background:var(--coral-soft);color:var(--coral-deep);
  font-size:13px;font-weight:800;
  display:grid;place-items:center;
}
.card__head h2{margin:0;font-size:17px;font-weight:800;letter-spacing:-.02em;}
.card__desc{margin:2px 0 18px 36px;color:var(--ink-soft);font-size:13px;}
@media (max-width:430px){.card__desc{margin-left:0;}}

/* ---------- FIELDS ---------- */
.field{margin-bottom:18px;}
.field:last-child{margin-bottom:0;}
label.lab{display:block;font-size:14px;font-weight:700;margin-bottom:8px;}
.req{color:var(--coral);margin-left:2px;font-weight:800;}
.opt{color:var(--ink-soft);font-size:12px;font-weight:600;margin-left:5px;}
.hint{display:block;color:var(--ink-soft);font-size:12px;margin-top:6px;}

input[type=text],input[type=tel],input[type=date],input[type=url],textarea,select{
  width:100%;
  font-family:inherit;font-size:14.5px;color:var(--ink);
  background:#FCFAF6;
  border:1.5px solid var(--line-strong);
  border-radius:var(--r-md);
  padding:13px 14px;
  transition:border-color .15s,background .15s,box-shadow .15s;
}
textarea{resize:vertical;min-height:84px;line-height:1.5;}
input::placeholder,textarea::placeholder{color:#B6AEA2;}
input:focus,textarea:focus,select:focus{
  outline:none;border-color:var(--coral);background:#fff;
  box-shadow:0 0 0 4px var(--coral-soft);
}
.row{display:flex;gap:10px;}
.row > *{flex:1;}
.grow2{flex:2;}

.btn-ghost{
  flex:0 0 auto;white-space:nowrap;
  background:var(--ink);color:#fff;border:none;
  font-family:inherit;font-size:13.5px;font-weight:700;
  padding:0 16px;border-radius:var(--r-md);cursor:pointer;
  transition:opacity .15s;
}
.btn-ghost:hover{opacity:.88;}

/* file upload */
.file{
  display:flex;align-items:center;gap:12px;
  border:1.5px dashed var(--line-strong);
  background:#FCFAF6;border-radius:var(--r-md);
  padding:14px;cursor:pointer;transition:border-color .15s,background .15s;
}
.file:hover{border-color:var(--coral);background:#fff;}
.file__icon{
  width:38px;height:38px;border-radius:10px;flex:0 0 auto;
  background:var(--mint-soft);color:var(--mint);
  display:grid;place-items:center;font-size:18px;
}
.file__txt{font-size:13.5px;}
.file__txt strong{display:block;font-weight:700;color:var(--ink);}
.file__txt span{color:var(--ink-soft);font-size:12px;}
.file input{display:none;}
.notice{
  margin-top:8px;display:flex;gap:8px;align-items:flex-start;
  background:var(--gold-soft);border:1px solid #F4E2B8;border-radius:var(--r-sm);
  padding:10px 12px;font-size:12.5px;color:#8A6A12;
}
.notice b{color:#7A5A06;}

/* radio / check cards */
.opt-group{display:flex;flex-direction:column;gap:8px;}
.opt-group.cols{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.pick{
  display:flex;align-items:center;gap:11px;cursor:pointer;
  border:1.5px solid var(--line-strong);background:#FCFAF6;
  border-radius:var(--r-md);padding:13px 14px;
  font-size:14px;transition:all .15s;
}
.pick:hover{border-color:#D9CCB8;}
.pick input{appearance:none;-webkit-appearance:none;margin:0;flex:0 0 auto;
  width:20px;height:20px;border:2px solid #CFC4B2;border-radius:50%;
  transition:all .15s;position:relative;}
.pick input[type=checkbox]{border-radius:6px;}
.pick input:checked{border-color:var(--coral);background:var(--coral);}
.pick input:checked::after{
  content:"";position:absolute;inset:0;margin:auto;
  width:7px;height:7px;border-radius:50%;background:#fff;
}
.pick input[type=checkbox]:checked::after{
  width:6px;height:10px;border:2px solid #fff;border-top:0;border-left:0;
  border-radius:1px;transform:rotate(42deg);top:1px;
}
.pick:has(input:checked){border-color:var(--coral);background:var(--coral-soft);}
.pick .pk-main{font-weight:600;}
.pick .pk-sub{display:block;font-size:12px;color:var(--ink-soft);font-weight:500;margin-top:1px;}
.pick.box-pick{align-items:flex-start;}

.etc-input{margin-top:8px;display:none;}
.etc-input.show{display:block;}

/* ---------- CONSENT ---------- */
.consent-all{
  display:flex;align-items:center;gap:12px;
  background:var(--mint-soft);border:1.5px solid #BFE7DB;
  border-radius:var(--r-md);padding:15px 16px;margin-bottom:16px;cursor:pointer;
}
.consent-all input{width:22px;height:22px;accent-color:var(--mint);flex:0 0 auto;cursor:pointer;}
.consent-all strong{font-size:15px;font-weight:800;}
.consent-all span{display:block;font-size:12px;color:#3C8A78;font-weight:600;margin-top:1px;}

.consent{border:1px solid var(--line);border-radius:var(--r-md);padding:15px 16px;margin-bottom:12px;}
.consent:last-child{margin-bottom:0;}
.consent__top{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.consent__title{font-size:14px;font-weight:700;display:flex;align-items:center;gap:7px;}
.tag{font-size:11px;font-weight:800;padding:3px 8px;border-radius:999px;}
.tag.must{background:var(--coral-soft);color:var(--coral-deep);}
.tag.opt{background:#F0EEE9;color:var(--ink-soft);}
.agree{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--ink-soft);cursor:pointer;white-space:nowrap;}
.agree input{width:19px;height:19px;accent-color:var(--coral);cursor:pointer;}
.agree:has(input:checked){color:var(--coral-deep);}

.policy{
  margin-top:12px;max-height:120px;overflow-y:auto;
  background:#FBF8F3;border:1px solid var(--line);border-radius:var(--r-sm);
  padding:12px 14px;font-size:12px;line-height:1.7;color:#6E685F;
}
.policy h4{margin:0 0 6px;font-size:12.5px;color:var(--ink);}
.policy p{margin:0 0 8px;}
.policy::-webkit-scrollbar{width:7px;}
.policy::-webkit-scrollbar-thumb{background:#DCD3C4;border-radius:4px;}

/* 제3자 제공 table */
.third{margin-top:12px;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;}
.third table{width:100%;border-collapse:collapse;font-size:11.5px;}
.third th,.third td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;}
.third thead th{background:#FBF8F3;font-weight:700;color:var(--ink);font-size:11px;}
.third tbody tr:last-child td{border-bottom:none;}
.third td:first-child{font-weight:700;color:var(--ink);white-space:nowrap;}
.third .who{display:flex;align-items:center;gap:6px;}
.dot{width:7px;height:7px;border-radius:50%;flex:0 0 auto;}
.dot.cj{background:#E2231A;}
.dot.sb{background:#2E7CF6;}
.dot.dw{background:#7B5CF0;}
.dot.sc{background:var(--coral);}

/* data-flow strip */
.flow{
  margin-top:14px;background:#FBF8F3;border:1px dashed var(--line-strong);
  border-radius:var(--r-md);padding:14px 16px;
}
.flow__lab{font-size:12px;font-weight:700;color:var(--ink-soft);margin-bottom:10px;}
.flow__lab b{color:var(--coral-deep);}
.flow__line{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.node{
  display:inline-flex;align-items:center;gap:6px;
  background:#fff;border:1px solid var(--line-strong);border-radius:999px;
  padding:6px 11px;font-size:12px;font-weight:700;
}
.arrow{color:#C9BDA9;font-weight:800;font-size:13px;}

/* ---------- SUBMIT ---------- */
.submit-wrap{margin-top:24px;}
.submit{
  width:100%;border:none;cursor:pointer;
  background:linear-gradient(135deg,var(--coral) 0%,var(--coral-deep) 100%);
  color:#fff;font-family:inherit;font-size:16.5px;font-weight:800;
  padding:17px;border-radius:var(--r-md);letter-spacing:.01em;
  box-shadow:0 8px 22px rgba(226,92,61,.28);transition:transform .12s,box-shadow .12s;
}
.submit:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(226,92,61,.34);}
.submit:active{transform:translateY(0);}
.submit:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none;}
.submit-note{text-align:center;font-size:12px;color:var(--ink-soft);margin-top:12px;}

.err{display:none;color:var(--coral-deep);font-size:12px;font-weight:600;margin-top:6px;}
.err.show{display:block;}
.field.invalid input,.field.invalid textarea{border-color:var(--coral);background:#FFF7F4;}

/* 제출 실패 등 전역 안내 */
.form-alert{
  display:none;margin-top:14px;
  background:var(--coral-soft);border:1px solid #F4C4B6;border-radius:var(--r-md);
  padding:12px 14px;font-size:13px;font-weight:600;color:var(--coral-deep);
}
.form-alert.show{display:block;}

/* ---------- MODAL ---------- */
.overlay{
  position:fixed;inset:0;top:0;left:0;margin:0;
  width:100vw;height:100vh;height:100dvh; /* 뷰포트 전체 기준 — 부모/폼 너비 영향 차단 */
  background:rgba(45,35,25,.5);
  display:none;align-items:center;justify-content:center;padding:20px;z-index:50;
  backdrop-filter:blur(2px);
}
.overlay.show{display:flex;}
.modal{
  background:#fff;border-radius:var(--r-lg);
  width:min(90%,380px);margin:0 auto; /* 모바일 좌우 여백 균등, 데스크톱 380px 상한 */
  padding:30px 26px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.25);
  animation:pop .22s ease;
}
@keyframes pop{from{opacity:0;transform:scale(.94) translateY(8px);}to{opacity:1;transform:none;}}
.modal__ic{
  width:62px;height:62px;border-radius:50%;margin:0 auto 16px;
  background:var(--mint-soft);color:var(--mint);
  display:grid;place-items:center;font-size:30px;
}
.modal h3{margin:0 0 8px;font-size:20px;font-weight:800;}
.modal p{margin:0 0 18px;color:var(--ink-soft);font-size:14px;}
.modal button{
  width:100%;background:var(--ink);color:#fff;border:none;cursor:pointer;
  font-family:inherit;font-size:15px;font-weight:700;padding:14px;border-radius:var(--r-md);
}

.foot{text-align:center;margin-top:30px;}
.foot__brand{
  font-size:18px;font-weight:800;color:var(--coral-deep);
  letter-spacing:-.03em;text-transform:lowercase;margin-bottom:10px;
}
.foot__links{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:12px;}
.foot__links a{
  font-size:13px;font-weight:700;color:var(--ink-soft);text-decoration:none;
  border-bottom:1px solid transparent;transition:all .15s;
}
.foot__links a:hover{color:var(--coral-deep);border-bottom-color:var(--coral);}
.foot__dot{color:#C9BDA9;}
.foot p{margin:0;font-size:11.5px;color:#B0A899;line-height:1.7;}

/* ---------- CLOSED (신청 기간 외) ---------- */
.closed{
  margin-top:24px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:46px 28px;
  text-align:center;
  box-shadow:var(--shadow-sm);
}
.closed__ic{
  width:70px;height:70px;border-radius:50%;margin:0 auto 20px;
  background:var(--gold-soft);color:var(--gold);
  display:grid;place-items:center;font-size:34px;
}
.closed h2{margin:0 0 10px;font-size:22px;font-weight:800;letter-spacing:-.02em;}
.closed p{margin:0 auto 22px;color:var(--ink-soft);font-size:14.5px;max-width:360px;}
.closed__next{
  display:inline-flex;flex-direction:column;gap:2px;
  background:var(--coral-soft);border:1px solid #F4C4B6;border-radius:var(--r-md);
  padding:14px 22px;
}
.closed__next .lbl{font-size:12px;font-weight:700;color:var(--coral-deep);}
.closed__next .date{font-size:20px;font-weight:800;color:var(--coral-deep);letter-spacing:-.01em;}
.closed__note{margin-top:18px;font-size:12.5px;color:var(--ink-soft);}
@media (max-width:430px){
  .closed{padding:38px 20px;}
  .closed h2{font-size:20px;}
}
