#reservation.reserve{background:linear-gradient(135deg,#062d41 0%,#0b4054 100%);padding:88px 0}
#reservation .rg{align-items:center}
#reservation .visit{color:#fff}
#reservation .visit .ey{color:#8fdce7}
#reservation .visit h2{color:#fff;font-size:42px;line-height:1.2;margin:8px 0 18px}
#reservation .visit p{color:#c7d7dc;font-size:15px;line-height:1.8;margin:0 0 16px}
#reservation .visit .big{display:inline-block;color:#fff;font-size:30px;letter-spacing:.02em;margin-top:4px}
#reservation #f{position:relative;background:#fff;border:1px solid rgba(255,255,255,.7);border-radius:22px;padding:34px 34px 30px;box-shadow:0 22px 60px rgba(0,0,0,.22)}
#reservation #f:before{content:'방문예약 신청';display:block;color:#07354c;font-size:24px;font-weight:800;letter-spacing:-.03em;margin:0 0 24px;padding-bottom:17px;border-bottom:1px solid #e8eef0}
#reservation #f label{display:block;margin:0 0 16px}
#reservation #f label>span{display:block;color:#425862;font-size:13px;font-weight:700;margin:0 0 7px}
#reservation #f input:not([type="hidden"]),#reservation #f select{width:100%;height:54px;border:1px solid #d6e0e3;border-radius:11px;background:#fbfcfc;color:#18323c;padding:0 14px;font-size:16px;outline:none;transition:border-color .18s,box-shadow .18s,background .18s}
#reservation #f input::placeholder{color:#9aa9af}
#reservation #f input:not([type="hidden"]):focus,#reservation #f select:focus{border-color:#0b7e99;background:#fff;box-shadow:0 0 0 3px rgba(11,126,153,.10)}
#reservation #f .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#reservation #f .date-field{position:relative}
#reservation #f .date-field .date-hint{position:absolute;left:14px;top:50%;transform:translateY(-50%);pointer-events:none;color:#9aa9af;font-size:16px;line-height:1;background:#fbfcfc;padding-right:4px;z-index:2}
#reservation #f .date-field.has-value .date-hint,#reservation #f .date-field.has-focus .date-hint{display:none}
#reservation #f .date-field:not(.has-value):not(.has-focus) input[type="date"]{color:transparent}
#reservation #f .date-field:not(.has-value):not(.has-focus) input[type="date"]::-webkit-datetime-edit{color:transparent}
#reservation #f .date-field input[type="date"]::-webkit-calendar-picker-indicator{opacity:.72;cursor:pointer}
#reservation #f .agree{display:flex;align-items:flex-start;gap:10px;margin:2px 0 18px;padding:13px 14px;border:1px solid #e3eaec;border-radius:11px;background:#f7f9fa;cursor:pointer}
#reservation #f .agree input{flex:0 0 18px;width:18px;height:18px;margin:1px 0 0;accent-color:#07354c}
#reservation #f .agree span{margin:0!important;color:#63767e!important;font-size:12px!important;font-weight:400!important;line-height:1.6!important}
#reservation #f .submit{width:100%;height:56px;border:0;border-radius:11px;background:linear-gradient(90deg,#07354c,#0b718a);color:#fff;font-size:17px;font-weight:800;letter-spacing:-.02em;cursor:pointer;box-shadow:0 10px 22px rgba(7,53,76,.18);transition:transform .18s,box-shadow .18s,opacity .18s}
#reservation #f .submit:hover{transform:translateY(-1px);box-shadow:0 13px 26px rgba(7,53,76,.24)}
#reservation #f .submit:disabled{opacity:.6;cursor:wait;transform:none}
#reservation #f .msg{margin:10px 0 0;min-height:18px;font-size:13px}
@media(max-width:760px){
 #reservation.reserve{padding:64px 0 78px}
 #reservation .rg{grid-template-columns:1fr!important;gap:28px!important}
 #reservation .visit h2{font-size:34px}
 #reservation .visit .big{font-size:27px}
 #reservation #f{padding:26px 18px 22px;border-radius:18px}
 #reservation #f:before{font-size:21px;margin-bottom:20px;padding-bottom:14px}
 #reservation #f .row{grid-template-columns:1fr;gap:0}
 #reservation #f input:not([type="hidden"]),#reservation #f select{height:52px;font-size:16px}
 #reservation #f .submit{height:54px}
}
