@charset "UTF-8";



/*  animation 
------------------------------------------------------------------- 


.fade-in {
	-webkit-animation: scrollAnime linear;
    animation: scrollAnime linear;
	-webkit-animation-timeline:view();
    animation-timeline: view();
    animation-range: entry;
	opacity: 1;
}
@keyframes scrollAnime {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0.5;
    }
	40%,
	to {
        opacity: 1;
    }
	
}
.fade-in-2 {
    -webkit-animation: scrollAnime-2 linear;
	animation: scrollAnime-2 linear;
    -webkit-animation-timeline: view();
	animation-timeline: view();
	opacity: 1;
}
@keyframes scrollAnime-2 {
    0% {
        opacity: 0;
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
    }
    30% {
        opacity: 0;
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
    }
	55% {
        opacity: 0.7;
		-webkit-transform: translateY(0px);
		transform: translateY(0px);	
    }
	65% {
        opacity: 1;
		-webkit-transform: translateY(30px);
		transform: translateY(30px);
    }
	99.9%,
	to {
        opacity: 1;
		-webkit-transform: translateY(60px);
		transform: translateY(60px);
    }
}
.scroll-ft-jp {
    -webkit-animation: scrollAnime-ft-jp linear;
	animation: scrollAnime-ft-jp linear;
    -webkit-animation-timeline: view();
	animation-timeline: view();
}
@keyframes scrollAnime-ft-jp {
    0% {
		-webkit-transform: translateY(500px);
		transform: translateY(500px);
    }
	99.9%,
	to {
		-webkit-transform: translateY(-250px);
		transform: translateY(-250px);
    }
}
.scroll-ft-en {
    -webkit-animation: scrollAnime-ft-en linear;
	animation: scrollAnime-ft-en linear;
    -webkit-animation-timeline: view();
	animation-timeline: view();
}
@keyframes scrollAnime-ft-en {
    0% {
		-webkit-transform: translateY(-100px);
		transform: translateY(-100px);
    }
	99.9%,
	to {
		-webkit-transform: translateY(50px);
		transform: translateY(50px);
    }
}
*/