
/*通常時*/
.js-vis-up{opacity: 0; transform: translateY(20px);}

/*表示時*/
.js-vis-up.visible{animation: js-vis-up 500ms linear 500ms forwards;}

@keyframes js-vis-up {
  0% {opacity: 0; transform: translateY(20px);}
  100% {opacity: 1; transform: translateY(0px);}
}

.js-vis-visible >*:not(.vis-not){opacity:0}
.js-vis-visible.visible >*:not(.vis-not){animation: js-vis-visible 500ms linear  500ms forwards;}

.js-vis-visibles >* >*:not(.vis-not){opacity:0}
.js-vis-visibles.visible >*:nth-child(1) >*:not(.vis-not){animation: js-vis-visible 500ms linear  500ms forwards;}
.js-vis-visibles.visible >*:nth-child(2) >*:not(.vis-not){animation: js-vis-visible 500ms linear 1000ms forwards;}
.js-vis-visibles.visible >*:nth-child(3) >*:not(.vis-not){animation: js-vis-visible 500ms linear 1500ms forwards;}
.js-vis-visibles.visible >*:nth-child(4) >*:not(.vis-not){animation: js-vis-visible 500ms linear 2000ms forwards;}

@keyframes js-vis-visible {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
@media(max-width:900px){
	.js-vis-visibles.visible >*:nth-child(1) >*:not(.vis-not){animation: js-vis-visible 500ms linear 500ms forwards;}
	.js-vis-visibles.visible >*:nth-child(2) >*:not(.vis-not){animation: js-vis-visible 500ms linear 500ms forwards;}
	.js-vis-visibles.visible >*:nth-child(3) >*:not(.vis-not){animation: js-vis-visible 500ms linear 500ms forwards;}
	.js-vis-visibles.visible >*:nth-child(4) >*:not(.vis-not){animation: js-vis-visible 500ms linear 500ms forwards;}
}



.js-vis-imgR{overflow:hidden;;}
.js-vis-imgR img{transform:translateX(100%);transition:0.5s;}
.js-vis-imgR.visible img{transform:translateX(0%);}

