@charset "utf-8";
@import 'normalize.css';
@import './pretendard.css';


/* Base styles: opinionated defaults */
html,body {position:relative;width:100%;height:100%;color:#17171d;font-size: 1em;line-height: 1.4}
::-moz-selection {background: #b3d4fc;text-shadow: none;}
::selection {background: #b3d4fc;text-shadow: none}
hr {display: block;height: 1px;border: 0;border-top: 1px solid #eaeaed;margin: 1em 0;padding: 0}
audio,canvas,iframe,img,svg,video {vertical-align: middle}
fieldset {border: 0;margin: 0;padding: 0}
/* reset CSS*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, input, select, textarea, button,
a, span {font-family: 'Pretendard', sans-serif;font-weight:500;-webkit-font-smoothing: antialiased;word-wrap: break-word;line-height:26px;word-break: keep-all;margin:0;padding:0;border:0;outline:0;box-sizing:border-box;-ms-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-webkit-tap-highlight-color: rgba(0,0,0,0);-moz-tap-highlight-color: rgba(0,0,0,0);-webkit-appearance: none;-moz-appearance: none;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;}
table {border-collapse:collapse;border-spacing:0;resize: vertical}
span {vertical-align:baseline}
button {outline:0!important;cursor:pointer; margin:0; padding:0; border:none; background:none;}
a {text-decoration:none;cursor: pointer;font-size:inherit;color:inherit;}
a:visited,
a:hover,
a:active,
a:focus {outline:0!important;text-decoration:none;color:inherit}
/*a:hover {color:#304cff}*/
a.no-color:hover {color:inherit}
b,strong  {font-size:inherit;color:inherit}
ul,ol,li {list-style:none}
/* Browser Upgrade Prompt */
.browserupgrade {margin: 0.2em 0;background: #ccc;color: #000;padding: 0.2em 0}
/* input type number 에서 화살표 제거 */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
/* 이미지 맥스 */
img, iframe {max-width:100%!important}

/* ==========================================================================
   Helper classes
   ========================================================================== */
.none {display: none !important;}
.visuallyhidden {border: 0;clip: rect(0 0 0 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px;white-space: nowrap; /* 1 */}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {clip: auto;height: auto;margin: 0;overflow: visible;position: static;width: auto;white-space: inherit;}
.invisible {visibility: hidden;}

.clear:before,
.clear:after,
.cfix:before,
.cfix:after {content: " ";display: table;clear: both}

/* layout */
.bg-b {background-color:#17171d}
.bg-g {background-color: #F9F9FA}
.bg-half-g{background-color: rgba(244, 244, 247, 0.5)}
.bg-f {background-color: #fff!important;}
.bg-sym {background-color:#304cff }
.bg-sky-blue {background-color:#E4ECFF }
.bg-pink {background-color:#FFEAEC}
.bg-f7 {background-color:#f7f7f7}
.bg-none {background:none}
.bg-img {background-repeat:no-repeat;background-position:center;background-size:cover}
#wrapper {overflow:hidden;overflow-y: auto}
.container {width:1310px;margin:0 auto;padding:0 15px}
.sub-container {width:980px;margin:0 auto;padding:0 15px}
.over-hidden {overflow: hidden}
.left {float:left}
.right {float:right}
.center {margin-left:auto;margin-right:auto}
.block {display: block!important;}
.in-b {display: inline-block!important;}
.w10 {width:10%}
.w15 {width:15%}
.w20 {width:20%}
.w25 {width:25%}
.w30 {width:30%}
.w35 {width:35%}
.w333 {width:33.3%}
.w40 {width:40%}
.w45 {width:45%}
.w50 {width:50%!important}
.w55 {width:55%}
.w60 {width:60%}
.w65 {width:65%}
.w70 {width:70%}
.w75 {width:75%}
.w80 {width:80%}
.w85 {width:85%}
.w90 {width:90%}
.w100 {width:100%!important}
.w284px {width:284px}
.h100 {height:100%!important}
.h100vh {height:100vh}
.h16 {height:16px}
.mgw-auto {margin-left:auto;margin-right:auto}
.mgh-auto {margin-top:auto;margin-bottom:auto}
.mgt {margin-top:auto}
.mtop-1 {margin-top:-1px}
.mtop-2 {margin-top:-2px}
.mtop-3 {margin-top:-3px}
.mtop-4 {margin-top:-4px}
.mtop-5 {margin-top:-5px}
.mtop-6 {margin-top:-6px}
.mtop0 {margin-top:0px!important;}
.mtop2 {margin-top:2px}
.mtop3 {margin-top:3px}
.mtop4 {margin-top:4px}
.mtop5 {margin-top:5px}
.mtop10 {margin-top:10px}
.mtop15 {margin-top:15px}
.mtop20 {margin-top:20px!important;}
.mtop25 {margin-top:25px}
.mtop30 {margin-top:30px}
.mtop35 {margin-top:35px}
.mtop40 {margin-top:40px}
.mtop50 {margin-top:50px}
.mtop60 {margin-top:60px}
.mtop70 {margin-top:70px}
.mtop80 {margin-top:80px}
.mtop100 {margin-top:100px}
.mtop120 {margin-top:120px}
.mtop150 {margin-top:150px}
.mbottom20 {margin-bottom:20px;}
.mbottom25 {margin-bottom:25px;}
.mbottom40 {margin-bottom:40px;}
.mbottom50 {margin-bottom:50px;}
.mbottom120 {margin-bottom:120px;}
.mbottom150 {margin-bottom:150px;}
.mleft3 {margin-left:3px}
.mleft4 {margin-left:4px}
.mleft5 {margin-left:5px}
.mleft8 {margin-left:8px}
.mleft10 {margin-left:10px}
.mleft15 {margin-left:15px}
.mleft20 {margin-left:20px}
.mleft30 {margin-left:30px}
.mgr5 {margin-right:5px}
.ptop20 {padding-top:20px!important;}
.ptop25 {padding-top:25px}
.ptop30 {padding-top:30px}
.ptop40 {padding-top:40px}
.ptop50 {padding-top:50px}
.ptop60 {padding-top:60px}
.pad3 {padding:3px!important;}
.pad5 {padding:5px!important}
.pad10 {padding:10px!important;}
.pad12 {padding:12px!important;}
.pad15 {padding:15px!important;}
.pad20 {padding:20px!important}
.pad25 {padding:25px!important}
.pad30 {padding:30px!important}
.pad40 {padding:40px!important}
.p5 {padding:5px 0!important}
.p10 {padding:10px 0!important}
.p15 {padding:15px 0!important}
.p20 {padding:20px 0!important}
.p30 {padding:30px 0!important}
.p50 {padding:50px 0!important}
.plr30 {padding:0 30px}
.pdh12 {padding-top:12px;padding-bottom:12px;}
.pdw16 {padding-left:16px;padding-right:16px;}
.pleft80{padding-left:80px;}
.mgr-auto {margin-left:auto}

/* position */
.relative {position:relative}
.absolute {position:absolute}
.static {position:static!important;}
.ab-top-left {top:0;left:0}
.ab-top-right {top:0;right:0}
.ab-bottom-left {bottom:0;left:0}
.ab-bottom-right {bottom:0;right:0}

/* 가로 정렬 리스트 */
ul.hor-li:after {content:"";display:table;clear: both}
ul.hor-li > li {float:left}
/* 세로 가운데 정렬*/
.v-center-cont {display: table;width:100%;height:100%}
.v-center-box {display:table-cell;vertical-align:middle;text-align: center}

/* 리스트 패딩 */
ul.li-p5 li {padding:5px 0}
ul.li-p8 li {padding:8px 0}
ul.li-p10 li {padding:10px 0}
ul.li-p12 li {padding:12px 0}
ul.li-p15 li {padding:15px 0}
ul.li-p20 li {padding:20px 0}

/* fonts */
.text-center {text-align: center!important;}
.text-right {text-align: right}
.text-left {text-align: left}
.v-top {vertical-align: top!important;}
.v-mid {vertical-align: middle!important;}
.v-bottom {vertical-align: bottom!important;}
.v-base {vertical-align: baseline!important;}
.w-space-pre {white-space:pre}
.font-light {font-weight:300!important}
.font-light b {font-weight:600}
.font-normal {font-weight:400!important}
.font-bold {font-weight:700!important}
.t-sym {color:#304cff!important;}
.t-fff {color:#fff!important;}
.t-fff-04 {color:rgba(255,255,255,.4)!important;}
.t-000 {color:#000!important;}
.t-000-05 {color: rgba(0, 0, 0, 0.51) !important;}
.t-bk {color:#17171d!important;}
.t-red {color:#ff2e4a!important}
.t-gray {color:#a5a5b4!important}
.t-charcoal {color:#686868!important;}
.t-deep-gray {color:#747683!important;}
.t-gray-light {color:#dcdce1}
.t-gray-light2 {color:#b6bace!important;}
.t-deep-blue {color:#0d3792}
.t-blue{color:#304cff !important}
.t-light-blue{color:#007bff !important}
.t-green {color: #48caa6;}
.t-yellow {color: #FFA41B;}
.t-orange {color: #FD8D09;}
h1 {font-size:42px;line-height:1.2}
h2 {font-size:38px;line-height:1.3}
h3 {font-size:28px;line-height:1.3}
.f-inherit {font-size:inherit}
.f9 {font-size:9px!important;}
.f10 {font-size:10px!important;}
.f11 {font-size:11px!important;}
.f12 {font-size:12px!important;}
.f13 {font-size:13px!important;}
.f14 {font-size:14px!important;}
.f15 {font-size:15px!important;}
.f16 {font-size:16px!important;}
.f17 {font-size:17px!important;}
.f18 {font-size:18px!important;}
.f20 {font-size:20px!important;letter-spacing:-.4px}
.f22 {font-size:22px!important;letter-spacing:-.6px}
.f24 {font-size:24px!important;letter-spacing:-.8px}
.f28 {font-size:28px!important;letter-spacing:-.8px}
.f30 {font-size:30px!important;letter-spacing:-.8px}
.f32 {font-size:32px!important;letter-spacing:-.8px}
.f40 {font-size:40px!important;letter-spacing:-.8px}
.f48 {font-size:48px!important;letter-spacing:-.8px}
.f50 {font-size:50px!important;letter-spacing:-1.3px;line-height:1.3}
.t-uline {display:inline-block;line-height:1.1;border-bottom:2px solid;border-bottom-color:inherit}
.t-d-uline {text-decoration:underline!important}
.lineh-7{line-height:1.7}
.lineh-8{line-height:1.8}

/* border */
.border-none {border:none!important;}
.border-g {border:1px solid #eaeaed!important;}
.border-dg {border:1px solid #BCBCC2!important;}
.border-sym {border:1px solid #304cff!important;}
.border-light-blue {border:1px solid #007bff!important;}
.border-f {border:1px solid #fff!important;}
.border-l-g {border-left:1px solid #eaeaed}
.border-r-g {border-right:1px solid #eaeaed}
.border-t-g {border-top:1px solid #eaeaed}
.border-b-g {border-bottom:1px solid #eaeaed}
.border-r-4 {border-radius:4px}
.border-r-6 {border-radius:6px}
.border-r-16 {border-radius: 16px!important;}
.border-r-32 {border-radius: 32px!important;}
.border-r-36 {border-radius: 36px!important;}

/* placeholder */
/*::placeholder {color: rgba(40, 40, 45, 0.21);opacity: 1;}*/
/*:-ms-input-placeholder {color: rgba(40, 40, 45, 0.21);}*/
/*::-ms-input-placeholder {color: rgba(40, 40, 45, 0.21);}*/

::placeholder {color: #606367;}
:-ms-input-placeholder {color: #606367;}
::-ms-input-placeholder {color: #606367;}

/* effects */
/* 말줄임 효과 */
.ellip {display:block;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
.ellip-2 { overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;word-wrap:break-word;line-height: 1.6em;height: 3.2em;}
.ellip-3 { -webkit-line-clamp: 3;line-height: 1.6em;height: 4.8em;}
.ellip-4 { -webkit-line-clamp: 4;line-height: 1.6em;height: 6.4em;}
/* dropdown */
.dropdown {position:relative}
.dropdown .dropdown-contents {position:absolute;transition:.3s;opacity: 0;display: none;z-index:999}
.dropdown:hover .dropdown-contents {opacity: 1;display:block}

/* button */
.btn {display:inline-block;text-align:center;padding:14px 10px;color:#304cff;border:1px solid #304cff;border-radius:3px;box-sizing:border-box}
.btn-border-gray {border-color:#eaeaed;color:#aaa}
.btn-border-gray2 {border-color:#d0d0d0;color:#686868!important;}
.btn-border-b {border-color:#dcdce1;color:#17171d}
.btn-s {font-size:12px;padding:4px 8px;border:1px solid #dcdce1;border-radius:17px}
.btn-sm {padding:12px 19px;}
.btn-m {padding:8px 18px;line-height:1}
.btn-big {padding:12px 56px}
.btn-bg-w {background: #fff}
.btn-bg-sym {background: #304cff}
.btn-bg-red {background: #FF3838;color:#fff!important;border:none}
.btn-bg-purple {background:#304cff;color:#fff!important;border-color:#304cff}
.btn-bg-deep-blue {background: #0d3792;border:1px solid #0d3792;}
.btn-bg-light-blue {background: #007bff;border:1px solid #007bff;}
.btn-bg-light-gray {background:#EFEFEF;border:none}
.btn-bg-gray {background:#7e7e81;border:1px solid #7e7e81}
.r-btn {padding:5px 18px;border:1px solid #dcdce1;border-radius:18px}
button:disabled {opacity:.25;cursor:initial}

/* flex */
.flex {display: flex}
.flex0 {flex:none}
.flex1 {flex:1}
.flex-wrap {flex-wrap: wrap}
.flex-column {flex-direction: column}
.item-center {align-items:center}
.justify-center {justify-content:center}
.justify-between {justify-content: space-between}
.justify-around {justify-content: space-around}
.flex-left {margin-right:auto}
.flex-right {margin-left:auto}

.border {border:1px solid red}
.break-all {word-break: break-all}
.table-fixed {table-layout:fixed}

/* items */
.badge-s {padding:0 5px;color:#fff;font-size:11px;font-weight:600;border-radius:8px;background:#304cff;vertical-align:middle;margin-left:4px}

/* token symbol*/
.tss24 {width:24px;height:24px;border-radius: 50%}
.tss24 > img {width:14px}
.tss28 {width:28px;height:28px;border-radius: 50%}
.tss28 > img {width:14px}
.tss32 {width:32px;height:32px;border-radius: 50%;line-height:32px}
.tss38 {width:38px;height:38px;border-radius: 50%}
.tss38 > img {width:20px}
.tss50 {width:50px;height:50px;border-radius: 50%}
.tss50 > img {width:30px}
.tss64 {width:64px;height:64px;border-radius: 50%}
.tss64 > img {width:32px}
.tss120 {width:120px;height:120px;border-radius: 50%}
.tss120 > img {width:60px}
.tss164 {width:164px;height:164px;border-radius: 50%}
.tss164 > img {width:82px}

/* input checkbox */
input {line-height:1}
.check-box {padding:3px 0 3px 20px;display: block;position: relative;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
input[type=checkbox] {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;}
.check-box .checkmark {position: absolute;top: 5px;left: 0;height: 16px;width: 16px;border:1px solid #eaeaed;}
.check-box .checkmark:after {content: "";position: absolute;display: none;}
.check-box input:checked ~ .checkmark:after {display: block;}
.check-box .checkmark:after {left: 4px;top: 1px;width: 4px;height: 8px;border: solid #304cff;border-width: 0 2px 2px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}


/* star checkbox */
.star-check-box {display:inline-block;position: relative;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.star-check-box input ~ .off {display:inline-block;font-size:18px;color:#a5a5b4}
.star-check-box input ~ .on {display:none;font-size:18px;color:#ffcb2f}
.star-check-box input:checked ~ .off {display:none}
.star-check-box input:checked ~ .on {display:inline-block}

/* progressbar */
.prog-box {padding:15px 0}
.prog-bar {width:100%;height:8px;background:#fafafa}
.prog-bar .ratio {position:absolute;right:10px;top:-65px;font-size:42px}
.prog-bar .ratio span {display:inline-block;font-size:18px;margin-bottom:5px}
.prog-bar-on {height:100%;background:#304cff}
.prog-bar-on .parti {position:absolute;width:100%;top:-30px}

/* 이미지 라운드 */
.r-photo {border-radius:50%;background-repeat:no-repeat;background-position:center;background-size:cover;background-color:#eff0fd;color:#304cff }
.r-photo.no-img {text-align:center;font-size:20px;}
.r-photo.no-img.f10 {font-size:10px;}
.r-photo.no-img.f14 {font-size:14px;}
.r-photo.no-img.f16 {font-size:16px;}
.r-photo-32 {width:32px;height:32px;line-height:30px}
.r-photo-36 {width:36px;height:36px;line-height:34px}
.r-photo-42 {width:42px;height:42px;line-height:40px}
.r-photo-48 {width:48px;height:48px;line-height:48px}
.r-photo-60 {width:60px;height:60px;line-height:60px}

/* textarea */
textarea {resize: none;-webkit-appearance: none;}
textarea::-webkit-input-placeholder {  color: #dcdce1;}
textarea::-moz-placeholder { color: #dcdce1;}
textarea:-ms-input-placeholder {  color: #dcdce1;}
textarea:-moz-placeholder { color: #dcdce1;}

.pointer {cursor:pointer}
.no-pointer {cursor:default}


/* 체크박스 */
.check-cont {display:block;position:relative;padding-left:25px;cursor:pointer;-webkit-userwallet-card-box-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.check-cont input {position:absolute;opacity:0;cursor:pointer;height:0;width:0}
.checkmark {  position: absolute;top: 1px;left: 0;height:18px;width: 18px;border:1px solid #ccc;background-color: #fff}
.checkmark:after {content:"";position:absolute;display: none}
.check-cont .checkmark:after {left:5px;top:1px;width:5px;height:8px;border:solid #304cff;border-width:0 2px 2px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);}
.check-cont input:checked ~ .checkmark:after{display: block;}


/* ==========================================================================
   main
   ========================================================================== */

/* common style */
.main-contents-container {margin-left:320px;margin-bottom:120px}
.section-title {display:inline-block;font-size:16px;font-weight:600}
.divi {margin:0 5px;font-weight:400}
/*tab-menu*/
.on-off-tabs, .on-off-tabs2 {margin-left:-5px;margin-right:-5px}
.on-off-tabs li, .on-off-tabs2 li {padding:5px 0;margin-left:5px;margin-right:20px;cursor: pointer;color:#17171d;opacity:.2}
.on-off-tabs li.on, .on-off-tabs2 li.on {color:#17171d;opacity:1}
.tab-container .tab-content {display:none}
.tab-container .tab-content:first-child {display:block}
.new-label {display:inline-block;vertical-align:middle;margin-top:-4px;padding:2px 4px;border-radius:1.6px;font-size:9px}
.new-label-s {font-weight:bold;border-radius:3px;padding:1px 4px;display:inline-block}
.new-label-w {background:#fff;color:rgba(0,0,0,1)}
.new-label-b {background:#17171d;color:#fff}
.sub-label {padding:0 3px;font-size:12px;border:1px solid rgba(255, 255, 255, 0.31);border-radius:10px}
.sub-label-2 {padding:2px 5px;border-color:#dcdce1;border-radius:16px}
.sub-label-3 {padding:4px 12px;border:none;color:#858590;background:#EEF0F3;border-radius:16px }
.round-label-s {display:inline-block;padding:1px 5px;border-radius:8px;font-size:10px;color:#fff;font-weight:bold}
.round-point-s {display:inline-block;width:4px;height:4px;border-radius:4px;margin-left:-6px;margin-top:3px;}
.section-cont {border-top:1px solid #eaeaed}
.coin-label {padding:4px 6px;margin:0 13px;color:#298CFF;border:1px solid #298CFF;border-radius:4px}
/* profile type */
.prof .r-photo + .prof-cont {margin-top:5px;margin-left:15px}

/* pagination */
.pagination {display:block;margin:0 auto;text-align:center}
.pagination .page {position:relative;max-width:206px;margin:0 auto}
.pagination button {display:inline-block;font-size:14px;color:#000;margin:0 5px;width:28px;height:28px;border-radius:50%;color:#000;background:none;line-height:27px;text-align:center;}
.pagination button[state="active"] {color:#fff;background:#333;text-decoration:none;}
.pagination a {display:inline-block;font-size:14px;color:#000;margin:0 5px;width:28px;height:28px;border-radius:50%;color:#000;background:none;line-height:27px;text-align:center;}
.pagination a[state="active"] {color:#fff;background:#333;text-decoration:none;}
.pagination .prev {position:absolute;left:-48px}
.pagination .next {position:absolute;right:-48px}

/* scrollbar*/
.scroll-bar {overflow:hidden}
.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail {background-color:rgba(121, 121, 121, 0.01)}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {background-color:rgba(121, 121, 121, 0.3)}

/* header */
#header {background: #fff}
.header-container {min-width:1310px;padding-left:30px;padding-right:30px}
/* main-logo */
.main-logo {position:relative;margin:22px 0}
.main-logo span {display:block;position:absolute;left:100%;bottom:0;font-size:14px;color:#fff;width:100%}
.main-logo img {width:130px;padding-right:5px;margin-top:-8px}
#main-logo-text {position:absolute;top:4px;right:-140px;text-align:left}

/* header nav*/
#nav li {float:left;margin-right:28px;padding:22px 0}
#nav li.gnb-more-btn{margin-right:15px;}
#nav li:last-child {margin-right:0}
#nav li i:hover {color:#304cff}
#nav li a {display:block;font-size:14px;font-weight:600}
#nav li:hover {border-bottom-color:#304cff}
#nav li.btn-box {padding:11px 0 0}
#nav li:last-child{margin-right:0}
#nav li.btn-box .btn {width:150px;padding:10px;color:#304cff}
#nav li.logon {padding-top:13px;padding-bottom:0;margin-right:10px;}
#nav .logon-box{padding:0 10px;}
#nav .logon-box > div{float:left;}
#nav .logon-box > div.wallet a,
#nav .logon-box > div .alarm-btn{display:block;margin-top:-5px;width:32px;height:32px;}
#nav .logon-box > div .alarm-btn{height:30px;margin-top:-4px}
#nav .logon-box > div.wallet a,
#header.ontop #nav .logon-box > div.wallet a {background:url("../img/gnb_wallet.png") no-repeat center;background-size:contain}
#nav .logon-box > div .alarm-btn,
#header.ontop #nav .logon-box > div .alarm-btn {background:url("../img/gnb_notice01.png") no-repeat center;background-size:contain}
#nav .logon-box .id-email {line-height:26px;text-align:center;display: inline-block;width:28px;height:28px;background:#eff0fd;color:#304cff;border-radius:50%;margin-top:-3px;overflow: hidden;}
#nav .logon-box > div {padding:8px 0;cursor: pointer;margin-right:15px;}
#nav .logon-box > div.divi {cursor: default;margin-right:0;margin-left:0;opacity:.8;}
#nav .logon-box .logon-email {transition:.3s}
#nav .logon-box .logon-email i {transition:.3s}
#nav .logon-box .logon-email .more-tab {top:40px;z-index:1;}
#nav .logon-box .logon-email .more-tab {display: none;}
#nav .logon-box .logon-email:hover .more-tab {display: block}
#nav .logon-box .logon-email:hover i {-webkit-transform: rotate(180deg);-ms-transform: rotate(180deg);transform: rotate(180deg)}
#nav .logon-box .alarm > span {position:absolute;top:3px;left:18px}
#nav .logon-box .alarm .alarm-box {position:absolute;top:44px;right:-76px;width:300px}
#nav .logon-box .alarm .alarm-box > div {width:100%;height:235px;padding:10px 12px;background: #f4f4f7;box-shadow:0 1px 0 0 rgba(0,0,0,.1)}
#nav .logon-box .alarm .alarm-box > div:before { content: ''; width:8px; height: 8px; background: #f4f4f7; transform:rotate(-45deg); position: absolute; left:100%;margin-left:-95px; top:-4px; z-index:1;border-radius:0 }
#nav .logon-box .alarm .alarm-box .alarm-list {position:relative;padding:10px 12px;border-bottom:1px solid #eaeaed}
#nav .logon-box .alarm .alarm-box .alarm-list a {font-weight:400}
#nav .logon-box .alarm .alarm-box .alarm-list:last-child {border-bottom:0}
#nav .logon-box .alarm .alarm-box .alarm-list:before {content:"";position:absolute;top:15.5px;left:0;width:6px;height:6px;border-radius:6px;background:#304cff}
#nav .logon-box .alarm .alarm-box .alarm-list span {display: inline-block;position:absolute;top:10px;right:0;}
#nav .logon-box .alarm .alarm-box .alarm-list span i {font-size:20px;color:#dcdce1;cursor: pointer}
#nav .logon-box .alarm .alarm-box .alarm-list.visited a {color:#a5a5b4!important;}
#nav .logon-box .alarm .alarm-box .alarm-list.visited:before {background:#ccc!important;}
.alarm-list-empty {position:absolute;left:0;top:0;width:100%;height:100%;color:#17171d;line-height:233px;background: #f4f4f7;text-align:center;z-index: 1}

#nav .more-tab {top:49px;left:-46px;width:128px;border-radius:6px;border:1px solid rgba(151, 151, 151, 0.2);background:#fff}
#nav .more-tab.locale {left:-20px;width:60px}
#nav .more-tab li {float:none;padding:0;margin:0}
#nav .more-tab li:first-child a {border-top-left-radius:5px;border-top-right-radius:5px;}
#nav .more-tab li:last-child a {border-bottom-left-radius:5px;border-bottom-right-radius:5px;}
#nav .more-tab li a {color:#17171d!important;text-align:center;font-weight:600;padding:10px 0;border-bottom:1px solid rgba(151, 151, 151, 0.2)}
#nav .more-tab li a:hover {color:#fff!important;background:#304cff}
#nav .more-tab li:last-child a {border:none}

#nav.first .logon-box > div.divi.t-gray,
#nav.first li.language a.t-gray,
#nav.first li > a {color:#fff!important;;}
#nav.first li.btn-box .btn {color:#fff;border:1px solid #fff}
#nav.first li.btn-box .btn {color:#fff;border:1px solid #fff}
#nav.first .logon-box > div.wallet a,
#headerOnTop.header-sub-1 .logon-box > div.wallet a
{background:url("../img/gnb_wallet_w.png") no-repeat center;background-size:contain}
#nav.first .logon-box > div .alarm-btn,
#headerOnTop.header-sub-1 .logon-box > div .alarm-btn
{background:url("../img/gnb_notice01_w.png") no-repeat center;background-size:contain}

/* header on top */
/*#headerOnTop {transition:.1s}*/
#header #headerOnTop {width:100%;position:fixed;top:0;left:0;z-index:999}
#headerOnTop.header-sub-2 {border-bottom:1px solid #eaeaed}

#headerOnTop.header-sub-1 #nav li > a {color:#fff}
#headerOnTop.header-sub-1 {border-bottom:1px solid rgba(151, 151, 151, 0.21)}
#headerOnTop.header-sub-1 .btn-box a {border-color:#fff}
#headerOnTop.header-sub-1 #nav .logon-box .alarm .alarm-box .alarm-list a {color:#17171d}
#headerOnTop.header-sub-1 .main-logo b {color:#fff}
#header.ontop #headerOnTop {background:#fff}
#header.ontop .main-logo span,
#header.ontop #headerOnTop.header-sub-1 .main-logo b {color:#17171d}
#header.ontop #headerOnTop.header-sub-1 #nav li > a {color:#17171d}
#header.ontop #headerOnTop {border-bottom:1px solid rgba(151, 151, 151, 0.21)}
#header.ontop #headerOnTop.header-sub-1 .btn-box a {border-color:#17171d}



/* ==========================================================================
   sub-page
   ========================================================================== */

.sub-page {padding-top:70px}
.main-logo span.sub-logo-tit {font-size:24px;color:#000;bottom:-3px;padding-left:5px}

/* sort */
.sort .on {color:#304cff}

/* search */
#search-box {width:250px;/*height:34px;*/margin-top:6px;overflow: hidden;}
#search-box input {width:100%;padding:7px 40px 7px 10px;background:#f4f4f7;opacity:1;z-index: 1}
#search-box .search-btn {position:absolute;top:8px;right:10px;z-index:2}
#search-box .search-btn i {font-size:22px}
#search-box.active .search-btn {color:#304cff}


/* select-box */
.select-box .ui-selectmenu-button.ui-button {
    width:auto;
    height:44px;
    line-height:42px;
    /*height:26px;*/
    /*line-height:26px;*/
    border-radius:0;
    font-size:14px;
    font-weight:bold;
    border:1px solid #dcdce1;
    background: #fff;
    padding: 0 3px 0 10px;
}
.select-box .ui-selectmenu-text {margin-right:5px;color:#17171d!important;}
.select-box .ui-button .ui-icon {margin-top:14px;margin-left:5px}
.select-box.type2 .ui-selectmenu-button.ui-button {width:72px;height:34px;line-height:34px;border-radius:8px;font-weight:400}
.select-box.type2 .ui-button .ui-icon {margin-top:10px}
.select-box.w100 .ui-selectmenu-button.ui-button{width:100%}



/* 로그인 회원가입 */
#login-section .login-container {width:100%;max-width:480px;margin:0 auto;padding:0 18px;background:#fff}
#login-section .login-container.v2 {max-width:360px;margin:10% auto 0;padding:0 32px}
#login-form {margin:25px auto 50px;width:284px}
#login-form .form-box input {width:100%;padding:10px 3px;border-bottom:1px solid #eaeaed;}
#login-form .form-box input:focus {padding:10px 3px 9px;border-bottom:1px solid #304cff}
#login-form .form-box input:disabled {background-color: #fff}
#login-form .form-box {position:relative;margin-top:15px}
#login-form .form-btn .apply-box a {vertical-align:top}
#login-form .form-btn .apply-box p {padding:3px 0}
.form-btn .btn,
.form-btn button {display:inline-block;width:100%;height:46px;line-height:44px;text-align: center;color:#fff;background:#304cff;border-radius:4px;padding:0}
#login-footer {width:100%;padding:40px 0;border-top:1px solid #eaeaed}
#login-section .login-footer p {color:#a5a5b4;padding:2px 0}
#login-section .login-footer {margin:30px 0}
#login-section .login-footer p a {padding:0 5px}
#login-section .login-footer p img {width:62px;margin-top:-4px}
/*input[type=checkbox] {width:13px;height:13px;background:#fff;border:1px solid #dcdce1;}*/
.phone-auth-box .intl-tel-input {display:block}
#phone-auth {padding-left:55px!important;}
#phone-confirm-btn,
#auth_modal0 #sms_request {position: absolute;top: 7px;right: 0;width: 74px;height: 24px;font-size: 12px;border: 1px solid #dcdce1;border-radius: 12px;background: #fff;padding: 0;text-align: center;}
#phone-confirm-btn:hover{color:#304cff;border-color:#304cff;background:none}
.confirm-counter {position: absolute;bottom: 7px;right: 0;font-size: 12px;}
#auth_modal0 .confirm-counter{bottom:auto}

#login-form .error-msg {position:absolute;bottom:51px;}
#login-form #alertSignup.error-msg {top:-8px;bottom:auto}
#login-form .pass-check {position:absolute;right:0;top:11px;color:#dcdce1}
#login-form .pass-check.on {color:#304cff}

#login-section .join-apply a {text-decoration: underline}

#join_input_display{display:none;}

/* 코인리스트 페이지 */
#coin-table td {padding:16px 8px 15px;text-align:right;border-top:1px solid #eaeaed;border-bottom:1px solid #eaeaed}
#coin-table td .f16 {font-size:15px;letter-spacing:-.6px}
#coin-table td:first-child {text-align:left}
#coin-table td:last-child {text-align:right;padding-right:20px}
#coin-table td a {transition:.2s}
#coin-table tr .hover-text {transition:all .2s}
#coin-table tr:hover .hover-text {color:#304cff}
#coin-table td.pointer i {transform:rotate(90deg);transition:.2s}
#coin-table td.pointer.on i {transform:rotate(270deg)}
.table_append_icon {text-align:center;width:100%;padding:30px 0;opacity: 0}
.table_append_icon.on{opacity: 1;}
.table_append_icon i{font-size:30px;color:#4e66fe;animation: xi-spin 1.5s infinite linear;-webkit-animation : xi-spin 1.5s infinite linear;}

/* 코인페이지 */
table tbody td.ratio span {padding-left:5px;color:#666}
table tbody td.ratio.up span {padding-left:5px;color:#007AFF}
table tbody td.ratio.up span:before {content:'+'}
table tbody td.ratio.down span {color:#26263A}
table tbody td.ratio.down span:before {content:'-'}


/* 커뮤니티 공지사항  */
#comt-head {padding:5px 0;}
#comt-head .writer span {padding-left:18px;font-size:14px;color:#17171d;vertical-align:middle}
#comt-head .title {font-size:14px;}
.comt .noti {background: rgba(244, 244, 247, 0.51)}
.comt li {padding: 21px 0;border-bottom: 1px solid #eaeaed;}
.comt .cont .title {width:55%;padding:0 5px;display: inline-block;max-width: 98%;font-size: 16px;line-height: 24px;letter-spacing: -.7px;}
.comt .cont .title .comment {padding-left:4px;font-size:14px;color:#a5a5b4}
.comt .cont .inf {width:35%;padding-right:12px}
.comt .cont .inf p {display: inline-block;padding: 3px 0;font-size: 13px;color: #a5a5b4;}
.comt li .nr {width: 10%;display: inline-block;padding-top:0;vertical-align: top;text-align:center;line-height:24px;color:#a5a5b4}
.comt li:first-child .nr {color:#17171d}
/*.comt .noti .nr i {font-size:20px;color:#304cff;padding-top:0}*/
.board-detail img{display:inline-block;}
.board-detail .view-top {
    position: relative; padding: 20px 0 10px;
}
.board-detail .view-top .cont .title {
    display: inline-block;
    padding: 15px 0;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -1.2px;
}
.board-detail .view-top .cont .inf p {
    color: #a5a5b4;display: inline-block;
}
.board-detail .view-body {
    padding: 10px 0 50px;
    font-size: 16px;
    line-height: 27px;
    border-top: 1px solid #eaeaed;
    border-bottom: 1px solid #eaeaed;
}

.view-body .contents {white-space: pre-wrap;word-break: break-all;line-height:26px}
.view-body .contents embed {width:100%;height:980px}
.view-body .contents div {max-width:100%!important;}
/*.view-body .contents div img{white-space:normal!important;}*/
.view-body .contents div {max-width:100%!important;margin:0!important;white-space:normal!important;overflow: hidden!important;}
.view-body .contents div,
.view-body .contents span,
.view-body .contents p,
.view-body .contents a{max-width:100%!important;height:auto!important;}
.view-body .contents img,
.view-body .contents a {width:auto!important;}
/*.view-body .contents a{border:1px solid red;}*/
.view-body .contents table {width:100%!important;}

.share-btn {
    padding-top: 40px;
    text-align: center;
}


/* sns-share */
.btn-float {margin:0 3px;width: 32px;height: 32px;line-height: 30px;color: #17171d;border: 1px solid #dcdce1;background-size: 160%;background-repeat: no-repeat;background-position: center;transition: 0.3s;border-radius: 50%;cursor: pointer;text-align: center;position: relative;font-size: 14px;display: inline-block}
.btn-float:hover {text-decoration: none}
.btn-float:active, .btn-float:focus {outline: none;}
.btn-list a {display:block}

.board-detail .view-top .cont .inf p {color:#a5a5b4}
.board-detail .view-top .cont .inf .writer a {color:#a5a5b4;font-weight:400}
.board-detail .view-top .cont .inf .date {padding-left:0}


/* 지갑 페이지 */
#wallet-left-section {width:420px}
#wallet-nav li {font-size:16px;font-weight:600;opacity:1;padding:10px 0;margin-right:20px;margin-bottom:-1px;border-bottom:2px solid rgba(255, 255, 255, 0)}
#wallet-nav li.on {color: #304cff;border-color: #6464f6;}
#wallet-nav li button {color:inherit;font-weight:inherit}
#wallet-section {width:860px;min-height:1000px}
#wallet #search-box {margin-top:0;width:290px;height:auto}
html:lang(en) #wallet #search-box {width:270px}
#wallet #search-box input {padding:13px 30px 13px 6px;background: #fff}
#wallet #search-box .search-btn {top:10px;right:8px;}
#wallet #coin-check {padding:12px}
#wallet #coin-list {max-height:900px}
.wallet-token-type-line {width:1px;height:8px;background:#e5e6ee;margin:0 4px}

#invest-box .my-invest-box .total-value p:after {content:'|';color:#a5a5b4;padding:0 10px}
#invest-box .my-invest-box .total-value p:last-child:after {content:'';padding:0}

#wallet .trans-list table td {padding:15px 0;vertical-align:middle;}
#wallet .trans-list table thead td {padding:8px 0}
#wallet .trans-list table tbody td {border-bottom:1px solid #eaeaed}
#wallet .trans-list table td:last-child {text-align:right}

#in-out-box .tab-menu {border-bottom:2px solid #fff}
#in-out-box .tab-menu.on {border-bottom-color:#17171d}
.inout-input-box input {padding:7px 60px 7px 10px;line-height:1}
.inout-input-box .qr-btn {width:34px;height:34px;right:59px}
.inout-input-box .copy-btn {width:60px;height:34px}
#in-out-box .coin-warn-desc p {line-height:1.8}

#in-out-box .phone-auth-box .intl-tel-input {width:100%}
#deposit-apply-btn {background:#304cff}
#deposit-apply-btn:disabled {background:#dcdce1;cursor:default}


/* 출금 보안 단계 화면 */
#security {width:510px;margin:40px auto}
#security h3 {font-size:20px;font-weight:600}
#security ul {margin:10px 0}
#security ul li {float:left;text-align:center;color:#dcdce1;width:94px;height:94px;margin:15px 4px 0;padding:17px 0 15px;border-radius:4px;border:1px solid #dcdce1;}
#security ul li.on {background:#304cff;border-color:#304cff;color:#fff}
#security ul li i.on-on {display:none}
#security ul li.on i.on-off {display:none}
#security ul li.on i.on-on {display:block}
#security ul li i {font-size:24px;padding-bottom:4px}
#security ul li p {margin-bottom:0}
#security ul li p.step-nr {font-size:10px}
#security ul li p.type {font-size:12px}
#security ul li.on p.type {font-weight:600}
#security ul li.withdraw-point {position:relative;}
#security ul li.withdraw-point .label {position:absolute;top:-11px;left:50%;margin-left:-25px;padding:0;width:50px;height:22px;line-height:20px;color:#fff;font-size:12px;font-weight:600;text-align:center;background:#ff2e4a;}
#security .info {margin-top:30px;}
#security .info p {margin-bottom:0;line-height:1.7}
#security .info p.red {color:#ff2e4a}
#security .security-btn {display:block;margin:50px auto;max-width:100%;width:307px;height:54px;line-height:52px;font-size:18px;text-align:center;color:#fff;background:#304cff;border-radius:4px;border:1px solid #304cff;}
.trade .token-control #withdraw .security a.security-btn:hover {background:#4f40e2}

/* 수수료 정책 */
.fee-table table th {background-color:#f4f4f7}
.fee-table table th,
.fee-table table td {text-align:right;padding:13px 20px; border-top:1px solid #eaeaed;border-bottom:1px solid #eaeaed}
.fee-table table th:first-child,
.fee-table table td:first-child {text-align: left}


.new-container {width:1310px;padding:0 15px;margin:0 auto;}


/* 마이페이지 */
.border{border:1px solid red;}
.mypage-top {width:100%;background:#17171d;color:#fff}
.mypage-top p {letter-spacing:-1.5px;padding:122px 0 30px;font-size:36px;font-weight:300}
.mypage-top p span {letter-spacing:0;font-size:16px;margin-left:10px}
.mypage .badge {float:right;display:inline-block;font-size:14px;margin:3px 0 0 10px;text-align:center;padding:0 8px;height:24px;line-height:22px;color:#fff;border-radius:20px;background:#304cff}
.mypage .no-mytokens .badge {background: #e9e9ec}
.mypage .security-step {margin-top:100px;padding:0 0 100px}
.mypage .security-step h4 {font-size:20px;font-weight:600}
.mypage .security-step h4.inline {font-size:20px;font-weight:600;display:inline-block}
.mypage .security-step .mem-info-modi {margin-top:50px}
.mypage .security-step .row {margin-left:-15px;margin-right:-15px}
.mypage .security-step .certi-box {float:left;width:33.3%;padding-left:15px;padding-right:15px}
.mypage .security-step .security-box {width:100%;height:318px;margin:15px 0;padding:50px 10px;color:#474747;text-align:center;border:1px solid #f4f4f7;border-radius:4px;background:#fff;transition:.2s}
.mypage .security-step .security-box:hover {box-shadow: 0 4px 10px 2px rgba(0, 0, 0, 0.1);}
.mypage .security-step .security-box i {font-size:48px}
.mypage .security-step .security-box h4 {margin-top:10px;font-size:18px;font-weight:600}
.mypage .security-step .security-box p {font-size:16px;letter-spacing:-.1px;}
.mypage .security-step .security-box p.top1 {margin-top:35px;margin-bottom:45px}
.mypage .security-step .security-box p.top2 {margin-top:25px;margin-bottom:35px;line-height:22.5px;letter-spacing:-.2px}
.mypage .security-step .security-box button {padding:0;width:90px;height:34px;line-height:32px;color:#fff;border-radius:17px;border:0;background:#304cff}
.mypage .security-step .security-box button:hover {background:#4f40e2}
.mypage .security-step .security-box button:disabled {background:#a5a5b4;cursor:default}
#auth_modal0 #login-form .form-box input#phone {width:100%;padding:10px 70px 10px 48px;border-bottom:1px solid #eaeaed;}
#auth_modal0 #login-form .form-box input#phone:focus {padding:10px 70px 9px 48px;border-bottom:2px solid #304cff}


/* 비밀번호 재설정 */
.pw-reset {margin: 0 auto;text-align:center;padding:60px 0;}
.pw-reset h3 {font-weight:300}
.pw-reset .desc {color:#494949;margin-bottom:20px;}
.pw-reset .form-box {max-width:294px;margin:0 auto;}
.pw-reset .form-box p {text-align: left}
.pw-reset .form-box .inp-box {margin-bottom:5px;position: relative;}
.pw-reset .form-box .inp-box .intl-tel-input {width:100%}
.pw-reset .form-box .inp-box input {width:100%;height:40px;box-sizing:border-box;border:1px solid #dfdfdf;border-radius:2px;font-size:13px;color:#494949;padding-left:10px;}
.pw-reset .form-box .inp-box input#resetUserphone {padding-left:55px}
.pw-reset .btn1 {display:inline-block;vertical-align:middle;height:44px;border-radius:2px;font-size:15px;color: #fff;background:#304cff;text-align:center;border:0;}
.pw-reset .form-box .msg {font-size:12px;color: #494949;padding-bottom:8px;margin-top:-3px;}
.pw-reset .form-box .msg span {color:#304cff}
.pw-reset .form-box .pw {text-align:right;padding:0 0 27px;font-size:12px;color: #304cff;text-decoration: underline;letter-spacing:-.5px;}
.pw-reset .form-box .pw a {color:#304cff;}
.pw-reset .form-box .pw-2 {text-align:center;margin-top:25px;}
.pw-reset .msg-alert {display:none;text-align:left;font-size:12px;color:#ff0048;padding-bottom:8px;margin-top:-3px;letter-spacing:-.4px;}
.pw-reset .msg-alert.on {display:block;}
.checked { position: absolute; right:-30px; top:50%; margin-top:-10px; width:19px; height: 19px; border: 1px solid #dfdfdf; border-radius:100%; text-align: center; line-height: 17px;}
.checked i { color: #dfdfdf; font-size:13px;}
.checked.active { background: #304cff; border-color:#304cff; }
.checked.active i { color: #fff; }


/* KYC인증 */
/* kyc opt 인증폼 */
.auth .comments span {font-size:18px;}
.auth .comments span.divi {padding:0 10px;}
.auth .auth-content {margin:80px 0}
.auth .auth-container .step-level {width:32%;max-width:400px;height:100%;display:block}
.auth .auth-container .step-card,
.auth .auth-container .auth-confirm{background:#fff;border:1px solid #dcdce1;border-radius:4px;}
.auth .auth-container .step-card {width:100%;padding:0 25px;margin-bottom:20px}
.auth .auth-container .auth-confirm {width:66%;max-width:870px}
.auth .auth-container .step-card .step-nr {padding:20px 0;font-size:18px;font-weight:600;border-bottom:1px solid #dcdce1}
.auth .auth-container .step-card .step-desc {padding:20px 0;}
.auth .auth-container .step-card .step-desc .desc {padding:0 15px 20px 0}
.auth .auth-container .step-card .step-desc .kyc-step-2 {padding:15px 0;border-top:1px solid #dcdce1;color:#808080}
.auth .auth-container .auth-confirm h4 {padding:25px 0 20px;margin:0 30px;font-size:20px;line-height:1.2;font-weight:600;border-bottom:1px solid #dcdce1}
.auth .auth-container .confirm-form {width:460px;max-width:100%;margin:50px auto}
.auth .auth-container .confirm-form p.tit {font-weight:600;}
.auth .auth-container .confirm-form .id-container {margin:50px 0;}
.auth .auth-container .confirm-form .id-box .id-box-box {position:relative;height:310px;margin:10px 0 20px;color: #ccccd1;border:1px solid #dcdce1;border-radius:8px;background:#fff}
.auth .auth-container .confirm-form .id-box .id-box-box-2 {height:180px;}
.auth .auth-container .confirm-form .id-box-ex {width:100%;float:left}
.auth .auth-container .confirm-form .id-box-ex p {position:absolute;top:-16px;left:50%;width:80px;margin-left:-40px;padding:5px 0;background:#fff;text-align:center}
.auth .auth-container .confirm-form .id-box-ex img {width:100%;padding:30px 18px 20px;}
.auth .auth-container .confirm-form .id-box #id-ex-view {width:48%;display:block;}
.auth .auth-container .confirm-form .id-box-up {background:none;width:48%;float:right;text-align:center;}
.auth .auth-container .confirm-form .id-box-up button.close-btn {position:absolute;right:5px;top:5px;font-size:20px;color:#304cff;background:none}
.auth .auth-container .confirm-form .id-box-up.attached {background-repeat:no-repeat;background-position:center;background-size:cover}
.auth .auth-container .confirm-form .id-box-up > div {position:absolute;top:33%;width:100%;text-align:center;cursor:pointer}
.auth .auth-container .confirm-form .id-box-box-2.id-box-up > div {top:25%;}
.auth .auth-container .confirm-form .id-box-up > div i {font-size:48px;}
.auth .auth-container .confirm-form .id-box-up.attached > div {display:none}
.auth .auth-container .confirm-form .id-box-up > button.close-btn {display:none}
.auth .auth-container .confirm-form .id-box-up.attached > button.close-btn {display:block}
.auth .auth-container .confirm-form .id-container p {line-height:1.7}
.auth .auth-send input {width:100%;border:0;border-bottom:1px solid #dcdce1;transition:.2s}
.auth .auth-send input:hover, .auth .auth-send input:focus {border-color:#304cff}
.auth .auth-send button {transition:all .2s;height:34px;line-height:32px;padding:0 10px;color:#17171d;border:1px solid #dcdce1;border-radius:17px;background:#fff}
.auth .auth-send button:hover {color:#304cff;border-color:#304cff;background:none}
.auth .otp-send input {width:100%;padding-top:15px;padding-bottom:15px}
.auth button.auth-send-btn {transition:all .2s;display:block;margin:45px auto 30px;width:100%;max-width:310px;height:60px;line-height:58px;border-radius:4px;background:#304cff;color:#fff;font-size:20px;text-align:center}
.auth button.auth-send-btn:hover {background: #4f40e2}
.auth .input-form form {position: relative}
.auth .input-form form input {padding-right:110px}
.auth .input-form form button.in-btn {position:absolute;top:5px;right:0}
.auth .input-form{margin-top:30px;}
.auth .phone-auth .intl-tel-input {width:100%}
.mypage.auth .auth-send input#phone {padding-left:0}
.mypage.auth .flag-container {display:none}
.auth .auth-container .confirm-form .qr-box {width:196px;height:196px;margin:30px auto 10px;padding:13px;border:1px solid #dcdce1}
.auth .auth-container .confirm-form .qr-box img {width:168px;height:168px;}
.auth .auth-container .step-card .step-desc p.step-1 {padding:10px 0;text-align:center;font-weight:600;}
.auth .auth-container .step-card .step-desc p.step-1 img {width:54px;margin-top:-3px;margin-right:10px}
.auth .auth-container .step-card .step-desc p.step-2 {padding:15px 0;font-size:12px;text-align:center;}
.auth .auth-container .step-card .step-desc p.step-2 i {padding-right:20px}
.auth .auth-container .step-card .step-desc p.step-3 {padding:10px 0;font-size:30px;font-weight:600;text-align:center}
.auth .phone-auth .sms-code{position:relative}
.auth .phone-auth .sms-code input {width:100%;padding-right:100px}
#auth_modal0 .sms-code p,
.auth .phone-auth .sms-code p {position:absolute;top:17px;right:0;font-size:12px;color:#ff2e4a;font-weight:400}
#auth_modal0 .sms-code p i,
.auth .phone-auth .sms-code p i {display:none;margin-top:-10px;margin-left:10px;font-size:30px;color:#62f488;vertical-align:middle;}
#auth_modal0 .sms-code.confirmed p span,
.auth .phone-auth .sms-code.confirmed p span {display:none}
#auth_modal0 .sms-code.confirmed p i,
.auth .phone-auth .sms-code.confirmed p i {display:inline-block;}
.auth p.warn {color:#ff2e4a}


#faq-search-box{width:576px;}
#faq-search-box input{border:1px solid #6409DB;padding:17px 20px 17px 52px;width:100%;}
#faq-search-box input::-webkit-input-placeholder{color: rgba(101, 105, 240, 0.4);font-weight:normal}
#faq-search-box input::-moz-placeholder{color: rgba(101, 105, 240, 0.4);font-weight:normal}
#faq-search-box input:-ms-input-placeholder{color: rgba(101, 105, 240, 0.4);font-weight:normal}
#faq-search-box input:-ms-input-placeholder{color: rgba(101, 105, 240, 0.4);font-weight:normal}
#faq-search-box i{top:16px;left:16px;color:#6409DB;font-size:23px;position:absolute}

/* autocomplete searchbar */
.autocomplete-suggestions {z-index:99!important;margin-top:-4px;border: 1px solid #000;border-top-color:#eaeaed; background: #fff;border-bottom-left-radius: 4px;border-bottom-right-radius: 4px;overflow:hidden}
.autocomplete-suggestion,.autocomplete-no-suggestion { padding: 15px; white-space: nowrap; overflow: hidden; cursor: pointer; }
.autocomplete-no-suggestion {font-size:15px;opacity:.3}
.autocomplete-selected { background-color:rgba(0,0,0,.03); }
.autocomplete-suggestions strong { font-weight: bold; color: #304cff; }
.autocomplete-group { padding: 2px 5px; }
.autocomplete-group strong { display: block; border-bottom: 1px solid #000; }


/*19년 7월 faq*/
.faq_wrap {margin-bottom:130px}
.faq_list {display:flex;flex-wrap:wrap;}
.faq_list > li{padding-bottom:32px;flex:none;width:33.333%;padding-right:20px;margin-top:32px;border-bottom:1px solid #eaeaea}
.faq_list > li:nth-child(n+7) {border-bottom:0}
.faq_list h3{font-size:25px;color:#6409DB;font-weight:bold;margin-bottom:26px;}
.faq_list ul li {margin-top:12px;}
.faq_list a{font-size:14px;color: rgba(0, 0, 0, 0.6);letter-spacing:-0.32px;transition:.3s;}
.faq_list a:hover{color:#000;}


/* 21년 1월 otp 초기화 */
#otp-init:hover {text-decoration: underline;}

/* 21년 2월 phone change */
#sms-auth-form {
    margin:15px auto;
    padding:20px 30px;
    width:100%;
    border:1px solid #eaeaed;
    border-radius: 8px;
}

#sms-auth-form .flag-container {
    display: block;
}

#sms-auth-form #sms_certifi {
    background: #304cff;
}

#sms-auth-form .input-form {
    width:70%;
    margin:15px auto 0;
}

#sms-auth-form .input-form input {
    padding-top:12px;
    padding-bottom:12px;
    margin:0 auto;
}

#sms-auth-form #phone {
    padding-left:60px;
}

#sms-auth-form  .confirm-counter {
    bottom: -15px;
}



/* 마이페이지 회원탈퇴 스텝 박스 */

.auth .steps {
    list-style-type: none;
    margin: 0;
    padding: 0;
    background-color: #fff;
    text-align: center;
}

.auth .steps li {
    display: inline-block;
    margin: 10px;
    color: #ccc;
    padding: 8px 8px 12px 8px;
    border-radius: 4px;
}

.auth .steps li.is-active {
    background-color: #007bff;
    color: #fff;
}

#dropout-form .section {
    display: none;
    padding-bottom:60px;
}

#dropout-form .section .content {
    padding:20px;
    background-color:#fcfcfc;
}

#dropout-form .section.is-active {
    display: block;
}

#dropout-form .section .button {
    position:absolute;
    right:-150px;
    bottom:-20px;
    width:100px;

}

#dropout-form .section #wallet-link {
    background-color:#ff2e4a;
    border:none;
    padding:6px 8px;
}

#dropout-form .section .check-box {
    padding-left:23px;
}

#dropout-form .section .check-box .checkmark {
    border-color:#000;
}

#dropout-form .section .check-box .checkmark:after {
    border-color:#ff2e4a;
    border-width:0 3px 3px 0;
}

#step-wallet-table {
    width:100%;
}

#step-wallet-table td {
    border:1px solid #eaeaed;
    padding: 10px;
}

#dropout-form .input-form form button.in-btn {
    top:9px;
}

#dropout-form .section .phone-auth .sms-code p {
    right:90px;
}

#dropout-form .section .phone-auth #auth_sms {
    position:absolute;
    top:9px;
    right:0;
}

#dropout-form .section #smscode:disabled {
    background-color:transparent;
    opacity: .3;
}
#dropout-form .section #smscode:disabled ~ p span {
    opacity: .3;
}


/* 2021년 4월 */
.alarm-table td {padding:5px; vertical-align: top}


/* 2021년 11월 */
/* 마이페이지 강화된 고객확인 본인인증 추가 */

#self-auth input::placeholder {
    color:#ccc;
}

/*#self-auth [disabled] {*/
/*    color:#aaa;*/
/*}*/

#self-auth .title-section .btn {
    width:120px;
    border-color:#757A87;
}
#self-auth .content-section {
    margin:20px 0 60px;
    padding:30px;
    border:1px solid #E5E5E5;
    border-radius: 6px;
}

#self-auth .user-info-box {
    margin:15px 0;
    padding:20px;
    border-radius: 4px;
}

#self-auth .user-info-box ul li {
    display: flex;
    flex-wrap: wrap;
    /*align-items: center;*/
    width:50%;
    padding: 20px;
}
#self-auth .user-info-box ul li .tit {
    width:35%;
    color:#A5A5B4;
}

#self-auth .content-container {
    padding:70px;
}

#self-auth #login-form {
    /*margin:70px auto;*/
    width:100%;
}

#self-auth #login-form .form-box {
    width: 460px;
}

#self-auth #login-form .form-box input:disabled {
    background-color: #fff;
}

#self-auth #login-form .form-box input {
    padding:15px 0;
}

#self-auth #login-form .user-info-box {
    padding: 30px 45px
}

#self-auth #login-form .form-box .address input {
    padding-right:80px;
}


/* 2021년 12월 */
#id-card-auth ol li {
    line-height: 1.8;
    font-size:14px;
}

.disabled-box {
    position:absolute;
    width:100%;
    height:100%;
    left:0;
    top:0;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
}

.disabled-box > div {
    padding:48px;
    background-color: #fff;

}

/* 본인인증 OCR 추가 */
#ocr_res {
    padding:20px;
    background-color: #fcfcfc;
}

#ocr_res input,#ocr_res input:disabled {
    background-color: inherit!important;
}


/* 2022년 1월 금감원 요청에 의한 마이너 수정 */
#tb_wallet_list .network-box {
    padding:3px 5px;
    margin-left:5px;
    font-weight: 400;
    color:#858590;
    background-color: #EEF0F3;
    border-radius: 4px;
}


.ui-selectmenu-menu .ui-menu {max-height: 200px;}

.ui-selectmenu-button.ui-button {
    display: block;
    width:100%;
    padding:15px 0;
    border:none;
    border-bottom: 1px solid #eaeaed;
    border-radius: 0;
    background-color: #fff;
}

.ui-state-disabled {
  display:none;
}

.required-form .ui-selectmenu-button {
    display: inline-block;
    width:110px;
    margin-left:20px;
}

#privacy_term_modal, #privacy_term_modal2 {
    padding:35px 50px;
}

#privacy_term_modal .btn, #privacy_term_modal2 .btn {
    width: 190px;
    height: 68px;
    background: #6409DB;
    border-radius: 44px;
}


/* 2022년 2월 본인인증 업데이트 */
#part1_top_head {
    padding:40px 65px;
    background-color: #E4ECFF;
}

.radio-group .err-msg {
    position:absolute;
    left:10px;
    bottom:-20px;
    font-size:12px;
}


[type="radio"]:checked,
[type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid #ddd;
    border-radius: 100%;
    background: #fff;
}
[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: #6409DB;
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    /*-webkit-transition: all 0.2s ease;*/
    /*transition: all 0.2s ease;*/
}
[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}


.mypage-self-auth-btn {
    position:relative;
    width:460px;
    height:88px;
    background-color:#EEF0F3;
    border:1px solid #C8C8CC;
    border-radius: 8px;
    cursor: pointer;
}

.mypage-self-auth-btn.before {
    background-color:#EFF2FF;
    border:1px solid #1A7BEE;
}

.mypage-self-auth-btn.after {
    background-color:#FFEBEB;
    border:1px solid #FF3838;
}

.mypage-self-auth-btn > i {
    position: absolute;
    right:15px;
    top:50%;
    margin-top:-7px
}

/* 2022년 3월 트래블룰 대응 출금 UI 업데이트 */
#market_select + .ui-selectmenu-button.ui-button {
    margin-top:5px;
    padding:10px;
    border:1px solid #eaeaed;
}

#withdrawal_request_popup table {
    width:100%;
}

#withdrawal_request_popup table td {
    padding:8px 0;
    vertical-align: top;
    word-break: break-all;
    font-size:13px;
}

#withdrawal_request_popup table td:first-child {
    width: 45%;
    color:#6C6C79;
}


#market-select-disabled-box {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: rgba(255,255,255,.6);
}


/* 2022년 8월 개인지갑 등록 대응  */
#personal-wallet-section .trans-list {
    min-height:700px;
}

#personal-wallet-section .trans-list table tbody td {
    height:60px;
}

#personal-wallet-section .trans-list table tbody td.asset .symbox {
    display: flex;
    justify-content: center;
    align-items: center;
    width:24px;
    height:24px;
    /*background: #F3F3F3;*/
    border-radius:50%;
}

#personal-wallet-section .trans-list table tbody td.asset img {
    width:14px;
}

#personal-wallet-section .trans-list table tbody td:first-child {
    padding-left: 15px;
}

#personal-wallet-section .trans-list table tbody td:last-child {
    padding-right: 15px;
}

#personal-wallet-section .trans-list table tbody td.status button {
    display:flex;
    justify-content: center;
    align-items: center;
    margin:0 2px;
    width:28px;
    height:28px;
    border-radius:50%;
    /*background-color:#eaeaed;*/
}

#personal-wallet-section .trans-list table tbody td.status button:hover path {
    fill:#A4ABBB
}

#personal-wallet-section .trans-list table tbody td.status button.remove.on {
    background-color: #FFF5F5
}

#personal-wallet-section .trans-list table tbody td.status button.remove.on path {
    fill: #FF3838
}

#personal-wallet-section .trans-list table tbody td.status button.modi.on {
    background-color: #F2F8FF
}

#personal-wallet-section .trans-list table tbody td.status button.modi.on path {
    fill: #007AFF
}

#personal-wallet-section .trans-list table tbody td.status .status-box {
    width:58px;
    height:24px;
    text-align: center;
    line-height:24px;
    border-radius: 6px;
    font-size:12px;
    font-weight:700;
}

#personal-wallet-section .trans-list table tbody td.status .status-box.ing {
    border:1px solid #FD8D09;
    background-color:#FFF5E9;
    color:#FD8D09;
    margin:0 auto;
}

#personal-wallet-section .trans-list table tbody td.status .status-box.return {
    border:1px solid #FF3838;
    background-color:#FFF2F2;
    color:#FF3838;
}

#personal-wallet-register-container {
    padding:30px 40px 50px
}

#personal-wallet-register-container .form-select + .ui-selectmenu-button.ui-button {
    margin-top:10px;
    padding:15px;
    border:1px solid #eaeaed;
}

#personal-wallet-register-container #personal_wallet_submit.disabled {
    opacity: .3;
}

#personal-wallet-section input:disabled {
    opacity: 0.35;
    background-color: #ccc!important;
}

#personal-wallet-section .ui-state-disabled {
    background-color: #ccc!important;
}

/*.personal_wallet_list_table {*/
/*    height:520px;*/
/*    overflow: scroll;*/
/*}*/

#personal-wallet-section .trans-list table td:nth-child(1) {width:15%;}
#personal-wallet-section .trans-list table td:nth-child(2) {width:20%;}
#personal-wallet-section .trans-list table td:nth-child(3) {width:22%;}
#personal-wallet-section .trans-list table td:nth-child(4) {width:35%;}
#personal-wallet-section .trans-list table td:nth-child(5) {width:8%;}


#wallet-radio input[type=radio]:disabled ~ label {
    opacity: 0.4;
}

.select2-container--disabled .select2-selection--single > span{
    opacity:.35
}


/* select 2 */
.select2-container {
    width:100%!important;
}

.select2-container--default .select2-selection--single {
    height:50px;
    padding:0 15px;
    border-color:#eaeaed;
    border-radius:0;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height:48px;
    padding:0;
    overflow: auto;
    text-overflow: inherit;
    white-space: normal;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    width:auto;
    height:auto;
    top:24px;
    right:24px;
}

.select2-dropdown {
    border-color:#eaeaed;
}
.select2-search--dropdown, .select2-results__option {
    padding:8px 15px;
}

.select2-results__option--disabled {
	display: none;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    position:relative;
    padding: 8px 12px 8px 42px;
    border:none;
    border-radius: 38px;
    background:#F9FAFB;
}


.select2-container--default .select2-search--dropdown {
    position:relative;
}
.select2-container--default .select2-search--dropdown::after {
    content:"";
    background-image: url("../img/search-icon.png");
    background-size:22px 22px;
    width:22px;
    height:22px;
    position:absolute;
    top:14px;
    left:26px;
}


.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background: #F9FAFB;
    color:#17171d
}

/*  ==========================================================================
   popups
   ========================================================================== */

.popup {width:100%;position: relative;background: #FFF;padding:10px 15px;margin: 0 auto;transition: 1s all}
.personal-addr-popup {
    padding:15px 35px 20px;
}
.pop-s {max-width:360px}
.pop-sm {max-width:476px}
.pop-m {max-width:560px}
.pop-l {max-width:640px}
.popup .pop-body {padding:20px 0 20px}
.popup .pop-bottom {padding:12px 0 24px}
.popup .pop-bottom p {line-height:1.6}

.popup .popup-table {
    width:100%;
}

.popup .popup-table th, .popup .popup-table td {
    padding: 15px;
    border:1px solid #eaeaed;
}

.popup #qrcode {width:90px;height:90px}
.main-img-pop,
.main-img-pop .pop-body {padding:0;background:none}
.main-img-pop .pop-bottom {padding:8px 0}
.main-img-pop .pop-bottom button {display: inline-block;padding-bottom:3px;border-bottom:1px solid #fff}

.mfp-fade.mfp-bg {opacity: 0;-webkit-transition: all 0.15s ease-out;-moz-transition: all 0.15s ease-out;transition: all 0.15s ease-out;}
.mfp-fade.mfp-bg.mfp-ready {opacity: 0.8;}
.mfp-fade.mfp-bg.mfp-removing {opacity: 0;}
.mfp-fade.mfp-wrap .mfp-content {opacity: 0;transition: all 0.4s ease-out;}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {opacity: 1;}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {opacity: 0;}


.main-img-pop {
    max-width: 760px;
    /*padding:30px;*/
    /*text-align:center;*/
    background-color:#FAFAFA;
}

.main-img-pop .pop-box {
    padding:30px 55px;
}

.main-img-pop .logo {
    width:35%;
    padding:5px;
}

.main-img-pop h3 {
    font-size:32px;
    padding:5px;
}

.main-img-pop h2 {
    font-size:40px;
    padding:5px;
}

.main-img-pop .isms-img {
    width:58%;
}

.main-img-pop h4 {
    font-size:20px;
    /*color:#FF8A00;*/
    font-weight: 300;
    padding:5px;
}

.main-img-pop .pop-header {
    display: flex;
    text-align: left;
    padding:40px 50px;
    background-color: #E4ECFF;
    align-items: center;
}

.main-img-pop .pop-header img {
    padding-left:40px;
}

.main-img-pop .pop-contents {
    white-space: pre-line;
    line-height: 1.4;
}

.main-img-pop .info {
    display: inline-block;
    margin:0 auto;
    font-size:14px;
    color:#4d4d4d;
    padding:5px;
    text-align: left;
    line-height: 1.4;
}

.main-img-pop .button {
    display: flex;
    justify-content: center;
    align-items: center;
    margin:0 auto;
    width:236px;
    height:68px;
    background-color:#6409DB;
    color:#fff;
}

.main-img-pop .mfp-close {
    font-size:38px;
    color:#333;
    font-weight: 200;
}


/* ====== Zoom effect ====== */

.mfp-zoom-in {
    /* start state */
    /* animate in */
    /* animate out */
}
.mfp-zoom-in .mfp-with-anim {
    opacity: 0;
    transition: all 0.2s ease-in-out;
    transform: scale(0.8);
}
.mfp-zoom-in.mfp-bg {
    opacity: 0;
    transition: all 0.3s ease-out;
}
.mfp-zoom-in.mfp-ready .mfp-with-anim {
    opacity: 1;
    transform: scale(1);
}
.mfp-zoom-in.mfp-ready.mfp-bg {
    opacity: 0.8;
}
.mfp-zoom-in.mfp-removing .mfp-with-anim {
    transform: scale(0.8);
    opacity: 0;
}
.mfp-zoom-in.mfp-removing.mfp-bg {
    opacity: 0;
}
.mfp-close-btn-in .mfp-close {color:#dcdce1;opacity:.85}

#bootpay-payment-iframe{
  max-width: 400px!important;
}




/* ==========================================================================
   Media Query
   ========================================================================== */

@media print,
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 1.25dppx),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   로케일 레이아웃
   ========================================================================== */
html:lang(en) body {font-size:13px;letter-spacing:-.6px}
html:lang(en) h1 {font-size:38px;line-height:1.2}
html:lang(en) h2 {font-size:34px;line-height:1.3}
html:lang(en) h3 {font-size:24px;line-height:1.3}
html:lang(en) .f12 {font-size:11px!important;}
html:lang(en) .f13 {font-size:12px!important;}
html:lang(en) .f14 {font-size:13px!important;}
html:lang(en) .f16 {font-size:15px!important;}
html:lang(en) .f17 {font-size:16px!important;}
html:lang(en) .f18 {font-size:17px!important;}
html:lang(en) .f20 {font-size:18px!important;letter-spacing:-.8px}
html:lang(en) .f22 {font-size:20px!important;letter-spacing:-1px}
html:lang(en) .f24 {font-size:22px!important;letter-spacing:-1px}
html:lang(en) .f28 {font-size:24px!important;letter-spacing:-1px}
html:lang(en) .f30 {font-size:28px!important;letter-spacing:-1px}
html:lang(en) .f32 {font-size:30px!important;letter-spacing:-1px}
html:lang(en) .f40 {font-size:38px!important;letter-spacing:-1px}
html:lang(en) .f48 {font-size:42px!important;letter-spacing:-1px}
html:lang(en) .f50 {font-size:44px!important;letter-spacing:-1.6px;line-height:1.3}

/*.grecaptcha-badge {bottom: 65px !important;}*/
.grecaptcha-badge { visibility: hidden; }

.graybox {
    /* Frame 5769 */
    box-sizing: border-box;

    /* Auto layout */

    display: inline-flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 10px 0px;
    gap: 10px;

    width: 40px;
    height: 23px;

    background: #F5F5F5;
    /* 타이포 전용 컬러/typo_01 */

    border: 1px solid #BCBCC2;
    border-radius: 6px;

    /* Inside auto layout */

    flex: none;
    order: 0;
    flex-grow: 0;
    margin-left: 8px;
}