@charset "utf-8";

/* 공통 */
.login_wrap {background:#f7f7f7;}
.login_header {z-index:9; position: fixed; top: 0; left: 0; width: 100%; height:55px; padding-top:15px; text-align: center; background:#fff; border-bottom:1px solid #eee; box-sizing:border-box;}
.login_header h1 {font-size:17px; font-weight:bold; color:#000;}
.login_header button.close {position:absolute; top:19px; left:15px; width:15px; height:15px; background: url('/login/new/img/btn_close.png?t=1') no-repeat; background-size:cover;}
.login_header button.prev {position:absolute; top:19px; left:15px; width:20px; height:15px; background: url('/login/new/img/btn_prev.png?t=1') no-repeat; background-size:cover;}
.login_content {padding: 85px 15px 40px 15px;}
.login_btn button {width:100%; height:50px; margin-top:10px; font-size:16px; font-weight:400;}
.ml30 {margin-left:30px !important;}
.mt0 {margin-top:0 !important;}
.mt15 {margin-top:15px !important;}
.mb0 {margin-bottom:0 !important;}
.f12 {font-size:12px !important;}

/* 21.03.15 추가 */
.full_content {height:100%; padding:0}
.payment_content {padding: 70px 15px 80px 15px;}
.pixed_btn {position: fixed;bottom: 0;left: 0; width:100%}
.pixed_btn button {border-radius: 0 !important;}

/*키컬러 - 버튼 */
.none_box {color:#fff; background:#b3b3b3; border-radius:5px; transition:0.5s}
.default_box {color:#fff; background:#222450 !important; border-radius:5px; transition:0.5s}
.gray_line {color:#999; border:1px solid #ccc; border-radius:5px; transition:0.5s}
.key_line {color:#222450; border:1px solid #222450; border-radius:5px; transition:0.5s}
.red_clr {color:#ff4040 !important;}

/* input - form_group 공통 - bottom 라인 스타일 */
.form_group {position:relative; margin-bottom:25px;}
.form_group input, .form_group textarea {position: relative;display: block;width: 100%; padding:5px 50px 0 10px; border: none;border-bottom: 1px solid #e5e5e5;background-color: transparent;margin: 0px auto; height: 50px; outline: none !important;font-size: 15px;color: #000; letter-spacing: 0.5px; background-position: left bottom;background-size: 0 1px;background-repeat: no-repeat;transition: all .2s ease-in-out; box-sizing: border-box; }
.form_group input:focus { border-color: #000; }
.form_group textarea:focus { border-color: #000; }
.form_group input:valid + label, .form_group input:focus + label, .form_group textarea:valid + label, .form_group textarea:focus + label { top:-5px; height: 20px; line-height: 20px; font-size: 12px; color: #999;}
.form_group input:read-only + label {top:-5px; height: 20px; line-height: 20px; font-size: 12px; color: #999;}

.file_box label.imgurl {top:-5px !important; height: 20px; line-height: 20px; font-size: 12px; color: #999;}

.form_group label {position: absolute;top: 0; left: 0;text-align: left;display: block;width: 100%;height: 50px; margin: 0px auto; padding-left:10px; line-height: 50px;text-transform: uppercase;font-size: 15px; background: transparent; cursor: text;transition: all .15s ease-in-out; box-sizing: border-box; }
.form_group label em {color:#999;}

.form_error input, .form_error textarea {border-bottom:1px solid #ff4040;}
.form_error input:focus { border-color: #ff4040; }
.form_error textarea:focus { border-color: #ff4040; }
.form_error label { top:-5px; height: 20px; line-height: 20px; font-size: 12px !important; color: #ff4040;}
.form_error input:valid + label, .form_error input:focus + label, .form_error textarea:valid + label, .form_error textarea:focus + label { top:-5px; height: 20px; line-height: 20px; font-size: 12px; color: #ff4040;}
.form_error p {text-align: left; font-size: 12px !important; margin: 5px 0 0 10px;color: #ff4040 !important;}

.form_tel::after {content: ''; display: table; clear: both}
.form_tel label { top:-7px; height: 20px; line-height: 20px; font-size: 12px; color: #666;}
.form_tel input {float:left; display: inline-block; width:30%; margin:0 0 0 5%; padding-right:10px; text-align:center;}
.form_tel select {float:left; padding: 6px 5px 0 10px; width: 30%; height: 50px; border: none; border-bottom: 1px solid #e5e5e5; font-size: 15px; color: #000; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; background: url('/login/new/img/sel_arrow@2x.png?t=1') no-repeat 90% 58%; background-size:9px}

.form_group button {position:absolute; bottom:12px; right:10px; height:25px; padding:0 7px; font-size:12px; color:#fff; background:#b3b3b3; border-radius: 5px;}
.form_group img.naver {position:absolute; bottom:12px; right:10px; width:20px;}

/* 체크, 라디오 박스 공통 */
/* Basic styles */
input[type="checkbox"], input[type="radio"] {position: absolute;opacity: 0;z-index: -1;}
.checkbox label {position: relative;display: inline-block;padding: 0 0 0 30px;height: 1.5em;line-height: 1.5;cursor: pointer; transition: .3s}
.checkbox label::before,
.checkbox label::after {position: absolute;top: 0;left: 0;display: block; width:20px; height:20px; border-radius: 3px; transition: .3s}
.checkbox label::before { content: " "; background:#ccc url('/login/new/img/btn_check.png?t=1') center no-repeat; background-size:10px;}
.checkbox label a {color:#222450; text-decoration: underline;}

/* Radio */
.radiobox label {position: relative;display: inline-block; margin-right:60px; padding: 0 0 0 30px;height: 1.5em;line-height: 1.5;cursor: pointer; transition: .3s}
.radiobox label::before,
.radiobox label::after {position: absolute;top: 0;left: 0;display: block; width:20px; height:20px; border-radius: 100px; transition: .3s}
.radiobox label::before { content: " "; background:#ccc url('/login/new/img/btn_check.png?t=1') center no-repeat; background-size:10px;}

/* :checked */
.checkbox input[type="checkbox"]:checked + label {color:#222450;}
.checkbox input[type="checkbox"]:checked + label::before {background:#222450 url('/login/new/img/btn_check.png?t=1') center no-repeat; background-size:10px;}
.radiobox input[type="radio"]:checked + label {color:#222450;}
.radiobox input[type="radio"]:checked + label::before {background:#222450 url('/login/new/img/btn_check.png?t=1') center no-repeat; background-size:10px;}
.checkbox input[type="checkbox"] + label::after,.radiobox input[type=radio] + label::after {transform: scale(0);}
input[type="checkbox"]:checked + label::after, input[type=radio]:checked + label::after {transform: scale(1);}

/* 라디오 박스형 */
.radio_select {position:relative; padding:1px 0; overflow: hidden; font-size:0;}
.radio_select input {position: absolute !important; height: 1px;width: 1px;border: 0;overflow: hidden;}
.radio_select label {width:110px; height:45px; display:inline-block; margin-right:-1px; margin-top:-1px; font-size:13px; text-align: center; color:#777; line-height:43px; border: 1px solid #d4d4d4; background:#fff; transition: all 0.1s ease-in-out; box-sizing: border-box;}
.radio_select label:hover {z-index: 1; position: relative; border:1px solid #159fda; cursor: pointer;}
.radio_select input:checked + label {z-index: 1; position: relative; color:#159fda; border:1px solid #159fda;}

/* 셀렉트박스 - 기본 */
.custom-select {position: relative}
.custom-select+.custom-select {margin-top: 10px;}
.custom-select select {display: none}
.custom-select ul {display: none;position: absolute; left: 0; top: 100%; max-height: 500px; margin-top: -1px; right: 0; background: #fff; border: 1px solid #888; z-index: 3; overflow: auto; }
.custom-select li {height:35px; text-align:center; line-height:35px; color: #000; cursor: pointer;}
.custom-select li:hover {background: #ececec}
.custom-select .new-select {position: relative; display: block; width: 100%; height:35px; padding:0 33px 0 0; font-size:14px; text-align: center; line-height: 33px; color: #000; border: 1px solid #888; cursor: pointer; box-sizing: border-box;}
.custom-select .new-select:after {content: ""; position: absolute; top:0; right: 0; width:32px; height:33px; background: url(/include/img/order/select_btn.png) center no-repeat; background-position:0 0;}
.custom-select .new-select.active:after {background: url(/include/img/order/select_btn.png) no-repeat; background-position:0 -34px;}

/* 셀렉트박스 - 커스텀 */
.option_select .custom-select .new-select {height:45px; padding-left:20px; text-align: left; color:#777; line-height: 43px; border: 1px solid #d4d4d4; }
.option_select .custom-select ul {border: 1px solid #d4d4d4;}
.option_select .custom-select li {height:45px; padding-left:20px; text-align:left; line-height:45px; color: #777; cursor: pointer;}
.option_select .custom-select .new-select:after {top: 5px;}

/* 리스트 스타일 */
.ul_default {margin-top:40px;}
.ul_default li {margin-bottom:8px; padding-left:9px; text-align: left; background:url(/login/new/img/bullet.png?t=1) left 10px  no-repeat; background-size:2px; word-break: keep-all;}
.ul_default li:last-child {margin-bottom:0;}

/* 로그인 */
.login_btn2 button {width:49%; height:50px; margin-top:10px; font-size:14px; font-weight:400;}
.login_btn2 .naver {padding-left:45px; color:#fff; background:#1ec700 url(/login/new/img/btn_naver.png) top left no-repeat; background-size:contain; border-radius:5px; border:1px solid #38a01d;}
.login_btn2 .naver100 {width:100%;}
.login_btn2 button:last-child {float:right;}
.login_btn3 {margin-top:20px; text-align: center;}
.login_btn3 a {margin:0; padding:0 12px; border-right:1px solid #d9d9d9;}
.login_btn3 a:last-child {border:none;}
.login_btn3 a em {text-decoration: underline;}

.login_btns {display:flex; justify-content: space-between}
.login_btns button {width:49%; height:50px; margin-top:10px; font-size:14px; font-weight:400; border-radius: 5px;}
.login_btns button img {display: inline-block; height: 22px; margin: -3px 10px 0 0; vertical-align: middle;}
.login_btns.num3 button {width:39%}
.login_btns.num3 button:last-child {width:18%}
button.naver {color: #fff; background: #1ec800;}
button.apple {color: #fff; background: #000;}
button.kakao {color:#1a1a1a; background:#FEE500;}
button.google {color:#1a1a1a; bbackground: #fff; border:1px solid #d9d9d9;}
.login_btn_50 {display:flex; justify-content: space-between}
.login_btn_50 button {width:50%; height:50px; margin-top:10px; font-size:14px; font-weight:400; border-radius: 5px;}


/* 마이페이지 */
.login_text {margin-top:20px; line-height:30px; text-align: center;}
.login_text span {font-size:24px; font-weight:bold; color:#222450;}
.my_info {margin-top:50px; text-align: center}
.my_info a {display: inline-block; width:49%; font-size:14px; color:#333;}
.my_info a span {margin-left:5px;}
.my_info a:first-child {border-right:1px solid #ccc;}
.my_info a img {width:60px; margin:0 auto 13px auto;}

/* 계정관리 */
.term_wrap {}
.term_wrap h3 {font-size:15px; color:#000;}
.term_wrap div {margin-top:15px;}
.term_wrap div::after {content: ''; display: table; clear: both}
.term_wrap div button {float:left; width:24%; height:35px; margin-right:1.33%; font-size:12px; color:#999; border:1px solid #ccc; border-radius: 5px}
.term_wrap div button:last-child {margin:0;}
.term_wrap div button.active {color:#222450; border:1px solid #222450}

/* 쿠폰 */
.coupon_p {margin:10px 0 30px 0; text-align:center;}
.coupon_p em {font-weight: bold; color:#222450}
.coupon_list > li {margin-bottom:7px; padding:20px; text-align: left; background: #fff; border:1px solid #ebebeb; border-radius:7px; box-shadow: 3px 3px 1px 0px #ebebeb;}
/*.coupon_list > li {padding:20px 10px; border-bottom:1px solid #e5e5e5;}
.coupon_list > li:last-child {border-bottom:1px solid #222450;}*/
.coupon_list > li p {margin-bottom:7px; font-size:16px; line-height:23px; text-align: left; color:#000; word-break: keep-all;}

/* 회원가입 */
.agree_box {margin:15px 0 0 15px;}
.agree_box em {font-size:12px; color:#b3b3b3}
.agree_box em.nece {color:#ff4040}
.login_check em {font-size:12px; color:#b3b3b3}
.login_check em.nece {color:#ff4040}
.all_agree {font-size:15px; color:#333; font-weight:bold}

/* 레이어 */
.layer_pop {width: 80%; height: auto; position: absolute; display:none; background: #fff;}
.layer_pop article { height:50px; padding: 15px; background:#222450; box-sizing: border-box;}
.layer_pop article h3 {font-size:16px; color:#fff;}
.layer_pop article button {position:absolute; top:17px; right:15px; width:13px; height:13px; background: url(/login/new/img/btn_close2.png) no-repeat; background-size:13px}
.layer_pop img {width:100%}
.layer_pop .con {padding:30px 0}
p {text-align: center;}
.layer_pop .con .btns {margin-top:20px; text-align: center;}
.layer_pop .con .btns button {height:32px; margin: 0 2px; padding: 0 25px; color:#fff; background:#b3b3b3;}

/* 레이어 */
.number_layer {position: absolute; display:none; width:90% !important; background: #fff;     top: 70px !important;}
.number_layer_400 {position: absolute; display:none; width:90% !important; background: #fff;}
.number_layer .layer_content {height:549px;}
.number_layer_400 .layer_content_400 {height:400px;}
.number_layer .layer_content iframe {width:100%; height:650px}
.number_layer_400 .layer_content_400 iframe {width:100%; height:400px;}
.number_layer .layer_content_250 iframe {width:100%; height:250px;}
.number_layer button.b-close {position:absolute; top:17px; right:15px; width:13px; height:13px; background: url(/number/img/btn_close2.png) no-repeat; background-size:13px; padding: 0; margin: 0; border-radius: 0; border: none;}
.number_layer_400 button.b-close {position:absolute; top:17px; right:15px; width:13px; height:13px; background: url(/number/img/btn_close2.png) no-repeat; background-size:13px; padding: 0; margin: 0; border-radius: 0; border: none;}
.layer_box h1 {height:50px; padding: 15px; font-size:16px; color:#fff; background:#222450; box-sizing: border-box;}
.layer_box .con_box {padding:20px 15px}
.layer_box .con_box > p {text-align: center}

.layer_box h3 {font-family:'Montserrat','YoonGothicPro760',sans-serif; font-size:14px; color:#222450}
.layer_box .ul_default {margin-top:15px}
.layer_box .ul_default li {font-size:12px; margin-bottom:5px; line-height:19px}
.layer_box .ul_default li span.red {color:#ff4040}
.layer_box .con_box {height:480px; box-sizing:border-box; overflow-y: scroll}

.coupon_wrap .layer_box .con_box {padding-bottom:50px;}
.coupon_wrap .radiobox {position:relative}
.coupon_wrap .radiobox label {margin-right:0; padding-right:70px}
.coupon_wrap .radiobox label span.date {font-size:12px; color:#999 !important}
.coupon_wrap .radiobox p.price {position:absolute; top:-2px; right:0; color:#ff4040; font-weight:500}
.coupon_wrap .form_box {display:block; padding:15px; border-top:1px solid #e5e5e5; background:#fff;}
.coupon_wrap .form_box .total_dl {margin-top:10px}
.coupon_wrap .form_box .total_dl dt {font-size:14px; font-weight:600}
.coupon_wrap .form_box .total_dl dd {color:#ff4040}
.coupon_wrap .form_box .total_dl dd em {font-size:18px; font-weight:600}

/* 레이어 모바일 */
.number_layer.m_box {width:320px !important;}

/* 탭 디폴트 */
.tab_default {width:100%;}
.tab_default ul.tab_btn_wrap::after {content: ''; display: table; clear: both}
.tab_default ul.tab_btn_wrap > li {display: table; float:left; width:50%; height:40px; font-size:12px; color:#b3b3b3; text-align: center; cursor: pointer; border:1px solid #e5e5e5; border-bottom:1px solid #222450; box-sizing: border-box;}
.tab_default ul.tab_btn_wrap > li:first-child {border-right:none;}
.tab_default ul.tab_btn_wrap > li:last-child {border-left:none;}
.tab_default ul.tab_btn_wrap > li.active {z-index: 1; color:#222450; border:1px solid #222450;  border-bottom:none}
.tab_default ul.tab_btn_wrap > li > span {display: table-cell; vertical-align: middle; text-align: center;}
.tab_cont_wrap {margin-top:20px ;}
.tab_cont_wrap .cont_box, .tab_cont_wrap2 .cont_box2, .tab_cont_wrap2_1 .cont_box2_1, .tab_cont_wrap3 .cont_box3 {display: none}
.tab_cont_wrap .cont_box:first-child {display: block;}

/* 탭3 */
.tab_default ul.tab3 > li {width: 33%;}

/* 탭 - 딜리버리 */
.tab_delivery ul.tab_btn_wrap > li {width:25%; border:none; border-bottom:1px solid #e5e5e5}
.tab_delivery ul.tab_btn_wrap > li.active {border:none; border-bottom:1px solid #222450}

.tab_default ul.tab_btn_wrap > li > span {display: table-cell; vertical-align: middle; text-align: center;}
.tab_cont_wrap {margin-top:20px ;}
.tab_cont_wrap .cont_box, .tab_cont_wrap2 .cont_box2, .tab_cont_wrap2_1 .cont_box2_1, .tab_cont_wrap3 .cont_box3 {display: none}
.tab_cont_wrap .cont_box:first-child {display: block;}

/* 주문결제 */
.payment_p {font-family:'Montserrat','YoonGothicPro760',sans-serif; font-size:18px; color:#222450; text-align:center;}
.payment_p img {width:104px; margin:0 auto 25px auto}
.img_vtical {display: flex; height:100%; align-items: center; justify-content: center; overflow-y: hidden}
.loading_img {width:50px;} 
.payment_list > li {position:relative; padding:17px 15px; margin-bottom:15px; transition: .5s}
.payment_list > li::after {content:""; display: table; clear: both}
.payment_list > li.active {/*border:1px solid #222450;*/ transition: .5s}
.payment_list > li h3 {float:left; font-family:'Montserrat','YoonGothicPro760',sans-serif; font-weight:500; font-size:14px; color:#000;}
.payment_list > li h3 .img {display: inline-block; opacity:0.6; width:15px; margin:-2px 0 0 3px; vertical-align: middle}
.payment_list > li p.sub {float:right; margin:0 25px 0 0; font-size:12px; color:#666}
.payment_list > li span {display:block; text-align:right}
.payment_list > li span.red {font-size:13px; color:#ff4040}
.payment_list > li span.red em {font-weight:600}
.payment_list > li span.price {display:inline-block; font-size:18px; font-weight:600; vertical-align: middle;}
.payment_list > li button.arrow {opacity:0.3; position:absolute; top:21px; right:7px; width:28px; height:15px; background: url('/img/payment/arrow@2x.png?t=1') center no-repeat; background-size:45%; transition: .5s}
.payment_list > li.active button.arrow {opacity:1; transform: rotate(180deg); transition: .5s}
.form_box {display:none; padding-top:17px; margin-top:15px; border-top:1px dashed #e5e5e5; clear:both}
.payment_list > li.active .form_box {display:block;}
.payment_list > li .tit_box {overflow: hidden}
.payment_list .form_group input, .payment_list .form_group textarea {font-size:13px}
.payment_list .form_group label {font-size:13px}
.payment_list .form_group label.read {font-size: 12px; color: #999;}
.payment_list .form_p {margin:20px 0 0 0; font-size:12px; line-height:19px; text-align: left; color:#666;}
.payment_list .form_tel select {font-size:13px}
.form_box dl.price_dl {font-size:12px; display: flex; justify-content: space-between;}
.form_box dl.price_dl dt {color:#333;}
.form_box dl.price_dl dd.use {color:#ff4040; font-weight:500}
.form_box dl.price_dl dd.use em {font-size:15px; font-weight:600;}
.payment_list .method_ul {display:flex; flex-wrap: wrap; justify-content: space-between;}
.payment_list .method_ul li {display:table; width:48.5%; margin:1.5% 3% 1.5% 0; font-size:12px; height:50px; text-align:center; border:1px solid #d9d9d9; box-sizing: border-box; transition: .3s}
.payment_list .method_ul li.active {color:#222450; border:1.5px solid #222450; transition: .3s}
.payment_list .method_ul li.disabled {opacity:0.5}
.payment_list .method_ul li:nth-child(2n) {margin-right:0}
.payment_list .method_ul li span {display:table-cell; vertical-align: middle; text-align: center}
.payment_list .method_ul li span img {height:22px; margin:0 auto;}
.gift_box .form_group {}
.gift_box .form_group input {width:72%; height:30px; margin:0; padding:3px 8% 0 15px; text-align:right;}
.gift_box .form_group span.won {position:absolute; right:30%; top:5px;}
.gift_box .form_group button {position:absolute; bottom:0; right:0; width:23%;}
.gift_box.off {opacity:0.5}
.order_list {}
.order_list li {position:relative; display:flex; align-items: center; flex-wrap: wrap; margin-top:20px; padding:20px 0 35px 0; border-top:1px solid #e5e5e5;}
.order_list li:first-child {margin-top:0; padding-top:0; border:0;}
/*.order_list li img.thumb {width:35%;}*/
.order_list li div.thumb {width:35%; height:100px; text-align: center; line-height:100px; box-sizing: border-box;}
.order_list li div.thumb img {display: inline-block; max-width: 100%; max-height: 100%; vertical-align: middle;}
.order_list li .info {width:54%; margin-left:7%}
.order_list li .info h4 {margin:0px 0 7px 0; font-family:'Montserrat','YoonGothicPro760',sans-serif; font-size:14px; color:#333}
.order_list li .info p {margin-bottom:0; font-size:12px; color:#666; text-align:left;}
.order_list li .info p span {display:inline-block; text-align: left;}
.order_list li .info p em.line {display:inline-block; margin:-1px 8px 0 8px; font-size:10px; color:#b2b2b2; vertical-align: top;}
.order_list li .info p.option {width:100%; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.order_list li .info p.price {font-size:14px; color:#ff4040; font-weight:600;}
.order_list li .info p.price span.sale {font-size:12px; color:#999; font-weight:normal;}
.order_list li > .btns2 {position:absolute; bottom:0; right:0; width:100%; text-align:right;}
.order_list li > .btns2 button {width:23%; height:25px; margin-left:3px; padding:0 7px; font-size:12px; color:#fff; background:#b3b3b3; border-radius: 5px;}
.delivery_slect select {width: 100%; background:url(/login/new/img/sel_arrow@2x.png?t=1) no-repeat 95% 58%; background-size: 9px;}
.d_input input {height:37px; padding: 0 15px; font-size:12px !important; border: 1px solid #e5e5e5; border-radius: 5px;}
.d_input input:focus { border: 1px solid #000;}
.delivery_list li {padding: 15px 0 0px 0; margin-top:15px; align-items: center; justify-content: space-between;}
.delivery_list .radiobox label {margin-right:0}
.delivery_list .info {width:65% !important; margin-left:10px !important}
.delivery_list .info h4 {margin:0 0 10px 0 !important}
.delivery_list .info p {margin-bottom:5px !important; line-height: 20px}
.delivery_list .info span {text-align: left; color:#999}
.delivery_list li div.btns {width:18%; text-align: right}
.delivery_list li div.btns button {display: block; width:100%; height:25px; margin:6px 0; padding:0 7px; font-size:11px; color:#777; border:1px solid #777; border-radius: 4px;}
.delivery_list li div.btns button.del {color:#ff4040; border:1px solid #ff4040;}
.delivery .form_group button {bottom:auto; top:12px}
.form_coupon {margin-bottom:20px;}
.form_coupon select {padding: 0 15px; width: 100%; height: 35px; border: 1px solid #e5e5e5; font-size: 12px; color: #000; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; background: url('/login/new/img/sel_arrow@2x.png?t=1') no-repeat 95% 50%; background-size:9px}
.coupon_box {margin-bottom:20px; border-bottom:1px dashed #e5e5e5}
.coupon_box h4 {font-family:'Montserrat','YoonGothicPro760',sans-serif; font-size:13px; color:#1a1a1a; font-weight:500;}
.coupon_box > div.txt {display:flex; justify-content: space-between; margin:5px 0 10px 0; font-size:12px; color: #999 !important;}
.coupon_box > div p.price {font-size:15px; color:#ff4040; font-weight: 500;}
.coupon_box > div p.price span.label {margin-right:7px; padding: 3px 7px;font-size: 11px; font-weight:normal; color: #1a1a1a; background: #FFD659; border-radius: 5px; vertical-align: bottom}

.all_btn_box {position:absolute; bottom:12px; right:10px;}
.all_btn_box button.write {position:relative; bottom:0; right:0; height:25px; padding:0 7px; font-size:12px; color:#fff; background:#b3b3b3; border-radius: 5px;}
.all_btn_box button.del {position:relative; bottom:0; right:0; height:25px; margin-left:2px; padding:0 7px; font-size:12px; color:#fff; background:#ff4040; border-radius: 5px;}

/* 주문배송 */
.order_content {padding: 70px 15px 30px 15px;}
.order_content p.order_num {position:relative; margin-bottom:20px; padding-bottom:15px; text-align:left; border-bottom:1px solid #666;}
.order_content p.order_num button.del {position:absolute; top:-6px; right:0; display: block; height:23px; margin: 6px 0; padding: 0 7px; font-size: 11px; color: #ff4040; border: 1px solid #ff4040; border-radius: 4px;}
.order_content p.order_num em {margin-left:5px; font-weight:600; color:#222450;}
.loading img {margin:0 auto; width:40px; }
.delivery_list2 li {margin-top:0; align-items: center;}
.delivery_list2 li h4 {margin-bottom:2px !important;}
.delivery_list2 li p {margin-bottom:5px !important; line-height:20px;}
.info_list {margin-top:20px; padding-top:20px; border-top:1px solid #666;}
.info_list .info_dl {display:flex; margin-bottom:7px; font-size:12px; line-height:20px;}
.info_list .info_dl dt {width:28%; color:#999}
.info_list .info_dl dd {width:72%; margin:0; color:#333}
.order_content p.footer {margin-top:20px; padding-top:20px; font-size:12px; line-height:19px; border-top:1px solid #666;}
.order_content p.footer em {color:#ff4040; font-weight:600}
.order_content p.footer span {display: block; margin-bottom:10px; font-size:14px; color:#222450; font-weight:600}
.price_list .info_dl dt {color:#333;}
.price_list .info_dl dd {text-align: right}
.price_list .info_dl dd span {font-size:16px; font-weight:500;}
.price_list .total {margin-top:10px; padding-top:15px; border-top:1px solid #e5e5e5;}
.price_list .total dt {font-family:'Montserrat','YoonGothicPro760',sans-serif; font-size:14px;}
.price_list .total dd {color:#ff4040}
.price_list .total dd span {font-size:18px !important; font-weight:600; }
.price_list .sale_box {margin-top:10px; padding-top:10px; border-top:1px solid #e5e5e5;}
.price_list .sale_box dl dt {color:#999}
.price_list .sale_box dl dd {color:#ff4040; font-weight:500}
.pay_method {margin:20px 0;}
.pay_method dl {padding:10px 15px; background:#ededed}
.pay_method p {margin-top:20px; font-size:12px; line-height:19px}
.pay_method p em {color:#222450; font-weight:500}
.pay_method .info_dl button {display:block; height: 25px; margin: 5px 0 0 auto; padding: 0 10px; font-size: 12px;}
.info_list .mp_dl {display:flex; padding:0; font-size:12px; line-height:20px; background: none;}
.price_list .mp_dl dt {width:50%; color:#333;}
.price_list .mp_dl dd {width:50%; text-align:right}
.price_list .mp_dl dd span {font-size:16px; font-weight:500;}
.price_list .mp_dl:first-child {margin-bottom:10px; padding-bottom:10px; border-bottom:1px dashed #d9d9d9;}
.mp_list {margin:10px 0 20px 0; padding:10px 15px; font-size:12px; background: #ededed;}
.mp_box {margin-top: 10px;padding-top: 10px;border-top: 1px solid #e5e5e5;}
.mp_box dl dd {color: #ff4040 !important; font-weight: 500;}
.form_box .mp_list {margin:0;} 
.form_box .mp_list em {color:#ff4040; font-weight:500;}
.mp_ul li {color:#ff4040;}

.mp_input_box {display: flex; justify-content: space-between;}
.mp_input_box button {width:20%; font-size:12px;}
.mp_input h4 {margin:20px 0 5px 0; font-family:'Montserrat','YoonGothicPro760',sans-serif; font-weight:500; font-size:13px; color:#1a1a1a;}
.mp_input .input_box {display: flex; width:77%; border-bottom: 1px solid #222450;}
.mp_input .input_box input {width: 23%; height: 30px;font-size: 14px;font-weight: 600;color: #222450;letter-spacing: 1px;text-align: center;border: none;}
.mp_input .input_box span {font-size: 18px;line-height: 28px;color: #222450;font-weight: 600;}
.mp_input .full_box input {width:100%; padding:0 10px; text-align: left;}
.mp_input .full_box input::placeholder {font-size:12px; font-weight:normal; color:#999;}
.mp_input .mp_txt {margin-top:15px;}
.mp_input .mp_txt .info_dl {display:flex; justify-content: space-between; font-size:12px; line-height:20px;}
.mp_input .mp_txt dl dt {color:#666}
.mp_input .mp_txt dl dd {color:#ff4040; font-weight:500}
.full_input .input_box {width:100%;}

/* 배송 안내 */
.pixed_btns {flex-wrap:wrap;}
.pixed_btns p {width:100%; padding:17px 15px; background: #fff; box-shadow: 0 15px 20px 7px rgb(0 0 0 / 20%);}
.pixed_btns button {width:50%; margin-top:0;}
.info_wrap .layer_box .con_box {padding-bottom:130px;}
.info_wrap .pixed_btns p {font-weight: bold; color:#1a1a1a;}
.info_wrap p span.small {font-size:11px; color:#999;}

/* 테이블 */
.tb_default {width:100%; border-top:1px solid #000; border-bottom:1px solid #dbdbdb;}
.tb_default caption {display: none}
.tb_default th {padding:8px 0; font-size:12px; font-weight:normal; color:#000; background:#f7f7f7;}
.tb_default td {padding:8px 0; font-size:12px; text-align: center; border-bottom:1px solid #f4f4f4;}
.tb_default tr:last-child td {border-bottom:none;}

/* 대량구매 팝업 */
.coupon_wrap h3.bor_bottom {padding-bottom:10px; margin-bottom:15px; border-bottom:1px solid #1a1a1a;}
.coupon_box h4 span.option {position: relative;padding-right: 7px;margin-right: 7px;}
.coupon_box h4 span.option:after {content: ""; position:absolute; top:3px; right:0; width:1px; height:10px; background: #d9d9d9;}
.coupon_box h4 span.option:last-child:after {display:none;}
.coupon_wrap p.manybuy_p {margin-bottom:20px; text-align:left; font-size:12px; line-height:20px;}
.coupon_wrap p.manybuy_p span {display:block; margin-bottom:10px; font-size:13px; color: #ff4040;}

.guest_wrap {margin-top:30px; padding-bottom:30px; border-bottom:1px solid #e5e5e5;}
.guest_wrap h3 {font-family: 'Montserrat','YoonGothicPro760',sans-serif; color:#1a1a1a;}
.tb_use {border-top:2px solid #000; border-bottom:1px solid #dbdbdb;}
.tb_use caption {display: none}
.tb_use th {padding:20px; font-size:14px; font-weight:normal; color:#1a1a1a; border-bottom:1px solid #dbdbdb; background:#f7f7f7;}
.tb_use td {padding:20px; font-size:12px; text-align: left;  border-bottom:1px solid #dbdbdb;}
.tb_use tr:last-child td {border-bottom:none;}
.many_guide {font-size:11px; color:#999; letter-spacing: -0.2px}
.tit_box span.many_btn button {width:50px; height:25px; margin-left:3px; padding:0 7px; font-size:12px; color:#fff; background:#b3b3b3; border-radius: 5px;}
.tit_box span.many_btn.red {text-decoration: underline;} 

/* 탭 - 비회원 */
.tab_line ul.tab_btn_wrap > li {width:50%; border:none; border-bottom:1px solid #e5e5e5}
.tab_line ul.tab_btn_wrap > li.active {border:none; border-bottom:2px solid #222450}
.tab_line ul.tab_btn_wrap > li span {font-size:14px;}
.tab_line ul.tab_btn_wrap > li.active span {font-weight: bold;}

/* popup_nonmember start*/
.popup_box .content .nonmember {padding:0 30px;}
.popup_box .content .nonmember a {
    display:block; 
    background:#fff; 
    border-radius:5px; 
    height:40px; 
    line-height:40px; 
    width:100%; 
    color:#9f9f9f; 
    text-align:center; 
    font-size:12px; 
    font-weight:bold; 
    border:1px solid #dadada;
}

.popup_nonmember .content .nonmemberArea #container {width:100%; margin:auto; text-align:center;}
.popup_nonmember .content .nonmemberArea .taps {font-size:14px; margin:0; padding:0; list-style:none; height:50px; width:100%; position: relative; }
.popup_nonmember .content .nonmemberArea .taps li {
    display: inline-block; 
    text-align:center; 
    cursor: pointer; 
    width:49%; 
    height:38px; 
    font-size:14px; 
    line-height:38px; 
    border-top: 1px solid #e0e0e0;
    border-left: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #222450;
    background: #f1f1f1; 
    margin:0px; 
    position: relative; 
    float:left;
    border-radius:5px 5px 0 0;
}
.popup_nonmember .content .nonmemberArea .taps li.active {background:#fff; border:1px solid #222450; z-index:999; font-weight: bold; border-bottom: 1px solid #fff; color:#222450;}

.newtap11 {position: relative; z-index: 3; border-bottom: #f6f6f6;}
.newtap12 {position: relative; left:0px; z-index: 2;}
.popup_nonmember .content .tab_nonmember {border-top: none; clear: both; position:relative;}
.popup_nonmember .content .tab_nonmember .tap_content {font-size: 14px; display: none; }


.popup_nonmember .content .tab_nonmember .tap_content .nonmember_notice {padding:0;}
.popup_nonmember .content .tab_nonmember .tap_content .nonmember_notice p.title{ font-size:12px; padding:15px 0; border-top:dashed 1px #a9a9a9; text-align:center; }
.popup_nonmember .content .tab_nonmember .tap_content .nonmember_notice ul { overflow:hidden; }
.popup_nonmember .content .tab_nonmember .tap_content .nonmember_notice ul li{text-align:left; padding-left:0px; line-height:22px;}

.popup_nonmember {padding-bottom:30px; border-radius:16px;  color:#6b6a6a; background:#fff; }
.popup_nonmember span.b-close_style{position:absolute; top:20px; right:20px; cursor:pointer;}
.popup_nonmember .content {width:auto;height:auto;}
.popup_nonmember .content .nonmemberArea {overflow:hidden; padding:0 10px; }
.popup_nonmember .content .nonmemberArea p.title{font-size:25px; color:#5d5d5d; padding:30px 0; text-align: left;}
.popup_nonmember .content .nonmemberArea p span{ padding-left:170px; font-size:12px; color:#818181;}

.popup_nonmember .content .nonmemberArea table { width:100%; border-top:1px solid #e1e1e1; }
.popup_nonmember .content .nonmemberArea th { padding:16px 12px; text-align:left; border-bottom:1px solid #e1e1e1; border-right:1px solid #e1e1e1; }
.popup_nonmember .content .nonmemberArea td { padding:8px 12px; border-bottom:1px solid #e1e1e1; text-align:left; }

.popup_nonmember .content .nonmemberArea input.textBox { width:96%; padding:5px 10px; border:solid 1px #bbb; font-size:13px;  color:#555; }
.popup_nonmember .content .nonmemberArea input.textBox2 { width:45px; height:18px; padding:5px 10px; border:solid 1px #bbb; font-size:13px;  color:#555; }
.popup_nonmember .content .nonmemberArea input.textBox3 { width:300px; height:18px; margin-top:3px; padding:5px 10px; border:solid 1px #bbb; font-size:13px;  color:#555; }
.popup_nonmember .content .nonmemberArea input.textBox4 { width:165px; height:18px; padding:5px 10px; border:solid 1px #bbb; font-size:13px;  color:#555; }
.popup_nonmember .content .nonmemberArea select { height:28px; border:solid 1px #bbb; }

.popup_nonmember .content .nonmemberArea .valid_check_box { overflow: hidden; }
.popup_nonmember .content .nonmemberArea .valid_check_box ul { height: 30px; border-left: 1px solid #bbbbbb; }
.popup_nonmember .content .nonmemberArea .valid_check_box li { float: left; }
.popup_nonmember .content .nonmemberArea .valid_check_box li a { display: block; height: 18px; font-size: 13px; color: #555555; padding: 5px 20px;  border-bottom: 1px solid #bbbbbb; border-right:1px solid #bbbbbb; border-top: 1px solid #bbbbbb; }
.popup_nonmember .content .nonmemberArea .valid_check_box li a:hover { background: #e1e1e1; }
.popup_nonmember .content .nonmemberArea .valid_check_box li a:active { background: #a6a6a6; color: #ffffff; }
.popup_nonmember .content .nonmemberArea .valid_check_box li .on { background: #a6a6a6; color: #ffffff; }
.popup_nonmember .content .nonmemberArea .txt11 { font-size: 11px; }

.popup_nonmember .content .nonmemberArea .guide_txt { padding-left:10px; color:#bbb; font-size:11px; }
.popup_nonmember .content .nonmemberArea .overlap_btn { background:#a6a6a6; padding:10px 8px 7px 8px; color:#fff; font-size:11px; line-height:13px; border:0px; }
.popup_nonmember .content .nonmemberArea .file { width:200px;  }
.popup_nonmember .content .nonmemberArea .t_center { text-align:center; color:#6a6a6a; }
.popup_nonmember .content .nonmemberArea .t_center span { color:#ff2917; }

.popup_nonmember .content .nonmemberArea .linebox { padding-top:10px; }
.popup_nonmember .content .nonmemberArea .linebox_id { padding:7px 0 7px 12px; border-radius:4px; border:solid 1px #e1e1e1; font-size:13px;  }
.popup_nonmember .content .nonmemberArea .birthbox { overflow:hidden; margin-top:10px; width:344px; padding:10px 12px; border-radius:4px; border:solid 1px #e1e1e1; font-size:13px;  }
.popup_nonmember .content .nonmemberArea .birthbox .left { float:left; color:#969696; }
.popup_nonmember .content .nonmemberArea .birthbox .right { float:right; }
.popup_nonmember .content .nonmemberArea .birthtxt { text-align:right; color:#969696; }

.popup_nonmember .content .buttonArea { clear:both; padding-top:20px; overflow:hidden; }
.popup_nonmember .content .buttonArea ul { overflow:hidden; text-align:center; }
.popup_nonmember .content .buttonArea ul li{display:inline;}
.popup_nonmember .content .buttonArea .check { padding:10px 0px 20px; text-align:center; color:#666; }
.popup_nonmember .content .buttonArea .check a { color:#ff2917; text-decoration:underline; }
.popup_nonmember .content .buttonArea .email_pw {position:relative; padding-bottom:10px; top:-10px; font-size:11px; text-align:left; color:#9c9c9c; }
.popup_nonmember .content .buttonArea .email_pw a {color:#9c9c9c;font-size:11px;}

a.btn_blue {display:inline-block; padding:0 35px; background:#222450; line-height:35px; height:35px; text-align:center; color:#fff; font-weight:bold; border-radius:8px; border-bottom:3px solid #373977;}
a.btn_blue:visited {color:#fff; font-weight:bold; }
a.btn_blue:link {color:#fff; font-weight:bold; }
/* popup_nonmember End*/

.opp_pop button.b-close {position:absolute; top:20px !important; right:15px !important; width:22px !important; height:22px !important; background: url(/number/img/btn_close.png) no-repeat !important; background-size:20px !important;}




/*마이페이지 리뉴얼 241004*/
#container2 { padding-top: 55px;}

.line_color {border-bottom: 8px solid #f7f7f7;}	
.mypage_wrap { background: #fff;}

/*마이페이지 헤더*/	
.mypage_header { z-index: 9; position: fixed; top: 0; left: 0; width: 100%; height: 55px; padding-top: 15px; text-align: center; background: #fff; border-bottom: 1px solid #eee; box-sizing: border-box;}
.mypage_header h1 { font-size: 17px; font-weight: bold; color: #111;}
.mypage_header button.prev2 {position:absolute; top:19px; left:15px; width:9px; height:15px; background: url('/service/menu/main/images/icon/btn_prev2.png?t=2') no-repeat; background-size:cover;}
.mypage_header button.btn_set {position:absolute; top:17px; right:17px; width:19px; height:19px; background: url('/service/menu/main/images/icon/btn_set.png?t=2') no-repeat; background-size:cover;}

/*마이페이지 컨텐츠*/
.mypage_content { padding-bottom: 40px;}
.mypage_content .top_info_section { padding: 20px 0 0;}
.mypage_content .top_info_section .user_name {position: relative; padding: 10px 0; text-align: center;}
.mypage_content .top_info_section .user_name:after { content: ''; position: absolute; top: 24px; margin-left: 10px; width: 7px; height: 10px; background: url(https://and100.publog.co.kr/service/menu/main/images/icon/icon_arrow_right_gray.png) no-repeat 0px; background-size: 100%; transform: translateY(-50%);}
.mypage_content .top_info_section .user_name span { overflow: hidden; padding-left: 5px; font-weight: 600; font-size: 15px; line-height: 28px; letter-spacing: -0.2px; white-space: nowrap; text-overflow: ellipsis; color: #111;}
.mypage_content .mypage_banner { position: relative; width: 100%; margin: 0 auto; transition: 0.5s ease-in; padding:10px; overflow: hidden; box-sizing: border-box;}
.mypage_content .mypage_banner img { border-radius: 10px; width: 100%;}

.mypage_content .mypage_btn_wrap { display: block; position: relative; padding: 0 20px;}
.mypage_content .mypage_btn_wrap h3 { font-family: 'Montserrat', 'YoonGothicPro760', sans-serif; font-size: 17px; color: #111; font-weight: 600; padding: 20px 0; display: block;}

.mypage_content .mypage_btn_list { padding-bottom: 15px; border-bottom: 0.5px solid #eee;}
.mypage_content .mypage_btn_list:last-child{border-bottom: 0px;}
.mypage_content .mypage_btn_list a {padding: 7px 0; display: flex; width: 100%;}
.mypage_content .mypage_btn_list .item_img { float: left;  width: 9vw; height: 9vw; vertical-align: middle; display: inline; overflow: hidden; border-radius: 6vw;}
.mypage_content .mypage_btn_list .btn { position: relative; bottom: 0px; width: 25px; height: 25px; display: inline-block;}
.mypage_content .mypage_btn_list .btn.btn-delivery { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_delivery.png?t=1) no-repeat 0px 0px; background-size: 25px;}
.mypage_content .mypage_btn_list .btn.btn-papers { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_papers.png?t=1) no-repeat 0px 0px; background-size: 24px;}
.mypage_content .mypage_btn_list .btn.btn-user_info { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_user_info.png?t=1) no-repeat 0px 0px; background-size: 25px;}
.mypage_content .mypage_btn_list .btn.btn-coupon { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_coupon.png?t=1) no-repeat 0px 0px; background-size: 25px;}
.mypage_content .mypage_btn_list .btn.btn-gift_card { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_gift_card.png?t=1) no-repeat 0px 0px; background-size: 22px;}
.mypage_content .mypage_btn_list .btn.btn-service { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_service.png?t=1) no-repeat 0px 0px; background-size: 22px;}
.mypage_content .mypage_btn_list .btn.btn-parcel { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_parcel.png?t=1) no-repeat 0px 0px; background-size: 25px;}
.mypage_content .mypage_btn_list .btn.btn-translation  { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_translation.png?t=1) no-repeat 0px 0px; background-size: 25px;} /*언어*/
.mypage_content .mypage_btn_list .btn.btn-reorder  { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_reorder.png?t=1) no-repeat 0px 0px; background-size: 25px;}/*재주문*/
.mypage_content .mypage_btn_list .btn.btn-notice  { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_notice.png?t=1) no-repeat 0px 0px; background-size: 25px;}/*공지사항*/
.mypage_content .mypage_btn_list .btn.btn-faq  { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_faq.png?t=1) no-repeat 0px 0px; background-size: 25px;}

.mypage_content .mypage_btn_list .btn.btn-point { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_point.png?t=1) no-repeat 0px 0px; background-size: 22px;}
.mypage_content .mypage_btn_list .btn.btn-commission { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_commission.png?t=1) no-repeat 0px 0px; background-size: 22px;}
.mypage_content .mypage_btn_list .btn.btn-share { background: url(https://app100.publog.co.kr/service/menu/main/images/icon/icon_share.png?t=1) no-repeat 0px 0px; background-size: 22px;}

.mypage_content .mypage_btn_list ul {display: flex; justify-content: space-between; width: 100%;}
.mypage_content .mypage_btn_list ul li {width: 50%;}



.mypage_content .mypage_btn_list .btn_tit { margin-left: 10px; display: inline-block; color: #111; font-size: 15px; font-weight: 400;}	

.mypage_content .btn_logout {height: 80px;}
.mypage_content .btn_logout a {    margin-top: 10px;    position: absolute;    right: 20px;    display: flex;    color: #111;    font-size: 13px;    text-decoration: underline;    text-underline-offset: 4px;}
.mypage_content .btn_login {height: 20px;}
.mypage_content .btn_login a {   position: relative;   color: #111; font-size: 17px; text-decoration: underline; text-underline-offset: 4px;}

.mypage_content .ad_txt { color: #999; font-size: 14px;  padding-left: 7px; text-align: center;}
/*//마이페이지 리뉴얼 241004*/


/*자유결제*/
.free_payment .impt {color : #ff4040; font-size: 19px; display: inline-block; margin-right: 5px; position: relative; bottom: -2px; }
.free_payment .impt_notice {color : #ff4040; padding: 16px 12px;}

.free_payment .form_box {display: block !important ;}
.free_payment .form_group input, .form_group textarea { padding: 5px 10px 0px 10px;}

.free_payment .form_tel_flex {display: flex; padding-top: 14px;}	
.free_payment .form_tel select { padding: 6px 5px 0 10px !important;}	
.free_payment .form_tel label { top: -7px; height: 20px; line-height: 20px; }
.free_payment .form_tel input {float: left; display: inline-block; width: 30%; margin: 0 0 0 5%; padding-right: 10px; text-align: center;}

.free_payment .radiobox {display: grid; gap: 16px 20px;}
.free_payment .radiobox.radiobox_v2 {display: grid; grid-template-columns: repeat(2, 1fr);  gap: 16px 20px;}
.free_payment .radiobox label { margin-right: 0 !important;}
.free_payment .radiobox input { padding: 0;}	

.free_payment .pay_form_v2 input { width: 100%; text-align: right; margin: 0; padding: 3px 8% 0 15px;}
.free_payment .pay_form_v2 .won { position: absolute; right: 1%; bottom: 14px; font-size: 13px;}

.free_payment .ul_default {  margin: 20px;  padding: 0;  background: #fff;}