/*フェード*/
.js-fade,.js-fade.child > * > * {
    opacity: 0;
}
.js-fade-up,.js-fade-up.child > * > * {
    opacity: 0;
    transform: translateY(50px);
}
.js-fade-left,.js-fade-left.child > * > * {
    opacity: 0;
    transform: translateX(50px);
}
.js-fade-down,.js-fade-down.child > * > * {
    opacity: 0;
    transform: translateY(-50px);
}
.js-fade-right,.js-fade-right.child > * > * {
    opacity: 0;
    transform: translateX(-50px);
}
.js-fade-scalesmaller,.js-fade-scalesmaller.child > * > * {
    opacity: 0;
    transform: scale(1.2);
}
.js-fade-scalebigger,.js-fade-scalebigger.child > * > * {
    opacity: 0;
    transform: scale(0.8);
}
.js-fade.is-active,.js-fade .is-active {
	opacity: 1;
    transform: translate(0,0);
    transition: transform 0.8s, opacity 1s;
}
/*クリップ*/
.js-clip,.js-clip.child > * > *   {
    --duration: 2s;
    transition: clip-path var(--duration), -webkit-clip-path var(--duration);	
}
.js-clip-up,.js-clip-up.child > * > *  {
    -webkit-clip-path: inset(100% 0 0 0);
    clip-path: inset(100% 0 0 0);
}
.js-clip-left,.js-clip-left.child > * > *  {
	    -webkit-clip-path: inset(0 0 0 100%);
    clip-path: inset(0 0 0 100%);
}
.js-clip-down,.js-clip-down.child > * > *  {
    -webkit-clip-path: inset(0 0 100% 0);
    clip-path: inset(0 0 100% 0);
}
.js-clip-right,.js-clip-right.child > * > *  {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
}
.js-clip.is-active,.js-clip .is-active{
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
}
/*ブラー*/
.js-blur,.js-blur.child > * > *   {
    opacity: 0;
    -webkit-filter: blur(10px);
    filter: blur(10px);

}
.js-blur-up,.js-blur-up.child > * > *  {
    transform: translateY(50px);
}
.js-blur-left,.js-blur-left.child > * > *  {
    transform: translateX(-50px);
}
.js-blur-down,.js-blur-down.child > * > *  {
    transform: translateY(-50px);
}
.js-blur-right,.js-blur-right.child > * > *  {
	transform: translateX(50px);
}
.js-blur.is-active ,.js-blur .is-active {
	opacity: 1;
    -webkit-filter: blur(0);
    filter: blur(0);
    transform: translate(0,0);	
	transition: transform 0.8s, opacity 1s ease-out .3s,filter 1s ease-out .3s,-webkit-filter 1s ease-out .3s;
}

/*点滅*/
.js-blink span{
	opacity: 0;
}
.js-blink.is-active span{
    animation: blink 1s linear;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
.js-blink.is-active span:nth-of-type(2n){
	animation-delay: 1.2s
}
.js-blink.is-active span:nth-of-type(3n){
	animation-delay: 1.0s
}
.js-blink.is-active span:nth-of-type(4n){
	animation-delay: 0.95s
}
.js-blink.is-active span:nth-of-type(5n){
	animation-delay: 1.1s
}
.js-blink.is-active span:nth-of-type(6n){
	animation-delay: 1.25s
}
.js-blink.is-active span:nth-of-type(7n){
	animation-delay: 1.15s
}
@keyframes blink {
    0% {
        opacity: 1
    }

    3% {
        opacity: 0
    }

    9% {
        opacity: 1
    }

    15% {
        opacity: 0
    }

    22% {
        opacity: 1
    }

    26% {
        opacity: 1
    }

    33% {
        opacity: 0
    }

    47% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    53% {
        opacity: 0
    }

    75% {
        opacity: 0
    }

    76% {
        opacity: 1
    }

    77% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}