@charset "utf-8";
@import url(../ONEID/ONEID.css);
/*───────────────────────────────────────────────────────────

	 공통 (주문/장바구니)

───────────────────────────────────────────────────────────*/
/* 추가상품 */
/*
.add_goods_box {}
.add_goods_box .add_title {font-weight:bold;}
.add_goods_box .add_goods_list {}
.add_goods_box .add_goods_list li {padding:8px 0; border-bottom:1px solid #dfdfdf;}
.add_goods_box .add_goods_list li:last-child {border-bottom:none;}
.add_goods_box .add_goods_list li .add_goods_img {display:table-cell; width:60px;}
.add_goods_box .add_goods_list li .add_goods_img img {width:60px;}
.add_goods_box .add_goods_list li .add_goods_content {display:table-cell; padding:0 0 0 15px; vertical-align:middle;}
.add_goods_box .add_goods_list li .add_goods_content .title {display:block; padding:0 0 3px 0; font-size:12px; color:#5e5e5e;}
.add_goods_box .add_goods_list li .add_goods_content .add_goods_option {color:#a9a9a9;}
.add_goods_box .add_goods_list li .add_goods_content .add_goods_text {display:table; width:100%;}
.add_goods_box .add_goods_list li .add_goods_content .add_goods_text .goods_number {display:block; font-size:11px; color:#9d9d9d;}
.add_goods_box .add_goods_list li .add_goods_content .add_goods_text .goods_number em {font-style:normal;}
.add_goods_box .add_goods_list li .add_goods_content .add_goods_text .goods_price {display:block; font-size:14px; color:#ab3e55;}
.add_goods_box .add_goods_list li .add_goods_content .add_goods_text .goods_price em {font-size:12px; font-weight:bold; font-style:normal;}
*/

.familyPayBtns {background:#F7F7F7; display:flex; padding:8px 20px; gap:4px; border-bottom:1px solid #EBEBEB;  }
.familyPayBtns button { width:100%; height:48px; background:#fff; border:1px solid #DFDFDF; border-radius:4px; font-weight:600; color:#888; display:flex; gap:6px; justify-content:center; align-items:center; }
.familyPayBtns button.on { border:1px solid #00B373; color:#00B373; }
.familyPayBtns button.btn_pay_normal::before { content:""; display:inline-block; width:20px; height:20px; background:url(../../images/icon/btn_normal_off.png) no-repeat 0 0 / 100%; }
.familyPayBtns button.btn_pay_normal.on::before{ content:""; display:inline-block; width:20px; height:20px;  background:url(../../images/icon/btn_normal_on.png) no-repeat 0 0 / 100%; }
.familyPayBtns button.btn_pay_family::before { content:""; display:inline-block; width:20px; height:20px; background:url(../../images/icon/btn_family_off.png) no-repeat 0 0 / 100%; }
.familyPayBtns button.btn_pay_family.on::before{ content:""; display:inline-block; width:20px; height:20px; background:url(../../images/icon/btn_family_on.png) no-repeat 0 0 / 100%; }

/*** 장바구니 | mobile/order/cart.php ***/
div.cart { padding-bottom:50px;  }
.cart .cart_content_box { }
.cart .cart_content_box .allchk { display:flex; padding:8px 20px; justify-content:space-between; align-items:center; border-bottom:1px solid #EBEBEB;  }
.cart .cart_content_box .my_goods {padding:0 20px; border-top:11px solid rgba(136, 136, 136, 0.1); border-bottom:11px solid rgba(136, 136, 136, 0.1); } /* 상하 11px 회색 띠 제거 @entwiz */
.cart .cart_content_box .my_goods > li {position:relative; padding:20px 0; border-top:1px solid rgba(136, 136, 136, 0.1); }
.cart .cart_content_box .my_goods > li:first-child {border-top:0;}
/* 상품 버튼 */
.cart .cart_content_box .my_goods li .btn_list {position:relative; display:block; padding:0px 0 10px 0;  margin-bottom:12px; border-bottom:1px solid #c9c9c9; font-size:0;} /* 퍼블수정 */
.cart .cart_content_box .my_goods li .btn_list .coupon_btn {display:inline-block;}
.cart .cart_content_box .my_goods li .btn_list .coupon_btn button {display:inline-block; margin:0 5px 0 0; font-size:13px;}
.cart .cart_content_box .my_goods li .btn_list .option_btn {display:inline-block; }
.cart .cart_content_box .my_goods li .btn_list .option_btn button {display:inline-block; margin:0 5px 0 0; font-size:13px;}
.cart .cart_content_box .my_goods li .select_del_box {position:absolute; top:20px; right:0;}
.cart .cart_content_box .my_goods li .mid_box { overflow:hidden;}
.cart .cart_content_box .my_goods li .mid_box .left_box { position:absolute;  padding:0 12px 0 0; font-size:0; vertical-align:top;}
/* 상품정보 */
.cart .cart_content_box .my_goods li .mid_box .right_box {  width:100%; padding:0 0 0 32px; vertical-align:top;}
.cart .cart_content_box .my_goods li .mid_box .right_box .info {  width:100%; }
.cart .cart_content_box .my_goods li .mid_box .right_box .info > a {display:inline-block; width:100%; margin:0 10px 0 0px;}
.cart .cart_content_box .my_goods li .mid_box .right_box .info .cart_prd { display:flex;   }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead { }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box {position:relative; line-height:0; }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box .thmb {line-height:0; font-size:0; border-radius:8px; overflow:hidden; position: relative; } /* 퍼블수정 0528 */
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box .thmb img {width:84px;}
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box .timesale_box {position:absolute; top:0; bottom:0; left:0; width:100%; padding:10px 0 10px 0; text-align:center; background:rgba(0,0,0,0.5);}
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box .timesale_box img {width:15px; height:15px; vertical-align:-3px;}
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box .timesale_box .timetext { display:inline-block; margin:0 0 0 4px; padding:8px 0 0; color:#fff; font-size:12px;} /* 퍼블수정 0528 */

/* 퍼블 0617 */
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box .timesale_img {position: absolute; top:8px; left:8px; height:20px; padding:0 5px; display:flex; align-items: center; color:#fff; font-size: 12px; background:#33C28F; border-radius: 2px;     line-height: 14px; }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box .soldout_img {  position: absolute; left:0; top:0; width:100%; height:100%; z-index:2;  font-size: 0; }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box .soldout_img::before  { content:""; position:absolute; width:100%; height:100%; background:rgba(0,0,0,.5); border-radius: 8px;     }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itemhead .thmb_box .soldout_img::after   { content:"품절"; position:absolute; top:8px; left:8px; height:20px; padding:0 5px; display:flex; align-items: center; color:#555; font-size: 12px; background:#EBEBEB; border-radius: 2px;     line-height: 14px;}


.cart .cart_content_box .my_goods li .mid_box .right_box .info .itembody { width:100%; padding:4px 0 0 12px; }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itembody p { word-break: break-all;  }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itembody p.name { color:#222; padding-right:30px;  }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itembody p.name a { color:#222; display: -webkit-box; width:100%;  overflow: hidden; text-overflow: ellipsis;  -webkit-line-clamp: 2; -webkit-box-orient: vertical;  }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .itembody p.excl {padding: 0 0 3px 0;}

.cart .cart_content_box .my_goods li .mid_box .right_box .info .prd_option {display:flex; margin-top:11px; justify-content: space-between; height:28px; align-items:center  }
.cart .cart_content_box .my_goods li .mid_box .right_box .info .prd_option .prc {display:block; font-size:16px; color:#222; font-weight:600; }
.cart .cart_content_box .my_goods li.disabled .infoDisabled {  }
.cart .cart_content_box .my_goods li.disabled .mid_box .right_box .info .itembody p.name a {color:#ccc}
.cart .cart_content_box .my_goods li.disabled .mid_box .right_box .info .prd_option .prc {color:#ccc}
.cart .cart_content_box .my_goods li.disabled .mid_box .right_box .info .prd_option .sumBox {background:#F7F7F7;  }
.cart .cart_content_box .my_goods li.disabled .mid_box .right_box .info .prd_option .sumBox input { color:#AAA}
.cart .cart_content_box .my_goods li.disabled .mid_box .right_box .info .prd_option .sumBox button {  opacity:.6}
.cart .cart_content_box .my_goods li.disabled .mid_box .right_box .info .prd_option .sumBox p {color:#ccc}



.my_goods .info {  width:100%; }
.my_goods .info > a {display:inline-block; width:100%; margin:0 10px 0 0px;}
.my_goods .info .cart_prd { display:flex;   }
.my_goods .info .itemhead { }
.my_goods .info .itemhead .thmb_box {position:relative; line-height:0; }
.my_goods .info .itemhead .thmb_box .thmb {line-height:0; font-size:0; border-radius:8px; overflow:hidden; }
.my_goods .info .itemhead .thmb_box .thmb img {width:84px;}
.my_goods .info .itemhead .thmb_box .timesale_box {position:absolute; bottom:0; left:0; width:100%; padding:10px 0 10px 0; text-align:center; background:rgba(0,0,0,0.5);}
.my_goods .info .itemhead .thmb_box .timesale_box img {width:15px; height:15px; vertical-align:-3px;}
.my_goods .info .itemhead .thmb_box .timesale_box .timetext {margin:0 0 0 4px; color:#fff; font-size:12px;}
.my_goods .info .itembody { width:100%; padding:4px 0 0 12px; }
.my_goods .info .itembody p { word-break: break-all;  }
.my_goods .info .itembody p.name { color:#222; padding-right:30px;  }
.my_goods .info .itembody p.name a { color:#222; display: -webkit-box; width:100%;  overflow: hidden; text-overflow: ellipsis;  -webkit-line-clamp: 2; -webkit-box-orient: vertical;  }
.my_goods .info .itembody p.excl {padding: 0 0 3px 0;}
.my_goods .info .prd_option {display:flex; margin-top:11px; justify-content: space-between; height:28px; align-items:center  }
.my_goods .info .prd_option .prc {display:flex; font-size:16px; color:#222; font-weight:600; align-items:center; gap:4px; }
.my_goods .info .prd_option .prc .size {color:#888; font-size:14px; font-weight:400}

.couponSelect {}




/* 아이콘 느낌표 */
.cart .cart_content_box .my_goods li .icon_exclamationmark {display:inline-block; width:16px; height:16px; background:url('../../images/icon/exclamationmark.png') no-repeat center; background-size:16px;}
/* 구매 이용 조건 안내 */
.cart .cart_content_box .my_goods li .order_possible_list{width:100%;  padding-left:32px; margin-top:8px; }
.cart .cart_content_box .my_goods li .order_possible_list .inner_title { display:flex; gap:4px; width:100%;  line-height:22px; align-items:center }
.cart .cart_content_box .my_goods li .order_possible_list .inner_title strong { font-size:12px; font-weight:500; color:#333}
.cart .cart_content_box .my_goods li .order_possible_list ul { margin-top:4px; border-top:1px solid rgba(136, 136, 136, 0.1);  }
.cart .cart_content_box .my_goods li .order_possible_list ul li { color:#888; font-size:12px; padding-top:4px;  }
.cart .cart_content_box .my_goods li .order_possible_list ul li.title {  }
/* 구매 이용 조건 안내 더보기 버튼 */
.pm_more_btn{ width:24px; height:24px; border:none; font-size:0; margin-left:auto; transition:0.4s; background:url('../../images/icon/down_s.png') no-repeat center; background-size:24px;}
.active .pm_more_btn { transform:rotate(180deg)}

/* 하단 버튼 */
.cart .btn_wish_bx { padding:0 20px 0px;  }
.cart .btn_wish_bx ul {display:table; width:100%; padding:0 0 4px 0;}
.cart .btn_wish_bx ul li {display:table-cell; width:50%;}
.cart .btn_wish_bx ul li:nth-child(1) {padding:0 2px 0 0;}
.cart .btn_wish_bx ul li:nth-child(2) {padding:0 0 0 2px;}
.cart .no_data {text-align:center; padding:50px 0;}

/* 추가상품 */
.cart .add_goods_box {width:100%;  }

/* 주문정보1 */
.cart .cart_content_box .supplier_total {border-bottom:2px solid #ab3e55; padding:10px;line-height:1.4em; font-size:14px; color:#333; font-weight: normal;}
.cart .cart_content_box .supplier_total .total{font-size:15px; }
/* 주문정보2
.cart .my_buy {padding:10px 10px 10px 10px;}
.cart .my_buy dl {display:table; width:100%; margin:0 0 15px 0;}
.cart .my_buy dl dt {display:table-cell; width:50%; font-size:13px; color:#5e5e5e;}
.cart .my_buy dl dd {display:table-cell; width:50%; text-align:right; font-size:15px; color:#5e5e5e;}
.cart .my_buy dl.total {padding:15px 0 0 0; border-top:1px solid #c3c3c3;}
.cart .my_buy dl.total dd {color:#ab3e55; font-size:17px;}
*/

.cart .my_buy { padding:24px 20px;  }
.cart .my_buy dl {display:flex; height:20px; font-size:14px; color:#222; font-weight:500; justify-content: space-between;  align-items:center  }
.cart .my_buy dl + dl { margin-top:6px; }
.cart .my_buy dl dt { font-size:14px;  }
.cart .my_buy dl dd {  font-size:14px;  }
.cart .my_buy dl.total { height:22px; margin-top:11px; font-weight:600; padding-top:11px; border-top:1px solid rgba(136, 136, 136, 0.1); box-sizing:content-box }
.cart .my_buy dl.total dd {  font-weight:600; font-size:20px; line-height:22px; color:#00B373;  }
.cart .my_buy dl.familyTotal { height:22px; font-weight:600; box-sizing:content-box }
.cart .my_buy dl.familyTotal dd {  font-weight:600; font-size:20px; line-height:22px; color:#00B373;  }
.isFamily.cart .my_buy dl.total dd  {font-size:16px; color:#222}

/* 데이터가 없을경우 */
.cart .no_data {padding:187px 0 0 0; font-size:20px; font-weight:500; color:#CCC; text-align:center; background:url('../../images/icon/cart_nodata.png') no-repeat center 80px; background-size:91px;}
button.btn_cart_more { height:48px; margin:0 auto; display:flex; justify-content: center;  align-items:center ; padding:0 28px; border:1px solid #00B373; border-radius:4px; margin-top:16px; font-size:16px; color:#00B373;   }
button.btn_cart_more::after { content:""; width:20px; height:20px; background:url(../../images/icon/btn_r_bul_lnk.png) no-repeat 0 0 / 100%;  }


/*** 주문서 작성 | order/order.html ***/
.order {margin-top:-1px;}
.order .order_tit { display:flex; gap:9px; position:relative; padding:16px 20px; align-items:center;}
.order .order_tit.hand { cursor:pointer }
.order .order_tit.topLine { border-top:8px solid rgba(136, 136, 136, 0.1); }
.order .order_tit.topLine2 { border-top:8px solid rgba(136, 136, 136, 0.1); }
.order .order_tit strong {font-size:18px; white-space:nowrap; }
.order .order_tit strong em { color:#00B373;  }
.order .order_tit > span.inp_rdo {font-size:16px; font-weight:600; }
.order .order_tit > span.inp_chk {font-size:14px; margin-left:5px; display:flex; gap:4px; align-items:center; font-weight:400; }
.order .order_tit > span.inp_chk label { font-weight:400; }
.order .order_tit > span img {width:18px; vertical-align:middle;}
.order .order_tit > div img{height:18px;}
.order .order_tit .btn_orderList_toggle { margin-left:auto; width:24px; height:24px; transform:rotate(180deg); background:url(../../images/icon/arrow-down.png) no-repeat 50% 50% / 100%;  }
.order .order_tit .prdTxt { display:flex; opacity:0; transition:.2s; transform: translateX(10px); margin-left:auto; max-width:calc(100% - 120px);  white-space:nowrap; color:#888; font-size:14px; font-weight:400; }
.order .order_tit .prdTxt span.name { overflow:hidden; text-overflow:ellipsis; }
.order .order_tit .prdTxt span.size { flex:1 }
.order .hide .order_tit strong.tit em { display:none }
.order .hide .order_tit .btn_orderList_toggle {margin-left:0}
.order .hide .order_tit .prdTxt {opacity:1; transform: translateX(0px); }


.order .order_tit .inp_chk ~ .btn_orderList_toggle {margin:0;}
.order .order_tit .prdTxt ~ .btn_orderList_toggle {margin:0;}

.order .hide .order_tit .btn_orderList_toggle {transform:rotate(0);}
.order .order_tit .btn_orderList_toggle_S { margin-left:auto; width:24px; height:24px; transform:rotate(0deg); background:url(../../images/icon/drop-down-arrow.png) no-repeat 50% 50% / 100%;  }
.order .hide .order_tit .btn_orderList_toggle_S {transform:rotate(180deg);}
.order .pay {}
.order .my_tit {padding:0 20px;   }
.order .my_tit .inp_chk { display:flex;  }
.order .my_tit .inp_chk input { min-width:20px; }
.order .my_tit label{ font-size:14px; font-weight:400; display:inline-block;  }

ul.goods_option_list { margin-top:8px; padding:12px; background:#F7F7F7; border-radius:4px; }
ul.goods_option_list li {font-weight:500; color:#888; }
ul.goods_option_list li + li {margin-top:8px; }

.order_agreement { padding:16px 20px; border-top:8px solid rgba(136, 136, 136, 0.1);}

.order .toggleBox {display:block;}
.order .order_box.hide {padding-bottom:0;}
.order .hide > .toggleBox {display:none;}

/* 주문 상품 */
.order .pay .my_goods {padding:0 20px 20px; }
.order .pay .my_goods > li {position:relative;}
.order .pay .my_goods > li + li { }
.order .pay .my_goods li .info { width:100%; padding:0; }
.order .pay .my_goods li .info ~ .info { width:100%; padding:0; box-sizing:border-box; margin-top:12px; padding-top:12px; border-top:1px solid rgba(136, 136, 136, 0.1)}
.order .pay .my_goods li .info > a {display:block; margin:0 10px 0 0px;}
.order .pay .my_goods li .info .select_del_box {position:absolute; top:3px; right:3px;}
.order .pay .my_goods li .info .pay_prd { display:flex; width:100%;  }
.order .pay .my_goods li .info .itemhead { vertical-align:top;}
.order .pay .my_goods li .info .itemhead .thmb_box {position:relative; line-height:0; }
.order .pay .my_goods li .info .itemhead .thmb_box .thmb {line-height:0; font-size:0; width:84px; height:84px; border-radius:4px; overflow:hidden; }
.order .pay .my_goods li .info .itemhead .thmb_box .thmb img {width:84px;}
.order .pay .my_goods li .info .itemhead .thmb_box .timesale_box {position:absolute; bottom:0; left:0; width:100%; padding:10px 0 10px 0; text-align:center; background:rgba(0,0,0,0.5);}
.order .pay .my_goods li .info .itemhead .thmb_box .timesale_box img {width:15px; height:15px; vertical-align:-3px;}
.order .pay .my_goods li .info .itemhead .thmb_box .timesale_box .timetext {color:#fff; font-size:12px; margin-left:3px;}
/* 퍼블 0617 */
.order .pay .my_goods li .info .itemhead .thmb_box .timesale_img {position: absolute; top:8px; left:8px; height:20px; padding:0 5px; display:flex; align-items: center; color:#fff; font-size: 12px; background:#33C28F; border-radius: 2px;     line-height: 14px; }
.order .pay .my_goods li .info .itembody { width:100%; padding:4px 0 0 12px; vertical-align:middle;}
.order .pay .my_goods li .info .itembody p { font-size:14px; line-height:16px; color:#888; margin-top:3px;}
.order .pay .my_goods li .info .itembody p.name { font-size:14px; color:#222; margin:0; display: -webkit-box; width:100%;  overflow: hidden; text-overflow: ellipsis;  -webkit-line-clamp: 2; -webkit-box-orient: vertical;  }
.order .pay .my_goods li .info .itembody p.excl {padding: 0 0 3px 0;}
.order .pay .my_goods li .info .itembody .prc { display:flex; width:100%; margin-top:12px; align-items:center; }
.order .pay .my_goods li .info .itembody .prc span.pay { font-size:16px; font-weight:bold; color:#222; }
.order .pay .my_goods li .info .itembody .prc span.cnt { position:relative; color:#888; font-weight:400; margin-left:4px; padding-left:5px;  }
.order .pay .my_goods li .info .itembody .prc span.cnt::before { content:""; position:absolute; left:0; top:3px; display:inline-block; width:1px; height:14px; background:rgba(136, 136, 136, 0.1)  }
.order .pay .my_goods li .info .itembody .prc span.cnt em {  }
.order .order_box {padding:0 0 10px 0;}
.order .order_box fieldset {}
.order .order_box fieldset legend {display:none;}

.order .payDiscount {padding:0 20px; }
.order .payDiscount ul {}
.order .payDiscount ul li {padding:10px 0;   color:#222; }
.order .payDiscount ul li + li {border-top:1px solid rgba(136, 136, 136, 0.1); }
.order .payDiscount ul li div { display:flex; justify-content:space-between; align-items:center; }
.order .payDiscount ul li div.level_1 span.name { font-size:16px; font-weight:500;  }
.order .payDiscount ul li div.level_1 strong.prc,
.order .payDiscount ul li div.level_1 strong.prc b { font-size:16px; font-weight:500; }
.order .payDiscount ul li div.level_1 button {  border:1px solid #DFDFDF; padding:0 12px; height:28px; color:#222; align-items: center; }
.order .payDiscount ul li div.level_2 {margin:4px 0;}
.order .payDiscount ul li div.level_2 span.name { font-size:14px; font-weight:400;  }
.order .payDiscount ul li div.level_2 strong.prc,
.order .payDiscount ul li div.level_2 strong.prc b { font-size:14px; font-weight:400; }
.order .payDiscount ul li div.level_3 span.name { line-height:20px; color:#888; font-size:14px; font-weight:400;  }
.order .payDiscount ul li div.level_3 span.name:before { content: "ㄴ "; }
.order .payDiscount ul li div.level_3 strong.prc,
.order .payDiscount ul li div.level_3 strong.prc b { line-height:20px; color:#888; font-size:14px; font-weight:400; }

.order .infoFormBox {padding:0 20px 16px; }
.order .tab_content .infoFormBox {padding-top:20px; }
.order .infoFormBox ul li  {}
.order .infoFormBox ul li + li {margin-top:12px; }
.order .infoFormBox ul li label {display:block; padding-bottom:4px; font-size:14px; color:#888;  }
.order .infoFormBox ul li label.required::after {content:" *"; color:#00B373; margin-left:2px; }
.order .infoFormBox ul li input[type=text]	,
.order .infoFormBox ul li select {width:100%; height:48px; border:1px solid #DFDFDF; border-radius:4px; padding:0 0 0 16px;  }
.order .infoFormBox ul li .multi {width:100%; display:flex; align-items:center; }
.order .infoFormBox ul li .multi span { color:#888; min-width:24px; text-align:center;   }
.order .infoFormBox ul li .multi._emailBox .inputWrap {width:100%; display:flex; align-items:center; }
.order .infoFormBox ul li .multi._emailBox .inputWrap ~ .inputWrap { margin-left:8px; width: 70%; }
.order .infoFormBox ul li .multi._emailBox input[name=emailDomain] {min-width: 105px; }
.order .infoFormBox ul li .numBox   {display: flex; gap:4px; }
.order .infoFormBox ul li .numBox span   { margin:auto 0;  }
.order .infoFormBox ul li .numBox input  {width: 100%; }

.order .infoFormBox li input.btnType { background:url(../../images/icon/bul_select.png) no-repeat right 12px top 50% / auto 24px  }
.order .infoFormBox li input.btnType:disabled { background:#F7F7F7 url(../../images/icon/bul_select.png) no-repeat right 12px top 50% / auto 24px  }

.order .addrSame { padding:16px 20px; border-top:1px solid rgba(136, 136, 136, 0.1); }
.order .tab_menu ~ .tab_content .addrSame { border-top:0; }


/* 수집동의 */
.order .order_box.topLine {border-top:8px solid rgba(136, 136, 136, 0.1);}
.order .order_box .guest_info {}
.order .order_box .guest_info .g_content {overflow:hidden; overflow-y:scroll; height:120px; margin:10px 0 10px 0; padding:5px 15px 5px 15px;}
.order .order_box .guest_info .inp_chk {padding:10px 15px 0 15px; border-top:1px solid #ccc;}

.order .order_box .guest_info ul {}
.order .order_box .guest_info ul li {padding-left:25px; }
.order .order_box .guest_info ul li.chkAll {padding-left:0; font-size:16px;   }
.order .order_box .guest_info ul li ~ li {margin-top:10px;}
.order .order_box .guest_info ul li .inp_chk {padding:0; border:0; display:block; gap:8px;  }
.order .order_box .guest_info ul li .inp_chk label{display:inline-block}
.order .order_box .guest_info ul li .inp_chk input {min-width:20px; }
.order .order_box .guest_info ul li .inp_chk a {min-width:28px; font-size:14px; color:#888; text-decoration:underline; margin-left:2px; }

.order .order_box .guest_info .agreeDetail { display:none; background:#F7F7F7; margin-top:8px; padding:20px; line-height:22px; max-height:250px; overflow: auto; }
.order .order_box .guest_info .agreeDetail.show { display:block; }

/* input 박스 */
/*
.order .order_box input:not([type="radio"]):not([type="checkbox"]) {width:100%; height:31px; padding:0 10px 0 10px; font-size:14px; color:#333333; background:#ffffff; border:1px solid #c3c3c3; box-sizing:border-box;}
.order .order_box .cell_bx {display:table; width:100%;}
.order .order_box .cell_bx .cell {display:table-cell; width:50%; vertical-align:top;}
.order .order_box .cell_bx .cell .inp_sel {margin-left:5px;}
*/
/* 배송지 정보 */
.order .order_box .delivery_box {border-top:1px solid rgba(136, 136, 136, 0.1);}
.order .order_box .delivery_box .tab_menu { ;}
.order .order_box .delivery_box .tab_menu ul { display:flex;  }
.order .order_box .delivery_box .tab_menu ul li { width:100%; border-bottom:1px solid rgba(136, 136, 136, 0.1);  }
.order .order_box .delivery_box .tab_menu ul li a { width:100%; font-size:16px; color:#222; display:flex; height:56px; align-items:center; justify-content:center;   }
.order .order_box .delivery_box .tab_menu ul li:first-child{ }
.order .order_box .delivery_box .tab_menu ul li.active{ border-bottom:2px solid #00B373; }
.order .order_box .delivery_box .tab_menu ul li.active a { }
/* 정보 반영 체크 */
.order .order_box .tab_content {}
.order .order_box .tab_content.tab_guest {padding:0 0 10px 0;}
.order .order_box .tab_content .member_chk_box {padding:0 20px 20px; color:#888;   }
.order .order_box .tab_content .member_chk_box .inp_chk { display:flex; align-items:center  }
.order .order_box .tab_content .member_chk_box + .member_chk_box { margin-top:-12px; }
.order .order_box .tab_content .member_chk_box small { vertical-align:0px }

.order .order_box .tab_content .member_chk_box1 {padding:0 0 13px 20px; font-weight:bold;}
.order .order_box .tab_content .tab_box {display:none; }
.order .order_box .tab_content .show {display:block;}
/* 우편번호 */
.order .order_box .zipcode_box .zipcode_top {position:relative; padding-right:113px;}
.order .order_box .zipcode_box .zipcode_top .zipcode_num {}
.order .order_box .zipcode_box .zipcode_top .zipcode_btn_box {position:absolute; top:0; right:0; width:109px;}
.order .order_box .zipcode_box input {margin:0 0 5px 0;}
.order .order_box .delivery_swiper {padding:12px 0;   background:#F7F7F7; overflow: hidden; }/* gap:8px; row-gap:4px; padding:12px 20px;   background:#F7F7F7; */
.order .order_box .delivery_list_add {display:flex;      background:#F7F7F7; }/* gap:8px; row-gap:4px; padding:12px 20px;   background:#F7F7F7; */
.order .order_box .delivery_list_add li { display: inline-block; width: auto; box-sizing:border-box; font-size:0;}
.order .order_box .delivery_list_add li a {overflow:hidden; display:flex; height:32px; white-space:nowrap; word-wrap:normal; text-overflow:ellipsis; font-size:12px;}
.order .order_box .delivery_list_add li a {border:1px solid #DFDFDF; background: #fff; padding:0 12px; border-radius: 16px; font-size: 14px;justify-content: center; align-items: center; }
.order .order_box .delivery_list_add li a.on { border:1px solid #00B373; background:#00B373; color:#fff; }
.order .order_box .delivery_list_add li.dellvery_add  {min-width:105px;}
.order .order_box .delivery_list_add li.dellvery_add a { display:flex; gap:2px; }
.order .order_box .delivery_list_add li.dellvery_add a::before { content:""; width:16px; height:16px; background:url(../../images/icon/add.png) no-repeat 0 0/ 16px; }
.order .order_box .delivery_list .no_shipping {padding:16px 20px 16px;}
/* 마일리지 & 예치금 */
.order .order_box .table_box {}
.order .order_box .table_box_guest {padding-top:10px;}
.order .order_box .table_box .all_money_box {display:table; width:100%;}
.order .order_box .table_box .all_money_box .money_left {display:table-cell; width:53%;}
.order .order_box .table_box .all_money_box .money_right {display:table-cell; padding-left:10px;}
.order .order_box .table_box .point_view {padding:5px 0 0 0; font-size:12px; color:#5e5e5e; line-height:1.4; }
.order .order_box .table_box .point_view p span {color:#ab3e55;}
.order .order_box .table_box .tx {font-weight:bold; color:#ab3e55;}
/* 최종 결제 금액 */
.order .order_box .sum_prc_wrap { padding:16px 20px; border-top:8px solid rgba(136, 136, 136, 0.1); }
.order .order_box .sum_prc_wrap dl {display:flex;  align-items:center; justify-content:space-between; }
.order .order_box .sum_prc_wrap dl + dl { margin-top:6px; }
.order .order_box .sum_prc_wrap dl dt { font-size:14px; font-weight:500;}
.order .order_box .sum_prc_wrap dl dd { font-size:16px; font-weight:500;}
.order .order_box .sum_prc_wrap dl.family dt { font-weight:600;}
.order .order_box .sum_prc_wrap dl.family dd { font-size:20px; font-weight:600; color:#00B373; }
.order .order_box .sum_prc_wrap dl dd.total { font-size:20px; font-weight:600; color:#00B373; }
/* 결제 수단 */
.order .order_box .pay_mth {padding:0 20px; display:flex; flex-wrap:wrap; gap:8px; }
.order .order_box .pay_notice + .pay_mth {margin-top:12px; }
.order .order_box .pay_mth li { }
.order .order_box .pay_mth li > .inp_rdo{ }

.order .order_box ul.normalPayList {  }
.order .order_box ul.normalPayList li {width:calc(50% - 4px); margin:0; }
.order .order_box ul.normalPayList.btnFull li { width:100%; }
.order .order_box ul.normalPayList li .inp_rdo { display:block; padding:0; }
.order .order_box ul.normalPayList li input { position:absolute; opacity:0; }
.order .order_box ul.normalPayList li label { display:flex; height:48px; margin:0; border:1px solid #DFDFDF; border-radius:4px; align-items:center; justify-content:center; color:#222; font-size:16px; font-weight:600;  }
.order .order_box ul.normalPayList li label.on {border-color:#00B373}
.order .order_box ul.normalPayList ~ .pay_notice { margin-bottom:16px; }
.order .order_box ul.normalPayList li#settlekind_type_pn label { font-size:0; background:url(../../images/common/payType_n.png) no-repeat 50% 50% / 68px; }
.order .order_box ul.normalPayList li#settlekind_type_pk label { font-size:0; background:url(../../images/common/payType_k.png) no-repeat 50% 50% / 68px; }
.order .order_box ul.normalPayList li#settlekind_type_pp label { font-size:0; background:url(../../images/common/payType_p.png) no-repeat 50% 50% / 68px; }

.order .infoFormBox ul.saveMoneyUse {}
.order .infoFormBox ul.saveMoneyUse li {}
.order .infoFormBox ul.saveMoneyUse li label {font-size:16px; }
.order .infoFormBox ul.saveMoneyUse li button.tip_q { width:16px; height:16px; background:url(../../images/icon/info.png) no-repeat 0 0 / 100%; vertical-align:-3px;}
.order .infoFormBox ul.saveMoneyUse li label.tit_gr {color:#00B373; }
.order .infoFormBox ul.saveMoneyUse li label.tit_bk {color:#333; }
.order .infoFormBox ul.saveMoneyUse li .saveInput { position:relative;  }
.order .infoFormBox ul.saveMoneyUse li .saveInput input { padding-right:90px; }
.order .infoFormBox ul.saveMoneyUse li .saveInput button.useAll { position:absolute; right:15px; top:14px; font-size:14px; padding-left:20px; color:#888; font-weight:500; background:url(../../images/icon/use_all.png) no-repeat 0 50% / 16px;   }
.order .infoFormBox ul.saveMoneyUse li .saveInput button.useAll.on { background:url(../../images/icon/use_all_on.png) no-repeat 0 50% / 16px; color:#00B373; font-weight:700;  }
.order .infoFormBox ul.saveMoneyUse li .saveInfo { padding:4px 12px 0; display:flex; font-size:12px; align-items:center; justify-content:space-between;   }
.order .infoFormBox ul.saveMoneyUse li .saveInfo strong { font-size:16px; vertical-align:-1px; }
.order .infoFormBox ul.saveMoneyUse li .saveInfo strong.col_gr { color:#00B373;  }
.order .infoFormBox ul.saveMoneyUse li .saveInfo p {  }

/* 결제 정보 */
.order .order_box .pay_notice {padding:12px 16px 12px 44px; margin:0 20px; color:#00B373; line-height:22px; font-size:14px; border:1px solid #8ADCBF; background:#E6F7F1 url(../../images/icon/ico_notice.png) no-repeat 12px 16px / 20px; ; border-radius:4px;  }
.order .order_box ul + .pay_notice { margin-top:8px; }
.order .order_box .payco_notice {margin:16px 20px ; padding:8px 8px 8px 8px; border:1px solid #e1e1e1; color:#535353; font-size:11px; line-height:16px;}
.order .order_box .re_confirm {padding:16px 20px 0;  font-weight:400; color:#222; font-size:16px;}
.order .order_box .re_confirm strong {  font-weight:400;  }
.order .order_box .re_confirm .inp_chk { display:flex; gap:8px; }
.order .order_box .re_confirm .inp_chk input { min-width:20px;  }
/* 결제 하기 */
.order .btn_pay_wrap {padding:5px 20px;}
.order .btn_pay_wrap .caution_msg1 {padding:5px 0 8px 0; text-align:center; font-weight:bold; color:#333333; font-size:13px;}
/* 추가상품 */
.order .add_goods_box {padding:15px 0 0 0; margin:15px 0 0 0; border-top: 1px solid #cccccc;}

.how_to_pay {border-top:8px solid rgba(136, 136, 136, 0.1);}
.how_to_pay .lineBox {border-top:1px solid rgba(136, 136, 136, 0.1);}

/* 주문하기  사은품 */
.order .gift_choice {padding:10px 0 10px 0;}
.order .gift_choice > p { padding:0 10px 0 10px; }
.order .gift_choice > p > span {color:#ff573b;}
.order .gift_choice > ul {margin:-35px 0 0 -10px; padding:10px 10px 10px 10px; font-size:0; box-sizing: border-box;}
.order .gift_choice > ul > li { display:inline-block; height:auto; margin:35px 0 35px 0; padding:0 0 0 10px; width:33.334%; font-size:13px; text-align:center; vertical-align:top; box-sizing: border-box;}
.order .gift_choice > ul > li .inp_chk{display:block; right:initial; top:initial; margin:0;}
.order .gift_choice > ul > li label {display:block }
.order .gift_choice > ul > li img {display:block; max-width:100%; width:auto; height:auto; margin:0 auto; border:1px solid #cccccc; box-sizing:border-box;}
.order .gift_choice > ul > li span {display:block; width:93px; margin: 0 auto; padding:5px 0 5px 0; word-break:keep-all;}
/* 세금계산서 초기화 */
.order .tax_info_init {display:inline-block; width:50px; height:25px; padding:10px 0 10px 0; text-align:center; background:#ab3e55; border:1px solid #ab3e55; color:#ffffff; font-weight:bold; box-sizing:border-box; line-height:7px; margin-top:6px; font-size:12px;}

.mt16 {margin-top:16px; }

.pay_mth.block li{float:none; width:auto; }
.pay_mth { display:flex; gap:8px; flex-wrap:wrap; }
.js_pay_content .pay_mth { padding:0 20px}
.pay_mth li { width:calc(50% - 4px);  }
.pay_mth li label{display:inline; font-size:13px; color:#494949; line-height:20px; vertical-align:top;}
.pay_mth li label.payco{display:inline-block; width:88px; height:17px; margin:1px 0 0 7px; background-position:0 -435px; line-height:999px}
.pay_mth_payco {overflow:hidden; padding:10px 30px 20px 30px; }
.pay_mth_payco li {float:left; width:50%; }
.pay_mth_payco li span.payco {padding:5px; }
.pay_mth_payco .payco input {display:none; }

.pay_mth span.line_br{display:inline-block; margin-left:29px;}

/*** PG사 결제 페이지 호출 | order/pg_gate.php ***/
.pg_gate {position:fixed; top:0; left:0; right:0; bottom:0; display:-webkit-box; height:100%; -webkit-box-orient:vertical; -webkit-box-pack:center; z-index:3000; background:rgba(0,0,0,.7); vertical-align:middle; text-align:center}
.pg_gate .pg_buy_info {position:relative; margin:0 10px; background:#ffffff; width: 100%; max-width: 500px; left:50%; transform: translateX(-50%) ;}
.pg_gate .pg_buy_info .pg_bx {padding:28px 30px 30px 30px; border-top:1px solid #c3c3c3;}
.pg_gate .pg_buy_info .pg_bx .tx {margin:0 0 12px 0; font-size:12px; color:#333;}
.pg_gate .pg_buy_info .pg_bx .tx strong { display:block; margin:0 0 2px 0; font-size:14px; color:#3e3d3c;}
.pg_gate .pg_buy_info .pg_bx .btn_wish_bx {padding:0 10px 10px 10px}
.pg_gate .pg_buy_info .pg_bx .btn_wish_bx .btn_bx {display:block;}
.pg_gate .pg_buy_info .pg_bx .btn_wish_bx .btn_bx li {display:inline-block;}
.pg_gate .pg_buy_info .pg_bx .btn_wish_bx .cart_btn_box {padding:10px 0 0 0;}

/*** 주문완료 | order/order_end.html ***/
.order_end {}
.order_end .order_end_box {position:relative; margin:15px 15px 5px 15px; padding:20px 0 20px 0; background:#f3f3f3; border:1px solid #e1e1e1; border-radius:2px; text-align:center}
.order_end .order_end_box.none {background:none;border:none;text-align:left}
.order_end .order_end_box h2 {padding:0 0 10px 0; font-size:13px;color:#333333;}
.order_end .order_end_box h2 strong{font-size:14px}
.order_end .order_end_box .tx {padding:0 10px; font-size:16px; line-height:22px; color:#000;}
.order_end .order_end_box .tx ul {display:inline-block; margin:0 auto;}
.order_end .order_end_box .tx ul li {text-align:left; color:#5e5e5e;}
.order_end .order_end_box .tx ul li .prc {font-size:14px; color:#FF5854; font-weight:bold;}
.order_end .order_end_box .tx ul li strong {font-size:14px;}

.order_end .order_end_box .orderNoBox { margin-top:32px; }
.order_end .order_end_box .orderNoBox .prc {font-size:14px; color:#FF5854; font-weight:bold;}
.order_end .order_end_box .orderNoBox table { width:100%; }
.order_end .order_end_box .orderNoBox table th { height:40px; vertical-align: middle; font-weight: 400; padding:0 20px; text-align: left; background:#E6F7F1; border:1px solid #fff; }
.order_end .order_end_box .orderNoBox table td { height:40px; vertical-align: middle; font-weight: 400; padding:0 20px; background:#F7F7F7; border:1px solid #fff; }

.order_end .tx2 {margin:0 0 11px 0; padding:60px 0 0 15px; font-size:16px; /*text-align:center;*/ line-height:22px; color:#5e5e5e;}
.order_end .tx2 span {display:inline-block; text-align:left}
.order_end .tx2 strong {color:#FF5854;}
.order_end .btn_pay_wrap {display:table; width:100%; padding:15px 15px 15px 15px; box-sizing:border-box;}
.order_end .btn_pay_wrap li {display:table-cell;}
.order_end .btn_pay_wrap li:first-child {width:50%; padding:0 1px;}
.order_end .btn_pay_wrap li:last-child {padding:0 1px;}
/*** 쿠폰적용 레이어 | order/layer_coupon_apply.html ***/
.layer_coupon_apply {}
.layer_coupon_apply .ly_coupon_list {}
.layer_coupon_apply .ly_coupon_list .ly_coupon_content {}
.layer_coupon_apply .ly_coupon_list .ly_coupon_content dl {display:table; width:100%; padding:20px 0 20px 0; border-bottom:1px solid #cccccc;}
.layer_coupon_apply .ly_coupon_list .ly_coupon_content dl dt {display:table-cell; width:43%; vertical-align:middle; font-weight:bold;}
.layer_coupon_apply .ly_coupon_list .ly_coupon_content dl dd {display:table-cell; width:43%; padding:0 0 0 10px; vertical-align:middle; color:#9d9d9d;}
.layer_coupon_apply .ly_coupon_list .ly_coupon_content dl dd.c_chk {width:14%; text-align:center; vertical-align:middle;}
.layer_coupon_apply .close_btn {position:absolute; top:0; right:0; z-index:100;}
.layer_coupon_apply .btn_box {position:fixed; bottom:0; left:0; width:100%; background:#fff; border-top:1px solid #cccccc;}
.layer_coupon_apply .btn_box span {display:block; padding:10px;}

/*** 주문쿠폰적용 레이어 | order/layer_coupon_apply_order.html ***/
.layer_coupon_apply_order { height:100%; padding-top:57px;   }
.layer_coupon_apply_order .ly_head { position: absolute; width:100%;   top:0;  }
.layer_coupon_apply_order .notice_box { padding:16px 20px;  }
.layer_coupon_apply_order .notice_box .layerInfoBox { padding:12px 16px 12px 44px;  border:1px solid #EBEBEB; color:#888; background: transparent url(../../images/icon/info_b.png) no-repeat 16px 50%/20px; border-radius:4px;   }
.layer_coupon_apply_order .notice_box .layerInfoBox + .layerInfoBox {margin-top:8px; }
.layer_coupon_apply_order .ly_content {overflow-y:scroll; height:100%; box-sizing:border-box; -webkit-overflow-scrolling:touch; background:#fff;}
.layer_coupon_apply_order .ly_content .ly_coupon_list {padding:0 0 150px 0;}
.layer_coupon_apply_order .ly_content .ly_coupon_list h2 {height:65px; border-top:8px solid #F7F7F7; padding:16px 20px;  font-size: 18px; font-weight: 800; border-bottom:1px solid #F7F7F7;  }
.layer_coupon_apply_order .ly_content .ly_coupon_list dl { }
.layer_coupon_apply_order .ly_content .ly_coupon_list dl dt { }
.layer_coupon_apply_order .ly_content .ly_coupon_list dl dd { }
.layer_coupon_apply_order .ly_content .ly_coupon_list dl dd.c_chk {width:14%; text-align:center; vertical-align:middle; font-size:0;}

.layer_coupon_apply_order .order {  padding:0 20px; }
.layer_coupon_apply_order .order .pay     { border-top:1px solid #F7F7F7; padding:16px 0;  }
.layer_coupon_apply_order .order .pay .my_goods {padding:0 0px 16px; }
.layer_coupon_apply_order .order .pay .my_goods li .info .prd_info     {display:flex; }
.layer_coupon_apply_order .order .pay .my_goods li .info .prd_info .itembody     {  }
.layer_coupon_apply_order .order .pay .my_goods li .info .order_box         {  }
.layer_coupon_apply_order .order .pay .my_goods li .info .itembody .prc span.pay    {padding:0; }
.layer_coupon_apply_order .order .pay .order_box        { padding:0 0px;  }
.layer_coupon_apply_order .order .pay .order_box label   { color:#888;    }
.layer_coupon_apply_order .order .pay .order_box .inp_sel   {   }
.layer_coupon_apply_order .order .pay .order_box .inp_sel select   { width:100%; height:48px; color:#222; margin-top:4px; padding:0 48px 0 16px; border:1px solid #DFDFDF;  border-radius:4px; background:url(../../images/icon/arrow-down.png) no-repeat right 10px top 50%/24px;   }
.layer_coupon_apply_order .order .pay .order_box .cuponInfo_detail   { margin-top:4px; padding:13px 20px; border:1px solid #DFDFDF; border-radius:4px;   }
.layer_coupon_apply_order .order .pay .order_box .cuponInfo_detail p    {display:flex; justify-content: space-between;}
.layer_coupon_apply_order .order .pay .order_box .cuponInfo_detail p + p   { margin-top:4px; }

.layer_coupon_apply_order .close_btn {position:absolute; top:0; right:0; z-index:100;}
.layer_coupon_apply_order .btn_box {position:fixed; bottom:0; left:0; width:100%; background:#fff; }
.layer_coupon_apply_order .btn_box span {display:block; padding:16px 20px;}
.layer_coupon_apply_order .no_data {padding:130px 0 60px 0; font-size:15px; color:#222222; text-align:center; background:url('../../img/icon/icon_ex.png') no-repeat center 40px; background-size:80px;}

.pay-benefits span span {display:inline !important;}


.layer_totalSavings_info        { position: absolute; background:#fff;  z-index:100; margin:0 30px; margin-top:-5px; border:1px solid #EBEBEB;border-radius: 4px; padding:12px 16px;  box-shadow:5px 5px 10px #EBEBEB ;}
.layer_totalSavings_info strong      { font-weight: 600 ; font-size: 14px; ;}
.layer_totalSavings_info ul         { }
.layer_totalSavings_info ul li      { position: relative; padding-left:10px; line-height:22px;   }
.layer_totalSavings_info ul li.green      {  color:#00B373; }
.layer_totalSavings_info ul li.green span      {  color:#333; }
.layer_totalSavings_info ul li::before      {content: "- "; position: absolute; left:0;   }






.layer_coupon_apply_order .selectCouponWrap     { padding:16px 20px;  position: relative;   }
.layer_coupon_apply_order .selectCouponWrap .form_element     { position: absolute; left:20px; top:20px; }
.layer_coupon_apply_order .selectCouponWrap .form_element label.single     { height:22px; }
.layer_coupon_apply_order .selectCoupon     { position: relative;  }
.layer_coupon_apply_order .selectCoupon + .selectCoupon     { margin-top:8px; }
.layer_coupon_apply_order .selectCoupon input[type=checkbox]      { position: absolute; top:20px; left:20px; width:24px; height:24px; background:url(../../images/common/chk_off.svg) no-repeat 0 0/100%;     }
.layer_coupon_apply_order .selectCoupon input[type=checkbox]:checked      { background:url(../../images/common/chk_on_prd.svg) no-repeat 0 0/100%;     }
.layer_coupon_apply_order .selectCoupon input[type=checkbox]:checked ~ .lineBox       {border:1px solid #00B373;  }
.layer_coupon_apply_order .selectCoupon .lineBox       { display:block;  border:1px solid #DFDFDF; border-radius:4px; padding:20px;   }
.layer_coupon_apply_order .selectCoupon .lineBox .c_point       { padding-left:28px; font-size: 18px; color:#222; font-weight: 600;  }
.layer_coupon_apply_order .selectCoupon .lineBox .saleName       { margin-top:8px;   }
.layer_coupon_apply_order .selectCoupon .lineBox .saleName em    { font-size: 16px; font-weight: 400;  }
.layer_coupon_apply_order .selectCoupon .lineBox .saleName div   {  color:#888; line-height:20px; font-weight: 400; font-size: 14px; }
.layer_coupon_apply_order .selectCoupon .lineBox .desc   { margin-top:3px;  }
.layer_coupon_apply_order .selectCoupon .lineBox .desc span   { font-size: 12px; color:#ccc; font-weight: 400; }

/* ==========================================================================
   2026-08 리뉴얼: 장바구니 PC 레이아웃 (1024px~, 시안 기준) @entwiz 2026-08-07
   좌측 상품 목록 + 우측 고정 결제 요약(.cart_side) 2단
   ========================================================================== */
/* ※ 모바일은 기존 그대로 — PC 전용 변경은 아래 @media (min-width:1024px) 안에만 둘 것 */
.cart .cart_side_notice {display:none;} /* PC 전용 안내문 (모바일 미노출) */

@media (min-width: 1024px) {
    /* 주의: 헤더의 장바구니 아이콘도 class="cart"(a 태그) — div로 한정해 페이지 래퍼만 대상 */
    div.cart {max-width:calc(var(--layout-max, 1280px) + var(--layout-margin, 20px) * 2); margin:0 auto; padding:var(--space-12, 48px) var(--layout-margin, 20px);}

    /* 주문 안내문 (PC 전용) */
    .cart .cart_side_notice {display:block; padding:var(--space-3, 12px) 0 0; font-size:13px; line-height:18px; color:var(--color-neutral-40, #888); letter-spacing:var(--letter-spacing-base, -0.006em);}

    /* 상품 목록 첫/마지막 행 외곽 보더 제거
       ※ li 사이에 script 태그가 끼어 있어 :first-child는 안 먹음 → :first-of-type 사용 */
    .cart .cart_content_box .my_goods > li:first-of-type {border-top:0 !important;}
    .cart .cart_content_box .my_goods > li:last-of-type {border-bottom:0 !important;}

    /* 빈 장바구니 — 아이콘(91px, top 48px) 아래로 텍스트 시작 */
    .cart .no_data {padding:168px 0 72px; text-align:center; background:url('../../images/icon/cart_nodata.png') no-repeat 50% 48px / 91px auto;}
    .cart .no_data p strong {display:block; font-size:18px; line-height:24px; font-weight:700; color:var(--color-neutral-30, #707070); letter-spacing:var(--letter-spacing-base, -0.006em);}
    .cart .no_data p strong br {display:none;}
    .cart .no_data p::after {content:'지금 사장님께 필요한 상품을 담아보세요.'; display:block; margin-top:var(--space-2, 8px); font-size:14px; line-height:20px; color:var(--color-neutral-50, #AAA);}
    .cart .no_data .btn_cart_more {margin-top:var(--space-6, 24px);}

    /* 페이지 타이틀 + 진행 단계 */
    .cart > form::before {content:'장바구니'; display:block; grid-column:1 / -1; margin-bottom:var(--space-6, 24px); font-size:28px; line-height:38px; font-weight:700; color:var(--color-neutral-5, #222); letter-spacing:var(--letter-spacing-base, -0.006em);}

    /* 2단 그리드 */
    .cart > form {display:grid; grid-template-columns:minmax(0, 1fr) 360px; gap:0 var(--space-8, 32px); align-items:start;}
    .cart .familyPayBtns,
    .cart .cart_content_box,
    .cart .snsbtn {grid-column:1;}
    .cart .no_data {grid-column:1 / -1;}
    .cart .cart_side {grid-column:2; grid-row:2 / span 30; position:sticky; top:var(--space-6, 24px);}

    /* 결제 탭: 시안형 2분할 */
    .cart .familyPayBtns {display:flex; margin-bottom:var(--space-6, 24px); border:1px solid var(--color-neutral-80, #EBEBEB); border-radius:var(--radius-2, 8px); overflow:hidden;}
    .cart .familyPayBtns button {flex:1; height:56px; border:0; background:var(--color-common-100, #fff); font-size:16px; font-weight:700; color:var(--color-neutral-10, #333);}
    .cart .familyPayBtns button.on {background:var(--color-neutral-5, #222); color:var(--color-common-100, #fff);}

    /* 목록 */
    .cart .cart_content_box .my_goods {padding:0; border-top:0; border-bottom:0;} /* 모바일용 11px 회색 띠 제거 */
    .cart .cart_content_box .allchk {padding:var(--space-4, 16px) 0; border-bottom:1px solid var(--color-neutral-80, #EBEBEB);} /* 좌 패딩 제거 → 상품 행 체크박스와 세로 정렬 */
    /* '전체선택'과 '선택삭제'가 서체 지정 없이 브라우저 기본값을 쓰고 있어 서로 달라 보인다 → 통일 */
    .cart .cart_content_box .allchk .inp_chk {display:flex; align-items:center;}
    .cart .cart_content_box .allchk .buyall {padding-left:var(--space-2, 8px); font-family:inherit; font-size:14px; line-height:20px; font-weight:500; color:var(--color-neutral-5, #222); cursor:pointer;}
    .cart .cart_content_box .allchk .cart_select_del_btn {padding:0; border:0; background:none; font-family:inherit; font-size:14px; line-height:20px; font-weight:400; color:var(--color-neutral-40, #888); cursor:pointer;}
    .cart .cart_content_box .allchk .cart_select_del_btn:hover {color:var(--color-neutral-20, #555); text-decoration:underline;}
    .cart .my_goods_list {padding:var(--space-5, 20px) 0;} /* 구분선은 기존 border-top만 사용(중복선 방지) */

    /* 우측 결제 요약 박스 */
    .cart .cart_side .my_buy {padding:var(--space-6, 24px); border:1px solid var(--color-neutral-80, #EBEBEB); border-bottom:0; border-radius:var(--radius-2, 8px) var(--radius-2, 8px) 0 0; background:var(--color-common-100, #fff); margin:0;}
    .cart .cart_side .my_buy::before {content:'결제 예정 금액'; display:block; padding-bottom:var(--space-4, 16px); margin-bottom:var(--space-4, 16px); border-bottom:1px solid var(--color-neutral-80, #EBEBEB); font-size:18px; line-height:24px; font-weight:700; color:var(--color-neutral-5, #222);}
    .cart .cart_side .my_buy dl {display:flex; justify-content:space-between; padding:var(--space-1, 4px) 0; font-size:14px; line-height:20px;}
    .cart .cart_side .my_buy dl.total {margin-top:var(--space-4, 16px); padding-top:var(--space-4, 16px); border-top:1px solid var(--color-neutral-80, #EBEBEB); font-size:16px;}
    .cart .cart_side .my_buy dl.total dd strong {font-size:24px; line-height:32px; color:var(--color-green-40, #00B373);}
    .cart .cart_side .my_buy dl.familyTotal dd strong {color:var(--color-green-40, #00B373);}
    .cart .cart_side .my_buy #deliveryChargeText {display:block; margin-top:var(--space-2, 8px); font-size:13px; line-height:18px; color:var(--color-green-30, #00A369);}

    /* 주문 버튼: 박스 하단에 붙임 */
    .cart .cart_side .btn_wish_bx {padding:0 var(--space-6, 24px) var(--space-6, 24px); border:1px solid var(--color-neutral-80, #EBEBEB); border-top:0; border-radius:0 0 var(--radius-2, 8px) var(--radius-2, 8px); margin:0; background:var(--color-common-100, #fff);}
    .cart .cart_side .btn_wish_bx .cart_select_order_btn {display:block; width:100%; height:52px; border:0; border-radius:var(--radius-1, 4px); background:var(--color-green-40, #00B373); color:var(--color-common-100, #fff); font-size:16px; font-weight:700;}

    /* 수량 상자 — 폭을 버튼+숫자에 맞게 고정하고 우측 정렬.
       상자가 남는 폭을 다 차지하고 있어서, 입력칸을 늘리면 그만큼 벌어진다.
       입력칸이 버튼 사이를 채우게 해야 숫자가 가운데에 온다. */
    .cart .sumBox {width:116px; padding:0 var(--space-1, 4px); margin-left:auto;}
    .cart .sumBox input {flex:1 1 auto; width:auto; min-width:32px; padding:0; text-align:center;}
    /* type="number" 는 브라우저가 오른쪽에 스피너 자리를 미리 잡아둬 글자가 왼쪽으로 밀린다.
       스피너를 없애야 그 자리가 회수되고 숫자가 실제 가운데에 온다. */
    .cart .sumBox input[type=number] {-moz-appearance:textfield; appearance:textfield;}
    .cart .sumBox input[type=number]::-webkit-outer-spin-button,
    .cart .sumBox input[type=number]::-webkit-inner-spin-button {-webkit-appearance:none; appearance:none; margin:0;}

    .cart .cart_side_notice {padding:var(--space-3, 12px) 0 0;}
}






/* ==========================================================================
   주문서 작성 — PC(1024px~)
   order/order.php · 좌측 주문상품·주문고객·배송정보 + 우측 결제 요약(.order_side) 2단
   ※ 모바일은 기존 그대로 — PC 전용 변경은 아래 @media 안에만 둘 것
   ========================================================================== */

@media (min-width: 1024px) {
    .order_page {max-width:calc(var(--layout-max, 1280px) + var(--layout-margin, 20px) * 2); margin:0 auto; padding:var(--space-12, 48px) var(--layout-margin, 20px);}
    .order_page * {box-sizing:border-box;}

    /* 페이지 타이틀 */
    .order_page > form::before {content:'주문서 작성'; display:block; grid-column:1 / -1; margin-bottom:var(--space-6, 24px); font-size:28px; line-height:38px; font-weight:700; color:var(--color-neutral-5, #222); letter-spacing:var(--letter-spacing-base, -0.006em);}

    /* 2단 그리드 — 우측(.order_side) 외에는 모두 좌측 단으로 */
    .order_page > form {display:grid; grid-template-columns:minmax(0, 1fr) 360px; gap:0 var(--space-8, 32px); align-items:start;}
    .order_page > form > * {grid-column:1;}
    .order_page > form > .order_side {grid-column:2; grid-row:2 / span 30; position:sticky; top:var(--space-6, 24px);}

    /* 좌측 블록 사이 간격 — 모바일의 회색 띠(구분) 대신 여백으로 나눈다 */
    .order_page > form > .pay,
    .order_page > form > .order_box {margin-bottom:var(--space-10, 40px);}

    /* 섹션 제목
       모바일은 섹션 사이를 8px 회색 띠로 나누는데, PC에서는 여백과 선으로 나눈다.
       (.topLine/.topLine2 가 그 띠라 선택자를 맞춰 꺼야 한다) */
    .order_page .order_tit,
    .order_page .order_tit.topLine,
    .order_page .order_tit.topLine2 {margin:0 0 var(--space-5, 20px); padding:0 0 var(--space-3, 12px); border-top:0; border-bottom:1px solid var(--color-neutral-5, #222);}
    .order_page .order_tit strong {font-size:18px; line-height:26px; font-weight:700; color:var(--color-neutral-5, #222);}
    /* 접기 화살표 — PC에서는 모든 영역을 펼쳐 두므로 쓰지 않는다 */
    .order_page .order_tit .btn_orderList_toggle {display:none;}
    .order_page .order_tit .prdTxt {display:none;}

    /* ----------------------------------------------------------------
       주문 상품
       ---------------------------------------------------------------- */
    /* 구분선은 행과 행 '사이'에만 — 위아래 양쪽에 주면 두 줄로 겹쳐 보이고,
       마지막 행에는 선만 남고 아래 여백이 없어 다음 영역에 붙는다. */
    /* 여백 - 선 - 여백 이 되도록 위아래 패딩을 같게 준다 */
    .order_page .pay .my_goods {padding:0;}
    .order_page .pay .my_goods li .info {padding:var(--space-5, 20px) 0; border:0;}
    .order_page .pay .my_goods li .info ~ .info {margin-top:0; padding-top:var(--space-5, 20px); border-top:1px solid var(--color-neutral-80, #EBEBEB);}
    .order_page .pay .my_goods > li + li .info:first-of-type {border-top:1px solid var(--color-neutral-80, #EBEBEB);}
    .order_page .orderPrdList .pay_prd {display:flex; align-items:flex-start; gap:var(--space-4, 16px);}
    .order_page .orderPrdList .itemhead {flex:0 0 80px;}
    .order_page .orderPrdList .thmb {position:relative; overflow:hidden; border-radius:var(--radius-2, 8px); background:var(--color-neutral-90, #F7F7F7);}
    .order_page .orderPrdList .thmb img {width:100%; height:auto; vertical-align:top;}
    .order_page .orderPrdList .itembody {flex:1 1 auto; min-width:0;}
    .order_page .orderPrdList .itembody .name {font-size:15px; line-height:22px; font-weight:500; color:var(--color-neutral-5, #222);}
    .order_page .orderPrdList .itembody .prc {display:block; margin-top:var(--space-2, 8px); font-size:16px; line-height:24px; font-weight:700; color:var(--color-neutral-5, #222);}
    .order_page .orderPrdList .itembody .prc .cnt {margin-left:var(--space-2, 8px); font-size:14px; font-weight:400; color:var(--color-neutral-40, #888);}

    /* 수량 컨트롤은 상품 정보 오른쪽 끝에 세로 가운데로.
       (상품 영역이 <a>로 감싸여 있어 그 형제로 놓고 .info 를 가로 배치한다) */
    .order_page .pay .my_goods li .info {display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-4, 16px);}
    /* 모바일에서 width:100% 라 그대로 두면 앵커가 한 줄을 다 차지해 수량이 아래로 밀린다 */
    .order_page .pay .my_goods li .info > a {flex:1 1 auto; width:auto; min-width:0; margin:0;}
    .order_page .orderPrdList .order_qty {flex:0 0 auto; margin:0;}
    /* 옵션·추가상품 줄은 아래로 내려 전체 폭을 쓴다.
       회색 박스라 아래에 여백이 없으면 다음 상품과 붙어 보인다 */
    .order_page .orderPrdList .goods_option_list,
    .order_page .orderPrdList .add_goods_box {flex:1 0 100%; margin:0 0 var(--space-2, 8px);}

    /* 주문 상품 묶음과 다음 영역(주문 고객) 사이 간격 —
       주문 고객은 .pay 안에 있어 form 직계에 준 여백이 닿지 않는다 */
    .order_page .pay .orderPrdList {margin-bottom:var(--space-10, 40px);}

    /* 주문 상품의 옵션 줄 — 전체폭 회색 박스가 아니라 상품명 아래 보조 텍스트로 */
    .order_page .orderPrdList .itembody .option,
    .order_page .orderPrdList .goods_option {margin-top:var(--space-1, 4px); padding:0; background:none; font-size:13px; line-height:18px; color:var(--color-neutral-40, #888);}

    /* ----------------------------------------------------------------
       우측 결제 요약 — 카드 하나처럼 보이도록 통일
       ---------------------------------------------------------------- */
    /* 카드는 바깥 한 겹만 — 결제수단 안에 .order_box 가 또 들어 있어서
       자손 선택자로 두면 안쪽까지 테두리가 생긴다 */
    .order_page .order_side > .order_box,
    .order_page .order_side > .how_to_pay {margin:0 0 var(--space-3, 12px); padding:var(--space-5, 20px); border:1px solid var(--color-neutral-80, #EBEBEB); border-radius:var(--radius-2, 8px); background:var(--color-common-100, #fff);}
    /* 안쪽에 중첩된 박스·제목은 장식을 걷어낸다 */
    .order_page .order_side .order_box .order_box,
    .order_page .order_side .how_to_pay .order_box {margin:0; padding:0; border:0; border-radius:0; background:none;}
    .order_page .order_side .how_to_pay .order_tit {margin:0; padding:0; border:0;}
    /* 결제수단 묶음 구분선 — 카드 안에서 라디오만으로 충분히 구분돼 PC에서는 쓰지 않는다 */
    .order_page .order_side .how_to_pay .settlekind_box {padding:var(--space-3, 12px) 0;}
    .order_page .order_side .how_to_pay .lineBox,
    .order_page .order_side .how_to_pay .settlekind_box.lineBox {border-top:0;}

    /* 바깥 카드 제목만 밑줄 (위 중첩 해제보다 뒤에 둬야 이긴다) */
    .order_page .order_side > .order_box > .order_tit,
    .order_page .order_side > .how_to_pay > .order_tit {padding:0 0 var(--space-4, 16px); border-top:0; border-bottom:1px solid var(--color-neutral-80, #EBEBEB);}
    .order_page .order_side .order_tit strong {font-size:16px; line-height:24px;}
    /* 우측 카드는 제목에 margin 대신 padding만 쓴다(좌측 여백 규칙이 겹치지 않도록) */
    .order_page .order_side > .order_box > .order_tit,
    .order_page .order_side > .how_to_pay > .order_tit {margin-bottom:var(--space-4, 16px);}
    .order_page .order_side .order_box fieldset,
    .order_page .order_side .order_box .toggleBox {padding-top:0;}
    .order_page .order_side .infoFormBox {padding:0;}

    /* 금액 줄 */
    .order_page .order_side dl {display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-3, 12px);}
    .order_page .order_side dl + dl {margin-top:var(--space-2, 8px);}
    .order_page .order_side dt {font-size:14px; line-height:20px; color:var(--color-neutral-20, #555);}
    .order_page .order_side dd {font-size:14px; line-height:20px; font-weight:500; color:var(--color-neutral-5, #222); text-align:right;}

    /* 총 결제금액 — 모바일 구분용 8px 회색 띠 제거 */
    .order_page .order_side .sum_prc_wrap,
    .order_page .order_side .order_box .sum_prc_wrap {padding:0; border-top:0;}
    .order_page .order_side .sum_prc dt {font-size:16px; font-weight:700; color:var(--color-neutral-5, #222);}
    .order_page .order_side .sum_prc dd.total {font-size:22px; line-height:30px; font-weight:700;}

    /* 적립금 입력 */
    .order_page .order_side input[type=text] {width:100%; height:44px; padding:0 var(--space-3, 12px); border:1px solid var(--color-neutral-70, #DFDFDF); border-radius:var(--radius-1, 4px); text-align:right;}

    /* 청약 재확인 — 테두리 없이 버튼 바로 위에 둔다 */
    .order_page .order_side .order_box.topLine {margin:0; padding:0 0 var(--space-3, 12px); border:0;}

    /* 결제 버튼 */
    .order_page .order_side .btn_pay_wrap {margin:0;}
    .order_page .order_side .order_payment_btn {display:block; width:100%; height:56px; border:0; border-radius:var(--radius-1, 4px); font-size:17px; font-weight:700;}
}

/* ==========================================================================
   주문쿠폰적용 레이어 — PC(1024px~)
   order/layer_coupon_apply_order.php · 모바일 전체화면 → PC 중앙 카드
   ※ 옵션 선택 레이어(#popupOption)와 같은 방식 — gd_layout.css 참고
   ========================================================================== */

@media (min-width: 1024px) {
    #wrap.pcReady #couponOrderApplyLayer .layer_coupon_apply_order {position:fixed !important; left:50% !important; top:50% !important; right:auto !important; bottom:auto !important; transform:translate(-50%, -50%) !important; z-index:320; width:560px !important; max-width:calc(100% - 40px) !important; height:auto !important; max-height:calc(100vh - 80px); margin:0 !important; padding:0 !important; border-radius:var(--radius-3, 12px); background:var(--color-common-100, #fff); box-shadow:var(--shadow-strong, 0 2px 12px rgba(0, 0, 0, .15)); overflow:hidden; display:flex; flex-direction:column;}

    /* 제목 — 모바일은 absolute로 띄워 두지만 카드에서는 고정 머리로 */
    #wrap.pcReady #couponOrderApplyLayer .layer_coupon_apply_order .ly_head {position:static !important; width:auto !important; flex:none; display:flex; align-items:center; height:56px; padding:0 56px 0 var(--space-5, 20px); border-bottom:1px solid var(--color-neutral-80, #EBEBEB);}
    #wrap.pcReady #couponOrderApplyLayer .layer_coupon_apply_order .ly_head .h_tit {margin:0; font-size:18px; line-height:1.4; font-weight:700;}

    /* 닫기 — 머리 높이에 세로 가운데 */
    #wrap.pcReady #couponOrderApplyLayer .layer_coupon_apply_order .close_btn {top:0; right:var(--space-2, 8px); display:flex; align-items:center; height:56px;}

    /* 본문만 스크롤 — 카드 밖으로 넘치지 않게 */
    #wrap.pcReady #couponOrderApplyLayer .layer_coupon_apply_order .ly_content {flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain;}

    /* 하단 버튼: 화면 고정 해제 → 카드 안쪽 */
    #wrap.pcReady #couponOrderApplyLayer .layer_coupon_apply_order .btn_box {position:static !important; left:auto !important; bottom:auto !important; width:auto !important; flex:none; border-top:1px solid var(--color-neutral-80, #EBEBEB);}

    /* 레이어 안의 상품 목록은 주문서 본문이 아니므로 PC 2단 규칙이 닿으면 안 된다
       (.order / .pay 클래스를 그대로 쓰고 있어 .order_page 로 범위를 좁혀 둔 상태) */
    #wrap.pcReady #couponOrderApplyLayer .order {max-width:none; margin:0; padding:0;}
}

/* ==========================================================================
   주문완료 — PC(1024px~)
   order/order_end.php
   ※ 모바일은 기존 그대로 — PC 전용 변경은 아래 @media 안에만 둘 것
   ※ 시안의 주문상품 목록·배송정보·결제정보 상세는 현재 이 페이지 마크업에 없다
      (데이터 바인딩부터 필요) → 여기서는 있는 요소만 PC 폭으로 재배치한다
   ========================================================================== */

@media (min-width: 1024px) {
    .order_end {max-width:calc(var(--layout-max, 1280px) + var(--layout-margin, 20px) * 2); margin:0 auto; padding:var(--space-12, 48px) var(--layout-margin, 20px) var(--space-16, 64px); letter-spacing:var(--letter-spacing-base, -0.006em);}
    .order_end * {box-sizing:border-box;}

    /* 페이지 타이틀 */
    .order_end::before {content:'주문완료'; display:block; margin-bottom:var(--space-6, 24px); font-size:28px; line-height:38px; font-weight:700; color:var(--color-neutral-5, #222);}

    /* 완료 안내 배너 */
    .order_end .tx2 {margin:0 0 var(--space-6, 24px); padding:var(--space-8, 32px) var(--space-6, 24px); border:1px solid var(--color-neutral-5, #222); background:var(--color-common-100, #fff); text-align:center;}
    .order_end .tx2 strong {display:block; margin-bottom:var(--space-2, 8px); font-size:20px; line-height:28px; font-weight:700; color:var(--color-neutral-5, #222);}
    /* 모바일은 두 줄을 왼쪽으로 맞춰 두지만(.tx2 span{text-align:left}) PC 배너에서는 가운데로 */
    .order_end .tx2 span {display:block; font-size:15px; line-height:22px; color:var(--color-neutral-30, #707070); text-align:center;}

    /* 안내 문단(결제 완료/실패 등) */
    .order_end .order_end_box {margin:0 0 var(--space-6, 24px); padding:0;}
    .order_end .order_end_box .tx {padding:0; font-size:16px; line-height:24px; text-align:center;}

    /* 주문번호·금액·결제수단 */
    .order_end .order_end_box .orderNoBox {margin-top:0;}
    .order_end .orderNoBox table {width:100%; border-top:1px solid var(--color-neutral-5, #222);}
    .order_end .orderNoBox th,
    .order_end .orderNoBox td {padding:var(--space-4, 16px) var(--space-2, 8px); border-bottom:1px solid var(--color-neutral-80, #EBEBEB); font-size:15px; line-height:22px; vertical-align:middle;}
    .order_end .orderNoBox th {width:180px; text-align:left; font-weight:500; color:var(--color-neutral-30, #707070);}
    .order_end .orderNoBox td {font-weight:500; color:var(--color-neutral-5, #222);}
    .order_end .orderNoBox .prc,
    .order_end .orderNoBox .c_red {font-size:18px; font-weight:700;}

    /* 하단 버튼 — 가운데 나란히 */
    .order_end .btn_pay_wrap {display:flex; justify-content:center; gap:var(--space-3, 12px); margin-top:var(--space-10, 40px); padding:0;}
    .order_end .btn_pay_wrap li {flex:0 0 auto; margin:0; padding:0; list-style:none;}
    .order_end .btn_pay_wrap a {display:flex; align-items:center; justify-content:center; min-width:200px; height:56px; padding:0 var(--space-6, 24px); border-radius:var(--radius-1, 4px); font-size:16px; font-weight:700;}
    .order_end .btn_pay_wrap .order_home_btn {border:1px solid var(--color-neutral-70, #DFDFDF); background:var(--color-common-100, #fff); color:var(--color-neutral-5, #222);}
    .order_end .btn_pay_wrap .order_my_btn {border:1px solid var(--color-neutral-5, #222); background:var(--color-neutral-5, #222); color:var(--color-common-100, #fff);}
}

/*** 주문서 수량 변경 | order/order.html ***/
/* 옵션이 없는 상품은 이 컨트롤이 행의 마지막 요소라, 아래 여백이 없으면 구분선에 붙는다 */
.order .order_qty {display:inline-flex; align-items:center; margin:12px 0 4px; border:1px solid #DFDFDF; overflow:hidden;}
.order .order_qty button {width:36px; height:36px; border:0; background:#fff; font-size:0; position:relative;}
.order .order_qty button::before {content:''; position:absolute; left:50%; top:50%; width:11px; height:1px; margin:-1px 0 0 -6px; background:#555;}
.order .order_qty button.js_qty_plus::after {content:''; position:absolute; left:50%; top:50%; width:1px; height:11px; margin:-6px 0 0 -1px; background:#555;}
.order .order_qty button:disabled {opacity:.4;}
/* 수량이 여러 자리여도 다 보이도록 — 44px에서는 두 자리부터 잘렸다 */
.order .order_qty input {width:64px; height:36px; padding:0 4px; border:0; border-left:1px solid #DFDFDF; border-right:1px solid #DFDFDF; border-radius:0; text-align:center; font-size:14px; color:#222;}

/* ==========================================================================
   주문서에서 열리는 레이어 PC
   - #popupCouponApply  쿠폰 적용        (order/layer_coupon_apply.html,
                                          order/layer_coupon_apply_order.html)
   - #popupShipping     배송지 추가/변경 (mypage/layer_shipping_address_regist.html)
   - 복수배송지 상품 선택 (order/shipping_goods_select.html · .layer_option.order)
   .layerWrap 구조가 아니라 gd_layout.css 의 PC 모달 규칙이 걸리지 않는다.
   ※ 쿠폰 레이어는 .ly_wrap 없이 #popupCouponApply 에 바로 append 된다(_order_js.html:294)
     — 그래서 래퍼가 아니라 '레이어 루트'를 카드로 만든다.
   스크롤은 카드가 맡고 머리말·버튼은 sticky 로 고정한다.
   @entwiz 2026-08-27
   ========================================================================== */
@media (min-width: 1024px) {
    #wrap.pcReady #popupCouponApply .layer_coupon_apply,
    #wrap.pcReady #popupCouponApply .layer_coupon_apply_order,
    #wrap.pcReady #popupShipping .layer_shipping_address_regist,
    #wrap.pcReady .ly_pop .layer_option.order {position:fixed !important; left:50% !important; top:50% !important; right:auto !important; bottom:auto !important; transform:translate(-50%, -50%) !important; display:flex !important; flex-direction:column; width:640px !important; max-width:calc(100% - 40px) !important; height:auto !important; max-height:calc(100vh - 80px) !important; margin:0 !important; padding:0 !important; border-radius:var(--radius-3, 12px); background:var(--color-common-100, #fff) !important; box-shadow:var(--shadow-strong, 0 2px 12px rgba(0, 0, 0, .15)); overflow-y:auto; overscroll-behavior:contain;}

    /* 스크롤바 — 기본 트랙이 카드 모서리를 덮어 radius 가 각져 보인다 */
    #wrap.pcReady #popupCouponApply > div::-webkit-scrollbar,
    #wrap.pcReady #popupShipping > div::-webkit-scrollbar {width:10px;}
    #wrap.pcReady #popupCouponApply > div::-webkit-scrollbar-track,
    #wrap.pcReady #popupShipping > div::-webkit-scrollbar-track {background:transparent;}
    #wrap.pcReady #popupCouponApply > div::-webkit-scrollbar-thumb,
    #wrap.pcReady #popupShipping > div::-webkit-scrollbar-thumb {border:3px solid transparent; border-radius:5px; background:var(--color-neutral-70, #DFDFDF); background-clip:padding-box;}

    /* 모바일 전체화면용 래퍼(height:100% + 위아래 큰 패딩)를 푼다 */
    #wrap.pcReady #popupCouponApply .st-container,
    #wrap.pcReady #popupShipping .st-container {height:auto; padding:0; overflow:visible;}
    /* 본문은 카드 흐름 그대로 — 안쪽에 스크롤을 또 만들지 않는다 */
    #wrap.pcReady #popupCouponApply .ly_ct,
    #wrap.pcReady #popupCouponApply .ly_content,
    #wrap.pcReady #popupShipping .ly_ct,
    #wrap.pcReady #popupShipping .ly_content {height:auto; max-height:none; overflow:visible;}

    /* 제목 줄 */
    #wrap.pcReady #popupCouponApply .ly_head,
    #wrap.pcReady #popupShipping .ly_head,
    #wrap.pcReady .ly_pop .layer_option.order .ly_head {position:sticky; top:0; left:auto; z-index:3; width:auto; height:60px; padding:0 56px; border-bottom:1px solid var(--color-neutral-80, #EBEBEB); background:var(--color-common-100, #fff); line-height:60px;}

    /* 닫기(X)는 마크업상 본문 뒤라 스크롤에 밀린다 — 담은 래퍼를 flex 로 세워 첫 자리로 올린다 */
    #wrap.pcReady #popupCouponApply :has(> .close_btn),
    #wrap.pcReady #popupShipping :has(> .close_btn),
    #wrap.pcReady .ly_pop .layer_option.order :has(> .close_btn) {display:flex; flex-direction:column;}
    #wrap.pcReady #popupCouponApply .close_btn,
    #wrap.pcReady #popupShipping .close_btn,
    #wrap.pcReady .ly_pop .layer_option.order .close_btn {order:-1; position:sticky; top:0; left:auto; right:auto; z-index:5; align-self:flex-end; width:auto; height:0;}
    #wrap.pcReady #popupCouponApply .lys_close_btn,
    #wrap.pcReady #popupShipping .lys_close_btn,
    #wrap.pcReady .ly_pop .layer_option.order .lys_close_btn {position:relative; top:18px; right:20px; cursor:pointer;}

    /* 하단 버튼(쿠폰 사용하기 등)은 카드 바닥에 고정 */
    #wrap.pcReady #popupCouponApply .btn_box,
    #wrap.pcReady #popupShipping .btn_box,
    #wrap.pcReady .ly_pop .layer_option.order .btn_box {position:sticky; left:auto; bottom:0; z-index:3; width:auto; max-width:none; transform:none; padding:var(--space-4, 16px) var(--space-6, 24px); border-top:1px solid var(--color-neutral-80, #EBEBEB); background:var(--color-common-100, #fff);}
    #wrap.pcReady #popupCouponApply .btn_box button,
    #wrap.pcReady #popupShipping .btn_box button,
    #wrap.pcReady .ly_pop .layer_option.order .btn_box button {height:48px; cursor:pointer;}

    /* 배송지 등록의 버튼 줄은 display:table(gd_common.css:384) 이라
       칸이 글자 폭으로 쪼그라든다 — 두 버튼이 반씩 나눠 갖도록 flex 로 바꾼다 */
    #wrap.pcReady .ly_pop .layer_shipping_address_regist .btn_box {display:flex; gap:var(--space-2, 8px); margin-top:var(--space-4, 16px);}
    #wrap.pcReady .ly_pop .layer_shipping_address_regist .btn_box li {display:block; flex:1; width:auto;}
    #wrap.pcReady .ly_pop .layer_shipping_address_regist .btn_box li button {width:100%;}
}