@font-face {
    font-family: 'Pretendard';
    src: url('fonts/Pretendard-Regular.woff?v=20261106193416') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('fonts/Pretendard-Medium.woff?v=20261106193416') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('fonts/Pretendard-SemiBold.woff?v=20261106193416') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('fonts/Pretendard-Bold.woff?v=20261106193416') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
* { box-sizing: border-box; font-family: 'Pretendard', sans-serif; }
html, body { margin: 0; padding: 0; }
body { font-family: 'Pretendard', sans-serif; color: #40271d; background: #fff9ec; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.body_wrap { width: 100%; max-width: 1000px; margin: 0 auto; }
.landing-image { display: block; width: 100%; height: auto; }
.form_box { position: relative; }
/* 1200px 원본 이미지 좌표. resizeZoom()이 이미지와 같은 비율로 축소합니다. */
.form_wrap {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 1200px;
    height: 1175px;
    margin: 0;
}
.form_wrap input {
    display: block;
    min-width: 0;
    border: 0;
    border-radius: 12px;
    padding: 0 28px;
    color: #442b25;
    background: transparent;
    font: inherit;
    font-size: 38px;
    font-weight: 500;
}
.form_wrap input::placeholder { color: #b58e9a; opacity: 1; }
.form_wrap input:focus { outline: 3px solid #ec4e8b; outline-offset: -2px; }
.name-input {
    position: absolute;
    top: 790px;
    left: 253px;
    width: 837px;
    height: 84px;
}
.phone {
    display: grid;
    /* 첫 칸 / 간격 / 가운데 칸 / 간격 / 마지막 칸 */
    grid-template-columns: 228px 49px 256px 48px 256px;
    position: absolute;
    top: 889px;
    left: 253px;
    width: 837px;
    height: 84px;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
.phone input { width: 100%; height: 100%; padding: 0 3.333px; text-align: center; }
#phone1 { grid-column: 1; }
#phone2 { grid-column: 3; }
#phone3 { grid-column: 5; }
.img_box { display: block; }
.img_box:focus-visible { outline: 3px solid #d7ad4c; outline-offset: -3px; }
button { width: 100%; height: 48px; border: 0; border-radius: 6px; background: #26364d; color: white; font: inherit; font-weight: 600; cursor: pointer; }
button:hover { background: #354b69; }
button:disabled { opacity: .6; cursor: wait; }
.btn_submit {
    position: absolute;
    top: 1016px;
    left: 314px;
    width: 586px;
    height: 116px;
    padding: 0;
    border: 0;
    border-radius: 60px;
    background: transparent;
    color: transparent;
    font-size: 0;
}
.btn_submit:hover { background: rgb(255 255 255 / 14%); box-shadow: 0 0 24px rgb(239 74 139 / 25%); }
.btn_submit:active { background: rgb(173 24 81 / 10%); }
.btn_submit:focus-visible { outline: 3px solid #ffdf89; outline-offset: -4px; }
#form-dialog {
    width: calc(100% - 32px);
    max-width: 380px;
    max-height: calc(100dvh - 32px);
    margin: auto;
    padding: 30px 24px 24px;
    border: 2px solid #dfb64c;
    border-radius: 26px;
    color: #40271d;
    background: radial-gradient(ellipse at top, #fff 0%, #fff9ed 70%);
    box-shadow: 0 0 0 5px rgb(255 244 209 / 45%), 0 20px 70px rgb(87 49 31 / 28%);
    overflow-y: auto;
    text-align: center;
}
#form-dialog::backdrop { background: rgb(65 35 30 / 58%); backdrop-filter: blur(4px); }
.dialog-emblem {
    display: grid;
    place-items: center;
    width: 62px;
    height: 62px;
    margin: 0 auto 16px;
    border: 2px solid #e9be58;
    border-radius: 50%;
    color: #e6377c;
    background: linear-gradient(145deg, #fffef6, #ffe8ad);
    box-shadow: inset 0 0 0 4px #fff8e4, 0 5px 14px rgb(201 149 45 / 16%);
    font-size: 36px;
    line-height: 1;
}
.dialog-eyebrow { margin: 0 0 8px; color: #cf3a75; font-size: 13px; font-weight: 700; letter-spacing: .08em; }
#form-dialog h2 { margin: 0 0 12px; color: #40271d; font-size: 22px; line-height: 1.4; word-break: keep-all; }
#dialog-message { margin: 0 0 24px; color: #7b6259; font-size: 15px; line-height: 1.8; white-space: pre-line; overflow-wrap: anywhere; word-break: keep-all; }
#dialog-confirm {
    height: 50px;
    border: 1px solid #ddac45;
    border-radius: 28px;
    color: #fff;
    background: linear-gradient(180deg, #ff98be, #f34b91 55%, #df2d73);
    box-shadow: inset 0 0 0 2px rgb(255 255 255 / 35%), 0 4px 10px rgb(225 54 121 / 18%);
    font-size: 16px;
    font-weight: 700;
    text-shadow: 0 1px 2px rgb(140 24 69 / 28%);
}
#dialog-confirm:hover { background: linear-gradient(180deg, #ffa9ca, #fa609f 55%, #e83e82); }
#dialog-confirm:focus-visible { outline: 3px solid #b52963; outline-offset: 4px; }
#form-dialog:focus { outline: none; }
#form-dialog[data-tone="pending"] #dialog-message { margin-bottom: 0; }
#form-dialog[data-tone="pending"] .dialog-emblem { display: none; }
#form-dialog[data-tone="success"] .dialog-emblem { color: #fff; background: linear-gradient(145deg, #ff99bf, #e8397d); }
.dialog-progress { display: none; width: 48px; height: 48px; margin: 0 auto 20px; border: 4px solid #f9dce7; border-top-color: #ec4e8b; border-radius: 50%; animation: dialog-spin .8s linear infinite; }
#form-dialog[data-tone="pending"] .dialog-progress { display: block; }
html:has(#form-dialog[open]) { overflow: hidden; }
@keyframes dialog-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .dialog-progress { animation: none; } }
@media (min-width: 768px) {
    #form-dialog { max-width: 460px; padding: 36px 32px 30px; }
    #form-dialog h2 { font-size: 26px; }
    #dialog-message { font-size: 17px; }
    #dialog-confirm { height: 54px; font-size: 17px; }
}