@charset "UTF-8";

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.0
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.animated.hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s
}

.animated.bounceIn, .animated.bounceOut, .animated.flipOutX, .animated.flipOutY {
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}

@-webkit-keyframes bounce {
    0%, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    40%, 43% {
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
    40%, 43%, 70% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06)
    }
    70% {
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }
}

@keyframes bounce {
    0%, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    40%, 43% {
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
    40%, 43%, 70% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06)
    }
    70% {
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }
}

.bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}

@-webkit-keyframes flash {
    0%, 50%, to {
        opacity: 1
    }
    25%, 75% {
        opacity: 0
    }
}

@keyframes flash {
    0%, 50%, to {
        opacity: 1
    }
    25%, 75% {
        opacity: 0
    }
}

.flash {
    -webkit-animation-name: flash;
    animation-name: flash
}

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
}

@-webkit-keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand
}

@-webkit-keyframes shake {
    0%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}

@keyframes shake {
    0%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}

.shake {
    -webkit-animation-name: shake;
    animation-name: shake
}

@-webkit-keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }
    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }
    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }
    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }
    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }
    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }
    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.headShake {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-name: headShake;
    animation-name: headShake
}

@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }
    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }
    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }
    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }
    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }
    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }
    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }
    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }
    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.swing {
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
}

@-webkit-keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    10%, 20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
        transform: scale3d(.9, .9, .9) rotate(-3deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    10%, 20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
        transform: scale3d(.9, .9, .9) rotate(-3deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.tada {
    -webkit-animation-name: tada;
    animation-name: tada
}

@-webkit-keyframes wobble {
    0% {
        -webkit-transform: none;
        transform: none
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
        transform: translate3d(-25%, 0, 0) rotate(-5deg)
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
        transform: translate3d(20%, 0, 0) rotate(3deg)
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
        transform: translate3d(-15%, 0, 0) rotate(-3deg)
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
        transform: translate3d(10%, 0, 0) rotate(2deg)
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
        transform: translate3d(-5%, 0, 0) rotate(-1deg)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes wobble {
    0% {
        -webkit-transform: none;
        transform: none
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
        transform: translate3d(-25%, 0, 0) rotate(-5deg)
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
        transform: translate3d(20%, 0, 0) rotate(3deg)
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
        transform: translate3d(-15%, 0, 0) rotate(-3deg)
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
        transform: translate3d(10%, 0, 0) rotate(2deg)
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
        transform: translate3d(-5%, 0, 0) rotate(-1deg)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

.wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble
}

@-webkit-keyframes jello {
    0%, 11.1%, to {
        -webkit-transform: none;
        transform: none
    }
    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }
    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg)
    }
    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }
    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }
    66.6% {
        -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }
    77.7% {
        -webkit-transform: skewX(.390625deg) skewY(.390625deg);
        transform: skewX(.390625deg) skewY(.390625deg)
    }
    88.8% {
        -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

@keyframes jello {
    0%, 11.1%, to {
        -webkit-transform: none;
        transform: none
    }
    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }
    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg)
    }
    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }
    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }
    66.6% {
        -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }
    77.7% {
        -webkit-transform: skewX(.390625deg) skewY(.390625deg);
        transform: skewX(.390625deg) skewY(.390625deg)
    }
    88.8% {
        -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

.jello {
    -webkit-animation-name: jello;
    animation-name: jello;
    -webkit-transform-origin: center;
    transform-origin: center
}

@-webkit-keyframes bounceIn {
    0%, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes bounceIn {
    0%, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.bounceIn {
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn
}

@-webkit-keyframes bounceInDown {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInDown {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown
}

@-webkit-keyframes bounceInLeft {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInLeft {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft
}

@-webkit-keyframes bounceInRight {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInRight {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

.bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight
}

@-webkit-keyframes bounceInUp {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInUp {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp
}

@-webkit-keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    50%, 55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
}

@keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    50%, 55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
}

.bounceOut {
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut
}

@-webkit-keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}

@keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}

.bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown
}

@-webkit-keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}

@keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}

.bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft
}

@-webkit-keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}

@keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}

.bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight
}

@-webkit-keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}

@keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}

.bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown
}

@-webkit-keyframes fadeInDownBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInDownBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig
}

@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}

@-webkit-keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}

@-webkit-keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig
}


@-webkit-keyframes fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

.fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut
}

@-webkit-keyframes fadeOutDown {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}

@keyframes fadeOutDown {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}

.fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown
}

@-webkit-keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}

@keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}

.fadeOutDownBig {
    -webkit-animation-name: fadeOutDownBig;
    animation-name: fadeOutDownBig
}

@-webkit-keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

@keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft
}

@-webkit-keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}

@keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}

.fadeOutLeftBig {
    -webkit-animation-name: fadeOutLeftBig;
    animation-name: fadeOutLeftBig
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
}

@-webkit-keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}

@keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}

.fadeOutRightBig {
    -webkit-animation-name: fadeOutRightBig;
    animation-name: fadeOutRightBig
}

@-webkit-keyframes fadeOutUp {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}

@keyframes fadeOutUp {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}

.fadeOutUp {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp
}

@-webkit-keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}

@keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}

.fadeOutUpBig {
    -webkit-animation-name: fadeOutUpBig;
    animation-name: fadeOutUpBig
}

@-webkit-keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotateY(-1turn);
        transform: perspective(400px) rotateY(-1turn)
    }
    0%, 40% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    40% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
        transform: perspective(400px) translateZ(150px) rotateY(-190deg)
    }
    50% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
        transform: perspective(400px) translateZ(150px) rotateY(-170deg)
    }
    50%, 80% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    80% {
        -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
        transform: perspective(400px) scale3d(.95, .95, .95)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

@keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotateY(-1turn);
        transform: perspective(400px) rotateY(-1turn)
    }
    0%, 40% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    40% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
        transform: perspective(400px) translateZ(150px) rotateY(-190deg)
    }
    50% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
        transform: perspective(400px) translateZ(150px) rotateY(-170deg)
    }
    50%, 80% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    80% {
        -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
        transform: perspective(400px) scale3d(.95, .95, .95)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

.animated.flip {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-animation-name: flip;
    animation-name: flip
}

@-webkit-keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
    0%, 40% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    40% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotateX(10deg);
        transform: perspective(400px) rotateX(10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
    0%, 40% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    40% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotateX(10deg);
        transform: perspective(400px) rotateX(10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

.flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX
}

@-webkit-keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
    0%, 40% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    40% {
        -webkit-transform: perspective(400px) rotateY(-20deg);
        transform: perspective(400px) rotateY(-20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        transform: perspective(400px) rotateY(10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
    0%, 40% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    40% {
        -webkit-transform: perspective(400px) rotateY(-20deg);
        transform: perspective(400px) rotateY(-20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        transform: perspective(400px) rotateY(10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

.flipInY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY
}

@-webkit-keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
}

@keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
}

.flipOutX {
    -webkit-animation-name: flipOutX;
    animation-name: flipOutX;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important
}

@-webkit-keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateY(-15deg);
        transform: perspective(400px) rotateY(-15deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
}

@keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateY(-15deg);
        transform: perspective(400px) rotateY(-15deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
}

.flipOutY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipOutY;
    animation-name: flipOutY
}

@-webkit-keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }
    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg)
    }
    60%, 80% {
        opacity: 1
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg)
    }
    to {
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }
    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg)
    }
    60%, 80% {
        opacity: 1
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg)
    }
    to {
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
}

@-webkit-keyframes lightSpeedOut {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0
    }
}

@keyframes lightSpeedOut {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0
    }
}

.lightSpeedOut {
    -webkit-animation-name: lightSpeedOut;
    animation-name: lightSpeedOut;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
}

@-webkit-keyframes rotateIn {
    0% {
        transform-origin: center;
        -webkit-transform: rotate(-200deg);
        transform: rotate(-200deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: center
    }
    to {
        transform-origin: center;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateIn {
    0% {
        transform-origin: center;
        -webkit-transform: rotate(-200deg);
        transform: rotate(-200deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: center
    }
    to {
        transform-origin: center;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateIn {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn
}

@-webkit-keyframes rotateInDownLeft {
    0% {
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: left bottom
    }
    to {
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInDownLeft {
    0% {
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: left bottom
    }
    to {
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInDownLeft {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft
}

@-webkit-keyframes rotateInDownRight {
    0% {
        transform-origin: right bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: right bottom
    }
    to {
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInDownRight {
    0% {
        transform-origin: right bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: right bottom
    }
    to {
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInDownRight {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight
}

@-webkit-keyframes rotateInUpLeft {
    0% {
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: left bottom
    }
    to {
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInUpLeft {
    0% {
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: left bottom
    }
    to {
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInUpLeft {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft
}

@-webkit-keyframes rotateInUpRight {
    0% {
        transform-origin: right bottom;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: right bottom
    }
    to {
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInUpRight {
    0% {
        transform-origin: right bottom;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0
    }
    0%, to {
        -webkit-transform-origin: right bottom
    }
    to {
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight
}

@-webkit-keyframes rotateOut {
    0% {
        transform-origin: center;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: center
    }
    to {
        transform-origin: center;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        opacity: 0
    }
}

@keyframes rotateOut {
    0% {
        transform-origin: center;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: center
    }
    to {
        transform-origin: center;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        opacity: 0
    }
}

.rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut
}

@-webkit-keyframes rotateOutDownLeft {
    0% {
        transform-origin: left bottom;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: left bottom
    }
    to {
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownLeft {
    0% {
        transform-origin: left bottom;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: left bottom
    }
    to {
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
}

.rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft
}

@-webkit-keyframes rotateOutDownRight {
    0% {
        transform-origin: right bottom;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: right bottom
    }
    to {
        transform-origin: right bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownRight {
    0% {
        transform-origin: right bottom;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: right bottom
    }
    to {
        transform-origin: right bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

.rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight
}

@-webkit-keyframes rotateOutUpLeft {
    0% {
        transform-origin: left bottom;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: left bottom
    }
    to {
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

@keyframes rotateOutUpLeft {
    0% {
        transform-origin: left bottom;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: left bottom
    }
    to {
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

.rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft
}

@-webkit-keyframes rotateOutUpRight {
    0% {
        transform-origin: right bottom;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: right bottom
    }
    to {
        transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0
    }
}

@keyframes rotateOutUpRight {
    0% {
        transform-origin: right bottom;
        opacity: 1
    }
    0%, to {
        -webkit-transform-origin: right bottom
    }
    to {
        transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0
    }
}

.rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight
}

@-webkit-keyframes hinge {
    0% {
        transform-origin: top left
    }
    0%, 20%, 60% {
        -webkit-transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    20%, 60% {
        -webkit-transform: rotate(80deg);
        transform: rotate(80deg);
        transform-origin: top left
    }
    40%, 80% {
        -webkit-transform: rotate(60deg);
        transform: rotate(60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}

@keyframes hinge {
    0% {
        transform-origin: top left
    }
    0%, 20%, 60% {
        -webkit-transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    20%, 60% {
        -webkit-transform: rotate(80deg);
        transform: rotate(80deg);
        transform-origin: top left
    }
    40%, 80% {
        -webkit-transform: rotate(60deg);
        transform: rotate(60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}

.hinge {
    -webkit-animation-name: hinge;
    animation-name: hinge
}

@-webkit-keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
        transform: translate3d(-100%, 0, 0) rotate(-120deg)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
        transform: translate3d(-100%, 0, 0) rotate(-120deg)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn
}

@-webkit-keyframes rollOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
        transform: translate3d(100%, 0, 0) rotate(120deg)
    }
}

@keyframes rollOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
        transform: translate3d(100%, 0, 0) rotate(120deg)
    }
}

.rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut
}


@-webkit-keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown
}

@-webkit-keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInLeft {
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft
}

@-webkit-keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInRight {
    -webkit-animation-name: zoomInRight;
    animation-name: zoomInRight
}

@-webkit-keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInUp {
    -webkit-animation-name: zoomInUp;
    animation-name: zoomInUp
}

@-webkit-keyframes zoomOut {
    0% {
        opacity: 1
    }
    50% {
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    50%, to {
        opacity: 0
    }
}

@keyframes zoomOut {
    0% {
        opacity: 1
    }
    50% {
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    50%, to {
        opacity: 0
    }
}

.zoomOut {
    -webkit-animation-name: zoomOut;
    animation-name: zoomOut
}



@-webkit-keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
        transform: scale(.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}

@keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
        transform: scale(.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}

.zoomOutLeft {
    -webkit-animation-name: zoomOutLeft;
    animation-name: zoomOutLeft
}

@-webkit-keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}

@keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}

.zoomOutRight {
    -webkit-animation-name: zoomOutRight;
    animation-name: zoomOutRight
}

@-webkit-keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp
}

@-webkit-keyframes slideInDown {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInDown {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown
}

@-webkit-keyframes slideInLeft {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInLeft {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft
}

@-webkit-keyframes slideInRight {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInRight {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight
}

@-webkit-keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp
}

@-webkit-keyframes slideOutDown {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}

@keyframes slideOutDown {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}

.slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown
}

@-webkit-keyframes slideOutLeft {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

@keyframes slideOutLeft {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

.slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft
}

@-webkit-keyframes slideOutRight {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

@keyframes slideOutRight {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

.slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight
}

@-webkit-keyframes slideOutUp {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}

@keyframes slideOutUp {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}

.slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp
}

@charset "utf-8";
.noSize {
  font-size: 0;
  text-indent: -9999em;
}
.flex {
  display: -webkit-box;
  /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
  display: -moz-box;
  /* Firefox 17- */
  display: -webkit-flex;
  /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
  display: -moz-flex;
  /* Firefox 18+ */
  display: -ms-flexbox;
  /* IE 10 */
  display: flex;
  /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
}
* {
  -webkit-tap-highlight-color: transparent;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-focus-ring-color: rgba(0, 0, 0, 0);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
html,
body {
  width: 100%;
}
body {
  font-family: "\5FAE\8F6F\96C5\9ED1", "Microsoft YaHei", STHeiTi, sans-serif;
}
/* CSS Document */
html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
div,
dl,
dt,
dd,
ul,
ol,
li,
p,
blockquote,
pre,
hr,
figure,
table,
caption,
th,
td,
form,
fieldset,
legend,
input,
button,
textarea,
menu,
select {
  margin: 0;
  padding: 0;
}
html,
body,
fieldset,
img,
iframe,
abbr {
  border: 0;
}
h1,
h2,
h3,
h4,
h5,
h6,
em,
strong,
b {
  font-weight: normal;
  font-style: normal;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
li {
  list-style: none;
}
input,
textarea {
  outline: none;
}
button,
a,
div,
select {
  border: none;
  outline: none;
}
input,
textarea,
button,
a {
  font: inherit;
  color: inherit;
}
textarea {
  overflow: auto;
  resize: none;
}
input {
  outline: none;
}
a,
button {
  cursor: pointer;
}
a,
a:hover {
  text-decoration: none;
}
select {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-transition-delay: 999999s;
  -webkit-transition: color 999999s ease-out, background-color 999999s ease-out;
}
#NIE-warning-dialog {
  -webkit-box-sizing: content-box !important;
          box-sizing: content-box !important;
}
#NIE-topBar {
  z-index: 999 !important;
}
#NIE-topBar * {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}
@font-face {
  font-family: 'fzcjljt';
  src: url('https://nie.res.netease.com/comm/js/nie/ref/fonts/fzcjljt.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'NotoSansSC';
  src: url("https://nie.res.netease.com/comm/js/leihuo/fonts/noto-sans-sc-v12-latin_chinese-simplified-regular.woff2") format('woff2'), url("https://nie.res.netease.com/comm/js/leihuo/fonts/noto-sans-sc-v12-latin_chinese-simplified-regular.woff") format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@-webkit-keyframes fadeInOut {
  0%,
  25%,
  100% {
    opacity: 0;
  }
  50%,
  75% {
    opacity: 1;
  }
}
@-moz-keyframes fadeInOut {
  0%,
  25%,
  100% {
    opacity: 0;
  }
  50%,
  75% {
    opacity: 1;
  }
}
@-o-keyframes fadeInOut {
  0%,
  25%,
  100% {
    opacity: 0;
  }
  50%,
  75% {
    opacity: 1;
  }
}
@keyframes fadeInOut {
  0%,
  25%,
  100% {
    opacity: 0;
  }
  50%,
  75% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-o-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
  }
}
@-moz-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateX(0);
  }
}
@-o-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -o-transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    -o-transform: translateX(0);
  }
}
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50px);
            transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes fadeInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@-o-keyframes fadeInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateY(0);
  }
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes fadeInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(50px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@-o-keyframes fadeInUp {
  0% {
    opacity: 0;
    -o-transform: translateY(50px);
  }
  100% {
    opacity: 1;
    -o-transform: translateY(0);
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
  }
}
@-moz-keyframes fadeInRight {
  0% {
    opacity: 0;
    -moz-transform: translateX(50px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateX(0);
  }
}
@-o-keyframes fadeInRight {
  0% {
    opacity: 0;
    -o-transform: translateX(50px);
  }
  100% {
    opacity: 1;
    -o-transform: translateX(0);
  }
}
@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(50px);
            transform: translateX(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-webkit-keyframes zoomInAndOut {
  0% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  50% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  100% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(0.9);
  }
  50% {
    -webkit-transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(0.9);
    opacity: 1;
  }
}
@-moz-keyframes pulse {
  0% {
    -moz-transform: scale(0.9);
  }
  50% {
    -moz-transform: scale(1.1);
  }
  100% {
    -moz-transform: scale(0.9);
    opacity: 1;
  }
}
@-o-keyframes pulse {
  0% {
    -o-transform: scale(0.9);
  }
  50% {
    -o-transform: scale(1.1);
  }
  100% {
    -o-transform: scale(0.9);
    opacity: 1;
  }
}
@keyframes pulse {
  0% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  50% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    opacity: 1;
  }
}
@-webkit-keyframes hinge {
  0% {
    -webkit-transform: rotate(0);
    -webkit-transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
  }
  20%,
  60% {
    -webkit-transform: rotate(80deg);
    -webkit-transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
  }
  40% {
    -webkit-transform: rotate(60deg);
    -webkit-transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
  }
  80% {
    -webkit-transform: rotate(60deg) translateY(0);
    opacity: 1;
    -webkit-transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
  }
  100% {
    -webkit-transform: translateY(700px);
    opacity: 0;
  }
}
@-moz-keyframes hinge {
  0% {
    -moz-transform: rotate(0);
    -moz-transform-origin: top left;
    -moz-animation-timing-function: ease-in-out;
  }
  20%,
  60% {
    -moz-transform: rotate(80deg);
    -moz-transform-origin: top left;
    -moz-animation-timing-function: ease-in-out;
  }
  40% {
    -moz-transform: rotate(60deg);
    -moz-transform-origin: top left;
    -moz-animation-timing-function: ease-in-out;
  }
  80% {
    -moz-transform: rotate(60deg) translateY(0);
    opacity: 1;
    -moz-transform-origin: top left;
    -moz-animation-timing-function: ease-in-out;
  }
  100% {
    -moz-transform: translateY(700px);
    opacity: 0;
  }
}
@-o-keyframes hinge {
  0% {
    -o-transform: rotate(0);
    -o-transform-origin: top left;
    -o-animation-timing-function: ease-in-out;
  }
  20%,
  60% {
    -o-transform: rotate(80deg);
    -o-transform-origin: top left;
    -o-animation-timing-function: ease-in-out;
  }
  40% {
    -o-transform: rotate(60deg);
    -o-transform-origin: top left;
    -o-animation-timing-function: ease-in-out;
  }
  80% {
    -o-transform: rotate(60deg) translateY(0);
    opacity: 1;
    -o-transform-origin: top left;
    -o-animation-timing-function: ease-in-out;
  }
  100% {
    -o-transform: translateY(700px);
    opacity: 0;
  }
}
@keyframes hinge {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
  20%,
  60% {
    -webkit-transform: rotate(80deg);
            transform: rotate(80deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
  40% {
    -webkit-transform: rotate(60deg);
            transform: rotate(60deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
  80% {
    -webkit-transform: rotate(60deg) translateY(0);
            transform: rotate(60deg) translateY(0);
    opacity: 1;
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
  100% {
    -webkit-transform: translateY(700px);
            transform: translateY(700px);
    opacity: 0;
  }
}
@-webkit-keyframes rotate {
  0% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(360deg);
  }
}
@-moz-keyframes rotate {
  0% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(360deg);
  }
}
@-o-keyframes rotate {
  0% {
    -o-transform-origin: center center;
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform-origin: center center;
    -o-transform: rotate(360deg);
  }
}
@keyframes rotate {
  0% {
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes wobble {
  0% {
    -webkit-transform: translateX(0%);
  }
  15% {
    -webkit-transform: translateX(-25%) rotate(-5deg);
  }
  30% {
    -webkit-transform: translateX(20%) rotate(3deg);
  }
  45% {
    -webkit-transform: translateX(-15%) rotate(-3deg);
  }
  60% {
    -webkit-transform: translateX(10%) rotate(2deg);
  }
  75% {
    -webkit-transform: translateX(-5%) rotate(-1deg);
  }
  100% {
    -webkit-transform: translateX(0%);
    opacity: 1;
  }
}
@-moz-keyframes wobble {
  0% {
    -moz-transform: translateX(0%);
  }
  15% {
    -moz-transform: translateX(-25%) rotate(-5deg);
  }
  30% {
    -moz-transform: translateX(20%) rotate(3deg);
  }
  45% {
    -moz-transform: translateX(-15%) rotate(-3deg);
  }
  60% {
    -moz-transform: translateX(10%) rotate(2deg);
  }
  75% {
    -moz-transform: translateX(-5%) rotate(-1deg);
  }
  100% {
    -moz-transform: translateX(0%);
    opacity: 1;
  }
}
@-o-keyframes wobble {
  0% {
    -o-transform: translateX(0%);
  }
  15% {
    -o-transform: translateX(-25%) rotate(-5deg);
  }
  30% {
    -o-transform: translateX(20%) rotate(3deg);
  }
  45% {
    -o-transform: translateX(-15%) rotate(-3deg);
  }
  60% {
    -o-transform: translateX(10%) rotate(2deg);
  }
  75% {
    -o-transform: translateX(-5%) rotate(-1deg);
  }
  100% {
    -o-transform: translateX(0%);
    opacity: 1;
  }
}
@keyframes wobble {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
  15% {
    -webkit-transform: translateX(-25%) rotate(-5deg);
            transform: translateX(-25%) rotate(-5deg);
  }
  30% {
    -webkit-transform: translateX(20%) rotate(3deg);
            transform: translateX(20%) rotate(3deg);
  }
  45% {
    -webkit-transform: translateX(-15%) rotate(-3deg);
            transform: translateX(-15%) rotate(-3deg);
  }
  60% {
    -webkit-transform: translateX(10%) rotate(2deg);
            transform: translateX(10%) rotate(2deg);
  }
  75% {
    -webkit-transform: translateX(-5%) rotate(-1deg);
            transform: translateX(-5%) rotate(-1deg);
  }
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    opacity: 1;
  }
}
@-webkit-keyframes shake {
  50% {
    transform: rotate(10deg);
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    -o-transform: rotate(10deg);
  }
  0%,
  100% {
    transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
  }
}
@keyframes shake {
  50% {
    transform: rotate(10deg);
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    -o-transform: rotate(10deg);
  }
  0%,
  100% {
    transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
  }
}
@-webkit-keyframes flip1 {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
  }
  25% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
  }
  50% {
    -webkit-transform: perspective(400px) rotateY(10deg);
  }
  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
  }
}
@keyframes flip1 {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
            transform: perspective(400px) rotateY(90deg);
  }
  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
            transform: perspective(400px) rotateY(-10deg);
  }
  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
            transform: perspective(400px) rotateY(10deg);
  }
  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
            transform: perspective(400px) rotateY(0deg);
  }
}
@-webkit-keyframes flip2 {
  0% {
    -webkit-transform: perspective(400px) rotateY(-90deg);
  }
  25% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
  }
  50% {
    -webkit-transform: perspective(400px) rotateY(10deg);
  }
  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
  }
}
@keyframes flip2 {
  0% {
    -webkit-transform: perspective(400px) rotateY(-90deg);
            transform: perspective(400px) rotateY(-90deg);
  }
  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
            transform: perspective(400px) rotateY(-10deg);
  }
  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
            transform: perspective(400px) rotateY(10deg);
  }
  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
            transform: perspective(400px) rotateY(0deg);
  }
}
@-webkit-keyframes shine {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.1;
  }
}
@-webkit-keyframes gif {
  0% {
    background-position: 0%;
    opacity: 1;
  }
  100% {
    background-position: 200%;
    opacity: 1;
  }
}
@keyframes gif {
  0% {
    background-position: 0%;
    opacity: 1;
  }
  100% {
    background-position: 200%;
    opacity: 1;
  }
}
@-webkit-keyframes zoom2 {
  0% {
    -webkit-transform: scale3d(0.98, 1, 1);
    transform: scale3d(0.98, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  100% {
    -webkit-transform: scale3d(0.98, 1, 1);
    transform: scale3d(0.98, 1, 1);
  }
}
@keyframes zoom2 {
  0% {
    -webkit-transform: scale3d(0.98, 1, 1);
    transform: scale3d(0.98, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  100% {
    -webkit-transform: scale3d(0.98, 1, 1);
    transform: scale3d(0.98, 1, 1);
  }
}
@-webkit-keyframes matrix {
  0% {
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, -0.0015, 0, 0, 1, 0, 0, 0, 0, 1);
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, -0.0015, 0, 0, 1, 0, 0, 0, 0, 1);
    transform-origin: center center 0;
    -webkit-transform-origin: center center 0;
  }
  100% {
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform-origin: center center 0;
    -webkit-transform-origin: center center 0;
  }
}
@keyframes matrix {
  0% {
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, -0.0015, 0, 0, 1, 0, 0, 0, 0, 1);
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, -0.0015, 0, 0, 1, 0, 0, 0, 0, 1);
    transform-origin: center center 0;
    -webkit-transform-origin: center center 0;
  }
  100% {
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform-origin: center center 0;
    -webkit-transform-origin: center center 0;
  }
}
@-webkit-keyframes scaleSkill {
  0% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
  50% {
    -webkit-transform: translate(-50%, -50%) scale(1.2);
            transform: translate(-50%, -50%) scale(1.2);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
}
@-moz-keyframes scaleSkill {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }
  50% {
    transform: translate(-50%, -50%) scale(1.2);
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
  }
}
@-ms-keyframes scaleSkill {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }
  50% {
    transform: translate(-50%, -50%) scale(1.2);
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
  }
}
@-o-keyframes scaleSkill {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }
  50% {
    transform: translate(-50%, -50%) scale(1.2);
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
  }
}
@keyframes scaleSkill {
  0% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
  50% {
    -webkit-transform: translate(-50%, -50%) scale(1.2);
            transform: translate(-50%, -50%) scale(1.2);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
}
@-webkit-keyframes btnShake {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(-2px);
            transform: translateX(-2px);
  }
  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  75% {
    -webkit-transform: translateX(2px);
            transform: translateX(2px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-moz-keyframes btnShake {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-2px);
  }
  50% {
    transform: translateX(0);
  }
  75% {
    transform: translateX(2px);
  }
  100% {
    transform: translateX(0);
  }
}
@-ms-keyframes btnShake {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-2px);
  }
  50% {
    transform: translateX(0);
  }
  75% {
    transform: translateX(2px);
  }
  100% {
    transform: translateX(0);
  }
}
@-o-keyframes btnShake {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-2px);
  }
  50% {
    transform: translateX(0);
  }
  75% {
    transform: translateX(2px);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes btnShake {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(-2px);
            transform: translateX(-2px);
  }
  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  75% {
    -webkit-transform: translateX(2px);
            transform: translateX(2px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-webkit-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0) scaleY(5);
            transform: translate3d(0, 3000px, 0) scaleY(5);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
            transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);
            transform: translate3d(0, 10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);
            transform: translate3d(0, -5px, 0) scaleY(0.985);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@-moz-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  75% {
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }
  90% {
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@-ms-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  75% {
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }
  90% {
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@-o-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  75% {
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }
  90% {
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0) scaleY(5);
            transform: translate3d(0, 3000px, 0) scaleY(5);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
            transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);
            transform: translate3d(0, 10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);
            transform: translate3d(0, -5px, 0) scaleY(0.985);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes speaker {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes speaker {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-ms-keyframes speaker {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes speaker {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes speaker {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  6.5% {
    -webkit-transform: translateX(-8px) rotateY(-9deg);
            transform: translateX(-8px) rotateY(-9deg);
  }
  18.5% {
    -webkit-transform: translateX(7px) rotateY(7deg);
            transform: translateX(7px) rotateY(7deg);
  }
  31.5% {
    -webkit-transform: translateX(-4px) rotateY(-5deg);
            transform: translateX(-4px) rotateY(-5deg);
  }
  43.5% {
    -webkit-transform: translateX(4px) rotateY(3deg);
            transform: translateX(4px) rotateY(3deg);
  }
  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-moz-keyframes headShake {
  0% {
    transform: translateX(0);
  }
  6.5% {
    transform: translateX(-8px) rotateY(-9deg);
  }
  18.5% {
    transform: translateX(7px) rotateY(7deg);
  }
  31.5% {
    transform: translateX(-4px) rotateY(-5deg);
  }
  43.5% {
    transform: translateX(4px) rotateY(3deg);
  }
  50% {
    transform: translateX(0);
  }
}
@-ms-keyframes headShake {
  0% {
    transform: translateX(0);
  }
  6.5% {
    transform: translateX(-8px) rotateY(-9deg);
  }
  18.5% {
    transform: translateX(7px) rotateY(7deg);
  }
  31.5% {
    transform: translateX(-4px) rotateY(-5deg);
  }
  43.5% {
    transform: translateX(4px) rotateY(3deg);
  }
  50% {
    transform: translateX(0);
  }
}
@-o-keyframes headShake {
  0% {
    transform: translateX(0);
  }
  6.5% {
    transform: translateX(-8px) rotateY(-9deg);
  }
  18.5% {
    transform: translateX(7px) rotateY(7deg);
  }
  31.5% {
    transform: translateX(-4px) rotateY(-5deg);
  }
  43.5% {
    transform: translateX(4px) rotateY(3deg);
  }
  50% {
    transform: translateX(0);
  }
}
@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  6.5% {
    -webkit-transform: translateX(-8px) rotateY(-9deg);
            transform: translateX(-8px) rotateY(-9deg);
  }
  18.5% {
    -webkit-transform: translateX(7px) rotateY(7deg);
            transform: translateX(7px) rotateY(7deg);
  }
  31.5% {
    -webkit-transform: translateX(-4px) rotateY(-5deg);
            transform: translateX(-4px) rotateY(-5deg);
  }
  43.5% {
    -webkit-transform: translateX(4px) rotateY(3deg);
            transform: translateX(4px) rotateY(3deg);
  }
  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
            transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@-moz-keyframes zoomIn {
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}
@-ms-keyframes zoomIn {
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}
@-o-keyframes zoomIn {
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}
@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
            transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
.zoomInsss {
  position: absolute;
  opacity: 0;
  left: -100%;
  -webkit-animation-name: zoomInsss;
          animation-name: zoomInsss;
}
@-webkit-keyframes zoomInsss {
  50% {
    opacity: .2;
  }
  100% {
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    opacity: 1;
  }
}
@-moz-keyframes zoomInsss {
  50% {
    opacity: .2;
  }
  100% {
    left: 50%;
    transform: translateX(-50%);
    opacity: 1;
  }
}
@-ms-keyframes zoomInsss {
  50% {
    opacity: .2;
  }
  100% {
    left: 50%;
    transform: translateX(-50%);
    opacity: 1;
  }
}
@-o-keyframes zoomInsss {
  50% {
    opacity: .2;
  }
  100% {
    left: 50%;
    transform: translateX(-50%);
    opacity: 1;
  }
}
@keyframes zoomInsss {
  50% {
    opacity: .2;
  }
  100% {
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    opacity: 1;
  }
}
.zoomInsss {
  -webkit-animation-name: zoomInsss;
          animation-name: zoomInsss;
}
@-webkit-keyframes zoomOutDown {
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
    right: 0%;
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
@-moz-keyframes zoomOutDown {
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
    right: 0%;
    transform: translateX(100%);
  }
}
@-ms-keyframes zoomOutDown {
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
    right: 0%;
    transform: translateX(100%);
  }
}
@-o-keyframes zoomOutDown {
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
    right: 0%;
    transform: translateX(100%);
  }
}
@keyframes zoomOutDown {
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
    right: 0%;
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
.zoomOutDown {
  z-index: 2;
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
}
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@-moz-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@-ms-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@-o-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.fade-enter-active,
.fade-leave-active {
  -webkit-transition: opacity 1s;
  transition: opacity 1s;
}
.fade-enter,
.fade-leave-active {
  opacity: 0;
}
.vux-fade-enter-active,
.vux-fade-leave-active {
  opacity: 1;
  -webkit-transition: opacity linear 0.2s;
  transition: opacity linear 0.2s;
}
.vux-fade-enter,
.vux-fade-leave-to {
  opacity: 0;
}
.vux-dialog-enter-active,
.vux-dialog-leave-active {
  opacity: 1;
  -webkit-transition-duration: 400ms;
          transition-duration: 400ms;
  -webkit-transform: translate(-50%, -50%) scale(1) !important;
          transform: translate(-50%, -50%) scale(1) !important;
  -webkit-transition-property: opacity, -webkit-transform !important;
  transition-property: opacity, -webkit-transform !important;
  transition-property: transform, opacity !important;
  transition-property: transform, opacity, -webkit-transform !important;
}
.vux-dialog-leave-active {
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(0.85) !important;
          transform: translate(-50%, -50%) scale(0.85) !important;
}
.vux-dialog-enter {
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(1.185) !important;
          transform: translate(-50%, -50%) scale(1.185) !important;
}
.vux-mask-enter,
.vux-mask-leave-active {
  opacity: 0;
}
.vux-mask-leave-active,
.vux-mask-enter-active {
  -webkit-transition: opacity 300ms;
  transition: opacity 300ms;
}
.slide-fade-enter-active {
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}
.slide-fade-leave-active {
  -webkit-transition: all 0.8s cubic-bezier(1, 0.5, 0.8, 1);
  transition: all 0.8s cubic-bezier(1, 0.5, 0.8, 1);
}
.slide-fade-enter,
.slide-fade-leave-to {
  -webkit-transform: translateX(10px);
          transform: translateX(10px);
  opacity: 0;
}
html,
body {
  position: relative;
  margin: 0 auto;
  width: 100%;
  height: 100%;
  min-width: 1200px;
  background: #161614;
}
#app {
  height: 100%;
}
body {
  font-size: 16px;
}
#_js_neteaes_tips {
  display: none !important;
}
.container-index {
  position: fixed;
  width: 100%;
  height: 100%;
}
.container-index .index-video-wrap {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.container-index .index-video-wrap video {
  width: 100%;
}
.container-index .index-video-wrap div {
  position: fixed;
  bottom: 2%;
  left: 50%;
  opacity: .5;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-size: 14px;
  color: #a3a3a3;
  z-index: 9999;
  letter-spacing: 2px;
  -webkit-animation: shows 2s infinite;
          animation: shows 2s infinite;
}
@-webkit-keyframes shows {
  0% {
    opacity: 0;
  }
  50% {
    opacity: .7;
  }
  100% {
    opacity: 0;
  }
}
@keyframes shows {
  0% {
    opacity: 0;
  }
  50% {
    opacity: .7;
  }
  100% {
    opacity: 0;
  }
}
.gallery-top .kv-jianan {
  left: 60% !important;
  top: 60px !important;
  -webkit-transform: translateX(-50%) !important;
          transform: translateX(-50%) !important;
  margin-left: unset !important;
}
.gallery-top .gallery-name-hadi,
.gallery-top .gallery-name-weiqing,
.gallery-top .gallery-name-liulian,
.gallery-top .gallery-name-xl,
.gallery-top .gallery-name-lm {
  display: none;
}
.gallery-top .gallery-name-jianan {
  left: 56% !important;
  top: 50px !important;
  -webkit-transform: scale(0.9);
          transform: scale(0.9);
}
.gallery-top .gallery-name-yll {
  left: 56% !important;
  top: 50px !important;
  -webkit-transform: scale(0.9);
          transform: scale(0.9);
}
.kv-hadi {
  margin-left: 938px;
}
.temp {
  position: relative;
}
#heroCursor {
  position: absolute;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/cursor_de4a503f.png) no-repeat center top;
  width: 149px;
  height: 149px;
  cursor: none;
}
.container-hero {
  width: 100%;
  height: 100vh;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/bg_d55c3aff.jpg) no-repeat center top;
  background-size: cover;
  overflow: hidden;
}
.container-hero .gallery-thumbs {
  width: 80%;
  position: absolute;
  left: 20%;
  top: 670px;
  z-index: 2;
}
.container-hero .gallery-thumbs .wj {
  background-position-x: 225px;
}
.container-hero .gallery-thumbs .thumb-slide-1.fadeOut {
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}
.container-hero .gallery-thumbs .nhy {
  background-position-x: -5px;
}
.container-hero .gallery-thumbs .thumb-slide-2.fadeOut {
  -webkit-animation-delay: 0.05s;
          animation-delay: 0.05s;
}
.container-hero .gallery-thumbs .tianhai {
  background-position-x: -235px;
}
.container-hero .gallery-thumbs .thumb-slide-3.fadeOut {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.container-hero .gallery-thumbs .csn {
  background-position-x: -465px;
}
.container-hero .gallery-thumbs .thumb-slide-4.fadeOut {
  -webkit-animation-delay: 0.15s;
          animation-delay: 0.15s;
}
.container-hero .gallery-thumbs .wtxz {
  background-position-x: -695px;
}
.container-hero .gallery-thumbs .thumb-slide-5.fadeOut {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.container-hero .gallery-thumbs .gqh {
  background-position-x: -925px;
}
.container-hero .gallery-thumbs .thumb-slide-6.fadeOut {
  -webkit-animation-delay: 0.25s;
          animation-delay: 0.25s;
}
.container-hero .gallery-thumbs .hutao {
  background-position-x: -1155px;
}
.container-hero .gallery-thumbs .thumb-slide-7.fadeOut {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.container-hero .gallery-thumbs .jch {
  background-position-x: -1385px;
}
.container-hero .gallery-thumbs .thumb-slide-8.fadeOut {
  -webkit-animation-delay: 0.35s;
          animation-delay: 0.35s;
}
.container-hero .gallery-thumbs .jianan {
  background-position-x: -1615px;
}
.container-hero .gallery-thumbs .thumb-slide-9.fadeOut {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}
.container-hero .gallery-thumbs .tme {
  background-position-x: -1845px;
}
.container-hero .gallery-thumbs .thumb-slide-10.fadeOut {
  -webkit-animation-delay: 0.45s;
          animation-delay: 0.45s;
}
.container-hero .gallery-thumbs .wuchen {
  background-position-x: -2075px;
}
.container-hero .gallery-thumbs .thumb-slide-11.fadeOut {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
.container-hero .gallery-thumbs .yueshan {
  background-position-x: -2305px;
}
.container-hero .gallery-thumbs .thumb-slide-12.fadeOut {
  -webkit-animation-delay: 0.55s;
          animation-delay: 0.55s;
}
.container-hero .gallery-thumbs .huwei {
  background-position-x: -2535px;
}
.container-hero .gallery-thumbs .thumb-slide-13.fadeOut {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}
.container-hero .gallery-thumbs .sm {
  background-position-x: -2765px;
}
.container-hero .gallery-thumbs .thumb-slide-14.fadeOut {
  -webkit-animation-delay: 0.65s;
          animation-delay: 0.65s;
}
.container-hero .gallery-thumbs .jyy {
  background-position-x: -2995px;
}
.container-hero .gallery-thumbs .thumb-slide-15.fadeOut {
  -webkit-animation-delay: 0.7s;
          animation-delay: 0.7s;
}
.container-hero .gallery-thumbs .yll {
  background-position-x: -3225px;
}
.container-hero .gallery-thumbs .thumb-slide-16.fadeOut {
  -webkit-animation-delay: 0.75s;
          animation-delay: 0.75s;
}
.container-hero .gallery-thumbs .hadi {
  background-position-x: -3455px;
}
.container-hero .gallery-thumbs .thumb-slide-17.fadeOut {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}
.container-hero .gallery-thumbs .weiqing {
  background-position-x: -3685px;
}
.container-hero .gallery-thumbs .thumb-slide-18.fadeOut {
  -webkit-animation-delay: 0.85s;
          animation-delay: 0.85s;
}
.container-hero .gallery-thumbs .liulian {
  background-position-x: -3915px;
}
.container-hero .gallery-thumbs .thumb-slide-19.fadeOut {
  -webkit-animation-delay: 0.9s;
          animation-delay: 0.9s;
}
.container-hero .gallery-thumbs .xl {
  background-position-x: -4145px;
}
.container-hero .gallery-thumbs .thumb-slide-20.fadeOut {
  -webkit-animation-delay: 0.95s;
          animation-delay: 0.95s;
}
.container-hero .gallery-thumbs .lm {
  background-position-x: -4375px;
}
.container-hero .gallery-thumbs .thumb-slide-21.fadeOut {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}
.container-hero .gallery-thumbs .wj {
  background-position-x: 0px;
}
.container-hero .gallery-thumbs .thumb-slide {
  width: 230px;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-animation: zoomIn 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
          animation: zoomIn 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.container-hero .gallery-thumbs .thumb-slide.fadeOut {
  -webkit-animation-name: fadeOutDown;
          animation-name: fadeOutDown;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
.container-hero .gallery-thumbs .thumb-slide.fadeIn {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
}
.container-hero .gallery-thumbs .thumb-item,
.container-hero .gallery-thumbs .thumb-item-active {
  margin: 20px auto;
  position: relative;
  width: 230px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/tab-bg_3be65e12.jpg) no-repeat center bottom;
  height: 213px;
  background-size: 100%;
  cursor: pointer;
}
.container-hero .gallery-thumbs .thumb-item .thumb-kv-container,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv-container {
  position: absolute;
  left: 0;
  bottom: 0;
  overflow: hidden;
  width: 230px;
  height: 213px;
}
.container-hero .gallery-thumbs .thumb-item:hover,
.container-hero .gallery-thumbs .thumb-item-active:hover {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/tab-bg2_0c341fa0.jpg) no-repeat center bottom;
}
.container-hero .gallery-thumbs .thumb-item:hover .thumb-kv,
.container-hero .gallery-thumbs .thumb-item-active:hover .thumb-kv {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}
.container-hero .gallery-thumbs .thumb-item .thumb-kv,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv {
  position: absolute;
  left: 0;
  bottom: 0;
  -webkit-transition: -webkit-transform 0.6s ease-in-out;
  transition: -webkit-transform 0.6s ease-in-out;
  transition: transform 0.6s ease-in-out;
  transition: transform 0.6s ease-in-out, -webkit-transform 0.6s ease-in-out;
  width: 100%;
  height: 100%;
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-kv_bd4bb98f.png);
  background-repeat: no-repeat;
  background-position-y: 0;
}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.huwei,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.huwei {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-544px -0px;
width:231px;
height:213px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.sm,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.sm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-544px -215px;
width:230px;
height:213px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.jyy,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.jyy {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-777px -416px;
width:174px;
height:175px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.yll,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.yll {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-0px -522px;
width:209px;
height:219px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.hadi,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.hadi {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-187px -743px;
width:159px;
height:150px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.weiqing,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.weiqing {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-0px -743px;
width:185px;
height:164px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.liulian,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.liulian {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-777px -0px;
width:230px;
height:162px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.xl,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.xl {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-443px -522px;
width:230px;
height:165px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.lm,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.lm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-777px -593px;
width:206px;
height:144px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-kv.wj,
.container-hero .gallery-thumbs .thumb-item-active .thumb-kv.wj {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-211px -522px;
width:230px;
height:177px;

}
.container-hero .gallery-thumbs .thumb-item .thumb-name,
.container-hero .gallery-thumbs .thumb-item-active .thumb-name {
  position: absolute;
  right: 0;
  bottom: 0;
  font-family: 'fzcjljt';
  font-size: 26px;
  color: #e6e0e0;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-544px -430px;
width:118px;
height:68px;

  text-align: center;
}
.container-hero .gallery-thumbs .thumb-item .thumb-name span,
.container-hero .gallery-thumbs .thumb-item-active .thumb-name span {
  position: relative;
  display: inline-block;
  padding-top: 14px;
}
.container-hero .gallery-thumbs .thumb-item .thumb-name span:before,
.container-hero .gallery-thumbs .thumb-item-active .thumb-name span:before {
  content: '';
  width: 1em;
  height: 0;
  display: block;
  border-top: 3px solid #ac1212;
  position: absolute;
  bottom: -12px;
  left: 0;
}
.container-hero .gallery-thumbs .thumb-item-active {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/tab-bg2_0c341fa0.jpg) no-repeat center bottom;
}
@media screen and (max-height: 890px) {
  .container-hero .gallery-thumbs {
    position: fixed;
    top: auto;
    bottom: 0px;
  }
}
.gallery-top .hero-video-wrap {
  position: absolute;
  top: 158px;
  width: 1500px;
  height: 730px;
  left: 50%;
  margin-left: -751px;
  overflow: hidden;
}
.gallery-top .hero-video-wrap::after {
  width: 1500px;
  height: 730px;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  background: rgba(0, 0, 0, 0.1);
}
.gallery-top .hero-video-wrap video {
  position: absolute;
  width: 100%;
  height: 100%;
}
.gallery-top .kv-item {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 883px;
  overflow: hidden;
}
.gallery-top .kv-item .kv-hadi,
.gallery-top .kv-item .kv-weiqing,
.gallery-top .kv-item .kv-liulian,
.gallery-top .kv-item .kv-xl,
.gallery-top .kv-item .kv-lm {
  width: 1920px;
  margin-left: -938px;
}
.gallery-top .kv-item .kv-tianhai {
  margin-left: -759px;
}
.gallery-top .kv {
  position: absolute;
  left: 50%;
  top: 0;
  width: 1423px;
  height: 936px;
  margin-left: -719px;
  cursor: pointer;
}
.gallery-top .kv-huwei {
  width: 1607px;
}
.gallery-top .kv-liulian {
  width: 1920px;
}
.gallery-top .kv-wj {
  width: 1472px;
  margin-left: -886px;
}
.gallery-top .name {
  position: absolute;
  left: 50%;
  cursor: pointer;
}
.gallery-top .name.pos-center {
  width: 268px;
  height: 484px;
  top: 286px;
  margin-left: -34px;
}
.gallery-top .name.pos-left {
  width: 508px;
  height: 784px;
  top: 56px;
  margin-left: -446px;
}
.gallery-top .name.pos-right {
  width: 515px;
  height: 780px;
  top: 27px;
  margin-left: 72px;
}
.gallery-top .name.gallery-name-wj {
  top: 112px;
  width: 322px;
  height: 498px;
  margin-left: -580px;
}
.gallery-top .kv-wj {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-wj_efcc844c.png) no-repeat;
}
.gallery-top .gallery-name-wj {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-wj_9480f51c.png) no-repeat;
}
.gallery-top .kv-nhy {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-nhy_de920048.png) no-repeat;
}
.gallery-top .gallery-name-nhy {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-nhy_b2210acb.png) no-repeat;
}
.gallery-top .kv-tianhai {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-tianhai_1fed0756.png) no-repeat;
}
.gallery-top .gallery-name-tianhai {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-tianhai_2783ddca.png) no-repeat;
}
.gallery-top .kv-csn {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-csn_52b17a95.png) no-repeat;
}
.gallery-top .gallery-name-csn {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-csn_e3d72928.png) no-repeat;
}
.gallery-top .kv-wtxz {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-wtxz_0a9ef38c.png) no-repeat;
}
.gallery-top .gallery-name-wtxz {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-wtxz_9e34bb1b.png) no-repeat;
}
.gallery-top .kv-gqh {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-gqh_30e364bd.png) no-repeat;
}
.gallery-top .gallery-name-gqh {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-gqh_aaaf9512.png) no-repeat;
}
.gallery-top .kv-hutao {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-hutao_a8399fe0.png) no-repeat;
}
.gallery-top .gallery-name-hutao {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-hutao_806ed52e.png) no-repeat;
}
.gallery-top .kv-jch {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-jch_bff6f750.png) no-repeat;
}
.gallery-top .gallery-name-jch {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-jch_e5ab5da8.png) no-repeat;
}
.gallery-top .kv-jianan {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-jianan_7054e9e1.png) no-repeat;
}
.gallery-top .gallery-name-jianan {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-jianan_07b99fb3.png) no-repeat;
}
.gallery-top .kv-tme {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-tme_9c0bd930.png) no-repeat;
}
.gallery-top .gallery-name-tme {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-tme_008798b0.png) no-repeat;
}
.gallery-top .kv-wuchen {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-wuchen_67ce0993.png) no-repeat;
}
.gallery-top .gallery-name-wuchen {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-wuchen_17b7d358.png) no-repeat;
}
.gallery-top .kv-yueshan {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-yueshan_f9369264.png) no-repeat;
}
.gallery-top .gallery-name-yueshan {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-yueshan_ae923644.png) no-repeat;
}
.gallery-top .kv-huwei {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-huwei_539d74df.png) no-repeat;
}
.gallery-top .gallery-name-huwei {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-huwei_80479fb6.png) no-repeat;
}
.gallery-top .kv-sm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-sm_ae6944a7.png) no-repeat;
}
.gallery-top .gallery-name-sm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-sm_2db5eb93.png) no-repeat;
}
.gallery-top .kv-jyy {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-jyy_3727fc50.png) no-repeat;
}
.gallery-top .gallery-name-jyy {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-jyy_c2648858.png) no-repeat;
}
.gallery-top .kv-yll {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-yll_d411792e.png) no-repeat;
}
.gallery-top .gallery-name-yll {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-yll_0f3942e0.png) no-repeat;
}
.gallery-top .kv-hadi {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-hadi_8aa24542.png) no-repeat;
}
.gallery-top .gallery-name-hadi {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-hadi_ae923644.png) no-repeat;
}
.gallery-top .kv-weiqing {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-weiqing_cea8d7a6.png) no-repeat;
}
.gallery-top .gallery-name-weiqing {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-weiqing_f1750abc.png) no-repeat;
}
.gallery-top .kv-liulian {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-liulian_4edb6827.png) no-repeat;
}
.gallery-top .gallery-name-liulian {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-liulian_1edd349f.png) no-repeat;
}
.gallery-top .kv-xl {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-xl_dd446052.png) no-repeat;
}
.gallery-top .gallery-name-xl {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-xl_c5b3b3d5.png) no-repeat;
}
.gallery-top .kv-lm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/kv-lm_e255ba66.png) no-repeat;
}
.gallery-top .gallery-name-lm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/name-lm_4e12390a.png) no-repeat;
}
.gallery-top .swiper-slide-active .ani-wrap,
.gallery-top .swiper-slide-active .kv,
.gallery-top .swiper-slide-active .name,
.gallery-top .swiper-slide-active .hero-video-wrap {
  display: block;
}
.gallery-top .swiper-slide-active .name {
  -webkit-animation: fadeIn 1s 0.5s;
          animation: fadeIn 1s 0.5s;
}
.swiper-slide-active .thumb-kv,
.thumb-slide-active .thumb-kv {
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
}
.gallery-m-list {
  display: none;
}
.container-scene {
  position: relative;
  width: 100%;
  height: 100%;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/bg_ba11dde7.jpg) no-repeat center top;
  background-size: cover;
  overflow: hidden;
  padding-top: 115px;
}
.container-scene video {
  position: fixed;
  min-width: 1920px;
  width: 100%;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  z-index: 1;
  top: 0;
}
.container-scene .slide-inner-bg {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.container-scene .img-container {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 80px 100px;
}
.container-scene .img-container img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.container-scene .swiper-container {
  width: 100%;
  height: 100%;
}
.titleShow {
  -webkit-animation: titleShow .5s;
          animation: titleShow .5s;
}
.titleHide {
  -webkit-animation: titleHide .5s;
          animation: titleHide .5s;
}
.swiper-bg {
  z-index: 2;
  position: relative;
  width: 100%;
  min-width: 1200px;
  height: 780px;
  font-family: 'fzssksjt';
  margin-top: 12px;
}
.swiper-bg div {
  cursor: pointer;
}
.swiper-bg .swiper {
  cursor: pointer;
  width: 100%;
  height: 100%;
}
.swiper-bg img {
  display: none;
}
.swiper-bg .swiper-mb {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.53);
}
.swiper-bg .swiper-mb div {
  font-family: "fzcjljt";
  position: relative;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  text-align: center;
  letter-spacing: 6px;
  color: #f9f9f9;
  font-size: 22px;
}
.swiper-bg .swiper-mb div::after {
  position: absolute;
  top: 30px;
  left: 50%;
  -webkit-transform: translateX(-62%);
          transform: translateX(-62%);
  content: "";
  height: 3px;
  width: 20px;
  background: #921111;
}
.swiper-bg .swiper-mb2 {
  display: none;
}
.swiper-bg .swiper-mb1,
.swiper-bg .swiper-mb3 {
  display: block;
}
.swiper-bg .swiper-title {
  display: none;
  position: absolute;
  top: -65px;
  left: 0px;
  width: 100%;
  height: 50px;
  -webkit-animation: titleShow .2s;
          animation: titleShow .2s;
  font-size: 30px;
  text-align: left;
  color: #d4cdcd;
  letter-spacing: 8px;
  font-family: 'fzcjljt';
}
.swiper-bg .swiper-title2 {
  display: block;
}
.swiper-bg .swiper-item-title {
  position: absolute;
  top: 30px;
  right: 30px;
  font-family: "fzcjljt";
  font-size: 21px;
  font-weight: 600;
  color: #c0c0c0;
  letter-spacing: 3px;
  -webkit-animation: titleShow 1s;
          animation: titleShow 1s;
}
.swiper-bg .swiper-container-min {
  z-index: 3;
  width: 100%;
  height: 110px;
  max-width: 624px;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(9%);
          transform: translateX(9%);
  bottom: 0px;
  overflow: hidden;
}
.swiper-bg .swiper-container-min ::-webkit-scrollbar {
  width: 0px !important;
  height: 0px !important;
  background-color: rgba(255, 255, 255, 0.5);
}
.swiper-bg .swiper-container-min .fadeOut {
  -webkit-animation-name: fadeOutDown;
          animation-name: fadeOutDown;
  -webkit-animation-duration: .5s;
          animation-duration: .5s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
.swiper-bg .swiper-container-min .fadeIn {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
}
.swiper-bg .swiper-container-min .swiper-slide {
  width: 191px;
  display: inline-block;
  position: relative;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation: item1 1.3s;
          animation: item1 1.3s;
  cursor: pointer;
}
.swiper-bg .swiper-container-min .swiper-slide img {
  margin-right: 15px;
  display: block;
  width: 191px;
  height: 109px;
  -webkit-user-drag: none;
  background-repeat: no-repeat;
  background-size: cover !important;
}
.swiper-bg .swiper-container-min .swiper-slide:hover::after {
  content: "";
  width: 186px;
  height: 103px;
  position: absolute;
  left: 3px;
  top: 3px;
  outline: 3px solid red;
}
.swiper-bg .swiper-item-scroll {
  overflow-x: auto;
  overflow-y: hidden;
}
.swiper-bg .item-default::after {
  content: "";
  width: 186px;
  height: 103px;
  position: absolute;
  left: 3px;
  top: 3px;
  outline: 3px solid red;
}
.swiper-bg .swiper2 {
  display: block;
  outline: 0px solid rgba(255, 255, 255, 0.1);
  -webkit-transition: all 2s;
  transition: all 2s;
  cursor: pointer;
  width: 250px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  width: 1155px;
  position: absolute;
  outline: 102.5px solid rgba(255, 255, 255, 0.1);
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.swiper-bg .swiper3 {
  display: block;
  outline: 0px solid rgba(255, 255, 255, 0.1);
  -webkit-transition: all 2s;
  transition: all 2s;
  cursor: pointer;
  width: 250px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.swiper-bg .swiper-content1 {
  -webkit-animation: swiperleft 1.5s ease;
          animation: swiperleft 1.5s ease;
}
.swiper-bg .RightTemp1 {
  -webkit-animation: RightTemp1 .4s backwards;
          animation: RightTemp1 .4s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/bg-center_2cd17fa8.png) no-repeat;
}
.swiper-bg .RightTemp1 img {
  display: block;
}
.swiper-bg .RightTemp2 {
  -webkit-animation: RightTemp2 .4s backwards;
          animation: RightTemp2 .4s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/bg-center_2cd17fa8.png) no-repeat;
}
.swiper-bg .RightTemp2 img {
  display: block;
}
.swiper-bg .RightTemp3 {
  -webkit-animation: RightTemp3 .8s backwards;
          animation: RightTemp3 .8s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.swiper-bg .RightTemp3::after {
  opacity: 0;
  content: "";
  width: 1357.5px;
  height: 811px;
  position: absolute;
  top: -102.5px;
  left: -102.5px;
  border: 1px solid #4f4748;
  border-radius: 3px;
  -webkit-animation: Ri .9s backwards;
          animation: Ri .9s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.swiper-bg .RightTemp3 img {
  display: block;
}
.swiper-bg .LeftTemp4 {
  -webkit-animation: LeftTemp4 1s backwards;
          animation: LeftTemp4 1s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.swiper-bg .LeftTemp4 img {
  display: block;
}
.swiper-bg .LeftTemp4::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.53);
}
.swiper-bg .RightTemp4 {
  -webkit-animation: RightTemp4 1s backwards;
          animation: RightTemp4 1s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.swiper-bg .RightTemp4 img {
  display: block;
}
.swiper-bg .RightTemp4::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.53);
}
.swiper-bg .LeftTemp1 {
  -webkit-animation: LeftTemp1 .8s backwards;
          animation: LeftTemp1 .8s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.swiper-bg .LeftTemp1::after {
  opacity: 0;
  content: "";
  width: 1357.5px;
  height: 811px;
  position: absolute;
  top: -102.5px;
  left: -102.5px;
  border: 1px solid #4f4748;
  border-radius: 3px;
  -webkit-animation: Ri .9s backwards;
          animation: Ri .9s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.swiper-bg .LeftTemp1 img {
  display: block;
}
.swiper-bg .LeftTemp2 {
  -webkit-animation: LeftTemp2 .4s backwards;
          animation: LeftTemp2 .4s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.swiper-bg .LeftTemp2 img {
  display: block;
}
.swiper-bg .LeftTemp3 {
  -webkit-animation: LeftTemp3 .4s backwards;
          animation: LeftTemp3 .4s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.swiper-bg .LeftTemp3 img {
  display: block;
}
@-webkit-keyframes RightTemp1 {
  0% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    right: -100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  100% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    z-index: 99;
  }
}
@keyframes RightTemp1 {
  0% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    right: -100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  100% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    z-index: 99;
  }
}
@-webkit-keyframes RightTemp2 {
  0% {
    width: 1155px;
    position: absolute;
    outline: 102.5px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  20% {
    width: 1155px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  60% {
    width: 500px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 30%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  100% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 0%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
}
@keyframes RightTemp2 {
  0% {
    width: 1155px;
    position: absolute;
    outline: 102.5px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  20% {
    width: 1155px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  60% {
    width: 500px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 30%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  100% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 0%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
}
@-webkit-keyframes RightTemp3 {
  0% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    right: 0%;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  20% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  50% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 50%;
    -webkit-transform: translate(50%, -50%);
            transform: translate(50%, -50%);
    background-size: 100% auto;
  }
  60% {
    width: 600px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 50%;
    -webkit-transform: translate(50%, -50%);
            transform: translate(50%, -50%);
    background-size: 100% auto;
  }
  90% {
    outline: 50px solid rgba(255, 255, 255, 0.1);
  }
  100% {
    width: 1155px;
    z-index: 2;
    position: absolute;
    outline: 102.5px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 50%;
    -webkit-transform: translate(50%, -50%);
            transform: translate(50%, -50%);
    background-size: 100% auto;
  }
}
@keyframes RightTemp3 {
  0% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    right: 0%;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  20% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  50% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 50%;
    -webkit-transform: translate(50%, -50%);
            transform: translate(50%, -50%);
    background-size: 100% auto;
  }
  60% {
    width: 600px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 50%;
    -webkit-transform: translate(50%, -50%);
            transform: translate(50%, -50%);
    background-size: 100% auto;
  }
  90% {
    outline: 50px solid rgba(255, 255, 255, 0.1);
  }
  100% {
    width: 1155px;
    z-index: 2;
    position: absolute;
    outline: 102.5px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 50%;
    -webkit-transform: translate(50%, -50%);
            transform: translate(50%, -50%);
    background-size: 100% auto;
  }
}
@-webkit-keyframes RightTemp4 {
  0% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 0%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
  100% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: -100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
}
@keyframes RightTemp4 {
  0% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 0%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
  100% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: -100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
}
@-webkit-keyframes LeftTemp4 {
  0% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 0%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
  100% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: -100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
}
@keyframes LeftTemp4 {
  0% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 0%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
  100% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: -100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
}
@-webkit-keyframes LeftTemp3 {
  0% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    left: -100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  100% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    z-index: 99;
  }
}
@keyframes LeftTemp3 {
  0% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    left: -100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  100% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    z-index: 99;
  }
}
@-webkit-keyframes LeftTemp2 {
  0% {
    width: 1155px;
    position: absolute;
    outline: 102.5px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  20% {
    width: 1155px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  60% {
    width: 500px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 25%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  100% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 0%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
}
@keyframes LeftTemp2 {
  0% {
    width: 1155px;
    position: absolute;
    outline: 102.5px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  20% {
    width: 1155px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  60% {
    width: 500px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 25%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  100% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    right: 0%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    background-size: 100% auto;
    z-index: 99;
  }
}
@-webkit-keyframes LeftTemp1 {
  0% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  20% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  50% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  60% {
    width: 600px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  90% {
    outline: 50px solid rgba(255, 255, 255, 0.1);
  }
  100% {
    width: 1155px;
    z-index: 2;
    position: absolute;
    outline: 102.5px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
}
@keyframes LeftTemp1 {
  0% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  20% {
    outline: 0px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    width: 250px;
    background-size: 100% auto;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  50% {
    width: 250px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  60% {
    width: 600px;
    position: absolute;
    outline: 0px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
  90% {
    outline: 50px solid rgba(255, 255, 255, 0.1);
  }
  100% {
    width: 1155px;
    z-index: 2;
    position: absolute;
    outline: 102.5px solid rgba(255, 255, 255, 0.1);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: 100% auto;
  }
}
@-webkit-keyframes item1 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  60% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@keyframes item1 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  60% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@-webkit-keyframes item2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  20% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@keyframes item2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  20% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@-webkit-keyframes item3 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  30% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@keyframes item3 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  30% {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@-webkit-keyframes titleShow {
  0% {
    opacity: 0;
  }
  0% > div {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
  100% > div {
    opacity: 0;
  }
}
@keyframes titleShow {
  0% {
    opacity: 0;
  }
  0% > div {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
  100% > div {
    opacity: 0;
  }
}
@-webkit-keyframes Ri {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes Ri {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes titleHide {
  0% {
    opacity: 0;
  }
  90% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes titleHide {
  0% {
    opacity: 0;
  }
  90% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.shar1 {
  -webkit-animation: RightTemp2 .4s backwards;
          animation: RightTemp2 .4s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.shar1 img {
  display: block;
}
.shar2 {
  -webkit-animation: RightTemp3 .8s backwards;
          animation: RightTemp3 .8s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.shar2::after {
  opacity: 0;
  content: "";
  width: 1357.5px;
  height: 811px;
  position: absolute;
  top: -102.5px;
  left: -102.5px;
  border: 1px solid #4f4748;
  border-radius: 3px;
  -webkit-animation: Ri .9s backwards;
          animation: Ri .9s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.shar2 img {
  display: block;
}
.shar3 {
  -webkit-animation: RightTemp1 .4s backwards;
          animation: RightTemp1 .4s backwards;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.shar3 img {
  display: block;
}
.container-outlook-sjg {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sjg2_6008c4ad.jpg) no-repeat center top;
  max-width: 1920px;
  margin: 0 auto;
  background-size: cover;
  width: 100%;
  height: 7200px;
  z-index: 10;
  -webkit-animation: staShow .6s ;
          animation: staShow .6s ;
}
@-webkit-keyframes staShow {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes staShow {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.container-outlook-detail-item {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.container-outlook-detail-item .container-outlook-detail-rlg,
.container-outlook-detail-item .container-outlook-detail-cybl,
.container-outlook-detail-item .container-outlook-detail-wjdg,
.container-outlook-detail-item .container-outlook-detail-yz,
.container-outlook-detail-item .container-outlook-detail-hlg,
.container-outlook-detail-item .container-outlook-detail-hdsy,
.container-outlook-detail-item .container-outlook-detail-lydt {
  position: relative;
  top: 240px;
  left: 67px;
  width: 739px;
  font-family: 思源黑体 CN;
  font-size: 14px;
  letter-spacing: 2.6px;
  color: #c4c4c4;
  line-height: 30px;
}
.container-outlook-detail-item .container-outlook-detail-rlg::after,
.container-outlook-detail-item .container-outlook-detail-cybl::after,
.container-outlook-detail-item .container-outlook-detail-wjdg::after,
.container-outlook-detail-item .container-outlook-detail-yz::after,
.container-outlook-detail-item .container-outlook-detail-hlg::after,
.container-outlook-detail-item .container-outlook-detail-hdsy::after,
.container-outlook-detail-item .container-outlook-detail-lydt::after {
  content: "";
  width: 30px;
  height: 5px;
  background: #7c0e0e;
  position: absolute;
  top: -25px;
  left: 0px;
}
.container-outlook-detail-item .container-outlook-detail-rlg::before,
.container-outlook-detail-item .container-outlook-detail-cybl::before,
.container-outlook-detail-item .container-outlook-detail-wjdg::before,
.container-outlook-detail-item .container-outlook-detail-yz::before,
.container-outlook-detail-item .container-outlook-detail-hlg::before,
.container-outlook-detail-item .container-outlook-detail-hdsy::before,
.container-outlook-detail-item .container-outlook-detail-lydt::before {
  content: "";
  width: 376px;
  height: 1px;
  background: #cecece;
  opacity: .43;
  position: absolute;
  top: -100px;
  left: -67px;
}
.container-outlook-detail-item .container-outlook-detail-cybl {
  top: 338px;
}
.container-outlook-detail-item .container-outlook-detail-cybl::before {
  width: 376px;
  top: -120px;
}
.container-outlook-detail-item .container-outlook-detail-cybl .outlook-detail-list {
  margin: 30px 0 0 53px;
}
.container-outlook-detail-item .container-outlook-detail-wjdg {
  top: 375px;
  letter-spacing: 1.1px;
}
.container-outlook-detail-item .container-outlook-detail-wjdg::before {
  width: 376px;
  top: -140px;
}
.container-outlook-detail-item .container-outlook-detail-yz {
  top: 326px;
}
.container-outlook-detail-item .container-outlook-detail-yz::before {
  width: 376px;
  top: -107px;
}
.container-outlook-detail-item .container-outlook-detail-lydt,
.container-outlook-detail-item .container-outlook-detail-hdsy,
.container-outlook-detail-item .container-outlook-detail-hlg {
  top: 210px;
  letter-spacing: 2px;
}
.container-outlook-detail-item .container-outlook-detail-lydt .container-outlook-detail-list,
.container-outlook-detail-item .container-outlook-detail-hdsy .container-outlook-detail-list,
.container-outlook-detail-item .container-outlook-detail-hlg .container-outlook-detail-list {
  position: absolute;
  top: -90PX;
}
.container-outlook-detail-item .container-outlook-detail-lydt .container-outlook-detail-list ul,
.container-outlook-detail-item .container-outlook-detail-hdsy .container-outlook-detail-list ul,
.container-outlook-detail-item .container-outlook-detail-hlg .container-outlook-detail-list ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 572px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.container-outlook-detail-item .container-outlook-detail-lydt .container-outlook-detail-list ul li,
.container-outlook-detail-item .container-outlook-detail-hdsy .container-outlook-detail-list ul li,
.container-outlook-detail-item .container-outlook-detail-hlg .container-outlook-detail-list ul li {
  position: relative;
  cursor: pointer;
}
.container-outlook-detail-item .container-outlook-detail-lydt .container-outlook-detail-list ul li span,
.container-outlook-detail-item .container-outlook-detail-hdsy .container-outlook-detail-list ul li span,
.container-outlook-detail-item .container-outlook-detail-hlg .container-outlook-detail-list ul li span {
  font-family: 思源黑体 CN;
  font-size: 16px;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(40%, #f4d3d3), color-stop(60%, #dcd8d7));
  background: linear-gradient(180deg, #f4d3d3 40%, #dcd8d7 60%);
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent;
}
.container-outlook-detail-item .container-outlook-detail-lydt .container-outlook-detail-list ul li:after,
.container-outlook-detail-item .container-outlook-detail-hdsy .container-outlook-detail-list ul li:after,
.container-outlook-detail-item .container-outlook-detail-hlg .container-outlook-detail-list ul li:after {
  content: "";
  width: 0px;
  height: 5px;
  background: #7c0e0e;
  position: absolute;
  top: 34px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-transition: width .5s;
  transition: width .5s;
}
.container-outlook-detail-item .container-outlook-detail-lydt .container-outlook-detail-list ul li.active:after,
.container-outlook-detail-item .container-outlook-detail-hdsy .container-outlook-detail-list ul li.active:after,
.container-outlook-detail-item .container-outlook-detail-hlg .container-outlook-detail-list ul li.active:after,
.container-outlook-detail-item .container-outlook-detail-lydt .container-outlook-detail-list ul li:hover:after,
.container-outlook-detail-item .container-outlook-detail-hdsy .container-outlook-detail-list ul li:hover:after,
.container-outlook-detail-item .container-outlook-detail-hlg .container-outlook-detail-list ul li:hover:after {
  width: 30px;
}
.container-outlook-detail-item .container-outlook-detail-lydt .container-outlook-detail-list ul li:hover::after,
.container-outlook-detail-item .container-outlook-detail-hdsy .container-outlook-detail-list ul li:hover::after,
.container-outlook-detail-item .container-outlook-detail-hlg .container-outlook-detail-list ul li:hover::after {
  content: "";
  width: 30px;
  height: 5px;
  background: #7c0e0e;
  position: absolute;
  top: 34px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.container-outlook-detail-item .container-outlook-detail-lydt .container-outlook-detail-list ul .active::after,
.container-outlook-detail-item .container-outlook-detail-hdsy .container-outlook-detail-list ul .active::after,
.container-outlook-detail-item .container-outlook-detail-hlg .container-outlook-detail-list ul .active::after {
  content: "";
  width: 30px;
  height: 5px;
  background: #7c0e0e;
  position: absolute;
  top: 34px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.container-outlook-detail-item .container-outlook-detail-lydt .outlook-detail-p,
.container-outlook-detail-item .container-outlook-detail-hdsy .outlook-detail-p,
.container-outlook-detail-item .container-outlook-detail-hlg .outlook-detail-p {
  margin-bottom: 20px;
}
.container-outlook-detail-item .container-outlook-detail-lydt::before,
.container-outlook-detail-item .container-outlook-detail-hdsy::before,
.container-outlook-detail-item .container-outlook-detail-hlg::before {
  width: 656px;
  top: -56.5px;
}
.container-outlook-detail-item .container-outlook-detail-lydt::after,
.container-outlook-detail-item .container-outlook-detail-hdsy::after,
.container-outlook-detail-item .container-outlook-detail-hlg::after {
  display: none;
  top: -99px;
}
.container-outlook-detail {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/common_3a880eb6.jpg) no-repeat center top;
  margin: 0 auto;
  background-size: cover !important;
  width: 100%;
  min-width: 1800px;
  min-height: 1080px;
  height: 100%;
  z-index: 10;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-animation: staShow .6s;
          animation: staShow .6s;
}
.container-outlook-detail-hdsy-1 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hdsy-1_d5f854cf.jpg);
}
.container-outlook-detail-hdsy-2 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hdsy-2_98606042.jpg);
}
.container-outlook-detail-hdsy-3 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hdsy-3_fadfb763.jpg);
}
.container-outlook-detail-hdsy-4 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hdsy-4_2de695fb.jpg);
}
.container-outlook-detail-hdsy-5 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hdsy-5_de8b182b.jpg);
}
.container-outlook-detail-hdsy-6 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hdsy-6_12d10bbe.jpg);
}
.container-outlook-detail-hlg-1 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hlg-1_aeb0b029.jpg);
}
.container-outlook-detail-hlg-2 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hlg-2_56765436.jpg);
}
.container-outlook-detail-hlg-3 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hlg-3_b414a635.jpg);
}
.container-outlook-detail-hlg-4 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hlg-4_bad2ba9f.jpg);
}
.container-outlook-detail-hlg-5 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hlg-5_5a2e87b1.jpg);
}
.container-outlook-detail-hlg-6 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hlg-6_685b44e6.jpg);
}
.container-outlook-detail-lydt-1 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/lydt-1_a2a6e634.jpg);
}
.container-outlook-detail-lydt-2 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/lydt-2_f596d5cf.jpg);
}
.container-outlook-detail-lydt-3 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/lydt-3_41dd9067.jpg);
}
.container-outlook-detail-lydt-4 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/lydt-4_b5481d8a.jpg);
}
.container-outlook-detail-lydt-5 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/lydt-5_d8d08a09.jpg);
}
.container-outlook-detail-lydt-6 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/lydt-6_b7d911ae.jpg);
}
.container-outlook-detail-jkz-1 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jkz1_3bc9ac7b.jpg);
}
.container-outlook-detail-jkz-2 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jkz2_bccc9e8b.jpg);
}
.container-outlook-detail-jkz-3 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jkz3_2eb9b2e8.jpg);
}
.container-outlook-detail-jkz-4 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jkz4_e9b9faf3.jpg);
}
.container-outlook-detail-jkz-5 {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jkz5_18477802.jpg);
}
.container-outlook-detail .item-left {
  position: relative;
  display: inline-block;
  width: 48.5%;
  height: 100%;
  overflow: hidden;
  color: #a0a0a0;
}
.container-outlook-detail .item-left .btn_prev {
  position: absolute;
  left: 3%;
  top: 434px;
  z-index: 3;
  cursor: pointer;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1067px -299px;
width:30px;
height:58px;

}
.container-outlook-detail .item-left .btn_prev:hover {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-909px -272px;
width:30px;
height:58px;

}
.container-outlook-detail .item-left .btn_next {
  position: absolute;
  right: 3%;
  top: 434px;
  z-index: 3;
  cursor: pointer;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-941px -272px;
width:30px;
height:58px;

}
.container-outlook-detail .item-left .btn_next:hover {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-973px -272px;
width:30px;
height:58px;

}
.container-outlook-detail .item-left .outlook-show {
  width: 100%;
  position: relative;
  top: 450px;
}
.container-outlook-detail .item-left .outlook-show div {
  display: inline-block;
  cursor: pointer;
}
.container-outlook-detail .item-left .outlook-item0 {
  width: 130px;
  text-align: center;
  font-family: 思源黑体 CN;
  position: absolute;
  left: 9%;
  font-size: 14px;
  border: 1px solid #a0a0a0;
  padding: 2px 5px;
}
.container-outlook-detail .item-left .outlook-item0 span {
  display: block;
}
.container-outlook-detail .item-left .outlook-item0::after {
  content: "";
  position: absolute;
  top: -3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1101px -167px;
width:12px;
height:6px;

}
.container-outlook-detail .item-left .outlook-item1 {
  width: 130px;
  text-align: center;
  position: absolute;
  padding: 2px 5px;
  left: 26%;
  font-size: 14px;
  border: 1px solid #a0a0a0;
  font-family: 思源黑体 CN;
}
.container-outlook-detail .item-left .outlook-item1 span {
  display: block;
}
.container-outlook-detail .item-left .outlook-item1::after {
  content: "";
  position: absolute;
  top: -3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1101px -167px;
width:12px;
height:6px;

}
.container-outlook-detail .item-left .outlook-item2 {
  width: 130px;
  text-align: center;
  position: absolute;
  right: 26%;
  padding: 2px 5px;
  font-family: 思源黑体 CN;
  font-size: 14px;
  border: 1px solid #a0a0a0;
}
.container-outlook-detail .item-left .outlook-item2 span {
  display: block;
}
.container-outlook-detail .item-left .outlook-item2::after {
  content: "";
  position: absolute;
  top: -3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1101px -167px;
width:12px;
height:6px;

}
.container-outlook-detail .item-left .outlook-item3 {
  width: 130px;
  text-align: center;
  position: absolute;
  right: 9%;
  font-family: 思源黑体 CN;
  font-size: 14px;
  border: 1px solid #a0a0a0;
  padding: 2px 5px;
}
.container-outlook-detail .item-left .outlook-item3 span {
  display: block;
}
.container-outlook-detail .item-left .outlook-item3::after {
  content: "";
  position: absolute;
  top: -3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1101px -167px;
width:12px;
height:6px;

}
.container-outlook-detail .item-left .outlook-item4 {
  width: 130px;
  text-align: center;
  position: absolute;
  right: -16%;
  font-family: 思源黑体 CN;
  font-size: 14px;
  border: 1px solid #a0a0a0;
  padding: 2px 5px;
}
.container-outlook-detail .item-left .outlook-item4 span {
  display: block;
}
.container-outlook-detail .item-left .outlook-item4::after {
  content: "";
  position: absolute;
  top: -3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1101px -167px;
width:12px;
height:6px;

}
.container-outlook-detail .item-left .outlook-name {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 120px;
  height: 100%;
  font-size: 69px;
  -webkit-transform: translate(-33%, -60%);
          transform: translate(-33%, -60%);
  font-family: 'fzcjljt';
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 30px;
}
.container-outlook-detail .item-left .outlook-name div:nth-child(1) {
  color: #d8d8d8;
  width: 80px;
  margin-right: 5px;
}
.container-outlook-detail .item-left .outlook-name div:nth-child(2) {
  font-size: 30px;
  -webkit-transform: translateY(60%);
          transform: translateY(60%);
}
.container-outlook-detail .item-right {
  position: relative;
  display: inline-block;
  height: 100%;
  background: orange;
}
.long-video {
  z-index: 999;
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.long-video video {
  width: 100%;
}
.container-outlook-index {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
}
.container-outlook,
.xx {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  display: none;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  height: 100%;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/bg_8415f53b.jpg) no-repeat center top;
  background-size: cover;
}
.container-outlook .card-current,
.xx .card-current {
  position: absolute;
  left: 50%;
  top: 165px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 545px;
  height: 650px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center_abbf30f0.png) no-repeat center top;
}
.container-outlook .slide-inner-bg,
.xx .slide-inner-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 800px;
  height: 780px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/bg-inner_4bc9ee9e.jpg) no-repeat;
}
.container-outlook .swiper-container,
.xx .swiper-container {
  width: 100%;
  height: 100%;
}
.container-outlook .swiper-container img,
.xx .swiper-container img {
  -o-object-fit: cover;
     object-fit: cover;
}
.container-outlook .card-container,
.xx .card-container,
.container-outlook .swiper-wrapper,
.xx .swiper-wrapper,
.container-outlook .container-outlook,
.xx .container-outlook {
  width: 1620px;
}
.container-outlook .swiper-button-prev,
.xx .swiper-button-prev {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1009px -759px;
width:70px;
height:52px;

  left: 164px;
  top: 494px;
}
.container-outlook .swiper-button-prev:hover,
.xx .swiper-button-prev:hover {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/arr-left2_c61d6922.png);
}
.container-outlook .swiper-button-next,
.xx .swiper-button-next {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-909px -164px;
width:70px;
height:52px;

  right: 164px;
  top: 494px;
}
.container-outlook .swiper-button-next:hover,
.xx .swiper-button-next:hover {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-909px -218px;
width:70px;
height:52px;

}
.container-outlook .swiper-pagination,
.xx .swiper-pagination {
  display: none;
}
.container-outlook .swiper-slide,
.xx .swiper-slide {
  position: relative;
  top: 185px;
  text-align: center;
  width: 260px;
  font-size: 18px;
  overflow: hidden;
  height: 650px;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-transition: 300ms;
  transition: 300ms;
  cursor: pointer;
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
}
.container-outlook .swiper-slide .swiper-img,
.xx .swiper-slide .swiper-img {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-item_a3c72c40.jpg) no-repeat center top;
  cursor: pointer;
  width: 260px;
  height: 500px;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.container-outlook .swiper-slide:hover .swiper-img,
.xx .swiper-slide:hover .swiper-img {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-item2_b5d60a20.jpg) no-repeat center top;
  cursor: pointer;
  width: 260px;
  height: 500px;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.container-outlook .swiper-slide .desc,
.xx .swiper-slide .desc {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 0px;
  height: 100%;
  color: #e1e1e1;
  font-family: 'fzcjljt';
  font-size: 26px;
  width: 30px;
  -webkit-transform: scale(2);
          transform: scale(2);
}
.container-outlook .swiper-slide .desc div,
.xx .swiper-slide .desc div {
  width: 30px;
}
.container-outlook .swiper-slide .desc div:nth-child(2),
.xx .swiper-slide .desc div:nth-child(2) {
  margin-left: 10px;
  font-size: 16px;
}
.container-outlook .swiper-slide-prev,
.xx .swiper-slide-prev {
  left: -95px;
}
.container-outlook .swiper-slide-next,
.xx .swiper-slide-next {
  right: 200px;
}
.container-outlook .swiper-slide-next + div,
.xx .swiper-slide-next + div {
  right: 300px;
}
.container-outlook .swiper-slide-active,
.xx .swiper-slide-active {
  height: 650px;
  top: 165px;
  z-index: 3;
  right: 150px;
  width: 580px!important;
  -webkit-transform: scale(1);
          transform: scale(1);
}
.container-outlook .swiper-slide-active .swiper-img,
.xx .swiper-slide-active .swiper-img {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center_abbf30f0.png) no-repeat center top;
  width: 580px;
  height: 650px;
}
.container-outlook .swiper-slide-active img,
.xx .swiper-slide-active img {
  display: none;
}
.container-outlook .swiper-slide-active:hover .swiper-img,
.xx .swiper-slide-active:hover .swiper-img {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center_abbf30f0.png) no-repeat center top;
  width: 580px;
  height: 650px;
}
.container-outlook .swiper-slide-active .desc,
.xx .swiper-slide-active .desc {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 0px;
  height: 100%;
  color: #e7e7e7;
  font-size: 60px;
  -webkit-transform: scale(1);
          transform: scale(1);
  width: 100%;
}
.container-outlook .swiper-slide-active .desc div,
.xx .swiper-slide-active .desc div {
  width: 60px;
}
.container-outlook .swiper-slide-active .desc div:nth-child(2),
.xx .swiper-slide-active .desc div:nth-child(2) {
  margin-left: 10px;
  font-size: 32px;
}
.xx {
  -webkit-animation: long 1s;
          animation: long 1s;
  display: block;
  position: fixed;
  z-index: 99;
}
.swiper-key {
  display: none;
}
@-webkit-keyframes long {
  0% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  10% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  20% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  30% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  40% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  50% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes long {
  0% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  10% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  20% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  30% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  40% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  50% {
    opacity: 0;
    -webkit-transform: scale(10);
            transform: scale(10);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
.story-mb {
  display: none;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  background-color: #000000;
  overflow: auto;
}
.story-mb .el-carousel__container {
  height: 100%;
}
.story-mb .el-carousel {
  height: 100%;
}
.story-mb .el-carousel img {
  max-width: 1920px;
  background-repeat: no-repeat;
  display: block;
  margin: 0 auto;
}
.story-mb .el-carousel::after {
  z-index: 99;
  content: "";
  position: absolute;
  width: 120px;
  height: 100%;
  left: 0;
  top: 0;
  background: -webkit-gradient(linear, left top, right top, from(#000000), to(rgba(0, 0, 0, 0)));
  background: linear-gradient(left, #000000, rgba(0, 0, 0, 0));
  /* 标准语法*/
}
.story-mb .el-carousel::before {
  z-index: 99;
  content: "";
  position: absolute;
  width: 120px;
  height: 100%;
  right: 0;
  top: 0;
  background: -webkit-gradient(linear, right top, left top, from(#000000), to(rgba(0, 0, 0, 0)));
  background: linear-gradient(right, #000000, rgba(0, 0, 0, 0));
  /* 标准语法*/
}
.story-mb .story-mb-img {
  position: absolute;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
}
.story-mb .story-mb-bg {
  background-color: orange;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}
.story-mb .story-mb-left {
  position: fixed;
  z-index: 1000;
  cursor: pointer;
  left: 50px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1009px -759px;
width:70px;
height:52px;

}
.story-mb .story-mb-left:hover {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1009px -813px;
width:70px;
height:52px;

}
.story-mb .story-mb-right {
  position: absolute;
  z-index: 1000;
  cursor: pointer;
  right: 50px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-909px -164px;
width:70px;
height:52px;

}
.story-mb .story-mb-right:hover {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-909px -218px;
width:70px;
height:52px;

}
.story-mb .story-mb-x {
  cursor: pointer;
  z-index: 99;
  position: absolute;
  top: 50px;
  right: 50px;
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1081px -489px;
width:30px;
height:30px;

}
.story-mb .story-mb-x:hover {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1081px -543px;
width:30px;
height:30px;

}
.container-hero-detail {
  -webkit-animation: heroShow .8s;
          animation: heroShow .8s;
}
@-webkit-keyframes heroShow {
  0% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}
@keyframes heroShow {
  0% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}
.container-hero-detail .bg {
  width: 100%;
  max-width: 2200px;
  height: 4600px;
  margin: 0 auto;
}
.container-hero-detail .bg-wj {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/wj-bg_c2984196.jpg) no-repeat center top;
}
.container-hero-detail .thumb-wj {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-wj_bd26444a.png) no-repeat center top;
}
.container-hero-detail .hero-current-wj {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/wj_c04f9704.jpg) no-repeat center top;
}
.container-hero-detail .bg-nhy {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/nhy-bg_d3fae121.jpg) no-repeat center top;
}
.container-hero-detail .thumb-nhy {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-nhy_e1e887a9.png) no-repeat center top;
}
.container-hero-detail .hero-current-nhy {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/nhy_bea0ef8d.jpg) no-repeat center top;
}
.container-hero-detail .bg-tianhai {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/tianhai-bg_9443ea1a.jpg) no-repeat center top;
}
.container-hero-detail .thumb-tianhai {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-tianhai_848cafe6.png) no-repeat center top;
}
.container-hero-detail .hero-current-tianhai {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/tianhai_e5711141.jpg) no-repeat center top;
}
.container-hero-detail .bg-csn {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/csn-bg_ec671204.jpg) no-repeat center top;
}
.container-hero-detail .thumb-csn {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-csn_27c85e22.png) no-repeat center top;
}
.container-hero-detail .hero-current-csn {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/csn_494c8722.jpg) no-repeat center top;
}
.container-hero-detail .bg-wtxz {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/wtxz-bg_cefc2612.jpg) no-repeat center top;
}
.container-hero-detail .thumb-wtxz {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-wtxz_0bd3e6fd.png) no-repeat center top;
}
.container-hero-detail .hero-current-wtxz {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/wtxz_56591c59.jpg) no-repeat center top;
}
.container-hero-detail .bg-gqh {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/gqh-bg_35cf5726.jpg) no-repeat center top;
}
.container-hero-detail .thumb-gqh {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-gqh_89b508f7.png) no-repeat center top;
}
.container-hero-detail .hero-current-gqh {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/gqh_fe694eb8.jpg) no-repeat center top;
}
.container-hero-detail .bg-hutao {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hutao-bg_dc8e5534.jpg) no-repeat center top;
}
.container-hero-detail .thumb-hutao {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-hutao_b1050609.png) no-repeat center top;
}
.container-hero-detail .hero-current-hutao {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hutao_43786dfa.jpg) no-repeat center top;
}
.container-hero-detail .bg-jch {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jch-bg_ea6c390c.jpg) no-repeat center top;
}
.container-hero-detail .thumb-jch {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-jch_2e18f312.png) no-repeat center top;
}
.container-hero-detail .hero-current-jch {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jch_74b31e71.jpg) no-repeat center top;
}
.container-hero-detail .bg-jianan {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jianan-bg_2e90b7eb.jpg) no-repeat center top;
}
.container-hero-detail .thumb-jianan {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-jianan_e0356772.png) no-repeat center top;
}
.container-hero-detail .hero-current-jianan {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jianan_91d977e3.jpg) no-repeat center top;
}
.container-hero-detail .bg-tme {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/tme-bg_2ecd5cc2.jpg) no-repeat center top;
}
.container-hero-detail .thumb-tme {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-tme_d9d417e5.png) no-repeat center top;
}
.container-hero-detail .hero-current-tme {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/tme_c7e9afa2.jpg) no-repeat center top;
}
.container-hero-detail .bg-wuchen {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/wuchen-bg_f969ae64.jpg) no-repeat center top;
}
.container-hero-detail .thumb-wuchen {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-wuchen_e8cdff85.png) no-repeat center top;
}
.container-hero-detail .hero-current-wuchen {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/wuchen_6ecf1f28.jpg) no-repeat center top;
}
.container-hero-detail .bg-yueshan {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/yueshan-bg_c48865ad.jpg) no-repeat center top;
}
.container-hero-detail .thumb-yueshan {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-yueshan_94979d1a.png) no-repeat center top;
}
.container-hero-detail .hero-current-yueshan {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/yueshan_1af8dbcc.jpg) no-repeat center top;
}
.container-hero-detail .bg-huwei {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/huwei-bg_a9d9810d.jpg) no-repeat center top;
}
.container-hero-detail .thumb-huwei {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-huwei_919dc3ab.png) no-repeat center top;
}
.container-hero-detail .hero-current-huwei {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/huwei_3abdc9ec.jpg) no-repeat center top;
}
.container-hero-detail .bg-sm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sm-bg_7002e18d.jpg) no-repeat center top;
}
.container-hero-detail .thumb-sm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-sm_6e0fb02f.png) no-repeat center top;
}
.container-hero-detail .hero-current-sm {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sm_c22bbda2.jpg) no-repeat center top;
}
.container-hero-detail .bg-jyy {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jyy-bg_80076050.jpg) no-repeat center top;
}
.container-hero-detail .thumb-jyy {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-jyy_5805c6d9.png) no-repeat center top;
}
.container-hero-detail .hero-current-jyy {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/jyy_534af8c9.jpg) no-repeat center top;
}
.container-hero-detail .bg-yll {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/yll-bg_7357d339.jpg) no-repeat center top;
}
.container-hero-detail .thumb-yll {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-yll_f568eeb5.png) no-repeat center top;
}
.container-hero-detail .hero-current-yll {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/yll_6069aaf4.jpg) no-repeat center top;
}
.container-hero-detail .bg-hadi {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hadi-bg_0b7754a5.jpg) no-repeat center top;
}
.container-hero-detail .thumb-hadi {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-hadi_912e481a.png) no-repeat center top;
}
.container-hero-detail .hero-current-hadi {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/hadi_0cf02d2d.jpg) no-repeat center top;
}
.container-hero-detail .bg-weiqing {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/weiqing-bg_9b622af2.jpg) no-repeat center top;
}
.container-hero-detail .thumb-weiqing {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-weiqing_17217642.png) no-repeat center top;
}
.container-hero-detail .hero-current-weiqing {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/weiqing_d726f2b7.jpg) no-repeat center top;
}
.container-hero-detail .bg-liulian {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/liulian-bg_1a96b78b.jpg) no-repeat center top;
}
.container-hero-detail .thumb-liulian {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-liulian_de7c48ec.png) no-repeat center top;
}
.container-hero-detail .hero-current-liulian {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/liulian_a8c88d70.jpg) no-repeat center top;
}
.container-hero-detail .bg-xl {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/xl-bg_45e0e1d8.jpg) no-repeat center top;
}
.container-hero-detail .thumb-xl {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-xl_57bb9f5e.png) no-repeat center top;
}
.container-hero-detail .hero-current-xl {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/xl_c6eef395.jpg) no-repeat center top;
}
.container-hero-detail .bg-lm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/lm-bg_de5984f4.jpg) no-repeat center top;
}
.container-hero-detail .thumb-lm {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/thumb-lm_ba63b534.png) no-repeat center top;
}
.container-hero-detail .hero-current-lm {
  z-index: 2;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/lm_50c2fc6b.jpg) no-repeat center top;
}
.container-hero-detail .content {
  position: relative;
  width: 1320px;
  margin: 0 auto;
  padding-top: 1082px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.container-hero-detail .role-life {
  position: absolute;
  top: 775px;
  right: 50%;
  margin-right: 320px;
}
.container-hero-detail .role-life p {
  color: #afa6a7;
  font-size: 14px;
  text-align: right;
  margin-bottom: 20px;
}
.container-hero-detail .voice {
  max-width: 800px;
  height: 259px;
  padding: 12px 53px 12px 288px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/music-bg_be3e4b9e.jpg) no-repeat;
}
.container-hero-detail .voice .voice-list {
  overflow-y: scroll;
  height: 100%;
  padding-right: 20px;
  max-width: 800px;
}
.container-hero-detail .voice .voice-list::-webkit-scrollbar {
  cursor: pointer;
  width: 5px;
}
.container-hero-detail .voice .voice-list::-webkit-scrollbar-track {
  display: none;
}
.container-hero-detail .voice .voice-list::-webkit-scrollbar-thumb {
  cursor: pointer;
  width: 5px;
  background-color: rgba(61, 61, 61, 0.7);
}
.container-hero-detail .voice .voice-list p {
  font-size: 16px;
  color: #e2dede;
  height: 60px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  cursor: pointer;
  padding-right: 15px;
}
.container-hero-detail .voice .voice-list p span {
  display: inline-block;
}
.container-hero-detail .voice .voice-list p span:nth-child(1) {
  width: 35px;
}
.container-hero-detail .voice .voice-list p span:nth-child(2) {
  width: 388px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 5px;
}
.container-hero-detail .voice .voice-list p .icon-audio {
  position: relative;
  padding-right: 16px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-1101px -115px;
width:13px;
height:18px;

}
.container-hero-detail .voice .voice-list p .icon-audio i {
  position: absolute;
  right: -5px;
  top: 50%;
  display: block;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-1101px -175px;
width:5px;
height:11px;

  margin-top: -5px;
}
.container-hero-detail .voice .voice-list p .icon-audio i:nth-child(2) {
  right: -10px;
  margin-top: -8px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-1116px -115px;
width:6px;
height:17px;

}
.container-hero-detail .voice .voice-list p .icon-audio.playing i {
  -webkit-animation: speaker 1s infinite;
          animation: speaker 1s infinite;
}
.container-hero-detail .voice .voice-list p .icon-audio.playing i:nth-child(2) {
  -webkit-animation-delay: .2s;
          animation-delay: .2s;
}
.container-hero-detail .video-wrap {
  position: absolute;
  top: 1198px;
  left: 50%;
  margin-left: 140px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-248px -261px;
width:230px;
height:230px;

}
.container-hero-detail .video-wrap .btn-video-player {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -56px 0 0 -56px;
  display: block;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-1009px -0px;
width:113px;
height:113px;

  -webkit-transition: -webkit-transform 0.8s ease-in-out;

  transition: -webkit-transform 0.8s ease-in-out;

  transition: transform 0.8s ease-in-out;

  transition: transform 0.8s ease-in-out, -webkit-transform 0.8s ease-in-out;
}
.container-hero-detail .video-wrap .btn-video-player:hover {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}
.container-hero-detail .picture-wrap {
  position: relative;
  margin: 88px 0 81px 174px;
  height: 1241px;
}
.container-hero-detail .picture-wrap .title {
  margin-left: 380px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-296px -0px;
width:246px;
height:259px;

}
.container-hero-detail .picture-wrap .img-box {
  position: absolute;
  overflow: hidden;
}
.container-hero-detail .picture-wrap .img-box img {
  cursor: pointer;
  -webkit-transition: -webkit-transform 0.8s ease-in-out;
  transition: -webkit-transform 0.8s ease-in-out;
  transition: transform 0.8s ease-in-out;
  transition: transform 0.8s ease-in-out, -webkit-transform 0.8s ease-in-out;
}
.container-hero-detail .picture-wrap .img-box img:hover {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}
.container-hero-detail .picture-wrap .img1 {
  top: 0;
  right: 0;
  width: 520px;
  height: 941px;
}
.container-hero-detail .picture-wrap .img2 {
  top: 941px;
  right: 0;
  width: 520px;
  height: 300px;
}
.container-hero-detail .picture-wrap .img3 {
  top: 258px;
  left: 0;
  width: 627px;
  height: 892px;
}
.container-hero-detail .picture-wrap .more {
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: -36px;
  display: block;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-1009px -115px;
width:90px;
height:90px;

}
.container-hero-detail .picture-wrap .more:hover {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-1009px -207px;
width:90px;
height:90px;

}
.container-hero-detail .story-wrap {
  position: relative;
  height: 815px;
}
.container-hero-detail .story-wrap .title {
  margin-left: 554px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-0px -0px;
width:294px;
height:259px;

}
.container-hero-detail .story-wrap .story-content {
  position: absolute;
  top: 0;
  left: 50%;
  width: 385px;
  margin-left: 200px;
  padding-top: 14px;
}
.container-hero-detail .story-wrap .story-content p {
  text-indent: 2em;
  color: #d0cece;
  font-size: 14px;
  line-height: 30px;
}
.container-hero-detail .more-wrap {
  position: relative;
  overflow: hidden;
}
.container-hero-detail .more-wrap .title {
  position: absolute;
  left: 50%;
  margin-left: -94px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-0px -261px;
width:246px;
height:259px;

}
.container-hero-detail .more-wrap .hero-current {
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: 153px;
  width: 301px;
  height: 1034px;
}
.container-hero-detail .more-wrap .swiper-container {
  overflow: visible !important;
}
.container-hero-detail .more-wrap .more-hero {
  width: 1680px;
  height: 872px;
  margin: 0 auto;
}
.container-hero-detail .more-wrap .more-hero .swiper-wrapper {
  -webkit-transition-timing-function: linear;
          transition-timing-function: linear;
}
.container-hero-detail .more-wrap .more-hero .swiper-slide {
  width: 168px !important;
  height: 436px;
  margin-top: 376px;
}
.container-hero-detail .more-wrap .more-hero .swiper-slide a {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
}
.container-hero-detail .back {
  position: absolute;
  top: 32px;
  left: 275px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-699px -743px;
width:136px;
height:49px;

  z-index: 2;
}
.container-hero-detail .back:hover i {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
}
.container-hero-detail .back i {
  position: absolute;
  left: 25px;
  top: 50%;
  margin-top: -17px;
  display: block;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-1081px -435px;
width:27px;
height:34px;

  -webkit-transition: -webkit-transform .3s ease;

  transition: -webkit-transform .3s ease;

  transition: transform .3s ease;

  transition: transform .3s ease, -webkit-transform .3s ease;
}
.directory__list {
  width: 1280px;
  height: 550px;
  position: absolute;
  left: 50%;
  top: 164px;
  margin-left: -640px;
  margin-top: 0;
  -webkit-perspective: 300px;
          perspective: 300px;
}
.directory__item {
  width: 396px;
  position: absolute;
  left: 0;
  top: 275px;
  display: none;
  opacity: 0;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.directory__item.show {
  opacity: 1;
}
.directory__inactive {
  display: block;
  width: 130px;
  height: 250px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -60px;
  margin-top: -59px;
  opacity: 0;
  -webkit-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
  z-index: 2;
  text-align: center;
}
.directory__inactive .activeText {
  z-index: 3;
  opacity: 0;
  -webkit-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}
.directory__inactive .desc {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 0px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  height: 100%;
  color: #e1e1e1;
  font-family: 'fzcjljt';
  font-size: 26px;
  width: 30px;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.directory__inactive .desc div {
  width: 30px;
}
.directory__inactive .desc div:nth-child(2) {
  margin-left: 10px;
  font-size: 16px;
}
.directory__inactive-hover {
  opacity: 0;
}
.directory__inactive .directory__active-img {
  display: block;
  width: 130px;
  height: 250px;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-item_a3c72c40.jpg) no-repeat center top;
  cursor: pointer;
  opacity: 1;
}
.directory__inactive:hover .directory__active-img {
  cursor: pointer;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-item2_b5d60a20.jpg) no-repeat center top;
  opacity: 1;
}
.directory__inactive.show {
  opacity: 1;
  -webkit-transition: opacity 0.4s 0.2s ease-in-out;
  transition: opacity 0.4s 0.2s ease-in-out;
}
.directory__active {
  display: block;
  width: 545px;
  height: 650px;
  padding: 9px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -278px;
  margin-top: -275px;
  opacity: 0;
  -webkit-transform: scale(0);
          transform: scale(0);
  z-index: 2;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.directory__active .activeText {
  position: absolute;
  left: 82px;
  top: 0;
  width: 380px;
  height: 100%;
  -webkit-transition: opacity 0.45s ease-in-out;
  transition: opacity 0.45s ease-in-out;
}
.directory__active .activeText div {
  z-index: 3;
  display: block;
  opacity: 1;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1009px -299px;
width:56px;
height:80px;

}
.directory__active .activeText div:hover {
  -webkit-filter: brightness(1.2);
          filter: brightness(1.2);
}
.directory__active .directory__active-img {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center_abbf30f0.png) no-repeat center top;
  width: 545px;
  height: 650px;
  opacity: 1;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.directory__active .desc {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  top: 0px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center_abbf30f0.png) no-repeat center top;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.directory__active .desc div {
  display: none;
}
.directory__active .card-center0 {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center0_89dc81ed.png) no-repeat center top;
}
.directory__active .card-center1 {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center1_799e3279.png) no-repeat center top;
}
.directory__active .card-center2 {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center2_2359e959.png) no-repeat center top;
}
.directory__active .card-center3 {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center3_1f4aeaa2.png) no-repeat center top;
}
.directory__active .card-center4 {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center4_5e5a0b2a.png) no-repeat center top;
}
.directory__active .card-center5 {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center5_a2b2f664.png) no-repeat center top;
}
.directory__active .card-center6 {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center6_dcba6b5e.png) no-repeat center top;
}
.directory__active .card-center7 {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center7_fb4a79b0.png) no-repeat center top;
}
.directory__active .card-center8 {
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/card-center8_f3cce6ad.png) no-repeat center top;
}
.directory__active-wrapper {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.directory__active-bg {
  position: relative;
  -webkit-transition: -webkit-transform 0.4s ease-in-out;
  transition: -webkit-transform 0.4s ease-in-out;
  transition: transform 0.4s ease-in-out;
  transition: transform 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out;
}
.directory__active-img {
  position: absolute;
  left: 9px;
  top: 6px;
}
.directory__active-border1 {
  width: 396px;
  height: 550px;
  position: absolute;
  left: 0;
  top: 0;
}
.directory__active-border2 {
  width: 396px;
  height: 550px;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-transform: scale(1.02);
          transform: scale(1.02);
  opacity: 0;
  -webkit-transition: all 0.6s 0.2s ease-in-out;
  transition: all 0.6s 0.2s ease-in-out;
}
.directory__active-cloud1 {
  display: block;
  width: 61px;
  height: 34px;
  position: absolute;
  left: -61px;
  top: 60px;
  -webkit-transform: translate3d(10px, 0, 0);
          transform: translate3d(10px, 0, 0);
  opacity: 0;
  -webkit-transition: all 1s 0.4s ease-in-out;
  transition: all 1s 0.4s ease-in-out;
}
.directory__active-cloud2 {
  display: block;
  width: 108px;
  height: 34px;
  position: absolute;
  right: -108px;
  bottom: 70px;
  -webkit-transform: translate3d(-10px, 0, 0);
          transform: translate3d(-10px, 0, 0);
  opacity: 0;
  -webkit-transition: all 1s 0.4s ease-in-out;
  transition: all 1s 0.4s ease-in-out;
}
.directory__active:hover .directory__active-bg {
  -webkit-transform: scale(1.04);
          transform: scale(1.04);
}
.directory__active.show {
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1);
}
.directory__active.show .directory__active .directory__active-img {
  display: block;
  -webkit-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-777px -164px;
width:130px;
height:250px;

  cursor: pointer;
  opacity: 1;
}
.directory__active.show .directory__active .desc {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 0px;
  height: 100%;
  color: #e7e7e7;
  font-size: 60px;
  width: 60px;
}
.directory__active.show .directory__active .desc div {
  width: 60px!important;
}
.directory__active.show .directory__active .desc div:nth-child(2) {
  margin-left: 10px;
  font-size: 32px;
}
.directory__active.show .directory__active-cloud1 {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  opacity: 1;
}
.directory__active.show .directory__active-cloud2 {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  opacity: 1;
}
.directory__active.show .directory__active-border2 {
  -webkit-transform: scale(1);
          transform: scale(1);
  opacity: 1;
}
.directory__active.show .directory__enter-bg {
  -webkit-transform: scale(1);
          transform: scale(1);
  opacity: 1;
  -webkit-transition: all 0.4s 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
  transition: all 0.4s 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.directory__active.show .directory__enter-line {
  -webkit-transform: scale(1);
          transform: scale(1);
  opacity: 1;
  -webkit-transition: all 0.4s 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55);
  transition: all 0.4s 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.directory__active.show .directory__enter-words {
  -webkit-transform: scale(1);
          transform: scale(1);
  opacity: 1;
  -webkit-transition: all 0.4s 0.8s cubic-bezier(0.68, -0.55, 0.27, 1.55);
  transition: all 0.4s 0.8s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.directory__active-bg-2-1 {
  position: absolute;
  left: 0;
  top: 0;
}
.directory__active-bg-2-2 {
  display: block;
  position: absolute;
  left: 50%;
  top: 315px;
  margin-left: -50px;
}
.directory__active-bg-2-2.directory--left {
  margin-left: -70px;
  -webkit-animation: directory-rotate2 6s linear infinite;
          animation: directory-rotate2 6s linear infinite;
}
.directory__active-bg-2-2.directory--right {
  margin-left: 20px;
  -webkit-animation: directory-rotate 6s linear infinite;
          animation: directory-rotate 6s linear infinite;
}
.directory__active-bg-2-3 {
  position: absolute;
  left: 0;
  top: 0;
}
.directory__enter {
  display: block;
  width: 104px;
  height: 104px;
  position: absolute;
  left: 50%;
  bottom: -42px;
  margin-left: -48px;
  -webkit-transition: all .4s;
  transition: all .4s;
}
.directory__enter-bg {
  width: 102px;
  height: 105px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -51px;
  margin-top: -52px;
  -webkit-transform: scale(0);
          transform: scale(0);
  opacity: 0;
  -webkit-transition: all 0.4s 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
  transition: all 0.4s 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.directory__enter-line {
  width: 90px;
  height: 92px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -45px;
  margin-top: -46px;
  -webkit-transform: scale(0);
          transform: scale(0);
  opacity: 0;
  -webkit-transition: all 0.4s 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55);
  transition: all 0.4s 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.directory__enter-words {
  width: 47px;
  height: 23px;
  text-indent: -9999px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -23px;
  margin-top: -11px;
  -webkit-transform: scale(0);
          transform: scale(0);
  opacity: 0;
  -webkit-transition: all 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
  transition: all 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.directory__arrow {
  display: block;
  width: 19px;
  height: 36px;
  position: absolute;
  top: 490px;
  margin-top: -18px;
  background-repeat: no-repeat;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity .4s;
  transition: opacity .4s;
}
.directory__arrow.show {
  opacity: .4;
  filter: alpha(opacity=40);
}
.directory__arrow:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.directory__arrow.directory--left {
  right: 50%;
  margin-right: 720px;
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1009px -759px;
width:70px;
height:52px;

}
.directory__arrow.directory--left:hover {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-1009px -813px;
width:70px;
height:52px;

}
.directory__arrow.directory--right {
  left: 50%;
  margin-left: 720px;
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-909px -164px;
width:70px;
height:52px;

}
.directory__arrow.directory--right:hover {
  background-image: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png);background-size:1122px 907px;
background-position:-909px -218px;
width:70px;
height:52px;

}
.directory--left2-card {
  left: -120px;
  z-index: 33;
}
.directory--left2-card.animate {
  -webkit-animation: item-show1 0.4s ease-in-out;
          animation: item-show1 0.4s ease-in-out;
}
.directory--left3-card {
  left: 60px;
  z-index: 33;
}
.directory--left3-card.animate {
  -webkit-animation: item-show2 0.6s ease-in-out;
          animation: item-show2 0.6s ease-in-out;
}
.directory--active-card {
  left: 442px;
  z-index: 33;
}
.directory--active-card.animate {
  -webkit-animation: item-show3 0.8s ease-in-out;
          animation: item-show3 0.8s ease-in-out;
}
.directory--right2-card {
  left: 805px;
  z-index: 33;
}
.directory--right2-card.animate {
  -webkit-animation: item-show2 0.6s ease-in-out;
          animation: item-show2 0.6s ease-in-out;
}
.directory--right-card {
  left: 984px;
  z-index: 33;
}
.directory--right-card.animate {
  -webkit-animation: item-show1 0.4s ease-in-out;
          animation: item-show1 0.4s ease-in-out;
}
.directory--bird1 {
  right: 40px;
  top: 100px;
}
.directory--bird2 {
  right: 0px;
  top: 80px;
}
.directory--bird2 .bird__wings {
  -webkit-animation-delay: .2s;
          animation-delay: .2s;
}
@-webkit-keyframes directory-rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes directory-rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes directory-rotate2 {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
  }
}
@keyframes directory-rotate2 {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
  }
}
@-webkit-keyframes item-show1 {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@keyframes item-show1 {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes item-show2 {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  33% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@keyframes item-show2 {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  33% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes item-show3 {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  50% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@keyframes item-show3 {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  50% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 100px);
            transform: translate3d(0, 0, 100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
.sjg {
  width: 100%;
}
.rule {
  width: 100%;
  height: 100%;
  position: relative;
  font-family: 'NotoSansSC';
}
.rule div {
  letter-spacing: 1.5px;
  line-height: 40px;
  color: #c5c5c5;
  width: 515px;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.rule div::after {
  content: "";
  position: absolute;
  top: -25px;
  left: 0;
  width: 30px;
  height: 6px;
  background-color: #8a0a0a;
}
.rule div p {
  font-size: 16px;
  margin-bottom: 30px;
}
.rule > div:nth-child(1) {
  margin-left: -350px;
  top: 490px;
  color: #1c1b1b;
}
.rule > div:nth-child(2) {
  margin-left: 350px;
  width: 560px;
  top: 1470px;
}
.rule > div:nth-child(3) {
  letter-spacing: 5px;
  margin-left: 440px;
  top: 2210px;
  line-height: 37px;
}
.rule > div:nth-child(3) p {
  margin-bottom: 0px;
}
.rule > div:nth-child(4) {
  width: 570px;
  letter-spacing: 1.5px;
  margin-left: -320px;
  top: 3340px;
  line-height: 35px;
}
.rule > div:nth-child(4) p {
  margin-bottom: 0px;
}
.rule > div:nth-child(5) {
  letter-spacing: 2.2px;
  margin-left: 350px;
  top: 4360px;
  line-height: 38px;
}
.rule > div:nth-child(5)::after {
  top: -30px;
}
.rule > div:nth-child(5) p {
  margin-bottom: 0px;
}
.rule > div:nth-child(6) {
  letter-spacing: 2.2px;
  margin-left: 350px;
  top: 5500px;
  line-height: 38px;
}
.rule > div:nth-child(6) p {
  margin-bottom: 0px;
}
.rule > div:nth-child(7) {
  width: 1150px;
  letter-spacing: 1px;
  margin-left: -50px;
  top: 6230px;
  line-height: 38px;
}
.rule > div:nth-child(7)::after {
  top: -40px;
}
.nav-bar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9;
  height: 123px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/nav-bg_411231f0.png) repeat-x;
}
.nav-bar .back {
  cursor: pointer;
  position: absolute;
  top: 32px;
  left: 275px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-699px -743px;
width:136px;
height:49px;

  z-index: 2;
}
.nav-bar .back:hover i {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
}
.nav-bar .back i {
  position: absolute;
  left: 25px;
  top: 50%;
  margin-top: -17px;
  display: block;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-1081px -435px;
width:27px;
height:34px;

  -webkit-transition: -webkit-transform .3s ease;

  transition: -webkit-transform .3s ease;

  transition: transform .3s ease;

  transition: transform .3s ease, -webkit-transform .3s ease;
}
.nav-bar .logo {
  display: block;
  position: absolute;
  top: 16px;
  left: 50px;
  background: url(https://yjwujian.res.netease.com/pc/zt/20220802191715/img/sprite-e627de_e627de75.png) no-repeat;background-size:1122px 907px;
background-position:-348px -743px;
width:211px;
height:94px;

  z-index: 2;
  cursor: pointer;
}
.nav-bar .nav-list {
  position: absolute;
  right: 50px;
  top: 35px;
  display: -webkit-box;
  /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
  display: -moz-box;
  /* Firefox 17- */
  display: -webkit-flex;
  /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
  display: -moz-flex;
  /* Firefox 18+ */
  display: -ms-flexbox;
  /* IE 10 */
  display: flex;
  /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  /* 09版 */
  -webkit-box-pack: center;
  /* 12版 */
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  -ms-flex-pack: center;
      justify-content: center;
  /* 09版 */
  -webkit-box-align: center;
  /* 12版 */
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  -ms-flex-align: center;
      align-items: center;
  margin-right: 10px;
}
.nav-bar .nav-list .nav-item {
  position: relative;
  width: 130px;
  display: block;
  text-align: center;
  font-size: 14px;
  color: #969595;
  padding-bottom: 7px;
}
.nav-bar .nav-list .nav-item:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  width: 0;
  border-top: 2px solid #872718;
  -webkit-transition: width .5s;
  transition: width .5s;
}
.nav-bar .nav-list .nav-item.active,
.nav-bar .nav-list .nav-item:hover {
  color: #fff;
}
.nav-bar .nav-list .nav-item.active:after,
.nav-bar .nav-list .nav-item:hover:after {
  width: 30px;
}
.nav-bar .nav-box {
  position: absolute;
  right: 50px;
  top: 0;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}