
@-webkit-keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.trans{
    -webkit-transition: all .6s cubic-bezier(0.245, 0.145, 1.355, 1);
    -moz-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -o-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -ms-transition: all .6s cubic-bezier(0.445, 1.045, 0.355, 1);
    transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1);
}
.ibox .item1 { transform: rotateX(90deg); -webkit-transform: rotateX(90deg); transform-origin: 50% 100% 0px; }
.ibox .item2 { transform: rotateY(-90deg); -webkit-transform: rotateY(-90deg); transform-origin: 0 50% 0; }
.ibox .item3 { transform: rotateY(90deg); -webkit-transform: rotateY(90deg); transform-origin: 100% 50% 0; }
.ibox .item4 { transform: rotateX(90deg); -webkit-transform: rotateX(90deg); transform-origin: 50% 0 0; }

.dly_1 {
    transition-delay: 100ms;
    -webkit-transition-delay: 100ms;
}

.dly_2 {
    transition-delay: 200ms;
    -webkit-transition-delay: 200ms;
}

.dly_3 {
    transition-delay: 300ms;
    -webkit-transition-delay: 300ms;
}

.dly_4 {
    transition-delay: 400ms;
    -webkit-transition-delay: 400ms;
}

.dly_5 {
    transition-delay: 500ms;
    -webkit-transition-delay: 500ms;
}

.dly_6 {
    transition-delay: 600ms;
    -webkit-transition-delay: 600ms;
}

.dly_7 {
    transition-delay: 700ms;
    -webkit-transition-delay: 700ms;
}

.dly_8 {
    transition-delay: 800ms;
    -webkit-transition-delay: 800ms;
}

.dly_9 {
    transition-delay: 900ms;
    -webkit-transition-delay: 900ms;
}

.dly_10 {
    transition-delay: 1000ms;
    -webkit-transition-delay: 1000ms;
}

.dly_11 {
    transition-delay: 1100ms;
    -webkit-transition-delay: 1100ms;
}
.transYT50 {
    transform: translateY(50px);
    -webkit-transform: translateY(50px);
    opacity: 0;
    visibility: hidden;
    transition: transform 600ms, opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1);
    -webkit-transition: transform 600ms, opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1);
    transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
}
.action.transYT50, .action.transYT10 {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
    -webkit-transform: translateY(0px);
}

.action .ibox .item1{ -webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 280ms, -webkit-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 280ms; transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 280ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 280ms; }
.action .ibox .item2{ -webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 560ms, -webkit-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 560ms; transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 560ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 560ms; }
.action .ibox .item3{ -webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1200ms, -webkit-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1200ms; transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1200ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1200ms; }
.action .ibox .item4{ -webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 840ms, -webkit-transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 840ms; transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 840ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 840ms; }
.action .ibox .item{opacity: 1;}
.action .ibox .item1, .action .ibox .item4{transform: rotateX(0deg);-webkit-transform: rotateX(0deg);}
.action .ibox .item2, .action .ibox .item3{transform: rotateY(0deg); -webkit-transform: rotateY(0deg); }
.activText,.runDetil{
    opacity: 0;
    transform: translate(0px,30px);
    -webkit-transform: translate(0px,30px);
    transition: 500ms ease 2200ms;
    -webkit-transition: 500ms ease 2200ms;
}
.action .activText,.action.runDetil{
    opacity: 1;
    transform: translate(0px,0px);
    -webkit-transform: translate(0px,0px);
}
.action  p, .action a{
    opacity: 1;
    transform: translate(0px,0px);
    -webkit-transform: translate(0px,0px);
}
.action .item_text p, .action .item_text a,.nose_warp .onSlide .item_text p,.nose_warp .onSlide .item_text a,.facial_warp .onSlide .item_text p,.facial_warp .onSlide .item_text a,.action .btn-more-programs>a{
    opacity: 1;
    transform: translate(0px,0px);
    -webkit-transform: translate(0px,0px);
}
@media only screen and (min-width:480px ) {

}
/*棣栭〉banner澶勫浘鏍�*/
.banner_inner .item_warp dl:hover img{
    -webkit-transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
    transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
    -webkit-animation: shake 0.6s;
    animation: shake 0.6s;
}
.banner_inner .innerWarp3 a:hover img{
    -webkit-transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
    transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
    -webkit-animation: shake 0.6s;
    animation: shake 0.6s;
}
@keyframes shake {
    from,
    to {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    25% {
        -webkit-transform: scale(0.9, 1.1);
        transform: scale(0.9, 1.1);
    }
    50% {
        -webkit-transform: scale(1.1, 0.9);
        transform: scale(1.1, 0.9);
    }
    75% {
        -webkit-transform: scale(0.95, 1.05);
        transform: scale(0.95, 1.05);
    }
    from,
    to {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    25% {
        -webkit-transform: scale(0.9, 1.1);
        transform: scale(0.9, 1.1);
    }
    50% {
        -webkit-transform: scale(1.1, 0.9);
        transform: scale(1.1, 0.9);
    }
    75% {
        -webkit-transform: scale(0.95, 1.05);
        transform: scale(0.95, 1.05);
    }
}

@-webkit-keyframes shake {
    from,
    to {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    25% {
        -webkit-transform: scale(0.9, 1.1);
        transform: scale(0.9, 1.1);
    }
    50% {
        -webkit-transform: scale(1.1, 0.9);
        transform: scale(1.1, 0.9);
    }
    75% {
        -webkit-transform: scale(0.95, 1.05);
        transform: scale(0.95, 1.05);
    }
    from,
    to {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    25% {
        -webkit-transform: scale(0.9, 1.1);
        transform: scale(0.9, 1.1);
    }
    50% {
        -webkit-transform: scale(1.1, 0.9);
        transform: scale(1.1, 0.9);
    }
    75% {
        -webkit-transform: scale(0.95, 1.05);
        transform: scale(0.95, 1.05);
    }
}

@-webkit-keyframes imgIns { 0% {-webkit-transform:-webkit-translateY(-85%);opacity:1;} 100% {-webkit-transform:-webkit-translateY(0);opacity:1;}}
@keyframes imgIns { 0% {transform:translateY(-85%);opacity:1;} 100% {transform:translateY(0);opacity:1;}}
/*.diary_r .slick-active img,.diary_r .action img{ -webkit-animation: imgIns 1600ms cubic-bezier(0.190, 1, 0.420, 1); animation: imgIns 1600ms cubic-bezier(0.190, 1, 0.420, 1); -moz-animation: imgIns 1600ms cubic-bezier(0.190, 1, 0.420, 1); }
*/