@charset "UTF-8";


/*--------------------------------------------------------
フェードイン
--------------------------------------------------------*/
/*上から*/
.fadein-up{
	-webkit-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-duration: .7s;
	-ms-animation-duration: .7s;
	animation-duration: .7s;
	-webkit-animation-name: fadein-up;
	animation-name: fadein-up;
	visibility: visible !important;
}
@-webkit-keyframes fadein-up{
	0%{ 
		opacity: 0;
		-webkit-transform: translateY(20px);
	}
	100%{
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}
@keyframes fadein-up{
	0%{
		opacity: 0;
		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		transform: translateY(20px);
	}
	100%{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
	}
}

/*下から*/
.fadein-down{
	-webkit-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-duration: .7s;
	-ms-animation-duration: .7s;
	animation-duration: .7s;
	-webkit-animation-name: fadein-down;
	animation-name: fadein-down;
	visibility: visible !important;
}
@-webkit-keyframes fadein-down{
	0%{ 
		opacity: 0;
		-webkit-transform: translateY(-20px);
	}
	100%{
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}
@keyframes fadein-down{
	0%{
		opacity: 0;
		-webkit-transform: translateY(-20px);
		-ms-transform: translateY(-20px);
		transform: translateY(-20px);
	}
	100%{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
	}
}

/*右から*/
.fadein-right{
	-webkit-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-duration: .7s;
	-ms-animation-duration: .7s;
	animation-duration: .7s;
	-webkit-animation-name: fadein-right;
	animation-name: fadein-right;
	visibility: visible !important;
}
@-webkit-keyframes fadein-right{
	0%{ 
		opacity: 0;
		-webkit-transform: translateX(20px);
	}
	100%{
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}
@keyframes fadein-right{
	0%{
		opacity: 0;
		-webkit-transform: translateX(20px);
		-ms-transform: translateX(20px);
		transform: translateX(20px);
	}
	100%{
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
	}
}

/*左から*/
.fadein-left{
	-webkit-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-duration: .7s;
	-ms-animation-duration: .7s;
	animation-duration: .7s;
	-webkit-animation-name: fadein-left;
	animation-name: fadein-left;
	visibility: visible !important;
}
@-webkit-keyframes fadein-left{
	0%{ 
		opacity: 0;
		-webkit-transform: translateX(-20px);
	}
	100%{
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}
@keyframes fadein-left{
	0%{
		opacity: 0;
		-webkit-transform: translateX(-20px);
		-ms-transform: translateX(-20px);
		transform: translateX(-20px);
	}
	100%{
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
	}
}