/*!--------------------------------------------------------------------------*
 *  
 *  ScrollEffect.css
 *  
 *  MIT-style license. 
 *  
 *  2017 MuuYan
 *  http://muumv.com
 *  
 *--------------------------------------------------------------------------*/
 
.pSimple1,
.pMultiple1 > li,
.pMultiple1 > div {
  opacity: 0;
  -webkit-transform: translate3d(0,80px,0);
  transform: translate3d(0,80px,0);
  transition: all 1.2s cubic-bezier(.4, 0, .2, 1);
}

.pSimple1.pActive,
.pMultiple1 .pActive {
  opacity: 1;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.pSimple2,
.pMultiple2 > li,
.pMultiple2 > div {
  opacity: 0;
  transition: all 2s cubic-bezier(.4, 0, .2, 1);
}

.pSimple2.pActive,
.pMultiple2 .pActive {
  opacity: 1;
}

/* 要素単体用（単体の動き） */
.customS01 {
  opacity: 0;
  -webkit-transform: translate3d(-500px,0,0);
  transform: translate3d(-500px,0,0);
  transition: all 1.2s cubic-bezier(.4, 0, .2, 1);
}
.customS02 {
  opacity: 0;
  -webkit-transform: translate3d(500px,0,0);
  transform: translate3d(500px,0,0);
  transition: all 1.2s cubic-bezier(.4, 0, .2, 1);
}
.customS03 {
  opacity: 0;
  transform: scale(0.1);
  transition: opacity 1.2s ease, transform 1.2s ease;
  transition: all 1.2s cubic-bezier(.4, 0, .2, 1);
}
.customS01.pActive,.customS02.pActive { 
  opacity: 1;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.customS03.pActive { 
  opacity: 1;
  transform: scale(1);
}
 
/* 親要素用（連続した子要素の動き） */
.customM > li {
  opacity: 0;
  -webkit-transform: translate3d(500px,0,0);
  transform: translate3d(500px,0,0);
  transition: all 1.2s cubic-bezier(.4, 0, .2, 1);
}
.customM > li:nth-child(odd) {
  opacity: 0;
  -webkit-transform: translate3d(-500px,0,0);
  transform: translate3d(-500px,0,0);
}
.customM .pActive,
.customM .pActive:nth-child(odd) {
  opacity: 1;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}