input {-webkit-appearance: none; appearance: none; background-color: var(--white);  border: 0;  border-radius: 0;  box-shadow: none;  outline: none;  padding: 0;  vertical-align: top;   cursor: pointer; font-family: 'Noto Sans KR', sans-serif;}	
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button{-webkit-appearance: none;margin: 0;}	
#sub{ width: 100%; min-width: 330px;}
#sub .cart{ width: 100%; padding:120px 20px 0px 20px; max-width: 1024px;margin:0 auto; color: #0b1424; font-size: 1.2rem;}
.cart-wrap{position: relative;	}
.cart-wrap .title > h2{color:#0b1424; font-size: 1.5rem; line-height: 2.5rem; font-weight: 700; position: relative; padding-bottom:35px; text-align: left; letter-spacing: -0.02em;}
.cart-wrap .title > h2 > span{margin-right: 5px; font-weight: normal; font-size: 1.25rem; border: 1px solid #0b1424; padding: 3px 15px; border-radius: 20px;}

.cart-wrap .cart_header{background-color:#f0f0f0; padding: 15px 20px 15px 18px;  display: flex;  flex-flow: nowrap;  justify-content: space-between;}
.cart-wrap .cart_header li{ }
.cart-wrap .cart_header li > button.btn_xs{padding:0px 15px; border-radius: 0; cursor: pointer}
.cart-wrap .cart_header li > button.btn_xs > span.text{font-size: .9rem; color: #666666;}	
.cart-wrap .cart_info.mt30{margin-top: 30px;}
.cart-wrap .cart_info ul.cart_list{display: flex; flex-flow: column;}
.cart-wrap .cart_info ul.cart_list > li{display: flex; flex-flow:nowrap; box-sizing: border-box; border-bottom:1px solid #e1e1e1; padding:1.5rem 1rem; }
.cart-wrap .cart_info ul.cart_list > li > div.total{width:200px; border-left:1px dashed #e1e1e1;position: relative; font-size: 1.1rem; font-weight:500;}
.cart-wrap .cart_info ul.cart_list > li > div.total > span{position: absolute;  width:100%; text-align: center; top:45%; left: 50%;  transform: translate(-50%, 0)}
.cart-wrap .cart_info ul.cart_list > li:last-child{border-bottom: 0px;}
.cart-wrap .cart_info ul.cart_list > li.empty{display:block; text-align: center; padding: 3.5rem .5rem;}

.bookInfo{display: flex; flex-wrap: wrap; flex-flow:nowrap; width: 100%}
.bookInfo .prod{position: relative; display: flex; flex-flow: column; width: 100%; column-gap:7px; padding-bottom:15px; font-size: 1.1rem; line-height: 140%; box-sizing: border-box;}
.bookInfo .prod_area{width: 100%; display: flex; flex-flow:nowrap;}
.bookInfo .prod_area .prod_title{width:calc(100% - 90px); box-sizing: border-box; margin-left:17px;}
.bookInfo .prod_area .prod_title > span.tit{margin-bottom: 15px;}
.bookInfo .prod_area .prod_thumb, .bookInfo .prod_area .prod_thumb > img{width: 75px;}

/*cartStep2*/
.bookInfo .prod .cart_thumb > .prod_thumb > img{width: 65px;}
.bookInfo .prod .cart_thumb > .prod_price{}
.bookInfo .prod .cart_thumb > .prod_title > .prod_price > .price > span.color{margin-right: 7px;}
.bookInfo .prod .cart_thumb{line-height: 120%;}

.bookInfo .prod .prod_price{padding-top: 15px;}
.bookInfo .prod .prod_price .price{font-size: 1.1rem; font-weight:500;}
.bookInfo .prod .prod_price .price > span.line{font-size: 1rem; color:#a7aaaf; font-weight:400; text-decoration: line-through; margin-right:10px;}
.bookInfo .prod .prod_price .price > span.color{color: #004ea2; font-size: 1rem; font-weight:500; letter-spacing: -.04rem}
.bookInfo .prod .prod_price .price > span.quantity{margin-left:15px; position: relative}
.bookInfo .prod .prod_price .price > span.quantity::before{content: ''; position: absolute; width: 1px; height:70%; background-color:#0b1424; left:-10px; bottom: 15%}

.cart-wrap .cart_info ul.list_line{border-top:1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; margin-top:20px;}
.cart-wrap .cart_info ul.list_line > li{display: flex; flex-flow:nowrap; box-sizing: border-box; border-bottom:1px solid #e1e1e1; padding:1rem 1rem; }
.cart-wrap .cart_info ul.list_line > li > div.bookInfo > div.prod{ padding-bottom: 0px;}

.cart-wrap .cart_total{display: flex; flex-flow: column; border-top: 1px solid #40485b; border-bottom: 1px solid #40485b;background:#ebf1f8; padding: 25px 20px 25px 18px;}
.cart-wrap .cart_total li{width: 100%; display: block; border-top: 0px;}
.cart-wrap .cart_total li dl {display: flex; width: 100%;  box-sizing: border-box; margin:10px 0;}
.cart-wrap .cart_total li dl dt {display: flex; align-items: center; width: 60%; justify-content: flex-start;  font-size: 1rem;}
.cart-wrap .cart_total li dl dd{display: flex; justify-content: flex-end;align-items: center; width: 40%;  height: auto;  border-bottom: 0px;}
.cart-wrap .cart_total li dl dd strong {display: inline-block; width: auto; min-width: 44rem; font-weight: 700; font-size: 1.1rem; text-align: right;}
.cart-wrap .cart_total li dl.result { margin-top: 20px;}
.cart-wrap .cart_total li dl dt strong {font-weight: 700; font-size: 1.2rem;}
.cart-wrap .cart_total li dl.result dd strong {font-size: 1.3rem;}
.cart-wrap .cart_total li dl dd .point {color:#f10039;}

.cart-wrap  div.cart_btn_area{width:100%; display: flex; flex-wrap: wrap; column-gap: 5px;  justify-content: center; margin:25px 0 70px;}
.cart-wrap .cart_btn_area > button{width: 35%;  min-height:51px; background-color: rgba(0, 0, 0, 0.3); box-sizing: border-box; color: #FFF; letter-spacing: -.01rem; font-size:  1.1rem; cursor: pointer}
.cart-wrap .cart_btn_area > button:last-child{min-width:calc(33.3% - 5px);  background-color: #005dc1;}




/* check */
.form_chk {display: block; position: relative; margin-right:10px; min-height: 22px; vertical-align: top;}
.form_chk input {position: absolute;	width: 1px;	height: 1px;	padding: 0;	margin: -1px;	overflow: hidden; border: 0;}
.form_chk input + label {display: inline-block;	position: relative;	padding: 2px 0 0 30px;	font-size: 1rem; 	letter-spacing: -0.01em;	line-height: 20px;	color:#0b1424;	cursor: pointer;	vertical-align: top;	transition: color 0.2s ease-out;	}
.form_chk input + label:before, .form_chk input + label:after {	content: "";	display: inline-block;	position: absolute;	left: 0;	top: 0;	width: 22px;	height: 22px;	text-align: center;	border-radius:2px;
	box-sizing: border-box; }

.form_chk input:checked + label:before {background-color: #004ea2;	border-color: #004ea2;}
.form_chk.no_label {width: 22px;	height: 22px;	min-height: auto;}
.form_chk.no_label input + label {position: static;	padding-left: 0;	font-size: 0;}
.form_chk input + label:before {background-color: #fff;	border: 1px solid #ccc;	transition: border-color 0.2s ease-out, background-color 0.2s ease-out;}
.form_chk input + label:after {background-position: center 8px;	background-repeat: no-repeat;	background-size: 10px 7px;	background-image: url("../images/ico_checkbox@2x.png");}
.form_chk input:checked + label:after {	background-size: 10px 7px;	background-image: url("../images/ico_checkbox_active@2x.png");}

.law-chk{padding: 15px 10px; box-sizing: border-box; width: 100%; background-color:#e7e7e7;  font-size: 1rem; text-align: center;}

/* 수량 */
.form_quantity_wrap{ margin-top: 10px;}
.form_quantity_wrap .quantity_box{display: flex; flex-wrap: nowrap; border: 1px solid #ccc; border-radius:5px; overflow: hidden; height: 30px; width:130px;}
.form_quantity_wrap .quantity_box li{width: 33%; display: flex; justify-content: space-between; border-bottom:none;}
.form_quantity_wrap .quantity_box li > input{font-size: 1rem; width: 100%; text-align: center}
.form_quantity_wrap .quantity_box li > button{width: 100%; cursor: pointer;}
.form_quantity_wrap .quantity_box li > button > span{display: inline-block;   position: relative;  text-indent: -99999px;  overflow: hidden;  background-repeat: no-repeat;}
.form_quantity_wrap .quantity_box li > button.down > span{width: 13px; height: 13px;  background-size: 13px 13px;  background-image: url(../images/ico_spinner_down_sm@2x.png);}
.form_quantity_wrap .quantity_box li > button.up > span{width: 13px; height: 13px;  background-size: 13px 13px; background-image:url("../images/ico_spinner_up_sm@2x.png")}


.law-wrap{padding:30px 0 15px;}
.law_contents_box {border: 1px solid #e1e1e1; background: #fafafa; margin-top: 10px;  padding: 10px;  display: block;  height: 230px;  overflow-y: scroll;}
.law_contents_box .section_w{font-size: .95rem; line-height: 120%}
.law_contents_box .section_w > h4{font-weight: 600; font-size: 1rem}
.law_contents_box .section_w p{padding-left:7px; margin-bottom:10px; color: #444a57;}
.law_contents_box .section_w ol{padding-left:20px; margin-bottom: 20px; color: #444a57;}
.law_contents_box .section_w ol li{padding-bottom: 7px; color: #444a57;}

.addressform{ margin-top:30px; }	
.addressform .title > h2{ font-size: 1.2rem; }
.addressform .title > h2.pb0{padding-bottom: 0px;}
.cart-wrap .title > h2 > span{ font-size: 1.05rem; padding: 2px 12px; margin-right: 3px;}
.label_important {font-weight: 600; color:#f10039; font-size: 13px; padding-left: 2px;  vertical-align: 2px;}
.addressform .Customer_input{padding-bottom: 1rem; display: flex;  align-items: center}	
.addressform .Customer_input .set{width: 80%;}
.addressform .Customer_input label{width: 20%; font-weight:500; font-size:1rem; margin-right: 5px; display: block;} 
.addressform .Customer_input label strong{font-weight: 400; font-size: .9rem}
.addressform p{font-size: 1rem; color: #004ea2; padding: 10px 0; font-weight:400;}
.addressform .Customer_input input{font-size:0.9rem;padding:5px 7px; margin-bottom: 3px; border: 1px solid #e1e1e1;  font-family: Noto Sans KR, sans-serif;  margin-top: 8px;  width:100%;  box-sizing: border-box;}
.addressform .Customer_input span{ margin-bottom: 0.1rem;} 	
.addressform .Customer_input input.confirm{width: calc(100% - 5.5rem);}
.addressform .Customer_input .set.n3 > input{width:calc(33.3% - 5px); margin-right:5px;}
span.Error {font-size:0.8rem; display: block; padding-left: 0px;  color:#f10039;  margin-top: 2px;  margin-left: 0px;    text-align: left;}	
.addressform .Customer_input .set textarea{width: 100%; border:1px solid #e1e1e1;   resize:vertical;  box-sizing: border-box;   height:40px;   font-size: 0.9rem;    padding:8px 7px;}

/* 국가 선택박스 */
.Customer_input .set .sort_wrap { z-index:22; width:350px;   box-sizing: border-box; background-color:#fafafa; position: relative}
.Customer_input .set .sort_wrap button.sort_btn {position: relative; text-align: left; box-sizing: border-box;  padding:0px 10px 0px; font-size: 1rem; letter-spacing:0.03em; color: #101c33;  width: 100%; height: 35px;  line-height: 35px; border: 1px solid #e1e1e1; cursor: pointer; }
.Customer_input .set .sort_wrap button.sort_btn:after {content: "";  display: block;   position: absolute;   right:10px;   top: 50%;  margin-left: 10px;   margin-top: -3px;   width:16px;   height: 9px;   background: url("../images/ico_main_sort.png") no-repeat right center/cover;}

.Customer_input .set .sort_wrap .option{position: absolute;background: #fff; border: 1px solid #dddfe1; border-top: 0px; top:100%; left: 0; overflow-x: hidden; overflow-y: overlay; z-index: 10; width: 100%; max-width: 350px; max-height: 200px;}
.option .option_list .option-item {cursor: pointer; overflow: hidden; text-overflow: ellipsis; font-size: .9rem; height: 36px;  line-height: 36px;  padding: 0 10px; width: 100%;   -webkit-box-sizing: border-box;   box-sizing: border-box; text-align: left; white-space: nowrap; }
.option .option_list .option-item:hover {background: #d9e7f6;   color: #000; }


.Customer_input .set .sort_wrap > select{background: #fff; border: 1px solid #dddfe1; width: 100%; padding: 5px 7px; font-size: .9rem; height: 36px; }


/* 주문완료*/
.complete-order > h3{position: relative; text-align: center; color:#0b1424; font-size: 1.5rem; font-weight: 700; position: relative; padding:80px 15px 35px; letter-spacing: -0.02em;}
.complete-order > h3::before{content: ''; position: absolute; width: 70px; height: 60px; transform: translate(-50%, 0); left: 50%; top: 5px; background: url("../images/ico_box.png") no-repeat; background-size: 70px 60px;}
.complete-order_guide{width: 100%; background-color:#f0f0f0; text-align: center; padding: 15px 5px; line-height: 150% }
.complete-order_info{padding-top:10px; }
.complete-order_info .box_info{border-bottom: 1px solid #e1e1e1; margin:20px 0px;}
.complete-order_info .box_info .box_detail{display: flex; flex-wrap: wrap;  margin: 15px 0; }
.complete-order_info .box_info .box_detail dt {width:25%; margin-right: 3%; font-size:1.05rem; line-height:150%; font-weight:500;}
.complete-order_info .box_info .box_detail dd { width:72%; font-size:1rem; color: #444a57; font-weight:400; line-height: 140%; -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -ms-flex-direction: column;   flex-direction: column;}
.complete-order_info .box_info .box_detail dt strong{font-weight: 400; font-size: .9rem}
.order-items{width: 100%; display: block; padding-bottom:7px; }
.order-number{color: #004ea2; font-weight:600; font-size:1.1rem;}
.order-Name{font-weight:600; font-size:1.1rem;}



@media screen and (max-width: 640px){
	#sub .cart{font-size: 1rem;  padding: 120px 15px 0px 15px; }
	.cart-wrap .title > h2{ font-size: 1.2rem; padding-bottom:15px; }
	.cart-wrap .cart_header{padding:1rem .5rem; }
	.cart-wrap .cart_info ul.cart_list > li{padding:1.5rem 0 1.5rem .5rem; }
	.bookInfo{column-gap: 5px;}
	.bookInfo .prod_area .prod_thumb{position: absolute; bottom:10px;}
	.bookInfo .prod_area .prod_thumb, .bookInfo .prod_area .prod_thumb > img{width:60px;}
	.bookInfo .prod_area .prod_title{width:100%; margin-left: 0;}
	.bookInfo .prod_area .prod_title .tit{font-size: 1rem; letter-spacing: -.02rem; }
	.bookInfo .prod .prod_price{width:calc(100% - 70px); margin-left:70px; display: block;}
	.bookInfo .prod .prod_price .price, .bookInfo .prod .prod_price .price > span.line, .bookInfo .prod .prod_price .price > span.color {font-size: .92rem; letter-spacing: -.05rem}
	.bookInfo .prod .prod_price .price > span.line{margin-right: 5px;}
	.bookInfo .prod .cart_thumb > .prod_title{margin-left: 10px;}
	.bookInfo .prod .cart_thumb > .prod_thumb{position: relative; bottom:1px}
	.bookInfo .prod .cart_thumb > .prod_thumb > img{width: 55px;}
	.bookInfo .prod .cart_thumb > .prod_title > .prod_price{ margin-left:0px; width: 100%; padding-top: 10px;}
	.cart-wrap .cart_info ul.cart_list > li {flex-flow: column;}
	.cart-wrap .cart_info ul.cart_list > li > div.total { width: 100%;font-size:1.05rem; font-weight: bold; letter-spacing: -.02rem; text-align: right; padding-right: .5rem; border-left:0px;}
	.cart-wrap .cart_info ul.cart_list > li > div.total > span{position: relative; left: inherit}
	.cart-wrap .cart_info ul.list_line > li{padding:1rem 1rem; }
	.cart-wrap .cart_info ul.list_line > li > div.bookInfo > div.prod{ padding-bottom:10px;}
	.quantity{ position: relative; height: 28px; margin: 10px 0 20px}
	.form_quantity_wrap .quantity_box{position: absolute; top: 0}
	.form_quantity_wrap .quantity_box li > input{font-size: .9rem;}
	.cart-wrap .cart_total {padding:1.2rem .5rem;  letter-spacing: -.015rem;}
	.cart-wrap .cart_total li dl { margin: 5px 0}
	.cart-wrap .cart_total li dl dt {font-size:.95rem;}
	.cart-wrap .cart_total li dl dd strong { font-size: 1rem;}
	.cart-wrap .cart_total li dl dt strong {font-weight: 700; font-size: 1.05rem;}
	.cart-wrap .cart_total li dl.result dd strong {font-size: 1.15rem;}
	.cart-wrap div.cart_btn_area {flex-flow: column; justify-content: center; align-items: center}
	.cart-wrap .cart_btn_area > button{width: 80%; margin-bottom:10px; font-size:  0.95rem; }
	.law_contents_box .section_w{font-size: .9rem; line-height: 115%}
	.law_contents_box .section_w > h4{font-size: .95rem}
	.addressform .title > h2{ font-size: 1.15rem; }
	.cart-wrap .title > h2 > span{ font-size: 1rem;} 
	.addressform .title > h2.pb0{padding-bottom: 10px;}
	.addressform p{font-size: .9rem;}
	.addressform .Customer_input{flex-flow: column; justify-content: flex-start; width: 99%; margin:0 auto}
	.addressform .Customer_input .set{width: 100%;}
	.addressform .Customer_input label{width:calc(100% - 1px); padding-left: 1px; font-size:.95rem;}
	.addressform .Customer_input label br{display: none}
	.Customer_input .set .sort_wrap, .addressform .Customer_input .set textarea{ margin-top: 5px;}
	.Customer_input .set .sort_wrap {width:100%;}
	.Customer_input .set .sort_wrap button.sort_btn { font-size:.9rem;}
	.cart-wrap .cart_info.mt30{margin-top:10px;}
	.complete-order > h3 {font-size:1.3rem; padding: 60px 15px 25px}
	.complete-order > h3::before{width:50px; height:43px; background-size: 50px 43px;}
	.complete-order_guide{font-size:1rem;}
	.complete-order_info .box_info .box_detail{justify-content: center; align-items: center; }
	.complete-order_info .box_info .box_detail dt, .order-number, .order-Name {font-size:.9rem;}
	.complete-order_info .box_info .box_detail dt{width: 45%; margin-right: 0; min-width: auto;}
	.complete-order_info .box_info .box_detail dd {width:55%; min-width: auto; text-align: right; font-size:.9rem;}
	.complete-order_info .box_info > .left_sort{display: flex; flex-flow: column;  margin: 15px 0; }
	.complete-order_info .box_info > .left_sort > dt{width: 100%;  text-align:left; padding-bottom: 10px;}
	.complete-order_info .box_info > .left_sort > dd {width: 100%; text-align:right}
}
@media screen and (max-width:480px){
	.cart-wrap .cart_btn_area > button{font-size:  0.9rem; }
	.complete-order_guide{font-size:.95rem;}
	.complete-order_info .box_info .box_detail dt, .complete-order_info .box_info .box_detail dd, .order-number, .order-Name {font-size:.85rem;}
	.complete-order > h3{padding: 50px 15px 22px}
	.complete-order > h3::before{width:38px; height:33px; background-size: 38px 33px;}
	.law-chk > span.form_chk input + label{font-size: .9rem;  text-align: left}
}
@media screen and (max-width: 350px){
	.bookInfo .prod .prod_price{width:calc(100% - 65px); margin-left:65px;}
	.bookInfo .prod_area .prod_thumb, .bookInfo .prod_area .prod_thumb > img{width:56px;}
	.bookInfo .prod .prod_price .price, .bookInfo .prod .prod_price .price > span.line, .bookInfo .prod .prod_price .price > span.color {font-size: .89rem; letter-spacing: -.07rem}
	.law-chk > span.form_chk input + label {font-size: .85rem;}
}
