도움말
새로고침
홀딩도어 시뮬레이션
한겹칼라특주
한겹칼라특주
한겹베이직
한겹베이직
투명베이직
투명베이직
투명특주
투명특주
암막콤비
친환경 항균콤비
프리미엄콤비
무지콤비
홀딩도어
비교하기
시공갤러리
통합관리자
초기화면
입력초기화
새로고침
PRODUCT
INFO
작동방식
편개
양개
중개
양중개
편중개
색상믹스
믹스안함
믹스1(A+B)
믹스2(AA+BB)
믹스3(A+B+C)
담긴상품
확인
비교하기
<section id="size_form_area" style="width:100%;height:100%;left:0px;top:0px;position:fixed;z-index:999999;background:#EDF0F5;"> <div style="height:40px;line-height:40px;padding:0px 0px 0px 20px;background:#5D9CEC;color:#fff;font-size:18px;font-weight:bold;"> <div class="fl" style=""><div style="line-height:40px;font-size:14px;"><i class="fa fa-bullhorn" aria-hidden="true"></i> 설치하사려는 장소의 사이즈를 입력해 주세요</div></div> <a class="fr" style="display:block;" onclick="$('#size_form_area').remove();"><i style="cursor:pointer;width:40px;text-align:center;height:40px;line-height:40px;font-size:20px;background:#2A6197;" class="fa fa-times"></i></a> </div> <div style="width:calc(100% - 0px);height:calc(100% - 40px);"> <div class="cba" style="width:100%;height:100%;position:relative;"> <div class="fl" style="width:calc(100% - 462px);height:100%;"> <div style="width:100%;height:100%;overflow-x:hidden;overflow-y:auto;" id="window_list_wrap"> <ul id="window_list" class="cba"> </ul> </div> </div> <div class="fr" style="width:450px;height:calc(100% - 6px);border:6px solid #5D9CEC;border-top:0px;"> <div style="padding:10px;width:calc(100% - 20px);height:calc(100% - 20px);position:relative;"> <style> #input_area { width:100%;height:25px;padding:0px 10px;border:1px solid #ccc;font-size:14px;-webkit-box-sizing: border-box;box-sizing: border-box; } #input_area:focus { border:1px solid red; } #input_area_prefix { width:100%;height:25px;padding:0px 10px;border:1px solid #ccc;font-size:14px;-webkit-box-sizing: border-box;box-sizing: border-box; } #input_area_prefix:focus { border:1px solid red; } .user_form_tbl select { width:100%;height:23px !important;line-height:23px !important;vertical-align:middle;display:inline-block;font-size:12px !important;background:#fff; } .user_form_tbl select { width:100%;height:23px !important;line-height:23px !important;vertical-align:middle;display:inline-block;font-size:12px !important;background:#fff; } .bt_check_submit { height:30px;background:#eee;color:#000;font-size:15px;border-radius:0px; border:0px; } .bt_check_submit:hover { background:#eee; } .bt_check_submit:hover , .bt_check_submit:focus { background:#eee; } .window_size_wrapper div { font-size:13px !important; } .window_size_wrapper label { font-size:13px !important; } .window_size_wrapper button { font-size:13px !important; } .window_size_wrapper input[type=radio] { width:20px !important;height:20px !important; } .window_size_wrapper { overflow-x:hidden;overflow-y:auto; } .label_txt { border-bottom:0px solid #000;height:25px;text-align:center;line-height:25px;font-size:14px; background:#DCE6EF;color:#333; font-weight:normal; } .size_txt_wrap { border-radius:0px; } .window_size_wrapper label { font-size:12px !important; } .size_txt_wrap { border:1px solid #7C8FC6; } .user_form_tbl select { width:100%;height:23px !important;line-height:23px !important;vertical-align:middle;display:inline-block;font-size:12px !important;background:#fff; } .window_list > li.blind_area_group_name { width:100% !important;position:relative;min-height:25px !important;height:25px !important;line-height:25px;font-size:13px;padding:0px 0px;background:transparent;border:0px;float:none;clear:both;display:block;font-weight:bold;color:#000;margin-bottom:5px !important; } .window_list > li.blind_area_group_name > div { position:absolute;left:-10px;top:-10px;height:10px;width:calc(100% + 15px);background:#EDF0F5; } .window_list.txt_type > li.blind_area_group_name { border-top:10px solid #EDF0F5 !important;position:relative;margin-left:-10px !important;width:calc(100% - 0px) !important;margin-top:0px !important;padding:5px 5px 5px 10px !important; } .bt_s2_area_conf_area > div > button { display:inline-block; } .bt_s2_area_conf_area > div > button:nth-child(2) { display:none; } .bt_check_submit { height: 30px !important; line-height: 30px !important; border: 1px solid #ccc; } </style> <script> var fn_load_area_code = function () { var area_name = $("#input_area").val(); area_name = area_name ? area_name : ""; var prefix = $("#input_area_prefix").val(); prefix = prefix ? prefix : ""; var param = ""; $("#input_size_area .cal_area_name").each(function () { param += "&area_names[]=" + $(this).val(); }); $.post("/ajax_proc/compare.prc.php","mode=load_area_code&prefix=" + prefix + "&area_name=" + area_name + param,function (html) { $("#input_area_select").html(html).show(); $("#mod_input_area_select").html(html).show(); $("#mod_input_area").hide(); $("#input_area").hide(); }); }; var fn_load_area_code_select = function (area_name) { switch (area_name) { case "empty": $("#input_area").val(''); $("#mod_input_area").val(''); break; case "admin": $("#input_area").val('').show(); $("#input_area_select").hide(); $("#mod_input_area").val('').show(); $("#mod_input_area_select").hide(); break; default : $("#input_area").val(area_name); $("#mod_input_area").val(area_name); break; } } </script> <div style="background:#fff;padding:10px;"> <div style="font-size:13px;margin-bottom:0px;font-weight:bold;color:#000;">위치정보</div> <table class="user_form_tbl"> <colgroup> <col width="90" /> <col width="*" /> <col width="70" /> </colgroup> <tr> <td class="td1 center">설치위치</td> <td><input type="text" name="" id="input_area_prefix" class="input_area" pad_left="220" placeholder="설치 위치 입력1"/></td> <td rowspan="2"> <button class="bt_check_submit" onclick="fn_check_area_submit();" style="width:100%;height:90px;line-height:90px;">확 인</button> </td> </tr> <tr> <td class="td1 center">상세위치</td> <td> <select name="" id="input_area_select" style="width:calc(100% - 2px);padding:0px 10px;height:38px;border:0px;font-size:24px;background:#fff;" onchange="fn_load_area_code_select(this.value);"> </select> <input type="text" name="" id="input_area" class="input_area" pad_left="220" placeholder="설치 위치 입력2" style="display:none;"/> <script> $(function () { fn_load_area_code(); }); </script> </td> </tr> </table> </div> <div class="" style="padding:10px;background:#fff;margin-top:20px;"> <div style="padding:0px 0px 0px 0px;padding-top:0px;text-align:left;margin:0px 0px 0px;"> <div style="font-size:13px;color:#000;font-weight:bold;">사이즈 정보</div> <div style="padding:0px 0px;padding-top:0px;text-align:left;"> <div style="padding:0px 0px;margin-top:0px;"> <div class="cba"> <table class="user_form_tbl"> <colgroup> <col width="*"> <col width="70"> </colgroup> <tbody> <tr> <td style="padding:0px;border:0px;"> <div class="fl cba" style="width:70%;"> <div class="fl" style="width:45%;"> <div class="size_txt_wrap" id="txt_wrap_width"> <div class="label_txt"> 가로 cm </div> <div> <input type="number" id="input_size_width" class="select_input number_input" value="" pad_right="560" pad_top="318" title="가로사이즈(cm)" style="width:100%;height:40px;line-height:40px;border:0px;font-size:30px;font-weight:normal;padding:0px;text-align:center;margin-right:5px;background:transparent;" placeholder=""> </div> </div> </div> <div class="fl center" style="width:10%;color:#aaa;"> <i class="fa fa-times" style="margin-top:20px;font-size:20px;"></i> </div> <div class="fl" style="width:45%;margin-right:0%;"> <div class="size_txt_wrap" id="txt_wrap_height"> <div class="label_txt"> 세로 cm </div> <div> <input type="number" id="input_size_height" class="select_input number_input" value="" pad_right="560" pad_top="318" title="세로사이즈(cm)" style="width:100%;height:40px;line-height:40px;border:0px;font-size:30px;font-weight:normal;padding:0px;text-align:center;margin-right:5px;background:transparent;" placeholder=""> </div> </div> </div> </div> <div class="fl cba" style="width:calc(30% - 20px);margin-left:10px;"> <div class="fl" style="width:90%;"> <div class="size_txt_wrap" id="txt_wrap_height"> <div class="label_txt"> 수량 </div> <div> <input type="number" id="window_num2" onkeyup="$('#window_num').val(this.value); //fn_set_window();" class="select_input number_input" value="1" pad_right="560" pad_top="318"title="수량"style="width:100%;height:40px;line-height:30px;border:0px;font-size:30px;font-weight:normal;padding:0px;text-align:center;margin-right:5px;background:transparent;" placeholder=""> </div> </div> </div> </td> <td class="center"> <button class="bt_check_submit" onclick="fn_check_submit();" style="padding:0px 15px;">확인</i></button> </td> </tr> </table> </div> </div> </div> </div> </div> <div style="background:#fff;padding:10px;margin-top:20px;"> <div style="font-size:13px;margin-bottom:0px;font-weight:bold;color:#000;">옵션정보</div> <table class="user_form_tbl"> <colgroup> <col width="90" /> <col width="*" /> </colgroup> <tr> <td class="td1 center">개폐방식</td> <td> <div class="option_area option_area1"></div> </td> </tr> <tr> <td class="td1 center">추가부속</td> <td> <div class="option_area option_area2"></div> </td> </tr> </table> </div> <div style="background:#fff;margin-top:30px; ;border:3px solid #000;display:none;"> <div style="padding:20px;"> <div class="cba"> <div id="option_area" class="cba"> </div> <select name="mix_type" id="mix_type" style="width:46%;height:40px;font-size:20px;display:none;" class="fr"> <option value="">믹스안함</option> <option value="2">믹스1(A+B)</option> <option value="3">믹스2(AA+BB)</option> <option value="4">믹스3(A+B+C)</option> </select> </div> </div> </div> <div style="margin-top:30px;background:#fff;padding:20px;border:3px solid #000;display:none !important;" class="cba bt_s2_area"> <div class="cba"> <div class="fl left" style="font-size:18px;"> <div style="padding-top:20px;line-height:26px;font-size:22px;"> 합계<div style="margin-top:5px;font-weight:bold;" id="total_price">0 원</div> </div> </div> <div class="fr" style="width:50%;"><button style="width:100%;" onclick="fn_size_submit();"><i class="fa fa-shopping-cart" aria-hidden="true" style="font-size:40px;display:inline-block;vertical-align:middle;margin-right:20px;"></i> 비교견적</button></div> </div> </div> <style> .bt_s_area > button { float:left; width:32%; height:35px;line-height:35px;font-size:15px; margin-right:2%; border:0px; display:inline-block; cursor:pointer; } .bt_s_area > button:last-child { width:32%;margin-right:0px; float:right; } .bt_s_area > button:focus { background:#5D9CEC;color:#fff; } .bt_s2_area button { height:60px;line-height:60px;font-size:15px;background:#5D9CEC;color:#fff; margin-right:2%; font-size:14px;border:0px; display:inline-block;cursor:pointer; border-radius:0px;} .bt_s2_area button:hover { background:#07399C;color:#fff; } .option_area select { width:100% !important; } .bt_s2_area_conf_area > div { width: calc(25% - 15px); background: #fff; padding: 10px 5px 10px 10px; float: left; } .bt_s2_area_conf_area > div button { width: 100%; height: 60px !important; line-height: 60px !immportant; background: #eee !important; color: #000; } </style> <div style="position:absolute;bottom:10px;left:10px;width:calc(100% - 20px);background:#fff;height:80px;" class="cba bt_s2_area bt_s2_area_conf_area"> <div class=""> <button style="" onclick="fn_size_remove_all();"><i class="fa fa-check-square-o" aria-hidden="true"></i> 선택 삭제</button> </div> <div class=""> <button style="" onclick="fn_size_esti_save();"><i class="fa fa-floppy-o"></i> 저장 하기</button> </div> <div class=""> <button style="" onclick="fn_size_esti_load();"><i class="fa fa-download" aria-hidden="true"></i> 불러 오기</button> </div> <div class=""> <button style="background:#ED5564 !important;color:#fff !important;border:1px solid #000;" onclick="fn_size_submit();"><i class="fa fa-krw" aria-hidden="true"></i> 비교 하기</button> </div> </div> </div> </div> </div> </div> </section>
