@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@2.0/nanumsquare.css);

* {margin: 0; padding: 0;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td, tr {margin: 0; padding: 0;}
img {border: 0; vertical-align: middle;}
ol, ul, li {list-style: none;}
h1, h2, h3, h4, h5, h6 {font-size: 100%;}
body {font-size: 16px; font-family: "돋움", 'Dotum', 'Helvetica Neue BD', 'Malgun Gothic', 'Apple SD Gothic Neo', 'NanumSquare', sans-serif;}
fieldset {border: medium none;}
a {text-decoration: none; cursor: pointer;}
em {font-style: normal;}
html {height:100%; overflow-x: auto; overflow-y: auto;}
body {height:100%;}
button {border:none; cursor: pointer;}
button:hover,
button:active {transition: all 0s;}
input:focus,
select:focus,
textarea:focus {outline: none;}
table {border-collapse:collapse; border-spacing:0;}
.pointer {cursor:pointer;}
label { cursor: pointer;}

.font-red {color:#ff0000;}
.font-blue {color:#007eff;}

.wrap {
    display: flex;
    flex-direction: column;
    
    width:100%;
    min-width:1280px;
    height:100%;

    font-family:'NanumSquare', sans-serif;
}

.header {
    width:1280px;
    margin:0 auto;
}

.gnb-cs {
    display:flex;
    justify-content: flex-end;
    align-items: center;
    gap:0.75rem;

    height:3rem;
    font-size:0.75rem;
    color:#848484;
}

.gnb-cs a {
    color:#848484;
}

.gnb-cs a.gnb-cs-user {
    padding:3px 0 3px 1.5rem;
    background:url('/images/icon-set.svg') left 50% no-repeat;
}

.bar-menu {
    display:flex;
    justify-content: space-between;
    align-items: center;

    margin-bottom:1.875rem;
}

.logo {
    width:22rem;
    height:2.25rem;
    background:url('../images/logo.png') 50% 50% no-repeat;
}

.gnb {
    display:inline-flex;
    justify-content: center;
    align-items: center;
    gap:2rem;

    height:2.875rem;
}

.gnb a {
    padding:0.425rem 0;
    font-weight:700;
    color:#444;
}

.gnb a:hover,
.gnb a.current {
    color:#0e82f6;
    border-bottom:2px solid #0e82f6;
}

.contents {
    width:1280px;
    margin:0 auto;
}

.contents-top {
    display:flex;
    justify-content: space-between;

    margin-bottom:2.5rem;
}

.contenst-banner > div {
    position:relative;
    padding:4.25rem;
    width:calc(810px - 8.5rem);
    height:calc(518px - 8.5rem);
    color:#fff;
    background: linear-gradient(255deg, #5bbaff, #5984ff);
    border-radius:0.75rem;
    overflow:hidden;
}

.contenst-banner .banner-1 div:first-child {
    font-size:2rem;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
    text-shadow:4px 4px 0 #00000014;
    margin-bottom:1.25rem;
}

.contenst-banner .banner-1 div:nth-child(2) {
    font-family: 'NanumSquare', sans-serif;
    font-weight:700;;
    text-shadow:4px 4px 0 #00000014;   
}

.contenst-banner .banner-1 span {
    position:absolute;
    right:1.25rem;
    bottom:1rem;
    width:500px;
    height:430px;
    background:url('../images/img-main-banner.png') 50% 50% no-repeat;
}

.contents-quick-service {
    padding:15px;
    width:398px;
    height:486px;
    border:1px solid #e2e5eb;
    border-radius:0.75rem;
    overflow:hidden;
}

.contents-quick-tab {
    display:flex;
    border-bottom:1px solid #e2e5eb;    
    margin-bottom:2.5rem;
}

.contents-quick-tab > li > button {
    padding-top:2px;
    width:124px;
    height:2rem;
    color:#747474;
    font-family: 'NanumSquare', sans-serif;
    font-weight:700;
    font-size:1rem;
    background:none;
    border-bottom:2px solid #fff;
}

.contents-quick-tab > li:hover button,
.contents-quick-tab > li.current button {
    color:#333333;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
    border-bottom-color:#333333;
}

.contenst-quick-buy > div {
    display:flex;
    justify-content: space-around;
    align-items: center;

    position:relative;
    width:100%;
    height:3.375rem;
    border:1px solid #e2e5eb;
    border-radius:6px;
}

.contenst-quick-buy > div + div {
    margin-top:32px;
}

.contenst-quick-buy > div:first-child,
.contenst-quick-buy > div:nth-child(2) {
    padding-top:0.375rem;
    height:3rem;
}

.contenst-quick-buy > div > span:first-child {
    position:absolute;
    top:-0.5rem;
    left:0.75rem;

    padding:0 0.75rem;
    color:#666;
    background:#fff;
}

.contenst-quick-buy > div input[type="radio"] {
    width:1rem;
    height:1rem;
    margin-right:0.425rem;
    vertical-align:text-top;
}

.contenst-quick-buy > div input[type="text"] {
    padding:0 4rem 0 1rem;
    width:100%;
    height:100%;
    font-size:1.875rem;
    text-align:right;
    color:#333333;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
    background:transparent;
    border:none;
}

.contenst-quick-buy > div input[type="text"]::placeholder {
    color:#333;
}

.contenst-quick-buy > div:nth-child(3) > span:last-child,
.contenst-quick-buy > div:nth-child(4) > span:last-child {
    position:absolute;
    right:1rem;
    bottom:1rem;
    font-size:1.125rem;
    color:#999999;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
    letter-spacing:-0.5px;
}

.contenst-quick-buy > button {
    display:flex;
    justify-content:center;
    align-items:center;

    width:100%;
    height:66px;

    color:#fff;
    font-size:1.25rem;
    font-family: 'NanumSquare', sans-serif;
    font-weight:700;
    background:#0e82f6;
    border-radius:6px;
    margin-top:1.5rem;
}

.title-section {
    padding:0 0.75rem 0.75rem;
    line-height:100%;
    color:#111;
    font-family: 'NanumSquare', sans-serif;
    font-weight:700;
    font-size:1.25rem;
    letter-spacing:-0.5px;
    border-bottom:1px solid #e2e5eb;
}

.real-time-coin {
    margin-bottom:2.5rem;
}

.real-time-tabs {
    display:flex;
    gap:1.25rem;

    padding:1.25rem 1.25rem 0;
}

.real-time-tabs > div {
    display:inline-flex;
    flex-direction: column;
    justify-content: center;

    padding-right:1rem;
    width:295px;
    height:10.625rem;
    text-align:right;
    letter-spacing:-0.5px;
    border-radius:0.425rem;
}

.real-time-tabs > div p:first-child {
    font-size:2.125rem;
    font-family:'NanumSquare', sans-serif;
    font-weight:800;
    letter-spacing:-1.5px;
}

.real-time-tabs > div p:nth-child(2) {
    font-size:1.375rem;
    font-family:'NanumSquare', sans-serif;
    font-weight:700;
}

.real-time-tabs > div span:nth-child(3) {
    font-size:1.375rem;
    font-family:'NanumSquare', sans-serif;
    font-weight:700;
    margin-top:2rem;
}

.real-time-tabs > div span:last-child {
    font-size:0.75rem;
    font-family:'NanumSquare', sans-serif;
    font-weight:700;
}

.tab-btc {background:url('../images/bg-bitcoin.png') left bottom no-repeat #fff7dd;}
.tab-btc > span:nth-child(3) {color:#fc7f10;}
.tab-btc > span:last-child {color:#fe9d48;}
.tab-eth {background:url('../images/bg-ethereum.png') left bottom no-repeat #e7f2fd;}
.tab-eth > span:nth-child(3) {color:#687a8e;}
.tab-eth > span:last-child {color:#9bafc4;}
.tab-ada {background:url('../images/bg-eos.png') left bottom no-repeat #e2eafd;}
.tab-ada > span:nth-child(3) {color:#5273c1;}
.tab-ada > span:last-child {color:#9bafc4;}

.tab-eos {background:url('../images/bg-eos.png') left bottom no-repeat #e2eafd;}
.tab-eos > span:nth-child(3) {color:#5273c1;}
.tab-eos > span:last-child {color:#9bafc4;}

.tab-rlp {background:url('../images/bg-rippel.png') left bottom no-repeat #eceaf3;}
.tab-rlp > span:nth-child(3) {color:#727272;}
.tab-rlp > span:last-child {color:#9e9d9d;}

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

.cs-list > div {
    display:flex;
    flex-wrap:wrap;
    gap:1.25rem;

    padding:1.25rem 1.5rem;
    width:760px;
    text-align:right;
}

.cs-list > div > div {
    display:inline-flex;
    flex-direction: column;
    justify-content: center;

    padding:0 1rem;
    width:calc(50% - 2.625rem);
    height:120px;
    border-radius:0.75rem;
}

.cs-list > div > div > p {
    color:#444;
    font-size:1.125rem;
    font-family:'NanumSquare', sans-serif;
    font-weight:700;
    margin-bottom:0.75rem;
}

.cs-list > div > div > div {
    line-height:1.25rem;
    color:#777777;
    font-size:0.875rem;
    font-family:'NanumSquare', sans-serif;
}

.cs-list > div > div:first-child {background:url('../images/img-about-1.png') left top no-repeat #f6f6f6;}
.cs-list > div > div:nth-child(2) {background:url('../images/img-about-3.png') left top no-repeat #f6f6f6;}
.cs-list > div > div:nth-child(3) {background:url('../images/img-about-2.png') left top no-repeat #f6f6f6;}
.cs-list > div > div:nth-child(4) {background:url('../images/img-about-4.png') left top no-repeat #f6f6f6;}

.outer-coin > ul {
    display:flex;
    flex-wrap: wrap;
    justify-content: center;
    gap:1.25rem;

    padding:1.25rem 0.875rem;
    width:402px;
}

.outer-coin > ul > li {
    display:inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap:1rem;

    padding-top:0.25rem;
    width:120px;
    height:116px;
    background:#f6f6f6;
    border-radius: 0.75rem;
}

.outer-coin > ul > li > i {
    width:120px;
    height:60px;
}

.logo-bitcoin {background:url('../images/icon-bitcoin.png') 50% 50% no-repeat;}
.logo-binance {background:url('../images/icon-binance.png') 50% 50% no-repeat;}
.logo-bitmex {background:url('../images/icon-bitmex.png') 50% 50% no-repeat;}
.logo-bithumb {background:url('../images/icon-bithumb.png') 50% 50% no-repeat;}
.logo-upbit {background:url('../images/icon-upbit.png') 50% 50% no-repeat;}
.logo-coinone {background:url('../images/icon-coinone.png') 50% 50% no-repeat;}

.outer-coin > ul > li > span {
    color:#444;
    font-size:1rem;
}

.footer {
    margin-top:auto;
}

.footer > p {
    line-height:3rem;
    color:#93959b;
    text-align:center;
    font-size:0.75rem;
    background:#f3f5f8;
}

/* popup */
.dialog-layout {
    position:fixed;
    top:0;
    left:0;

    display:flex;
    justify-content:center;
    align-items: flex-start;

    min-width:100%;
    min-height:100%;
    background:#00000030;
}

.dialog-contents {
    display:flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;

    position:relative;
    padding:2.5rem;
    height:100%;
    max-height:80vh;
    background:#fff;
    border-radius:0.25rem;
    margin:4vh 0;

    overflow-x:hidden;
    overflow-y: auto;
}

.dialog-contents::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
}

.dialog-contentsbody::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    background: #217af4; /* 스크롤바의 색상 */
    
    border-radius: 10px;
    z-index:100;
}

.dialog-contents::-webkit-scrollbar-track {
    background: rgba(33, 122, 244, .1);  /*스크롤바 뒷 배경 색상*/
}

.dialog-contents .dialog-btn-close {
    position:absolute;
    top:1.425rem;
    right:1.425rem;
    width:1.5rem;
    height:1.5rem;
    line-height:1.5rem;
    font-size: 3rem;
    text-align:Center;
    color: #999;
    background: none;
}

.dialog-contents > div > form {
    display:flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    gap:1.25rem;

    width:100%;
}

.dialog-contents > div input[type="text"],
.dialog-contents > div input[type="password"] {
    padding:0 1.5rem;
    width:calc(100% - 3rem);
    height:3.5rem;
    font-size:1rem;
    color:#444444;
    font-family:'NanumSquare', sans-serif;
    font-weight:800;
    background:#f9fcff;
    border:1px solid #e2e5eb;
}

.dialog-contents > div input[type="password"] {
    font-family:'Dotum';
}

.dialog-contents > div input[type="password"]::placeholder {
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
}

/* login / sign */
.dialog-title-section {
    color:#a4b0bc;
    font-size:2rem;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
    margin-bottom:2rem;
}

.btn-dialog-base {
    width:100%;
    line-height:68px;
    color:#fff;
    text-align:center;
    font-size:1.5rem;
    font-family: 'NanumSquare', sans-serif;
    font-weight:700;
    background:#0e82f6;
    border-radius:0.312rem;
    border-bottom:3px solid #3d70d7;
}

.dialog-login {
    width:100%;
    max-width:466px;
}

.logo-login {
    width:336px;
    min-height:100px;
    height:100px;
    background:url('../images/logo-login.png') 50% 50% no-repeat;
    margin-bottom:2.375rem;
}

.dialog-login > div {
    display:flex;
    flex-direction:column;
    gap:1.25rem;

    width:100%;
}

.dialog-login > p:last-child {
    color:#8993a2;
    font-size:1rem;
    font-family: 'NanumSquare', sans-serif;
    font-weight:700;
    margin-top:2rem;
}

.dialog-login > p:last-child > a {
    color:#8993a2;
}

.dialog-login > p:last-child > span {
    padding:0 0.5rem;
}

.dialog-policy {
    width:100%;
    max-width:466px;
}

.dialog-policy > div > div {
    display:inline-flex;
    align-items: center;

    padding:0 0.875rem;
    width:calc(100% - 1.75rem);
    height:3rem;
    font-size:1rem;
    color:#444444;
    font-family: 'NanumSquare', sans-serif;
    background:#f9fcff;
    border:1px solid #e2e5eb;
    border-radius:0.312rem;
}

.dialog-policy > div > div span:nth-child(2) {
    color:#8993a2;
    margin-left:0.625rem;
}

.dialog-policy > div > div span:nth-child(3) {
    color:#ff0000;
    margin-left:0.425rem;
}

.dialog-policy > div > div:nth-child(4) span:nth-child(3) {
    color: #8993a2;
}

.dialog-policy > div > div button {
    color:#777;
    background:none;
    margin-left:auto;
}

.dialog-policy > div > p:last-child {
    padding:1rem 0 2rem;
    font-size:1.25rem;
    color:#333;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
}

.dialog-sign {
    width:100%;
    max-width:466px;
}

.dialog-sign .dialog-phone-check,
.dialog-sign .dialog-phone-num {
    display:flex;
    width:100%;
    gap:0.5rem;
}

.dialog-sign .dialog-phone-check > select {
    padding: 0 1.5rem;
    width:8rem;
    height: 3.5rem;
    font-size: 1rem;
    color: #444444;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
    background: #f9fcff;
    border: 1px solid #e2e5eb;
}

.dialog-sign .dialog-phone-check > input {
    width:calc(100% - 18.125rem) !important;
}

.dialog-sign .dialog-phone-num {
    position:relative
}

.dialog-sign .dialog-phone-num > input {
    width:calc(100% - 9.5rem) !important;
}

.dialog-sign .dialog-phone-num > span {
    position:absolute;
    right: 7.25rem;
    bottom: 0.75rem;
    font-family:'NanumSquare', sans-serif;
    font-weight:800;
    font-size:0.875rem;
    color:#777;
}

.dialog-sign .dialog-phone-check > button,
.dialog-sign .dialog-phone-num > button {
    width:6rem;
    height:3.5rem;
    color: #fff;
    text-align: center;
    font-size: 1rem;
    font-family: 'NanumSquare', sans-serif;
    font-weight:700;
    background: #0e82f6;
}

.dialog-sign .btn-dialog-base {
    margin-top:1.5rem;
}

.dialog-sign .select-text {
    padding: 0 1.5rem;
    width:100%;
    height: 3.5rem;
    font-size: 1rem;
    color: #444444;
    font-family: 'NanumSquare', sans-serif;
    font-weight:700;
    background: #f9fcff;
    border: 1px solid #e2e5eb;
}

/* change coin */
.dialog-change {
		position:relative
		z-index:99999;
    padding:0 1.25rem 1.25rem;
    width:100%;
    max-width:510px;
}

.dialog-title-contents {
    display:flex;
    justify-content: space-between;
    align-items: center;

    width:100%;
    height:80px;
    line-height:100%;
    font-size:1.5rem;
    color:#0f345a;
    font-family: 'NanumSquare', sans-serif;
    font-weight:700;
    border-bottom:2px solid #ededed;
    margin-bottom:1.25rem;
}

.dialog-title-contents > button {
    font-size:3rem;
    color:#999;
    background:none;
}

.dialog-coin-type {
    display:flex;
    flex-direction: column;
    gap:0.5rem;

    padding:1rem;
    width:calc(100% - 2.125rem) !important;
    background:#f6f6f6;
    border:1px solid #ebeaea;
    margin-bottom:1rem;
}

.dialog-coin-type > div {
    display:flex;
    align-items: center;

    width:100%;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
    font-size:1rem;
    color:#363636;
}

.dialog-coin-type > div > span:first-child {
    width:124px;
    margin-right:auto;
}

.dialog-coin-type > div > select {
    padding:0 0.75rem;
    width:calc(100% - 124px);
    height:2rem;
    font-family: 'NanumSquare', sans-serif;
    font-size:1rem;
    background:#fff;
    border:1px solid #ebeaea;
}

.dialog-coin-type > div:first-child > select {
    width:138px;
}

.dialog-coin-type > div:first-child > span:last-child {
		flex-grow:1;
    text-align:right;
    width:180px;
    line-height:1.875rem;

    font-family: 'NanumSquare', sans-serif;
    font-weight:700;
    font-size:0.875rem;
    text-align:center;
    letter-spacing:-0.5px;

    background:#fff;
    border:1px solid #ebeaea;
    border-left:none;
}

.dialog-coin-type > div:first-child > span:last-child > span {
    color:#0e82f6;    
}

.dialog-coin-type > div:last-child > label {
    padding: 0 0.875rem;
    width: calc(100% - 126px - 1.75rem);
    line-height: 2rem;
    font-family: 'NanumSquare', sans-serif;
    font-size: 1rem;
    background: #fff;
    border: 1px solid #ebeaea;
}


.dialog-change-tabs {
    display:flex;
    align-items: center;
    justify-content: flex-start;
    
    width:100%;
    border-bottom:2px solid #ebeaea;
}

.dialog-change-tabs li {
    width:33.33%;
    border:1px solid #ebeaea;
    border-bottom:none;
}

.dialog-change-tabs button {
    width:100%;    
    height:44px;
    
    text-align:center;
    color:#777777;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
    font-size:1rem;
    background:#f6f6f6;
    
}

.dialog-change-tabs li + li {
    border-left:none;
}

.dialog-change-tabs li.current button,
.dialog-change-tabs li:hover button {
    color:#0e82f6;
    background:#fff;
}

.dialog-change-order {
    padding-top:2rem;
}

.dialog-change-order > div + div {
    margin-top:1.75rem;
}

.dialog-change-order .flex-change input[type="text"] {
    padding:0.5rem 1rem 0;
    width:100%;
    height:100%;
    font-size:1rem;
    color:#333333;
    font-family: 'NanumSquare', sans-serif;
    font-weight:800;
    background:transparent;
    border:none;
}

.dialog-change-order .flex-change input[type="text"]::placeholder {
    color:#333;
}

.dialog-change-order > div:first-child > .flex-change input[type="text"],
.dialog-change-order > div:nth-child(2).flex-change input[type="text"] {
    padding:0 4rem 0 1rem;
    text-align:right;
    font-size:1.875rem;
}

.dialog-change-order .flex-change span:last-child,
.dialog-change-order .flex-change span:last-child {
    position:absolute;
    right:1rem;
    bottom:1rem;
    font-size:1.125rem;
    color:#999999;
    font-family:'NanumSquare', sans-serif;
    font-weight:800;
    letter-spacing:-0.5px;
}

.dialog-change-order .flex-change {
    display:flex;
    justify-content: space-around;
    align-items: center;

    position:relative;
    width:100%;
    height:3.375rem;
    border:1px solid #e2e5eb;
    border-radius:6px;
}
.dialog-change-order .flex-change span:first-child {
    position:absolute;
    top:-0.5rem;
    left:0.75rem;

    padding:0 0.75rem;
    color:#666;
    font-family:'NanumSquare', sans-serif;
    background:#fff;
}

.change-sub-txt {
    padding-top:0.5rem;
    text-align:right;
    color:#687a8e;
    font-size:0.875rem;
    font-family:'NanumSquare', sans-serif;
    font-weight:700;
}

.change-sub-txt span {
    color:#0e82f6;
    font-family:'NanumSquare', sans-serif;
    font-weight:800;
}

.dialog-change-order input.dialog-change-adr {
    padding-right:3.375rem !important;
}

.dialog-change-order .change-sub-usdt {
    font-size:0.75rem;
    text-align:center;
    letter-spacing:-0.3px;
    margin-bottom:2rem;
}

.dialog-change-order div:nth-child(5) input[type="text"]::placeholder {
    font-size:1rem;
    color:#0e82f6;
    text-align:center;
}

.change-phone > input {
	text-align:center;
}

.btn-copy-line {
    position:absolute;
    top:0;
    right:0;

    width:3.375rem;
    height:3.375rem;   
    background:url('../images/icon-copy.png') 50% 50% no-repeat;
}

.notice-change {
    padding:0.75rem 1rem;
    line-height:1rem;
    color:#5c6e85;
    font-size:0.75rem;    
    background:#f6f6f6;
    border:1px solid #ebeaea;
}

.notice-change > p+p {
    margin-top:0.25rem;
}

.dialog-change .btn-dialog-base {
    margin-top:1.5rem;
}

.dialog-order-history {
    width:100%;
}

.dialog-change-ctl {
    width:100%;
}

.dialog-order-history table {
    width:100%;
    font-family:'NanumSquare', sans-serif;
    color:#788490;
    text-align:center;
    font-size:0.875rem;
    border-bottom:3px solid #e2e5eb;
}

.dialog-order-history table thead {
    height:2.625rem;
    font-size:1rem;

    background:#f6f6f6;
    border:1px solid #ebeaea;
    border-bottom-width:2px;
}

.dialog-order-history table td {
    height:2.5rem;
}

.dialog-order-history table tr+tr td {
    border-top:1px solid #e2e5eb;
}

.list-pageing {
    display:flex;
    justify-content:center;
    align-items: center;
    gap:1rem;

    height:3rem;
    line-height:100%;
    font-family:'NanumSquare', sans-serif;
    font-weight:800;
}

.list-pageing a {
    color:#92a4b9;
}

.list-pageing li:hover a,
.list-pageing li.current a {
    color:#0e82f6;
}

.dialog-trade-finish {
    padding:2rem 2rem 1rem;
}

.dialog-trade-finish > p:first-child {
    color:#444;
    font-size:1.675rem;   
    font-family:'NanumSquare', sans-serif;
    font-weight:800;
    margin-bottom:1rem;
}

.dialog-trade-finish > p:nth-child(2) {
    color:#828282;
    font-size:1rem;
    font-family:'NanumSquare', sans-serif;
    font-weight:800;
    margin-bottom:2rem;
}

.dialog-trade-finish > button:last-child {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height:2.5rem;
    color: #fff;
    font-size: 1.25rem;
    font-family: 'NanumSquare', sans-serif;
    font-weight: 700;
    background: #0e82f6;
    border-radius: 6px;
}


/* mobile */
@media screen and (max-width: 768px) {
    .wrap,
    .header,
    .contents {
        width:100%;
        min-width:100%;
    }

    .contents-top,
    .real-time-tabs,
    .contents-bottom,
    .cs-list > div {
        flex-direction:column;
    }

    .gnb-cs {
        padding:0 5%;
        background:#f7f7f7;
        margin-bottom:1rem;
    }

    .logo {
        height:3.625rem;
    }

    .bar-menu {
        gap:0.5rem;
        flex-direction:column;
        margin-bottom:1rem;
    }

    .gnb {
        padding:0 2rem;
        width:calc(100% - 4rem);
        background:#5aa0ff;
    }

    .gnb > li {
        flex-grow:1;
        text-align:center;
    }

    .gnb > li > a {
        color:#fff;
    }

    .contenst-banner > div {
        padding:2rem 5%;
        width:80%;
        height:14vh;
        min-height:6rem;
        margin:0 5%;
    }

    .contenst-banner .banner-1 div:first-child {
        font-size:1.25rem;
    }

    .contenst-banner .banner-1 div:nth-child(2) {
        font-size:0.75rem;   
    }

    .contenst-banner .banner-1 span {
        right:-5%;
        bottom:-10%;

        width:50%;
        height:100%;
        background-size:contain;
    }
    

    .contents-quick-service {
        padding:0.75rem;
        width:calc(90% - 1.5rem);
        margin:1rem 5%;
    }

    .contents-quick-tab > li {
        flex-grow:1;
    }

    .contents-quick-tab > li > button {
        width:100%;
        height:3rem;
    }

    .title-section {
        margin:0 5%;
    }

    .real-time-tabs {
        padding:5% 0;
        width:90%;
        margin:0 5%;
    }
    
    

    .real-time-tabs > div {
        flex-grow:1;
        flex-direction: row;
        flex-wrap:wrap;
        align-items: center;
        justify-content: flex-end;
        gap:0 0.25rem;

        padding:1rem 5%;
        width:auto;
        height:auto;

        background-size:contain;
        background-position:left 50%;
        
    }

    .real-time-tabs > div p {
        width:100%;
    }

    .real-time-tabs > div p:first-child {
        font-size:1.5rem;
    }

    .real-time-tabs > div p:nth-child(2) {
        font-size:1rem;
    }

    .real-time-tabs > div span:nth-child(3) {
        font-size:0.875rem;
        margin-top:0;
    }

    .real-time-tabs > div span {
        display:inline-block;
    }

    

    .cs-list > div {
        padding:5%;
        width:90%;
        margin-bottom:2rem;
    }

    .cs-list > div > div {
        width:calc(100% - 2rem);
    }

    .outer-coin > ul{
        padding:5%;
        width:90%;
    }

    .outer-coin > ul > li {
        width:calc(32% - 0.625rem);
    }

    /* popup */
    .dialog-contents {
        padding:1rem 5% 2rem;;
        max-width:calc(90vw - 2rem);
    }

    .logo-login {
        width:100%;
        max-width:50vw;
        background-size:contain;
    }

    .dialog-layout > form {
        display: flex;
        justify-content: center;

        width:100%;
    }

    .dialog-sign .dialog-phone-check {
        flex-wrap:wrap;
    }

    .dialog-sign .dialog-phone-check > select {
        width:100%;
    }

    .dialog-sign .dialog-phone-check > input {
        flex-grow:1;
    }

    .dialog-coin-type > div {
        flex-wrap: wrap;
        gap:0.25rem;
    }

    .dialog-coin-type > div > span:first-child {
        width:100%;
        margin-bottom:0.125rem;
    }

    .dialog-coin-type > div > select,
    .dialog-coin-type > div:first-child > select,
    .dialog-coin-type > div:first-child > span:last-child,
    .dialog-coin-type > div:last-child > label {
        width:100%;
    }

    .dialog-coin-type > div + div {
        margin-top:0.625rem;
    }

    .dialog-change-order {
        padding-top:2rem;
    }

    .dialog-change-order .change-sub-txt,
    .dialog-change-order .change-sub-usdt {
        padding:0.425rem;
        text-align:left;
        font-size:0.75rem;
        margin-bottom:1.425rem;
        word-break: keep-all;
    }

    .dialog-change-ctl {
        width:100%;
    }

    .dialog-trade-finish {
        padding:2rem 10%;
    }
}