charset "utf-8";

/* 하단메뉴 숨김 
.tail,
.tail_block {
    display: none !important;
}
*/


/* 알약충전 */
.my_coin { display:block;}
.my_coin ul { width:100%; float:left; background-color:#f5f5f5; padding:12px 15px; font-size:16px; border-radius:8px; line-height:22px; border:1px solid #f5f5f5;}

.my_coin ul.white_bg { border-color:#ddd;}

.my_coin ul.active { color:#000; padding:10px 15px; line-height:30px;}
.my_coin ul.active .auto_cancel { float:right; font-size: 13px; height:30px; font-weight: 700; padding: 0px 8px; background-color:#fff; border:1px solid #ccc; color:#666; border-radius:4px;}

.my_coin ul.noti { font-size:13px; margin-top:10px; line-height: 18px; border:none;}
.my_coin ul.noti p { font-size:14px; margin-bottom:4px;}

.my_coin ul li:nth-child(1) { float:left; color:#363636; font-weight:600;}
.my_coin ul li:nth-child(1) img {height:20px; display:inline-block; vertical-align: -4px; margin-right: 4px;}
.my_coin ul li:nth-child(2) { float:right; color:#000;  font-size:24px;}
.my_coin ul li:nth-child(2) .my_point {font-weight:800; display:inline-block; margin-right:4px; vertical-align:-2px;}

.coin_fill { display:block;}

.coin_fill .coin_guide { display:block; margin-bottom:10px; font-size:12px; color:#9d9d9d; font-weight:600; display: flex; justify-content: space-between;}
.coin_fill .coin_guide span {display:inline-block; margin-left:6px;}
.coin_fill .coin_guide img { height:14px;}

.coin_fill .coin_fill_item {background-color:#fff; font-size:16px; border-radius:8px; line-height:22px; border:1px solid #ddd; font-weight:700; margin-bottom:16px;  position:relative; width:100%;}

.coin_fill .coin_fill_item .coin_fill_name { letter-spacing:-.5px; padding:12px 10px; display: flex; align-items: center; justify-content: space-between;} 
.coin_fill .coin_fill_item .coin_fill_name label {line-height: 30px; height: 30px; display: inline-block; width: calc(100% - 24px);}
.coin_fill .coin_fill_item .coin_fill_name img { height:22px; margin-left:10px;}

.coin_fill .coin_fill_item .coin_fill_name.event .coin_fill_bonus { position:relative;}

/*
.coin_fill .coin_fill_item .coin_fill_name.event .coin_fill_bonus:before { content:'12월 한정 지급!'; position:absolute; top:28px; left:-10px; width:80px; line-height:22px; text-align:center; font-size:11px; font-weight:600; color:#333; background-color:#fbbe41; border-radius:20px;}

.coin_fill .coin_fill_item .coin_fill_name.event .coin_fill_bonus:after { border-bottom: 6px solid #fbbe41; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 0px solid transparent; content: ""; position: absolute; top: 23px; left: 24px; }
 */
 
.coin_fill .coin_fill_item .coin_fill_name.event .coin_fill_bonus .coin_fill_text { position:absolute; top:28px; left:-10px; width:80px; line-height:22px; text-align:center; font-size:11px; font-weight:600; color:#333; background-color:#fbbe41; border-radius:20px;}
.coin_fill .coin_fill_item .coin_fill_name.event .coin_fill_bonus .coin_fill_text:after { border-bottom: 6px solid #fbbe41; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 0px solid transparent; content: ""; position: absolute; top: -6px; left: calc(50% - 3px);}

.coin_fill .coin_fill_item .coin_fill_bonus { font-size:14px; padding: 0 10px; display:inline-block; color:#465bf0; position:relative;}
.coin_fill .coin_fill_item .coin_fill_bonus span { /*font-weight:400;*/ }

.coin_fill_price_pay { display:inline-block; width:90px; text-align:center; padding:0px 0px; border-radius:4px; background-color:#465bf0; color:#fff; font-weight:700; font-size:15px; line-height:30px; float:right;}

.coin_fill .coin_fill_item .coin_fill_info { position:absolute; bottom:10px; left:0; width:100%; font-size:12px; color:#9d9d9d; font-weight:600;}
.coin_fill .coin_fill_item .coin_fill_info img { height:14px; }
.coin_fill .coin_fill_item .coin_fill_info p { display:inline-block;}
.coin_fill .coin_fill_item .coin_fill_info .coin_time { float:left; padding-left:50px;}
.coin_fill .coin_fill_item .coin_fill_info .coin_time span { display:inline-block; margin-right:6px;}
.coin_fill .coin_fill_item .coin_fill_info .coin_price { float:right; padding-right:10px;}

.divTableBody.amount { display:flex;justify-content: space-between;}
.coin_fill .divTableBody.amount .coin_fill_item { width:calc(33.333% - 7px); margin-bottom:0;}
.coin_fill .divTableBody.amount .coin_fill_item .coin_fill_name { padding:6px 0px;}
.coin_fill .divTableBody.amount .coin_fill_item .coin_fill_name input { position:absolute; width:0; height:0; border:none; }
.coin_fill .divTableBody.amount .coin_fill_item .coin_fill_name label { width:100%; text-align:center;}
.coin_fill .divTableBody.amount .coin_fill_item .coin_fill_name input:checked + label { }
.coin_fill .divTableBody.amount .coin_fill_item .coin_fill_name input:checked + label:after { content: ''; position: absolute; top: -1px; left: -1px; border: 1px solid #465bf0; width: calc(100% + 2px); height: calc(100% + 2px); border-radius: 8px;}

/* 충전 // 결제방법 선택 // radio 체크 박스*/
.wrap{width: 100%; float:left;}
.search_box{width: 100%; padding: 22px 16px 30px; margin: 0 auto}
.search_box > p{font-size: 17px; margin-bottom: 20px; font-weight: bold;}
.search_box .check{}
.search_box .check > ul > li{width: 100%; float:left; padding: 20px 0; font-size: 16px;}
.search_box .check > ul > li:first-child { padding-top:10px; padding-bottom:0;}
.search_box .check input{border: 1px solid #cacaca; padding: 5px;}
.search_box .check div.sear{width: 100%; float:left; margin-top: 20px;}
.search_box .check div.sear > ul > li{float: left;}
.search_box .check div.sear > ul > li.method{margin-right: 20px; height: 27px; line-height: 27px;}


.the_pay_wrap {width:100%; max-width:400px; padding:0 20px; margin:auto; }
.the_pay_wrap .the_pay {width:100%; padding-bottom:60%; border:1px solid #eee; background-color:#fafafa; border-radius:15px; text-align:center; position:relative;}
.the_pay_wrap .the_pay .the_pay_btn {width:100%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}

/* 카드 등록 전 */
.the_pay_wrap .the_pay .the_pay_btn .the_pay_icon {display: flex; font-size: 24px; justify-content: center; align-items: center;}
.the_pay_wrap .the_pay .the_pay_btn .the_pay_icon img {display:inline-block; height: 46px; margin-right: 6px;}
.the_pay_wrap .the_pay .the_pay_btn .the_pay_icon i { margin-top: 10px;}
.the_pay_wrap .the_pay .the_pay_btn .the_pay_text {width:100%;display:block; font-size:13px; margin-top:10px;}


/* 카드 등록 후 */

.the_pay_wrap .the_pay.complete { color:#fff; background: #465bf0; background: -webkit-linear-gradient(to right, #465bf0, #0b1a80); background: linear-gradient(to right, #465bf0, #0b1a80); }
.the_pay_wrap .the_pay.complete .the_pay_btn {  height:100%;}
.the_pay_wrap .the_pay.complete .the_pay_btn .the_pay_name { position:absolute; top:20px; left:20px; font-size:24px; font-weight:200; }
.the_pay_wrap .the_pay.complete .the_pay_btn .the_pay_del { position:absolute; top:00px; right:00px; font-size:16px; padding:24px; }
.the_pay_wrap .the_pay.complete .the_pay_btn .the_pay_card { position:absolute; bottom:20px; left:20px; font-size:14px; opacity:.5; }
.the_pay_wrap .the_pay.complete .the_pay_btn .the_pay_num { position:absolute; bottom:20px; right:20px; font-size:14px; opacity:.8;}



/* 알약 이용내역 */
.cion_plus { color:#F00;}
.cion_minus { color:#06C;}


.bank_wrap { background-color: #fff; font-size: 15px; border-radius: 8px;  line-height: 22px; font-weight: 700; margin-bottom: 20px; position: relative; width: 100%; background-color:#f5f5f5;}
.bank_wrap select { padding:12px 20px; border-radius: 8px; background-color:#f5f5f5; width:100%;}



.card_form { padding-bottom:130px;}
.card_form .card_form_item { margin-bottom:40px;}

.card_form .card_form_item .card_form_title { font-size:13px; color:#666;}
.card_form .card_form_item .card_form_input { display:flex;justify-content: space-between; font-size:16px;}
.card_form .card_form_item .card_form_input .w25 {width:calc(25% - 4px)}

.card_form .card_form_item .card_form_input input { height:28px; border:none; border-bottom:1px solid #ddd;}

.card_form .card_form_item .card_form_noti { margin-top:6px; font-size:12px; color:#999; }
.card_form .card_form_item .card_form_noti .card_form_name { display:inline-block; padding:3px 6px; border-radius:2px; background-color:#f2f2f2; color:#666;}

.card_form .card_form_item select { width:100%; border:1px solid #ddd; height:40px; margin-top:10px; padding-left:10px; }

.bottom_btn .terms {font-size:14px; font-weight:400; display:flex; justify-content: space-between; align-items: center; margin-bottom:10px;}
.bottom_btn .terms input[type=checkbox] { width: 18px; height: 18px; }
.bottom_btn .terms .text {display:inline-block; width:calc(100% - 40px); margin:0 10px 0 4px;}
.bottom_btn .terms i {}