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

.page_fadein {
    opacity: 0;
    transition: 1s;
    transition-duration: 1s;
    transition-delay: 0.2s;
}
.page_fadein.on {
    opacity: 1;
}


.fadein_up {
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0;
    transition: all 1s ease-out;
     transition-delay : 0.5s;
}
.fadein_up.started {
    transform: none;
    opacity: 1;
}

.fadein_up_pop {
    -webkit-transform: translateY(100px);
    -ms-transform: translateY(100px);
    transform: translateY(100px);
    opacity: 0;
    transition: all 1s ease-out;
     transition-delay : 0.5s;
}
.fadein_up_pop.started {
    transform: none;
    opacity: 1;
}



.fadein_lef {
    opacity: 0;
	transition: 2s;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
    transition: transform 1.0s cubic-bezier(0.34, 1.56, 0.64, 1);
    transform: translate(-100px, 0px) ;
}
.fadein_lef.started {
    transform: none;
    opacity: 1;
}


.fadein_rig {
    opacity: 0;
	transition: 2s;
    transition-duration: 1.2s;
    transition-delay: 0.1s;
    transition: transform 1.0s cubic-bezier(0.34, 1.56, 0.64, 1);
    transform: translate(100px, 0px) ;
}
.fadein_rig.started {
    opacity: 1;
    transform: translate(0px, 0px);
}


.fadein_lef_big {
    opacity: 0;
	transition: 2s;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
    transition: transform 1.0s cubic-bezier(0.34, 1.56, 0.64, 1);
    transform: translate(-200px, 0px) ;
}
.fadein_lef_big.started {
    opacity: 1;
    transform: translate(0px, 0px);
}

.fadein_rig_big {
    opacity: 0;
	transition: 2s;
    transition-duration: 1.2s;
    transition-delay: 0.1s;
    transition: transform 1.0s cubic-bezier(0.34, 1.56, 0.64, 1);
    transform: translate(200px, 0px) ;
}
.fadein_rig_big.started {
    opacity: 1;
    transform: translate(0px, 0px);
}


.ani_inL {
    opacity: 0;
	transition: 2s;
    transition-duration: 1.2s;
    transition-delay: 0.1s;
    transform: translate(-50px, 0px) ;
}

.ani_inR {
    opacity: 0;
	transition: 2s;
    transition-duration: 1.2s;
    transition-delay: 0.1s;
    transform: translate(50px, 0px) ;
}
.ani_inL.started, .ani_inR.started {
    opacity: 1;
    transform: translate(0px, 0px);
}


.fadein_bright {
filter: brightness(200%);
    -webkit-filter: brightness(900%);
    -ms-filter: brightness(2);
    opacity: 0;
    -webkit-transition: 1.5s 0.1s;
    -moz-transition: 1.5s 0.1s;
    -o-transition: 1.5s 0.1s;
    transition: 1.5s 0.1s;
    transform: scale(1.02, 1.02);
}
.fadein_bright.started {
       filter: brightness(100%);
    -webkit-filter: brightness(100%);
    -ms-filter: brightness(1);
    transform: scale(1,1);
    opacity: 1;
}