* {
	box-sizing: border-box;
	font-family: 'GmarketSans';
	font-weight: 500;
}

html {
	font-size:14px;
	cursor:default;
}

body {
	padding:0 0;
	margin:0;

	
	background: #000;
	color: var(--main-font-color);
	vertical-align: middle;
	overflow-x:hidden;
	
	-ms-overflow-style: none; /* 인터넷 익스플로러 */
	scrollbar-width: none; /* 파이어폭스 */
}

*::-webkit-scrollbar {
	display: none;
}
a { 
	text-decoration:none;
	color:inherit;
	cursor:pointer;
}

a:hover {
	text-decoration:none;
	color:var(--main-hover-color);
}

nav {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, auto));
	gap: 0.5rem;
	grid-auto-rows: minmax(50px, auto);
	place-items: space-between center;
}

nav .nav-top {
	grid-column: auto / span 1;
	grid-row: auto / span 1;
	
	display: grid;
	grid-template-columns: 250px 1fr;
	gap: 0.5rem;
	grid-auto-rows: minmax(50px, auto);
	place-items: center stretch;
}

nav .nav-top .mobile-menu {
	display:none;
}

nav .nav-top .logo {
	grid-column: auto / span 1;
	grid-row: auto / span 1;
}

nav .nav-top .logo img {
	max-height:120px;
}

nav .nav-top .navi-time {
	grid-column: auto / span 1;
	grid-row: auto / span 1;
	
	font-size:1.2rem;
	text-align:center;
}

nav .nav-menu {
	grid-column: auto / span 1;
	grid-row: auto / span 1;
	
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.5rem;
	grid-auto-rows: minmax(50px, auto);
	place-items: center center;
}

nav .nav-menu .navi-sub {
	grid-column: auto / span 1;
	grid-row: auto / span 1;
	place-self: center end;
}



nav .nav-menu .navi {
	grid-column: auto / span 1;
	grid-row: auto / span 1;
	place-self: center end;
}

.nav_button_s {
	display:inline-block;
	font-weight:300;
	font-size:1.2rem;
}

.nav_button {
	display:inline-block;
	font-weight:500;
	font-size:1.5rem;
}

.nav_button_l {
	display:inline-block;
	font-weight:700;
	font-size:1.8rem;
	color:#e24035;
}

nav .nav_buttons {
	padding: 0.5rem;
}

nav .nav_buttons:hover {
	cursor:pointer;
	color:var(--main-hover-color);
}

.container {
	position:relative;
	display: grid;
	height:100%;
	grid-template-columns: 250px 1fr 300px;
	gap: 1rem;
	grid-auto-rows: 100%;
	place-items: stretch stretch;
}

.container .con-1 {
	position:relative;
	grid-column: auto / span 1;
	grid-row: 1 / span 1;
}

.container .con-2 {
	position:relative;
	grid-column: auto / span 1;
	grid-row: 1 / span 1;
}

.container .con-2 #con-main {
	width:100%;
	height:100%;
}

#loading-layer {
	position:absolute;
	display:none;
	width:100%;
	height:100%;
	z-index:2;
	justify-content: center;
	align-items: center;
	
	transition:all 0.5s;
}

.container .con-3 {
	height:100%;
	grid-column: auto / span 1;
	grid-row: 1 / span 1;
}

.container .con-1 .con-show {
	position:absolute;
	top:50px;
	left:calc(100% + 9px);
	z-index:2;

	display: none;
	justify-content:center;
	align-items:center;
	
	font-size:1rem;
	font-weight:700;
	padding:1rem 0.5rem;
	border-top: 2px solid var(--main-border-color);
	border-right: 2px solid var(--main-border-color);
	border-bottom: 2px solid var(--main-border-color);
	background:var(--main-button-bg);
	border-radius: 0 0.5rem 0.5rem 0;
	writing-mode: vertical-lr;
}


.container .con-3 .cart-pop {
	position:relative;
	display:none;
	width:100%;
	height:50px;
	line-height:50px;
	
	color:var(--special-font-color);
	font-size:1.25rem;
	font-weight:700;
	text-align:center;
	
	background:#fff;
	border:1px solid var(--main-border-color);
	border-radius:50px 50px 0 0;
}

/* main */
.main { 
	position:relative;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
	place-items: stretch stretch;
}

.main .banner {
	grid-column: auto / span 2;
	grid-row: auto / span 1;
	position: relative;
    overflow-x: hidden;

}

.main .popular {
	grid-column: auto / span 2;
	grid-row: auto / span 1;
	
	display:grid;
	grid-template-columns: repeat(4, 1fr);
	gap:1rem;
	padding:1rem 0;
}

.main .popular .popular-game {
	cursor:pointer;
}

.main .popular .popular-game .game-name {
	padding:1rem;
	text-align:center;
	border-top:1px solid var(--main-border-color);
	border-bottom:1px solid var(--main-border-color);
}


.main .board {
	grid-column: auto / span 1;
	grid-row: auto / span 1;
}



.main .board .title {
	display:flex;
	justify-content:start;
	align-items:center;
	
	background: linear-gradient(180deg, #e16e5b 0, #e24d35);
	border-radius: 0.3rem;
	color: #fff;
	text-shadow: 0 1px 3px rgb(0 0 0 / 50%);
    
	font-size:1.5rem;
	padding: 0.75rem;
}

.main .board .title .name { flex-grow:1; }
.main .board .title .more {  }
.main .board .title .smaller { font-size:1.0rem; }

.main .board .list {
	display:flex;
	justify-content:start;
	align-items:center;
	
	font-size:1.2rem;
	padding: 0.75rem;
	border-bottom:1px solid #4e4e4e;
	
	cursor:pointer;
}

.main .board .list:hover {
	background:#1a1a1a;
}

.main .board .list .name {
	flex-grow:1;
}

.main .footer {
	grid-column: 1 / span 2;
	grid-row: auto / span 1;
}

/*	Member	*/
.member-login {
	margin-bottom: 1.5rem;
}

.member-login .login-name {
	color: #bbbbbb;
	font-weight:700;
	font-size:1.2rem;
	padding:0 0.5rem;
	margin-bottom:0.5rem;
	
	display: flex;
	justify-content:start;
	align-items:center;
}

.member-login .login-name .name-title {
	flex:1 1 100%;
}

.member-login .login-name .name-close {
	display:none;
	
	flex:0 1 auto;
}

.member-login .login-name .name-close i {
	color:#000;
}

.member-login .login-name i {
	display: inline-flex;
	justify-content:start;
	align-items:center;
	
	background:#fff;
	padding:0.25rem;
	border-radius:0.5rem;
}

.member-login .login-info {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 0.6rem;
	grid-auto-rows: minmax(20px, auto);
	place-items: stretch stretch;
	
	padding: 1.5rem 0.75rem 0.75rem;
	background: var(--main-container-bg);
	border:1px solid var(--main-border-color);
	border-radius:0.5rem;
}

.member-login .login-info .info-id {
	grid-column: 1 / span 3;
	grid-row: 1 / span 1;
}

.member-login .login-info .info-pw {
	grid-column: 1 / span 3;
	grid-row: 2 / span 1;
}

.member-login .login-info div input {
	width: 100%;
	color:#fff;
	background:var(--main-button-bg);
	border:0;
	padding:0.25rem;
}	

.member-login .login-info .info-btn {
	grid-column: 4 / span 1;
	grid-row: 1 / span 2;
	
	display: flex;
	justify-content:center;
	align-items:center;
	
	color:#fff;
	cursor:pointer;
	font-weight:700;

	background: linear-gradient( to right, #fd924c, #e14d35, #fd924c);
}

.member-login .login-info .info-btn:hover {
	background: linear-gradient( to right, #e14d35, #fd924c, #e14d35);
}

.member-login .login-info .info-btn2 {
	grid-column: auto / span 2;
	
	color:#fff;
	background:var(--main-button-bg);
	border-radius:0.5rem;
	padding:1rem;
	cursor:pointer;
	border:1px solid var(--main-border-color);
	
	text-align:center;
}

.member-login .login-info .info-btn2:hover {
	color:var(--main-hover-color);
}


nav .member-info {
	display:none;
}

.member-info {
	margin-bottom:20px;
}

.member-info .info-name {
	color: #bbbbbb;
	font-weight:700;
	font-size:1.2rem;
	padding:0 0.5rem;
	margin-bottom:0.5rem;
	
	display: flex;
	justify-content:space-between;
	align-items:center;
}

.member-info .info-name .name-row {
	flex: 1 1 auto;
	
	display: flex;
	justify-content:start;
	align-items:center;
}
.member-info .info-name .name-row:nth-child(2) {
	justify-content:end;
}

.member-info .info-name .name-row i {
	display: inline-flex;
	justify-content:start;
	align-items:center;
	
	background:#fff;
	padding:0.25rem;
	border-radius:0.5rem;
}

.member-info .info-name .name-row .row-btn {
	display:inline-block;
	padding:0.25rem 0.5rem;
	color:#fff;
	font-size:1rem;
	background:var(--main-button-bg);
	border-radius:0.5rem;
	cursor:pointer;
	border:1px solid var(--main-border-color);
	text-align:center;
}

.member-info .info-name .name-row .row-btn:hover {
	color:var(--main-hover-color);
}

.member-info .info-box {
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr 1fr;
	gap: 0.25rem 0.5rem;
	grid-auto-rows: minmax(10px, auto);
	place-items: stretch stretch;
	
	text-align:center;
	padding:0.75rem 0.25rem;
	border:1px solid var(--main-border-color);
	border-radius:0.5rem;
	background:var(--main-container-bg);
}

.member-info .info-box .box-level {
	grid-column: 1 / span 1;
	grid-row: 1 / span 4;
	
	background: var(--main-button-bg);
	position:relative;
	border-radius: 0.5rem;
	
	display:flex;
	justify-content:center;
	align-items:center;
}

.member-info .info-box .box-level .level-str {
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	
	font-size:1.6rem;
	font-weight:700;
	display:flex;
	justify-content:center;
	align-items:center;
}

.member-info .info-box .box-welcome {
	grid-column: 2 / span 3;
	grid-row: auto / span 1;
}

.member-info .info-box .box-row {
	grid-column: auto / span 3;
	grid-row: auto / span 1;
	
	display:flex;
	justify-content:between;
	align-items:center;
}

.member-info .info-box .box-row .row-name {
	text-align:left;
	font-weight:700;
	flex: 0 0 auto;
}

.member-info .info-box .box-row .row-value {
	text-align:right;
	flex: 1 1 100%;
}

/*		SUB PAGES		*/
.sub-page {
	height:100%;
	overflow:auto;
	padding-bottom:4rem;
}

.page-name {
	position:relative;
	margin-bottom:3rem;
}

.page-name .name-str {
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	padding-left:3rem;
	font-size:2rem;
	text-shadow: 0px 0px 6px #000;
	
	display:flex;
	justify-content:start;
	align-items:center;
}

.sub-page .page-btn {
	display:flex;
	justify-content:end;
	align-items:center;
	flex-flow:row wrap;
	gap: 0.5rem;
}

.sub-page .page-btn .btn-write {
	display:flex;
	justify-content:center;
	align-items:center;
	color:#fff;
	font-size:1rem;

	background:var(--main-button-bg);
	border-radius:0.5rem;
	padding:1rem;
	cursor:pointer;
	border:1px solid var(--main-border-color);
}

.sub-page .page-btn .btn-write:hover {
	color:var(--main-hover-color);
}

/* JOIN */
.page-join {
	
	border:1px solid var(--main-border-color);
	margin-bottom:2rem;
	background:var(--main-container-bg);
}

.page-join .join-name {
	padding:1rem 0;
	font-size:1.4rem;
	font-weight:700;
	text-align:center;
	
	border-bottom:1px solid var(--main-button-bg);

}

.page-join .join-info {
	display: grid;
	grid-template-columns: 150px 1fr 150px 1fr;
	gap: 1.5rem;
	grid-auto-rows: minmax(30px, auto);
	place-items: stretch stretch;
	
	padding:1rem 3rem;
	text-align:center;
	
	grid-column: auto / span 1;
}

.page-join .join-info .info-name {
	padding:1rem;
	font-weight:700;
	text-align:center;
	background:var(--main-button-bg);
	border-radius:1rem;
	
	grid-column: auto / span 1;
}

.page-join .join-info .info-value {
	text-align:left;
	position:relative;
	
	grid-column: auto / span 1;
}

.page-join .join-info .info-value input {
	width:100%;
	height:100%;
	color:#fff;
	padding:0 1rem;
	background:var(--main-button-bg);
	border-radius:1rem;
	outline:none;
	border:none;
}

.page-join .join-info .info-value select {
	width:100%;
	height:100%;
	color:#fff;
	padding:0 1rem;
	background:var(--main-button-bg);
	border-radius:1rem;
	outline:none;
	border:none;
}

.page-join .join-info .info-phone {
	position:relative;
	
	grid-column: auto / span 1;
	
	display: grid;
	grid-template-columns: 1fr 1.5fr 1.5fr;
	gap: 0.75rem;
	grid-auto-rows: minmax(30px, auto);
	place-items: stretch stretch;
}

.page-join .join-info .info-phone input {
	padding:0.5rem;
	text-align:left;
	background:var(--main-button-bg);
	border-radius:1rem;
	text-align:center;
	
	width:100%;
	height:100%;
	color:#fff;
	outline:none;
	border:none;
}

.page-submit {
	text-align:center;
}

.page-submit .submit-btn {
	display:inline-block;
	color:#fff;
	font-size:1.4rem;
	font-weight:700;
	
	padding:0.75rem 25rem;
	background:var(--main-button-bg);
	border-radius:0.5rem;
	padding:1rem;
	cursor:pointer;
	border:1px solid var(--main-border-color);
}

.page-submit .submit-btn:hover {
	color:var(--main-hover-color);
}

.page-money {
	width:100%;
	overflow:hidden;
	border:1px solid var(--main-border-color);
	margin-bottom:2rem;
	background:var(--main-container-bg);
}

.page-money .money-name {
	padding:1rem 0;
	font-size:1.4rem;
	font-weight:700;
	text-align:center;
	
	border-bottom:1px solid var(--main-button-bg);
	
	

}

.page-money .money-info {
	display: grid;
	grid-template-columns: 150px 1fr;
	grid-auto-rows: minmax(30px, auto);
	place-items: stretch stretch;
	
	grid-column: auto / span 1;
}

.page-money .money-info .info-name {
	padding:1rem;
	border-right: 1px solid #262626;
	border-bottom: 1px solid #262626;
	
	grid-column: auto / span 1;
}

.page-money .money-info .info-name .name-box {
	padding:0.5rem;
	font-weight:700;
	text-align:center;
	background:var(--main-button-bg);
	border-radius:1rem;
}

.page-money .money-info .info-value {
	padding:1rem;
	text-align:left;
	position:relative;
	font-size:1rem;
	font-weight:500;
	border-bottom: 1px solid #262626;
	
	grid-column: auto / span 1;
	
	display:flex;
	justify-content:start;
	align-items:center;
	flex-flow: row wrap;
	gap: 0.25rem;
}

.page-money .money-info .info-value input {
	
	color:#fff;
	padding:0.5rem 1rem;
	background:var(--main-button-bg);
	border-radius:1rem;
	outline:none;
	border:none;
	margin-right:1rem;
}

.page-money .money-info .info-value .value-btn {
	display:inline-block;
	color:#fff;
	font-size:1rem;

	background:var(--main-button-bg);
	border-radius:0.5rem;
	padding:0.5rem;
	cursor:pointer;
	border:1px solid var(--main-border-color);
}

.page-money .money-info .info-value .value-btn:hover {
	color:var(--main-hover-color);
}

.page-money .money-info .info-name:last-child, .page-money .money-info .info-value:last-child {
	border-bottom:none;
}

.page-record {
	border:1px solid var(--main-border-color);
	margin-top:1.5rem;
}
.page-record .record-table {
	margin:0;
	border-collapse: collapse;

	background:var(--main-container-bg);
}
.page-record .record-table .table-head {
	font-weight:700;
	font-size:1rem;
	color:var(--special-font-color);
}
.page-record .record-table td {
	text-align:center;
	padding:0.5rem 0.25rem;
	
	border: 1px solid #262626; 
}

.page-record .record-table .paging {
	display:flex;
	justify-content:center;
	align-items:center;
	flex-flow:row wrap;
}

.page-record .record-table .paging a {
	display:inline-flex;
	justify-content:center;
	align-items:center;
	padding:0.5rem;
	border-radius:0.5rem;
	background:var(--main-button-bg);
}

.page-record .record-table .paging a:hover {
	color:#000;
	background:#fff;
}

.page-record .record-table .paging strong {
	display:inline-flex;
	justify-content:center;
	align-items:center;
	padding:0.5rem;
	border-radius:0.5rem;
	background:var(--main-button-bg);
	font-weight:700;
	color:var(--main-hover-color);
}

/* board */
.record-read td {
	text-align:left !important;
	padding:1rem !important;
}

.page-write input {
	border:none;
	background:var(--main-button-bg);
	width:100%;
	border-radius:1rem;
	padding:0.5rem 1rem;
	color:var(--main-font-color);
	outline:none;
}

.page-write textarea {
	border:none;
	background:var(--main-button-bg);
	width:100%;
	border-radius:1rem;
	padding:1rem;
	color:var(--main-font-color);
	outline:none;
}


/*	history	*/
.page-history .history-box {
	padding:0.75rem 0.5rem;
	border:1px solid var(--main-border-color);
	background:var(--main-container-bg);
	margin-bottom:1rem;
}
.page-history .history-box .box-sum {
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(16.6666%,auto));
	place-items: stretch stretch;
	padding:0.5rem 0;
	gap:0.5rem;
	border-bottom:1px dotted var(--main-button-bg);
}

.page-history .history-box .box-sum .sum-con {
	grid-column: auto / span 1;
	
	display:flex;
	place-items: stretch stretch;
}

.page-history .history-box .box-sum .sum-con .con-head {
	flex:1 1 auto;
	text-align:center;
}

.page-history .history-box .box-sum .sum-con .con-body {
	flex:1 1 auto;
	text-align:center;
}

.page-history .history-box .box-items .items-container {
	background:#363848;
	margin-bottom:0.5rem;
	padding:0.5rem 1.25rem;
}

.page-history .history-box .box-items .items-container .container-info {
	display:flex;
	justify-content:stretch;
	align-items:stretch;
}

.page-history .history-box .box-items .items-container .container-info .info-time {
	flex:1 0 auto;
	
	display:flex;
	justify-content:stretch;
	align-items:stretch;
}

.page-history .history-box .box-items .items-container .container-info .info-time .time-title {
	flex:0 0 auto;
	
	display:flex;
	justify-content: center;
	align-items: center;
	padding:0.25rem;
}

.page-history .history-box .box-items .items-container .container-info .info-time .time-title i{
	color:red;
}

.page-history .history-box .box-items .items-container .container-info .info-time .time-value {
	flex:1 1 auto;
	padding:0.25rem;
	
	display:flex;
	justify-content: start;
	align-items: center;
}

.page-history .history-box .box-items .items-container .container-info .info-team {
	flex:1 0 60%;
	
	display:flex;
	justify-content:stretch;
	align-items:stretch;
	background:var(--main-button-bg);
	padding:0.5rem;
	border-radius:1rem;
}

.page-history .history-box .box-items .items-container .container-info .info-team .team-title {
	flex:0 0 10%;
	
	display:flex;
	justify-content: center;
	align-items: center;
	padding:0.25rem;
}

.page-history .history-box .box-items .items-container .container-info .info-team .team-home {
	flex:1 1 35%;
	padding:0.25rem;
	
	display:flex;
	justify-content: start;
	align-items: center;
}

.page-history .history-box .box-items .items-container .container-info .info-team .team-away {
	flex:1 1 35%;
	padding:0.25rem;
	
	display:flex;
	justify-content: end;
	align-items: center;
	text-align:right;
}

.page-history .history-box .box-items .items-container .container-body {
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(16.6666%,auto));
	place-content: stretch space-between;
}

.page-history .history-box .box-items .items-container .container-body .body-con {
	grid-column: auto / span 1;
	
	display:flex;
	justify-content: stretch;
	align-items: stretch;
}

.page-history .history-box .box-items .items-container .container-body .body-con .con-head {
	flex:0 0 auto;
	padding:0.25rem;
	
	display:flex;
	justify-content: center;
	align-items: center;
}

.page-history .history-box .box-items .items-container .container-body .body-con .con-head i{
	color:red;
}

.page-history .history-box .box-items .items-container .container-body .body-con .con-body {
	flex:1 1 auto;
	padding:0.25rem;
	
	display:flex;
	justify-content: start;
	align-items: center;
}




.color-orange {
	color: var(--special-font-color);
}

.color-red {
	color: #f15454;
}

.color-blue {
	color: #5458f1;
}

@media all and (max-width:1400px) {
	nav {
		grid-template-columns: repeat(auto-fit, minmax(180px, auto));
	}
	nav .nav-top {
		grid-template-columns: 180px;
	}
	
	nav .navi-time {
		display:none;
	}
}

@media all and (max-width:1200px) {
	html {
		font-size:12px;
	}
	nav {
		grid-template-columns: repeat(auto-fit, minmax(100px, auto));
	}
	nav .nav-top {
		grid-template-columns: 100px;
	}

	.container {
		grid-template-columns: 1fr 300px;
	}
	
	.container .con-1 {
		position:absolute;
		top:0;
		left:-309px;
		height:100%;
		z-index:2;
		padding:1px 1px 0 0;
		background:var(--main-button-bg);
		transition:all 0.5s;
	}
	
	.container .con-1.show {
		left: -9px !important;
		transition:all 0.5s;
	}
	
	.container .con-2 {
		padding-left:2.25rem;
	}		
	
	.container .con-1 .con-show {
		display:inline-flex;
	}
	
	.page-join .join-info {
		grid-template-columns: 150px 1fr;
	}
	
	.page-money .money-info .info-value input {
		width:100%;
	}
	
	.page-history .history-box .box-items .items-container {
		padding:0.5rem 0.5rem;
	}
}

@media all and (max-width:800px) {
	html {
		font-size:10px;
	}
	
	body {
		overflow-x:hidden;
	}
	
	nav {
		z-index:3;
		position:relative;
		grid-template-columns: 1fr;
	}
	
	nav .nav-top {
		display:flex;
		height:50px;
	}
	
	nav .nav-top .logo {
		flex: 0 0 auto;
	}
	
	nav .nav-top .logo img {
		max-width:70px;
		max-height:50px;
	}
	
	nav .nav-top .mobile-menu {
		flex: 0 0 auto;
		display:inline-block;
		
		padding: 0 1rem;
		font-size:2rem;
	}
	
	nav .nav-top .navi-time {
		flex: 1 1 auto;
		display:inline-block;
	}
	
	nav .member-info {
		display:block;
	}
	
	nav .nav-menu {
		position:fixed;
		z-index:10;
		top:50px;
		right:-100%;
		background:var(--main-button-bg);
		height:calc(100% - 50px);
		overflow:scroll;
		padding:1rem 1.5rem 50px 1.5rem;
		
		transition:all 0.5s;

		grid-template-columns:auto;
		grid-template-rows:repeat(2, auto);
		align-content: start;
		place-items:start start;
	}
	
	nav .nav-menu.show {
		right:0;
		transition:all 0.5s;
	}
	
	nav .nav-menu .nav_buttons {
		display:block;
	}
	
	nav .nav-menu .navi {
		grid-column: 1 / span 1;
		grid-row: 2 / span 1;
		place-self: start start;
		order:2;
		
		display:grid;
		grid-template-columns:auto;
		align-content: start;
		place-items:start start;
	}
	nav .nav-menu .navi .nav_button {
		order:2;
	}
	nav .nav-menu .navi .nav_button_l {
		order: 1;
	}
	
	nav .nav-menu .navi-sub {
		grid-column: 1 / span 1;
		grid-row: 3 / span 1;
		place-self: start start;
		order:3;
		
	}
	
	nav .nav-menu .member-info {
		grid-column: 1 / span 1;
		grid-row: 1 / span 1;
		place-self: start start;
		order:1;
	}
	
	.container {
		grid-template-columns: 1fr;
	}
	
	.container .con-2 {
		padding: 0 8px;
	}
	
	.container .con-2 . {
		padding: 0 8px;
	}

	.container .con-3 {
		position:fixed;
		top:calc(100% - 50px);
		left:0;
		z-index:2;
		width:100%;

		
		transition:all 0.5s;
	}
	
	.container .con-3 .container-member {
		position:fixed;
		top:50px;
		left:0;
		width:100%;
		height:calc(100% - 50px);
		background-color: rgba(0,0,0,0.5);
		
		display:none;
		justify-content:center;
		align-items:center;
		flex-wrap:wrap;
	}
	
	.container .con-3 .container-member .name-close {
		display:flex;
		justify-content:center;
		align-items:center;
		flex-wrap:wrap;
		color:#fff;
	}

	.container .con-3 .cart-pop {
		display:block;
	}
	
	.container .con-3.show {
		top: 0 !important;
		transition:all 0.5s;
		z-index:4;
	}
	
	.container .con-3 iframe {
		padding:10px 0 0 0;
		width:calc(100% - 2px);
		border-left:1px solid var(--main-border-color);
		border-right:1px solid var(--main-border-color);
		background:var(--main-button-bg);
	}
	
	
	.page-money .money-info {
		display: grid;
		grid-template-columns: 100px 1fr;
		grid-auto-rows: minmax(30px, auto);
		place-items: stretch stretch;
		
		grid-column: auto / span 1;
	}
	
	.main .board {
		grid-column: auto / span 2;
	}

	

}