@charset "utf-8";

/* 결제 공통 */
.order_head{position: relative; margin-bottom: 40px;}
.order_head .page_tit{display: inline-block;padding-bottom: 10px;font-size: 30px;font-weight: 500; color: #000;}
.order_head .steps{display:flex; position: absolute; right: 0; bottom: -1px; }
.order_head .steps li{display: inline-block;padding-bottom: 10px;font-size: 16px;color:#c4c4c4;line-height: 26px;}
.order_head .steps li::before{display:inline-block; width:26px; height:26px;margin-right:5px; border-radius:50%; font-family:Montserrat; font-size:14px; font-weight:700; text-align:center; color:#fff; background:#c4c4c4;}
.order_head .steps li:nth-child(1)::before{content:'1';}
.order_head .steps li:nth-child(2)::before{content:'2';}
.order_head .steps li:nth-child(3)::before{content:'3';}
.order_head .steps li:not(:last-child)::after{content:'';display: inline-block; position:relative; top:2px; width:9px;height:16px;margin-left: 18px;margin-right: 18px;background:url(/assets/images/module_common/i_btn_back.png) center / contain no-repeat;transform:scale(-1);opacity:.25}
.order_head .steps li.on{color: #1c1f24;}
.order_head .steps li.on::before{background:#1c1f24;}
.order_head .steps li.on:not(:last-child)::after{opacity:1;}
.order_body .btn_back{display: inline-block; height: 22px; margin-bottom: 28px; padding-left: 22px; font-size: 18px; color: #1c1f24; line-height: 20px; font-weight: 500; background: url(/assets/images/module_common/i_btn_back.png) left center no-repeat;}

@media only screen and (max-width:800px) {
    .order_head .page_tit{font-size: 28px;}
    .order_head .steps{display:none}
    .order_head .steps li{font-size: 15px;}
    .order_head{margin-bottom: 30px;}
    .order_body .btn_back{margin-bottom: 18px;}
}


/* 장바구니 */
.cart .list_board{border-top-width:2px; border-bottom-color:#d4d4d4;}
.cart .list_board .no_item{padding-top: 100px; padding-bottom: 100px; border-bottom: 1px solid #ddd;}
.cart .list_board .no_item::before{height:40px; background-image:url(/assets/images/module_common/icon_nocart.png);}
.cart .list_board .item_order{position: relative; padding-left: 20px;}
.cart .list_board .item_bts .btn_resp{min-width: 100px; margin-top: 2px; margin-bottom: 4px;}
.cart .list_board  .item_bts .btn_direct_product_cart{background: #f3f3f3; transition: .2s;}
.cart .list_board  .item_bts .btn_direct_product_cart:hover{color: #fff; background: #333;}
.cart .list_board .ico_del{display: inline-block; position:relative; top: -1px; width: 8px;height: 8px;margin-right: 5px;background: url(/assets/images/module_common/close.png) center no-repeat;opacity: .5;}
.cart .list_board .no_item{display: table-caption; caption-side: bottom;}
.cart .cart_board_bottom{display: flex; justify-content: space-between; align-items: center; margin-top: 20px;}
.cart .cart_board_bottom .bts{white-space: nowrap;}
.cart .cart_board_bottom .cart_desc{padding-left: 1em; font-size: 14px; color: #767676; }
.cart .bottom_bts{margin-top: 80px; text-align: center;}
.cart .bottom_bts .btn_resp.size_c{padding-left: 70px;padding-right: 70px;font-size: 18px;}
.cart .bottom_bts .btn_resp[disabled]{border-color: #c4c4c4; background: #c4c4c4; pointer-events: none;}
.cart .pay_wrap{display:flex; justify-content:center; gap:10px; margin-top:30px; }
.cart .btn_resp{border-radius:2px;}
.cart .btn_resp.size_a{height:34px; line-height:32px;}
.cart.empty .list_product_cart .thead .radio_checkbox_type2{display: none;}
.cart.empty .btn_delete_product_cart{display: none;}
.cart .item_delivery_mobile {display: none;}
.cart .item_delivery_mobile_sub {display:flex;flex-direction:column;align-items:flex-end;}

@media only screen and (max-width:800px) {
    .cart .list_board > .thead{display: block !important;}
    .cart .list_board > .thead li{padding-top:10px; padding-bottom:10px;}
    .cart .list_board > .thead li:not(.radio_checkbox_type2){display:none;}
    .cart .list_board .tbody{align-items: center; padding-left: 0 !important;}
    .cart .list_board .tbody li + li{border-left: none;padding-left: 95px; margin-left:40px;}
    .cart .list_board .tbody li.radio_checkbox_type2{ position:absolute; left: 13px; top: 10px; width: 30px !important;padding: 0;}
    .cart .list_board .tbody .prod{position:relative;}
    .cart .list_board .tbody .thumb{left: 10px !important;top: 0 !important;}
    .cart .list_board .tbody li.item_order{flex:1;width:auto;order: 0;}
    .cart .list_board .tbody li.item_price{flex-basis:100%;margin-top: 5px;}
    .cart .list_board .tbody .item_bts{display:flex;padding-top:10px;padding-right: 10px;padding-left: 10px;flex: 1;}
    .cart .list_board .tbody .item_bts .btn_resp{flex:1;}
    .cart .list_board .tbody .item_bts .btn_resp + .btn_resp{margin-left:10px;}
    .cart .bottom_bts{margin-top: 40px;}
    .cart .bottom_bts .btn_resp.size_c{padding-left:50px; padding-right:50px;}
    /* 220804 sjg 추가 (주문고도화QA) */
    #form_cart_view .list_product_cart .item_price { text-align:right; margin-left:0; margin-top:-19px; margin-bottom:10px; }
    #form_cart_view .list_product_cart .item_price > div { display:inline-block; padding-left:4px; }
    #frm-order-form #div-order-products .order-product-row .item_order + .item_count + .item_count { margin-left:auto; }
    #frm-order-form #div-order-products .order-product-row .item_order + .item_count + .item_count > div { display:inline-block; padding:1px 4px 0 0; }
    /* 배송비 컬럼 모바일화면 */
    .cart .item_delivery {display: none;}
    /* 할인가 숨김 */
    .item_discount {display: none !important;}
}

/* 주문/결제 */
.payment .sub_tit{padding-bottom: 15px; border-bottom: 2px solid #000; font-size: 18px; font-weight: 700; line-height: 1; color: #000;}
.payment_info{display: flex; justify-content: space-between; align-content: stretch; margin-top: 60px; position: relative;height: 100%;}
.payment_info.flying .info_area{flex:none; width: calc(100% - 420px);}
.payment_info.flying .price_area {position: sticky; z-index: 101; height: 100%;}
/* [data-layout-type='type2'] .payment_info.flying .price_area {margin-right: calc((100% - (1240px + 240px))/2);} */
/* .payment_info.flying.bottomFix .price_area { position: absolute;  top: auto !important;  bottom: 0;} */
/* [data-layout-type='type2'] .payment_info.flying.bottomFix .price_area{margin-right: calc((100% - (1240px))/2);} */
.payment_info .info_area{flex: 1; margin-right: 80px;}
.payment_info .info_area .sub_tit:not(:first-child){margin-top: 60px;}
.payment_info .info_area .info_cont{ position: relative; margin-top: 15px;}
.payment_info .form_list{margin-bottom: 5px;}
.payment_info .form_list.line{padding-bottom:15px; border-bottom:1px solid #c6c6c6;}
.payment_info .form_list li{display: flex;}
.payment_info .form_list li.between{justify-content: space-between;}
.payment_info .form_list li + li{margin-top: 10px;}
.payment_info .form_list li.half{max-width: 480px;}
.payment_info .form_list li.no_label{margin-left: 140px;}
.payment_info .form_list li label{display:inline-block;min-width:140px;line-height: 40px;cursor: default;}
.payment_info .form_list li input{flex: 1;}
.payment_info .form_list li select{height:40px;}
.payment_info .form_list select + input{margin-left: -1px;}
.payment_info .form_list .country_no{width: 150px;}
.payment_info .form_list .btn_search{width: 105px;margin-left: 5px;border-color: rgba(0,0,0,.2);color: #000;background: rgba(255,255,255,.2);}
.payment_info .form_list .benefit{align-items:center; gap:10%;  padding-right:30px; font-size:14px; color:#000;}
.payment_info .form_list .benefit .type{flex:1; white-space: nowrap;}
.payment_info .form_list .benefit .type::before{content:url(/assets/images/module_common/coupon.png); position:relative; top:2px; vertical-align:middle; margin-right:10px;}
.payment_info .form_list .benefit .status{min-width:9em;}
.payment_info .form_list .benefit .status .on::before{content:'\f058'; font-family:FontAwesome; color:#afafaf; margin-right:.3em;}
.payment_info .memo_box{flex:1; display:flex; flex-flow:column;position: relative;}
.payment_info .memo textarea{height: 70px; resize: none;}
.payment_info .memo .input-group-text{position: absolute; bottom: 5px; right: 5px; font-size: 13px; color: #888;}
.payment_info .select_recipients_area{display: flex; margin-top: 15px; margin-bottom: 15px;border-bottom: 1px solid #dbdbdb;}
.payment_info .select_recipients_area.hide{display: none;}
.payment_info .select_recipients{width: 170px;height: 45px;font-size: 14px;text-align: center;color: #a9a9a9;line-height: 43px;border:1px solid #eee;background:#eee;cursor: pointer;}
.payment_info .select_recipients.on{position: relative; color: #484848; border-color:#d4d4d4; border-bottom:1px solid #fff; background:#fff;}
.payment_info .recipients_list{border-top: 1px solid #000;}
.payment_info .recipients_list .info_cont{margin-top: 0; padding-top:15px; padding-bottom: 10px; padding-left: 40px; border-bottom: 1px solid #c6c6c6;}
.payment_info .address li{margin-bottom: .5em; font-size: 14px; color: #000; }
.payment_info .address .name b{font-size: 16px; font-weight: 500;}
.payment_info .address .name::after{content: attr(data-tag); display: inline-block; padding-left: .5em; padding-right: .5em; margin-left: .3em; font-size: 10px; font-weight: 200; line-height: 2; color: #fff; vertical-align: middle; margin-top: -3px; background: #ccc;}
.payment_info .address .desc,
.payment_info .address .post{color: #686868}
.payment_info .address .post::before{content: '[';}
.payment_info .address .post::after{content: ']';}
.payment_info .address .tel{font-family: 'Montserrat';}
.payment_info .address .memo{display: flex; margin-top: 30px;}
.payment_info .recipient_row .input_box{position: absolute;top: 50%;left: 10px;transform: translateY(-50%);line-height: 15px;}
.payment_info .recipient_row .btn_address{opacity: 0;position: absolute;top: 0;left: 0;width: 15px;height: 15px;}
.payment_info .recipient_row .btn_address + .pointer{display:inline-block;border: 1px solid #c1c5ca;width: 15px;height: 15px;border-radius: 50%;}
.payment_info .recipient_row .btn_address:checked + .pointer::after{content: '';display: inline-block;position: absolute;top: 0;left: 0;width: inherit;height: inherit;border-radius: 50%;background: #333;transform: scale(.5);transform-origin: center;}

.payment_info .btn_modify{position: absolute; top: 50%; right: 10px; transform: translateY(-50%); color: #686868; transition: .2s;}
.payment_info .btn_modify:hover{border-color: #333; color: #333;}
.payment_info .payment_method{margin-top: 15px;}
.payment_info .tab_radio{display: flex;flex-wrap: wrap;padding-left: 1px; padding-top:1px;}
.payment_info .tab_radio label{position: relative;width: 20%;flex: none;height: 44px;margin-top: -1px;margin-left: -1px;border: 1px solid #c6c6c6;font-size: 14px;text-align: center;color: #000;line-height: 42px;}
.payment_info .tab_radio input[type="radio"]{display: inline-block; position:absolute; left:-100vw; -webkit-appearance: none;appearance: none;}
.payment_info .tab_radio input[type="radio"] + .txt{display: flex;justify-content: center;align-items: center;position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;color: #484848;font-weight: 300;}
.payment_info .tab_radio input:checked + .txt{color: #000;font-weight: 400;}
.payment_info .tab_radio input:checked + .txt::after{content: '';display: inline-block;position: absolute;top: -1px;left: -1px;right: -1px;bottom: -1px;z-index: 1;border:1px solid #000;}
.payment_info .cash_receipt_info[data-match-target="cash_receipt"]{display: none;}
.payment_info .cash_receipt_info[data-match-id="cash_receipt"]{display: block;}
.payment_info .cash_receipt_info[data-match-id="cash_receipt"] select{width:50%}
.payment_info .cash_receipt_info .tab_radio label{height: 40px; width:50%; line-height: 38px;}
.payment_info .tab_radio label + label{margin-left: -1px;}
.payment_info .account_info{max-width: 40%;}
.payment_info .account_info[data-match-target="payment_method"]{display: none;}
.payment_info .account_info[data-match-id="method_account_transfer"]{display: block;}
.payment_info .cash_receipt_info [data-match-target="cash_receipt_type"] li{display: none;}
.payment_info .cash_receipt_info [data-match-id="cash_personal"] li[data-type="cash_personal"],
.payment_info .cash_receipt_info [data-match-id="cash_company"] li[data-type="cash_company"]{display: flex;}
.payment_info .cash_receipt_info{margin-top: 20px;}
.payment_info .cash_receipt_cont{margin-top: 10px;}
.payment_info .price_area{width: 340px;}
.payment_info .price_box .line_box{padding: 30px 30px 20px;border: 1px solid #e3e3e3; background: #FFF;}
.payment_info .price_box .line_box + .line_box{margin-top:13px;}
.payment_info .price_box .sub_tit{margin-bottom:20px; padding-bottom: 25px; border-bottom-width:1px;}
.payment_info .price_box .price_table li{display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; font-size: 14px; color: #000;}
.payment_info .price_box .price_table li.discount{margin-bottom:5px;}
.payment_info .price_box .price_table li.desc{margin-bottom:0; color:#929292}
.payment_info .price_box .price_table li:last-child{margin-bottom:0;}
.payment_info .price_box .price_table .no{font-family: 'Montserrat'; font-size: 16px; font-weight: 700;}
.payment_info .price_box .price_table li.desc .no{font-weight:400;}
.payment_info .price_box .price_table .total{padding-top: 10px;}
.payment_info .price_box .price_table .total .price{color:#f1504e;}
.payment_info .price_box .price_table .total .no{font-size: 24px;font-weight: 700;}
.payment_info .price_box .agree{margin-bottom: 20px;}
.payment_info .price_box .agree .item{position: relative;padding-right: 2.5em;font-size: 14px;color: #7b7b7b;}
.payment_info .price_box .agree .item + .item{margin-top: 10px;}
.payment_info .price_box .agree .item .btn_agree_detail{position: absolute; top: 0; right: 0; font-size: 14px ;color: #7b7b7b; text-decoration: underline;}
.payment_info .price_box .agree .radio_checkbox_type2 label{line-height: inherit;color: #686868;font-size:13px;padding-left: 5px;}
.payment_info .price_box .agree .radio_checkbox_type2 input{position: absolute;}
.payment_info .price_box .agree .radio_checkbox_type2 em::before{top: 0; transform: translateY(0);}
.payment_info .price_box .agree .radio_checkbox_type2 em::after{top: 10px; padding-top: 0;}
.payment_info .price_box .btn_payment{width: 100%;box-shadow: 3px 3px 5px rgb(0 0 0 / 20%);}
@media only screen and (max-width: 1530px) {
    /* [data-layout-type='type2'] .payment_info.flying .price_area {margin-right: 20px;} */
    /* [data-layout-type='type2'] .payment_info.flying.bottomFix .price_area{margin-right: 0;} */
}
@media only screen and (max-width: 1279px) {
    /* .payment_info.flying .price_area {margin-right: 20px;} */
    /* .payment_info.flying.bottomFix .price_area{margin-right: 0;} */
}
@media only screen and (max-width:1023px) {
    .payment_info{flex-flow: column;}
    .payment_info .info_area{margin-right: 0;}
    .payment_info .info_cont{max-width: none;}
    .payment_info .info_area .sub_tit:not(:first-child){margin-top: 40px;}
    .payment_info .tab_radio{flex-wrap: wrap;}
    .payment_info .tab_radio label{display: flex; justify-content: center; align-items: center; line-height: 1.5;}
    .payment_info .tab_radio label .txt{word-break: keep-all; font-size: 13px; line-height: 1.5;}
    .payment_info .price_area{width: 100%; margin-top: 20px;}
    .payment_info .price_box .line_box{padding:20px;}
    .payment_info .price_box .sub_tit{padding-bottom: 20px;}
    .payment_info .price_box .price_table li{margin-bottom: 10px;}
    .payment_info .price_box .price_table .total{padding-top: 10px;}
    .payment_info .price_box .agree{margin-bottom: 20px;}

    .payment_info .form_list li.no_label{margin-left: 60px;}
    .payment_info .form_list li label{min-width: 60px; font-size:13px;}
    .payment_info .form_list li input, .payment_info .form_list li select, .payment_info .form_list li textarea, .payment_info .form_list li button{font-size:13px;}
    .payment_info .form_list .country_no{width: 115px;padding-right:20px;}

    .payment_info .form_list .benefit{flex-wrap:wrap; justify-content:flex-start; gap: 10px; padding-left:10px; padding-right:0;}
    .payment_info .form_list .benefit .type{flex:none;}
    .payment_info .form_list .benefit .status{display:none;}
    .payment_info .tab_radio label{width:33.33%;}
    .payment_info .account_info{max-width: 100%;}
    .payment_info .price_box .agree{margin-bottom: 0;}
    .payment_info .price_box .wrap_btn_payment{position:fixed; bottom:0; left:0; right: 0; z-index:500; padding:10px 15px; border-top:1px solid rgba(0,0,0,.05); background: #fff;}
    .payment_info .price_box .btn_payment{height:50px; line-height:48px; font-size:16px; font-weight:400;}
    .payment_info .select_recipients{width: 50%;}
    .payment_info .form_list li.half {max-width:100%}
    
}
@media only screen and (max-width:800px) {
    .list_prod .item_count.discount_price > * {display: none;}
}
@media only screen and (max-width:639px) {
    
}

/* 쿠폰 할인 팝업 */
.discount_pop_layer .select_tab_comm .select_tab{width:120px;}
.discount_pop_layer .area_select{border-top:1px solid #cdcdd0;}
.discount_pop_layer .area_select.no_item{border:none;}
.discount_pop_layer .area_select .y_scroll_auto{max-height:40vh;width: calc(100% + 10px);padding-top:15px;padding-right: 10px; padding-bottom:10px;}
.discount_pop_layer .area_select.no_item .y_scroll_auto{min-height: 177px;}
.discount_pop_layer .area_select .prod_item + .prod_item{margin-top:15px;}
.discount_pop_layer .area_select .prod_info{flex-wrap:wrap; padding-left:.5em; font-size:15px; color:#484848;}
.discount_pop_layer .area_select .prod_info .option{margin-left:-.3em;}
.discount_pop_layer .area_select .prod_info .option::before{content:', ';}
.discount_pop_layer .area_select .prod_info .count::before{content:'/ ';}
.discount_pop_layer .area_select .prod_info .right{margin-left:auto;}
.discount_pop_layer .area_select .prod_info .right .no{font-weight:500; color:#333;}
.discount_pop_layer .area_select .coupon_list{margin-top:15px; padding:12px 15px; border:1px solid #cdcdd0; border-radius:5px;}
.discount_pop_layer .area_select .coupon_list.on{border-color:#f1504e;}
.discount_pop_layer .area_select .coupon_list li + li{margin-top:10px;}
.discount_pop_layer .area_select .coupon_list label{display:block; position:relative;padding-left:30px;line-height: inherit;}
.discount_pop_layer .area_select .coupon_list input,
.discount_pop_layer .area_select .coupon_list input + em{position:absolute; top:0; left:0;}
.discount_pop_layer .area_select .coupon_list input.used ~ .price::after{content:'사용중'; display:inline-block;margin-left: .3em; padding:0 .7em; font-size:12px;color: #fff;line-height: 1.6em; border-radius:1em; background:#b9b9b9;}
.discount_pop_layer .area_select .coupon_list .info{padding-top:.2em;}
.discount_pop_layer .area_select .coupon_list .title, 
.discount_pop_layer .area_select .coupon_list .condition{display:inline-block; font-size:.9em; vertical-align:top;}
.discount_pop_layer .area_select .coupon_list .title{display:inline-block; overflow:hidden; text-overflow:ellipsis; max-width:20em; white-space:nowrap;}
.discount_pop_layer .area_select .coupon_list .condition::before{content:'(';}
.discount_pop_layer .area_select .coupon_list .condition::after{content:')';}
.discount_pop_layer .area_select .no_item{display: flex;flex-flow: column;justify-content: center;align-items: center;padding-top: 39px;padding-left: 10px;color: #a4a4a4;font-size: 14px;}
.discount_pop_layer .area_select .no_item::before{content:''; display:inline-block; width:49px; height:34px;margin-bottom: 20px; background:url(/assets/images/module_common/no_coupon.png) center / contain no-repeat;opacity: .8;}
.discount_pop_layer .area_select .total{margin-top: 10px; align-items:flex-end;}
.discount_pop_layer .area_select .total .title{font-size:16px; color:#484848;}
.discount_pop_layer .area_select .total .price .no{font-size:22px; font-weight:600;}
.discount_pop_layer .area_my{max-height: calc(40vh + 44px); width: calc(100% + 5px); margin-right: -5px; padding: 0 10px;}
.discount_pop_layer .area_my.no_tab{width:100%; margin-right:0;}
.discount_pop_layer .area_my .no_item{padding-top: 40px;text-align: center;}
.discount_pop_layer .area_my .no_item .txt{padding-top:1em; font-size:14px; color:#a4a4a4;}
.discount_pop_layer .area_my .no_item .txt::before{content:'';display: block; width:49px; height:34px;margin: 0 auto 20px;background:url(/assets/images/module_common/no_coupon.png) center no-repeat;opacity: .8;}
.discount_pop_layer .area_my .note{padding-top:1em; padding-bottom:1em; color:#878d95; font-size:13px;}
@media only screen and (max-width:800px) {
    .discount_pop_layer .area_select .y_scroll_auto{height: calc(100vh - 345px); max-height:none;}
    .discount_pop_layer .area_my{height: calc(100vh - 300px); max-height:none; padding-left:0; padding-right:0;}
    .discount_pop_layer .no_tab.y_scroll_auto{height: calc(100vh - 215px)}
    .discount_pop_layer .area_my .coupon_list li .coupon_info{padding:10px 15px;}
    .discount_pop_layer .area_my .coupon_list li .coupon_info .discount{font-size:1em;}
}

/* 주문완료 */
.order .sub_content{margin-top: 65px;}
.order .list_board{border-bottom-color: #e3e3e3;}
.order .fin_comment .ico_fin{display: block;width:40px;height:40px;margin: 70px auto 0;background: url(/assets/images/module_common/icon_complete.png) center / contain no-repeat;}
.order .fin_comment .txt{padding-top: 20px;margin-bottom: 70px;font-size: 24px;font-weight: 500;color: #000;text-align: center;word-break: keep-all;}
.order .total_price{padding-left: 80px; padding-right: 80px; border-left: 1px solid #d4d4d4; border-right: 1px solid #d4d4d4;}

@media only screen and (max-width:1023px) {
    .order .fin_comment .txt{padding-top: 20px;}
    .order .total_price{padding-left: 20px; padding-right: 20px;}
}
@media only screen and (max-width: 767px) {
    .order .fin_comment{border-top: 1px #333 solid !important;border-bottom: 1px #e3e3e3 solid !important;display: block;}
    .order .fin_comment .ico_fin{margin-top:30px; width:30px; height:30px;}
    .order .fin_comment .txt{margin-bottom:30px; padding-top:10px; font-size:18px}
    .order .total_price{padding-left: 0; padding-right: 0;}
}