@charset "UTF-8";

/*** CSS Style 사용자 전용                                                    ***/
/*** 디자인통에서 제공하는 스킨 패치시 임의 파일에 기술한 내용은 삭제 되며,     ***/
/*** 해당 문서의 내용은 삭제 되지 않습니다.                                    ***/




/** 타이틀 공통 **/
.mobile .order_wrap .order_tit { padding-top: 10px; }
.mobile .order_wrap .order_tit ol { padding-bottom: 5px; }


/** 장바구니 **/
.cart_cont { display: flex; justify-content: space-between; align-items: flex-start; }
.cart_cont .left { width: 70%; margin-top: 50px; }
.cart_cont .left #cartDashBoard { display: inline-block; position: relative; width: calc(100% - 60px); background-color: #f5f5f5; border-radius: 10px; margin-bottom: 50px; padding: 30px 30px 76px 30px; }
.cart_cont .left #cartDashBoard .title { font-size: 20px; font-weight: 500; }
.cart_cont .left #cartDashBoard .title strong { color: #0068b3; font-weight: 700; }
.cart_cont .left #cartDashBoard .targetPrice { font-size: 16px; font-weight: 400; }
.cart_cont .left #cartDashBoard #progressBar { position: relative; width: calc(100% - 250px); height: 8px; border-radius: 4px; background-color: #ddd; margin-top: 20px; }
.cart_cont .left #cartDashBoard #progressBar .fill { position: absolute; left: 0; top: 0; width: 0; height: 8px; border-radius: 4px; background-color: #0068b3; transition-duration: 0.5s; }
.cart_cont .left #cartDashBoard #progressBar .fill .bubble { display: inline-block; position: absolute; top: 20px; right: 0; transform: translate(calc(100% - 20px), 0); padding: 5px 15px; border-radius: 5px; font-size: 16px; white-space: nowrap; background-color: #0068b3; color: #fff; }
.cart_cont .left #cartDashBoard #progressBar .fill .bubble::after { content: ''; display: block; position: absolute; left: 13px; top: -12px; border: 6px solid transparent; border-bottom-color: #0068b3; }
.cart_cont .left #cartDashBoard #progressBar .fill .bubble span { color: yellow; font-weight: 700; }
.cart_cont .left #cartDashBoard #progressBar .fill .bubble.right-arrow { transform: translate(calc(0% + 20px), 0); }
.cart_cont .left #cartDashBoard #progressBar .fill .bubble.right-arrow::after { left: auto; right: 15px; }
.cart_cont .left #cartDashBoard .button { position: absolute; right: 30px; top: 50%; transform: translate(0, -50%); font-size: 18px; font-weight: 500; background-color: #fff; border: solid 1px #0068b3; border-radius: 5px; padding: 10px 20px; }
.cart_cont .left .buttons { float: right; margin-bottom: 5px; }
.cart_cont .left .buttons button { border-radius: 5px; }
.cart_cont .left .cart_cont_list { display: inline-block; width: 100%; margin: 0 0 10px 0; }
.cart_cont .left .cart_cont_list .order_cart_tit {  }
.cart_cont .left #cartBanner { margin: 50px 0; }
.cart_cont .left #cartBanner ul li em { display: none; }
.cart_cont .right { width: calc(30% - 110px); margin-top: 89px; padding: 30px; border: solid 1px #d6d6d6; border-radius: 10px; }
.cart_cont .right .price_sum { margin: 0; padding: 0; border: none; }
.cart_cont .right .price_sum .price_sum_cont { display: block; float: none; }
.cart_cont .right .price_sum .price_sum_cont .price_sum_list { display: flex; flex-direction: column; }
.cart_cont .right .price_sum .price_sum_cont .price_sum_list span { display: none; }
.cart_cont .right .price_sum .price_sum_cont .price_sum_list dl { display: flex; justify-content: space-between; align-items: center; padding: 0; margin: 5px 0; }
.cart_cont .right .price_sum .price_sum_cont .price_sum_list dl dd { font-size: 14px; }
.cart_cont .right .price_sum .price_sum_cont .price_sum_list dl dd strong { font-size: 20px; }
.cart_cont .right .price_sum .price_sum_cont .price_sum_list dl.price_total { margin-top: 10px; padding-top: 10px; border-top: solid 1px #d6d6d6; }
.cart_cont .right .price_sum .price_sum_cont .price_sum_list dl.mileage-total {margin-top: 10px; padding-top: 10px; border-top: solid 1px #d6d6d6;}
.cart_cont .right .price_sum .price_sum_cont .price_sum_list dl.price_total dd strong { font-size: 24px; }
.cart_cont .right .btn_order_box .btn_right_box { display: flex; justify-content: space-between; align-items: center; float: none; }
.cart_cont .right .btn_order_box .btn_right_box button { border-radius: 5px; min-width: inherit; width: calc(50% - 3px); font-size: 16px; }
.cart_cont .right .btn_order_box .btn_right_box button.btn_order_whole_buy { background-color: #0068b3 !important; border-color: #0068b3 !important; }

.mobile .cart_cont { flex-direction: column; }
.mobile .cart_cont .left { width: 100%; margin-top: 25px; }
.mobile .cart_cont .left #cartDashBoard { width: calc(100% - 30px); margin-bottom: 25px; padding: 15px; }
.mobile .cart_cont .left #cartDashBoard .title { font-size: calc(20px / 1.3); }
.mobile .cart_cont .left #cartDashBoard #progressBar { width: 100%; }
.mobile .cart_cont .left #cartDashBoard #progressBar .fill .bubble { font-size: calc(18px / 1.3); }
.mobile .cart_cont .left #cartDashBoard .button { display: block; position: static; transform: translate(0, 0); max-width: 110px; margin: 60px auto 0 auto; text-align: center; font-size: calc(18px / 1.3); }
.mobile .cart_cont .left #cartBanner { display: inline-block; margin: 25px 0; }
.mobile .cart_cont .right { width: calc(100% - 30px); padding: 15px; margin-top: 25px; }
.mobile .cart_cont .right .price_sum .price_sum_cont .price_sum_list dl dd strong { font-size: calc(20px / 1.3); }
.mobile .cart_cont .right .price_sum .price_sum_cont .price_sum_list dl.price_total dd strong { font-size: calc(24px / 1.3); }
.mobile .cart_cont .right .btn_order_box .btn_right_box button { font-size: calc(16px / 1.3); }