/*--------------
	アニメーション
---------------------*/


.illust01::before{
	position:absolute;
	z-index:10;
	content:"";
	top: -250px;
	left : -200px;
	display:block;
	width:479px;
	height:288px;
	background:url("../images/style/illust01.png") no-repeat 0 0;
	background-size:100% 100%;
	animation: anime11 1s ease-in 0s 1 normal /*, anime12 0.5s linear -5s infinite normal */;
}

@keyframes anime11 {
	0% {
		top: -250px;
		left : -1000px;
		opacity:0;
	}
	100% {
		top: -250px;
		left : -200px;
		opacity:1;
	}
}
@keyframes anime12 {
	0% {		transform: rotateZ(0deg);	}
	25% {		transform: rotateZ(2deg);	}
	50% {		transform: rotateZ(0);}
	75% {		transform: rotateZ(-2deg);}
	100% {		transform: rotateZ(0);}
}

.illust02::before{
	position:absolute;
	z-index:10;
	content:"";
	top: -100px;
	right : -180px;
	display:block;
	width:441px;
	height:306px;
	background:url("../images/style/illust02.png") no-repeat 0 0;
	background-size:100% 100%;
	animation: anime21 1s ease-in 0s 1 normal /* , anime12 0.5s linear -5s infinite normal*/;
}
@keyframes anime21 {
	0% {
		top: -100px;
		right : -1000px;
		opacity:0;
	}
	100% {
		top: -100px;
		right : -180px;
		opacity:1;
	}
}


.illust03::before{
	position:absolute;
	z-index:10;
	content:"";
	top: 6em;
	left : -190px;
	width:195px;
	height:477px;
	display:block;
	background:url("../images/style/illust03.png") no-repeat 0 0;
	background-size:100% 100%;
}
.illust04::before{
	position:absolute;
	z-index:10;
	content:"";
	display:block;
	bottom: -94px;
	right : -40px;
	width:235px;
	height:423px;
	background:url("../images/style/illust04.png") no-repeat 0 0;
	background-size:100% 100%;
}

.illust05::before{
	position:absolute;
	z-index:10;
	content:"";
	display:block;
	top: -25px;
	right : -120px;
	width:386px;
	height:280px;
	background:url("../images/style/illust05.png") no-repeat 0 0;
	background-size:100% 100%;
}

.illust06::before{
	position:absolute;
	z-index:10;
	content:"";
	display:block;
	top: 48px;
	right : -240px;
	width:599px;
	height:362px;
	background:url("../images/style/illust06.png") no-repeat 0 0;
	background-size:100% 100%;
}



@media screen and (max-width: 1000px){

	/*--------------
		アニメーション
	---------------------*/
	
	.illust01::before{
		top: -25vw;
		left : -20vw;
		width:47.9vw;
		height:28.8vw;
	}
	
	@keyframes anime11 {
		0% {
			top: -25vw;
			left : -100vw;
		}
		100% {
			top: -25vw;
			left : -20vw;
		}
	}
	
	.illust02::before{
		top: -10vw;
		right : -18vw;
		width:44.1vw;
		height:30.6vw;
	}
	@keyframes anime21 {
		0% {
			top: -10vw;
			right : -100vw;
			opacity:0;
		}
		100% {
			top: -10vw;
			right : -18vw;
			opacity:1;
		}
	}

	.illust03::before{
		top: 6vw;
		left : -19vw;
		width:19.5vw;
		height:47.7vw;
	}
	.illust04::before{
		bottom: -9.4vw;
		right : -4vw;
		width:23.5vw;
		height:42.3vw;
	}
	.illust05::before{
		top: -2.5vw;
		right : -12vw;
		width:38.6vw;
		height:28vw;
	}
	.illust06::before{
		top: 4.8vw;
		right : -24vw;
		width:59.9vw;
		height:36.2vw;
	}
	

}

@media screen and (max-width: 640px){

	#contentsLinks ul{
		display:block;
	}
	#contentsLinks ul > li{
		display:block;
		width:80%;
		margin:10px 10% 20px;
		
	}
	#contentsLinks ul > li a span._b span{
		font-size:3.2em;
	}
	
	#contentsLinks h2{		font-size:8em;	}
	#messageBox div {    	font-size: 1.44em;	}
	
	.illust01::before,
	.illust02::before,
	.illust03::before,
	.illust04::before,
	.illust05::before,
	.illust06::before,
	.illust07::before{
		display:none;
	}

}