@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&display=swap&subset=japanese');
@import url('https://fonts.googleapis.com/css?family=Press+Start+2P&display=swap');
body {
	background:#000;
	color:#FFF;
	font-family: 'Noto Sans JP', sans-serif;
}
#game:before {
	content:'';
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:url(game/screenshot_1.jpg) no-repeat center center / cover;
	opacity:0.3;
	transition:all 0.5s ease;
}
#game.t2:before {
	opacity:0;
}
#game:after {
	content:'';
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:url(game/screenshot_2.jpg) no-repeat center center / cover;
	opacity:0;
	transition:all 1s ease;
}
#game.t2:after {
	opacity:0.3;
}
#gameWrap {
	position: relative;
	width:100%;
	min-width: 1210px;
	min-height:620px;
	padding-top:20px;
	overflow:hidden;
	z-index:50;
}
#gameWrap:before {
	content:'';
	position:absolute;
	left:0;
	right:0;
	bottom: calc(100% - 60px);
	top:-100%;
	background:#F06;
	transform-origin:center bottom;
	transform:skewY(-3deg);
}
#logo { height: 100px;text-align:center;position:relative; }
h1 {
	color:#000;
	font-size:26px;
	font-weight:700;
	text-align:center;
	margin:0 auto 40px;
	position:relative;
}
h1:before {
	content:'';
	position:absolute;
	background:rgba(35,219,22,1);
	left:0;
	top:0;
	right:0;
	bottom:0;
	transform:skewX(25deg);
}
h1 span {
	position:relative;
}
#gamein {
	width:900px;
	margin:0 auto;
	padding-top:30px;
}
#gamein p {
	font-size:15px;
	line-height:28px;
	padding:0 20px 20px;
}
#gamein p strong {
	background:#f06;
	color:#000;
	display:inline-block;
	padding:0 5px;
	margin-right:5px;
}
#gamein2 {
	width: 900px;
	margin: 0 auto;
	padding: 30px 0px 60px;
}
#gamein2 p {
	font-size:15px;
	line-height:28px;
	padding:0 20px 20px;
}
#gamein2 p strong {
	background:#f06;
	color:#000;
	display:inline-block;
	padding:0 5px;
	margin-right:5px;
}
h2 {
	color:#000;
	font-size:16px;
	font-weight:700;
	text-align:center;
	margin-bottom:20px;
	position:relative;
	display:table;
	padding:0 15px;
	margin-top:30px;
}
h2:before {
	content:'';
	position:absolute;
	background:#F06;
	left:0;
	top:0;
	right:0;
	bottom:0;
	transform:skewX(25deg);
}
h2 span {
	position:relative;
}
#gamein > ul,
#gamein2 > ul {
	padding:0 20px 20px;
	font-size:16px;
}
#gamein > ul li,
#gamein2 > ul li {
	line-height:32px;
}
#manual {
	height: 481px;
	width: 806px;
	margin: 0 auto 40px;
	position: relative;
	font-weight:bold;
}
#manual ul {
	border: 3px solid #23DB16;
	height:475px;
	width:800px;
	margin:0 auto;
}
#manualPrev {
	height: 50px;
	width: 50px;
	position: absolute;
	left: -50px;
	top: 50%;
	display:block;
	box-sizing:border-box;
	line-height:50px;
	color:#000;
	text-align:right;
	padding-right:0px;
	text-decoration:none;
	font-size:16px;
	margin-top:-25px;
	transform-origin:right center;
}
#manualPrev:hover {
	transform:scale(1.1);
}
#manualPrev span {
	position:relative;
}
#manualPrev:before {
	content:'';
	position:absolute;
	width: 0;
height: 0;
border-style: solid;
border-width: 25px 25px 25px 0;
border-color: transparent #23db16 transparent transparent;
right:0;
top:0;
}
#manualNext {
	height: 50px;
	width: 50px;
	position: absolute;
	right: -50px;
	top: 50%;
	display:block;
	box-sizing:border-box;
	line-height:50px;
	color:#000;
	text-decoration:none;
	font-size:16px;
	transform-origin:left center;
	margin-top:-25px;
}
#manualNext:hover {
	transform:scale(1.1);
}
#manualNext span {
	position:relative;
}
#manualNext:before {
	content:'';
	position:absolute;
	width: 0;
height: 0;
border-style: solid;
border-width: 25px 0 25px 25px;
border-color: transparent transparent transparent #23db16;
	left:0;
	top:0;
}
#gameMain {
	width:1136px;
	margin:0 auto 40px;
	border:3px solid #F06;
	position:relative;
	height:639px;
	padding: 18px 32px;
	background:#000;
}
#gameMain a {
	background: rgba(0,0,0,0.8);
	position: absolute;
	z-index: 5000;
	left:0;
	right:0;
	top:0;
	bottom:0;
	color:#FFF;
	font-size:24px;
	line-height:675px;
	text-align:center;
	text-decoration:none;
	font-family: 'Press Start 2P', cursive;
}
#gameMain a span {
	animation:blink 0.6s steps(1) infinite alternate;
}
@keyframes blink {
	0% {
		opacity:0;
	}
	51% {
		opacity:1;
	}
}
#scs {
	background: url(game/screenshot_4.jpg) no-repeat center center / cover;
	position: absolute;
	z-index: 4999;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
}
footer { padding-top: 80px;	position:relative;}
#footerLogo {
	text-align:center;
	position:relative;
	margin-bottom:40px;
}
footer:before {
	content:'';
	position:absolute;
	top:0;
	right:0;
	left:0;
	bottom:-200%;
	background:#F06;
	transform-origin:center top;
	transform:skewY(-3deg);
}
#footerToTop {
	margin: 0px auto 40px;
	height: 50px;
	width: 400px;
	position:relative;
}
#footerToTop a {
	display:block;
	line-height:50px;
	background:#23DB16;
	color:#000;
	text-decoration:none;
	text-align:center;
	font-size:24px;
	font-weight:bold;
}
#footerToTop a:hover {
	transform:scale(1.05);
}
#copyright {
	color: #FFF;
	text-align: center;
	padding-bottom: 50px;
	position:relative;
}
.sp {
	display:none;
}
@media screen and (max-width:661px) {
	#gameWrap {
		width:640px;
		min-width:640px;
	}
	#gamein,
	#gamein2 {
		width:600px;
	}
	#gamein p,
	#gamein2 p {
		font-size:20px;
		line-height:38px;
	}
	h2 {
		font-size:20px;
		text-align:left;
		line-height:32px;
	}
	.sp {
		
		display:inherit !important;
	}
	#gamein > ul,
	#gamein2 > ul {
		font-size:20px;
	}
	#gamein > ul li,
	#gamein2 > ul li {
		line-height:40px;
	}
	#gameMain {
		display:none;
	}
	#manual {
		width:506px;
		height:303px;
	}
	#manual ul {
		border: 3px solid #23DB16;
		height:297px;
		width:500px;
		margin:0 auto;
	}
	#manual li {
		height:297px;
		width:500px;
	}
	#manual li img {
		height:297px;
		width:500px;
	}
}
#spCaution {
	height: 120px;
	position: fixed;
	left: 0px;
	right: 0px;
	bottom: 0px;
	background: #23DB16;
	padding: 20px;
	font-size:20px;
	line-height:34px;
	color:#000;
	font-weight:bold;
	box-sizing:border-box;
	text-align:center;
	display:none;
	z-index:5000;
}
#spinCaution {
	left: 0px;
	right: 0px;
	bottom: 0px;
	border:solid 3px #F06;
	padding: 20px;
	font-size:24px;
	line-height:34px;
	color:#F06;
	font-weight:bold;
	box-sizing:border-box;
	text-align:center;
	display:none;
	z-index:5000;
	width:600px;
	display:none;
	margin:0 auto 40px;
}
#gamein #me {
	font-size: 22px;
	color: #F00;
	font-weight:bold;
	position:relative;
	display:table;
	margin: 0 auto 30px;
	padding:4px 20px;
}
#gamein #me:before{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	border:2px solid #F00;
	transform:skewX(25deg)
}