#commonbody{

}

#contentsbody>h1.contenttitle{
}
#contentsbody>h1.contenttitle>span{

}
#contentsbody>h1.contenttitle>span:before{
	background-image:url(img/hd3-game.png);
}


#gamelistmainbox{
	max-width:1152px;
	margin:0px auto;
	padding-top:1%;
	text-align:center;
}

a img{
	border:0px;
}

#gamelistmainbox section ul{
	list-style:none outside;
	max-width:98%;
	margin:0 auto;
	padding:0;
	text-align:left;
}


#gamelistmainbox .gametitle,
#gamelistmainbox .gameinfo{
	display:none;
}

#gamelistmainbox section>ul>li{
	display:inline-block;
	background-image:url(img/gameboxbg1.png);
	background-size:cover;
	background-repeat:no-repeat;
	position:relative;
	font-size:0;
	line-height:0;
	width:24.2%;
	margin:0.4%;
	overflow:hidden;
	border-radius: 4.5%/3.5%;
}


#norgames>ul li.new:after{
	position: absolute;
	content:"";
	display:block;
	width:28%;
	height:11%;
	left:0%;
	top:0%;
	z-index:2;
	background-image:url(/bitworld/jcs_2021/imgs/newicon.png);
	background-size: contain;
	background-repeat: no-repeat;
	cursor: pointer;
	user-select: none;
	pointer-events: none; 
}

#norgames>ul li:hover{
	-webkit-filter: brightness(1.1);
	   -moz-filter: brightness(1.1);
	    -ms-filter: brightness(1.1);	
	     -o-filter: brightness(1.1);
	        filter: brightness(1.1);
}



#gamelistmainbox section>ul>li a{
	width:100%;
	height:100%;
	color:#ffffff;
	text-decoration:none;
	position:relative;
	display:block; /* android 4.1では a:afterをblockでふくらますには親のaもblockでないといけない */
}
#gamelistmainbox section li a:before{
	content:"";
	display:block;
	padding-top:77.378%;
}
#gamelistmainbox section li.linkjump a:after{
	position:absolute;
	bottom:21.5%;
	left:6.5%;
	right:6.5%;
	content:"";
	display:block;
	background-color:#ffffff;
	background-image:url(img/abar_h.gif);
	background-repeat:no-repeat;
	background-position:center bottom;
	background-size:contain;
	z-index:1;
	padding-bottom:10%;
}
#gamelistmainbox section li.linkjump:hover a:after{
	background-image:url(img/abar_n.gif);
}

#gamelistmainbox section>ul>li>a>img{
	position:absolute;
	left:6.5%;
	width:87%;
	top:5.7%;
	z-index:2;
}



@media screen and (max-width:480px){
	#gamelistmainbox section ul li{
		width:48%;
		margin:1% 1%;
	}

	#gamelistmainbox section>ul>li:nth-child(4n+2),
	#gamelistmainbox section>ul>li:nth-child(4n+3){
		background-image:url(img/gameboxbg2.png);
	}
}
@media screen and (min-width:480.001px){
	#gamelistmainbox section>ul>li:nth-child(8n+2),
	#gamelistmainbox section>ul>li:nth-child(8n+4),
	#gamelistmainbox section>ul>li:nth-child(8n+5),
	#gamelistmainbox section>ul>li:nth-child(8n+7){
		background-image:url(img/gameboxbg2.png);
	}
	
}

@media screen and (min-width:480.001px) and (max-width:1200px){
	
}
@media screen and (min-width:1200.001px){

}

/* game-iframe */
#openlayerbox iframe{
	overflow:hidden;
}


/* gamecontentspage */
#gamemainbox{
	margin:1% auto 0;
	padding:0;
	text-align:center;
	position:relative;
	width:100%;
	
}
#gamemainbox:before{
	display:block;
	content:"";
}


#gamemaincontent{
	display:inline-block;
	text-align: center;
	margin:0 auto;
	padding:0;
	
}

#gameplaydetails{
	padding:1% 2%;
	text-align:left;
	margin-top:1%;
	border:1px solid #000000;
	border-radius:4px;
	margin:1% auto 1%;
	font-size:1.7rem;
	background-color:rgba(255,255,255,0.8);
}

#gamemainbox .flashguide{
	width:100%;
	margin:0 auto 1%;
	font-size:1.3rem;
	background-color:rgba(255,255,255,0.8);
}

#gamemainbox h3{
	margin-top:3%;
	border-bottom:1px solid #000000;
	font-size:1.8rem;
}
#gamemainbox ul.playrules{
	list-style:disc outside;
	text-align:left;
	margin:0% 0% 2%;
	padding:1% 0% 0% 2em;
	font-size:1.6rem;
}
#gamemainbox ul.playrules li{
	margin-bottom:1%;
	border-bottom:1px solid #cccccc;
}


/* FAQ */
/* faqpage */
#faqlistbox{
	padding-top:1%;
	max-width:800px;
	text-align:center;
	margin:0 auto;
}
#faqlistbox a{
	color:#0000ff !important;
}
#faqlistbox a:hover{
	color:#cc0000 !important;
	background-color:#ffffcc;
}

#faqlistbox h1{
	width:60%;	
	margin-bottom:1%;
	
	display:inline-block;
	background:url(img/faqtitle.png) 0px 0px no-repeat;
	background-size:cover;
	position:relative;
}
#faqlistbox h1:before{
	content:"";
	display:block;
	padding-top:10.782608%; /* 62/515 */
	font-size:0rem;
}



#faqlistbox dl{
	width:100%;
	border:0.5rem solid #999999;
	background-color:#999999;
	border-radius:1em;
	display:block;
	font-size:1.5rem;
	margin-bottom:1%;
	margin-top:1%;
	text-align:left;
}
#faqtofureai{
	width:100%;
	border:0.5rem solid #999999;
	background-color:#ffcccc;
	border-radius:1em;
	display:block;
	font-size:1.8rem;
	margin-bottom:2%;
	margin-top:3%;
	text-align:left;
	padding:2%;
	text-align:center;
}

#faqlistbox dt,
#faqlistbox dd{
	display:block;
	width:100%;
	padding-left:6%;
	padding-right:1%;
}
#faqlistbox dt:after,
#faqlistbox dd:after{
	display:block;
	content:"";
	padding-top:1%;
	
}
#faqlistbox dt{
	border-radius:0.5em 0.5em 0 0;
	padding-top:1%;
	font-size:1.3em;
	
	background:#ccffff url(img/icon-q.png) 3px 3px no-repeat;
	background-size:5% auto;
	min-height:2.6em;
}
#faqlistbox dd{
	border-radius: 0 0 0.5em 0.5em;
	padding-top:0.5%;
	font-size:1.2em;
	background:#ffcccc url(img/icon-a.png) 3px 3px no-repeat;
	background-size:5% auto;
	min-height:3.6em;
}
@media screen and (max-width:400px){
	#faqlistbox h1{
		width:100%;
	}
	#faqlistbox dl{
		font-size:2.5rem;
	}
	#faqlistbox dt,
	#faqlistbox dd{
		padding-top:12% ;
		padding-left:4%;
		padding-right:2%;
		background-size:10% auto;
	}
	#faqlistbox dt{
		font-size:2em;
	}
	#faqlistbox dd{
		font-size:1.8em;
	}
	#faqtofureai{
		font-size:4rem;
		text-align:left;
	}

	#faqlistbox dt:after,
	#faqlistbox dd:after{
		padding-top:3% !important;
		
	}
}
@media screen and (min-width:400.1px) and (max-width:600px){
	#faqlistbox h1{
		width:100%;
	}

	#faqlistbox dl{
		font-size:2rem;
	}
	#faqlistbox dt{
		font-size:2em;
	}
	#faqlistbox dd{
		font-size:1.8em;
	}
	#faqtofureai{
		font-size:2.4rem;
	}

	#faqlistbox dt:after,
	#faqlistbox dd:after{
		padding-top:3% !important;
		
	}
}
@media screen and (min-width:600.1px) and (max-width:768px){
	#faqlistbox h1{
		width:100%;
	}

	#faqlistbox dl{
		font-size:2rem;
	}
	#faqlistbox dt{
		font-size:1.5em;
	}
	#faqlistbox dd{
		font-size:1.3em;
	}
	#faqtofureai{
		font-size:2.4rem;
	}

	#faqlistbox dt:after,
	#faqlistbox dd:after{
		padding-top:3% !important;
		
	}
}

@media screen and (min-width:768.1px) and (max-width:960px){
	#faqlistbox h1{
		width:66%;
	}
	#faqlistbox dl{
		font-size:1.8rem;
	}
	#faqtofureai{
		font-size:2.2rem;
	}

	#faqlistbox dt:after,
	#faqlistbox dd:after{
		padding-top:3% !important;
		
	}
}
@media screen and (min-width:960.1px){
	#faqlistbox dt:after,
	#faqlistbox dd:after{
		padding-top:2% !important;
		
	}
}



#faqlistbox ul{
	list-style:decimal outside;
	margin:0 0 0 3rem;
}
#faqlistbox ul li{
	padding-bottom:0.5rem;	
}