@charset "utf-8";

/* CSS Document */

.noscript {
    background-color: dimgrey;
    color: darkgray;
    font-size: 0.5em;
    padding: 5px 0;
}


/* animationが動かない場合の代替え */


/* テキスト部分 */

.animation-scrollUp {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
}

.animation-scrollScale {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}


/* キャプチャ部分 */

.animation-scrollScale {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    opacity: 0;
    -webkit-transition: 0.8s;
    transition: 0.8s;
}

.animation-scrollScale {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}


/* area1専用 */

.area1 .animebox {
    background: url(../image/img_animebg_01.png) no-repeat 0 0;
}


/* area2専用 */

.area2 .wrap .animebox {
    background: url(../image/img_animebg_02.png) no-repeat 0 0;
}


/* area3専用 */

.area3 .animebox {
    background: url(../image/img_animebg_03.png) no-repeat 0 0;
}

.type3 .wrap.animation-scrollUp div {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
}

.column.type4 .animation-scrollUp img {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
}

.column.type5 .animation-scrollDown div {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
}