:root {
    --color: #ffffff;
    --color-primary: #ffe133;
    --text-gray1: #A5A5A5;
    --text-gray2: #CCCCCC;
    --text-gray3: #666666;
    --card-color1: #2F2F2F;
    --card-color2: #444;
    --card-color3: #EEEEEE;
    --card-color4: #535353;
    --bg: #1A1A1A;
    --border-color1: #3c3c3c;
    --border-color2: #2F2F2F;
    --border-color3: #444444;
    --link-color: #4096FF;
    --danger-color: #F21A43;
}
body {
    font-family: 'SFProText', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, 'Helvetica Neue', Arial, sans-serif;
    background-color: var(--bg);
    color: var(--color);
    transition: background-color .3s;
}
.mask-01{
    background-color: rgba(0,0,0,0.6);
}
.card-bg{
    background-color:var(--card-color1)
}
.disabled-btn{
    background-color: var(--card-color2);
    color: var(--text-gray1);
}
.text-color{
    color: var(--color);
}
.bg-base{
    background-color: var(--bg);
}
.text-gdd{
    color: var(--text-gray1);
}
.bg-primary{
    background-color: var(--color-primary);
}
.border-base{
    border-color: var(--color);
}
.border-shallow{
    border-color: var(--border-color);
}
.arrow-sm{
    width: 8px;
    height: 12px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgNiA5IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogICAgPHBhdGggZD0iTS42NTEgMWEuMzYuMzYgMCAwIDEgLjIyNS4wNzVsNC4wMyAzLjI0NGMuMTI1LjEuMTI1LjI2MiAwIC4zNjJMLjg3NyA3LjkyNWMtLjEyNC4xLS4zMjUuMS0uNDUgMC0uMTI0LS4xLS4xMjQtLjI2MyAwLS4zNjNMNC4yMzIgNC41LjQyNiAxLjQzN2MtLjEyNC0uMS0uMTI0LS4yNjIgMC0uMzYyQS4zNi4zNiAwIDAgMSAuNjUxIDF6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iIHN0cm9rZT0iI0ZGRiIgc3Ryb2tlLXdpZHRoPSIuNjkzIi8+Cjwvc3ZnPgo=);
    background-repeat: no-repeat;
    background-size: cover;
}
.arrow-base{
    height: 16px;
    width: 16px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAVUExURUdwTKanraanraioqKamraeoraanrUCKYgsAAAAGdFJOUwB1pwJGYRA6JLEAAAA9SURBVCjPY2DAApiFAlAFWNIS0QXSBFBF1NCVGKErYR7sSgzwCmBoQTd0MCjAiAaMiMKISgb0yGY2RvI3ABK0HKbXkcNCAAAAAElFTkSuQmCC");
    background-repeat: no-repeat;
    background-size: cover;
}
.arrow-lg{
    width: 10px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='16' viewBox='0 0 10 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.545 1c.139 0 .28.05.386.15l6.91 6.488c.212.2.212.525 0 .725L1.93 14.85a.57.57 0 0 1-.771 0 .491.491 0 0 1 0-.725L7.684 8 1.16 1.875a.491.491 0 0 1 0-.725c.106-.1.246-.15.385-.15z' fill='%23FFF' fill-rule='nonzero' stroke='%23FFF'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-size: cover;
}
.setting-icon{
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOCAyOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGNpcmNsZSBjeD0iMTIuOTIzIiBjeT0iMTIuOTIzIiByPSIxMi45MjMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiIGZpbGw9IiMzNzQwNTUiLz4KICAgICAgICA8ZyBmaWxsPSIjRkZGIiBzdHJva2U9IiNGRkYiIHN0cm9rZS13aWR0aD0iLjYiPgogICAgICAgICAgICA8cGF0aCBkPSJNMTEuOTQgMjAuNzgzSDkuODE0Yy0xIDAtMS44MTMtLjg3Ny0xLjgxMy0xLjk1NVY5Ljk1NUM4IDguODc3IDguODEzIDggOS44MTMgOGg4LjA2NGMxIDAgMS44MTQuODc4IDEuODE0IDEuOTU1djIuNDQ5YzAgLjI2Mi0uMjEuNDc1LS40NjguNDc1YS40NzIuNDcyIDAgMCAxLS40NjgtLjQ3NVY5Ljk1NWMwLS41NTQtLjM5NC0xLjAwNS0uODc4LTEuMDA1SDkuODEzYy0uNDg0IDAtLjg3Ny40NTEtLjg3NyAxLjAwNXY4Ljg3M2MwIC41NTQuMzk0IDEuMDA1Ljg3NyAxLjAwNWgyLjEyOGMuMjU4IDAgLjQ2OC4yMTMuNDY4LjQ3NXMtLjIxLjQ3NS0uNDY4LjQ3NXpNMTQuNjg3IDIwLjc4M2EuNDYuNDYgMCAwIDEtLjMyLS4xMjcuNDguNDggMCAwIDEtLjAyMi0uNjcybDQuNjQ1LTUuMDVhLjQ2My40NjMgMCAwIDEgLjY2Mi0uMDI0LjQ4LjQ4IDAgMCAxIC4wMjIuNjcybC00LjY0NSA1LjA1YS40NjcuNDY3IDAgMCAxLS4zNDIuMTUxeiIvPgogICAgICAgICAgICA8cGF0aCBkPSJNMTYuMzg1IDExLjkxaC01LjcxM2EuNDQyLjQ0MiAwIDAgMS0uNDM4LS40NDVjMC0uMjQ2LjE5Ny0uNDQ1LjQzOC0uNDQ1aDUuNzEzYy4yNDEgMCAuNDM4LjIuNDM4LjQ0NWEuNDQyLjQ0MiAwIDAgMS0uNDM4LjQ0NXptLS44NzQgMi44MTJoLTQuODM5YS40NDIuNDQyIDAgMCAxLS40MzgtLjQ0NWMwLS4yNDYuMTk3LS40NDUuNDM4LS40NDVoNC44MzljLjI0MiAwIC40MzguMi40MzguNDQ1YS40NDIuNDQyIDAgMCAxLS40MzguNDQ1em0tMS43NjUgMi41ODVoLTMuMDc0YS40NDIuNDQyIDAgMCAxLS40MzgtLjQ0NWMwLS4yNDUuMTk3LS40NDUuNDM4LS40NDVoMy4wNzVjLjI0MiAwIC40MzguMi40MzguNDQ1YS40NDIuNDQyIDAgMCAxLS40MzkuNDQ1eiIvPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==);
    background-repeat: no-repeat;
    background-size: contain;
}
.cards-icon{
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjYiIHZpZXdCb3g9IjAgMCAyNiAyNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGNpcmNsZSBmaWxsPSIjMzc0MDU1IiBjeD0iMTMiIGN5PSIxMyIgcj0iMTIiLz4KICAgICAgICA8cGF0aCBkPSJNMTguNDE2IDE4LjVINy41ODRDNi43MSAxOC41IDYgMTcuNzkgNiAxNi45MTdWOS4wODNDNiA4LjIxIDYuNzEgNy41IDcuNTgzIDcuNWgxMC44MzNDMTkuMjkgNy41IDIwIDguMjEgMjAgOS4wODN2Ny44MzRjMCAuODczLS43MSAxLjU4My0xLjU4NCAxLjU4M3pNNy41ODQgOC41QS41ODQuNTg0IDAgMCAwIDcgOS4wODN2Ny44MzRjMCAuMzIyLjI2MS41ODMuNTgzLjU4M2gxMC44MzNhLjU4NC41ODQgMCAwIDAgLjU4NC0uNTgzVjkuMDgzYS41ODQuNTg0IDAgMCAwLS41ODQtLjU4M0g3LjU4NHptOS45MTYgM2gtOWEuNS41IDAgMCAxIDAtMWg5YS41LjUgMCAxIDEgMCAxem0tNy41IDVIOC41YS41LjUgMCAxIDEgMC0xSDEwYS41LjUgMCAxIDEgMCAxeiIgc3Ryb2tlPSIjRkZGIiBzdHJva2Utd2lkdGg9Ii41IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz4KICAgIDwvZz4KPC9zdmc+Cg==);
    background-repeat: no-repeat;
    background-size: contain;
}
.transactions-icon{
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48Y2lyY2xlIGZpbGw9IiMzNzQwNTUiIGN4PSIxMyIgY3k9IjEzIiByPSIxMiIvPjxwYXRoIGQ9Ik0xOS4wNyAxMS42ODVINi42NWMtLjM2IDAtLjY1LS4yNzctLjY1LS42MiAwLS4zNDEuMjktLjYxOC42NS0uNjE4aDExLjQ0N2wtMS43MTItMS4zNTFhLjYwNC42MDQgMCAwIDEtLjIyNi0uNTguNjI3LjYyNyAwIDAgMSAuNDE0LS40NzcuNjc1LjY3NSAwIDAgMSAuNjQuMTAzbDIuNDM4IDEuOTI2Yy4zMS4yNDQuNDI3LjY1Ny4yODcgMS4wMjRhLjkxNS45MTUgMCAwIDEtLjg2OS41OTN6TTkuMTk3IDE4YS42NjYuNjY2IDAgMCAxLS40MTQtLjE0MmwtMi40MzgtMS45MjZhLjg5NS44OTUgMCAwIDEtLjI4Ny0xLjAyNC45MTguOTE4IDAgMCAxIC44Ny0uNTkzSDE5LjM1Yy4zNiAwIC42NS4yNzcuNjUuNjE5IDAgLjM0Mi0uMjkuNjE5LS42NS42MTlINy45MDJsMS43MTEgMS4zNTFhLjYuNiAwIDAgMSAuMTk3LjY4OC42NDkuNjQ5IDAgMCAxLS42MTIuNDA4eiIgc3Ryb2tlPSIjRkZGIiBzdHJva2Utd2lkdGg9Ii41IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48L2c+PC9zdmc+);
    background-repeat: no-repeat;
    background-size: contain;
}
.faqs-icon{
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48Y2lyY2xlIGZpbGw9IiMzNzQwNTUiIGN4PSIxMyIgY3k9IjEzIiByPSIxMiIvPjx0ZXh0IGZvbnQtZmFtaWx5PSJBcmlhbFJvdW5kZWRNVEJvbGQsIEFyaWFsIFJvdW5kZWQgTVQgQm9sZCIgZm9udC1zaXplPSIxNyIgZmlsbD0iI0ZGRiI+PHRzcGFuIHg9IjgiIHk9IjE5Ij4/PC90c3Bhbj48L3RleHQ+PC9nPjwvc3ZnPg==);
    background-repeat: no-repeat;
    background-size: contain;
}
.remove-icon{
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAMAAADW3miqAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABFUExURUdwTFJSUlJSUlNTU1BQUFNTU1NTU1NTU1NTU1JSUlpaWlNTU1NTU93d6I6Ok9jY49fX4ZWVmp+fpYGBhFZWVnV1d7e3v5njhUcAAAAMdFJOUwA7otkQkPO8wlcR1r1PeowAAAEBSURBVDjLjZTbloMwCEWjtkYs5Gbb///U6jSTQExdnCeXbrmDMUwrjMs0z9Mywmr6AotMFjrIsGCjZWiZO3Z0F8jNYlf2xpgH/tCjUhZ/yl7G08Q14KW+Oebcn2nj317pmSvxV8P81lFwlXFEMT8Ci3rz5AvlQoX22NfycwrFlvPc7Fq8HdS/rd1OiPU9mBFPVMPgaERf4+FmZ3wUnTYTNhS1DE5mlqWLRDWvrFkHndztFTq56wTuT4HzEsRvOQ8qiRKAYHIxJQWsLU62JbG21AYT69dha2PDCTV5PiqBEhuVMnTvF09pE0OnG1/VIuhWSrecqjXXHQzl6dEdsatz+AEd9jE/bnmaSgAAAABJRU5ErkJggg==");
    background-repeat: no-repeat;
    background-size: contain;
}
.info-icon{
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAAJ1BMVEUAAACZmZmampqZmZmZmZmWlpaZmZmampqZmZmampqVlZWampqZmZliDqBAAAAADHRSTlMALEDe8xeWgMvAD6tuU/VwAAAA60lEQVQoz2MAA6ZME+dpCgxwEOZzBgiOpML47D4niqQWqvccKYDwWXtOC4Boxj0nAsACwoehuplsDMEKbGbB9EYeBinhOIkwfU4DkKixQggEHwfq8FEAGwTWznQkgIHtNFiu5hiY2pPAwHIQzFI5BKZkHBh0GiCOgTiB4xBDDth5cEcfY5gDcRWjAMRtJxlsIKyYoxDxwww+CyCmQczmOoIhANQCFYBqARoKFYAZmlMAFYBaC3OYzkGow2BOl4FSDmDPIQT2JIC8DxGAeh8WQGwJIHLxcYwgRA3klYcD0KMBI6IwoxIzsjGSAwBF9k+xNn7RCQAAAABJRU5ErkJggg==");
    background-repeat: no-repeat;
    background-size: contain;
}
.tax-icon{
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOCAyOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGNpcmNsZSBjeD0iMTIuOTIzIiBjeT0iMTIuOTIzIiByPSIxMi45MjMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiIGZpbGw9IiMzNzQwNTUiLz4KICAgICAgICA8ZyBmaWxsPSIjRkZGIiBzdHJva2U9IiNGRkYiIHN0cm9rZS13aWR0aD0iLjYiPgogICAgICAgICAgICA8cGF0aCBkPSJNMTEuOTQgMjAuNzgzSDkuODE0Yy0xIDAtMS44MTMtLjg3Ny0xLjgxMy0xLjk1NVY5Ljk1NUM4IDguODc3IDguODEzIDggOS44MTMgOGg4LjA2NGMxIDAgMS44MTQuODc4IDEuODE0IDEuOTU1djIuNDQ5YzAgLjI2Mi0uMjEuNDc1LS40NjguNDc1YS40NzIuNDcyIDAgMCAxLS40NjgtLjQ3NVY5Ljk1NWMwLS41NTQtLjM5NC0xLjAwNS0uODc4LTEuMDA1SDkuODEzYy0uNDg0IDAtLjg3Ny40NTEtLjg3NyAxLjAwNXY4Ljg3M2MwIC41NTQuMzk0IDEuMDA1Ljg3NyAxLjAwNWgyLjEyOGMuMjU4IDAgLjQ2OC4yMTMuNDY4LjQ3NXMtLjIxLjQ3NS0uNDY4LjQ3NXpNMTQuNjg3IDIwLjc4M2EuNDYuNDYgMCAwIDEtLjMyLS4xMjcuNDguNDggMCAwIDEtLjAyMi0uNjcybDQuNjQ1LTUuMDVhLjQ2My40NjMgMCAwIDEgLjY2Mi0uMDI0LjQ4LjQ4IDAgMCAxIC4wMjIuNjcybC00LjY0NSA1LjA1YS40NjcuNDY3IDAgMCAxLS4zNDIuMTUxeiIvPgogICAgICAgICAgICA8cGF0aCBkPSJNMTYuMzg1IDExLjkxaC01LjcxM2EuNDQyLjQ0MiAwIDAgMS0uNDM4LS40NDVjMC0uMjQ2LjE5Ny0uNDQ1LjQzOC0uNDQ1aDUuNzEzYy4yNDEgMCAuNDM4LjIuNDM4LjQ0NWEuNDQyLjQ0MiAwIDAgMS0uNDM4LjQ0NXptLS44NzQgMi44MTJoLTQuODM5YS40NDIuNDQyIDAgMCAxLS40MzgtLjQ0NWMwLS4yNDYuMTk3LS40NDUuNDM4LS40NDVoNC44MzljLjI0MiAwIC40MzguMi40MzguNDQ1YS40NDIuNDQyIDAgMCAxLS40MzguNDQ1em0tMS43NjUgMi41ODVoLTMuMDc0YS40NDIuNDQyIDAgMCAxLS40MzgtLjQ0NWMwLS4yNDUuMTk3LS40NDUuNDM4LS40NDVoMy4wNzVjLjI0MiAwIC40MzguMi40MzguNDQ1YS40NDIuNDQyIDAgMCAxLS40MzkuNDQ1eiIvPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==);
    background-repeat: no-repeat;
    background-size: contain;
}
.rank-first-bg {
    background:url('/imgs/ranking/dark/1@2x.png') no-repeat;
    background-size:100% 100%;
}
.rank-second-bg {
    background:url('/imgs/ranking/dark/2@2x.png') no-repeat;
    background-size:100% 100%;
}
.rank-third-bg {
    background:url('/imgs/ranking/dark/3@2x.png') no-repeat;
    background-size:100% 100%;
}

input::-webkit-input-placeholder{
    color: var(--text-gray1) !important;
}
textarea::-webkit-input-placeholder{
    color: var(--text-gray1) !important;
}
.placeholder{
    color: var(--text-gray1) !important;
}