/* INIT */
/* INTRODUCTION */
.intro01-01 {
  opacity: 0;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.intro02-01 {
  opacity: 0;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.intro02_chara_back p {
  opacity: 0;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.intro02_chara_middle {
  opacity: 0;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.intro02_chara_front {
  opacity: 0;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.intro02_copy01 img {
  opacity: 0;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.intro03-01 {
  opacity: 0;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

/* ANIMATION */
/* INTRODUCTION */
.on.intro01-01 {
  animation: ef01 .4s ease-out 0s forwards;
}

.on.intro02-01 {
  animation: ef01 .4s ease-out 0s forwards;
}

.intro02_chara_back p.on {
  animation: ef02 .6s ease-out 0s forwards;
}

.on.intro02_chara_middle {
  animation: ef02 .6s ease-out 0s forwards;
}

.on.intro02_chara_front {
  animation: ef02 .6s ease-out 0s forwards;
}

.intro02_copy01 img.on {
  animation: ef02 .6s ease-out 0s forwards;
}

.on.intro03-01 {
  animation: ef01 .4s ease-out 0s forwards;
}

/* KEYFRAME */
/* MAIN */
@keyframes main01 {
  0% {
    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  }
  100% {
    opacity: 1;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
}

@keyframes main02 {
  0% {
    display: block;
    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  }
  100% {
    display: block;
    opacity: 1;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
}

/* OTHER */
@keyframes ef01 {
  0% {
    transform: translateY(5%);
    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  }
  100% {
    transform: translateY(0);
    opacity: 1;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
}

@keyframes ef02 {
  0% {
    transform: translateY(10%);
    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  }
  100% {
    transform: translateY(0);
    opacity: 1;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
}

@keyframes ef03 {
  0% {
    transform: translateY(15px);
    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  }
  100% {
    transform: translateY(0);
    opacity: 1;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
}