/*-------------------------Mask*/
.scrMask::before,
.scrMask::after{
    display: block;
    position: absolute;
    right: 0;
    width: 100%;
    height: 100%;
    content: '';
    z-index: 11;
}
.scrMask::before{
    top: 0;
    /*background: #1b6aa5;*/
    background: rgba( 27, 106, 165, 1 );
}
.scrMask::after{
    top: 0;
    background: #fff;
}

.scrMask.evMask::before,
.scrMask.evMask::after{
    animation: maskKey 0.25s;
    animation-fill-mode: forwards;
}
.scrMask.evMask::before{
    animation-delay: 0.25s;
}
@keyframes maskKey{
    0% {
        width: 100%;
    }
    100% {
        width: 0%;
    }
}
/*
@media screen and (max-width:640px){
    .scrMask::before,
    .scrMask::after{
        display: none;
    }
}
*/

/*-------------------------fadeup*/
.fadeup,
.fadeup_ver{
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translate(0, 12px);
    -ms-transform: translate(0, 12px);
    transform: translate(0, 12px);
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: all 1.5s cubic-bezier(0.165, 0.80, 0.45, 1) 0s;
    transition: all 1.5s cubic-bezier(0.165, 0.80, 0.45, 1) 0s;
}
.fadeup.active,
.fadeup_ver.active{
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
}

@media screen and (max-width:640px){
    .fadeup_ver,
    .fadeup_ver.active{
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}