#common-contents {
    overflow: hidden
}

#common-contents h1 {
    width: 100%
}

#common-contents h1 img {
    width: 72.91667%;
    height: auto
}

#common-contents>div {
    transform: rotate(-5deg)
}

#common-contents #game-story {
    width: 100%
}

#common-contents #game-story h2 {
    position: relative;
    top: -10%;
    left: -10%;
    pointer-events: none;
}

#common-contents #game-story h2 img {
    opacity: 0;
    width: 83.33333%
}

#common-contents #game-story h2 img.active {
    animation: slideRight .5s ease-out 1;
    opacity: 1
}

#common-contents #game-story #story-movie {
    position: relative;
    right: 0;
    float: right;
    width: 62.4%;
    padding-top: 35.1%;
    position: relative;
    background: #181818;
    opacity: 0
}

#common-contents #game-story #story-movie.active {
    animation: slideLeft .6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 1;
    opacity: 1
}

#common-contents #game-story #story-movie iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#common-contents #game-action {
    position: relative;
    padding: 5% 0
}

#common-contents #game-action h2 {
    position: absolute;
    float: right;
    right: 0;
    top: 450%;
    width: 83.33333%
}

#common-contents #game-action h2 img {
    opacity: 0;
    width: 100%
}

#common-contents #game-action h2 img.active {
    animation: slideLeft .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 1;
    opacity: 1
}

#common-contents #game-action>div {
    width: 55.55556%;
    position: relative;
    right: 5%;
    float: right;
    margin-bottom: 15%
}

#common-contents #game-action>div img {
    opacity: 0;
    width: 100%
}

#common-contents #game-action>div img.active {
    animation: fadeIn .5s ease-out 1;
    opacity: 1
}