.tocsscreen {
  position: fixed;
  top: -500px;
  bottom: 0;
  left: 0;
  right: 0;
  transition: opacity 200ms;
	-webkit-transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
    -o-transition:all 0.5s ease;
    transition:all 0.5s ease;
  background-image: var(--cstogamebg2);
  visibility: hidden;
  opacity: 0;
  z-index:1006;
}
.cspageheader_close{
	position:fixed;
	left:2.5%;
}
#world{
	background-color:transparent;
	position:fixed;
	top:0px;
	height:100VH;
	width:100%;
	z-index:-1;
}

.tocsactive {
	overflow:auto;
  top: 0px;	
  visibility: visible;
  opacity: 1;
}


.cstopbar{
	height:50px;
	width:100%;
	position:fixed;
	background-color:var(--cstogamebg);
	z-index:1006;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cspageheader{
	text-align:center;
	width: 100%;
	box-shadow:none;
	color:#000;
	position:fixed;
	background-color:var(--cstogamebg);
    display: flex;
    align-items: center;
    justify-content: center;
}

.cspageheader .toptitle{
	font-size:20px;
    color:var(--sec_bg_title);
	font-family: 'Noto Sans SC', sans-serif;
}

.backsymbol{
	position:fixed;
	top:5px;
	right:20px;
	color:var(--main);
	font-size:30px;
	z-index:9999;
}

.csimage{
	width:100%;
	margin-top:50px;
	background-color:var(--cstogamebg);
}

.csimage img{
	width:100%;
}

.infopart{
	margin-top:10px;
	color:var(--bfont);
	padding:0px 25px;
	font-size:13px;
	background-color:transparent;
	z-index:9;
}

.gamerewardper{
	color:var(--main);
}

.csbalancebox{
	margin-top:10px;
}

.csbalbox{
	float:left;
	width:100%;
	padding:10px 0px;
	border-top:var(--ttbarbordert);
				border-bottom:var(--ttbarborderb);
				border-width: 1px;
				border-style: solid;
				border-image: linear-gradient(to right, #291F06 , #F9BB22 ,#291F06) 1 1 1 1;
	text-align:center;
}

.csbalbox img{
	height:35px;
	width:35px;
	margin-top:5px;
	margin-left:10px;
	margin-bottom:-5px;
}

.csbalbox .csbaldetail{
	color:var(--bfont);
	font-size:13px;
	text-align:center;
	padding:0px 15px 0px 15px;
}

.csbtn{
	margin-top:10px;
	border:none;
	height:45px;
	width:100%;
	background-image:var(--m_topbtn);
	color:black;
	font-weight:bold;
	cursor:pointer;
	font-size:14px;
	font-family: 'Roboto', sans-serif;
	border-radius:3px;
	transition: opacity 200ms;
	-webkit-transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
    -o-transition:all 0.5s ease;
    transition:all 0.5s ease;
}

.csbtnhide{
	display:none;
}


/*notiscreen*/
.notiscreen{
	position: fixed;
	height:100vh;
	  top: -1000px;
	  left: 0;
	  right: 0;
	  transition: opacity 200ms;
		-webkit-transition:all 0.5s ease;
		-moz-transition:all 0.5s ease;
		-ms-transition:all 0.5s ease;
		-o-transition:all 0.5s ease;
		transition:all 0.5s ease;
	  background: white;
	  z-index:999;
	  visibility: hidden;
	  opacity: 0;
}

.notiactive{
	overflow:auto;
  top: 0px;	
  visibility: visible;
  opacity: 1;
}

.notiheader{
	text-align:center;
	width: 100%;
	box-shadow:none;
	color:#000;
	height:60px;
	vertical-align:middle;
	background-color:var(--lgrey);
}

.notiheader .toptitle{
	padding-top:10px;
	color:var(--main);
	font-size:20px;
	font-family: 'Noto Sans SC', sans-serif;
}

.notidetailbox{
	margin-top:10px;
	color:var(--bfont);
	padding:0px 25px;
	width:100%;
	word-break: break-all;
}

.notidetailbox .notititle{
	font-size:15px;
	padding:5px 0px;
	font-weight:bold;
	color:var(--main);
}

.notidetailbox #infodetail{
	font-size:11px;
}
/*notiscreen---end---*/
.deskcstg_cont{
	margin: 0 auto;
    width: 100%;
    max-width: 1200px;
    margin-left: -10px;
}
.cstogamebox{
	width:100%; 
	margin-top:0px;
	display:flex;
	flex-wrap:wrap;
}

.gamelistcontain .gamelistbox_csgame{
	float:left;
	width:20%;
	text-align:center;
	margin-bottom:10px;
	animation-name: pop-in;
	animation-duration: .18s;
	animation-fill-mode: forwards;
	animation-timing-function: ease-in-out display: block;
	display:flex;
    flex-direction: column;
}


.gamelistcontain .gamelistbox_csgame img{
	width:90%;
	height:90%;
	margin-left:-45%;
	margin-top:-92.5%;
	position:absolute;
	border-radius:9px;
}


@media only screen and (max-width: 1025px) {
	
.cstogamebox{
	width:103%; 
	margin-left:-1.5%;
	margin-top:0px;
	display:flex;
	flex-wrap:wrap;
}

.gamelistcontain .gamelistbox_csgame{
	float:left;
	width:33%;
	text-align:center;
	margin-bottom:10px;
	animation-name: pop-in;
	animation-duration: .18s;
	animation-fill-mode: forwards;
	animation-timing-function: ease-in-out display: block;
}


.gamelistcontain .gamelistbox_csgame img{
	width:90%;
	height:90%;
	margin-left:-45%;
	margin-top:-92.5%;
	position:absolute;
	border-radius:9px;
}
/*mobile*/
}