@charset "utf-8";
/* CSS Document */
[class^="js-fade"], [class^="js-fade"][class*="-child"] > * {
  opacity: 0;
}
[class^="js-fade"][class*="is-active"], [class^="js-fade"][class*="-child"] > [class*="is-active"] {
  opacity: 1;
  transform: translate(0, 0);
  transition: transform 0.8s ease-out, opacity 1s ease-out;    
}

/*上へ移動*/
.js-fadeup, .js-fadeup-child > * {
  transform: translateY(50px);
}
/*下へ移動*/
.js-fadedown, .js-fadedown-child > * {
  transform: translateY(-50px);
}
/*左へ移動*/
.js-fadeleft, .js-fadeleft-child > * {
  transform: translateX(50px);
}
/*右へ移動*/
.js-faderight, .js-faderight-child > * {
  transform: translateX(-50px);
}
.js-blur {
  opacity: 0;
  filter: blur(10px);
  transition: all 1s ease-out;
}
.js-blur.is-active {
  opacity: 1;
  filter: none;
}