@charset "utf-8";
/* CSS Document */





/*領域とは関係なく即アクションする*/

/*.img-wrap {
  overflow: hidden;
  position: relative;
}

.img-wrap:before {
  animation: img-wrap 2s cubic-bezier(.4, 0, .2, 1) forwards;
  background: #fff;
  bottom: 0;
  content: '';
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}

@keyframes img-wrap {
  100% {
    transform: translateX(100%);
  }
}
*/





/*領域に入ってからアクションする*/

.img-animation {
  animation: img-opacity 1s cubic-bezier(.2, 0, .2, 0);/*(.4, 0, .2, 1)*/
  overflow: hidden;
  position: relative;
}

.img-animation:before {
  animation: img-animation 1s cubic-bezier(.2, 0, .2, 0) forwards;/*(.4, 0, .2, 1)*/
	background:#fff5ee;
  bottom: 0;
  content: '';
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}

@keyframes img-opacity {
  0% {
    opacity: 0;
  }
}

@keyframes img-animation {
  100% {
    transform: translateX(100%);
  }
}