@charset "utf-8";
/* 충/환전페이지 */
.cash-table { width: 100%; }
.cash-table .col-1 { padding: 20px; width: 50%; border-right: 1px solid #202020; }
.cash-table .col-2 { padding: 20px; width: 50%; }
.cash-table .col-1,
.cash-table .col-2 { border-bottom: 1px solid #202020; }
.cash-table .cash-table-tit { margin-bottom: 30px; color: #fff; font-size: 24px; font-size: 2.4rem; font-weight: normal; }
.cash-info li { font-size: 16px; font-size: 1.6rem; margin-bottom: 0; }
.cash-info li:after { content: ''; clear: both; display: block; visibility: hidden; }
.cash-info li strong { line-height: 40px; font-weight: normal; font-size: 16px; font-size: 1.6rem; float: left; width: 20%; }
.cash-info li span { line-height: 40px; font-size: 16px; font-size: 1.6rem; float: left; width: 80%; }

.boxPassword {
	width: 70%;
    height: 70px;
    line-height: 70px;
    text-align: center;
    font-weight: bold;
    color: #fff;
    padding: 0 0 0 30px;
    font-size: 30px;
    font-size: 3.0rem;
    outline: none;
    border-radius: 4px;
    background: #2c2d2e;
    border: none;
	display: block;
	letter-spacing: 34px;
}
.boxPassword::placeholder {
	letter-spacing: 0px;
	font-size: 30px;
    font-size: 3.0rem;
}
.boxPassword:focus {
	border: 2px solid #ffcc00;
}


.cash-info li .cash-ex-pwd-box { position: relative; height: 40px; float: left; width: 75%; }
.cash-ex-pwd-dummy {
	width: 100%; height: 40px; position: absolute; top: 0; left: 0;
	z-index: 3;
}
.cash-ex-pwd-dummy li {
	width: 40px; height: 40px; float: left;
	margin-right: 5px; background-color: rgba(53, 54, 56, 0.9);
	border-radius: 4px;
}

.cash-info li input {
	width: 100%; height: 40px; position: absolute; top: 0; left: 0;
	background-color: transparent; border: none; outline: none;
	color: #fff;
	font-size: 31px; font-size: 3.1rem; font-weight: bold;
	letter-spacing: 34px; z-index:5; padding-left: 15px;
}
.cash-info li input.pwd-dummy {
	color: #fff;
	z-index: 1;
}
.cash-info li p { line-height: 40px; font-size: 16px; font-size: 1.6rem; float: left; width: 100%; }

.cash-btn-wrap { margin-bottom: 10px; }
.cash-btn-wrap:after,
.cash-inp-wrap:after { content: ''; clear: both; display: block; visibility: hidden; }
.cash-btn-wrap > li {
	width: 16.666666%; float: left; padding-left: 8px;
}
.cash-btn-wrap > li:first-child { padding-left: 0; }
.cash-btn-wrap > li > a { 
	font-size: 18px; font-size: 1.8rem; width: 100%; display: block;
	text-align: center; background: #4d4e52;
	padding: 10px 0; border-radius: 4px;
}
.cash-btn-wrap > li > a:hover { background-color: #616469; }


.cash-inp-wrap input { 
	width: 70%; height: 70px; line-height: 70px; 
	text-align: right; font-weight: bold; color: #fff; padding: 0 30px;
	font-size: 30px; font-size: 3.0rem; float: left; outline:none;
	border-radius: 4px; background: #2c2d2e; border: none;
}

.cash-inp-wrap select { 
	width: 70%; height: 36px; line-height: 36px; 
	text-align: right; font-weight: bold; color: #fff; padding: 0 30px;
	font-size: 16px; font-size: 1.6rem; float: left; outline:none;
	border-radius: 4px; background: #2c2d2e; border: none;
}
.cash-inp-wrap label { 
	width: 30%; height: 36px; line-height: 36px; 
	text-align: center; font-weight: bold; color: #ffcc00; padding: 0;
	font-size: 16px; font-size: 1.6rem; float: left; outline:none;
	border-radius: 4px; border: none;
}

.cash-inp-wrap input:focus,
.cash-inp-wrap select:focus {
	border: 2px solid #ffcc00;
}
.cash-inp-wrap span {
	display:block; float: left; width: 10%; font-size: 20px; font-size: 2.0rem; height: 70px; line-height: 70px; text-align: center;
}
.cash-inp-wrap .btn_modify {
	border-radius: 4px; background-color: #4d4e52; width: 20%; height: 70px; line-height: 70px; 
	text-align: center; font-weight: bold; color: #fff; padding: 0;
	font-size: 20px; font-size: 2.0rem; float: right;
}
.cash-inp-wrap .btn_modify:hover { background-color: #616469; }

.bonus-note {
	font-size: 14px; font-size: 1.4rem;
	color: #62ca1d;
	text-align: center;
	line-height: 40px;
}

/* 충/환전페이지 */


/* 충/환전리스트 */
.cash-list-table { width: 100%; text-align: center; }
.cash-list-table dt > div:first-child { border-left: none; }
.cash-list-table dd > div { border-bottom: 1px solid #333; }

.cash-list-table .col-1 { width: 8%; }
.cash-list-table .col-2 { width: 19%; }
.cash-list-table .col-3 { width: 15%; }
.cash-list-table .col-4 { width: 31%; }

.cash-list-table em { display: none; }

@media all and (max-width:1200px){
	.cash-table .col-1 { display: block; width: 100%; border-right: none; border-bottom: 1px solid #202020; }
	.cash-table .col-2 { display: block; width: 100%; }
}

@media all and (max-width:640px){
	.cash-btn-wrap > li { width: 33.333333%; padding-bottom: 2px; }
	.cash-btn-wrap > li:first-child,
	.cash-btn-wrap > li:nth-child(3n+1) { padding-left: 0; }

	.table-dl.cash-list-table { display: block; }
	.table-dl.cash-list-table > dt,
	.table-dl.cash-list-table > dd > div.col-1.no { display: none; }
	.table-dl.cash-list-table > dd,
	.table-dl.cash-list-table > dd { display: block; position: relative; padding: 20px; border-bottom: 1px solid #333; }
	.table-dl.cash-list-table > dd:after { content: ''; clear: both; display: block; visibility: hidden; }
	.table-dl.cash-list-table > dd > div { border: none; padding: 6px 0; text-align: left; display: block; float: left; }
	.cash-list-table em { color: #999; display: block; margin-bottom: 5px; }

	.cash-list-table .col-1,
	.cash-list-table .col-2,
	.cash-list-table .col-3,
	.cash-list-table .col-4 { width: 50%; font-size: 12px; font-size: 1.2rem; }

	.cash-table .cash-table-tit { font-size: 16px; font-size: 1.6rem; margin-bottom: 15px; }
	.cash-info > li { margin: 0; }
	.cash-info > li strong,
	.cash-info > li span,
	.cash-info > li p { font-size: 14px; font-size: 1.4rem; }

	.cash-inp-wrap input { width: 65% }
	.cash-inp-wrap span { width: 10% }
	.cash-inp-wrap .btn_modify { width: 25% }

	.cash-inp-wrap input,
	.cash-inp-wrap span,
	.cash-inp-wrap .btn_modify { font-size: 14px; font-size: 1.4rem; height: 40px; line-height: 40px; }

	.boxPassword {
		font-size: 14px;
		font-size: 1.4rem;
		height: 40px;
		line-height: 40px;
	}
	.boxPassword::placeholder {
		font-size: 14px;
		font-size: 1.4rem;
	}
}
@media all and (max-width:480px){
	
	.cash-list-table .col-1,
	.cash-list-table .col-2,
	.cash-list-table .col-3,
	.cash-list-table .col-4 { font-size: 11px; font-size: 1.1rem; }
}
/* 충/환전리스트 */


/* 충환전 프로세스 */
.process-box {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	margin-bottom: 30px;
}
.process-box li {
	width: 25%; height: 200px;
	border: 2px solid #202020;
	background-color: #353535;
	border-radius: 20px;
	position: relative;
}
.process-box li::after {
	content: '';
	width: 30px; height: 30px;
	border: none;
	border-top: 4px solid #202020;
	border-right: 4px solid #202020;
	background-color: #353535;
	transform: rotate(45deg);
	position: absolute;
	top: 50%; right: -19px;
	margin-top: -15px;
	z-index: 1;
}
.process-box li:last-child::after { display: none; }
.process-tit {
	border-radius: 20px 20px 0 0;
	width: 100%; height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #ffcc00; color: #000;
	font-size: 20px; font-size: 2.0rem;
	font-family: 'NanumSquareExtraBold';
}
.process-con {
	width: 100%; height: calc( 100% - 60px );
	line-height: 20px;
	padding: 26px;
	font-size: 14px; font-size: 1.4rem;
}

@media all and (max-width:860px){
	.process-box li {
		width: 50%;
	}
	.process-box li::after { display: none; }

	.process-box.line-3 li {
		width: 33.333333%;
	}
	.process-box.line-3 .process-tit {
		font-size: 14px; font-size: 1.4rem;
	}
	.process-box.line-3 .process-con {
		font-size: 10px; font-size: 1.0rem; padding: 8px;
	}
}