@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: #162b56; background: #fff; }
.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; }
/* 1000px 기준 폼. 이미지 비율에 맞춰 환산한 좌표이며 resizeZoom()이 전체를 함께 축소합니다. */
.form_wrap {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 1000px;
    height: 630px;
    margin: 0;
}
.form_wrap input {
    display: block;
    min-width: 0;
    border: 0;
    border-radius: 10px;
    padding: 0 25px;
    color: #153468;
    background: transparent;
    font: inherit;
    font-size: 36.667px;
    font-weight: 500;
}
.form_wrap input::placeholder { color: #75849d; opacity: 1; }
.form_wrap input:focus { outline: 2px solid #1b57ac; outline-offset: -2px; }
.name-input {
    position: absolute;
    top: 377.75px;
    left: 248.5px;
    width: 593px;
    height: 62px;
}
.phone {
    display: grid;
    /* 첫 칸 / 간격 / 가운데 칸 / 간격 / 마지막 칸 */
    grid-template-columns: 164px 32px 182.75px 32.25px 182.75px;
    position: absolute;
    top: 450.25px;
    left: 248.5px;
    width: 593.75px;
    height: 62px;
    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: 524.167px;
    left: 250px;
    width: 500px;
    height: 58.333px;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: transparent;
    font-size: 0;
}
.btn_submit:hover { background: rgb(255 255 255 / 8%); }
.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: 28px;
    border: 1px solid #d4b66b;
    border-radius: 12px;
    color: #0b2869;
    background: linear-gradient(180deg, #fff, #f4f8ff);
    box-shadow: 0 18px 70px rgb(8 28 73 / 35%);
    overflow-y: auto;
}
#form-dialog::backdrop { background: rgb(5 20 57 / 60%); }
#form-dialog h2 { margin: 0 0 12px; color: #0b2869; font-size: 21px; line-height: 1.5; }
#dialog-message { margin: 0 0 24px; color: #52627e; font-size: 15px; line-height: 1.8; white-space: pre-line; overflow-wrap: anywhere; }
#dialog-confirm {
    border: 1px solid #d3af52;
    color: #fff;
    background: linear-gradient(180deg, #2357d9, #132da8 55%, #101692);
}
#dialog-confirm:hover { background: linear-gradient(180deg, #376bed, #2040bf 55%, #1825a7); }
#form-dialog:focus, #form-dialog:focus-visible,
#form-dialog :focus, #form-dialog :focus-visible { outline: none; outline-offset: 0; }
#form-dialog[data-tone="pending"] #dialog-message { margin-bottom: 0; }
.dialog-progress { display: none; width: 26px; height: 26px; margin-bottom: 18px; border: 3px solid #dbe6fb; border-top-color: #2258d9; 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; } }
/* PC 모달만 조금 확대하고 모바일의 기존 크기는 유지합니다. */
@media (min-width: 768px) {
    #form-dialog { max-width: 460px; padding: 34px; }
    #form-dialog h2 { font-size: 24px; }
    #dialog-message { font-size: 17px; }
    #dialog-confirm { height: 54px; font-size: 17px; }
}
