@charset "utf=8";
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;500;700;900&display=swap');
@import url('https://cdn.rawgit.com/innks/NanumSquareRound/master/nanumsquareround.min.css');


/* reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-touch-callout: none;
}

html,
body {
    width: 100vw;
    height: 100%;
}

body {
    font-family: 'Noto Sans KR', sans-serif, 'Nanum Gothic', sans-serif;
    font-size: 16px;
    /* font-family: 'Montserrat', sans-serif; */
    color: var(--navybk);
}

input,
select,
textarea,
button {
    -webkit-appearance: none;
    -webkit-text-size-adjust: none;
    appearance: none;
    outline: 0;
    text-decoration: none;
    border-radius: 0;
    font-family: 'Noto Sans KR', sans-serif, 'Nanum Gothic', sans-serif;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: 0;

}

input,
label {
    cursor: pointer;
}

input[type="text"] {
    color: var(--navybk);
}

input[type="button"]:disabled {
    font-weight: inherit;
}

li {
    list-style: none;
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover,
a:active,
a:focus {
    color: inherit;
}

table {
    border: 0;
    border-spacing: 0px;
    border-collapse: collapse;
}

::placeholder {
    color: var(--deepgray);
    font-weight: 300;
}

:root {
    --deepcoral: #fb634d;
    --coral: #ff7865;
    --lightcoral: #fc977f;

    --orange: #ec8733;
    --lightorange: #ffb18a;
    --paleorange: #ffe0cb;

    --yellow: #ffc000;

    --red: #df1d2c;
    --palered: #ffe0e2;

    --blue: #0868d8;
    --lightblue: #68abf8;
    --paleblue: #dbecff;

    --green: #06b772;

    --navybk: #1a1e27;
    --darkgray: #505866;
    --rockgray: #64768c;
    --deepgray: #7e848f;
    --mediumgray: #b1b8c0;
    --lightgray: #d6dadf;
    --pg2: #e6e6e7;
    --palegray: #ececec;
    --bluegray: #f2f1f6;
    --whitegray: #fafafa;

}

.clear::after {
    content: '';
    clear: both;
    display: block;
}

.block {
    display: block;
}

.mb30 {
    margin-bottom: 30px;
}

/* 앱접근권한안내 */
.sub {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: white;
    flex-direction: column;
    overflow: auto;
}

.wrap_sub {
    /* width: calc( 100vw - 3rem ); */
    /* height: calc( 100vh - 3rem ); */
    height: 100%;
    margin: 2rem;
    display: flex;
    flex-direction: column;
}

.emp_box {
    flex: 1;
}

.cont_area {
    /* flex: 2.5; */
    border-radius: 10px;
    background: white;
    padding: 0 1rem 1rem;
    box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.08);
}

.btn_area {
    flex: 1;
    margin-top: 20px;
    border-radius: 10px;
    display: flex;
    align-items: flex-end;
}

input[type="button"].btn_next_l {
    width: 100%;
    height: 100%;
    max-height: 60px;
    /* min-height: 40px; */
    min-height: 60px;
    color: white;
    background: linear-gradient(145deg, var(--coral) 0%, var(--orange) 100%);
    border-radius: 10px;
    border: 0;
    font-size: 18px;
    font-weight: 500;
    /* position: fixed;
    bottom: 1rem;
    left: 50%;
    width: calc(100% - 2rem);
    max-width: calc(700px - 2rem);
    transform: translateX(-50%); */
}

.tit_app_guide {
    padding: 30px 0;
    text-align: center;
    font-size: 26px;
}

.w_lst {
    background: white;
}

.lst_ag .fl_l {
    width: 30%;
    text-align: center;
}

.lst_ag .fl_r {
    width: 70%;
}

.fl_l {
    float: left;
}

.fl_r {
    float: right;
}

.txt_m,
.txt_gray_s {
    display: block;
}

.txt_m {
    font-size: 20px;
    font-weight: 500;
}

.txt_gray_s {
    font-size: 12px;
    color: var(--deepgray);
    word-break: keep-all;
    /* text-align: right; */
}

.w90 {
    /* width: 90%; */
}

.lst_ag li::after {
    clear: both;
    display: block;
    content: '';

}

.lst_ag li {
    padding: 20px 5px;
    position: relative;
}

.lst_ag li::before,
.tit_app_guide::before {
    content: '';
    width: 100%;
    height: 1px;
    background: var(--palegray);
    position: absolute;
    bottom: 0;
    left: 0;
}

.lst_ag2 {
    padding-top: 4vw;
    padding-bottom: 4vw;
    font-size: 16px;
}

.lst_ag2 li {
    position: relative;
    margin-top: 2vw;
    padding-left: 20px;
    text-indent: 0px;
}

.lst_ag2 li::before,
.desc_gray.mg0 p::before {
    position: absolute;
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 5px;
    top: 8px;
    left: 7px;
    background: var(--coral);
}

/* 약관동의 */
.sub.agree {
    justify-content: space-between;
}

.agree .top,
.bg_white .top,
.top,
.agree .mid,
.bg_white .mid,
.mid,
.agree .bot,
.bg_white .bot,
.bot {
    width: 100%;
}

.mid {
    flex: 14;
    padding: 0 1rem;
    padding-bottom: 63px;
    /* height: calc(100vh - 106px); */
    /* overflow: hidden; */
}

.agree .top,
.bg_white .top,
.top {
    flex: 1;
    display: flex;
    align-items: center;
}

.agree .top.close,
.bg_white .top.close,
.top.close {
    align-items: center;
    justify-content: space-between;
    margin-top: 5px;
}

@keyframes fadeUp {}

.bg_white .top.close_alone {
    justify-content: flex-end;
}

.agree .mid,
.bg_white .mid {
    flex: 14;
    /* margin: 1rem 0; */
    padding: 0 1rem;
    z-index: 20;
    overflow: auto;
}

.agree .bot,
.bg_white .bot,
.detail .bot,
.bot {
    flex: 2;
    margin: 1rem 0;
    padding: 0 1rem;
    display: flex;
    align-items: flex-end;
}

.area_num {
    flex: 4;
    margin: 1rem 0;
    padding: 0 1rem;
}

.btn_back {
    border: 0;
    padding: 1.3rem 1rem;
    background: none;
}

.white_box {
    width: 100%;
    background: white;
    border-radius: 10px;
    margin-top: 5px;
    border: 1px solid #eee;
}

.input_form {
    width: 100%;
    margin-top: 15px;
    background: white;
    border-radius: 10px;
    border: 1px solid #eee;
}

.input_form li {
    width: 100%;
    border-bottom: 1px solid #e7e7e7;
    padding: 0;
    display: flex;
    align-items: center;
}

.input_form li:last-child {
    border-bottom: none;
}

.input_chk {
    position: relative;
    display: block;
    width: 100%;
    /* padding: 3px 10px; */
    padding: 1rem;
}

.input_chk.bt_right {
    text-align: right;
    border-top: 1px solid var(--lightgray);
    margin-top: 15px;
}

.tit_chk {
    padding-left: 5px;
}

.tit_chk {
    padding-left: 5px;
}

.mid article:nth-of-type(2) .tit_chk {
    margin-top: 30px;
}

.chk {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    margin: -1px;
    width: 1px;
    height: 1px;
}

.chk_lbl {
    position: relative;
    /* display: block; */
    /* width: 100%; */
    padding-left: 25px;
    font-weight: 500;
    line-height: 21px;
    font-size: 15px;
}

.input_chk input+label:before {
    content: '';
    position: absolute;
    top: 50%;
    left: -1px;
    display: block;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-right: 5px;
    background: url(../img/icon_chk_off.png) no-repeat 0 0;
    background: 20px 20px;
}

.input_chk input+label:before {
    background: url(../img/icon_chk_off.png) no-repeat 0 0;
    background-size: 20px 20px;
}

.input_chk input:checked+label:before {
    background: url(../img/icon_chk_on.png) no-repeat 0 0;
    background-size: 20px 20px;
}

.txt_caution,
.txt_confirm,
.txt_reject {
    position: relative;
    display: block;
    margin-top: 6px;
    padding-left: 20px;
    padding-right: 10px;
    font-size: 14px;
    font-weight: 500;
    color: var(--deepgray);
}

.txt_confirm {
    color: var(--green);
}

.txt_reject {
    color: var(--red);
}

.txt_caution::before,
.txt_confirm::before,
.txt_reject::before {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    background: url(../img/icon_caution.png) left center no-repeat;
    top: 3px;
    left: 0;
}

.txt_confirm::before {
    background: url(../img/icon_confirm.png) left center no-repeat;
    width: 17px;
    height: 17px;
    /* top: 2px; */
}

.txt_reject::before {
    background: url(../img/icon_error_red.png) left center no-repeat;
    width: 17px;
    height: 17px;
    /* top: 2px; */
}

.black {
    color: black;
}

/* 홈1_지갑없음 */
.wrapper {
    background: url(../img/bg_main.png) center top no-repeat;
    /* background-size: cover; */
    background-size: 100%;
    background-color: white !important;
    height: 100%;
    max-width: 700px;
    margin: 0 auto;
    transform: rotate(0);
}

.wrapper .container {
    height: calc(100% - 78px);
    margin: 0 auto;
}

.wrapper .left {
    float: left;
    max-width: 35%;
}

.wrapper .left img {
    width: 100%;
}

.wrapper .right {
    float: right;
    max-width: 50%;
}

.wrapper .left,
.wrapper .right {
    margin: 1rem;
}

.wrapper .right a {
    position: relative;
    display: inline-block;
    width: 40px;
    padding: .5rem .2rem;
    text-align: center;
}

/* 
.wrapper .right a:nth-of-type(2):after {
    content: '';
    position: absolute;
    top: 7px;
    right: 5px;
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 6px;
    background: var(--red);
} */
.new_chk {
    display: block;
    position: absolute;
    top: 7px;
    right: 5px;
    width: 6px;
    height: 6px;
    border-radius: 6px;
    background: var(--red);
}

.my_wallet {
    /* width: calc(100% - 2rem); */
    width: 100%;
    /* min-height: 30vh; */
    border-radius: 10px;
    background: white;
    margin: 0rem;
    box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.08);
}

.my_wallet.no {
    width: calc(100% - 2rem);
    margin: 0 auto;
    padding: .6rem;
    /* min-height: 30vh; */
}

.dot_line {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 1px dotted var(--coral);
    border-radius: 8px;
    height: 100%;
    padding: 1.5rem 0;
}

.dot_line span {
    text-align: center;
    word-break: keep-all;
}

.dot_line span:nth-of-type(2) {
    margin-top: 1rem;
    font-size: 22px;
    font-weight: 700;
}

.dot_line span:nth-of-type(3) {
    margin-top: .3rem;
    font-size: 14px;
    color: var(--coral);
}

.dot_line a {
    margin-top: 1.4rem;
}

.link_underline {
    text-decoration: underline;
}

.cont {
    width: 100%;
    height: 60vh;

}

.cont div {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    overflow: hidden;
}

.bg_ani {
    position: relative;
}

.circle01 {
    position: absolute;
    left: 0;
    bottom: 0;
    animation: circle01 2s ease-in-out infinite;
}

@keyframes circle01 {
    0% {
        bottom: -4%;
    }

    50% {
        bottom: 0%;
    }

    100% {
        bottom: -4%;
    }
}

.circle02 {
    position: absolute;
    right: 0;
    bottom: 75%;
    animation: circle02 3s ease-out infinite;
    z-index: 10;
}

@keyframes circle02 {
    0% {
        bottom: 75%;
    }

    50% {
        bottom: 80%;
    }

    100% {
        bottom: 75%;
    }
}

.bg_ani div:nth-of-type(2) {
    text-align: center;
    padding-top: 5rem;
}

.bg_ani div:nth-of-type(2) p {
    width: 90%;
    margin: 1rem auto 0;
    word-break: keep-all;
}

.bg_ani div:nth-of-type(2) p .coral {
    color: var(--coral);
}

.txt_name,
.txt_sub {
    font-size: 16px;
    font-weight: 500;
}

.txt_name strong {
    font-size: 24px;
    font-weight: 700;
}

.input_txt_box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px;
    background: white;
    border-radius: 10px;
    margin-top: 10px;
    border: 1px solid #eee;
}

.txt_with_btn {
    width: calc(100% - 90px);
    padding: 15px;
    border: 0;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 700;
}

.inp_round {
    /* width: calc(100% - 90px); */
    width: 100%;
    padding: 15px;
    border: 0;
    border-radius: 10px;
    font-size: 18px;
    background: white;
}

.txt_with_btn:focus,
.inp_round:focus {
    color: var(--coral);
}

.btn_overlap {
    display: inline-block;
    width: 90px;
    padding: 0 15px;
    border: 0;
    background: none;
    text-align: center;
    text-decoration: underline;
    font-size: 16px;
}

.tit_tb {
    margin-top: 3rem;
    font-size: 18px;
    font-weight: 700;
}

/* 홈2_지갑있음 */
.container {
    width: 100%;
    height: 100%;
    padding: 1rem;
    overflow-y: auto;
    /* position: relative; */
    transform: rotate(0);
}

.simple_addr {
    width: 100%;
    height: 50px;
    /* padding: 1rem; */
    display: flex;
    align-items: center;
    background: var(--lightgray);
    border-radius: 10px 10px 0 0;
}

.simple_addr img {
    display: inline-block;
    width: 23px;
    padding-right: 8px;
    margin-left: 1rem;
}

.simple_addr span {
    width: 74px;
    border-right: 1px solid var(--lightgray);
    font-size: 16px;
}

/* .simple_addr span::after {
    content: '';
    width: 1px;
    height: 20px;
    background: var(--mediumgray);
    margin: 0 10px;
} */

.simple_addr input {
    display: inline-block;
    width: calc(100% - 104px - 1rem);
    text-align: right;
    text-decoration: underline;
    background: none;
    border: 0;
    font-size: 16px;
    padding-right: 10px;
}

.wallet_main_info {
    width: 100%;
    /* padding: 1rem 1.2rem; */
}

.user_refresh {
    width: 100%;
    /* height: 40px; */
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
}

.user {
    background: url(../img/icon_symbol.png) left center no-repeat;
    padding-left: 40px;
    height: 27px;
}

.user strong {
    font-size: 20px;
    margin-right: 3px;
}

.user span {
    font-size: 15px;
}

.btn_refresh {
    background: url(../img/icon_refresh.png) center center no-repeat;
    width: 27px;
    height: 33px;
    border: 0;
    background-size: 22px;
    opacity: .9;
}

.total_cdp {
    /* width: 100%; */
    margin: .5rem 1rem 1.8rem;
    text-align: right;
}

.total_cdp span:nth-of-type(2) {
    font-size: 18px;
    color: var(--navybk);
    font-weight: 500;
}

.total_cdp span:nth-of-type(3) {
    font-size: 16px;
    color: var(--darkgray);
}

.total_coral_big {
    font-size: 33px;
    color: var(--coral);
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
}

.two_btn {
    display: flex;
    align-items: center;
    /* border-top: 1px solid var(--palegray); */
    border-radius: 0 0 10px 10px;
    background: var(--whitegray);
}

.two_btn input {
    padding: 12px 45px;
    width: 50%;
    font-size: 18px;
    border: 0;
    background: none;
}

.two_btn input:nth-of-type(1) {
    /* border-right: 1px solid var(--palegray); */
}

/* .two_btn input:nth-of-type(1)::after {
    content: '';
    display: inline-block;
    width: 1px;
    height: 20px;
    background: var(--lightgray);
} */

.container article:nth-of-type(2) {
    position: relative;
    box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.08);
    border-radius: 10px 10px 10px 10px;
}

.request_ing,
.request_ing.termination {
    position: relative;
    background: white;
    border: 1px solid var(--lightcoral);
    border-radius: 10px 10px 10px 10px;
    margin: 2.8rem 0 0rem;
    z-index: 30;
}

.request_ing.termination {
    border: 1px solid var(--lightgray);
}

.state_badge {
    position: absolute;
    color: white;
    background: var(--coral);
    border-radius: 10px;
    text-align: center;
    padding: 3px 10px 20px;
    font-weight: 700;
    margin-bottom: -10px;
    z-index: 10;
    top: -27px;
}

.state_badge.termination {
    background: var(--mediumgray);
}

.state_badge.termination+.request_ing {
    border: 1px solid var(--lightgray);
}

.state_badge.termination+.request_ing .line_money span {
    color: var(--deepgray);
}

.request_ing div:nth-of-type(1) {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.request_ing div:nth-of-type(1) span {
    display: inline-block;
    padding: 1rem;
}

.request_ing div:nth-of-type(1) .btn_req_cancel {
    color: var(--red);
    text-decoration: underline;
    border: 0;
    background: none;
    padding: 1rem;
}

.btn_red_underline {
    color: var(--red);
    border: 0;
    background: none;
    padding: 2px 6px;
    border: 1px solid var(--red);
    border-radius: 4px;
    /* background: ; */
}

.termination .line_money {
    color: var(--deepgray);
}

.line_money {
    display: flex;
    width: 100%;
    align-items: flex-end;
    justify-content: space-between;
    text-align: right;
    padding: 0 1rem 1rem;
}

.btn_up {
    width: 37px;
    /* flex: 1; */
    height: 25px;
    border: 0;
    background: url(../img/arrow_up.png) center center no-repeat;
}

.btn_down {
    width: 37px;
    /* flex: 1; */
    height: 25px;
    border: 0;
    background: url(../img/arrow_down.png) center center no-repeat;
    background-size: 16px;
}

.line_money span:nth-of-type(1) {
    font-size: 28px;
    font-weight: 700;
    /* flex: 15; */
    display: inline-block;
    width: calc(100% - 60px);
    letter-spacing: -1px;
}

.line_money span:nth-of-type(2) {
    display: inline-block;
    /* flex: 1; */
    margin-left: 5px;
    font-size: 16px;
    font-weight: 300;
    margin-bottom: 5px;
}

.desc_gray {
    /* width: 100%; */
    padding: 10px;
    margin: 0 1rem 1rem 1rem;
    border: 1px solid var(--palegray);
    color: var(--darkgray);
    font-size: 13px;
    background: var(--whitegray);
    border-radius: 5px;
}

.desc_gray li {
    display: flex;
    /* justify-content: space-between; */
    align-items: center;
    min-height: 25px;
}

/* .desc_gray li span:nth-of-type(1) {
    display: inline-block;
    width: 65px;
} */

/* .desc_gray li span:nth-of-type(2) {
    display: inline-block;
    width: calc(100% - 65px);
    text-align: right;
} */

.desc_gray li span {
    display: block;
    width: 100%;
    text-align: right;
}

.desc_gray li:nth-of-type(1) span {}

.desc_gray li:nth-of-type(2) span {
    text-align: right;
}

.desc_gray li span.ta_l {
    text-align: left;
    font-weight: 500;
    color: var(--navybk);
}

.desc_gray li.caution_line {
    min-height: 40px;
    margin-top: 2vw;
}

.desc_gray li.caution_line span:nth-of-type(1) {
    display: block;
    width: 20px;
    vertical-align: text-top;
}

.desc_gray li.caution_line span:nth-of-type(2) {
    text-align: left;
    width: calc(100% - 20px);
}

.txc {
    margin: 1rem;
    font-size: 12px;
}



/* 이용내역 */
.usage_history {
    width: 100%;
    border-radius: 10px;
    /* border: 1px solid var(--lightgray); */
    box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.05);
    margin: 1rem 0;
}

.usage_history>div {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    font-size: 16px;
    background: var(--lightgray);
    color: var(--navybk);
    border-radius: 10px 10px 0 0;
}

.usage_history>div select {
    font-size: 16px;
    border: 0;
    background: transparent url(../img/arrow_down.png) right center no-repeat;
    background-size: 14px;
    font-weight: 500;
    color: var(--navybk);
    /* width: 30%; */
    padding: 0 1.5rem 0 1rem;
}

.usage_history ul {
    width: 100%;
    background: white;
    border-radius: 0px 0px 11px 11px;
}

.usage_history ul li {
    border-bottom: 1px solid var(--palegray);
    padding: .6rem 1rem;
}

.usage_history ul li:last-child {
    border-bottom: 0;
    border-radius: 0 0 10px 10px;
}

.info01 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 25px;
}

.info01>span:nth-of-type(1) {
    color: var(--deepgray);
    font-size: 12px;
    flex: 1;
}

.badge_gray,
.badge_blue,
.badge_red,
.badge_grayline {
    display: inline-block;
    padding: 1px 4px;
    /* width: 43px; */
    /* height: 19px; */
    text-align: center;
    font-size: 12px;
    border-radius: 4px;
    box-sizing: border-box;
}

.badge_gray {
    background: var(--lightgray);
    color: var(--navybk);
}

.badge_blue {
    background: var(--paleblue);
    color: var(--blue);
}

.badge_red {
    background: var(--palered);
    color: var(--red);
}

.badge_grayline {
    background: var(--palegray);
    /* border: 1px dotted var(--mediumgray); */
    color: var(--darkgray);
}

.h25 {
    height: 25px;
}

.info02 {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    /* flex-direction: column; */
    padding: .5rem 0 0;
}

.info03 {
    width: 100%;
    padding: .5rem 0 0;
}

/* 
.info02 span:nth-of-type(1) {
    width: 100px;
} */
.info02>span:nth-of-type(1) {
    /* width: 100px; */
    /* width: 100%; */
}


.font_m_bk {
    font-size: 12px;
    color: var(--navybk);
    /* font-weight: 500; */
}

.t_addr {
    font-size: 16px;
    color: var(--navybk);
    display: block;
    word-break: break-all;
    width: fit-content;
    margin-right: 4px;
}

/* .txt_tag {
    font-size: 12px;
    color: var(--lightcoral);
    font-weight: 500;
    letter-spacing: -.5px;
    display: block;
}

.txt_tag::before {
    content: '태그';
    display: inline-block;
    width: 25px;
    height: 15px;
    line-height: 14px;
    margin-right: 2px;
    background: var(--lightcoral);
    color: white;
    font-weight: 500;
    border-radius: 3px;
    text-align: center;
    font-size: 11px;
} */

.info02 .blue,
.info02 .red,
.info02 .black {
    font-size: 21px;
    font-weight: 700;
    color: var(--blue);
    letter-spacing: -1px;
    width: fit-content;
    display: inline-block;
}

.info02 .red {
    color: var(--red);
}

.info02 .black {
    color: var(--navybk);
}

/* 충전상세 */
.cont_area_detail {
    /* padding: .8rem; */
    border-radius: 10px;
    background: white;
    box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.06);
}

.c_d_2 {
    border-top: 1px solid var(--mediumgray);
    border-bottom: 1px solid var(--mediumgray);
    /* border-bottom: 1px solid var(--lightgray); */
    border-radius: 0;
    box-shadow: none;
}

ul.cont_area_detail li {
    display: flex;
    align-items: center;
    /* height: 40px; */
    justify-content: space-between;
    padding: .7rem .5rem;
    border-bottom: 1px solid var(--palegray);
}

ul.cont_area_detail li.dp_inherit {
    display: inherit;
}

.dp_inherit p {
    color: var(--deepgray);
    /* font-size: 14px; */
    margin-bottom: 5px;
}

ul.cont_area_detail.c_d_2 .dp_inherit span:nth-of-type(1) {
    display: block;
    width: 100%;
    line-height: 1.4;
    color: var(--navybk);
    background: var(--bluegray);
}

ul.cont_area_detail li.li_memo {
    height: auto;
}

ul.cont_area_detail li:last-child {
    border-bottom: 0;
}

ul.cont_area_detail li>span:nth-of-type(1)::before {
    content: '';
    position: absolute;
    /* top: 18px; */
    right: 0;
    display: inline-block;
    /* width: 1px; */
    height: 100%;
    border-radius: 0px;
    background: var(--palegray);
}


ul.cont_area_detail.c_d_2 li>span:nth-of-type(1) {
    color: var(--deepgray);
    /* width: 42%; */
}

ul.cont_area_detail.c_d_2 li>span:nth-of-type(2) {
    background: none;
    width: 56%;
    width: calc(100% - 110px);
}

ul.cont_area_detail li.li_memo::before {
    top: 30px
}

.cont_area_detail li span {
    display: inline-block;
    /* height: 40px; */
    line-height: 24px;
}

.cont_area_detail li>span:nth-of-type(1) {
    /* width: 29%; */
    min-width: 105px;
    /* border-right: 1px solid var(--whitegray); */
    white-space: nowrap;
    position: relative;
}

.cont_area_detail li>span:nth-of-type(2) {
    width: 69%;
    text-align: right;
    /* text-overflow: ellipsis; */
    /* white-space: nowrap; */
    /* text-overflow: clip; */
    word-break: break-all;
}

.btn_edit_memo {
    display: inline-block;
    background: url(../img/icon_edit.png) center center no-repeat;
    width: 30px;
    height: 30px;
    border: 0;
    padding: 3px;
    text-indent: -99px;
}

.edit_memo {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

ul.cont_area_detail li.li_edit {
    justify-content: space-between;
    align-items: flex-start;
    height: inherit;
}

.inp_edit_memo {
    display: block;
    border: 1px solid var(--lightgray);
    border-radius: 5px;
    padding: 5px;
    /* max-width: 200px; */
    min-width: 177px;
    width: 96%;
    margin-bottom: 3px;
}

.inp_memo_pop {
    display: block;
    border: 1px solid var(--lightgray);
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 3px;
    width: 100%;
    font-size: 15px;
}

.t_memo {
    font-size: 13px;
    width: 100%;
    color: var(--deepgray);
}

.btn_gray_s {
    padding: 5px 15px;
    color: var(--navybk);
    background: var(--lightgray);
    border-radius: 3px;
    border: 0;
}

.mr3 {
    margin-right: 3px;
}

.btn_blue_s {
    padding: 5px 15px;
    color: white;
    background: var(--blue);
    border-radius: 3px;
    border: 0;
}

.tit_detail {
    /* padding-left: 34px; */
}

.tit_detail2 {
    padding-left: 8px;
}

.badge_blue.large,
.badge_red.large,
.badge_gray.large {
    padding: 2px 4px;
    font-size: 16px;
    height: initial;
    width: inherit;
}

.empty_box {
    width: 58px;
}

.empty_box_long {
    width: 121px;
}

.btn_close,
.btn_qr {
    border: 0;
    padding: 1rem 1.1rem 1rem 1rem;
    background: none;
}

.btn_close img,
.btn_qr img {
    vertical-align: middle;
}

.width23 img {
    width: 23px;
}

.sub.detail {
    justify-content: space-between;
    height: 100vh;
    background: var(--bluegray);
}

.detail .top,
.detail .mid,
.detail .bot {
    width: 100%;
}

.detail .top {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 5px;
}

.detail .mid {
    flex: 10;
    /* margin: 1rem 0; */
    padding: 0 1rem;
    background: var(--bluegray);
    overflow: auto;
}

/* 서비스이용제한 */
.message_area {
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 1.5rem 1rem .5;
    text-align: center;
}

.message_area p:nth-of-type(1) {
    font-size: 20px;
    font-weight: 500;
    margin: 1rem 0;
}

.message_area p:nth-of-type(1) img {
    display: block;
    margin: 2rem auto;
}

.message_area p:nth-of-type(2) {
    margin: 1rem 1rem 1rem;
}

.cont_area_detail h3 {
    text-align: left;
    /* border-bottom: 1px solid var(--lightgray); */
    padding: 1rem 1.3rem;
}

.txt_cont {
    width: 100%;
}

.txt_cont span {
    display: inline-block;
}

.txt_cont p {
    margin: .5rem;
}

.highlight {
    /* position: relative; */
    background: linear-gradient(to top, var(--palered) 50%, white 50%);
    font-weight: 700;
}

.txt_cont p .coral {
    display: inline-block;
    margin-right: 10px;
    color: var(--coral);
    font-weight: 700;
}

/* .highlight::after{
    position: absolute;
} */
.txt_call {
    padding: 1.5rem 1rem;
}

/* 충전신청 */
.tit_lbl {
    margin-top: 1rem;
    font-size: 18px;
    /* font-weight: 700; */
    margin-bottom: 10px;
    padding-left: 5px;
}

.tit_box {
    margin-top: 1rem;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 10px;
}

.user_name {
    font-size: 18px;
    padding-left: 5px;
}

.txt_with_won {
    position: relative;
    width: calc(100% - 30px);
    padding: 15px;
    border: 0;
    border-radius: 10px;
    font-size: 20px;
    font-weight: 700;
    text-align: right;
}

.add_won {
    position: relative;
}

.add_won::after {
    position: absolute;
    top: 16px;
    right: 5px;
    content: '원';
    color: var(--deepgray);
    width: 40px;
    text-align: center;
    font-size: 18px;
}

.fake_tbl {
    width: 100%;
    background: white;
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #eee;
}

.fake_tbl div {
    font-size: 14px;
}

.fake_tbl div:first-child {
    width: 150px;
}

.fake_tbl div:first-child span {
    display: inline-block;
    width: 100%;
    padding: 10px 0;
    background: var(--paleblue);
    /* border-right: 1px solid var(--palegray); */
    margin: 0;
    text-align: center;
    font-weight: 500;
    color: var(--darkgray);
    border-bottom: 1px solid var(--mediumgray);
    border-bottom: 1px solid #d1d7dd;
}

.fake_tbl div:nth-of-type(2) {
    width: 100%;
}

.fake_tbl div:nth-of-type(2) span {
    display: inline-block;
    width: calc(100% - 0px);
    padding: 10px 8px;
    font-weight: 700;
    text-align: right;
    background: white;
}

.fake_tbl div:first-child span:first-child {
    border-radius: 10px 0 0 0;
}

.fake_tbl div:nth-of-type(2) span:first-child {
    border-radius: 0 10px 0 0;
}

.fake_tbl div:first-child span:last-child {
    border: 0;
    border-radius: 0 0 0 10px;
}

.fake_tbl div:nth-of-type(2) span:last-child {
    border: 0;
    border-radius: 0 0 10px 0;
}

.txt_s {
    font-size: 14px;
}

.white_box {
    /* background: #f3f3f3; */
    background: var(--whitegray);
    padding: 1rem;
}

/* 송금_간편주소 */
.sub.bg_white {
    background: white;
}

.tab_btns {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 5px;
    /* background: var(--bluegray); */
    /* background:var(--lightgray); */
    background: var(--pg2);
    padding: 3px;
    margin-top: 1rem;
}

.tab_btns a {
    display: inline-block;
    padding: 10px 0;
    flex: 1;
    color: var(--deepgray);
    text-align: center;
    border-radius: 5px;
    font-size: 18px;
}

.tab_btns a.on {
    background: white;
    color: var(--coral);
    box-shadow: 0px 4px 5px 5px rgba(0, 0, 0, 0.05);
    font-weight: 700;
}

.form_inner_box {
    margin: 1rem 0.2rem;
}

.tit_tf {
    display: block;
    font-weight: 600;
    margin-bottom: 5px;
}

.tit_tf2 {
    display: inline-block;
    /* font-weight: 600; */
    /* margin-bottom: 5px; */
}

.tf_underline {
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--lightgray);
    font-size: 24px;
    padding: 5px 0;
    font-weight: 700;
    margin-bottom: 3px;
    letter-spacing: -0.8px;
}

.tf_underline:focus {
    border-color: var(--coral);
    color: var(--coral);
}

.tf_underline.round {
    border-radius: 10px;
    padding-left: 8px;
}

.f_q {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--lightgray);
    padding: 5px 0;
}

.f_q.error {
    border-color: var(--red);
}

.inp_with_q:focus {
    color: var(--coral);
}

.f_q.error .inp_with_q {
    color: var(--red);
}

.inp_with_q {
    width: calc(100% - 30px);
    border: 0;
    font-size: 24px;
    font-weight: 700;
}

.with_q {
    display: inline-block;
    width: 25px;
    height: 25px;
    background: url(../img/icon_question_thin.png) right center no-repeat;
    background-size: 24px;
    border: 0;
}

.scroll_y {
    overflow-y: auto;
}

.uppercase {
    text-transform: uppercase;
}

.tf_underline.small {
    font-size: 18px;
    font-weight: 600;
}

.tf_underline2.small {
    font-size: 18px;
    font-weight: 600;
}

.desc_tf {
    display: block;
    text-align: right;
    color: var(--deepgray);
    font-size: 13px;
}

.lst_acc {
    width: 100%;
    /* max-height: 100px; */
    padding: 5px;
    height: auto;
    overflow-y: scroll;
    border-top: 1px solid var(--palegray);
    border-bottom: 1px solid var(--palegray);
    background: var(--whitegray);
    /* border-radius: 5px; */
}

.lst_acc li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    padding: 5px 0;
    min-height: 40px;
    border-bottom: 1px solid var(--whitegray);
}

.lst_acc.no_padding {
    width: 100%;
    padding: 0 0 6vw 0;
    height: auto;
    overflow-y: scroll;
    /* border: 1px solid var(--whitegray); */
    background: none;
}

.lst_acc.no_padding li {
    padding: 10px 0;
    border-bottom: 1px solid var(--whitegray);
}

.lst_acc li>span:first-child {
    display: flex;
    align-items: center;
    overflow: auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: calc(100% - 57px);
}

ul.w100 li span:first-child {
    width: 100%;
}

.lst_acc li>span:first-child img {
    margin-right: 7px;
    width: 35px;
}

.lst_acc li>span:nth-child(2) {
    width: 57px;
}

.tag {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* font-size: 14px; */
    /* border: 1px solid var(--darkgray); */
}

.tag span {
    display: inline-block;
    padding: 0 4px;
}

.tt_tag {
    border-radius: 4px;
    background: var(--coral);
    color: white;
    font-weight: 700;
    font-size: 11px;
    margin-left: 5px;
}

.tt_name {
    color: var(--deepcoral);
    font-size: 12px;
}

.lst_bank {
    margin: 0 2vw 10vw;
}

.bb_gray {
    padding-bottom: 2rem;
    margin-bottom: 2rem;
    border-bottom: 1px solid var(--lightgray);
}

.lst_bank li {
    float: left;
    width: 48%;
    display: flex;
    align-items: center;
    height: 55px;
}

.lst_bank li:nth-of-type(even) {
    float: right;
}

.lst_bank li img {
    width: 25px;
    margin-right: 10px;
}

.tit_small {
    margin: 2rem 1rem 1rem;
    margin-left: 5px;
    /* font-weight: 700; */
    color: var(--navybk);
}

.bank_area {
    margin: 0rem 1rem;
}

.btn_bank {
    display: inline-block;
    width: calc(100% - 35px);
    height: 35px;
    /* padding-left: 35px; */
    border: 0;
    text-align: left;
    background: white;
}

/* 송금 은행성공 */
.cont_success {
    width: 100%;
    margin-top: -20px;
    margin-bottom: 2rem;
}

.cont_success img {
    width: fit-content;
    margin-bottom: 15px;
}

.cont_fail {
    margin-top: 9rem;
}

.cont_fail img {
    margin-bottom: 10px;
}

.mg_hori_4vw {
    margin: 0 4vw;
}

.w_center {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
}

.w_left {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.font_l_bk {
    font-size: 20px;
    font-weight: 700;
}

.coral {
    color: var(--coral);
}

.blue {
    color: var(--blue)
}

.cont_success .coral {
    font-size: 24px;
    font-weight: 700;
}

.font_m_light {
    font-size: 18px;
}

.tit_red {
    margin-top: 4rem;
    margin-bottom: 10px;
    color: var(--red);
    font-weight: 700;
}

.tf_reason {
    display: block;
    width: 100%;
    height: 80px;
    max-height: 180px;
    background: var(--bluegray);
    border: 0;
    border-radius: 3px;
    color: var(--navybk);
    padding: 10px;
    margin-bottom: 10px;
    overflow-y: auto;
    white-space: pre-wrap;
}

.font_s_mediumgray {
    color: var(--mediumgray);
}

/* 공지사항, 설정 목록 */
.notice,
.notice_cont,
.mid .setting:first-child {
    width: 100%;
    border-top: 1px solid var(--palegray);
}

.notice li,
.notice_cont div,
.setting li {
    padding: 1rem;
    border-bottom: 1px solid var(--whitegray);
    cursor: pointer;
    /* position: absolute; */
}

.setting {
    /* border-bottom: 1px solid var(--palegray); */
    padding-bottom: 5px;
    background: var(--whitegray);
}

/* .min .setting */
.setting li {
    padding-right: 45px;
    background: white url(../img/arrow_right_gray.png) calc(100% - 22px) center no-repeat;
    /* opacity: .9; */
}

.setting li:first-child {
    border-top: 0;
}

.setting li:last-child {
    /* border-bottom: 1px solid var(--palegray); */
}

.setting li.li_type02 {
    padding-right: 15px;
    opacity: 1;
    background: white;
}

.setting li.li_type03 {
    padding-right: 15px;
    opacity: 1;
    background: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-height: 57px;
}

.setting li.li_type03 p {
    flex: 2;
}

.setting li.li_type03 div {
    flex: 5;
}

.setting li.li_type03 span {
    display: block;
    text-align: right;
    font-size: 12px;
}

.setting li.li_type03 span.red {
    color: var(--red);
}

.notice_cont div {
    border-bottom: 0;
}

.notice li p,
.notice_cont p,
.setting p {
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 16px;
    margin-top: 5px;

}

.notice_cont {
    /* height: 100vh; */
}

.slide_in {
    animation: change 0.2s ease forwards;
}

@keyframes change {
    from {
        transform: translateX(60%);
        visibility: visible;
    }

    to {
        transform: translateX(0%);
    }
}


.setting p {
    margin-top: 0;
}

.top.close.fix_tit {
    position: inherit;
}

.mid.no_padding {
    padding: 0;
    background: var(--whitegray);
}

.bg_white .top.close {
    background: white;
    margin-top: 5px;
}

.no_padding {
    padding: 0;
}

div.txt_cont {
    border-top: 1px solid var(--bluegray);
    background: var(--whitegray);
    padding: 1rem;
    border-radius: 0 0 10px 10px;
}

.date_full {
    font-size: 13px;
    color: var(--mediumgray);
    margin-right: 5px;
}

.badge_bk_n,
.badge_blue_n,
.badge_red_n,
.badge_gray_n {
    display: inline-block;
    padding: 1px 4px;
    /* width: 52px; */
    /* height: 17px; */
    text-align: center;
    font-size: 11px;
    border-radius: 4px;
    box-sizing: border-box;
    color: white;
}

.badge_red_n {
    background: var(--red);
}

.badge_bk_n {
    background: var(--navybk);
}

.badge_blue_n {
    background: var(--blue);
}

.badge_gray_n {
    background: var(--bluegray);
    color: var(--navybk);
}

.toggle_on {
    display: inline-block;
    float: right;
    width: 60px;
    height: 24px;
    background: url(../img/toggle_on.png) center center no-repeat;
    border: 0;
    text-indent: -99px;

}

.toggle_off {
    display: inline-block;
    float: right;
    width: 60px;
    height: 24px;
    background: url(../img/toggle_off.png) center center no-repeat;
    border: 0;
    text-indent: -99px;
}

/* 새로운 알림 */
.new_notifi li {
    padding: .5rem 1rem;
    /* border: 1px solid var(--lightgray); */
    border-radius: 10px;
    margin: 3vw 0;
    box-shadow: 0px 4px 5px 5px rgba(0, 0, 0, 0.05);
}

.new_notifi li:first-child {
    margin-top: 0;
}

.info02 span.simple_addr2 {
    color: var(--navybk);
    font-weight: 500;
    font-size: 15px;
    letter-spacing: -.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 130px;
}

.txt_alarm {
    display: inline-block;
    color: var(--navybk);
    font-size: 15px;
    letter-spacing: -.5px;
    width: 100%;
}

.new_notifi .badge_gray,
.new_notifi .badge_blue,
.new_notifi .badge_red,
.new_notifi .badge_grayline {
    min-width: 55px;
}

/* 지갑백업 */
.cont_area_detail2 {
    /* padding: 2vw; */
    border-radius: 10px;
    background: white;
    box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.06);
    border: 1px solid var(--lightgray);
}

ul.cont_area_detail2 li {
    display: flex;
    align-items: center;
    position: relative;
    /* height: 40px; */
    padding: 1rem;
    border-bottom: 1px solid var(--lightgray);
}

ul.cont_area_detail2 li:last-child {
    border-bottom: 0;
}

.cont_area_detail2 li span {
    display: inline-block;
    line-height: 20px;
    height: 20px;
}

.cont_area_detail2 li span:nth-of-type(1) {
    width: 80px;
    border-right: 1px solid var(--palegray);

}

.cont_area_detail2 li span:nth-of-type(2) {
    width: calc(100% - 80px);
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
}

.underline {
    text-decoration: underline;
}

.mt20 {
    margin-top: 20px;
}

.mt30 {
    margin-top: 30px;
}

.mt10vw {
    margin-top: 30px;
}

.mt5vw {
    margin-top: 5vw;
}

.mt2vw {
    margin-top: 2vw;
}

.center {
    text-align: center;
}

.celebration {
    text-align: center;
}

.celeb {
    width: 45vw;
    margin: 15vw auto 0;
}

.tit_tf2 {
    display: inline-block;
    /* font-weight: 600; */
    /* margin-bottom: 1vw; */
    word-break: keep-all;
}

.desc_tf2 {
    display: inline-block;
    text-align: right;
    color: var(--deepgray);
    font-size: 13px;
    word-break: keep-all;
}

div.desc_tf2 {
    display: block;
}

.between {
    display: flex;
    justify-content: space-between;
}

.desc_s {
    font-size: 13px;
    color: var(--deepgray);
    margin-top: 1rem;
    margin: 1rem .5rem 0;
    text-indent: 2px;
}

/* alert */
.dim {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background: rgba(134, 134, 134, 0.3); */
    display: flex;
    justify-content: center;
    align-content: center;
    z-index: 9999;
}

.blur {
    /* filter: blur(5px); */
}

.d_arc {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 2rem);
    border-radius: 10px;
    /* 그림자 주석처리 금지! 
    간편전송 alert창 그림자도 없어져버림 230310*/
    box-shadow: 0 6px 27px 11px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    align-content: center;
    background: white;
    z-index: 1100;
}

.d_arc_top {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 27px);
    width: 100vw;
    display: flex;
    flex-direction: column;
    align-content: center;
    background: transparent;
    z-index: 1100;
}

.pop_cont {
    width: 100%;
    padding: 5vw;
    text-align: center;
    font-size: 16px;
}

.red {
    color: var(--red);
}

.green {
    color: var(--green);
}

.coral {
    color: var(--coral);
}

.pop_cont p {
    word-break: keep-all;
}

.pop_cont img {
    display: inline-block;
    margin-bottom: 3vw;
}

.pop_btn_area {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

input[type="button"].btn_single_pop {
    width: 100%;
    height: 50px;
    color: white;
    background: linear-gradient(145deg, var(--coral) 10%, var(--orange) 100%);
    /* background: var(--coral); */
    border-radius: 5px;
    border: 0;
    font-size: 16px;
    font-weight: 500;
    border-radius: 0 0 10px 10px;
}

.btn_pop_close {
    float: right;
    display: inline-block;
    padding: 10px;
    width: 48px;
    border: 0;
    background: none;
    /* text-decoration: underline; */
    font-size: 15px;
    line-height: 21px;
}

.t_fee {
    display: flex;
    align-items: center;
}

.today_close {
    float: left;
    padding: 10px;
    padding-left: 25px;
}

.tit_pop_notice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 2px;
    border-bottom: 1px solid #eee;
}

p.break_p {
    word-break: break-all;
}

/* loading */
.wrap_loading {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 200;
}

.line {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 12px;
    background-color: #000;
    margin-right: 5px;
}

.cir01 {
    background-color: var(--deepcoral);
}

.cir02 {
    background-color: var(--coral);
}

.cir03 {
    background-color: var(--orange);
}

.cir_w {
    background-color: white;
}

.load_3 .line:nth-last-child(1) {
    animation: loadingC 0.5s 0.1s linear infinite;
}

.load_3 .line:nth-last-child(2) {
    animation: loadingC 0.5s 0.2s linear infinite;
}

.load_3 .line:nth-last-child(3) {
    animation: loadingC 0.5s 0.3s linear infinite;
}

@keyframes loadingC {
    0 {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(0, 8px);
    }

    100% {
        transform: translate(0, 0);
    }
}

.wrap_top_loading {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    margin-top: env(safe-area-inset-top)
}

/* popup */
.tit_pop {
    border-radius: 10px 10px 0 0;
    /* padding: 5vw 8vw 0; */
    height: 50px;
    line-height: 50px;
    padding: 0 20px;
    /* border-bottom: 1px solid var(--lightgray); */
}

.tp_t {
    display: inline-block;
    padding-bottom: 11px;
    font-size: 18px;
    line-height: 27px;
    border-bottom: 2px solid var(--coral);
    margin-bottom: -1px;
}

.pop_txt {
    text-align: left;
    height: 100%;
    max-height: 48vh;
    overflow: auto;
}

input[type="button"].btn_dual_cancel,
input[type="button"].btn_dual_confirm {
    width: 50%;
    /* padding: 4vw 0; */
    height: 50px;
    color: white;
    font-weight: 500;
    font-size: 16px;
    border: 0;
}

.btn_dual_cancel {
    background: var(--mediumgray);
    border-radius: 0 0 0 10px;
}

.btn_dual_confirm {
    background: var(--coral);
    border-radius: 0 0 10px 0;
}

.link_bk {
    color: var(--navybk);
    font-weight: 700;
    text-decoration: underline;
}

/* 데이터 없음 */
.no_data {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 0 0 10px 10px !important;
    background-color: white !important;
}

.no_data_main {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: calc(100vh - 540px);
}

.no_data_sub {
    justify-content: center;
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 20vh;
    border: 1px solid var(--palegray);
    border-bottom: 1px solid var(--palegray);
    border-radius: 5px;
}

.no_data_push {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 100%;
}

.symbol_gray {
    width: 50px;
    opacity: 0.5;
}

.txt_nodata {
    margin-top: 20px;
    font-size: 14px;
    color: #aaa;
}

/* 시스템 점검안내 */
.box_system_chk {
    border-top: 1px solid var(--palegray);
    padding: 0 5vw 0vw;
    text-align: left;
    max-width: 600px;
}

.box_system_chk p {
    padding: 0 0vw 3vw;
    border-bottom: 1px solid var(--palegray);
    font-size: 16px;
    text-indent: 20px;
}

.box_system_chk img {
    display: block;
    width: 60%;
    max-width: 200px;
    margin: 5vw auto;
}

.box_system_chk .lst_ag2 {
    padding-top: 2vw;
}

.box_system_chk .lst_ag2 li {
    margin-top: 1vw;
}

.box_system_chk .coral {
    margin-right: 10px;
}

.t_acc {
    width: 100%;
    background: var(--whitegray);
    border: 1px solid var(--palegray);
    padding: 1rem;
    color: var(--deepcoral);
    margin-top: 7px;
    text-align: center;
    font-weight: 600;
    border-radius: 5px;
}

.btn_favorite,
.btn_delete {
    display: inline-block;
    max-width: 22px;
    max-height: 22px;
    margin: 2px;
    border: 0;
    text-indent: 9999px;
}

.btn_favorite.on {
    background: url(../img/icon_star_on.png) center center no-repeat;
    background-size: contain;
}

.btn_favorite.off {
    background: url(../img/icon_star_off.png) center center no-repeat;
    background-size: contain;
}

.btn_delete {
    background: url(../img/icon_delete.png) center center no-repeat;
    background-size: contain;
}

span.t_bank {
    white-space: normal;
}

.tb_name,
.tb_num {
    display: inline-block;
    width: 100%;
}

.tb_name {
    color: var(--navybk);
    /* font-size: 18px; */
    /* display: inline-block; */
    /* height: 18px; */
}

.tb_num {
    font-size: 12px;
    color: var(--darkgray);
    /* height: 13px; */
    display: inline-block;
    margin-top: -4px;
}

.inp_ta {
    display: block;
    border: 1px solid var(--lightgray);
    border-radius: 5px;
    padding: 5px;
    width: 100%;
    height: 70px;
    font-size: 18px;
    margin-bottom: 3px;
}

.inp_ta:focus {
    color: var(--coral);
}

.cont_area_detail li span.ta_area {
    display: block;
    width: 80%;
    background: var(--palegray);
    padding: 3vw;
    border-radius: 4px;
    white-space: normal;
    text-align: left;
}

.ta2 {
    border: 1px solid var(--lightgray);
    width: 100%;
    padding: 5px;
    border-radius: 3px;
    font-size: 16px;
}

.input_form.fee {
    /* border-radius: 0; */
    border-top: 1px solid var(--mediumgray);
    border: 1px solid var(--lightgray);
}

/* .num_fee{
    display: inline-block;
    font-size: 14px;
    color: var(--red);
} */
.mg0 {
    margin: 0;
}

.fake_tbl.bg div:nth-of-type(2) .f_th {
    background: var(--bluegray);
}

.desc_gray.mg0 p {
    position: relative;
    padding-left: 17px;
    margin-top: 3px;
}

.inp_gray {
    border: 1px solid var(--lightgray);
    border-radius: 3px;
    height: 35px;
    background: white;
    text-align: right;
    padding: 0 5px;
    width: 100%;
    font-size: 16px;
}

.terms {
    overflow: auto;
}

.terms p {
    padding: 2rem;
    margin: 1rem;
    background: white;
}

/* 축하 애니메이션 */
.cls-1 {
    fill: var(--blue);
}

.cls-2 {
    fill: #ffc81e;
}

.cls-3 {
    fill: var(--deepcoral);
}

.cls-4 {
    fill: var(--green);
}

.cls-5 {
    fill: none;
    stroke-width: 6px;
}

.cls-5,
.cls-6 {
    stroke: #000;
    stroke-linecap: round;
    stroke-miterlimit: 10;
}

.mask {
    fill: black;
    stroke: white;
    stroke-width: 5px;
}

#squiggle-mask-path {
    stroke-dasharray: 80;
    stroke-dashoffset: 80;
    animation: animate-stroke 1s 1.1s forwards cubic-bezier(0, 1, .53, 1);
}

#left-line-mask-path {
    stroke-dasharray: 38;
    stroke-dashoffset: -38;
    animation: animate-stroke 1s 1.2s forwards cubic-bezier(0, 1, .53, 1);
}

#right-line-mask-path {
    stroke-dasharray: 38;
    stroke-dashoffset: -38;
    animation: animate-stroke 1s 1.2s forwards cubic-bezier(0, 1, .53, 1);
}

@keyframes animate-stroke {
    100% {
        stroke-dashoffset: 0;
    }
}


#mint-burst {
    transform: translateY(70px);
    animation: move-stars 1s 1s forwards cubic-bezier(0, 1, .53, 1);
}

#yellow-burst {
    transform: translate(40px, 10px);
    animation: move-stars 1s 1s forwards cubic-bezier(0, 1, .53, 1);
}

#red-burst {
    transform: translate(-40px, 10px);
    animation: move-stars 1s 1s forwards cubic-bezier(0, 1, .53, 1);
}

#blue-star {
    transform: translate(10px, 40px);
    animation: move-stars 1s 1025ms forwards cubic-bezier(0, 1, .53, 1);
    display: inherit;
}

#yellow-star {
    transform: translate(-10px, 45px);
    animation: move-stars 1s 1050ms forwards cubic-bezier(0, 1, .53, 1);
}

@keyframes move-stars {
    100% {
        transform: translateY(0);
    }
}

.dot {
    animation: reveal-dots 0.9s 1.2s both cubic-bezier(0, 1, .53, 1);
    opacity: 0;
    transform: translate(-5px, 10px);

}

.dot.left-side {
    transform: translate(5px, 10px);
}

@keyframes reveal-dots {
    100% {
        opacity: 1;
        transform: translate(0, 0);
    }
}

.tag_circle {
    display: inline-block;
    margin-bottom: 4vw;
}

/* QR코드스캔 */
.bg_white .top.dark {
    background: var(--navybk);
    color: white;
    margin-top: 0;
}

.bg_white .mid.camera {
    background: var(--navybk);
    opacity: 0.9;
    color: white;
}

.bg_white .bot.qr {
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--navybk);
    margin: 0;
    padding: 0;
    text-align: center;
}

.btn_qr.white img {
    width: 50px;
}

.mid.camera {
    display: flex;
    align-items: center;
    justify-content: center;
}

.qr_frame {
    width: 55vw;
    height: 55vw;
    position: relative;
}

.qr_frame span {
    width: 8vw;
    height: 8vw;
    position: absolute;

}

.frame01 {
    top: 0;
    left: 0;
    border-top: 3px solid white;
    border-left: 3px solid white;
}

.frame02 {
    top: 0;
    right: 0;
    border-top: 3px solid white;
    border-right: 3px solid white;
}

.frame03 {
    bottom: 0;
    left: 0;
    border-left: 3px solid white;
    border-bottom: 3px solid white;
}

.frame04 {
    bottom: 0;
    right: 0;
    border-right: 3px solid white;
    border-bottom: 3px solid white;
}

/* cmj add 220425 자세히보기 버튼추가 */
.btn_detail {
    float: right;
    text-decoration: underline;
    font-size: 13px;
}

.ls-1 {
    letter-spacing: -1px;
}


/* cmj add 220502 충전신청 레이어팝업 */
#layerPannel {
    position: fixed;
    top: 100%;
    /* bottom: 0; */
    left: 0;
    z-index: 9999;
    transition-duration: .3s;
    transition-timing-function: ease-in-out;
}

#layerPannel2 {
    position: fixed;
    background-color: transparent;
    /* margin-top: env(safe-area-inset-top); */
    top: 100%;
    /* bottom: 0; */
    left: 0;
    z-index: 9999;
    transition-duration: .3s;
    transition-timing-function: ease-in-out;
}

/* cmj add 220526 이미지 수정 */

/* 앱접근권한동의 */
.wrap_sub .lst_ag .fl_l img {
    width: 49px;
}

.txt_caution::before,
.txt_confirm::before,
.txt_reject::before {
    background-size: 15px;
}

.btn_back img {
    width: 18px;
}

.pop_cont img {
    max-width: 100%;
}

/* 메인로고 */
.wrapper .left {
    float: left;
    max-width: 35%;
    max-width: 137px;
}

.wrapper .right a img {
    width: 100%;
    max-width: 25px;
}

.wrapper .right a:nth-of-type(3) img {
    max-width: 29px;
}

.btn_close img,
.btn_qr img {
    vertical-align: middle;
    width: 21px;
}

.dot_line span img {
    width: 68px;
}

.bg_ani div:nth-of-type(2) img {
    width: 116px;
}

.circle01 {
    width: 156px;
}

.circle02 {
    width: 60px;
}

@keyframes refresh-rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}

.btn_refresh {
    background-size: 27px;
    -webkit-tap-highlight-color: transparent;
}

.btn_refresh.rotate {
    animation: refresh-rotate;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    background-size: 30px;
    -webkit-tap-highlight-color: transparent;
}

.user {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    background-size: 23px;
    padding-left: 34px;

}

.tag_ac {
    display: flex;
    align-items: center;
}

.txt_tag {
    font-size: 16px;
    color: var(--lightcoral);
    font-weight: 500;
    letter-spacing: -.5px;
    display: inline;
    line-height: 16px;
}

.tag_bg {
    display: inline-block;
    width: 27px;
    height: 16px;
    line-height: 16px;
    /* margin: 0 2px; */
    margin-right: 2px;
    background: var(--lightcoral);
    color: white;
    font-weight: 500;
    border-radius: 3px;
    text-align: center;
    font-size: 12px;
}

.btn_up {
    background-size: 16px;
}

.btn_edit_memo {
    background-size: 18px;
}

.fake_tbl div:nth-of-type(2) .f_th {
    border-bottom: 1px solid var(--lightgray);
}

.cont_fail img {
    width: 40px;
}

.lst_acc li>span:first-child img {
    width: 22px;
}

.btn_qr img {
    width: 24px;
}

.cont_success img {
    width: 40px;
}

.setting li {
    background-size: 10px;
}

.toggle_on,
.toggle_off {
    background-size: 44px;
}

.lst_acc li>span:first-child {
    width: calc(100% - 76px);
}

.lst_acc li>span:nth-child(2) {
    width: 90px;
}

.btn_favorite.on,
.btn_favorite.off {
    margin: 0 15px;
}

.imsi_congratu {
    width: 50%;
    margin-top: 30px;
}

.tit_tb {
    margin-top: 20px;
}

/* add cmj 220530 */
.t_acc {
    position: relative;
    text-align: left;
    padding: 1rem;
    padding-right: 1rem;
}

.btn_copy {
    width: 22px;
    height: 22px;
    background: transparent url(../img/icon_copy.png) 100% center no-repeat;
    border: 0;
    background-size: 100%;
    position: absolute;
    right: 1rem;
    top: 1rem;
}

.btn_copy_gray {
    width: 18px;
    height: 17px;
    background: transparent url(../img/icon_copy_gray.png) 100% center no-repeat;
    border: 0;
    background-size: 100%;
    vertical-align: middle;
}

.tit_lbl .badge_red {
    margin-left: 3px;
}

/* 220607 */
.tf_underline2 {
    width: calc(100% - 85px);
    border: 0;
    /* border-bottom: 1px solid var(--lightgray); */
    border-radius: 10px;
    font-size: 20px;
    padding: 10px 7px;
    font-weight: 700;
    /* margin-bottom: 3px; */
    letter-spacing: -0.8px;
    text-align: right;
}

.tf_underline2:focus {
    border-color: var(--coral);
    color: var(--coral);
}

.tf_underline2.round {
    border-radius: 10px;
    padding-left: 8px;
}

.lbl_tt {
    background: white;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 5px;
    padding-left: 7px;
    border: 1px solid #eee;
}

.tit_tf2 {
    display: inline-block;
    word-break: keep-all;
    font-size: 18px;
    padding: 10px 0 0px;
}

.tit_tf3 {
    display: inline-block;
    padding: 13px 0 7px;
    word-break: keep-all;
    color: var(--mediumgray);
    margin-left: 3px;
}

.form_inner_box2 {
    margin: 12px 0;
}

textarea {
    resize: none;
}

.inp_ta {
    border: 0;
}

.cont_area_detail li span.link_blueline {
    width: inherit;
    color: var(--blue);
    text-decoration: underline;
    background: url(../img/go.png) left center no-repeat;
    background-size: 14px;
    padding-left: 17px;
}

.area_img {
    padding: 0;
    width: 100%;
    max-height: calc(94vh - 154px);
    overflow-x: hidden;
    overflow-y: auto;
}

.area_img img {
    width: 100%;
}

.sub section.inner_white {
    background: white;
}

.inner_white {
    background: white;
}

.lst_acc2 {
    width: 100%;
    padding: 0 5px;
    height: auto;
    overflow-y: auto;
    border: 1px solid var(--palegray);
    border-bottom: 1px solid var(--palegray);
    background: white;
    border-radius: 5px;
}

.lst_acc2 li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    padding: 4px 2px;
    min-height: 64px;
    /* max-height: 68px; */
    border-bottom: 1px solid var(--whitegray);
    overflow: hidden;
    overflow-x: hidden;
}

.lst_acc2 li>span:first-child {
    display: flex;
    align-items: center;
    overflow: auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: calc(100% - 57px);
}


.lst_acc2 li>span:first-child img {
    margin-right: 7px;
    width: 22px;
}

.lst_acc2 li>span:nth-child(2) {
    width: 96px;
}


.unread {
    position: relative;
    text-indent: 10px;
}

.new_chk2 {
    display: block;
    position: absolute;
    top: 7px;
    left: -1px;
    width: 6px;
    height: 6px;
    border-radius: 6px;
    background: var(--red);
}

.sub2 {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--bluegray);
    flex-direction: column;
    overflow: auto;
}

.top_num {
    width: 100%;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 5px;
}

.area_money {
    flex: 5;
    display: flex;
    align-items: center;
    justify-content: center;
}

.box_money_txt {
    text-align: center;
}

.big_num {
    font-size: 35px;
    color: black;
    font-weight: 700;
    /* font-family: 'Open Sans'; */
    letter-spacing: -1px;
}

.txt_won {
    font-size: 30px;
    font-weight: 700;
    display: inline-block;
    margin-left: 4px;
}

.num_ko {
    text-align: center;
    margin-top: 5px;
}

.area_num {
    flex: 4;
    margin: 0;
    padding: 1rem;
    padding-bottom: 0;
    background: white;
    border-radius: 20px 20px 0 0;
    width: 100%;
    max-width: 700px;
}

.money_fix {
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn_m_set {
    margin-right: 2vw;
    flex: 1;
    background: var(--bluegray);
    text-align: center;
    padding: 2vw;
    border-radius: 3px;
}

.btn_m_set:last-child {
    margin-right: 0;
}

.num_pad {
    margin-top: 3vw;
}

.num_pad li {
    display: flex;
    /* flex-direction: column; */
    align-items: center;
    justify-content: space-between;
}

.w_won {
    display: flex;
    align-items: center;
    justify-content: center
}

.num_pad li span {
    flex: 1;
    padding: 4vw 0;
    max-height: 85px;
    text-align: center;
    font-size: 24px;
    color: black;
    font-weight: 900;
    font-family: 'Open Sans';
}

.area_bot {
    padding: 1rem;
    background: white;
    width: 100%;
}

.width23 img {
    width: 25px;
}

.w_bs {
    width: 82px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.bank_selc {
    display: inline-block;
    padding: 10px 0;
    word-break: keep-all;
    font-size: 18px;
    max-width: 68px;
    min-width: 68px;
    white-space: nowrap;
    overflow: hidden;
}

.bank_selctd {
    display: inline-block;
    padding: 10px 0;
    word-break: keep-all;
    font-size: 18px;
    max-width: 68px;
    min-width: 68px;
    white-space: nowrap;
    overflow: hidden;
}

.ico_down {
    display: inline-block;
    margin-left: 5px;
    width: 8px;
    vertical-align: middle;
}

.ico_bank {
    display: inline-block;
    margin-right: 2px;
    width: 15px;
    vertical-align: middle;
}


.inp_bank {
    width: calc(100% - 110px);
    border: 0;
    border-radius: 10px;
    font-size: 20px;
    padding: 10px 7px;
    font-weight: 700;
    letter-spacing: -0.8px;
    text-align: right;
}

.fake_inp {
    width: calc(100% - 85px);
    border: 0;
    border-radius: 10px;
    font-size: 20px;
    padding: 10px 7px;
    letter-spacing: -0.8px;
    text-align: right;
    color: var(--deepgray);
    font-weight: 300;
}

.fake_inp_dis {
    width: calc(100% - 85px);
    border: 0;
    border-radius: 10px;
    font-size: 20px;
    padding: 10px 7px;
    font-weight: 700;
    /* margin-bottom: 3px; */
    letter-spacing: -0.8px;
    text-align: right;
    /* color:var(--deepgray); */
}

.fake_inp_val {
    width: calc(100% - 85px);
    border: 0;
    border-radius: 10px;
    font-size: 20px;
    padding: 10px 7px;
    /* font-weight: 300; */
    /* margin-bottom: 3px; */
    letter-spacing: -0.8px;
    text-align: right;
    /* color:; */
}

.fake_selc {
    min-width: 68px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* font-size: 16px; */
    background: transparent;
    font-weight: 500;
    color: var(--navybk);
    /* padding: 0 1.5rem 1rem; */
}

.fake_selc2 {
    min-width: 68px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    background: transparent;
    font-weight: 500;
    color: var(--navybk);
}

/* 이용내역 셀렉트박스 */
div.bx_opt {
    flex-shrink: 0;
    width: 100%;
    background: white;
    border-radius: 20px 20px 0 0;
    padding: 0 10px;
    box-shadow: 0 -10px 10px 10px rgba(0, 0, 0, 0.02);
}

.fake_opt {
    width: 100%;
    padding: 10px 5px;
    /* border-bottom: 1px solid var(--whitegray); */
    font-size: 16px;
    color: var(--navybk);
}

ul.fake_opt li {
    display: flex;
    align-items: center;
    border-color: var(--whitegray);
    padding: 13px 10px;
}

.icon_selc {
    display: inline-block;
    width: 22px;
    margin-right: 9px;
    /* vertical-align: middle; */
}

input[type="button"] {
    -webkit-tap-highlight-color: transparent;
    /* color: -apple-system-blue; */
    color: black;
    /* ↑↑↑ color: black 으로 고정 !! 주석처리하지말것 !! 220719 */
    /* color: inherit; */
}

.p_n_chk {
    padding: 3px 10px;
}

.pop_cont img {
    max-width: 80px;
}

.desc_tf3 {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    text-align: right;
    color: var(--deepgray);
    font-size: 13px;
    margin-top: 2px;
}

.icon_q {
    display: inline-block;
    margin-right: 3px;
    margin-top: 2px;
    width: 15px;
}

.fix {
    flex: 0;
    margin-top: 10px;
}

.top h2 {
    font-size: 24px;
}

.bar_v {
    display: inline-block;
    width: 1px;
    height: 20px;
    background: var(--palegray);
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */


/* add cjm 220530 */
body {
    overflow: hidden;
}

#root {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    color: var(--navybk);
}

.notice_content img {
    max-width: 100%;
}

.blue {
    color: var(--blue)
}

.tit_pop_notice h2 {
    margin: 3vw 0;
    text-align: center;
    width: 100%;
}

.wrapper,
.sub,
#layerPannel {
    padding-top: env(safe-area-inset-top);
}

.refresh_cont {
    position: absolute;
    display: flex;
    top: env(safe-area-inset-top) + 78;
    height: 70px;
    background-color: var(--coral);
}

.input_chk.bt_right.p_n_chk {
    margin-top: 0;
    border-top: 0;
}

/* 가입완료 애니메이션1 - 체크 형태 */
.swal-icon--success {
    border-color: #a5dc86
}

.swal-icon--success:after,
.swal-icon--success:before {
    content: "";
    border-radius: 50%;
    position: absolute;
    width: 60px;
    height: 120px;
    background: transparent;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.swal-icon--success:before {
    border-radius: 120px 0 0 120px;
    top: -7px;
    left: -33px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 60px 60px;
    transform-origin: 60px 60px
}

.swal-icon--success:after {
    border-radius: 0 120px 120px 0;
    top: -11px;
    left: 30px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 60px;
    transform-origin: 0 60px;
    -webkit-animation: rotatePlaceholder 4.25s ease-in;
    animation: rotatePlaceholder 4.25s ease-in
}

.swal-icon--success__ring {
    width: 80px;
    height: 80px;
    border: 4px solid var(--palered);
    border-radius: 50%;
    box-sizing: content-box;
    position: absolute;
    left: -4px;
    top: -4px;
    z-index: 2
}

.swal-icon--success__hide-corners {
    width: 5px;
    height: 90px;
    background-color: transparent;
    padding: 1px;
    position: absolute;
    left: 28px;
    top: 8px;
    z-index: 1;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.swal-icon--success__line {
    height: 5px;
    background-color: var(--coral);
    display: block;
    border-radius: 2px;
    position: absolute;
    z-index: 2
}

.swal-icon--success__line--tip {
    width: 25px;
    left: 14px;
    top: 46px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-animation: animateSuccessTip .75s;
    animation: animateSuccessTip .75s
}

.swal-icon--success__line--long {
    width: 47px;
    right: 8px;
    top: 38px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-animation: animateSuccessLong .75s;
    animation: animateSuccessLong .75s
}

.swal-icon {
    width: 80px;
    height: 80px;
    border-width: 4px;
    border-style: solid;
    border-radius: 50%;
    padding: 0;
    position: relative;
    box-sizing: content-box;
    margin: -5px auto 20px
}

/* .swal-icon:first-child {
    margin-top: 32px
} */

@keyframes animateSuccessLong {
    0% {
        width: 0;
        right: 46px;
        top: 54px
    }

    65% {
        width: 0;
        right: 46px;
        top: 54px
    }

    84% {
        width: 55px;
        right: 0;
        top: 35px
    }

    to {
        width: 47px;
        right: 8px;
        top: 38px
    }
}

@keyframes rotatePlaceholder {
    0% {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

    5% {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

    12% {
        -webkit-transform: rotate(-405deg);
        transform: rotate(-405deg)
    }

    to {
        -webkit-transform: rotate(-405deg);
        transform: rotate(-405deg)
    }
}

@keyframes animateSuccessTip {
    0% {
        width: 0;
        left: 1px;
        top: 19px
    }

    54% {
        width: 0;
        left: 1px;
        top: 19px
    }

    70% {
        width: 50px;
        left: -8px;
        top: 37px
    }

    84% {
        width: 17px;
        left: 21px;
        top: 48px
    }

    to {
        width: 25px;
        left: 14px;
        top: 45px
    }
}

/* 가입완료 애니메이션2 - 지갑 */
.wrap_ani {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.container_a {
    /* position: absolute; */
    display: flex;
    justify-content: center;
    align-items: center;
    /* background-color: white; */
    border-radius: 5px;
    width: 100%;
    height: 120px;
    margin-top: 28px;
    /* For Neumorphism Effect */
    /* background-color:#E0E5EC; */
    /* box-shadow: 9px 9px 16px rgb(163,177,198,0.6), -9px -9px 16px    rgba(255,255,255, 0.5); */
    /* For Neumorphism Effect */
}

.wallet {
    display: block;
    position: absolute;
    background-color: var(--coral);
    height: 70px;
    width: 100px;
    border-radius: 5px;
    z-index: 10;
    opacity: 1.0;
}

.walletb {
    position: relative;
    right: -50px;
    height: 70px;
    width: 100px;
    background-color: #ce523f;
    border-top-right-radius: 15px;
    border-radius: 10px;
    z-index: 1;
}

.lock {
    position: relative;
    background-color: #eee;
    height: 22%;
    width: 25%;
    left: 81%;
    top: 35%;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}

.circle {
    position: relative;
    border-radius: 50%;
    background-color: #ccc;
    width: 6px;
    height: 6px;
    top: 5px;
    left: 7px;
    z-index: 99999;
}

.money {
    display: block;
    position: relative;
    background-color: #4ca863;
    width: 90px;
    height: 50px;
    bottom: 10px;
    right: 42px;
    transform: rotate(-30deg);
    z-index: 5;
    animation-name: wallet;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease;
}

@keyframes wallet {
    0% {
        bottom: 8%;
        transform: rotate(10deg);

    }

    15% {
        bottom: 12%;
        transform: rotate(-10deg);

    }

    25% {
        bottom: 16%;
        transform: rotate(-20deg);

    }

    50% {
        bottom: 20%;
        transform: rotate(-27deg);

    }

    100% {
        bottom: 24%;
        transform: rotate(-30deg);
    }
}

.krw {
    position: relative;
    font-size: 28px;
    left: 65px;
    bottom: 0px;
    color: #555;
}



/* font size */
.tit_app_guide,
.top h2,
.txt_name strong,
.cont_success .coral {
    font-size: 26px;
}

.box_system_chk p,
.lst_ag2,
.user span,
.request_ing div:nth-of-type(1) .btn_req_cancel,
.txt_gray_s,
.btn_detail,
.txt_caution,
.txt_confirm,
.txt_reject,
.dot_line span:nth-of-type(3),
.desc_tf2,
.desc_s,
.info01>span:nth-of-type(1),
.desc_gray,
.font_m_bk,
.txt_nodata,
.inp_edit_memo,
.btn_gray_s,
.btn_blue_s,
.inp_memo_pop,
.t_memo,
.fake_tbl div,
.txt_s,
.tb_num,
.desc_tf3,
.dp_inherit p,
.btn_bank,
.date_full,
.info02 span.simple_addr2,
.tb_num {
    font-size: 16px;
}

.pop_cont,
input[type="button"].btn_single_pop,
input[type="button"].btn_dual_cancel,
input[type="button"].btn_dual_confirm,
.simple_addr span,
.simple_addr input,
.chk_lbl,
.link_underline,
.bg_ani div:nth-of-type(2) p,
.txt_name,
.txt_sub,
.btn_overlap,
.usage_history>div,
.usage_history>div select,
.tb_name,
.lst_acc2 li>span:first-child,
.tit_small,
.notice li p,
.notice_cont p,
.setting p,
.btn_pop_close {
    font-size: 18px;
}

.user strong,
.txt_m,
.info02 .blue,
.info02 .red,
.info02 .black {
    font-size: 22px;
}

.total_coral_big {
    font-size: 36px;
}

.total_cdp span:nth-of-type(2),
.total_cdp span:nth-of-type(3),
.two_btn input,
.tp_t,
input[type="button"].btn_next_l,
.tit_tb,
.inp_round,
.tit_tf2,
.tab_btns a {
    font-size: 20px;
}

.line_money span:nth-of-type(1) {
    font-size: 30px;
}

.badge_gray,
.badge_blue,
.badge_red,
.badge_grayline,
.badge_bk_n,
.badge_blue_n,
.badge_red_n,
.badge_gray_n,
.setting li.li_type03 span {
    font-size: 14px;
}

.font_l_bk {
    font-size: 24px;
}

/* cjm 추가 */
.desc_gray li span.deposit_info {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

/* @media screen and (max-width:409px){
} */

/* 갤럭시폴드용 스타일 */
@media screen and (max-width:319px) {
    ul.cont_area_detail li>span:nth-of-type(1)::before {
        display: none;
    }

    /* 홈1지갑없음 메인텍스트 사이즈 */
    .dot_line span:nth-of-type(2) {
        font-size: 19px;
    }

    .info01 {
        /* flex-direction: column;
        align-items: flex-start; */
        justify-content: space-between;
    }

    /* 홈2 지갑있음 하단 리스트에서 간편주소 부분*/
    .t_addr {
        text-align: right;
    }

    .wrapper .left {
        float: left;
        max-width: 35%;
        max-width: 116px;
    }

    .info02 {
        flex-direction: column;
        margin-top: .5rem;
    }

    .info02>span:nth-of-type(2) {
        text-align: right;
    }

    .info02 span.simple_addr2 {
        text-align: right;
    }

    .info01>span:nth-of-type(1) {
        color: var(--deepgray);
        width: 60%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        font-size: 13px;
    }

    .info02 span:nth-of-type(1) {
        /* width: initial */
        text-align: right;
        display: inline-block;
    }

    .info01>span:nth-of-type(2) {
        color: var(--deepgray);
        width: 40%;
        white-space: nowrap;
        text-overflow: ellipsis;
        text-align: right;
    }

    .usage_history ul li {
        padding: 0.4rem .5rem;
    }

    .total_coral_big {
        font-size: 24px;
    }

    .total_cdp span:nth-of-type(2) {
        font-size: 14px;
    }

    .total_cdp span:nth-of-type(3) {
        font-size: 10px;
    }

    .user {
        background: url(../img/icon_symbol.png) left center no-repeat;
        padding-left: 35px;
        height: 27px;
        background-size: 26px;
    }

    .user strong {
        font-size: 16px;
    }

    .user span {
        font-size: 13px;
    }

    .line_money span:nth-of-type(1) {
        font-size: 22px;
    }

    .line_money span:nth-of-type(2) {
        margin-bottom: 0;
    }

    button.btn_close,
    button.btn_qr {
        padding: 1rem .8rem 1rem .8rem;
    }

    div.empty_box_long {
        width: calc(50px + 3.2rem);
    }

    .inp_edit_memo {
        max-width: 152px !important;
    }

    .bank_selc,
    .bank_selctd {
        max-width: 50px;
        min-width: 50px;
        overflow: hidden;
        white-space: nowrap;
    }

    .inp_bank {
        width: calc(100% - 55px);
    }

    .simple_addr input {
        font-size: 16px;
    }

    .total_cdp span:nth-of-type(2),
    .total_cdp span:nth-of-type(3),
    .two_btn input,
    .tp_t,
    input[type="button"].btn_next_l,
    .tit_tb,
    .inp_round,
    .tit_tf2,
    .tab_btns a {
        font-size: 18px;
    }

    /* .box_system_chk p, .lst_ag2, .user span, .request_ing div:nth-of-type(1) .btn_req_cancel, .txt_gray_s, .btn_detail, .txt_caution, .txt_confirm, .txt_reject, .dot_line span:nth-of-type(3), .desc_tf2, .desc_s, .info01>span:nth-of-type(1), .desc_gray, .font_m_bk, .txt_nodata, .inp_edit_memo, .btn_gray_s, .btn_blue_s, .inp_memo_pop, .t_memo, .fake_tbl div, .txt_s, .tb_num, .desc_tf3, .dp_inherit p, .btn_bank, .date_full, .info02 span.simple_addr2, .btn_pop_close{
        font-size: 14px;
    } */
    .empty_box {
        width: 47px;
    }

    .badge_gray,
    .badge_blue,
    .badge_red,
    .badge_grayline,
    .badge_bk_n,
    .badge_blue_n,
    .badge_red_n,
    .badge_gray_n,
    .setting li.li_type03 span {
        font-size: 12px;
    }

    .btn_m_set {
        padding: 4px 1px;
    }

    ul.cont_area_detail li>span:nth-of-type(1)::before {
        display: none;
    }

    .cont_area_detail2 li span:nth-of-type(1) {
        width: 70px;
        border-right: 0;
    }

    .t_acc {
        padding-right: 2.5rem;
    }
}

/* 태블릿, 패드 사이즈 */
@media screen and (min-width:767px) {
    .wrapper {
        background-size: 100%;
    }

}

.balance_area {
    width: 100%;
    /* padding: 1rem; */
    padding-top: 0;
    padding-bottom: 1rem;
    padding-left: 3px;
    font-size: 16px;
}

.balance_area span {
    display: inline-block;
}

.balance_area span:nth-of-type(2) {
    font-weight: 700;
    font-size: 18px;
    margin-left: 1rem;
    margin-right: .2rem;
}

/* 지갑생성 페이지 수정 220719 */
.txt_make_wallet {
    font-size: 18px;
    font-weight: 300;
}

.txt_make_wallet strong {
    color: var(--coral);
    font-size: 24px;
    font-weight: 500;
}

.tit_make_wallet {
    font-size: 18px;
    font-weight: 500;
    margin-top: 30px;
}

.tit_make_wallet2 {
    font-size: 18px;
    font-weight: 500;
    margin-top: 10px;
    display: inline-block;
}

.btn_overlap.inner_ip {
    width: 100px;
}

.ml10 {
    margin-left: 10px;
}

.mt8 {
    margin-top: 8px;
}

.mt4 {
    margin-top: 4px;
}

.mt30 {
    margin-top: 30px;
}

.title {
    font-family: 'Malgun Gothic', san-serif;
    position: fixed;
    background: white;
    width: 100%;
    top: 0;
    padding: 20px 0;
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    color: #333;
    border-bottom: 1px solid #e7e7e7;
}

.sub_tit {
    font-size: 22px;
    margin: 25px 0;
    font-weight: 700;
}

.sub_tit_s {
    font-size: 18px;
    margin-bottom: 10px;
    font-weight: 700;
}

.txt {
    font-size: 15px;
    line-height: 24px;
    /* text-indent: 10px; */
    margin-bottom: 20px;
}

/* add cmj 220825 */
.btn_manual {
    display: inline-block;
    height: 30px;
    line-height: 28px;
    text-align: center;
    background: #f8f8f8 url(../img/icon_paper_down.png) 5px center no-repeat;
    background-size: 15px;
    padding: 0px 7px 0px 23px;
    border-radius: 2px;
    border: 1px solid #e7e7e7;
    transition-duration: .1s;
}

.btn_manual:hover {
    /* transition-duration: .1s; */
    border: 1px solid #ccc;
    /* background-color: #f0f0f0; */
}

/*221201 API 결제 화면 추가 */
.area_app {
    justify-content: center;
    align-items: center;
    display: flex;
    height: 100%;
}

.area_app div {
    text-align: center;
}

.area_app div p {
    font-weight: 700;
}

.jc_center {
    justify-content: center;
    align-items: center;
    height: 66px;
    margin-top: 5px;
}

.btn_down_g {
    border: 0;
    margin-top: 20px;
}

.mb10 {
    margin-bottom: 10px;
}

.area_app div p.txt_qr {
    margin-top: 20px;
    word-break: keep-all;
    font-weight: 500;
    font-size: 1.2rem;
}

.box_bt_api2 {
    margin: 1rem 0;
    padding: 0 1rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.amount_api {
    text-align: center;
    padding: 9vh 0 8vh;
    position: relative;
}

.aa_coin {
    position: absolute;
    right: 0;
    width: 97px;
    z-index: 0;
}

.aa_num {
    font-size: 55px;
    font-weight: 700;
    font-family: 'Times New Roman';
    color: var(--deepcoral);
    position: inherit;
    z-index: 20;
}

.won_gray_s {
    color: var(--deepgray);
    word-break: keep-all;
    text-align: right;
    z-index: 20;
    position: inherit;
}

.cont_area_detail li>span:nth-of-type(1).th_api {
    display: block;
    width: 100%;
    border-right: 1px solid var(--whitegray);
    white-space: nowrap;
    position: relative;
}

ul.cont_area_detail li.bd_none {
    border-bottom: 0;
    padding-bottom: 0;
}

.cont_area_detail li>span:nth-of-type(1).th_api::before {
    display: none;
}

.ta_api {
    display: block;
    width: 100%;
    border: 1px solid var(--lightgray);
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 3px;
    font-size: 15px;
    height: 60px;
}

.txt_s_max {
    font-size: .9rem;
    text-align: right;
    color: var(--deepgray);
    /* padding-right: .5rem;
    padding-bottom: .5rem; */
}

ul.cont_area_detail li.pb_none {
    padding: 0;
    text-align: right;
    display: block;
}

.caution_msg {
    display: inline-block;
    margin-left: 3px;
    font-size: 0.9rem;
    color: var(--darkgray);
}

.caution_msg2 {
    display: inline-block;
    margin-left: 3px;
    padding-left: 18px;
    background: url(../img/icon_caution.png) left 3px no-repeat;
    background-size: 15px;
    font-size: 1rem;
    line-height: 1.3;
    color: var(--deepcoral);
    text-align: left;
}

.api_success img {
    width: 60px;
}

/* 221208 add cmj */
.bg_white .top.hd_api_fix {
    position: fixed;
    top: 0;
    margin-top: 0;
    padding-top: 5px;
    background: white;
    z-index: 100;
    max-width: 600px;
}

.box_bt_api {
    margin: 0rem 0;
    padding: 1rem;
    width: 100%;
    text-align: center;
    position: fixed;
    bottom: 0;
    background: white;
    z-index: 9999;
}

.bg_white .mid_api {
    padding: 2.5rem 1rem 10rem;
}

/* 221228 */
.phone_lt {
    width: 200px;
    height: 130px;
    margin: 0 auto;
}

.circle01_lt {
    width: 100px;
    height: 100px;
    position: absolute;
    right: 0;
    bottom: 75%;
    z-index: 10;
}

.circle02_lt {
    width: 250px;
    height: 250px;
    position: absolute;
    left: -9%;
    bottom: -8%;
}

.bg_ani div:nth-of-type(2) p {
    margin-top: 0;
}

.bg_ani div:nth-of-type(2) {
    padding-top: 4rem;
}

/* 간편전송 230206 add cmj */

/* simple_send add cmj 230313 */
.simple_send {
    font-family: 'NanumSquare', san-serif;
    transform: skew(-0.1deg);
    line-height: 1.2;
}

.simple_send h2,
.simple_send .sms_success p {
    font-weight: 900;
}

.simple_send .intro_sms h2,
.simple_send .tit_sms h2 {
    margin-top: 10px;
}

.simple_send input[type="text"],
.simple_send input[type="number"],
.simple_send input[type="button"],
.simple_send input[type="button"].btn_coral {
    font-family: 'NanumSquare', san-serif;
    font-weight: 700;
}

.simple_send .tit_send {
    font-weight: 700;
}

.simple_send .tit_tf2 {
    font-weight: 700;
}

.simple_send .coral_l,
.simple_send .gray_l {
    font-weight: 900;
}

.simple_send .txt_sub2 {
    font-weight: 700;
}

.simple_send .box_act {
    font-weight: 700;
}

.simple_send .tit_lbl,
.simple_send .txt_cont_c p {
    font-weight: 700;
}

.simple_send .txt_sub_left {
    font-weight: 700;
}

.intro_sms {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.img_app {
    width: 60px;
    margin-bottom: 10px;
}

.txt_sub2 {
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    margin-top: 30px;
    line-height: 1.4;
}

.txt_sub3 {
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
    line-height: 1.4;
}

input[type=button].btn_coral {
    width: 100%;
    height: 100%;
    max-height: 60px;
    /* min-height: 40px; */
    min-height: 60px;
    color: white;
    background: var(--coral);
    border-radius: 10px;
    border: 0;
    font-size: 18px;
    font-weight: 500;
}

.tf_underline_num {
    width: calc(100% - 80px);
    border: 0;
    /* border-bottom: 1px solid var(--lightgray); */
    font-size: 20px;
    padding: 5px 0;
    font-weight: 700;
    margin-bottom: 3px;
}

.phone_inp_wr {
    border-bottom: 1px solid var(--lightgray);
}

.tf_010 {
    width: 70px;
    border: 0;
    font-size: 20px;
    padding: 5px 0;
    font-weight: 700;
    margin-bottom: 3px;
    text-align: center;
    letter-spacing: -0.8px;
}

.tit_sms {
    width: 100%;
    /* height: 80px; */
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.tit_sms2 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding-top: 20px;
}

.inp_bday input {
    font-size: 18px;
}

.txt_sub3+div input {
    font-size: 18px;
}

.coral_l {
    font-size: 22px;
    color: var(--coral) !important;
    font-weight: 700;
}

input[type="button"].btn_gray_half {
    width: 48%;
    height: 100%;
    max-height: 60px;
    /* min-height: 40px; */
    min-height: 60px;
    color: var(--darkgray);
    background: transparent;
    border-radius: 10px;
    border: 1px solid var(--deepgray);
    font-size: 18px;
    font-weight: 500;
}

input[type="button"].btn_coral_half {
    width: 48%;
    height: 100%;
    max-height: 60px;
    /* min-height: 40px; */
    min-height: 60px;
    color: white;
    background: var(--coral);
    border: 0;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
}

input[type="button"].btn_yellow_half {
    width: 48%;
    height: 100%;
    max-height: 60px;
    /* min-height: 40px; */
    min-height: 60px;
    color: black;
    background: var(--yellow);
    border: 0;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
}

.pop_cont_sms {
    width: 100%;
    padding: 2rem;
    text-align: center;
    font-size: 18px;
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

input[type="button"].btn_single_coral {
    width: 100%;
    height: 50px;
    color: white;
    background: var(--coral);
    border-radius: 5px;
    border: 0;
    font-size: 18px;
    font-weight: 500;
    border-radius: 0 0 10px 10px;
}

.txt_selc_nation {
    display: inline-block;
    width: 93px;
    font-size: 16px;
    border: 1px solid var(--lightgray);
    background: white url(../img/arrow_down.png) calc(100% - 10px) center no-repeat;
    background-size: 14px;
    color: var(--navybk);
    /* padding: 8px 0px; */
    border-radius: 10px;
    text-align: center;
    text-indent: -17px;
    margin: 0 0px 5px 5px;
    height: 41px;
    line-height: 41px;
}

.txt_selc_nation.on {
    color: white;
    border: 0;
    background: var(--coral) url(../img/arrow_down_white.png) calc(100% - 10px) center no-repeat;
    background-size: 14px;
}

.txt_selc_gen {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 70px;
    font-size: 16px;
    border: 1px solid var(--lightgray);
    background: white;
    color: var(--navybk);
    border-radius: 10px;
    text-align: center;
    height: 41px;
    margin-bottom: 5px;
}

.rdo_gen {
    display: none;
}

.txt_selc_gen:nth-of-type(1) {
    margin-right: 5px;
}


input[type="radio"].rdo_gen:checked+label {
    color: white;
    border: 0;
    background: var(--coral);

}

.txt_selc_tel {
    display: inline-block;
    width: 24%;
    font-size: 16px;
    border: 1px solid var(--lightgray);
    background: white;
    color: var(--navybk);
    /* padding: 8px 0px; */
    border-radius: 10px;
    text-align: center;
    margin: 0 0px 0px 5px;
    height: 41px;
    line-height: 41px;
}

.txt_selc_tel.on {
    color: white;
    border: 0;
    background: var(--coral);
}

.between .txt_selc_tel:first-child {
    margin-left: 0;
}

.txt_selc_ta {
    display: inline-block;
    /* width: 93px; */
    width: 24%;
    font-size: 16px;
    border: 1px solid var(--lightgray);
    background: white url(../img/arrow_down.png) calc(100% - 10px) center no-repeat;
    background-size: 14px;
    color: var(--navybk);
    /* padding: 8px 0px; */
    padding-right: 22px;
    border-radius: 10px;
    text-align: center;
    /* text-indent: -17px; */
    margin: 0 0px 0px 5px;
    height: 41px;
    line-height: 41px;
}

.txt_selc_ta.on {
    color: white;
    border: 0;
    background: var(--coral) url(../img/arrow_down_white.png) calc(100% - 10px) center no-repeat;
    background-size: 14px;
}

.tsta {
    display: inline-block;
    width: calc(100% - 8px);
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
}

@media screen and (max-width:319px) {
    .txt_selc_gen {
        width: 60px;
    }

    .tsta {
        width: 58px;
    }

    .txt_selc_tel {
        width: 23%;
    }

    .txt_selc_ta {
        width: calc(100% - 69%);
    }

    .txt_selc_ta,
    .txt_selc_ta.on {
        background-position-x: calc(100% - 3px);
    }
}

.form_inner_box2 {
    margin: 30px 0;
}

.tf_underline_d {
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--lightgray);
    font-size: 18px;
    padding: 5px 0;
    font-weight: 700;
    margin-bottom: 3px;
    letter-spacing: -0.8px;
    /* height: 47px; */
    line-height: 44px;
}

/* .arr_tsta{
    display: inline-block;
} */
.input_chk input+label.font_ml:before {
    background-size: 25px;
    width: 25px;
    height: 25px;
    margin-top: -13px;
}

.font_ml {
    padding-left: 30px;
}

.selc_opt {
    flex-shrink: 0;
    width: 100%;
    background: white;
    border-radius: 20px 20px 0 0;
    padding: 10px;
    left: 0;
    box-shadow: 0 10px 10px 10px rgb(0 0 0 / 15%);
    position: fixed;
    bottom: 0;
    z-index: 9999;
    /* border-radius: 0px 0px 11px 11px; */
    /* padding: 10px 5px; */
    overflow-y: scroll;
}

.s_f_opt {
    width: 100%;
    font-size: 16px;
    color: var(--navybk);
    overflow-y: scroll;
}

.s_f_opt li {
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: var(--whitegray);
    padding: 13px 10px;
    text-align: center;
}

.s_f_opt2 {
    width: 100%;
    font-size: 16px;
    color: var(--navybk);
    max-height: 250px;
    overflow-y: scroll;
}

.s_f_opt2 li {
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: var(--whitegray);
    padding: 13px 10px;
    text-align: center;
}

.selc_tit {
    width: 100%;
    text-align: center;
    position: relative;
    height: 52px;
    line-height: 50px;
    border-bottom: 1px solid var(--lightgray);
    font-size: 18px;
}

.btn_close_s {
    position: absolute;
    right: 0;
    width: 50px;
    height: 50px;
    background: url(../img/icon_close_bk.png) center no-repeat;
    background-size: 18px;
    border: 0;
    text-indent: -9999px;
}

.tf_underline_t {
    width: calc(100% - 105px);
    margin-right: 10px;
    border: 0;
    font-size: 18px;
    /* padding: 5px 0; */
    font-weight: 700;
    /* margin-bottom: 3px; */
    letter-spacing: -0.8px;
    text-align: left;
    line-height: 46px;
}

.half_chk .input_chk {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* width: 49%; */
    min-width: 160px;
    padding: 0;
    padding-top: 12px;
}

.half_chk .input_chk label {
    display: inline-block;
    font-size: 16px;
    white-space: nowrap;
    line-height: 25px;
}

.view_terms {
    text-decoration: underline;
    font-weight: 700;
}

.mt10 {
    margin-top: 10px;
}

.font_ml {
    font-size: 20px;
    font-weight: 700;
}

.all {
    padding: 10px 0;
}

.txt_cert_num {
    display: inline-block;
    width: 70px;
    line-height: 45px;
    margin-left: 5px;
    margin-right: 5px;
    font-size: 18px;
    border: 0;
    font-weight: 500;
    color: var(--coral);
    text-align: right;
}

.tf_underline_c {
    width: calc(100% - 90px);
    /* margin-left: 10px; */
    border: 0;
    font-size: 18px;
    /* padding: 5px 0; */
    line-height: 44px;
    font-weight: 700;
    margin-bottom: 3px;
    letter-spacing: -0.8px;
}

.txt_sub_bot {
    font-size: 16px;
    font-weight: 500;
    margin-top: 30px;
    margin-bottom: 30px;
    line-height: 1.4;
}

.num_lst span {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    line-height: 20px;
    background: var(--coral);
    color: white;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}

.num_lst li {
    margin: 15px 0;
}

.img_cnt {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 400px;
}

.txt_selc_bank {
    display: inline-block;
    width: 100%;
    line-height: 45px;
    /* margin-left: 5px;
    margin-right: 5px; */
    font-size: 18px;
    border: 0;
    background: transparent url(../img/arrow_down.png) right center no-repeat;
    background-size: 14px;
    /* font-weight: 500; */
    color: var(--deepgray);
    border-bottom: 1px solid var(--lightgray);
    padding: 5px 0;
}

.txt_selc_bank.on {
    color: var(--navybk);
}

.inp_one {
    width: 55px;
    height: 55px;
    text-align: center;
    border: 1px solid var(--lightgray);
    margin-right: 10px;
    font-size: 24px;
}

.inp_one:last-child {
    margin-right: 0;
}

.one_wr {
    margin: 20px 10px;
    text-align: center;
}

.inp_one:focus {
    border-color: var(--coral);
    color: var(--coral);
    font-weight: 700;
}

div.txt_cont_c {
    border-top: 1px solid var(--mediumgray);
    background: var(--whitegray);
    padding: 10px;
    border-radius: 0 0 10px 10px
}

.txt_cont_c p {
    margin: 10px 0;
    line-height: 1.4;
    font-weight: 500;
}

.txt_cont_c p .coral {
    margin-right: 3px;
}

input.btn_gray_third {
    width: 32%;
    height: 100%;
    max-height: 60px;
    color: var(--darkgray);
    border: 1px solid var(--darkgray);
    background: white;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
}

input.btn_coral_third {
    width: 32%;
    height: 100%;
    max-height: 60px;
    background: var(--coral);
    border-radius: 10px;
    border: 0;
    font-size: 18px;
    font-weight: 500;
    color: white;
}

input.btn_coralline_third {
    width: 32%;
    height: 100%;
    max-height: 60px;
    color: var(--coral);
    background: white;
    border-radius: 10px;
    border: 1px solid var(--coral);
    font-size: 18px;
    font-weight: 500;
}

input.btn_coralline_half {
    width: 49%;
    height: 100%;
    max-height: 60px;
    color: var(--coral);
    background: white;
    border-radius: 10px;
    border: 1px solid var(--coral);
    font-size: 18px;
    font-weight: 500;
}

.btn_refresh_c {
    width: 55px;
    background-size: 31px;
    border: 0;
    background: none;
}

.btn_refresh_c img {
    width: 100%;
    max-width: 40px;
}

.btn_refresh_c img {
    width: 100%;
    max-width: 40px;
}

.tit_sms_btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-top: 20px;
}

.sms_success {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-top: 15px;
}

.sms_success p {
    font-size: 24px;
    font-weight: 700;
    margin-top: 15px;
}

.txt_sub_left {
    font-size: 18px;
    font-weight: 500;
    margin-top: 30px;
    line-height: 1.4;
    text-align: center;
}

.gray_l {
    font-size: 22px;
    color: var(--deepgray) !important;
    font-weight: 700;
}

.black_l {
    font-size: 22px;
    color: var(--navybk) !important;
    font-weight: 700;
}


.pay_history {
    border-top: 1px solid var(--darkgray);
    border-bottom: 1px solid var(--lightgray);
}

.pay_history li {
    padding: 5px 0;
    border-bottom: 1px solid var(--lightgray);
}

.pay_history li:last-child {
    border-bottom: 0;
}

.red2 {
    color: var(--red);
    font-weight: 700;
    font-size: 18px;
}

.gray2 {
    color: var(--mediumgray);
    font-weight: 700;
    font-size: 18px;
}

.num_box {
    display: inline-block;
    width: 20px;
    height: 20px;
    text-align: center;
    color: var(--navybk);
}

.info02>span.w110:nth-of-type(1) {
    width: 110px;
}

.pl20 {
    padding-left: 20px;
}

.box_page {
    /* width: 50%; */
    max-width: 300px;
    display: flex;
    margin: 0 auto;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.box_page button img {
    width: 8px;
}

.num_page {
    padding: 5px;
    color: #666;
}

.box_page button {
    padding: 5px 10px;
    border: 0;
    background: none;
    display: flex;
    align-items: center;
}

.this_page {
    color: #000;
    font-weight: 700;
    font-size: 18px;
}

.error_wr {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tel_link {
    font-size: 28px;
    color: var(--coral);
    font-weight: 900;
    margin-top: 20px;
}

/* 230213 add cmj */
.tf_underline_half {
    width: 47%;
    border: 0;
    border-bottom: 1px solid var(--lightgray);
    font-size: 24px;
    padding: 5px 0;
    font-weight: 700;
    margin-bottom: 3px;
    letter-spacing: -0.8px;
    line-height: 45px;
}

.dash {
    display: inline-block;
    width: 30px;
    text-align: center;
    font-size: 32px;
}

.tf_underline_one {
    width: 30px;
    border: 0;
    border-bottom: 1px solid var(--lightgray);
    font-size: 24px;
    padding: 5px 0;
    font-weight: 700;
    margin-bottom: 3px;
    line-height: 45px;
    letter-spacing: -0.8px;
}

.tf_underline_hide {
    width: calc(50% - 60px);
    border: 0;
    font-size: 24px;
    padding: 5px 0;
    font-weight: 900;
    margin-bottom: 3px;
    letter-spacing: 3px;
    margin-left: 15px;
}

.inp_bday {
    display: flex;
    width: 100%;
    align-items: center;
}

input[type="text"].rdonly,
.rdonly {
    color: var(--deepgray);
}

.tit_sms_back {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 10px;
    background: white;
}

.btn_back_sms {
    border: 0;
    padding: 24px 20px 6px;
    background: none;
}

.btn_back_sms img {
    width: 18px;
}

.tit_sms_back h2 {
    margin-top: 7px;
}

.tf_underline.rdonly:focus {
    border-color: var(--lightgray);
}

input[type="button"].btn_send_cancel {
    font-size: 14px;
    color: var(--deepgray);
    color: #7d8085;
    border: 1px solid var(--palegray);
    background: none;
    border-radius: 20px;
    padding: 3px 6px;
}

.tit_send {
    margin-top: 30px;
    font-size: 18px;
    margin-bottom: 7px;
    display: flex;
    justify-content: space-between;
}

input[type="button"].btn_limit {
    font-size: 14px;
    color: var(--deepcoral);
    border: 0;
    background: #ffeeea;
    border-radius: 20px;
    padding: 3px 6px;
}

.box_bday {
    width: 100%;
    margin: 30px 0;
}

/* 디바이스 width 320이하 (fold) */
@media screen and (max-width:320px) {
    .tf_underline_half {
        width: 39%;
    }

    .tf_underline_hide {
        width: calc(59% - 60px);
        letter-spacing: 0px;
        margin-left: 0px;
    }

    .btn_back_sms {
        padding: 24px 15px 6px;
    }

    .top h2 {
        font-size: 19px;
    }

}

/* 자동완성 배경색 흰색 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-transition: background-color 9999s ease-out;
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}

/* 230224 간편전송내역탭추가 */
.usage_history>div select {
    font-size: 14px;
    border: 0;
    background: transparent url(../img/arrow_down.png) calc(100% - 5px) center no-repeat;
    background-size: 9px;
    /* font-weight: 500; */
    color: var(--darkgray);
    padding: 1px 12px 1px 0px;
    width: 59px;
    border: 1px solid var(--mediumgray);
    border-radius: 16px;
    text-align: center;
    margin-left: 5px;
}

.usage_history>div {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    padding: 1rem 0;
}

.usage_history>div span {
    display: inline-block;
    width: 50%;
    text-align: center;
}

.usage_history>div span a {
    font-size: 18px;
    color: var(--darkgray);
}

.usage_history>div span a.on {
    color: var(--navybk);
    font-weight: 500;
    border-bottom: 1px solid var(--navybk);
}

/* .usage_history>div span.on1{
    background: var(--lightgray);
    color: var(--navybk);
    font-weight: 500;
    width: 50%;
}
.usage_history>div span.off{
    width: 50%;
}
.usage_history>div span select{
    display: none;
}
.usage_history>div span.on select{
    display: block;
}
@media screen and (max-width:319px) {
    .usage_history>div span select{
        display: none;
    }
    .usage_history>div span.on select{
        display: block;
    }
    .usage_history>div span{
        width: 100px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        letter-spacing: -1px;
    }
    .usage_history>div span.on{
        letter-spacing: -1px;
        width: calc(100% - 100px);
    }
} */
input[type="button"].btn_float {
    position: fixed;
    /* bottom: calc(1rem + 55px); */
    bottom: 1rem;
    left: 1rem;
    display: inline-block;
    width: 50px;
    height: 50px;
    font-size: 15px;
    background: rgba(254, 141, 107, 0.938);
    background: rgb(255 120 101 / 89%);
    border-radius: 50%;
    box-shadow: 3px 10px 15px 7px rgba(0, 0, 0, 0.1);
    border: 0;
    /* color: var(--navybk); */
    color: white;
}

.txt_call {
    line-height: 1rem;
}

.lh12 {
    line-height: 1.2;
}

.detail .bot.flex0 {
    flex: 0;
}

.txt_cont p .coral {
    margin-right: 3px;
}

.txt_cont span.inline {
    display: inline;
}

.img_plus {
    display: block;
    width: 60px;
    height: 60px;
    margin: 20px auto;
}

.img_plus img {
    width: 60px;
}

.btn_plus {
    float: right;
    display: inline-block;
    width: 35px;
    height: 35px;
    text-indent: -9999px;
    background: url(../img/btn_plus.png) center no-repeat;
    background-size: 20px;
    border: 0;
    margin-right: 5px;
    padding: 5px;
}

.cert_account {
    width: 100%;
    background: white;
    /* padding: 5px 1rem; */
    height: auto;
    overflow-y: scroll;
    background: white;
    border-radius: 10px;
    border: 1px solid #eee;
}

.cert_account li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    padding: 5px 1rem;
    min-height: 64px;
    max-height: 64px;
    border-bottom: 1px solid var(--whitegray);
    overflow: hidden;
    overflow-x: hidden;
}

.cert_account li>span:first-child {
    display: flex;
    align-items: center;
    overflow: auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: calc(100% - 57px);
    font-size: 18px;
}

.cert_account li>span:first-child img {
    margin-right: 7px;
    width: 22px;
}

.box_act {
    margin-top: 50px;
    font-size: 20px;
    line-height: 1.6;
    text-align: center;
    font-weight: 500;
}

.act_img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 115px;
    height: 115px;
    /* border: 3px solid var(--coral); */
    /* border-radius: 50%; */
    margin: 30px auto;
}

.act_img img {
    /* width: 50px; */
    width: 100%;
}

.txt_cont_act {
    /* border-top: 1px solid var(--bluegray); */
    background: var(--whitegray);
    padding: 1rem;
    /* border-radius: 10px; */
    line-height: 1.6;
}

/* 금융사고예방확인 230228 */
.accident_chk li {
    margin-top: 20px;
}

.txt_accident {
    /* color: var(--darkgray); */
    margin-top: 30px;
    font-size: 17px;
    font-weight: 500;
    /* cursor: none; */
}

.box_question {
    display: flex;
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 10px;
    border: 1px solid #eee;
}

.txt_selc_yn {
    display: inline-block;
    width: 50%;
    font-size: 17px;
    background: white;
    color: var(--navybk);
    text-align: center;
    height: 55px;
    line-height: 55px;
}

.box_question .txt_selc_yn:nth-of-type(1) {
    border-right: 1px solid var(--palegray);
}

input[type="radio"].rdo_yn:checked+label {
    color: white;
    border: 0;
    background: var(--coral);
}

.item_center {
    align-items: center;
}

.rdo_yn {
    display: none;
}

.btn_refresh_c {
    margin-right: 1rem;
    font-size: 16px;
    width: 65px;
}

.btn_refresh_c::before {
    /* padding: 10px; */
    display: block;
    width: 100%;
    height: 100%;
    background-size: 31px;
    border: 0;
    opacity: .9;
    background: none;
    content: '새로고침';
    /* line-height: 55px; */
    text-decoration: underline;
    color: var(--navybk);
}

.btn_refresh_c img {
    display: none;
}

.txt_copy {
    margin-bottom: 1rem;
    color: var(--darkgray);
    z-index: 10;
}

.empty_box_r {
    width: calc(65px + 1rem);
}

/* 230309 cmj 로딩 spinner */
.area_loading {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(255 255 255 / 50%);
    z-index: 30;
}

.lds-spinner {
    color: official;
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}

.lds-spinner div {
    transform-origin: 40px 40px;
    animation: lds-spinner 1.2s linear infinite;
}

.lds-spinner div:after {
    content: " ";
    display: block;
    position: absolute;
    top: 3px;
    left: 37px;
    width: 6px;
    height: 18px;
    border-radius: 20%;
    background: #fff;
    background: var(--coral);
}

.lds-spinner div:nth-child(1) {
    transform: rotate(0deg);
    animation-delay: -1.1s;
}

.lds-spinner div:nth-child(2) {
    transform: rotate(30deg);
    animation-delay: -1s;
}

.lds-spinner div:nth-child(3) {
    transform: rotate(60deg);
    animation-delay: -0.9s;
}

.lds-spinner div:nth-child(4) {
    transform: rotate(90deg);
    animation-delay: -0.8s;
}

.lds-spinner div:nth-child(5) {
    transform: rotate(120deg);
    animation-delay: -0.7s;
}

.lds-spinner div:nth-child(6) {
    transform: rotate(150deg);
    animation-delay: -0.6s;
}

.lds-spinner div:nth-child(7) {
    transform: rotate(180deg);
    animation-delay: -0.5s;
}

.lds-spinner div:nth-child(8) {
    transform: rotate(210deg);
    animation-delay: -0.4s;
}

.lds-spinner div:nth-child(9) {
    transform: rotate(240deg);
    animation-delay: -0.3s;
}

.lds-spinner div:nth-child(10) {
    transform: rotate(270deg);
    animation-delay: -0.2s;
}

.lds-spinner div:nth-child(11) {
    transform: rotate(300deg);
    animation-delay: -0.1s;
}

.lds-spinner div:nth-child(12) {
    transform: rotate(330deg);
    animation-delay: 0s;
}

@keyframes lds-spinner {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

/* 230310 간편전송 랜딩페이지 배너추가 */
.bnr_top {
    width: calc(100% - 2rem);
    margin: 1rem;
    text-align: center;
}

.bnr_top img {
    width: 100%;
    max-width: 500px;
}

.top_logo {
    width: 100%;
    text-align: left;
}

.top_logo header {
    display: flex;
    justify-content: space-between;
    width: 100%;
    z-index: 3;
    background-color: var(--surface-100);
    padding: 15px 1rem 0;
}

.top_logo header img {
    width: 100px;
    height: 20px;
}

.simple_send ul.cont_area_detail.c_d_2 li>span:nth-of-type(2) {
    width: calc(100% - 110px);
}

ul.cont_area_detail.c_d_2 li>span:nth-of-type(1) {
    color: var(--deepgray);
    /* width: 42%; */
}

.cont_area_detail li span.cell_account {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/* .cont_area_detail li span.cell_account span{
    width: 100%;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
} */
.tbl_account {
    border-radius: 10px;
    /* background: white; */
    background: var(--whitegray);
    border: 1px solid var(--palegray);
    border-radius: 10px;
    box-shadow: none;
    padding: .5rem 1rem;
}

.tbl_account li span {
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ico_bank_send {
    display: flex;
    align-items: center;
    /* justify-content: center; */
    /* height: 30px; */
}

.ico_bank_send img {
    display: inline-block;
    margin-right: 5px;
    width: 20px;
}

.ico_bank_send span {
    line-height: 20px;
}

.tbl_account li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 33px;
    line-height: 33px;
}

.acc_name_num {
    display: flex;
    align-items: center;
}

.t_acc_simple {
    position: relative;
    text-align: left;
    padding: 1rem;
    padding-right: 1rem;
    width: 100%;
    background: var(--whitegray);
    border: 1px solid var(--palegray);
    color: var(--deepcoral);
    margin-top: 5px;
    font-weight: 600;
    border-radius: 5px;
}

.ann_txt {
    display: inline-block;
    margin-left: 5px;
}

.simple_send ul.cont_area_detail.c_d_2 li>span:nth-of-type(2).cell_acc {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 33px;
}

.simple_send ul.cont_area_detail.c_d_2 li .cell_acc {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 33px;
}

.cont_area_detail li span.cell_acc span.ico_bank_send {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
}

/* 230410 */
.btn_dual_confirm {
    background: var(--blue);
    border-radius: 0 0 10px 0;
}

input[type="button"].btn_single_coral {
    background: var(--blue);
}

input[type="button"].btn_single_pop {
    background: var(--blue);

}

.pt0 {
    padding-top: 0;
}

.btn_way {
    width: 100%;
    margin-top: 2rem;
}

input[type="button"].btn_virtual,
input[type="button"].btn_transfer,
/* input[type="button"].btn_creditcard, */
button.btn_creditcard {
    display: inline-block;
    width: 100%;
    padding: 22px 25px;
    border: 1px solid var(--palegray);
    background: url(../img/icon_ch01.png) 20px center no-repeat;
    background-size: 25px;
    background-color: #fafafa;
    border-radius: 10px;
    font-size: 16px;
    text-align: left;
    text-indent: 40px;
    color: black;
}

input[type="button"].btn_transfer {
    background: url(../img/icon_ch02.png) 20px center no-repeat;
    background-size: 25px;
    background-color: #fafafa;
    margin-top: 10px;
}

button.btn_creditcard {
    background: url(../img/icon_ch03.png) 20px center no-repeat;
    background-size: 25px;
    background-color: #fafafa;
    margin-top: 10px;
    color: black;
}

input[type="button"].btn_virtual:hover,
input[type="button"].btn_transfer:hover,
button.btn_creditcard:hover {
    background-color: #fff8f5;
    border-color: #fe9f8a;
}

.btn_way input[type="button"].on,
.btn_way button.on {
    background-color: #fff8f5;
    border-color: #fe9f8a;
}

.txt_about_way {
    border: 1px dotted var(--lightgray);
    padding: 20px;
    font-size: 14px;
    margin-top: 40px;
    color: #555;
    border-radius: 10px;
    line-height: 20px;
}

.card_fee {
    display: block;
    font-size: 14px;
    color: var(--deepgray);
    margin-top: 1px;
}

.txt_about_way .large {
    font-size: 18px;
    font-weight: 600;
    display: inline-block;
    margin-bottom: 7px;
}

.btn_line_area {
    display: flex;
}

/* 230516 충전신청 탭버튼 3개일경우 */
input[type="button"].btn_la01,
input[type="button"].btn_la02,
input[type="button"].btn_la03 {
    display: inline-block;
    width: 33.3333%;
    height: 40px;
    border: 1px solid var(--lightgray);
    background: #f4f5f9;
    font-size: 16px;
    color: #666;
}

input[type="button"].btn_la01 {
    border-radius: 10px 0 0 10px;
    border-right: none;
}

input[type="button"].btn_la02 {
    border-radius: 0px;
    border-right: none;
}

input[type="button"].btn_la03 {
    border-radius: 0px 10px 10px 0px;
}

input[type="button"].btn_la01.on {
    border-color: var(--coral);
    background-color: #fff8f5;
    border-right: 1px solid var(--coral);
    color: var(--coral);
    font-weight: 500;
}

input[type="button"].btn_la01.on+input[type="button"] {
    border-left: none;
}

input[type="button"].btn_la02.on+input[type="button"] {
    border-left: none;
}

input[type="button"].btn_la02.on {
    border-color: var(--coral);
    background-color: #fff8f5;
    color: var(--coral);
    font-weight: 500;
    border-right: 1px solid var(--coral);
}

input[type="button"].btn_la03.on {
    border-color: var(--coral);
    background-color: #fff8f5;
    color: var(--coral);
    font-weight: 500;
}

/* 230516 충전신청 탭버튼 2개일경우 */
input[type="button"].btn_tab_double01,
input[type="button"].btn_tab_double02 {
    display: inline-block;
    width: 50%;
    height: 40px;
    border: 1px solid var(--lightgray);
    background: #f4f5f9;
    font-size: 16px;
    color: #666;
}

input[type="button"].btn_tab_double01 {
    border-radius: 10px 0 0 10px;
    border-right: none;
}

input[type="button"].btn_tab_double02 {
    border-radius: 0px 10px 10px 0px;
}

input[type="button"].btn_tab_double01.on {
    border-color: var(--coral);
    background-color: #fff8f5;
    border-right: 1px solid var(--coral);
    color: var(--coral);
    font-weight: 500;
}

input[type="button"].btn_tab_double01.on+input[type="button"] {
    border-left: none;
}

input[type="button"].btn_tab_double02.on {
    border-color: var(--coral);
    background-color: #fff8f5;
    color: var(--coral);
    font-weight: 500;
}


.ta_r {
    text-align: right;
}

.lst_acc_edit {
    width: 100%;
    padding: 0 15px;
    height: auto;
    overflow-y: scroll;
    background: white;
    border-radius: 10px;
    border: 1px solid #eee;
}

.lst_acc_edit li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    padding: 2px 2px;
    min-height: 64px;
    max-height: 64px;
    border-bottom: 1px solid var(--whitegray);
    overflow: hidden;
    overflow-x: hidden;
}

.lst_acc_edit li>span:first-child {
    display: flex;
    align-items: center;
    overflow: auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: calc(100% - 52px);
}

.lst_acc_edit li>span:first-child img {
    margin-right: 7px;
    width: 22px;
}

.input_form.agree_certi .chk_lbl {
    font-size: 16px;
    letter-spacing: -1px;
    display: inline-block;
    width: calc(100% - 30px);
}

.input_form.agree_certi .chk_lbl.large {
    font-size: 20px;
}

.info_withdraw_account,
.info_deposit_account {
    width: 100%;
    padding: 0 15px;
    height: auto;
    overflow-y: auto;
    border: 1px solid var(--palegray);
    border-radius: 5px;
    background-color: #fafafa;
}

.info_withdraw_account .info_box,
.info_deposit_account .info_box {
    display: flex;
    align-items: center;
    font-size: 16px;
    padding: 2px 2px;
    min-height: 64px;
    max-height: 64px;
    border-bottom: 1px solid var(--whitegray);
    overflow: hidden;
    overflow-x: hidden;
}

.info_box img {
    margin-right: 7px;
    width: 22px;
}

.badge_bk_s {
    float: right;
    display: inline-block;
    padding: 2px 5px;
    color: white;
    background: var(--navybk);
    border-radius: 15px;
    font-size: 13px;
}

.badge_coral_s {
    float: right;
    display: inline-block;
    padding: 2px 5px;
    color: white;
    background: var(--deepcoral);
    border-radius: 15px;
    font-size: 13px;
}

.info_deposit_account {
    position: relative;
    background-color: #fff8f5;
    border-color: #ffd5cb;
}

.mt30 {
    margin-top: 30px;
}

input[type="button"].btn_coral_half_gra {
    width: 48%;
    height: 100%;
    max-height: 60px;
    /* min-height: 40px; */
    min-height: 60px;
    color: white;
    /* background: var(--coral); */
    background: linear-gradient(145deg, var(--coral) 0%, var(--orange) 100%);
    border: 0;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
}

.simple_send h2 {
    font-size: 26px;
}

/* 약관 내 테이블 230413 */
.mid.no_padding.terms table,
.mid.no_padding.terms table tr,
.mid.no_padding.terms table th,
.mid.no_padding.terms table td {
    border: 1px solid lightgray;
}

.mid.no_padding.terms table th {
    background: #eee;
}

.mid.no_padding.terms table {
    margin: 3vw 4vw;
}

/* 복사버튼 추가 230425 */
.btn_copy_info {
    width: 22px;
    height: 22px;
    background: transparent url(../img/icon_copy.png) 100% center no-repeat;
    border: 0;
    background-size: 100%;
    position: absolute;
    right: 1rem;
    top: 21px;
}

input[type="button"].btn_change_acc {
    font-size: 14px;
    color: var(--darkgray);
    border: 1px solid var(--mediumgray);
    background: #ffeeea;
    background: none;
    border-radius: 20px;
    padding: 2px 6px;
    float: right;
}

.tab_bot {
    width: 100%;
    height: 65px;
    position: fixed;
    bottom: 0;
    background: white;
    box-shadow: 0 0 15px 7px rgba(0, 0, 0, 0.08);
}

.tab_box {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tab_box input[type="button"] {
    width: 50%;
    height: 55px;
    line-height: 55px;
    border: 0;
    font-size: 18px;
    background-color: white;
}

input[type="button"].tab_btn01 {
    background: url(../img/tab01_off.png) calc(50% - 20px) center no-repeat;
    background-size: 15px;
    text-indent: 20px;
    color: #888;
}

input[type="button"].tab_btn01.on {
    background-image: url(../img/tab01_on.png);
    font-weight: 700;
    color: var(--coral);
}

input[type="button"].tab_btn02 {
    background: url(../img/tab02_off.png) calc(50% - 25px) center no-repeat;
    background-size: 15px;
    text-indent: 23px;
    color: #888;
}

input[type="button"].tab_btn02.on {
    background-image: url(../img/tab02_on.png);
    background-size: 15px;
    text-indent: 23px;
    color: var(--coral);
    font-weight: 700;
}

.usage_history {
    margin-bottom: 55px;
    /* transform: rotate(0); */
}

.usage_history>div span.width100 {
    width: 100%;
}

.bluegray_box {
    width: 100%;
    background: var(--bluegray);
    border-radius: 10px;
    margin-top: 10px;
    padding: 1rem;
}

.signiture {
    width: 100%;
    min-height: 140px;
    text-align: center;
    border: 1px solid var(--lightgray);
    color: var(--mediumgray);
    border-radius: 10px;
    font-size: 20px;
}

.signiture span {
    display: inline-block;
    height: 140px;
    line-height: 140px;
}

.mg1rem {
    margin: 1rem;
}

.font_b {
    font-weight: 700;
    text-decoration: underline;
}

.simple_addr span {
    width: 86px;
}

.box_txt_side {
    float: right;
    font-size: 16px;
    border: none;
    background: var(--paleblue);
    color: var(--blue);
    padding: 2px 4px;
    border-radius: 4px;
    box-sizing: border-box;
}

.box_txt_side_red {
    float: right;
    font-size: 16px;
    border: none;
    background: var(--palered);
    color: var(--red);
    padding: 2px 4px;
    border-radius: 4px;
    box-sizing: border-box;
}

.box_txt_side_gray {
    float: right;
    font-size: 16px;
    border: none;
    background: var(--lightgray);
    color: var(--darkgray);
    padding: 2px 4px;
    border-radius: 4px;
    box-sizing: border-box;
}

input[type=button].btn_coral_inner {
    width: calc(100% - 2rem);
    height: 100%;
    min-height: 40px;
    /* color: white;
    border: 0;
    background: var(--coral); */
    color: var(--deepcoral);
    background: #ffeee9;
    border: 1px solid #ffd5cb;
    border-radius: 0 0 8px 8px;
    font-size: 18px;
    font-weight: 500;
    margin: 0 1rem 1rem 1rem;
}

.dgc {
    margin-bottom: 0;
    border-bottom: 0;
    border-radius: 5px 5px 0 0;
}

input[type=button].btn_agree {
    display: inline-block;
    border: 1px solid var(--lightgray);
    background: white;
    border-radius: 3px;
    color: var(--navybk);
    padding: 2px 5px;
    transition-duration: .1s;
}

input[type=button].btn_agree:hover {
    border-color: var(--mediumgray);
    background: var(--palegray);
    transition-duration: .1s;
    color: black;
}

.inp_pop {
    display: inline-block;
    border: 1px solid var(--lightgray);
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 3px;
    width: calc(100% - 60px);
    font-size: 16px;
    height: 40px;
}

input[type=button].inp_pop_btn {
    display: inline-block;
    background: var(--coral);
    width: 55px;
    height: 40px;
    color: white;
    font-size: 16px;
    border: 0;
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 3px;
}

.click_success {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 100%;
}

.click_success img {
    margin-bottom: 15px;
    margin-top: -20px;
}

.click_success p {
    text-align: center;
    font-size: 24px;
}

.click_success .txt_sm_gray {
    font-size: 16px;
    color: var(--mediumgray);
    margin-top: 10px;
}

.info04 {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    /* flex-direction: column; */
    /* padding: 0.5rem 0 0; */
    color: var(--deepgray);
    margin-top: 3px;
    /* color: var(--red); */
}

.mr10 {
    margin-right: 10px;
}

.deepgray {
    color: var(--deepgray);
}

input[type=button].btn_cancel_pop {
    display: inline-block;
    float: right;
    width: fit-content;
    border: 0;
    background: none;
    color: var(--deepgray);
    font-size: 18px;
    padding-bottom: 5px;
    margin-top: 11px;
    /* height: 20px; */
    /* border-bottom: 1px solid var(--deepgray); */
    /* margin-right: 12px; */
}

/* 230629 add */
.card_guide_area img {
    margin: 0;
    display: block;
    width: 40%;
    margin: 30px auto 0;
}

.card_guide1 {
    display: block;
    width: 100%;
    /* height: 80px; */
    /* max-height: 180px; */
    background: var(--bluegray);
    border: 0;
    border-radius: 3px;
    color: var(--navybk);
    padding: 20px 25px;
    margin-bottom: 10px;
    font-size: 18px;
    border-radius: 16px;
    /* overflow-y: auto; */
    /* white-space: pre-wrap; */
}

.btn_area_cg {
    margin: 15px 0 0;
}

input[type=button].btn_googleplay {
    display: inline-block;
    width: calc(50% - 5px);
    padding: 10px 5px;
    border-radius: 10px;
    background: url(../img/icon_google.png) calc(50% - 45px) center no-repeat;
    background-color: var(--coral);
    background-size: 15px;
    color: white;
    border: none;
    text-indent: 21px;
    font-size: 16px;
}

input[type=button].btn_appstore {
    display: inline-block;
    width: calc(50% - 5px);
    padding: 10px 5px;
    border-radius: 10px;
    background: url(../img/icon_apple.png) calc(50% - 40px) center no-repeat;
    background-color: var(--coral);
    background-size: 15px;
    color: white;
    text-indent: 20px;
    border: none;
    font-size: 16px;
}

.guide_desc {
    margin: 20px auto;
    padding: 20px;
    border: 1px solid var(--lightgray);
    border-radius: 15px;
}

.tit_card_guide {
    background: url(../img/icon_phone.png) left center no-repeat;
    background-size: 18px;
    padding-left: 30px;
    margin-bottom: 13px;
    font-size: 22px;
    font-weight: 700;
}

.txt_card_guide {
    margin-top: 10px;
}

.txt_card_guide li {
    /* list-style:decimal; */
    font-size: 18px;
    margin-top: 2px;
}

.txt_card_guide li::marker {
    /* color: var(--coral); */
}

.img_card_app {
    border-radius: 15px;
    width: 100%;
}

.guide_desc2 {
    margin: 20px auto;
    padding: 20px;
    /* border: 1px solid var(--lightgray); */
    background: var(--bluegray);
    border-radius: 15px;
    font-size: 18px;
}

.guide_desc2 b.coral {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

/* 230713 개인간거래 추가 */
.box_deal {
    margin: 1rem 0 0px;
}

.box_deal_edit {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 1rem 0 0px;
}

.tit_deal {
    font-size: 18px;
    padding-left: 5px;
    margin-bottom: 10px;
}

input[type=button].btn_deal {
    width: 100%;
    height: 100%;
    max-height: 60px;
    min-height: 60px;
    color: white;
    background: linear-gradient(145deg, var(--coral) 0%, var(--orange) 100%);
    border-radius: 10px;
    border: 0;
    font-size: 18px;
    font-weight: 500;
}

input[type=button].btn_deal_edit {
    display: inline-block;
    width: 80px;
    height: 30px;
    border: 1px solid var(--mediumgray);
    background: white;
    background: none;
    border-radius: 5px;
    color: var(--navybk);
    font-size: 16px;
}

.selc_deal_type {
    display: inline-block;
    width: 100%;
    font-size: 16px;
    border: 1px solid var(--lightgray);
    background: white url(../img/arrow_down.png) calc(100% - 10px) center no-repeat;
    background-size: 14px;
    color: var(--navybk);
    /* padding: 8px 0px; */
    border-radius: 10px;
    text-indent: 17px;
    /* margin: 0 0px 5px 5px; */
    height: 49px;
    line-height: 49px;
}

.inp_deal01 {
    width: 100%;
    padding: 12px;
    border: 0;
    border-radius: 10px;
    font-size: 18px;
    background: white;
}

.txt_sub_deal {
    font-size: 14px;
    margin-top: 5px;
}

.txt_sub_deal2 {
    text-align: right;
    color: #999;
    font-size: 14px;
    margin-top: 5px;
}

.box_example {
    width: 100%;
    padding: 5px 10px;
    margin: 0;
    margin-top: 10px;
    /* border: 1px solid var(--lightgray); */
    background: #e6edff;
    border-radius: 5px;
    font-size: 14px;
}

.ml5 {
    margin-left: 5px;
}

.txt_noedit {
    font-weight: 500;
    margin-top: 25px;
    /* margin-left: 5px; */
    text-align: center;
}

.deal_lst {
    width: 100%;
    padding: 5px 10px;
    margin: 0;
    margin-top: 10px;
    border: 1px solid var(--lightgray);
    background: white;
    border-radius: 10px;
}

.lst_bet {
    display: flex;
    align-items: center;
    justify-content: space-between;
    line-height: 30px;
    border-bottom: 1px solid #f8f8f8;
}

.lb_tit {
    font-weight: 500;
}

input[type=button].btn_go_send {
    display: inline-block;
    border: 1px solid var(--lightblue);
    background: white;
    border-radius: 3px;
    color: var(--blue);
    padding: 2px 5px;
}

input[type=button].btn_go_send:hover {
    border-color: var(--mediumgray);
    background: var(--palegray);
    transition-duration: .1s;
    color: black;
}

input[type=button].btn_go_send2 {
    display: inline-block;
    width: 100%;
    border: 1px solid var(--lightblue);
    background: white;
    border-radius: 5px;
    color: var(--blue);
    font-size: 16px;
    padding: 5px 5px;
    font-weight: 500;
}

.cont_area_detail li.w100>span:nth-of-type(1) {
    display: none;
}

.cont_area_detail li.w100>span:nth-of-type(2) {
    width: 100%;
}

/* input[type=button].btn_go_send2:hover {
    border-color: var(--mediumgray);
    background: var(--palegray);
    transition-duration: .1s;
    color: black;
} */

.cont_area_detail li span.tag_bg {
    line-height: normal;
}

ul.cont_area_detail.c_d_2 li>span:nth-of-type(1).red {
    color: var(--red);
}

.bd_gray {
    border: 1px solid var(--lightgray);
}

/* 230721 */
.bt_gray {
    border-top: 1px solid var(--mediumgray);
}

.ib {
    display: inline-block;
    width: 100%;
    text-align: center;
}

.flex_a_c {
    display: flex;
    align-items: center;
}

/* 230726 */
.btn_all_send {
    background: white;
    border: 1px solid var(--mediumgray);
    border-radius: 3px;
    color: var(--navybk);
    padding: 2px 5px;
    float: left;
    margin-left: 3px;
    /* display: block; */
}

/* 230925 쇼핑몰결제요청 */
/* PC */
.wrap_sub02 {
    height: calc(100% - 4rem);
    margin: 2rem 0;
    /* width: calc(100% - 4rem); */
    display: flex;
    flex-direction: column;
    max-width: 700px;
}

.cont_area_sub02 {
    /* width: 700px; */
    /* max-width: 713px; */
    /* min-width: 0px; */
    flex: 2.5;
    border-radius: 10px;
    background: white;
    padding: 0 3rem 1rem;
    box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.08);
}

.box_qrcode {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 400px;
    height: 400px;
    margin: 1rem auto;
    border-radius: 10px;
    box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.05);
    background: white;
}

.box_qrcode img {
    display: inline-block;
    width: 70%;
}

.txt_qrcode_scan {
    /* display: inline-block; */
    /* padding-right: 22px; */
    margin-top: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* background: url(../img/icon_qrcodescan.png) right center no-repeat; */
    /* text-align: center; */
    font-size: 20px;
}

.txt_qrcode_scan img {
    display: inline-block;
    margin-left: 7px;
}

.txt_codepayapp {
    display: inline-block;
    padding-right: 22px;
    background: url(../img/icon_app_128.png) right center no-repeat;
    color: var(--coral);
    font-weight: 700;
    background-size: 18px;
    margin-right: 2px;
}

.tit_pay_request {
    margin: 40px 0 20px;
    text-align: center;
    font-size: 32px;
}

.box_appdownload {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* width: 100%; */
    height: 100%;
    /* max-height: 258px; */
    /* color: white; */
    background: #fbf3f2;
    border-radius: 10px;
    border: 0;
    font-size: 18px;
    font-weight: 500;
    box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.08);
    /* min-width: 700px; */
    min-width: calc(700px - 4rem);
}

.sub_box_coral {
    display: inline-block;
    padding: 5px 15px;
    font-size: 18px;
    font-weight: 700;
    color: white;
    background: var(--coral);
    margin: 30px auto 10px;
    text-align: center;
    border-radius: 30px;
}

.tit_appdownload {
    font-weight: 300;
    font-size: 32px;
}

.tit_appdownload .coral {
    font-weight: 900;
}

.txt_appdown {
    font-size: 16px;
    margin-top: 10px;
    font-weight: 400;
}

.txt_appdown .underline {
    text-decoration: underline;
}

.txt_appdown .bold {
    font-weight: 900;
}

.btn_market {
    margin-bottom: 20px;
}

.box_fail {
    display: flex;
    height: calc(100% - 150px);
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.box_fail p {
    font-size: 24px;
    margin-top: 15px;
    color: #666;
    font-weight: 500;
}

.box_fail div {
    text-align: center;
}

/* mobile */
.cont_area_sub02_m {
    /* flex: 2.5; */
    display: flex;
    border-radius: 10px;
    background: white;
    /* padding: 0 1rem 1rem; */
    /* box-shadow: 0 5px 15px 7px rgba(0, 0, 0, 0.08); */
    flex-direction: column;
    height: calc(100% + 2rem);
    justify-content: space-between;
    /* width: 80%; */
    position: relative;
}

.tit_pay_request_m {
    margin: 25px 0 10px;
    text-align: center;
    font-size: 24px;
}

.box_appicon {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin: 2rem auto;
}

.box_appicon span {
    color: var(--coral);
    font-weight: 700;
}

.btn_market_mobile {
    background: #f9f9fb;
    padding: 30px 15px;
    border-radius: 20px;
    text-align: center;
    margin-bottom: 80px;
}

.btn_market_mobile .coral {
    font-weight: 700;
}

.btn_market_mobile .btn_down_g {
    width: 48%;
    max-width: 160px;
    background: none;
}

.btn_market_mobile .btn_down_g img {
    width: 100%;
    max-width: 160px;
}

.txt_center {
    margin: 0 1rem;
}

.wrap_sub02_m {
    height: 100%;
    /* margin: 1rem; */
    display: flex;
    flex-direction: column;
    width: calc(100% - 2rem);
    /* max-width: 600px; */
}

.box_fail_m {
    display: flex;
    /* height: calc(100% - 150px); */
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.box_fail_m p {
    font-size: 24px;
    margin-top: 15px;
    color: #666;
    font-weight: 500;
}

.box_fail_m img {
    width: 120px;
}

.inp100 {
    display: block;
    width: 100%;
    border: 1px solid var(--lightgray);
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 3px;
    font-size: 15px;
    height: 40px;
    margin-top: -7px;
    text-align: right;
}

input.btn_coral_line {
    width: 100%;
    height: 100%;
    max-height: 60px;
    color: var(--coral);
    background: none;
    border-radius: 10px;
    border: 1px solid var(--coral);
    font-size: 18px;
    font-weight: 500;
}

.pop_txt .small {
    font-size: 16px;
    color: var(--deepgray);
}

/* 20231024 */
ul.cont_area_detail.c_d_2 li>span:nth-of-type(2).word50 {
    width: 100%;
    display: block;
    background: #f7f7f7;
    padding: 5px;
    border-radius: 3px;
    margin-top: 3px;
}

ul.cont_area_detail li.user_id {
    flex-direction: column;
}

ul.cont_area_detail li.user_id span:first-child {
    width: 100%;
    display: block;
    text-align: left;
    border-right: none;
}

ul.cont_area_detail li.user_id>span:nth-of-type(1)::before {
    display: none;
}

.link_app {
    text-align: center;
    /* margin-bottom: 60px; */
    margin-top: 10px;
    position: fixed;
    bottom: calc(60px + 2rem);
    left: 50%;
    transform: translateX(-50%);
}

.link_go_app {
    display: inline-block;
    padding: 5px 0px;
    border-bottom: 1px solid var(--darkgray);
    font-weight: 500;
    color: var(--darkgray);
}

.mt50 {
    margin-top: 50px;
}

.d_arc {
    max-width: 450px;
}

.inp_won {
    padding-right: 40px;
    background: url(../img/txt_won.png) calc(100% - 15px) center no-repeat;
    background-size: 14px;
    font-size: 18px;
    font-weight: 700;
}

.inp_won::placeholder {
    font-size: 15px;
}

.box_gray_line {
    background: var(--whitegray);
    border: 1px solid var(--palegray);
    border-radius: 10px;
}

.pop_cont {
    padding: 40px 30px;
}

.sub {
    max-width: 700px;
    margin: 0 auto;
    /* overflow: auto; */
    height: 100vh;
}

body {
    /* background: var(--bluegray); */
}

.bg_white .mid_api {
    padding-top: 67px;
}

.bg_white .top.hd_api_fix {
    max-width: 700px;
}

.box_bt_api {
    max-width: 700px;
}

.badge_navy {
    display: inline-block;
    padding: 1px 4px;
    text-align: center;
    font-size: 12px;
    border-radius: 4px;
    box-sizing: border-box;
    background: #e9eaf2;
    color: #1529a7;
    font-size: 14px;
}

.badge_lightgray {
    display: inline-block;
    padding: 1px 4px;
    text-align: center;
    font-size: 12px;
    border-radius: 4px;
    box-sizing: border-box;
    background: #e3e3e3;
    color: #818181;
    font-size: 14px;
}

.badge_mediumgray {
    display: inline-block;
    padding: 1px 4px;
    text-align: center;
    font-size: 12px;
    border-radius: 4px;
    box-sizing: border-box;
    background: #f3f3f3;
    color: #3d3d3d;
    font-size: 14px;
}

.nowrap {
    white-space: nowrap;
}

.badge_navy.large,
.badge_lightgray.large,
.badge_mediumgray.large,
.badge_mint.large{
    padding: 2px 4px;
    font-size: 16px;
    height: initial;
    width: inherit;
}
.badge_mint {
    display: inline-block;
    padding: 1px 4px;
    text-align: center;
    font-size: 12px;
    border-radius: 4px;
    box-sizing: border-box;
    background: rgb(223 241 235);
    color: rgb(4 145 129);
    font-size: 14px;
}
.cont_area_detail li>span:nth-of-type(2).word50 {
    width: 100%;
}

/* 디바이스 width 320이하 (fold) */
@media screen and (max-width:320px) {
    .tit_detail {
        font-size: 19px;
    }

    .wrapper .right a {
        width: 27px;
    }

    .info02>span:nth-of-type(1) {
        width: 100%;
    }

    .badge_lightgray,
    .badge_mediumgray,
    .badge_navy,
    .badge_mint {
        font-size: 12px;
    }

    .usage_history>div span a {
        letter-spacing: -1px;
        font-size: 16px;
    }

    .lst_acc2 li>span:nth-child(2){
        /* width: 96px; */
    }
}


.pop_cont .ta_l {
    text-align: left;
    /* font-weight: 500; */
    color: var(--navybk);
}

.pop_cont .ta_l span {
    font-weight: 500;
    color: var(--navybk);
    display: inline-block;
    width: 95px;
    /* border-right: 1px solid var(--lightgray); */
    margin-right: 10px;
    margin-bottom: 9px;
    /* height: 32px; */
}

.bg_whitegray {
    background: var(--whitegray);
    padding: 10px;
}

.txt_mid_info {
    text-align: center;
    color: var(--darkgray);
    font-weight: 500;
}

.pop_cont .ta_l {
    text-align: left;
    font-weight: 500;
    color: var(--navybk);
}

.selc_box {
    display: block;
    width: 100%;
    border: 1px solid var(--lightgray);
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 3px;
    font-size: 15px;
    height: 40px;
    margin-top: -7px;
    text-align: right;
    background: url(../img/arrow_down.png) calc(100% - 10px) center no-repeat;
    background-size: 13px;
    padding-right: 35px;
}

.selc_opt {
    max-width: 700px;
    left: 50%;
    position: absolute;
    /* bottom: -1rem; */
    transform: translateX(-50%);
    overflow-y: auto;
}

.btn_way_hori {
    width: 100%;
    margin-top: 2rem;
    display: flex;
    justify-content: space-between;
}

input[type="button"].btn_way_codepay,
input[type="button"].btn_way_account {
    display: inline-block;
    width: calc(50% - 5px);
    padding: 70px 0px 0px;
    height: 160px;
    border: 1px solid var(--palegray);
    background: url(../img/icon_ch01.png) center 41px no-repeat;
    background-size: 41px;
    background-color: #fafafa;
    border-radius: 10px;
    font-size: 16px;
    text-align: center;
    /* text-indent: 40px; */
    color: black;
}

input[type="button"].btn_way_account {
    background: url(../img/icon_ch02.png) center 41px no-repeat;
    background-size: 41px;
    background-color: #fafafa;
    /* margin-top: 10px; */
}

input[type="button"].btn_way_codepay:hover,
input[type="button"].btn_way_account:hover {
    background-color: #fff8f5;
    border-color: #fe9f8a;
}

.btn_way_hori input[type="button"].on,
.btn_way_hori button.on {
    background-color: #fff8f5;
    border-color: #fe9f8a;
}

.box_app_guide {
    /* width: 700px; */
    flex: 1;
    margin-top: 20px;
    border-radius: 10px;
    display: flex;
    align-items: flex-end;
}

/* 디바이스 width 320이하 (fold) */
/* @media screen and (max-width:400px) {
    .txt_qrcode_scan{
        font-size: 16px;
    }
} */

.bnr_appdown {
    width: 100%;
    background: #eff1f5 url(../img/bnr_appdown.png) center no-repeat;
    display: block;
    background-size: 100%;
    border-radius: 10px;
    height: 100px;
    margin: 10px auto 0;
}

.bnr_appdown_pc {
    display: none;
}

/* 디바이스 width 500이상 (PC) */
@media screen and (min-width:500px) {
    .bnr_appdown {
        display: none;
    }

    .bnr_appdown_pc {
        width: 100%;
        height: 100px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 10px auto 0;
        padding: 0 10px;
        background: #eff1f5;
        border-radius: 10px;
    }

    .bnr_img {
        width: 25%;
        height: 100%;
        background: url(../img/img_appdown.png) center bottom no-repeat;
        background-size: 79%;
    }
}

.txt_appdownbnr {
    width: 40%;
    padding-right: 4px;
}

.txt_bnr_tit {
    font-size: 21px;
    letter-spacing: -1px;
    font-weight: 500;
}

.btn_market2 {
    /* margin-bottom: 20px; */
    width: 52%;
}

.btn_down_market {
    width: 49%;
    display: inline-block;
    border: 0;
    cursor: pointer;
}

.btn_down_market img {
    width: 100%;
}

.cont_area_sub02_m input[type="button"].btn_next_l {
    position: fixed;
    bottom: 1rem;
    left: 2rem;
    width: calc(100% - 4rem);
    max-width: calc(700px - 2rem);
}

/* 디바이스 width 500이상 (PC) */
@media screen and (min-width:500px) {
    .bot.fix input[type="button"].btn_next_l {
        position: fixed;
        bottom: 1rem;
        left: 50%;
        transform: translateX(-50%);
        width: calc(100% - 2rem);
        max-width: calc(700px - 2rem);
    }
}

.txt_coral_caution {
    color: var(--coral);
    display: inline-block;
    width: 100%;
    text-align: center;
    /* margin-bottom: 60px; */
    position: fixed;
    bottom: calc(60px + 2rem);
    left: 50%;
    transform: translateX(-50%);
}

.bg_white {
    background: white;
}

.bot.fix input[type="button"].btn_next_l {
    width: 100%;
    height: 100%;
    max-height: 60px;
    /* min-height: 40px; */
    min-height: 60px;
    color: white;
    background: linear-gradient(145deg, var(--coral) 0%, var(--orange) 100%);
    border-radius: 10px;
    border: 0;
    font-size: 18px;
    font-weight: 500;
    position: fixed;
    bottom: 1rem;
    left: 50%;
    width: calc(100% - 2rem);
    max-width: calc(700px - 2rem);
    transform: translateX(-50%);
}

.inp_pop2 {
    display: inline-block;
    border: 1px solid var(--lightgray);
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 3px;
    width: calc(100% - 90px);
    font-size: 16px;
    height: 40px;
    margin-left: 5px;
    text-align: right;
}
.lst_bet:last-child{
    border-bottom: 0;
}
/* 231116 */
.bg_won{
    display: inline-block;
    background: url(../img/txt_won_gray.png) right 11px no-repeat;
    background-size: 13px;
    padding-right: 17px;
}
input[type="button"].btn_next_l.inherit{
    position:inherit;
    bottom: 1rem;
    left: 2rem;
    width: calc(100%);
    max-width: calc(700px - 2rem)
}
.tb_num{
    font-size: 15px;
    letter-spacing: -1px;
    word-break: keep-all;
}