html { background: #ffffff; }
* { -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; }
body { font-family: 'Nanum Square', sans-serif, Dotum, Arial; margin: 0; padding: 0; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; color: #282725; font-size: 16px; background: #ffffff;    /* 개발자 추가 */ -webkit-user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
ol, ul, li, dl, dd, dt, div, a, section { list-style: none; padding: 0; margin: 0; }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { font-family: inherit; color: inherit; margin: 0; padding: 0; font-weight: normal; }
h2 { font-size: 24px; }
h3 { font-size: 18px; }
h4 { font-size: 15px; }
h5 { font-size: 14px; }
h6 { font-size: 12px; }
p { margin: 0; padding: 0; display: inline-block; }
a { color: inherit; text-decoration: none; }
button, input, optgroup, select, textarea { margin: 0; font: inherit; color: inherit; }
select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
button { overflow: visible; }
button, select { text-transform: none; }
button, input, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; }
button, html input[type=button], input[type=reset], input[type=submit] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; }
input { line-height: normal; }
input[type="tel"] { border: none; width: 100%; outline: none; }
optgroup { font-weight: 700; }
table { border-spacing: 0; border-collapse: collapse; }
td, th { padding: 0; }
html, body { height: 100% }
a { text-decoration: none; }
input[type=text] { border: none; font-size: 16px; color: #282725; font-weight: normal; width: 100%; }
input[type=text]:focus { outline: none; }
:focus { outline: none; }
.layer-open { overflow: hidden; position: fixed; }

.bg-navy { background-color: #001F3F; }
.bg-blue { background-color: #0074D9; }
.bg-aqua { background-color: #7FDBFF; }
.bg-teal { background-color: #39CCCC; }
.bg-olive { background-color: #3D9970; }
.bg-green { background-color: #2ECC40; }
.bg-lime { background-color: #01FF70; }
.bg-yellow { background-color: #FFDC00; }
.bg-orange { background-color: #FF851B; }
.bg-red { background-color: #FF4136; }
.bg-fuchsia { background-color: #F012BE; }
.bg-purple { background-color: #B10DC9; }
.bg-maroon { background-color: #85144B; }
.bg-white { background-color: #FFFFFF; }
.bg-gray { background-color: #AAAAAA; }
.bg-silver { background-color: #DDDDDD; }
.bg-black { background-color: #111111; }
/* Colors */
.navy { color: #001F3F; }
.blue { color: #0074D9; }
.aqua { color: #7FDBFF; }
.teal { color: #39CCCC; }
.olive { color: #3D9970; }
.green { color: #2ECC40; }
.lime { color: #01FF70; }
.yellow { color: #FFDC00; }
.orange { color: #FF851B; }
.red { color: #FF4136; }
.fuchsia { color: #F012BE; }
.purple { color: #B10DC9; }
.maroon { color: #85144B; }
.white { color: #FFFFFF; }
.silver { color: #DDDDDD; }
.gray { color: #AAAAAA; }
.dark-gray { color: #414141; }
.black { color: #111111; }
.border--navy { border-color: #001F3F; }
.border--blue { border-color: #0074D9; }
.border--aqua { border-color: #7FDBFF; }
.border--teal { border-color: #39CCCC; }
.border--olive { border-color: #3D9970; }
.border--green { border-color: #2ECC40; }
.border--lime { border-color: #01FF70; }
.border--yellow { border-color: #FFDC00; }
.border--orange { border-color: #FF851B; }
.border--red { border-color: #FF4136; }
.border--fuchsia { border-color: #F012BE; }
.border--purple { border-color: #B10DC9; }
.border--maroon { border-color: #85144B; }
.border--white { border-color: #FFFFFF; }
.border--gray { border-color: #AAAAAA; }
.border--silver { border-color: #DDDDDD; }
.border--black { border-color: #111111; }
.fill-navy { fill: #001F3F; }
.fill-blue { fill: #0074D9; }
.fill-aqua { fill: #7FDBFF; }
.fill-teal { fill: #39CCCC; }
.fill-olive { fill: #3D9970; }
.fill-green { fill: #2ECC40; }
.fill-lime { fill: #01FF70; }
.fill-yellow { fill: #FFDC00; }
.fill-orange { fill: #FF851B; }
.fill-red { fill: #FF4136; }
.fill-fuchsia { fill: #F012BE; }
.fill-purple { fill: #B10DC9; }
.fill-maroon { fill: #85144B; }
.fill-white { fill: #FFFFFF; }
.fill-gray { fill: #AAAAAA; }
.fill-silver { fill: #DDDDDD; }
.fill-black { fill: #111111; }
.stroke-navy { stroke: #001F3F; }
.stroke-blue { stroke: #0074D9; }
.stroke-aqua { stroke: #7FDBFF; }
.stroke-teal { stroke: #39CCCC; }
.stroke-olive { stroke: #3D9970; }
.stroke-green { stroke: #2ECC40; }
.stroke-lime { stroke: #01FF70; }
.stroke-yellow { stroke: #FFDC00; }
.stroke-orange { stroke: #FF851B; }
.stroke-red { stroke: #FF4136; }
.stroke-fuchsia { stroke: #F012BE; }
.stroke-purple { stroke: #B10DC9; }
.stroke-maroon { stroke: #85144B; }
.stroke-white { stroke: #FFFFFF; }
.stroke-gray { stroke: #AAAAAA; }
.stroke-silver { stroke: #DDDDDD; }
.stroke-black { stroke: #111111; }

/**************************레이아웃***************************/
.text-grey { color: #898887; }
.text-mint { color: #1aaebb !important }
.text-red { color: #bd4146; }
.text-green { color: #bd4146; }
.text-orange { color: #bd4146; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.float-right { float: right; }
.border-divide { border-bottom: 1px solid #eaeaea; width: 100%; float: left; }
.center-block { display: block; margin-right: auto; margin-left: auto; }
.pull-right { float: right !important; }
.pull-left { float: left !important; }
.hide { display: none !important; }
.show { display: block !important; }
.margin-bot-140 { margin-bottom: 140px; display: inline-block; float: none; }
.margin-bot-100 { margin-bottom: 100px; }
.margin-bot-90 { margin-bottom: 90px; display: inline-block; float: none; }
.margin-bot-70 { margin-bottom: 70px; display: inline-block; float: none; }
.margin-bot-56 { margin-bottom: 56px; display: inline-block; }
.margin-bot-50 { margin-bottom: 50px; }
.margin-bot-24 {margin-bottom: 24px; display: inline-block;}
.margin-bot-30 { margin-bottom: 30px; }
.margin-bot-20 { margin-bottom: 20px; }
.margin-bot-10 { margin-bottom: 10px; }
.margin-bot-8 { margin-bottom: 8px; }
.margin-top-10 { margin-top: 10px; }
.margin-top-20 { margin-top: 20px; }
.into { padding: 18px 16px; float: left; width: 100%; box-sizing: border-box; }
.into_list { padding: 18px 16px 0 16px; }
.into_hor { padding: 0 16px; width: 100%; box-sizing: border-box; display: inline-block; }
.border-none { border: none !important; }
.border-bnone { border-bottom: none !important; }
.inline-block { width: 100%; display: inline-block; }
.divide { opacity: 0.4; }

/**************************버튼***************************/
button { padding: 13px 12px; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; }
.btn { display: inline-block; margin-bottom: 0; font-size: 17px; font-weight: 100; line-height: 1.42857143; text-align: center; border-radius: 2px; }
.btn_navy{background:#50596d; font-weight: bold; color:#fff;}
.btn_green {background-color:#4bd2ad; font-weight: bold; color:#fff;}
.btn_navy2 {background-color: #576485; font-weight: bold; color:#fff;}
.btn_blue {background-color: #45a2ea; font-weight: bold; color:#fff;}
.btn_red{background-color:#f78884; font-weight: bold; color:#fff;}
.btn_gray {background-color:#78808d; font-weight: bold; color:#fff;}
.btn_gray2 {background-color:#c5ccda; font-weight: bold; color:#596374;}
.btn_cancel { background: #eceff5; color: #8a93a6; font-weight: bold; }
.btn_cancel:hover, .btn_cancel:active { background: #d9dce1; }
.btn_add { background: #4bd2ad; color: #ffffff; font-weight: bold; }
.btn_add:hover, .btn_add:active { background: #4bd2ad; }
.btn_add:disabled { background-color: #e8ebf1; border: 1px solid #dae2eb; color: #bbc3ce; }
.btn_confirm { background: #3ac0cc; color: #ffffff; font-weight: bold; }
.btn_confirm:hover, .btn_confirm:active { background: #34acb7; }
.btn_full { width: 100%; }
.btn_n2 { display: inline-block; position: relative; float: left; width: 50%; border-radius: 0px; border: none; min-height: 50px; }
.btn_order { padding: 12px; }
.btn_order .btn { width: 49%; }
.btn_order .btn:last-child { float: right; }
.btn_order2 {padding:12px; box-sizing: border-box;}
.btn_radius_gd { padding: 3px 13px; font-size: 14px; background: #44464c; border: 1px solid #fff; border-radius: 20px; color: #fff; }
.btn_radius_sel { padding: 5px 22px; font-size: 15px; font-weight:bold; background: #676c7a; border: 1px solid #676c7a; border-radius: 20px; color: #fff; }
.btn_radius_desel { padding: 5px 22px; font-size: 15px; font-weight:bold; border: 1px solid #a6afbc; border-radius: 20px; color: #a6afbc; }
.btn_radius_1 { padding: 3px 13px; font-size: 14px; background: #fff; border: 1.2px solid #576485; border-radius: 20px; color: #485982; font-weight: bold; }
.fixed_btn { position: fixed; bottom: 0; left: 0; right: 0; transform: translate3d(0,0,0); z-index:3; }
.fixed_btn_option { padding: 16px; background: #3ac0cc; }
.btn_option { background: #ffffff; color: #3ac0cc; font-weight: bold; border-radius: 2px; }
.btn_option:hover, .btn_option:active { background: #d8f4f7; }
.options_btn { height: auto; bottom: 0; position: fixed; width: 100%; }
.btn_radius_line { padding: 3px 26px; font-size: 14px; background: transparent; border: 1px solid #ffffff; border-radius: 20px; color: #ffffff; margin-top: -2px; }
.btn_radius_line.active, .btn_radius_line:active { background: #ffffff; color: #3ac0cc; }
.btn_group { width: 100%; display: inline-block; }
.btn_group .btn { width: 48%; float: left; }
.btn_group .btn:first-child { margin-right: 2%; }
.btn_group .btn:last-child { margin-left: 2%; }
.btn_full_bot { display: inline-block; position: relative; float: left; width: 100%; border-radius: 0px; border: none; min-height: 50px; }
.btn_radius_gy_cir { padding: 5px 0; width: 36px; height: 36px; font-size: 14px; background: #ffffff; border: 1px solid #d5d5d5; border-radius: 20px; color: #8a8a8a; }
.btn_radius_gy_cir.active { background: #576485; border: 1px solid #576485; color: #ffffff; }

/**************************탭***************************/
.tab-area { width: 100%; height: 45px; border-bottom: 1px solid #d5d5d5; text-align: center; line-height: 44px; font-size: 16px; color: #282725; }
.tab_n2 { display: inline-block; float: left; width: 50%; height: 44px; }
.tab_n3 { display: inline-block; float: left; width: 33.33%; height: 44px; }
.tab_sel { font-weight: bold; color: #383a3f; border-bottom: 2px solid #383a3f; height: 44px; }
.tab_desel { color: #aeaeae; height: 44px; }

/**************************메뉴상세***************************/
.menu { padding: 14px 16px; display: inline-block; width: 100%; box-sizing: border-box; position: relative; float: left; }
.menu_content { width: 100%; }
.menu_img { width: 33%; float: left; position:relative; }
.menu_img_pic { border: 1px solid #eaedf4; width: 90px; height: 90px; margin-right: 15px; background: url(../images/1.americanoice_detail.jpg) no-repeat center center; background-size: contain; border-radius: 50px; float: left; position: relative;  }
.menu_img_detail img { width: 24px; position: absolute; right: 0; bottom: 0; z-index: 2; cursor: pointer; }
.menu_ex { float: left; }
.menu_ex h4 { margin-top: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; text-align: left; }
.menu_ex h5 { line-height: 24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: left }
.menu_add { width: 10%; float: right; text-align: right; line-height: 90px; }
.menu_add img { width: 25px; }
.menu_option_base { padding: 0 16px; display: inline-block; width: 100%; box-sizing: border-box; float: left; border-bottom: 1px solid #d5d5d5; }
.menu_option_base .list, .into .list { padding: 10px 0; }
.title { line-height: 60px; }
.title .btn { vertical-align: middle; margin-top: 15px; }
.list { padding: 22px 0; border-bottom: 1px solid #eaeaea; width: 100%; display: table; }
.list .list_title { width: 32%; margin-right: 0; display: table-cell !important; vertical-align: middle; float: none !important; }
.list .list_content { width: 65%; padding-left: 2%; box-sizing: border-box; display: table-cell !important; vertical-align: middle; float: none !important; }
.list .list_content img.arrow_right { width: 8px; }
.list:last-child { border-bottom: none; }
.menu_option_base .list .list_title { margin-right: 0; display: inline-block; float: none; }
.menu_option_base .list .list_content { padding-left: 2%; display: inline-block; box-sizing: border-box; }
.menu_option_base .list.list_cell .list_title, .menu_option_base .list.list_cell .list_content, .my_barista.list_cell { display: table-cell; }
.list_cell { width: 100%; display: table; }
.list_cell li { display: table-cell !important; vertical-align: middle; float: none !important; }
.quantity { font-size: 18px; font-weight: bold; float: right; }
.quantity .quantity_minus, .quantity .quantity_number, .quantity .quantity_plus { float: left; width: 58px; text-align: center; padding: 5px 0; margin-bottom: -5px; margin-top: -5px; line-height: 43px; }
.quantity .quantity_minus img, .quantity .quantity_plus img { width: 16px; vertical-align: middle; }
.quantity .quantity_number { text-align: center; }
.quantity .quantity_plus { margin-right: -16px; }
.choice {font-size: 16px; float: right; color: #898887; }
.choice .btn_radius_sel, .choice .btn_radius_desel { float: left; vertical-align: middle; line-height: 20px; margin:6px 0px 6px 8px; }
.choice .choice_text.active, .choice .choice_text:active { color: #50596d; font-weight: bold; }
.menu_option_bean { padding: 0 16px; }
.option_add { padding: 0 16px; border-bottom: 1px solid #d5d5d5; margin-top: 1px; color: #50596d;    /*background: #f9f6f2;*/ }
.option_add .list .list_content img.arrow_right { margin-top: 4px; }
.fixed { position: fixed; bottom: 0; }
.allcost { background: #ffffff; width: 100%; padding: 0 16px; box-sizing: border-box; border-top: 1px solid #c1c1c1; display: flex; box-shadow: 0px 0 10px rgba(0, 0, 0, 0.07); margin-bottom: 50px !important; }
.allcost .list { padding: 16px 0; }
.allcost .list .list_title, .allcost .list .list_content { width: 48%; }
.allcost h3 { font-size: 16px; }

.my_barista { width: 100%; padding: 12px 16px; background-color: #44464c; color: #fff; box-sizing: border-box; }
.my_barista .list_cell li:first-child { width: 100% }
.my_barista .list_cell li:first-child h1 { font-size: 20px; font-weight: bold }
.my_barista .list_cell li:first-child p { font-size: 14px; padding-top: 5px; color: #d3d6de; margin-right: 20px }

.order_cart { width:100%; font-size: 16px; float:left; box-sizing: border-box; display: inline-block; }
.cart_title {width: 100%;font-size:14px; text-align: center;  font-weight: bold; box-sizing: border-box; position: relative;}
.cart_title img {width: 25px; vertical-align: middle; padding-right:1px;}
.cart_title li:first-child {width:17%; margin-left: auto; margin-right: auto; left: 0; right: 0; position:absolute; bottom:13px; background-color: #e9ecef;
	border-top:1px solid #d5d5d5; border-left:1px solid #d5d5d5; border-right:1px solid #d5d5d5; border-collapse: collapse; border-radius: 3px 3px 0px 0px;}
.cart_title li:last-child {width: 100%; height: 13px; border-top: 1px solid #d5d5d5; background-color: #e9ecef;}

.cart_cont {padding:14px 16px 10px 16px; background-color: #f8f9fc; }
.cart_cont h3 {text-align: center; padding:16px 0px 3px 0px; font-weight: bold; color:#6c6e75;}
.cart_cont h5 {text-align: center; padding:0px 0px 18px 0px; color:#6c6e75;}

.cart_cont ul {width: 100%; display: table;}
.cart_cont ul li {width: 50%; display: table-cell; padding:12px; }
.cart_cont ul li:last-child {width: 30%}

.cart_unit {width: 100%; font-size: 15px; border: 1px solid #ddddde;  background-color: #fdfdfd; box-sizing: border-box; display:inline-block; margin-bottom: 8px; border-radius: 2px;}
.cart_unit:last-child { margin-bottom: 0px !important }

.cart_unit .close2.icon {float:right; text-align: right; margin-right: 16px; box-sizing: border-box; color:#626262;}
.close2.icon {color: #000; position: relative; margin-top: 0; margin-left: 0; width: 16px; height: 16px; }
.close2.icon:before { content: ''; position: absolute; top: 8px; width: 16px; height: 1px; background-color: currentColor; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.close2.icon:after { content: ''; position: absolute; top: 8px; width: 16px; height: 1px; background-color: currentColor; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.cart_checkout {width:100%; padding: 12px 16px 12px 16px; box-sizing: border-box; display: inline-block; background-color: #fff}

/**************************메뉴상세_전체팝업***************************/
.popup_head { padding: 18px 16px; border-bottom: 1px solid #aeaeae; width: 100%; display: inline-block; box-sizing: border-box; position: relative; }
.popup_head.none_border { border-bottom: 0; }
.popup_title { text-align: center; }
.close { position: absolute; right: 16px; top: 18px; }
.close img { width: 22px; }
.popup_menu_pic { width: 100%; }
.popup_menu_pic img { width: 100%; }
.popup_menu_ex { padding: 18px 16px; }
.popup_menu_table { padding: 0 16px; }

/**************************메뉴 옵션 팝업***************************/
.bg_gd { background: #3ac0cc; color: #ffffff; }
.bg_gd .wrap { background: #3ac0cc; }
.bg_gd .choice { color: rgba(255, 255, 255, 0.5); }
.bg_gd .choice .choice_text.active, .bg_gd .choice .choice_text:active { color: #ffffff; font-weight: bold; }
.bg_gd .popup_head { height: 40px; border-bottom: none; }
.bg_gd .list { border-bottom: 1px solid rgb(255, 255, 255); border-bottom: 1px solid rgba(255, 255, 255, .4); -webkit-background-clip: padding-box;    /* for Safari */ background-clip: padding-box; / }
.bg_gd .list .list_title { width: 41%; margin-right: 2%; letter-spacing: -1px; }
.bg_gd .list .list_content { width: 55%; }
.bg_gd .quantity .quantity_minus, .bg_gd .quantity .quantity_number, .bg_gd .quantity .quantity_plus {    /*width: 53px;*/ }
.bg_gd .title { margin-top: -15px; line-height: 50px; }
.checkbox_wh { background: url(../images/check_wh_off.png) no-repeat; background-size: cover; display: inline-block; width: 29px; height: 29px; margin-top: 4px; }
.checkbox_wh:active, .checkbox_wh.active { background: url(../images/check_wh_on.png) no-repeat; background-size: cover; display: inline-block; width: 29px; height: 29px; }
.list.list_chk { padding: 16px 0; }
.list.list_chk .list_title { line-height: 28px; }
.option_allcost { background: #3ac0cc; color: #ffffff; border-top: none; box-shadow: none; margin-bottom: 82px !important; }
.option_allcost .list { border-top: 2px solid #ffffff; padding: 16px 0 0 0; border-bottom: none; }

/*************************안내팝업***************************/
.bg_bk { background: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; position: absolute; z-index: 100; }
.wrap, .wrap_s { z-index: 120; }
.wrap_s { width: 90%; background: #ffffff }
.popup_content_s { padding: 15px 16px; }
.popup_content_msg { margin-bottom: 16px; }
.popup_content_msg_box { background: #f4f6fa; padding: 12px; }
.popup_content_rmsg { font-size: 13px; line-height: 18px; color: #e85151; }
.popup_img_bot { text-align: center; margin-bottom: 20px }
.popup_img_bot img { width: 140px; padding: 30px 0px 20px 0px }
.popup_img_bot h1 { padding-bottom: 8px; font: bold; font-size: 20px; letter-spacing: -0.5px; }

/**************************결제내역***************************/
.pay_inform { padding: 0 16px; float: right; width: 100%; box-sizing: border-box; margin-bottom:10px;}
.pay_inform .title { border-bottom: 2px solid #6b6b6b; }
.pay_inform h5 { margin-bottom: 6px; line-height: 16px; font-size: 13px }
.border_type1 { border-top: 1px solid #6b6b6b; }
.pay_inform .pay:first-child { border-top: 1px solid #6b6b6b; }
.pay_sum { border-top: 1px solid #6b6b6b }
.pay_sum_b { border-top: 2px solid #6b6b6b }
.pay_inform .list { padding: 18px 0; }
.pay .list_cell li:first-child { width: 54%; line-height: 18px }
.pay .list_cell li:nth-child(2) { width: 21%;}
.pay .list_cell li:last-child { width: 25%; }
.select { width: 100%; margin-top: 10px; padding-left: 10px; position: relative; height: 32px; font-size: 14px; border: 1px solid #cccccc; border-radius: 2px; background: url(../images/down-arrow.png) no-repeat right 12px; background-size: 14px 8px; background-position: 98% }
.pay_carrier { padding: 0 16px; border-top: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; width: 100%; float: left; box-sizing: border-box; }
.pay_carrier .list .list_title { width: 58%; }
.pay_carrier .list .list_content { width: 40%; }
.pay_carrier .list.list-chk { float: left; }
.pay_way { padding-bottom: 8px; border-bottom: 1px solid #eaeaea; }
.pay_way_content { width: 100%; font-size: 15px }
.pay_way_content li { }
.pay_way .pay_way_content li { padding-bottom: 15px }
.pay_way .radio { vertical-align: middle; float: left; }
.radio { background: url(../images/radio_off.png) no-repeat; background-size: cover; display: inline-block; width: 24px; height: 24px; float: left; }
.radio:active, .radio.active { background: url(../images/radio_on.png) no-repeat; background-size: cover; display: inline-block; width: 24px; height: 24px; }
.radio.disabled { background: url(../images/radio_disabled.png) no-repeat; background-size: cover; display: inline-block; width: 24px; height: 24px; }
.radio_text { line-height: 25px; vertical-align: middle; padding-left: 6px; }
.pay_store { padding-bottom: 18px; border-bottom: 1px solid #eaeaea; }
.pay_store .pay_store_content { width: 100%; display: inline-block; line-height: 20px; padding: 1px }
.pay_store .pay_store_content h3 { padding-bottom: 5px }
.order_customer { border-bottom: 1px solid #6b6b6b; }
.order_customer .list .list_title { margin-right: 0; display: inline-block; float: none; }
.order_customer .list .list_content { padding-left: 2%; display: inline-block; float: none; box-sizing: border-box; }
.order_customer .list.list_cell .list_title, .order_customer .list.list_cell .list_content { display: table-cell; }

/**************************결제_충전카드***************************/
.list.cards { padding: 16px 0; }
.pay_card .list.cards:last-child { border-bottom: none; }
.cards .list_cell li:first-child { width: 35%; margin-right: 5% }
.cards .list_cell li:nth-child(2) { width: 40%; margin-right: 5%; }
.cards .list_cell li:last-child { width: 15% }
.cards_img img { display: inline-block; width: 104px; border-radius: 6px; }
.cash_receipt .pay_way_content li { width: 50%; float: left; text-align: left; }

/**************************주문내역***************************/
.order_status { box-sizing: border-box; float: left; width: 100%; background-color: #383a3f; }
.order_status_content { width: 100%; box-sizing: border-box; }
.order_status_img { width: 100%; padding: 0px 12px; box-sizing: border-box; }
.order_status_img_text { color: #ffffff; width: 100%; box-sizing: border-box; padding-top: 26px; font-size: 13px; }
.order_status_img_text li { float: left; width: 33.333% }
.order_status_img img { width: 100%; padding: 0 16px; box-sizing: border-box; padding-top: 7px; }
.order_status_box ul { display: table; width: 100%; }
.order_status_box ul li { display: table-cell; vertical-align: middle; }
.order_status_box ul li:first-child { width: 35%; padding-right: 5%; }
.order_status_box ul li:last-child { width: 60% }
.order_status_box_img img { width: 60px; }
.order_list_before .btn { min-width: 80px; font-size: 15px; }
.order_list_before .list:last-child {border-bottom:1px solid #eaeaea}
.pay_customer .list .list_title { margin-right: 0; display: inline-block; float: none; }
.pay_customer .list .list_content { padding-left: 2%; display: inline-block; float: none; box-sizing: border-box; }
.pay_customer .list.list_cell .list_title, .pay_customer .list.list_cell .list_content { display: table-cell; }
.order_status_info { color: #fff; width: 100%; box-sizing: border-box; float: left; text-align: left; position: relative; float: left; }
.order_status_info_txt { padding: 22px 16px 10px 20px; position: absolute; float: left; }
.order_status_info h2 { font-size: 20px; padding-bottom: 7px; }
.order_status_info h5 { font-size: 14px; line-height: 17px; color: #f0f0f0; }
.order_status_info_img { width: 180px; position: relative; bottom: 0px; float: right; padding: 0px !important; }
@media screen and (max-width:600px) and (min-width:360px) {
	.order_status_info_txt { padding: 22px 16px 10px 32px; }
}

/************************** 달콤크루소개 ***************************/
.crew_intro {width:100%; height: 180px; background-color: #383a3f}
.crew_intro_img {text-align: center; position:relative; width: 100%;}
.crew_intro img {height: 90px; text-align: center; position:relative; margin: auto; padding-top: 18px }
.crew_intro p {font-size: 0.96em; line-height:1.3em; width:100%; text-align:center; color:#d3d9e2; padding-top: 4px}
.crew_intro p span {color:#fff; font-weight: bold}
.crew_detail {width: 100%;  box-sizing:border-box; padding:36px 22px 0px 22px; background-color:#fff; color:#383a3f; text-align: left }
.crew_detail h4 {font-weight: bold; padding-bottom: 3px; font-size:18px;}
.crew_detail ul {width:100%; display: table; line-height: 18px; font-size:13px; letter-spacing: -0.04em}
.crew_detail ul li {width:100%; box-sizing: border-box; text-align: left; font-size: 13px}
.crew_detail_title { width:auto; font-size: 15px; color:#1aaebb; font-weight: bold; border-bottom: 0.09em solid #1aaebb; margin-bottom: 10px;
display: inline-block; max-width:50%; word-break:break-all; padding-right: 1px }
.crew_content {width:100%; box-sizing:border-box}
.crew_grade {width:100%; box-sizing: border-box; margin:auto; position:relative; text-align:center; padding:10px 20px 50px 20px; letter-spacing: -0.02em; }
.crew_grade img {width: 90px; vertical-align: middle; margin:0px 10px 0px 12px}
.crew_grade ul {display: inline-block; line-height:1em; width: 100%; vertical-align: middle; text-align:left;}
.crew_grade ul li {width:100%; text-align:left; font-size:13px; padding-bottom: 4px}
.crew_grade h4 {font-weight: bold; font-size: 1.1em; color: #383a3f; padding:16px 0px 22px 0px }
.crew_grade h5 {font-size:13px; text-align: left; padding-top:2px;}
.crew_grade span {font-size:11px; color:#9da2ad; margin-left: 11px}
.crew_notice {box-sizing: border-box; margin: auto; position: relative; background-color:#eff2f7; text-align: left; padding: 20px 16px; letter-spacing: -0.02em; bottom: 0px}
.crew_notice ul {display: inline-block; line-height: 1em; width: 100%; vertical-align: middle; text-align: left !important}
.crew_notice ul li {font-size:12px; list-style: none outside none !important; padding-bottom: 6px; }
.crew_notice ul > li:before{content: "- ";}
.title_line{width: 28px; height: 2px; background-color:#b8c0c4; text-align: left; margin-top: 4px; margin-bottom: 20px}


/************************** 애니메이션 ***************************/
.fade_in { opacity: 1; transition: all 0.3s ease-in-out; transform: translate(0, 0); -webkit-transform: translate(0, 0);    /** Chrome & Safari **/ -o-transform: translate(0, 0);    /** Opera **/ -moz-transform: translate(0, 0);    /** Firefox **/ height: 100%; }
.fade_out { opacity: 0; transition: none; transform: translate(350px, 0); -webkit-transform: translate(350px, 0);    /** Chrome & Safari **/ -o-transform: translate(350px, 0);    /** Opera **/ -moz-transform: translate(350px, 0);    /** Firefox **/ height: 100%; }
button.accordion { cursor: pointer; width: 100%; outline: none; border: none; transition: 0.4s; background-color: #fff; padding: 0 !important; float: left; }
button.accordion.active, button.accordion:hover { float: left; }
div.panel { border-bottom: 1px solid #d5d5d5; background-color: #f8f9fc !important; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out; float: left; width: 100% }


/**************************고객센터***************************/
.notice_content { box-sizing: border-box; width: 100%; padding: 16px; border-bottom: 1px solid #eaeaea;}
.notice_content ul { display: table;vertical-align: middle; width: 100%;}
.notice_content li { display: table-cell; vertical-align: middle;}
.notice_content li img{ width: 8px;}
.notice_content_text { vertical-align: middle; width: 90%; margin-right: 2%; text-align: left; font-size: 14px; line-height: 26px;}
.notice_content_text h1 { font-size: 15px;}
.notice_content_text h2 { font-size: 14px; color: #898887;}
.notice_content_text p { line-height: 16px;}
.notice_content_text2 { vertical-align: middle; text-align: left; font-size: 14px; padding-top: 24px; padding-bottom: 6px; line-height: 24px;}
.list_arrow { vertical-align: middle; width: 4%; text-align: right; padding-right: 3px; padding-left: 15px;}
.list_arrow2 { vertical-align: middle; width: 4%; text-align: right; padding-right: 3px; padding-left: 15px;}
.info_main_img img { width: 100%; }
.ar_open { -ms-transform: rotate(-90deg); /* IE 9 */ -webkit-transform: rotate(-90deg); /* Safari */ transform: rotate(-90deg);}
.ar_close { -ms-transform: rotate(90deg); /* IE 9 */ -webkit-transform: rotate(90deg); /* Safari */ transform: rotate(90deg);}
.customer_content { display: inline-block; box-sizing: border-box; width: 100%; padding: 24px 16px;}
.list_padding { padding: 16px;}
.info_inquiry .btn, .info_inquiry_detail .btn { min-width: 80px; font-size: 15px;}
.info_inquiry .list:last-child { border-bottom: 1px solid #eaeaea; }
.info_inquiry_content { padding:16px 0; font-size: 14px; }
.info_inquiry_reply { padding:16px; background:#fafafa; border-bottom: 1px solid #eaeaea; border-top: 1px solid #eaeaea; font-size: 14px; }
.reply { width: 14px; margin-right: 3px;}
.info_inquiry_detail .list { border-bottom: 1px dashed #eaeaea; }
.info_inquiry_detail h6 { margin-bottom:5px; }
.notice_detail_content { font-size: 14px; }
.inquiry_write .select { margin-top: 0; }
.inquiry_textarea { border: #ffffff; width: 100%; }

.none { position:absolute; top:47%; left:50%; padding:15px; -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }
.none img { width: 87px;}
.none h4 { margin-top:10px; color: #8a93a6;}

/**************************이벤트상세 ***************************/

.event_content2 { width: 100%; margin-bottom: 16px; margin-right: auto; margin-left: auto;}
.event_content2 img { width: 100%; margin: 0px;}
.event_content2_text { text-align: left; font-size: 14px; margin-bottom: 16px; line-height: 23px;}
.event_content2_text h1 { font-weight: bold; font-size: 16px; color: #282725;}
.event_content2_text h2 { font-size: 15px; color: #898887;}

/**************************비트스토리_탭***************************/
.tab-area-story.tab-area { background: #383a3f; width: 100%; height: 45px; border-bottom: 1px solid #666666; text-align: center; line-height: 44px; font-size: 16px; color: #666666; }
.tab-area-story .tab_sel { font-weight: bold; color: #ffffff; border-bottom: 2px solid #ffffff; height: 44px; }
.tab-area-story .tab_desel { color: #949494; height: 44px; }

/**************************비트스토리_비트소개***************************/
.beatstory_intro { display: inline-block; }
.intro_text { text-align: center; width: 100%; padding:20px 0; background: #000000; color: #ffffff;}
.beatstory_howtouse img { display:block; }

/************************** 약관 ***************************/

.terms {
    font-size:13px;
}

    .terms p {
        line-height: 18px;
        display: block;
    }

    .terms h2 {
        font-size: 20px;
    }

.pd-left-10 {
    padding-left: 10px;
}
.pd-left-15 {
    padding-left: 15px;
}

.terms_table td, .terms_table th {
    border: 1px solid #d5d5d5;
    padding: 5px;
}




/*********20180220*********/
.soldout {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 92px;
}

    .soldout img {
        width: 100%;
    }


/**************************이벤트***************************/
.event_content {
    position: relative;
    width: 100%;
    border: 1px solid #d5d5d5;
    margin-bottom: 16px;
    margin-right: auto;
    margin-left: auto;
}

.event_content_end {
    position: absolute;
    width: 100%;
    z-index: 2;
}

.event_content_ing {
    position: relative;
    width: 100%;
    z-index: 1;
}

.event_content_end img {
    width: 100%;
    margin: 0px;
}

.event_content_ing img {
    width: 100%;
    margin: 0px;
}

.event_content_text {
    text-align: left;
    font-size: 14px;
    margin: 9px 12px 12px 12px;
    height: 46px;
    line-height: 23px;
}

.event_content_text h1 {
    font-size: 16px;
    color: #282725;
}

.event_content_text h2 {
    font-size: 12px;
    color: #898887;
}

.event_join {
    padding: 0 16px;
    box-sizing:border-box;
}

/**************************이벤트 친구추천***************************/
.share_main { position:relative; text-align:center; color:#394357; }
.share_main a { position: absolute; bottom: 4%; width: 100%; left:0; cursor: pointer; }
.share_friend {padding: 20px 15px 0 15px;}
.share_friend_title{ margin-bottom:10px;}
.share_friend_title h3 { font-size: 20px; font-weight: bold; color:#394357; margin-bottom: 10px; }
.share_friend_howto li {margin: 15px 0; font-size: 16px; line-height: 24px; padding-left:30px;  }
.share_friend_howto li.first {background:url(../images/event_share_howto_1.png) no-repeat top left; background-size:23px 23px;}
.share_friend_howto li.second {background:url(../images/event_share_howto_2.png) no-repeat top left; background-size:23px 23px;}
.share_friend_howto li.second span, .share_friend_title span {color:#f66969; font-size:14px; }
.share_friend_howto li.third {background:url(../images/event_share_howto_3.png) no-repeat top left; background-size:23px 23px;}
.share_friend_content { background:#eff2f7; border-radius: 10px; padding:15px 20px; margin-bottom: 15px;  position:relative; }
.share_friend_content_input {width:100%;}
.share_friend_content_input label {width:20%; margin-right:5%; display: inline-block; word-break: keep-all; vertical-align: middle;}
.share_friend_content_input input {width:70%; border:1px solid #d5dce7; border-radius:5px; height: 44px; padding: 0 10px; box-sizing:border-box;}
.share_friend_content_input ::-webkit-input-placeholder { /* Chrome/Opera/Safari */color: #d5dce7;}
.share_friend_content_input ::-moz-placeholder { /* Firefox 19+ */color: #d5dce7;}
.share_friend_content_input :-ms-input-placeholder { /* IE 10+ */ color: #d5dce7;}
.share_friend_content_input :-moz-placeholder { /* Firefox 18- */ color: #d5dce7;}
.share_friend_content_btn {width: 100%; text-align:center; margin-top:15px; }
.share_friend_content_btn button {background: #394357; color: #ffffff; padding: 8px 30px; border-radius: 30px; font-size:16px;}
.share_friend_info p { margin-bottom:10px; color:#727886; font-size:14px}
.share_friend_content_confirm {text-align: center; margin-top:24px; }
.share_friend_content_confirm p { display: block; margin-top: 16px;}
.share_friend_content_not { position: absolute; background:rgba(0,0,0,0.7); width: 100%; left: 0; top: 0; border-radius: 10px; height: 154px; color: #ffffff; text-align: center; }
.share_friend_content_not p { margin-top: 46px; line-height:20px; }
.share_friend_content_not strong { color: #90abdf; }

/*********20180427*********/
.discount_arrow {
    height: 16px;
    vertical-align: middle;
}

.text-line {
    text-decoration: line-through;
    line-height: 17px;
}
/*********20180510*********/
.share_btn {
    width: 80%;
    text-align: center;
    margin: 0 auto;
    display: block;
    border-radius:7px;
    background:#799ada;
    color:#ffffff;
    box-shadow:0 5px #5d76a8;
    font-size:16px;
    margin-bottom:20px;
    padding:15px ;
}




/*********************************** 20190212 **************************************/
.text-black {color: #000;}

.btn2 { display: inline-block; margin-bottom: 0; font-size: 14px; font-weight: 100; line-height: 1.42857143; text-align: center; border-radius: 2px; }
.btn_mymenu{ background-color: #c8cfdc; padding:0;}
.btn_mymenu .mymenu_img{display: inline-block; max-width: 28px; vertical-align: middle; padding: 10px 5px;}
.btn_mymenu_on{background-color: #e7e9ee; padding:0; }
.btn_mymenu_on .mymenu_img_on{display: inline-block; max-width: 28px; vertical-align: middle; padding: 10px 5px;}

.btn_n2 { display: inline-block; position: relative; float: left; width: 50%; border-radius: 0px; border: none; min-height: 50px; }
.btn_order { padding: 12px; }
.btn_order .btn2 { height:52px; }
.btn_order .btn2:first-child { float:left; width: 26%; margin-right: 1%;}
.btn_order .btn2:last-child { float:right; width: 18%; margin-left: 1%;}
.btn_order .btn_mymenu, .btn_order .btn_mymenu_on{ float:right; width: 18%; margin-left: 1%;}
.btn_order .center{width: 54%;}
.btn_order2 {padding:12px; box-sizing: border-box;}

.btn_radius_sel1 { padding: 5px 16px; font-size: 13px; font-weight:bold; background: #fff; border: 2px solid #4e9ba7; border-radius: 20px; color: #4e9ba7; }
.btn_radius_desel1 { padding: 5px 16px; font-size: 13px; font-weight:bold; border: 1px solid #a6afbc; border-radius: 20px; color: #a6afbc; background-color: transparent;}

.title1 {line-height: 28px; margin-top: 18px;}


.list_o { width: 100%; display: table; font-weight: bold; color: #858994;}
.list_o .list_title { font-size:13px; width: 15%; margin-right: 0; display: table-cell !important; vertical-align: middle; float: none !important; }
.list_o .list_content { width: 85%; padding-left: 2%; box-sizing: border-box; display: table-cell !important; vertical-align: middle; float: none !important; }
.list_o .list_content img.arrow_right { width: 8px; }
.list_o:last-child { border-bottom: none; }
.menu_option_base1 .list_o .list_title { margin-right: 0; display: inline-block; float: none; }
.menu_option_base1 .list_o .list_content { padding-left: 2%; display: inline-block; box-sizing: border-box; }
.menu_option_base1 .list_o .list_cell .list_title, .menu_option_base .list_o .list_cell .list_content, .my_barista.list_cell { display: table-cell; }
.menu_option_base1 { padding: 15px 16px; display: inline-block; width: 100%; box-sizing: border-box; float: left; border-bottom: 1px solid #d5d5d5; }
.menu_option_base1 .list, .into .list { padding: 10px 0; }
.choice .btn_radius_sel1, .choice .btn_radius_desel1 { float: left; vertical-align: middle; line-height: 20px; margin:6px 0px 6px 4px;}


.pay_way .btn2 { vertical-align: middle; float: left; }
.pay_way_wrap { width: 100%;}
.pay_way_sel { padding:8px 12px; font-size: 12px; font-weight:bold; background-color: #383a3f; border-radius: 20px; color: #fff; }
.pay_way_desel { padding:8px 12px; font-size: 12px; font-weight:bold; background-color: #fff; border: 2px solid #c8cfdc; border-radius: 20px; color: #a6afbc; }
.pay_way_wrap .btn2 img{ height: 10px; vertical-align: middle;}
.pay_store { padding-bottom: 18px; border-bottom: 1px solid #eaeaea; }
.pay_store .pay_store_content { width: 100%; display: inline-block; line-height: 20px; padding: 1px; }
.pay_store .pay_store_content h3 { padding-bottom: 5px; }
.order_customer .list .list_title { margin-right: 0; display: inline-block; float: none; }
.order_customer .list .list_content { padding-left: 2%; display: inline-block; float: none; box-sizing: border-box; }
.order_customer .list.list_cell .list_title, .order_customer .list.list_cell .list_content { display: table-cell; }
.condition_gr {background: url(../images/condition_gr.png) no-repeat; background-size: cover; display: inline-block; width: 12px; height: 9px; float: left; margin-top: 4px; }
.condition_yel {background: url(../images/condition_yel.png) no-repeat; background-size: cover; display: inline-block; width: 12px; height: 9px; float: left; margin-top: 4px; }
.condition_grey {background: url(../images/condition_grey.png) no-repeat; background-size: cover; display: inline-block; width: 12px; height: 9px; float: left; margin-top: 4px; }



/*마이메뉴*/
.menu_my_pic {
    position: absolute;
    top: 0;
    left:0;
    z-index: 1;
    width: 92px;
}
.menu_my_pic img {
    width: 18%;
    }


/*주문_매장지도*/
.pay_store_map .ex{
    width: 100%;
    height: 180px;
    transition: max-height 0.2s ease-out;
    max-height: 0px;
}
.pay_store_map .ex img{
    width: 100%;
    height:100%;
}

/*********************************** 20190227 **************************************/

.margin-bot-5 {margin-bottom: 5px; }
.margin-bot-10 {margin-bottom: 10px; }
.margin-top_-8{margin-top: -8px;}

.popup_content_msg .title{line-height: 20px; margin-bottom: 12px;}
.popup_content_msg_box .list_cell{padding-bottom: 10px;}
.popup_content_msg_box .list_cell:last-child{border-bottom:1px solid #bbb; }
.popup_content_msg_box .list_cell li h6{line-height: 20px; }
.popup_content_msg_box .list_cell li:first-child{float: left; width: 60%;}
.popup_content_msg_box .list_cell li:last-child{ float: right; width: 40%;vertical-align: top;}
.popup_content_msg_box h4{font-weight: bold; }
.popup_content_msg_box h4 span{color: #000;}
.popup_content_msg_box .address{ margin-top: 5px;}

.popup_content_msg_box2 {background: #f4f6fa; padding: 0 12px 12px 12px;}
.popup_content_msg_box2 .list_cell li:first-child{width: 50%;}
.popup_content_msg_box2 .list_cell li:last-child{ width: 50%;}
.popup_content_msg_box2 h4{font-weight: bold; color: #1aaebb !important ;}
.popup_content_msg_box2 h4 span{color: #000; font-weight: normal;}

.popup_content_rmsg2{font-size: 13px; line-height: 18px; color: #898887; padding-top: 12px; }


/*********************************** 20190415 **************************************/


.pay_way_content1 {
    width: 100%;
    display: inline-block;
}

.pay_way_content1 li {
    text-align:left;
    margin-bottom: 13px;
}

.kakao_pay{
    background: url(../images/payment_icon_yellow_small.png) no-repeat;
    background-size: cover;
    display: inline-block;
    width:120px;
    height:18px;
    margin-right: 5px;
    vertical-align: middle;
}

.payco_easy{
    background: url(../images/payco_easy.png) no-repeat;
    background-size: cover;
    display: inline-block;
    width:124px;
    height:16px;
}

.payco_easy2{
    background: url(../images/payco_img.png) no-repeat;
    background-size: cover;
    display: inline-block;
    width:62px;
    height:16px;
    margin-right: 5px;
    vertical-align: middle;
}

.paycoin_easy{
    background: url(../images/paycoin_img.png) no-repeat;
    background-size:cover;
    display: inline-block;
    width:90px;
    height:30px;
    vertical-align:middle;
    margin-right: 5px;
}

.add-text{font-size: 12px; }
.margin-top_10 {margin-bottom: 10px;}


.map_box{width: 100%; text-align: center; border: 1px solid #4e9ba7; font-size: 14px; color: #4e9ba7; padding: 3px 0; margin-top: 7px; box-sizing: border-box;}

.popup_content_rmsg3{font-size: 13px; line-height: 18px; color: #bd4146;  padding-top: 12px; }
.pay_store_map2 .ex{
    width: 100%;
    height:140px;
}
.pay_store_map2 .ex img{
    width: 100%;
    height:100%;
}

.pay_sum_data { border: 2px solid #1aaebb !important; padding: 15px; }

/*************************20190423 추가************************/
.pay_method_img{
    vertical-align: middle;
    max-height: 25px;
    max-width: 120px;
}

/*********************************** 20190628 **************************************/
.fixed_btn_c { position: fixed; bottom: 0; left: 0; right: 0; transform: translate3d(0,0,0); z-index:3; }
.order_cart2 { width:100%; font-size: 16px; float:left; box-sizing: border-box; display: inline-block; max-height: 240px; overflow: auto; -ms-overflow-style: none;}
.order_cart2::-webkit-scrollbar {
    display: none;
}
.cart_title2 {width: 100%;font-size:14px; text-align: center;  font-weight: bold; box-sizing: border-box; position: relative;}
.cart_title2 img {width: 25px; vertical-align: middle; padding-right:1px;}
.cart_title2 li:first-child {width:17%; margin-left: auto; margin-right: auto; left: 0; right: 0; position:absolute; bottom:13px; background-color: #e9ecef;border-top:1px solid #d5d5d5; border-left:1px solid #d5d5d5; border-right:1px solid #d5d5d5; border-collapse: collapse; border-radius: 3px 3px 0px 0px;}
.cart_title2 li:last-child {width: 100%; height: 13px; border-top: 1px solid #d5d5d5; background-color: #e9ecef;}
.cart_cont2 {padding:0px 16px 0px 16px; background-color: #e9ecef; }
.cart_cont2 h3 {text-align: center; padding:16px 0px 3px 0px; font-weight: bold; color:#6c6e75;}
.cart_cont2 h5 {text-align: center; padding:0px 0px 18px 0px; color:#6c6e75;}

.cart_cont2 ul {width: 100%; display: table;}
.cart_cont2 ul li {width:80%; display: table-cell; padding:12px; }
.cart_cont2 ul li:last-child {width: 30%; height: 100%; display: table-cell; vertical-align: middle;}
.cart_cont2 ul .del_menu {width: 30%; height: 100%; display: table-cell; vertical-align: middle;}

.cart_unit2 {width: 100%; font-size: 15px; border: 1px solid #ddddde;  background-color: #fdfdfd; box-sizing: border-box; display:inline-block; margin-bottom: 8px; border-radius: 2px;}
.cart_unit2:last-child { margin-bottom: 0px !important }
.cart_unit2 .close2.icon {float:right; text-align: right; margin-right: 16px; box-sizing: border-box; color:#626262;}

.cart_checkout2 {width:100%; padding: 12px 16px 12px 16px; box-sizing: border-box; display: inline-block; background-color: #e9ecef;}
.amount {position:relative; margin: 0 auto; z-index: 5; top: -10px; left: 25px; width: 15px; height: 15px; padding: 5px; border-radius: 15px; color: white; background-color: red; text-align: center;}


.popup_content_msg_box_n { background-color: #fff;}
.popup_content_msg_box_n h4 span{color: #000;}
.popup_content_rmsg4{font-size: 11px; text-align: center; line-height: 14px; color: #000;  padding-top: 12px; }


.btn_group_quiz button{width:80%; margin-bottom: 5px; }
.btn_group_quiz button h5{font-weight: bold;}
.btn_quiz{display: block; margin: 0 auto; padding: 10px 30px; border-radius: 40px; border:2px solid #bec1d0; background-color: #fff; color: #676d7b; }
.btn_quiz_fail{display: block; margin: 0 auto; padding: 10px 30px; border-radius: 40px; background-color: #e85253; color: #fff;}

.pay_store_map3 .ex{
    width: 100%;
    height:110px;
}
.pay_store_map3 .ex img{
    width: 100%;
    height:100%;
}

.list2{margin-bottom: 10px; width: 100%; display: table;}
.list2 .list_title { width: 32%; margin-right: 0; display: table-cell !important; vertical-align: middle; float: none !important; }
.list2 .list_content { width: 65%; padding-left: 2%; box-sizing: border-box; display: table-cell !important; vertical-align: middle; float: none !important; }


.beverage_list{width: 90%; padding:5%; border: 1px solid #919191; margin-bottom: 8px;}
.beverage_list .wrap_b{width: 100%; height: 100%; }
.beverage_list .top{width: 80%; display:inline-block;}
.beverage_list .top li:last-child{font-size: 17px; font-weight: bold; margin-top: 5px;}
.beverage_list .arrow{width: 20%; height: 100%; float: right; text-align: right; background-color: #fff; padding: 13px 0; }
.beverage_list .arrow img{width: 20px; padding: 0;}

.beverage_list .detail{width: 100%; margin-top: 10px;}
.beverage_list .detail tr td{font-size: 13px; padding: 3px 0; text-align: left;}
.beverage_list .detail tr td:first-child{width: 30%; color: #898887;}
.beverage_list .detail tr td:last-child{}
.beverage_list .cancel{width: 100%; font-size: 13px; text-align: center;  padding: 13px 0 0 0; margin-top: 10px; border-top: 1px solid #919191; background-color: #fff;}

.btn_pick_num { background: #3ac0cc; color: #ffffff; font-weight: bold; padding: 10px 0 5px 0; }
.btn_pick_num:hover, .btn_pick_num:active { background: #34acb7; }
.btn_pick_num .pick_num{font-size: 18px; letter-spacing:2px;}

.extension{padding: 50px 0 30px 0;}
.extension span{color: red;}

/*********************************** 20191121 **************************************/
.possible_number {
    padding: 10px 0;
    border-bottom: #d5d5d5 1px solid;
    text-align: center;
}
.remain {
    font-weight: bold;
    color: #3ac0cc;
}

span#limit_type {
    color: inherit;
}

/* Loading 바 CSS 구현 */
/* Absolute Center Spinner */
.loading {
  position: fixed;
  z-index: 999;
  height: 2em;
  width: 2em;
  overflow: visible;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

/* Transparent Overlay */
.loading:before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.3);
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
  /* hide "loading..." text */
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.loading:not(:required):after {
  content: '';
  display: block;
  font-size: 10px;
  width: 1em;
  height: 1em;
  margin-top: -0.5em;
  -webkit-animation: spinner 1500ms infinite linear;
  -moz-animation: spinner 1500ms infinite linear;
  -ms-animation: spinner 1500ms infinite linear;
  -o-animation: spinner 1500ms infinite linear;
  animation: spinner 1500ms infinite linear;
  border-radius: 0.5em;
  -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
  box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-o-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.pay_way_content1 li {
    cursor: pointer;
}

#affiliate {
    cursor: pointer;
}

/********************* 20200801_매장인증 고도화***********************/

.n_pop_terms {
    overflow: auto;
    height: 400px;
}

.n_terms_agree {
    font-size: 14px;
    font-weight: bold;
    line-height: 20px;
    margin-bottom: 20px;
}

.n_terms_cont {
    width: 100%;
    height: 300px;
    border: 1px solid #d8d8d8;
    overflow: auto;
    margin-bottom: 18px;
}

.n_terms_link {
    font-size: 14px;
    margin-left: 20px;
    margin-bottom: 18px;
    line-height: 22px;
}

.n_terms_link p {
    padding-left: 12px;
    font-weight: bold;
    text-decoration: underline;
    background: url(../images/n_dot.png) no-repeat left center;
    background-size: 6px;
}

.n_terms_link ul {
    margin-left: 10px;
    color: #888888;
}

.add {
    font-size: 12px;
    color: #888888;
    line-height: 18px;
}

/********************* 20200811_매장인증 고도화 신규약관***********************/

.pd-left-25{
    padding-left: 25px;
}

.pd-left-35{
    padding-left: 35px;
}