@charset "utf-8";

.blank{padding:30px}

/*장바구니*/
.orderTitle{display:none}
.order .Title{clear:both; position:relative;margin:20px 0 0px;}
.order .Title h3,.payment .paymentTitle h3{border-bottom:2px solid #AAACAE;padding-bottom:7px;}
.order .Title em{position: relative;float:right;font-size:100%; margin-top:-50px}


.order .item{font-size:16px;position: relative;}
.chkall{position: relative;padding:10px;background:#e5e5e5; margin:0}
.orderForm fieldset{background:#fafafa;font-size:97%;}
.cartinfo li{padding:0 8px 10px;border-bottom:1px solid rgba(0,0,0,0.1);background:#fff;margin-bottom:8px}
.cartname{position:relative;margin:0 0 10px;padding-top:8px;}
.cartname .title{overflow:hidden;min-height:1.3em;max-height: 2.6em;line-height:1.3em;font-size:113%;width:calc(100% - 36px);display:inline-block;vertical-align:top}
.cartname .del{display:inline-block;border:1px solid #ddd;text-transform:capitalize;font-size:70%;line-height:23px;padding:0 5px}
.cartproduct{overflow:hidden;}
.cartinfo .thumb{float:left;position:relative;width:80px;height:80px; margin-right:10px;}
.cartinfo .thumb:before{position:absolute;left:0; right:0;top:0; bottom:0; border:1px solid rgba(0,0,0,0.1)}
.cartinfo .thumb img{width:100%;vertical-align:top;}
.cartinfo dd{float:left;}
.cartinfo .option{font-size:80%;margin-top:5px;}
.cartinfo .option p{display:inline;opacity:.8;filter:alpha(opacity=80);}
.cartinfo .option .amount{opacity:1;filter:alpha(opacity=100);}
.cartinfo .option p + p:before{content:'/';display:inline;color:#aaa;margin-right:3px;}
.cartinfo .price{font-size:90%}
.cartinfo .price *{color:#111;}
.cartinfo .price strong{font-weight:600 !important;font-size:115%;padding-right:3ex;letter-spacing:-0.01em}
.cartinfo .price del{margin-right:10px;opacity:.7;filter:alpha(opacity=70);}
.cartinfo .price del strong,.cartinfo .price span{font-weight:normal !important;}
.cartinfo .price span{font-size:80%}

.cartinfo .util{float:none;padding:10px 0;position:absolute;right:0;top:-3px}
.cartinfo .util input{max-width:80%;margin-right:5px !important;}
.cartinfo .util .btnPack{display:block;margin:3px 0;height:auto;line-height:35px;font-size:90%}

.totalInfo {overflow:hidden;border:1px solid #ddd;margin-top:20px;}
.totalInfo dl {clear:none;float:left;width:28%;margin:25px 0;text-align:center; position:relative;}
.totalInfo dl:last-child{width:auto;float:none;overflow:hidden}
.totalInfo dl:after{width:25px;line-height:25px;top:50%; margin-top:-12px;right:0;display:inline-block;position:absolute;background:#B7B7B7; font-family:FontAwesomeS;border-radius:100%;color:#fff}
/*.orderInfo .totalInfo dl:nth-child(1):after{content:'\f068'}*/
.totalInfo dl:nth-child(1):after{content:'\f067'}
.totalInfo dl:nth-child(2):after{content:'\f52c'}
.totalInfo  dt {float:none;color: #222;padding:0;width:auto; margin-bottom:10px;font-size:110%}
.totalInfo  dt span{display:none;}
.totalInfo  dd {float:none;color:#666;padding:0;width:auto}
.totalInfo .info {width:auto;padding:0px;text-align:center;color:inherit;font-size:120%}
.totalInfo .info strong{letter-spacing:0;}
.totalInfo .info span{font-size:90%;padding-left:2px}

.totalInfo .point {display:none;}
.totalInfo dd .totalPrice {color: #e74100;font-size:120%;font-family:tahoma; letter-spacing:0}

.orderBtn{padding:10px 0;text-align:right}
/*주문서작성*/
.order.s02 .cartinfo li,.table_order th,.table_order td{border-bottom:1px solid rgba(0,0,0,0.15);}
.order.s02 .totalInfo{margin-top:-8px;border-width:0 0 2px;border-color:rgba(0,0,0,0.15)}


.orderSenderInfo {float:none;width:auto; margin-top:30px;}
.orderReceiverInfo {float:none;/*background-color:#efefef;*/width:auto;margin-top:30px;}
.orderReceiverInfo .small_gray{font-size:0; padding:0}

.table_order {width:100%;table-layout:fixed}
.table_order span {margin:0 2px;vertical-align:middle}
.table_order td label{vertical-align:middle;}
.table_order .opt {float:left;text-align:left;margin-right:3px;padding:0 3px;}
.table_order .opt:last-child{float:none;overflow:hidden;}
.table_order #zipcode_td .opt:first-child,.table_order #getZipcode_td .opt:first-child{width:65px;}

.table_order thead th {vertical-align:middle; width:auto}
.table_order thead th {border-bottom:1px solid #d2d2d2;white-space:nowrap; overflow:hidden; text-align:center; padding:7px 0}

.table_order thead th.first {background:none;border-bottom:2px solid #AAACAE;padding-bottom:5px;}
.table_order thead th.first *{text-align:left;padding:0;font-size:120%;font-weight:bold;}

.table_order th {text-align:left;/*width:85px;*/width:90px;}
.table_order th label {display:inline-block;padding:7px 7px 7px 10px;}
.table_order th label.required {padding-left:7px}
.table_order td {padding:7px;text-align:left;height:40px;vertical-align:middle}
.table_order td .pd{display:inline-block; padding:0 15px}
.table_order td em{margin-left:10px;}
.table_order td span:first-child{margin-left:0}
.table_order td .pd + em{margin-left:0}
.table_order td input[type=text]{height:30px !important;}
.table_order .price strong{font-size:150%;letter-spacing:-0.01em;vertical-align:middle;font-weight:500 !important}
.table_order .price span{font-weight:normal;font-size:0.65em;}
.table_order .price em,.table_order .price em *{font-size:1em;font-weight: inherit}
.table_order .btnPack{height:28px !important;line-height:28px;font-size:100%}
.table_order a.btnPack{height:30px !important;padding:0 10px}
.table_order td input[type=text]{display:inline-block;padding:0;width:100%;}
.table_order .address input[type=text]{width:49.7%;}
.table_order td input.amt{width:100px !important;display:inline-block;text-align: right;padding-right:5px;}

.table_order .zipcode input[type=text]{width:auto !important; display:inline-block}
.table_order #zipcode_td .opt input[type=text],.table_order #getZipcode_td .opt input[type=text],.table_order #getName_td .opt input[type=text]{width:100% !important}
.table_order textarea.delivery{height:80px;}
.table_order .coupon .opt{margin-top:7px;padding:5px;background:#f3f3f3;display:none;}
.table_order select{height:auto !important;min-height:30px !important;}
.table_order .tcolbg th,.table_order .tcolbg td{ background-color:rgba(255,255,255,0.9)}

.table_order .first {display:none}
.table_order th label {display:block;}
.table_order th label.required {padding-left:10px}

.order .btnArea{text-align:center;margin-top:30px}
.order .btnArea .btnPack{width:180px}

/*주문내역*/
.table_info {width:100%;table-layout:fixed;border-bottom: 1px solid #c2c2c2;}
.table_info span {margin:0 2px}
.table_info li.opt {float:left; padding:0 3px; text-align:left}
.table_info thead th {border-top:2px solid #555;border-bottom:1px solid rgba(0,0,0,0.1);white-space:nowrap; overflow:hidden; text-align:center; font-weight:normal;padding: 15px 0;width:auto}
.table_info thead th *{padding:0 !important;/*font-family:"Nanum Square";*/}
.table_info tbody th label {display:block; padding:7px 7px 7px 18px}
.table_info tbody th label.required {padding-left:7px}
.table_info tbody th,.table_info tbody td{border-top: 1px solid #eee;padding:5px;}
.table_info tbody td {text-align:center;vertical-align:middle}

.table_info tbody td.productImage {vertical-align:middle}
.table_info tbody td.productImage img{max-width:100%; border:1px solid rgba(0,0,0,0.1)}
.table_info tbody td.productInfo {vertical-align:top;text-align:left; padding-left:10px;}
.table_info tbody td.sideLine span{margin:1px 0}

.table_info tbody td.blank {border:0px; height:100px; color:#666; text-align:center}
.table_info tbody td p.subject{margin-bottom:10px !important;}
.table_info tbody td p.item {line-height:20px; margin-bottom:10px !important;}
.table_info tbody td p.itemSelect {padding-left:0px;}
.table_info tbody td p.right {font-size:14px;margin-right:10px !important;font-family:Tahoma;letter-spacing:0}
.table_info tbody td p.left{ margin-left:10px !important}
.table_info tbody td {overflow: hidden; clear: both; padding:10px 0}
.table_info tbody td .buyAmount {width:45px; height:30px;text-align:center;text-indent:0;border-color:rgba(0,0,0,0.2);margin-right:-1px !important; line-height:30px;}

.table_info button.btn{font-size:90%;line-height:21px;border:1px solid rgba(0,0,0,0.1);padding:0 5px;margin-top:3px; background:rgba(0,0,0,0.5); color:#fff}

.productInfo dt{float:left;width:60px;height:60px; margin-right:10px;border:1px solid rgba(0,0,0,0.2)}
.productInfo dt img{width:100%;height:auto}
.productInfo dd{overflow:hidden}
.productInfo dd p{color:rgba(0,0,0,0.7);}
.productInfo dd p + p{display:inline;}
.productInfo dd p + p:before{content:'/';display:inline;color:#aaa;margin-right:3px;}
.productInfo dd p span{margin:0}
.productInfo .price{margin-top:3px;}
.productInfo .price strong{font-weight:600 !important;font-size:110%}
.productInfo .price span{font-size:100%}

.table_info.s02 thead th{border-top:0;}
/* Payment */

#kcp_mask.kcpTransDiv{background:none !important}

.payBox{margin-bottom:40px;border:5px solid;padding:30px;text-align:center;position:relative;}
.payBox strong{font-family:"Nanum Square";font-size:170%;}

.paymentTitle h3 em{position:absolute;right:0;font-size:55%;bottom:5px;}
.paymentTitle h3{ margin-top:30px}

.payment .table_order td {border-bottom:1px solid #e6e6e6;text-align:left;height:40px;}
.payment .table_order td.ln{border-left:1px solid #e6e6e6;}
.payment .table_order .center td{text-align:center}
.payment .productInfo .price{font-size:100%;display:inline-block;}
.payment .productInfo .price + p{display:inline;}
.payment .productInfo dd .price + p:before{content:'/';display:inline;color:#aaa;margin-right:3px;}
.payment .totalPrice {color: #e74100; font-family:Arial Black; font-size:16px; line-height:0}
.payment .table_order td strong{font-weight:600 !important}

.paymentInfo {padding:20px 0; border:1px dashed #d2d2d2; background-color:#f4f4f4}
.paymentInfo dt {float: left; color: #222; padding:0 0 0 5px; font-weight:bold; color:#ff3300}
.paymentInfo dd {float: left; color:#666; padding:0 0 0 10px}
.paymentInfo dd.info {color:#666; padding:0 0 0 5px; text-align:right}
.paymentInfo dd.point {width:10px; padding-top:0; color:#666}

.payment .setInfo{font-size:95%; }
.payment .setInfo strong{font-size:1.2em; }
.payment .setInfo p{margin-bottom:2px !important;}
.payment .setInfo a{ margin-left:10px;}

.paymentTab {clear:both; position:relative; overflow:hidden;margin-top:30px}
.paymentTab img {vertical-align:middle}
.paymentTab ul.tabBox {position:relative;text-align:center;overflow:hidden;margin-bottom:-2px}
.paymentTab li.tab {position:relative;float:left;border:solid #999;border-width:1px 1px 0 1px;margin-right:-1px;}
.paymentTab li.tab p {}
.paymentTab li.tab p a {padding:15px 20px;display:block;font-size:120%;text-align:center;max-width:100%;}
.paymentTab li.on {position:relative;border-width:2px 2px 1px 2px;border-color:#000;background-color:#fff;border-bottom-color:#fff}
.paymentTab li.on p {}
.paymentTab li.on p a {font-weight:bold;}
.paymentTab .tabBody {clear:both;padding:15px;border:2px solid #000;overflow:hidden}
.paymentTab .btn{position:absolute; top:0; right:0}



.payment .pd10.center{margin-top:30px;}

@media only screen and (max-width:767px) {
	/*
	.table_info tbody td .buyAmount{margin-right:0 !important}
	.table_info .mileageInfo,.table_info .totalInfo{border-width:1px}
	*/
	.order.s02 .totalInfo{border-width:1px 2px 2px; padding:15px}
	.order .btnArea{}
	.order .btnArea .btnPack{width:48.5%;padding:0 !important;margin:0}
	.order .btnArea .btnPack:first-child{float:left;}
	.order .btnArea .btnPack:last-child{float:right;}
	
	.cartinfo .util{clear:both;position:static;padding-bottom:0}
	.cartinfo .util input{width:calc(32.33% - 16px)}
	.cartinfo .util .btnPack{display:inline-block;line-height:38px;width:32.33%}
	
	.table_order tbody td input[type=text]{width:100%}
	
	.orderInfo{margin:20px -1px 0;}
	.orderBtn{overflow:hidden;padding:10px 0 0;}
	.orderBtn .btnPack{width:49% !important;float:left;text-align:center;margin:0 0 7px}
	.orderBtn .btnPack:nth-child(2n){float:right}
	
	.paymentTab li.tab p {width:auto;}
	.paymentTab li.tab p a{font-size:105%;padding:15px;}
}

@media only screen and (max-width:550px) {
	.totalInfo{padding:20px}
	.totalInfo dl{float:none;width:auto;text-align:left;margin:5px; clear:both}
	.totalInfo dl:after{display:none}
	.totalInfo dl:last-child:before{content:'';display:block;background:rgba(0,0,0,0.1);height:1px;margin:10px 0 15px} 
	.totalInfo dt{float:left;font-weight:normal}
	.orderInfo .info{text-align:right}
	
	.totalInfo dl:nth-child(2) .info:before{content:'+ ';font-weight:bold;}
	
	.order .Title{margin:0;}
	.order .Title h3{display:none}
	.order .Title em{margin:0 0 5px}
	.table_order .address input[type=text]{width:100%}
	.table_order td input[type=text] + input[type=text]{margin-top:5px;}
	.table_order .mileage em{display:block;margin-top:5px;}
}