@charset "utf-8";

/* 플로팅 견적 폼 */
#formmail-write { display: flex; flex-direction: column; align-items: center; padding-top: 8px; border-radius: 28px 28px 0 0;}

/* 탭 버튼 */
.fm_tab { background: #0B318F; padding: 13px 20px; border-radius: 12px 12px 0 0; font-size: 18px; font-weight: 600; color: #fff; text-align: center; cursor: pointer; white-space: nowrap; letter-spacing: -0.45px; box-shadow: 0px -4px 12px rgba(0,0,0,0.12); transition: 0.3s all; line-height: 150%;}
.fm_tab:hover { background: #0132AD; }

/* 폼 본체 */
.fm_body { width: 100%; background: #fff; border-radius: 28px 28px 0 0; box-shadow: 0px -4px 12px rgba(0,0,0,0.12); border-bottom: 1px solid #E5E5EC; }

/* 폼 레이아웃 */
.fm_form { display: flex; align-items: stretch; gap: 20px; padding: 28px 4%; }

/* 폼 컬럼 */
.fm_col { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.fm_col_textarea { flex: 1.2; }
.fm_col_action { flex: 1.5; display: flex; flex-direction: row; align-items: center; gap: 8px; }

/* 인풋 공통 */
.fm_col input[type="text"],
.fm_col select,
.fm_col textarea { width: 100%; border: 1px solid #E5E5EC; border-radius: 8px; padding: 15px 20px; font-size: 16px; font-weight: 500; color: #111; letter-spacing: -0.4px; line-height: 160%; font-family: 'Pretendard', sans-serif; background: #fff; }
.fm_col input[type="text"]::placeholder,
.fm_col textarea::placeholder { color: #999; }
.fm_col input[type="text"]:focus,
.fm_col select:focus,
.fm_col textarea:focus { outline: none; border-color: #0132AD; }

/* 셀렉트 화살표 */
.fm_select_wrap { position: relative; }
.fm_select_wrap select { appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer; color: #111; }
.fm_select_wrap::after { content: ''; position: absolute; right: 16px; top: 50%; transform: translateY(-50%) rotate(90deg); width: 22px; height: 22px; background: url('/theme/nero/img/arrow_down.png') no-repeat center; background-size: contain; pointer-events: none; }

/* 텍스트에어리어 */
.fm_col textarea { flex: 1; resize: none; min-height: 100%; }

/* 개인정보 동의 */
.fm_privacy { display: flex; align-items: center; gap: 8px; padding: 0 14px; cursor: pointer; white-space: nowrap;}
.fm_privacy input[type="checkbox"] { width: 22px; height: 22px; accent-color: #0132AD; cursor: pointer; flex-shrink: 0;}
.fm_privacy span { font-size: 16px; font-weight: 500; color: #111; letter-spacing: -0.4px; line-height: 160%;}
.fm_privacy span a { text-decoration: underline; color: #111; }

/* 제출 버튼 */
.fm_submit { flex: 1; border: none; background: linear-gradient(70deg, #0132AD 0%, #0B318F 100%); border-radius: 8px; padding: 20px; font-size: 22px; font-weight: 700; color: #fff; cursor: pointer; letter-spacing: -0.55px; line-height: 160%; font-family: 'Pretendard', sans-serif; white-space: nowrap; transition: 0.3s all; }
.fm_submit:hover { background: linear-gradient(70deg, #0142c7 0%, #0d3ba8 100%); }

/* 팝업 */
.pop_wrap {display: none; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.3); width: 100%; height: 100%; z-index: 9999;}
.pop_wrap .pop-inner {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; max-width: 650px; max-height: 600px; padding: 50px 20px; background: #fff; border-radius: 20px; overflow-y: auto;}
.pop_wrap .pop-inner h3 { font-size: 20px; font-weight: 700; margin-bottom: 20px; }
.pop_wrap .pop-text { font-size: 15px; color: #555; line-height: 170%; }
.pop-close {position: absolute; top: 15px; right: 15px; width: 30px; height: 30px; cursor: pointer;}
.pop-close i{font-size: 24px;}

/* 반응형 */
@media all and (max-width: 1200px) {
    .fm_form { flex-wrap: wrap; }
    .fm_col { flex: 1 1 45%; }
    .fm_col_textarea { flex: 1 1 45%; }
    .fm_col_action { flex: 1 1 100%; }
}

@media all and (max-width: 768px) {
    .fm_form { gap: 12px; padding: 20px 4%; }
    .fm_col { flex: 1 1 100%; }
    .fm_col_textarea { flex: 1 1 100%; }
    .fm_col_action { flex-direction: column; gap: 6px; }
    .fm_col input[type="text"],
    .fm_col select,
    .fm_col textarea { padding: 10px 14px; font-size: 14px; }
    .fm_col textarea { min-height: auto; }
    .fm_privacy span { font-size: 14px; }
    .fm_submit { width: 100%; padding: 14px; font-size: 18px; }
    .fm_tab { font-size: 16px; padding: 10px 16px; }
}