/* 외부연결시 */

#order_box { padding-top:0px; padding-bottom:20px; width:100%; max-width:1220px; margin:0 auto;}
#order_box:after{content:""; clear:both; display:block; }

#order_box .order_title	{ display:flex; justify-content:space-between; flex-wrap:nowrap;align-items:center; height:75px; width:100%; }
#order_box .order_title div:nth-child(1)	{ width:50%; font-size: 22px; font-weight: 600; }
#order_box .order_title div:nth-child(2)	{ text-align:right; width:50%;  font-weight: 400;}

#order_box .tbl_box {width:100%;  height:100%;  display:flex; justify-content:space-between; align-items:stretch; flex-wrap:wrap; }

#order_box .tbl0 { width:34%; max-width:410px; padding-right:20px; }
#order_box .tbl1 { width:66%;  height:100%; display:flex; justify-content:space-between; align-items:stretch; flex-wrap:wrap;  }

#order_box .tbl1 .td1 { width:68%; padding:0 20px;  min-height:600px;  height:100%;}
#order_box .tbl1 .td1.short { min-height:505px; }
#order_box .tbl1 .td2 { width:32%; padding:20px; border:1px solid #d6d6d6; border-radius:8px; flex-grow:1; }

#order_box #opt_img {aspect-ratio:0.76;  width:100%; border:1px solid #d6d6d6; background-color: #fff !important; background-size:contain  !important;   background-position: center center !important;  background-repeat: no-repeat !important;}


#order_box .row1 { position:relative;  padding:0 0 10px 0; }
#order_box .tit1 { display:inline-block; width:15%; padding-top:8px;  font-weight: 600; font-size: 16px; vertical-align: top}
#order_box .txt1 { display:inline-block; width:83%; padding:2px 0 2px 0px;  font-size: 15px;  font-weight: 400;}
/*
#order_box .txt1 .underline {border-bottom:1px solid #aaa;  padding:0 3px 0px 3px; margin: 5px 0 15px 0px;  font-size: 14px;  font-weight: 400; display:inline-block;}
#order_box .txt1 .underline > input { margin-bottom:0px; padding:2px; background-color: #eef2ff; border:none; margin-top:-3px; width:65px; display:none;  height:21px;}
#order_box .txt1 .underline > input:disabled {background-color: #efefef; color:#999}
#order_box .txt1 .underline > select { margin-bottom:0px; padding:2px !important;  height:21px; border:none; margin-top:-3px;width:65px; display:none;  background-color: #eef2ff !important;}
*/


#order_box .tit2 { display:inline-block; width:70px; padding-top:5px;  }
#order_box .txt1 .unit {display:inline-block; font-size:11px;}
#order_box .txt1 .col1 {display:inline-block;}

#order_box input[type=text] {padding:6px; text-align: center;  font-size: 14px; margin:0px;  outline:0;    -webkit-appearance: none;  -webkit-border-radius: 0;}
#order_box select { border:1px solid #ccc;  margin:0px;height:35px; padding:0px 0 0 5px; border:1px solid #d6d6d6;  width:210px;  outline:0;  -webkit-border-radius: 0; }
#order_box select::-ms-expand {display: none;}


#order_box input[type=checkbox] {padding:0px; }
#order_box option {padding:5px; }

#order_box .qnt:enabled { background-color: #fff;  color:#222; }
#order_box .qnt:disabled { background-color: #efefef; color:#333; }


/*포맥스매대*/
.opt_hidden_box {display:none;  vertical-align:top;}
.opt8_1_group {display:inline-block; border:0px solid red; text-align:center; padding:2px; margin-top:5px; margin-right:3px; background-color:#efefef; font-size:12px;}
.opt8_1_group input[type=text] { font-size:11px !important; padding:3px !important; color:blue; }

.size_xsm {width:35px; }

.underline {font-size:13px; margin-top:7px;}
.underline .size_sm {width:50px; padding:0px 2px !important;  border-top:none !important; border-left:none !important; border-right:none !important;  border-bottom:1px solid #ddd; } 

#order_box .tit3 { display:inline-block; width:50px; background-color: #efefef;} 
#order_box .size1 { width:15%;}
#order_box .qnt1 { width:50px;}

#order_box #opt_design_sel {width:120px;}
#order_box #qnt {width:120px;}

#order_box #size_sel {width:258px; background-color: #f9edd0 !important;}
#order_box #size_sel1 {width:150px; background-color: #f9edd0 !important;}

#order_box .input_radio { display: inline-block; position: relative; padding:0px 5px 0 0; -webkit-user-select: none;    -moz-user-select: none;    -ms-user-select: none;   user-select: none; }
#order_box .input_radio input { position: absolute; opacity: 0; }
#order_box .input_radio .checkmark { font-size: 14px;  font-weight: 400; padding:0px 2px; text-align:center; width:60px; height:35px; line-height:35px; border-radius: 0px; cursor: pointer;	border:1px solid #d6d6d6;  display:inline-block; vertical-align:middle;}
#order_box .input_radio .checkmark:hover { background-color: #4285F4; color:#fff; 	border:1px solid #4285F4; }
#order_box .input_radio input:checked ~ .checkmark { background-color: #4285F4; color:#fff; 	border:1px solid #4285F4; }


#order_box .price_txt1 { padding:0px 0 5px 0; margin:0px 0 0 0; }
#order_box .price_txt1:after{content:""; clear:both; display:block; }
#order_box .price_txt1 .left { display:inline-block; float:left;  font-size: 15px; font-weight: 600;}
#order_box .price_txt1 .right { display:inline-block; float:right;font-size: 15px; font-weight: 400;}
#order_box .price_txt1 .red {color:#ff0000!important;}
#order_box .price_input {width:100px; text-align:right !important; padding:3px; height:24px!important;;}
#order_box .price_input:enabled { background-color: #fff;  color:#0066ff;font-size: 16px; }
#order_box .price_input:disabled { background-color: #fff; color:#222;font-size: 15px;  border:0px dotted red;  }

#order_box .price_txt2 { padding:0px 0 5px 0; margin:0px 0 0 0; color:#999;font-size: 14px; font-weight: 400;}
#order_box .price_txt2:after{content:""; clear:both; display:block; }
#order_box .price_txt2 .left { display:inline-block; float:left; width:60%; text-align:left;}
#order_box .price_txt2 .right { display:inline-block; float:right; width:40%; text-align:right;}

#order_box .price_txt3 { padding:10px 0 0px 0; margin:0px 0 0 0;  font-size: 15px; font-weight: 600; border-top:1px solid #aaa;}
#order_box .price_txt3:after{content:""; clear:both; display:block; }
#order_box .price_txt3 .left { display:inline-block; float:left; width:35%; padding-top:5px; }
#order_box .price_txt3 .right { display:inline-block; float:right; width:65%;  color:#f62801; font-size:25px;font-weight: 600; letter-spacing:-1px; text-align:right; }


/* 자동상품 견적문의 버튼 */
#order_box .goods_btn_ask { display:inline-block; padding:5px 10px; background-color:#343434; color:#fff; cursor:pointer; border-radius:8px;}


/*
#soldout_mask {position:fixed;  width:100%; height:100%; padding:20% 5%; background:#aaa; opacity:0.7; z-index:100; text-align:center; }
#soldout_txt { font-size: 5.0em; font-weight: bold; position:fixed; top:20%; left:50%; width:300px; margin:0px 0 0 -150px; z-index:101; text-align:center;}
*/


/* 팝업창 마스크(공통사용-API용) */
#popup_mask_api { display:none; position:fixed ; z-index:100;  left:0; right:0; top:0; bottom:0; width:100%; height:100%; background-color: #222; opacity:0.5;  }

.popup_api {position: fixed; display:none;  margin: 0 auto;  z-index:101; cursor:pointer;  top:50%; left:50%; transform: translate(-50%, -50%); width:580px;  padding:0px 0px; background-color: #fff;  text-align:center; color:#000;}
.popup_api img {width:100%;}
.popup_bottom {background-color: #2b2736; padding:5px 10px; color:#fff;}	/*팝업하단*/

#popup_api_55 {  }
#popup_api_55 .txt_box {text-align:center; font-size:13px; line-height:1.7em; border-bottom:1px solid #444; padding:20px;}
#popup_api_55 .txt_box:nth-child(4) {border-bottom:none;}
#popup_api_55 .txt_box .pop_tit1 { font-weight:600; font-size:17px; padding:5px 0;}
#popup_api_55 .txt_box .pop_tit1 span {font-size:13px;font-weight:400; }
#popup_api_55 .txt_box .email {color:#0033ff;  font-weight:600;}


.btn_opt_more {display:inline-block; width:35px; height:35px; margin:0 10px 0 0;  background-color: #efefef; background-size:auto;  background-image: url(/images/svg/opt_more.svg?t=1); background-repeat: no-repeat; background-position: center center;vertical-align:middle; cursor: pointer;	}
/*옵션 팝업*/
#opt_view_box { padding:0px; position:fixed; top:50%; left:50%; transform: translate(-50%, -50%); width:95%; max-width:400px; border:0px solid red;  z-index:100; overflow-y: auto; text-align:left;}
#opt_view_box .btn_zone { position:absolute; top:10px; right:10px; height:30px; border:0px solid green;}
#opt_view_box .btn_zone .btn_close {width:15px;  cursor:pointer;}
#opt_view_box img {width:100%;}


@media screen and (max-width: 1219px) {
	#order_box .tbl0 {width:28%;}
	#order_box .tbl1 {width:70%;}

}

@media screen and (max-width: 1000px) {

	#order_box .tbl1 .td1 {width:100%;  border-right:1px solid #d6d6d6; border-bottom:none;  min-height:inherit;}
	#order_box .tbl1 .td2 {width:100%; }

	#order_box #opt_img_new {aspect-ratio:1; }

	#order_box #opt_design_sel {width:100px;}
	#order_box #qnt {width:40px;}
}


@media screen and (max-width: 800px) {
	#order_box .order_title div:nth-child(1) {width:100%; font-size:20px; padding-left:15px;}
	#order_box .order_title div:nth-child(2) {display:none;}

	#order_box .tbl0 {width:100%; max-width:none; padding-right:0px; margin:0 auto;}
	#order_box .tbl1 {width:calc( 100% - 0px); margin:0 auto;}

	#order_box #opt_img_new {width:100%;}

	#order_box .tbl1 .td1 {padding:10px;}
	#order_box .tbl1 .td2 {padding:10px;}
	#order_box .tit1 { width:17%; padding-top:8px; font-size: 14px;}
	#order_box .txt1 { width:80%; font-size: 12px; }
	#order_box .tit2 { width:50px; }

	#order_box .txt1 .underline > input { width:60px;}
	#order_box .txt1 .underline > select { width:60px;}

	#order_box select {  width:130px; }

	#order_box .price_txt1 .left  {font-size: 14px;}
	#order_box .price_txt1 .right {font-size: 14px;}

	/*#order_box .input_radio .checkmark {width:90px; letter-spacing: -1px; }*/

	#order_box .size1 { width:15%;}

	#order_box .txt1 .col1 {display:inline-block; width:90%;}

}







/*디자인신청시 제목(임시)*/
#order_box .sub_tit_box_design { display:none}