@charset "UTF-8";

/*スライドイン*/

.anim_title {
	-webkit-animation: 2s forwards anim_title;
	animation: 2s forwards anim_title;
}
	@-webkit-keyframes anim_title {
		0% {
			-webkit-transform: translate(0, 500px);
			opacity: 0;
		}
		100% {
			-webkit-transform: translate(0, 0);
			opacity: 1;
		}
	}
	@keyframes anim_title {
		0% {
			transform: translate(0, 20px);
			opacity: 0;
		}
		100% {
			transform: translate(0, 0);
			opacity: 1;
		}
	}
.anim1 {
	-webkit-animation: 3s forwards anim1;
	animation: 3s forwards anim1;
}
	@-webkit-keyframes anim1 {
		0% {
			-webkit-transform: translate(0, 500px);
			opacity: 0;
		}
		100% {
			-webkit-transform: translate(0, 0);
			opacity: 1;
		}
	}
	@keyframes anim1 {
		0% {
			transform: translate(0, 50px);
			opacity: 0;
		}
		100% {
			transform: translate(0, 0);
			opacity: 1;
		}
	}

.anim1-2 {
	-webkit-animation: 3s forwards anim1-2;
	animation: 3s forwards anim1-2;
}
	@-webkit-keyframes anim1-2 {
		0% {
			-webkit-transform: translate(0, -50px);
			opacity: 0;
		}
		100% {
			-webkit-transform: translate(0, 0);
			opacity: 1;
		}
	}
	@keyframes anim1-2 {
		0% {
			transform: translate(0, -50px);
			opacity: 0;
		}
		100% {
			transform: translate(0, 0);
			opacity: 1;
		}
	}

.anim1-3 {
	-webkit-animation: 1.5s forwards anim1-3;
	animation: 1.5s forwards anim1-3;
}
	@-webkit-keyframes anim1-3 {
		0% {
			-webkit-transform: translate(-100px, 0);
			opacity: 0;
		}
		100% {
			-webkit-transform: translate(0, 0);
			opacity: 1;
		}
	}
	@keyframes anim1-3 {
		0% {
			transform: translate(-100px, 0);
			opacity: 0;
		}
		100% {
			transform: translate(0, 0);
			opacity: 1;
		}
	}

.anim1-4 {
	-webkit-animation: 1.5s forwards anim1-4;
	animation: 1.5s forwards anim1-4;
}
	@-webkit-keyframes anim1-4 {
		0% {
			-webkit-transform: translate(100px, 0);
			opacity: 0;
		}
		100% {
			-webkit-transform: translate(0, 0);
			opacity: 1;
		}
	}
	@keyframes anim1-4 {
		0% {
			transform: translate(100px, 0);
			opacity: 0;
		}
		100% {
			transform: translate(0, 0);
			opacity: 1;
		}
	}





/*残像スライドイン*/
.anim2 {
	-webkit-animation: 2s forwards anim2;
	animation: 2s forwards anim2;
}
	@-webkit-keyframes anim2 {
		0% {
			-webkit-text-shadow: rgba(0, 0, 0, 1) 0 10px 0;
			opacity: 0;
		}
		100% {
			-webkit-text-shadow: rgba(0, 0, 0, 0) 0 0 0;
			opacity: 1;
		}
	}
	@keyframes anim2 {
		0% {
			text-shadow: rgba(0, 0, 0, 1) 0 10px 0;
			opacity: 0;
		}
		100% {
			text-shadow: rgba(0, 0, 0, 0) 0 0 0;
			opacity: 1;
		}
	}

.anim2-2 {
	-webkit-animation: 2s forwards anim2-2;
	animation: 2s forwards anim2-2;
}
	@-webkit-keyframes anim2-2 {
		0% {
			-webkit-text-shadow: rgba(0, 0, 0, 1) 0 -10px 0;
			opacity: 0;
		}
		100% {
			-webkit-text-shadow: rgba(0, 0, 0, 0) 0 0 0;
			opacity: 1;
		}
	}
	@keyframes anim2-2 {
		0% {
			text-shadow: rgba(0, 0, 0, 1) 0 -10px 0;
			opacity: 0;
		}
		100% {
			text-shadow: rgba(0, 0, 0, 0) 0 0 0;
			opacity: 1;
		}
	}

.anim2-3 {
	-webkit-animation: 2s forwards anim2-3;
	animation: 2s forwards anim2-3;
}
	@-webkit-keyframes anim2-3 {
		0% {
			-webkit-text-shadow: rgba(0, 0, 0, 1) -10px 0px 0;
			opacity: 0;
		}
		100% {
			-webkit-text-shadow: rgba(0, 0, 0, 0) 0 0 0;
			opacity: 1;
		}
	}
	@keyframes anim2-3 {
		0% {
			text-shadow: rgba(0, 0, 0, 1) -10px 0px 0;
			opacity: 0;
		}
		100% {
			text-shadow: rgba(0, 0, 0, 0) 0 0 0;
			opacity: 1;
		}
	}

.anim2-4 {
	-webkit-animation: 2s forwards anim2-4;
	animation: 2s forwards anim2-4;
}
	@-webkit-keyframes anim2-4 {
		0% {
			-webkit-text-shadow: rgba(0, 0, 0, 1) 10px 0px 0;
			opacity: 0;
		}
		100% {
			-webkit-text-shadow: rgba(0, 0, 0, 0) 0 0 0;
			opacity: 1;
		}
	}
	@keyframes anim2-4 {
		0% {
			text-shadow: rgba(0, 0, 0, 1) 10px 0px 0;
			opacity: 0;
		}
		100% {
			text-shadow: rgba(0, 0, 0, 0) 0 0 0;
			opacity: 1;
		}
	}







/*ズーム*/
/*拡大*/
.anim3 {
	-webkit-animation: 1.5s forwards anim3;
	animation: 1.5s forwards anim3;
}
	@-webkit-keyframes anim3 {
		0% {
			-webkit-transform: scale(0.2, 0.2);
			opacity: 0;
		}
		100% {
			-webkit-transform: scale(1, 1);
			opacity: 1;
		}
	}
	@keyframes anim3 {
		0% {
			transform: scale(0.2, 0.2);
			opacity: 0;
		}
		100% {
			transform: scale(1, 1);
			opacity: 1;
		}
	}

/*縮小*/
.anim3-2 {
	-webkit-animation: 1.5s forwards anim3-2;
	animation: 1.5s forwards anim3-2;
}
	@-webkit-keyframes anim3-2 {
		0% {
			-webkit-transform: scale(1.5, 1.5);
			opacity: 0;
		}
		100% {
			-webkit-transform: scale(1, 1);
			opacity: 1;
		}
	}
	@keyframes anim3-2 {
		0% {
			transform: scale(1.5, 1.5);
			opacity: 0;
		}
		100% {
			transform: scale(1, 1);
			opacity: 1;
		}
	}

/*縦方向縮小*/
.anim3-3 {
	-webkit-animation: 1.5s forwards anim3-3;
	animation: 1.5s forwards anim3-3;
}
	@-webkit-keyframes anim3-3 {
		0% {
			-webkit-transform: scale(1, 5);
			opacity: 0;
		}
		100% {
			-webkit-transform: scale(1, 1);
			opacity: 1;
		}
	}
	@keyframes anim3-3 {
		0% {
			transform: scale(1, 5);
			opacity: 0;
		}
		100% {
			transform: scale(1, 1);
			opacity: 1;
		}
	}

/*縦方向拡大*/
.anim3-4 {
	-webkit-animation: 1.5s forwards anim3-4;
	animation: 1.5s forwards anim3-4;
}
	@-webkit-keyframes anim3-4 {
		0% {
			-webkit-transform: scale(1, 0);
			opacity: 0;
		}
		100% {
			-webkit-transform: scale(1, 1);
			opacity: 1;
		}
	}
	@keyframes anim3-4 {
		0% {
			transform: scale(1, 0);
			opacity: 0;
		}
		100% {
			transform: scale(1, 1);
			opacity: 1;
		}
	}






/*回転*/
/*ぐるぐる回転*/
.anim4 {
	-webkit-animation: 1.5s forwards anim4;
	animation: 1.5s forwards anim4;
}
	@-webkit-keyframes anim4 {
		0% {
			-webkit-transform: rotate(-720deg) scale(0.1, 0.1);
			opacity: 0;
		}
		100% {
			-webkit-transform: rotate(0deg) scale(1, 1);
			opacity: 1;
		}
	}
	@keyframes anim4 {
		0% {
			transform: rotate(-720deg) scale(0.1, 0.1);
			opacity: 0;
		}
		100% {
			transform: rotate(0deg) scale(1, 1);
			opacity: 1;
		}
	}

/*縦回転*/
.anim4-2 {
	-webkit-animation: 1s forwards anim4-2;
	animation: 1s forwards anim4-2;
}
	@-webkit-keyframes anim4-2 {
		0% {
			-webkit-transform: scale(1, 1);
		}
		20% {
			-webkit-transform: scale(1, -1);
		}
		80% {
			-webkit-transform: scale(1, -1);
		}
		100% {
			-webkit-transform: scale(1, 1);
		}
	}
	@keyframes anim4-2 {
		0% {
			transform: scale(1, 1);
		}
		20% {
			transform: scale(1, -1);
		}
		80% {
			transform: scale(1, -1);
		}
		100% {
			transform: scale(1, 1);
		}
	}

/*横回転*/
.anim4-3 {
	-webkit-animation: 1.5s forwards anim4-3;
	animation: 1.5s forwards anim4-3;
}
	@-webkit-keyframes anim4-3 {
		0% {
			-webkit-transform: scale(-1, 1);
			opacity: 0;
		}
		100% {
			-webkit-transform: scale(1, 1);
			opacity: 1;
		}
	}
	@keyframes anim4-3 {
		0% {
			transform: scale(-1, 1);
			opacity: 0;
		}
		100% {
			transform: scale(1, 1);
			opacity: 1;
		}
	}






/*震える*/
.anim5 {
	-webkit-animation: 1.5s linear forwards anim5;
	animation: 1.5s linear forwards anim5;
}
	@-webkit-keyframes anim5 {
		0% {
			-webkit-transform: translate(20px, 20px) scale(1.2, 1.2);
		}
		5% {
			-webkit-transform: translate(-18px, -18px) scale(1.15, 1.15);
		}
		15% {
			-webkit-transform: translate(16px, 16px) scale(1.1, 1.1);
		}
		20% {
			-webkit-transform: translate(-14px, -14px) scale(1.05, 1.05);
		}
		25% {
			-webkit-transform: translate(12px, 12px) scale(1, 1);
		}
		30% {
			-webkit-transform: translate(-10px, -10px) scale(1, 1);
		}
		35% {
			-webkit-transform: translate(8px, 8px) scale(1, 1);
		}
		40% {
			-webkit-transform: translate(-6px, -6px) scale(1, 1);
		}
		45% {
			-webkit-transform: translate(4px, 4px) scale(1, 1);
		}
		50% {
			-webkit-transform: translate(-2px, -2px) scale(1, 1);
		}
		55% {
			-webkit-transform: translate(0, 0) scale(1, 1);
		}
		85% {
			-webkit-transform: translate(0, 0) scale(1, 1);
		}
		90% {
			-webkit-transform: translate(2px, 2px) scale(1, 1);
		}
		95% {
			-webkit-transform: translate(-2px, -2px) scale(1, 1);
		}
		100% {
			-webkit-transform: translate(0, 0) scale(1, 1);
		}
	}
	@keyframes anim5 {
		0% {
			transform: translate(20px, 20px) scale(1.2, 1.2);
		}
		5% {
			transform: translate(-18px, -18px) scale(1.15, 1.15);
		}
		15% {
			transform: translate(16px, 16px) scale(1.1, 1.1);
		}
		20% {
			transform: translate(-14px, -14px) scale(1.05, 1.05);
		}
		25% {
			transform: translate(12px, 12px) scale(1, 1);
		}
		30% {
			transform: translate(-10px, -10px) scale(1, 1);
		}
		35% {
			transform: translate(8px, 8px) scale(1, 1);
		}
		40% {
			transform: translate(-6px, -6px) scale(1, 1);
		}
		45% {
			transform: translate(4px, 4px) scale(1, 1);
		}
		50% {
			transform: translate(-2px, -2px) scale(1, 1);
		}
		55% {
			transform: translate(0, 0) scale(1, 1);
		}
		85% {
			transform: translate(0, 0) scale(1, 1);
		}
		90% {
			transform: translate(2px, 2px) scale(1, 1);
		}
		95% {
			transform: translate(-2px, -2px) scale(1, 1);
		}
		100% {
			transform: translate(0, 0) scale(1, 1);
		}
	}





/*影*/
.anim6 {
	-webkit-animation: 1.5s forwards anim6;
	animation: 1.5s forwards anim6;
}
	@-webkit-keyframes anim6 {
		0% {
			-webkit-text-shadow: #333 30px 0px 0, #333 29px 0px 0, #333 28px 0px 0, #333 27px 0px 0, #333 26px 0px 0, #333 25px 0px 0, #333 24px 0px 0, #333 23px 0px 0, #333 22px 0px 0, #333 21px 0px 0, #333 20px 0px 0, #333 19px 0px 0, #333 18px 0px 0, #333 17px 0px 0, #333 16px 0px 0, #333 15px 0px 0, #333 14px 0px 0, #333 13px 0px 0, #333 12px 0px 0, #333 11px 0px 0, #333 10px 0px 0, #333 9px 0px 0, #333 8px 0px 0, #333 7px 0px 0, #333 6px 0px 0, #333 5px 0px 0, #333 4px 0px 0, #333 3px 0px 0, #333 2px 0px 0, #333 1px 0px 0;
		}
		100% {
			-webkit-text-shadow: rgba(0, 0, 0, 0) 0 0 0;
		}
	}
	@keyframes anim6 {
		0% {
			text-shadow: #333 30px 0px 0, #333 29px 0px 0, #333 28px 0px 0, #333 27px 0px 0, #333 26px 0px 0, #333 25px 0px 0, #333 24px 0px 0, #333 23px 0px 0, #333 22px 0px 0, #333 21px 0px 0, #333 20px 0px 0, #333 19px 0px 0, #333 18px 0px 0, #333 17px 0px 0, #333 16px 0px 0, #333 15px 0px 0, #333 14px 0px 0, #333 13px 0px 0, #333 12px 0px 0, #333 11px 0px 0, #333 10px 0px 0, #333 9px 0px 0, #333 8px 0px 0, #333 7px 0px 0, #333 6px 0px 0, #333 5px 0px 0, #333 4px 0px 0, #333 3px 0px 0, #333 2px 0px 0, #333 1px 0px 0;
		}
		100% {
			text-shadow: rgba(0, 0, 0, 0) 0 0 0;
		}
	}

.anim6-2 {
	-webkit-animation: 1.5s forwards anim6-2;
	animation: 1.5s forwards anim6-2;
}
	@-webkit-keyframes anim6-2 {
		0% {
			-webkit-text-shadow: #333 0 -30px 0, #333 0 -29px 0, #333 0 -28px 0, #333 0 -27px 0, #333 0 -26px 0, #333 0 -25px 0, #333 0 -24px 0, #333 0 -23px 0, #333 0 -22px 0, #333 0 -21px 0, #333 0 -20px 0, #333 0 -19px 0, #333 0 -18px 0, #333 0 -17px 0, #333 0 -16px 0, #333 0 -15px 0, #333 0 -14px 0, #333 0 -13px 0, #333 0 -12px 0, #333 0 -11px 0, #333 0 -10px 0, #333 0 -9px 0, #333 0 -8px 0, #333 0 -7px 0, #333 0 -6px 0, #333 0 -5px 0, #333 0 -4px 0, #333 0 -3px 0, #333 0 -2px 0, #333 0 -1px 0;
		}
		100% {
			-webkit-text-shadow: rgba(0, 0, 0, 0) 0 0 0;
		}
	}
	@keyframes anim6-2 {
		0% {
			text-shadow: #333 0 -30px 0, #333 0 -29px 0, #333 0 -28px 0, #333 0 -27px 0, #333 0 -26px 0, #333 0 -25px 0, #333 0 -24px 0, #333 0 -23px 0, #333 0 -22px 0, #333 0 -21px 0, #333 0 -20px 0, #333 0 -19px 0, #333 0 -18px 0, #333 0 -17px 0, #333 0 -16px 0, #333 0 -15px 0, #333 0 -14px 0, #333 0 -13px 0, #333 0 -12px 0, #333 0 -11px 0, #333 0 -10px 0, #333 0 -9px 0, #333 0 -8px 0, #333 0 -7px 0, #333 0 -6px 0, #333 0 -5px 0, #333 0 -4px 0, #333 0 -3px 0, #333 0 -2px 0, #333 0 -1px 0;
		}
		100% {
			text-shadow: rgba(0, 0, 0, 0) 0 0 0;
		}
	}