@keyframes a {

    0%,
    20%,
    53%,
    80%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        transform: translateZ(0)
    }

    40%,
    43% {
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        transform: translate3d(0, -30px, 0)
    }

    70% {
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        transform: translate3d(0, -15px, 0)
    }

    90% {
        transform: translate3d(0, -4px, 0)
    }
}

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

@keyframes b {

    0%,
    50%,
    to {
        opacity: 1
    }

    25%,
    75% {
        opacity: 0
    }
}

.flash {
    animation-name: b
}

@keyframes c {
    0% {
        transform: scaleX(1)
    }

    50% {
        transform: scale3d(1.05, 1.05, 1.05)
    }

    to {
        transform: scaleX(1)
    }
}

.pulse {
    animation-name: c
}

@keyframes d {
    0% {
        transform: scaleX(1)
    }

    30% {
        transform: scale3d(1.25, .75, 1)
    }

    40% {
        transform: scale3d(.75, 1.25, 1)
    }

    50% {
        transform: scale3d(1.15, .85, 1)
    }

    65% {
        transform: scale3d(.95, 1.05, 1)
    }

    75% {
        transform: scale3d(1.05, .95, 1)
    }

    to {
        transform: scaleX(1)
    }
}

.rubberBand {
    animation-name: d
}

@keyframes e {

    0%,
    to {
        transform: translateZ(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translate3d(-10px, 0, 0)
    }

    20%,
    40%,
    60%,
    80% {
        transform: translate3d(10px, 0, 0)
    }
}

.shake {
    animation-name: e
}

@keyframes f {
    0% {
        transform: translateX(0)
    }

    6.5% {
        transform: translateX(-6px) rotateY(-9deg)
    }

    18.5% {
        transform: translateX(5px) rotateY(7deg)
    }

    31.5% {
        transform: translateX(-3px) rotateY(-5deg)
    }

    43.5% {
        transform: translateX(2px) rotateY(3deg)
    }

    50% {
        transform: translateX(0)
    }
}

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

@keyframes g {
    20% {
        transform: rotate(15deg)
    }

    40% {
        transform: rotate(-10deg)
    }

    60% {
        transform: rotate(5deg)
    }

    80% {
        transform: rotate(-5deg)
    }

    to {
        transform: rotate(0deg)
    }
}

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

@keyframes h {
    0% {
        transform: scaleX(1)
    }

    10%,
    20% {
        transform: scale3d(.9, .9, .9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
    }

    to {
        transform: scaleX(1)
    }
}

.tada {
    animation-name: h
}

@keyframes i {
    0% {
        transform: translateZ(0)
    }

    15% {
        transform: translate3d(-25%, 0, 0) rotate(-5deg)
    }

    30% {
        transform: translate3d(20%, 0, 0) rotate(3deg)
    }

    45% {
        transform: translate3d(-15%, 0, 0) rotate(-3deg)
    }

    60% {
        transform: translate3d(10%, 0, 0) rotate(2deg)
    }

    75% {
        transform: translate3d(-5%, 0, 0) rotate(-1deg)
    }

    to {
        transform: translateZ(0)
    }
}

.wobble {
    animation-name: i
}

@keyframes j {

    0%,
    11.1%,
    to {
        transform: translateZ(0)
    }

    22.2% {
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }

    33.3% {
        transform: skewX(6.25deg) skewY(6.25deg)
    }

    44.4% {
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }

    55.5% {
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }

    66.6% {
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }

    77.7% {
        transform: skewX(.390625deg) skewY(.390625deg)
    }

    88.8% {
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

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

@keyframes k {
    0% {
        transform: scale(1)
    }

    14% {
        transform: scale(1.3)
    }

    28% {
        transform: scale(1)
    }

    42% {
        transform: scale(1.3)
    }

    70% {
        transform: scale(1)
    }
}

.heartBeat {
    animation-name: k;
    animation-duration: 1.3s;
    animation-timing-function: ease-in-out
}

@keyframes l {

    0%,
    20%,
    40%,
    60%,
    80%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }

    20% {
        transform: scale3d(1.1, 1.1, 1.1)
    }

    40% {
        transform: scale3d(.9, .9, .9)
    }

    60% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03)
    }

    80% {
        transform: scale3d(.97, .97, .97)
    }

    to {
        opacity: 1;
        transform: scaleX(1)
    }
}

.bounceIn {
    animation-duration: .75s;
    animation-name: l
}

@keyframes m {

    0%,
    60%,
    75%,
    90%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(0, -3000px, 0)
    }

    60% {
        opacity: 1;
        transform: translate3d(0, 25px, 0)
    }

    75% {
        transform: translate3d(0, -10px, 0)
    }

    90% {
        transform: translate3d(0, 5px, 0)
    }

    to {
        transform: translateZ(0)
    }
}

.bounceInDown {
    animation-name: m
}

@keyframes n {

    0%,
    60%,
    75%,
    90%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(-3000px, 0, 0)
    }

    60% {
        opacity: 1;
        transform: translate3d(25px, 0, 0)
    }

    75% {
        transform: translate3d(-10px, 0, 0)
    }

    90% {
        transform: translate3d(5px, 0, 0)
    }

    to {
        transform: translateZ(0)
    }
}

.bounceInLeft {
    animation-name: n
}

@keyframes o {

    0%,
    60%,
    75%,
    90%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(3000px, 0, 0)
    }

    60% {
        opacity: 1;
        transform: translate3d(-25px, 0, 0)
    }

    75% {
        transform: translate3d(10px, 0, 0)
    }

    90% {
        transform: translate3d(-5px, 0, 0)
    }

    to {
        transform: translateZ(0)
    }
}

.bounceInRight {
    animation-name: o
}

@keyframes p {

    0%,
    60%,
    75%,
    90%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(0, 3000px, 0)
    }

    60% {
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }

    75% {
        transform: translate3d(0, 10px, 0)
    }

    90% {
        transform: translate3d(0, -5px, 0)
    }

    to {
        transform: translateZ(0)
    }
}

.bounceInUp {
    animation-name: p
}

@keyframes q {
    20% {
        transform: scale3d(.9, .9, .9)
    }

    50%,
    55% {
        opacity: 1;
        transform: scale3d(1.1, 1.1, 1.1)
    }

    to {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
}

.bounceOut {
    animation-duration: .75s;
    animation-name: q
}

@keyframes r {
    20% {
        transform: translate3d(0, 10px, 0)
    }

    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }

    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

.bounceOutDown {
    animation-name: r
}

@keyframes s {
    20% {
        opacity: 1;
        transform: translate3d(20px, 0, 0)
    }

    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

.bounceOutLeft {
    animation-name: s
}

@keyframes t {
    20% {
        opacity: 1;
        transform: translate3d(-20px, 0, 0)
    }

    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

.bounceOutRight {
    animation-name: t
}

@keyframes u {
    20% {
        transform: translate3d(0, -10px, 0)
    }

    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, 20px, 0)
    }

    to {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

.bounceOutUp {
    animation-name: u
}

@keyframes v {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.fadeIn {
    animation-name: v
}

@keyframes w {
    0% {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInDown {
    animation-name: w
}

@keyframes x {
    0% {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInDownBig {
    animation-name: x
}

@keyframes y {
    0% {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInLeft {
    animation-name: y
}

@keyframes z {
    0% {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInLeftBig {
    animation-name: z
}

@keyframes A {
    0% {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInRight {
    animation-name: A
}

@keyframes B {
    0% {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInRightBig {
    animation-name: B
}

@keyframes C {
    0% {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInUp {
    animation-name: C
}

@keyframes D {
    0% {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInUpBig {
    animation-name: D
}

@keyframes E {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.fadeOut {
    animation-name: E
}

@keyframes F {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
}

.fadeOutDown {
    animation-name: F
}

@keyframes G {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

.fadeOutDownBig {
    animation-name: G
}

@keyframes H {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
}

.fadeOutLeft {
    animation-name: H
}

@keyframes I {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

.fadeOutLeftBig {
    animation-name: I
}

@keyframes J {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
}

.fadeOutRight {
    animation-name: J
}

@keyframes K {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

.fadeOutRightBig {
    animation-name: K
}

@keyframes L {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
}

.fadeOutUp {
    animation-name: L
}

@keyframes M {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

.fadeOutUpBig {
    animation-name: M
}

@keyframes N {
    0% {
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
        animation-timing-function: ease-out
    }

    40% {
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
        animation-timing-function: ease-out
    }

    50% {
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
        animation-timing-function: ease-in
    }

    80% {
        transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg);
        animation-timing-function: ease-in
    }

    to {
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
        animation-timing-function: ease-in
    }
}

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

@keyframes O {
    0% {
        transform: perspective(400px) rotateX(90deg);
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotateX(-20deg);
        animation-timing-function: ease-in
    }

    60% {
        transform: perspective(400px) rotateX(10deg);
        opacity: 1
    }

    80% {
        transform: perspective(400px) rotateX(-5deg)
    }

    to {
        transform: perspective(400px)
    }
}

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

@keyframes P {
    0% {
        transform: perspective(400px) rotateY(90deg);
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotateY(-20deg);
        animation-timing-function: ease-in
    }

    60% {
        transform: perspective(400px) rotateY(10deg);
        opacity: 1
    }

    80% {
        transform: perspective(400px) rotateY(-5deg)
    }

    to {
        transform: perspective(400px)
    }
}

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

@keyframes Q {
    0% {
        transform: perspective(400px)
    }

    30% {
        transform: perspective(400px) rotateX(-20deg);
        opacity: 1
    }

    to {
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
}

.flipOutX {
    animation-duration: .75s;
    animation-name: Q;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important
}

@keyframes R {
    0% {
        transform: perspective(400px)
    }

    30% {
        transform: perspective(400px) rotateY(-15deg);
        opacity: 1
    }

    to {
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
}

.flipOutY {
    animation-duration: .75s;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    animation-name: R
}

@keyframes S {
    0% {
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }

    60% {
        transform: skewX(20deg);
        opacity: 1
    }

    80% {
        transform: skewX(-5deg)
    }

    to {
        transform: translateZ(0)
    }
}

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

@keyframes T {
    0% {
        opacity: 1
    }

    to {
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0
    }
}

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

@keyframes U {
    0% {
        transform-origin: center;
        transform: rotate(-200deg);
        opacity: 0
    }

    to {
        transform-origin: center;
        transform: translateZ(0);
        opacity: 1
    }
}

.rotateIn {
    animation-name: U
}

@keyframes V {
    0% {
        transform-origin: left bottom;
        transform: rotate(-45deg);
        opacity: 0
    }

    to {
        transform-origin: left bottom;
        transform: translateZ(0);
        opacity: 1
    }
}

.rotateInDownLeft {
    animation-name: V
}

@keyframes W {
    0% {
        transform-origin: right bottom;
        transform: rotate(45deg);
        opacity: 0
    }

    to {
        transform-origin: right bottom;
        transform: translateZ(0);
        opacity: 1
    }
}

.rotateInDownRight {
    animation-name: W
}

@keyframes X {
    0% {
        transform-origin: left bottom;
        transform: rotate(45deg);
        opacity: 0
    }

    to {
        transform-origin: left bottom;
        transform: translateZ(0);
        opacity: 1
    }
}

.rotateInUpLeft {
    animation-name: X
}

@keyframes Y {
    0% {
        transform-origin: right bottom;
        transform: rotate(-90deg);
        opacity: 0
    }

    to {
        transform-origin: right bottom;
        transform: translateZ(0);
        opacity: 1
    }
}

.rotateInUpRight {
    animation-name: Y
}

@keyframes Z {
    0% {
        transform-origin: center;
        opacity: 1
    }

    to {
        transform-origin: center;
        transform: rotate(200deg);
        opacity: 0
    }
}

.rotateOut {
    animation-name: Z
}

@keyframes ab {
    0% {
        transform-origin: left bottom;
        opacity: 1
    }

    to {
        transform-origin: left bottom;
        transform: rotate(45deg);
        opacity: 0
    }
}

.rotateOutDownLeft {
    animation-name: ab
}

@keyframes bb {
    0% {
        transform-origin: right bottom;
        opacity: 1
    }

    to {
        transform-origin: right bottom;
        transform: rotate(-45deg);
        opacity: 0
    }
}

.rotateOutDownRight {
    animation-name: bb
}

@keyframes cb {
    0% {
        transform-origin: left bottom;
        opacity: 1
    }

    to {
        transform-origin: left bottom;
        transform: rotate(-45deg);
        opacity: 0
    }
}

.rotateOutUpLeft {
    animation-name: cb
}

@keyframes db {
    0% {
        transform-origin: right bottom;
        opacity: 1
    }

    to {
        transform-origin: right bottom;
        transform: rotate(90deg);
        opacity: 0
    }
}

.rotateOutUpRight {
    animation-name: db
}

@keyframes eb {
    0% {
        transform-origin: top left;
        animation-timing-function: ease-in-out
    }

    20%,
    60% {
        transform: rotate(80deg);
        transform-origin: top left;
        animation-timing-function: ease-in-out
    }

    40%,
    80% {
        transform: rotate(60deg);
        transform-origin: top left;
        animation-timing-function: ease-in-out;
        opacity: 1
    }

    to {
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}

.hinge {
    animation-duration: 2s;
    animation-name: eb
}

@keyframes fb {
    0% {
        opacity: 0;
        transform: scale(.1) rotate(30deg);
        transform-origin: center bottom
    }

    50% {
        transform: rotate(-10deg)
    }

    70% {
        transform: rotate(3deg)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

.jackInTheBox {
    animation-name: fb
}

@keyframes gb {
    0% {
        opacity: 0;
        transform: translate3d(-100%, 0, 0) rotate(-120deg)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.rollIn {
    animation-name: gb
}

@keyframes hb {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0) rotate(120deg)
    }
}

.rollOut {
    animation-name: hb
}

@keyframes ib {
    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }

    50% {
        opacity: 1
    }
}

.zoomIn {
    animation-name: ib
}

@keyframes jb {
    0% {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInDown {
    animation-name: jb
}

@keyframes kb {
    0% {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInLeft {
    animation-name: kb
}

@keyframes lb {
    0% {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInRight {
    animation-name: lb
}

@keyframes mb {
    0% {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInUp {
    animation-name: mb
}

@keyframes nb {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }

    to {
        opacity: 0
    }
}

.zoomOut {
    animation-name: nb
}

@keyframes ob {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    to {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        transform-origin: center bottom;
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomOutDown {
    animation-name: ob
}

@keyframes pb {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }

    to {
        opacity: 0;
        transform: scale(.1) translate3d(-2000px, 0, 0);
        transform-origin: left center
    }
}

.zoomOutLeft {
    animation-name: pb
}

@keyframes qb {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }

    to {
        opacity: 0;
        transform: scale(.1) translate3d(2000px, 0, 0);
        transform-origin: right center
    }
}

.zoomOutRight {
    animation-name: qb
}

@keyframes rb {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    to {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform-origin: center bottom;
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomOutUp {
    animation-name: rb
}

@keyframes sb {
    0% {
        transform: translate3d(0, -100%, 0);
        visibility: visible
    }

    to {
        transform: translateZ(0)
    }
}

.slideInDown {
    animation-name: sb
}

@keyframes tb {
    0% {
        transform: translate3d(-100%, 0, 0);
        visibility: visible
    }

    to {
        transform: translateZ(0)
    }
}

.slideInLeft {
    animation-name: tb
}

@keyframes ub {
    0% {
        transform: translate3d(100%, 0, 0);
        visibility: visible
    }

    to {
        transform: translateZ(0)
    }
}

.slideInRight {
    animation-name: ub
}

@keyframes vb {
    0% {
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }

    to {
        transform: translateZ(0)
    }
}

.slideInUp {
    animation-name: vb
}

@keyframes wb {
    0% {
        transform: translateZ(0)
    }

    to {
        visibility: hidden;
        transform: translate3d(0, 100%, 0)
    }
}

.slideOutDown {
    animation-name: wb
}

@keyframes xb {
    0% {
        transform: translateZ(0)
    }

    to {
        visibility: hidden;
        transform: translate3d(-100%, 0, 0)
    }
}

.slideOutLeft {
    animation-name: xb
}

@keyframes yb {
    0% {
        transform: translateZ(0)
    }

    to {
        visibility: hidden;
        transform: translate3d(100%, 0, 0)
    }
}

.slideOutRight {
    animation-name: yb
}

@keyframes zb {
    0% {
        transform: translateZ(0)
    }

    to {
        visibility: hidden;
        transform: translate3d(0, -100%, 0)
    }
}

.slideOutUp {
    animation-name: zb
}

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

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

.animated.delay-1s {
    animation-delay: 1s
}

.animated.delay-2s {
    animation-delay: 2s
}

.animated.delay-3s {
    animation-delay: 3s
}

.animated.delay-4s {
    animation-delay: 4s
}

.animated.delay-5s {
    animation-delay: 5s
}

.animated.fast {
    animation-duration: .8s
}

.animated.faster {
    animation-duration: .5s
}

.animated.slow {
    animation-duration: 2s
}

.animated.slower {
    animation-duration: 3s
}

@media (prefers-reduced-motion:reduce),
(print) {
    .animated {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
        animation-iteration-count: 1 !important
    }
}

.phone-why {
    width: 100%;
    background: #f6f6f7;
    overflow: hidden;
    margin-top: -4px
}

.title_by_phone {
    width: 100%;
    text-align: center;
    font-weight: 600;
    font-size: 2rem;
    color: #262a33;
    margin-top: 4.16rem;
    margin-bottom: 1rem
}

.intro_bu_phone {
    width: 100%;
    text-align: center;
    color: #51555c;
    font-size: 1.16rem;
    line-height: 1.3rem;
    margin-bottom: 2rem
}

.why-content .why-part {
    width: 71.5rem;
    overflow: hidden
}

.why-part .why-part-by {
    width: 16rem;
    height: 17.6rem;
    background: #fff;
    border-radius: 8px;
    margin-left: 1.33rem;
    float: left;
    overflow: hidden
}

.why-part-img {
    width: 5.75rem;
    height: 4.16rem;
    margin: 0 auto;
    margin-top: 2rem;
    margin-bottom: 1.66rem
}

.why-part-img img {
    width: 100%;
    height: 100%
}

.why-part-title {
    width: 100%;
    text-align: center;
    font-size: 1.33rem;
    color: #262a33;
    font-weight: 600;
    margin-bottom: .833rem
}

.why-part-text {
    width: 100%;
    text-align: center;
    color: #51555c;
    line-height: 150%
}

.h5-content-btn {
    display: block;
    width: 8.33rem;
    height: 2.91rem;
    background: #386ee7;
    margin: 0 auto;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    color: #fff;
    font-size: 1.2rem;
    text-align: center;
    line-height: 2.91rem;
    margin-bottom: 4.16rem
}

.phone-product-features {
    width: 100%;
    overflow: hidden
}

.why-content {
    width: 100%;
    overflow-x: auto;
    margin-bottom: 2rem
}

.g-animate-nav {
    margin-left: 2rem
}

.g-animate-nav .swiper-slide {
    height: 3.4rem;
    text-align: center;
    line-height: 3.33rem;
    font-size: 1.33rem;
    border-radius: 4px;
    color: #51555c;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px
}

.g-animate-nav-1 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGJSURBVHgB7VXBTcNAENw92/wiXIJLIB2QCjhFEEUKSKQC3AGhgpgKwiMPHiBdB0kHacElmEc+OPayaxsnRgZsER4RzMdeaW9mZ2/vDuDQgbuB1kMP9gBjHsOKgB4OPUycBQB5sBdgSHHcEyE7i2PbB1WSR6y6ZLEI2gDRJQKdB8xlMSeAnwsguYUZIXUJ8ISTx+ZpvmzCrc8vTxFwxsQlh1J0LIGqZCo4pRTupQJEWPQHo6nW1+6nxFq7/cHVVHJljawlSHtVyl2XcRqZ57nP1XMShUToo5OspMLaqp3Oioj8PBd6shastNJau64yaQ1X3gVrM0FFN4WbIH117qQD6qhzWxBD5jhZT4wxtXtWK5CJmAdZ4HOlBpFmhRvexA4wuVc4HHPVS/gCCr6BuKHY6b7vTdnreN1tMgQ2NEDpRutJHpvGI9xIYCtk2p0NaNCin+Jf4A8I5GNKGGWXqa2C/sWo9ShWkPK1LZ8UX7YCziaAxDrjo68/PHLtkd3YFEKSBPL360/m4eMNotq3/7ckjwQAAAAASUVORK5CYII=) no-repeat 15px 12px rgba(38, 42, 51, .04);
    background-size: 1.4rem 1.4rem
}

.g-animate-nav-2 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGvSURBVHgB1VRbTsJAFD13qJ8mdQfsQNwB7mAaRIligBWwBGUFwgrEpD7CQ7oDugR2YJeAiX8tc50pT8FQKF+cpDOZxz2nc1/AsYN2uSSLtzkBqjNEHuAxgUcqnDQ87yNIsk0UKFzfVRRTe7Ycz2bbDIK42u+8vmyzF9sOZamUVSyahpjVxBl03TPzMVTN7GnhppRVO7UAoozULrGZueH13735ttd9azOjFb/ECqvpBYBcPBL7GydW1I4JCOdILcA09TmLTTdEVtZMStE3UgsQYrcQ4WHjaLE38bdTJMAplod6yuurAbNqTcmpAuM+hj/ouZfb7K0EfnBoOTqQTf3HFU38hOULPBX+1JLsdyo0A5OyCK2cjqqNMPR3KbJ/BaSUNk5OJfaF4jEm0Whd+I9A4aZcVwpNHADtusfPjtvYEND9pkoQzzBVa4qIKMA+YGVr8rqmzLKC4/XdOAOtpZKoxPfC6GJX/65DXpVHWmRIwghNU3xRB6yVTSqmJTfweq6veQLzivleUqs4GMcvsBJkDvSUd4r3XzgInDUtZL5aBjkT1VYP0vPD5yhKbCHHg1/9fKVAOXfi3QAAAABJRU5ErkJggg==) no-repeat 15px 12px rgba(38, 42, 51, .04);
    background-size: 1.4rem 1.4rem
}

.g-animate-nav-3 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAEFSURBVHgB7ZVdCoJQEIXPqD3XEmoHtoPagT0IEQUtoVYQraB2UNAPgZF3B22hHeQS6rlu071CUqQhiUHg9+TocY4HmblAzlDSA8ft2GDDAd2E8NaHbzUGEjFtIowgYWfRRAmcdrtK0vLV5YeGaaCAL5emEJtAV1Z0X1qTsDlDRz0p60pYgwMwBfG9YjTEDZTMqf7mFwMVRYvhb5f1MJHb6xN4xpLHYreax/WP07TcLhNT+aGxkIDwFvqFOT6QRmMgZ94StNzeEZngl+r3CXxvUUMG9E9+rnNPUBgUBn9gEA2amo6TPhzUoOzxPeFGVuv0/GYA8zqENNVupwayoM+TqxygIC132kxddpyTD44AAAAASUVORK5CYII=) no-repeat 15px 12px rgba(38, 42, 51, .04);
    background-size: 1.4rem 1.4rem
}

.g-animate-nav-4 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAFPSURBVHgB7ZXdTcMwEMfvnPAGEiNkhDJBwwapRKU+FNFMxApGAp6qxhs0TEBHYIRISCAB9nFOqajzhYPah0r9P8TO2bmffY7vAPYsbDImV9MYECPwlaECdJgrJYtOQDKZRKjDjLsD6CnSJgXzpiA4jbdhoUPTJ0ueGgFBToh3fp5NjIg3ZZ+do4CM6CPlN+kAyrCwcwSSi/lDCp5KxteWsgYIPOe+My5+l4+RbYymJ9ihBOxZR8ARcACAsMnYL9mZYUvObAZgIG65qV35dv04RyrW3/0BKCf1SXYb6fccxFlSNYv6ekhm8/tLIHoBf+8rpVTRNFLbwSbZ8cY5VORZF8SKHxfdALtiLM/Apl5JyAUEAj9Ax26d4x+Np8/cDGyYDIh/pG0zRMCZrW5q8SgBKiGi4GuEOlgST2LIDHrL+aO2La56F/2qPl9V26HvXN9vlXenS5DLlQAAAABJRU5ErkJggg==) no-repeat 15px 12px rgba(38, 42, 51, .04);
    background-size: 1.4rem 1.4rem
}

.g-animate-nav-5 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAFhSURBVHgB7ZRvSsNAEMXfrBsQFMwR4gn0BtYbbLFKoUrbm/QGeoQULIhWWU9gjpIj5ItQGrvjbtpoa1r7J4gi/X1Idnc27+2QnQG2LIHywdlFo2lY3ADsoxQUCzKdx/te181kvmzFO/aZWEeNEjC4YpjsQTFrYEOBFQ+fHnptlEDVGiERmvlc4IfZGvy+gVwUUPV6IIy8NmyekZpI67t4Jq6UD7nXEoJOzFC2tQ6TtQww2E3YS48JQsETqJ5fWQGOx0Hy3bV2I2a3NnDFuZ7B5ESHqnZZARtFJI7yGBHHxtjMSGjd70X4Bokl6P5tZF8RNuS/3SIiX6l6UNw2SLTWMz9x/r5M42CRQcQMRZ5Uxa/2XTtv5S143NopxAKmO/KHAaeyCm+owCIoHoozQSuczcfiHDNTtyjPCb+9hlNmy3FFR6OdF7s9mIjEnI5OvxYf5mezGp8mLtvVxDciaxF/iXesBo9A1m8tyQAAAABJRU5ErkJggg==) no-repeat 15px 12px rgba(38, 42, 51, .04);
    background-size: 1.4rem 1.4rem
}

.g-animate-nav .swiper-slide span {
    margin-left: 1.8rem
}

.features-title {
    margin-bottom: 2.75rem
}

.features-content {
    width: 100%;
    text-align: center
}

.features-content-img {
    width: 80%;
    margin: 0 auto;
    margin-bottom: 3.16rem
}

.features-content-img img {
    width: 100%;
    height: 100%
}

.features-titles {
    width: 100%;
    text-align: center;
    font-size: 1.6rem;
    font-weight: 600;
    color: #262a33;
    margin-bottom: 10px
}

.features-center {
    width: 100%;
    margin-bottom: .83rem;
    text-align: center
}

.features-center span {
    margin: 0 auto;
    background: rgba(56, 194, 153, .15);
    padding: 3px 8px;
    border-radius: 2px;
    color: #70ccab;
    line-height: 1.6rem;
    font-size: 1.1rem;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px
}

.features-text {
    width: 91%;
    margin: 0 auto;
    color: #51555c;
    font-size: 1.1rem;
    line-height: 150%;
    margin-bottom: .83rem
}

.features-intro {
    width: 73%;
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0 auto
}

.g-animate-1 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAHRSURBVHgB7Zc9UsJQEMd3XwIWNrQ440w4gVqZMh7BG0hnwZcnMJwAFAo7uIFHkM50cgMyYxHLNFggZN33+DB8SQCjFvnNhM17ebz/fzd8bAAS/hgMD6xKL9MfpAxNUAZiwmked1YaMAueRQIfEeITn+BCAHmnme3IgZhNa9D6BXGJgZyorLYc6PLFLLxaQGAsLSXI8+HCPiAYhFgLJ0d83oeUwaddfVkT/dlihBYftnOfrcIOnJfeyhzs0H7uNFFtqKk5sWQ4oEsOYUHbLHk989ozICJmxTPMovfEwnUprpIiuoHRML+4VqzagDO2+UpOOR5jQBp6bOQWNiCzpgBf+L2WmiDo4IDOnhtH9VXr9XUbOfWsyyHHojbHqbCsxhUM4MJ5UNdnyKxhxLcMyBrroi8oqK4TniJgA1GqsW3WYXSIwLfVUN+S7bIOs7ECc0ZWVWOHrMNEqsCciWk1it4VIZURMMOf8LtthXc2MDPSyLY5tGFPtroFcZAYSAwkBhID6pdQBOgHEyuIo1Nu0SAOSKROuEFZNvCe/nAPAl21YoRabb5Z/zlC4u5cV9yt53zViuGeDWgE5F+2bMu/TC0gnw8gJkaB5h+m+26HE4aE/8InKATIaBCDxNoAAAAASUVORK5CYII=) no-repeat 15px 12px #f0f8ff;
    background-size: 1.4rem 1.4rem
}

.g-animate-2 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAKXSURBVHgB7ZbNchJBEMe7ZxdIyoN4sYrSQ3gCN4co8RSewPgECdcUFXiDyBOYlKmUN/ANwhPATUoO8gZS5QeWF/eigeB22zOGDWA2NQubskr9HdjZ2WH6v93T3Qvwr4OwIFvVd9nhELKBSmW7J/d7sCCxBRSqgzUIoM6IHgJnwwcMDRhDrfMy14cYxBKwWf64Tcqpzxie2Qx9oKD0+vjeKVhiLUC/ORO+1cZZDMn1iIh6CpSPircJ1I5+pkXwOa/besIFW1gdIJAxTj9UsXtydzru7Y29Lw3lUgu0d1JQl7mizbYKbGHaNVeExpxxg55DCI7MEjkf+pCCBVYCHu998CZjDLgZtY4IjDAWL5yPM7chKQGUdvxwLGGI3ozCdeMU3YGkBAxh6OvYmz8o8KLWoZN6Mhl3D+1qg5WA3mHeR2azIYJT2ZgKyQQ5hB4x7JobXRMssc8CB0o6DfUpd123tVn51OAgaJq0VKkHDFQNU3TMNdttYxWih1KI8JpCpI2rmIXIPg2FN7KxFJ11Gb6aNyw/bZQCFMe4ZuFmpNFxdyjwV1aGflvOCSxApIBJtwPXXYMlCAj967olXmmYViri1mpUrONiQiQVdBXPavOewnnjI860mNGDG0BeqJdRo+K0iJk0HPHqATN7F7IbxNTU3Q6WRZn6sCOe8IaUrsr42aWoKR7tf/5q3C7GOy9yJUiQwv6goUXodp1RZ/mJF8I01A0njDnPplkSyLfD6a+tZxtVKIBUMgcuiulGRYj5y/k/zH8BYRoqqVh0IQcx8Arl95AkumPKIYdIAd/T436GXN+0VHSeL9clfmfKeL9znGtPbsIQmI8O4qeysg83hCnJBKVZYVdQKA+2IGECcvxb6W/9Rbvm38tPJwsiWHaeqTMAAAAASUVORK5CYII=) no-repeat 15px 12px #f0f8ff;
    background-size: 1.4rem 1.4rem
}

.g-animate-3 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAFASURBVHgB7ZZBTsMwEEX/OGHPtlKRcgNYZtf0BtygZU8FnCDiBAiRBTt6hN4Ad5clR6gEUg+B4sF2g9QUi0SVq1Sq38JyJl/214xHNnDqUJsgvf3MIOJ3+6EwLouB9KkX6JlGBtL7dYIKbzqa4QAw04K++aF8Hax+Y3FDUNETEWc4EHrta5zhXE/HTgNWYJ1grsdlHbti0F0tedT/Vi2buPWbrE52sxu7l6mW5ctwbmb1odosqCA7HsI/+nS2NiYmu/oYLZTFhUSHbtlX33sXuDNAUWJT6RESdMnM6GYAyHUdc3jEtbnhOEtA4GdWtIBPhMr0kHcywKw+ymIo4RHdhomrN3ovQTAQDAQDwcCRXseIRunsC14RYgRW+N8AQ9o3G2GqTUzhk3pz8zLeDjdLEOGGyPMt2DABaZ7lCAS2+AGpaGlqy36o3gAAAABJRU5ErkJggg==) no-repeat 15px 12px #f0f8ff;
    background-size: 1.4rem 1.4rem
}

.g-animate-4 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGvSURBVHgB7ZdNTsJAFMffaxsLrrpFXcAN2JgQV/UGeAJwS2LQEwAnsEJi3Ckn8Aiws4kbPAFdmJC4YgcinfGNUL4nwPBhjP0v2vl+v+nMdN4D+O9CWUXqqpWlV4ZaxEF5cN7u99nl6/1JQ9bGmC2wr5tW1488U28bNhSnQXQD05RsnOY+krrxlY5oPafuJNpSgC4/vAVk9nCEOiJ/4zQTWNu4nqcvYAV5zeg/0jP56ZtiLGchwFnuPck4yw6zJbcSK4KiUvlWhihGAIhoUR44jqF+wCYzvq7ZQdotqxtfR1MAOKbzYE/S4JcVAoQAIUAIEAIYsgrhF3R8M4szt9eq4hwtFNefCgACWh0WbQ6MI6hoFeNSAHJArAmzHmyinvYE6wKMDPfg3H2IebBDyQGGxgNfDlREs182ARmAF3QMfDlQ0QF51QAJWBWAdm4bcbAJxSkQ3qvGocoRlE4Ccn63rI0x3QEbYtOLTdjh0QIV3bxUjoQH68CONHfGKCCpTcQEHgCrwhY0dtNZyS0fF4Py+bhA716YzKzRMoh1j9P6F2ALkv0XdhqaLdQejvbf0jdSho+2YsPIXwAAAABJRU5ErkJggg==) no-repeat 15px 12px #f0f8ff;
    background-size: 1.4rem 1.4rem
}

.g-animate-5 {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAIKSURBVHgB7VbNTttAEJ5Z5wduPlVNe3HeIBzauqemb8AjuLeqAhSeIPAEoCqqONI3SJ+gPrWpeiBvgBGgIE7mFEPwDrMLNiYEbIcghPAnrXZ3vDvzzXpnZgEKvHRgcmIv7TdJGBsI2IDHgYdSrv7tvO3eImC3BhZJ3EEgEx4R7JxfFcO6u1n31bwUfZDnsiGE0MaZSAuRTmCWQGkBiDaxg0FYXmTJ9g0CAkXsuUGy+6fzZg9mCHXCIKE9LhfwxCgIFASeB4Fma9e0v3IYZUSe9aW0BSp+hypDVsi0lwfbSKNf1VLoRpksafT03GiCUfk0lOCIipbVx9flJhBA4Fdh/nKC4BCWnUCW4cPKkc9pWysnQDOQnMLVeRLp/C455QbBnEpu9xJI/QV99gAFLfDwJ2v2IvlVzbBUS9YPNq8MruMZLfS2al6a/tQTUOhtakWOGr/7dtxAMbKEgLhiEqGvigyMwP239dqDHMhEIIn/P171uVOtCzNAkQeenMDEOyAN+mIvH3h37hoZ7vgN1/U+DJt3bcEwNAmNS/2EcWjGT7IGJ5KqnN/N+CTz4Aw+RyS0cYLf3Ky0jSpMkyF641H6fulwURhiI4uiiATMaa2ZjLNzfX7urfY6NfdalhP2ymCNu3ZMAjUB62q+3vteW4McyE1gAgmY1vjUBCaQmMr4g8HV0fnI9wYKPAAXgRjJ9EMGSrUAAAAASUVORK5CYII=) no-repeat 15px 12px #f0f8ff;
    background-size: 1.4rem 1.4rem
}

.active {
    color: #236def
}

.phone-product-fn {
    width: 100%;
    overflow: hidden;
    background: #f6f6f7
}

.fn-part {
    width: 91%;
    margin: 0 auto;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.fn-part-show {
    width: 48.6%;
    height: 12.66rem;
    background: #fff;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    overflow: hidden
}

.fn-part-top {
    width: 88%;
    overflow: hidden;
    margin: 0 auto;
    margin-top: .83rem;
    margin-bottom: .83rem
}

.fn-part-top div {
    width: 2.83rem;
    height: 2.83rem;
    background-size: 1.5rem 1.5rem;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    float: left
}

.fn-part-top span {
    display: block;
    float: left;
    line-height: 2.83rem;
    font-weight: 600;
    font-size: 1.3rem;
    margin-left: .66rem
}

.fn-part-bottom {
    width: 88%;
    margin: 0 auto;
    line-height: 150%;
    text-align: justify;
    color: #676c73;
    font-size: 1.1rem
}

.fn-part-one {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAHrSURBVHgB7ZdPTsJAFMa/qYi6stsSE8sRXNkl3sAj4M6NUk8A3IB/Ju7gCp4AVtKd3ICamOCySwKxzzcNf1qBFgqCi/4S6ONlOu+bj5l2BkhI2A7h/3H9+FUQRLec1bEHBMghcqtW/aI1z00wHgdFvpRwANiEp249U5GxMk0ShIlDIZRizuyrMkzJL8Mc6HBJXWgH4RCoihFa2AEiTSYPvPA7zzXU0fjknEMnFdaBbMiXIo5xiTHK1otmIwbegL/RZDG5qLbKkpzN2SzbY88yAnmk0TYePvPYELlQyBXv3EcuUMPFTaBGiCBYFc22qlqWw7IvrUMcNY2HQdO45xFHIF3htm1eSRWB+XTguHqqDK+shtZZdp8S1qlV00px3ApzpVvLmJ1K1ll1b6ggT9QGbsV1xU8KayLd4oItnult/uiTStKtHLtVJpE6JxclIQKrVbpy121kOuvWiXQoICrErW1ciS1oJmzZ3Jqz1lzZqSBPlM8tfl71PCEcx3HFz9pzaKUw6dYO34GxHforEkFRJIKiSARFkQiK4t8JWvrqMO77OvYAkVB5V4AFQUMMnROcOZPtg470aR97YCpGnm7enrUPGXt/WY+3CQq5ZRwI76g1IXCU5u1nngQVWLGKfUCw2aXX6ak1IWEX/ABPyNH0jTRHpAAAAABJRU5ErkJggg==) no-repeat 50% #f7f8fa
}

.fn-part-two {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAJDSURBVHgB7ZfBbtNAEIZn1mmIxKUnpBQJmTcIJywuJG8QnqDNDQmK8gYtT5AAAXEDnoDwBMmJRnAxT4AREuGYS9W0iXc649TpJk3qjdxEPfiTHHsnmd0/s7sza4CMjHTgIqP38m8ZlCrDOgfWoX/UetC+YjcbXr3vItFXIizBZggKavio23w4iA1q5mtSBxsUI7ineuvQNOTMBhFVpyEj+Mxx/QNrQbn8sXshQe51WCQIgbbj5967Yg3WiPeqHwkiY0xBwS0jE5REJiiJTFASOdsfSn0jdEo4wnbvYzGw8SnXf2+fhHf2kNDvtYpdGx8rQVLjQEMnyuJ5aDze/99GGH8LQ/Dv5kdBXItEwPHZlus4wOXH2T3RWELkxMeOT178c7+/30nM/NYRMuFBqjxg1WHvoXYk60b2oWar0SNn/umzDhFt+rZaQ71mMdBaP+M078OqEHQ5uhXbabaO0I/WfTm7tGX6KJQIqadcfF0plHENJMABPw9EBIv/tcp6W1lQjESLb82L68bJ8lASmaAkZo+wk10S7Rhvv99J9B5BbX4XTXYhNnDuJGgiyfIyQ0GwVJAi/ZoQGxMvKEMSeeh4z/vTHBNldOKMjuRe50azLztfzMaV7MlZ95BvB2BPAGdQgUI0Uocv19aRo/jm6O1Ofda2gOifjpd3zBEoTSMZi8JIUOQjU086rClQg2V9FHJD33wfu1aQDbzG9tj707xdxOixqvz8cG/1MpNG0CJRacWkFhSLiqcvrZgbQ85BckHGBjgH6yDeLfTnvCUAAAAASUVORK5CYII=) no-repeat 50% #f7f8fa
}

.fn-part-three {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAFkSURBVHgB7ZgxTsMwFIZ/uy3K2BXoEI7AAhnhBnACYGOAthyhNwhq98INygnIRoGFGzQLChtlg0bxw4UOVZ0mtdJEjeRviO3nZ+WXn1+sF8BQMlic8bD50WKgtuzayAcfFHWG3cYd0gQ518G5tPZRAEyI06fe7mDexmP8zlAQxHhr0VZVvLgME/13Ix7tv7qNN6wRpx3YEBj9DZh6JHjS4lrIP1EwHBtGVcfZuRzZ0MSyMPbcvfGq/lqCULP6Mu5HOku+I3iyOV7Vv9whI9ADI+brrAHjvo67lqDn7o6LnNm4kJX7DB1cvZ9wRvVl81YlHOikeGZBfHr3JKT9JOSPsskkqNwhk3nfkc/7ZdNbtZ8vZERL0LC37SFnTNqnYQSlYQSlYQSlUbggPonqSfPql1rIMndWL4kK851mgHUi5gck37WAskOCxC0KI1LuRUXQy7TWJlzIXfKRHz4juon72WAoHb++3VijGxYhWQAAAABJRU5ErkJggg==) no-repeat 50% #f7f8fa
}

.fn-part-four {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAFkSURBVHgB7ZcxUoNAFIbfIiNaBTujFpsbaOWWHsEjWNoIeALIDQJpLL2CJ7AMpTeAxsGSOo4836KJDDIDGIRkZr8Cln/Z4fHezj/7ABSKzWDFh0vrzWaI16Ry6AEGmCJmfjg/e/zRvhFW4tLNgwGgJNwv5iczOdZWIgJzYCiY5l45kSmHurwIJ+GQYS4wYCku8QL6wIBnygRHQHP5boxISfXyOzSZhg/jGHpA2MkvTYMtQwVUh16hcbIAhD6o+IoqWR1VJYvDYDyBhgjr1aP/cr+esmkYnHqN19pJJH2oqKmS1bETe+jPMLY3ErcRhw3oNCBEdGD/oPmpYRd8qNsM0dFFngJbLOFlods9BB++8qH/RgVUR+WmbmNu0gzJf9bjNmsRmclKZpT3ZefUghjZYUSTJgyA7HQWwfGRHOcle5lNUg2zKQwEdTo+rIMrIO6SG2RoU8T9ZAohpqo8rbpWhaILPgGAE2+8FXQERQAAAABJRU5ErkJggg==) no-repeat 50% #f7f8fa
}

.fn-part-five {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGkSURBVHgB7ZdBUsIwFIZfkh6ApYw4cgPYOFNXlhPIDahbR1Fu4A0AYQ/cQG/QZR03eAMcdXDrnub5SqNShpI4Qzss8i3atH0v/ZuXtP0BLNthJkEnl+91IUQ3biNn06f+Qcck7/Tms4sS63E7ElHnuVeZ6nIcMEBwLJF0L24ziWDKUozKEwtRMsnZOELu1ZsHnHt/Uc4x9e6roxmAnIBR77wFCNVEHYzpaV5/r0kZhMOjQCtoOcyIt1AAyFhvvfwpQe713KczIygSCY1wWA5+DlNziDGso9KIyB4Yi16SC7stGaKo0b2aSQy0aBtsFIRAk1cJYrB4DO8r47idzCnHV0GzcHB4BwbQiJ9RR1WVN6G8QJ33adfclGO0ytTkM3pFpPIG5Qb8Ew57xt4Jyi4ZEyO3PS92xYEtmZ7skmF0EQ6SZb9rtr2Abcl0WEE6rCAdVpAOK0iHFaQj8+OK4Jy77Y8q5AAZiBqDxHCSkfiCTEGSj2nMWklg7Ap4E3KA+l4RByl7nSpZ7I9IeR8KIr7X+i9OhpWek+2RHuSJ5MGqQbRYdsU3GTWM+CubOl0AAAAASUVORK5CYII=) no-repeat 50% #f7f8fa
}

.fn-part-six {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAHNSURBVHgB7Zc/bsIwFId/DrRiZKVdcouGLdygN2jHDgXCCYAb0D9DR7gBN4Ct2XqERqraMHZEiPJqB0ydKCgxIait8kmIOHHiT7bfsw0U/DFY9MZFa9bmfz0GqiJfPP4buve1PnYJWS2/K2RwRBhR5/nhbCDLRvgprnFsmNFVi+XQQ4IpL3lXMuQIHw1aNxmeGgZ+GYVQErkKiRRi3fimzjsHEbIc34w2LFIIz2UDnGKiI5VZSMjwUJmoDUfymclO6DLt98rIwFZGpgsuVW/PxkTkKNX6auJLQruHbOe1GiuzxozK8HzWgwZaQmIo5qvKi3X7ZkdkPJ7lvUh1bRlB6iGrNz8ckvPCKAsZbGUWaKASXEvJvWSCT6etSCU2jumFQMZ9qnnuoCZ6qSEWy31ltIRkg4rUVkatozOBMwmFpAjTqMyh0A77QApcKieKxTWJ0JAR2KfcS1tNf4KcYIyqMmsw3iZ2CTF83fFO624KNnKClK08z+xj9VloyObGQoTsCMeCR2ulNO+ot2L3zcE6tQytUbsxgoPB1aY0wgrDVO8t4cWljdiw34S2hxRYrXf7p6NXnvt4PkUGirBPItXZS56hspLmrFcMWcG/4xtvh7Gwp6zI6wAAAABJRU5ErkJggg==) no-repeat 50% #f7f8fa
}

.fn-part-seven {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAaCAYAAADfcP5FAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMOSURBVHgBxVZNchJREO5+MxpciRsrpFzADcZFlKyEG8QTJO6sVBLgBDAnkPyU5Q5ygsQTBFeSciGeIGOpQV1lF4LMtP3mj2EYmBkKYy8yw0vP66//vm6EBWV957umKKABYl7+JsJrJLOXUUe9TrNwDQsKplEuVS+zAytTIcAqAmVnKhK04Q/o3Xc5A1JKYkDP939W+NGYCySMC7F5cbBagxSSCFBxv1+XYCaMgUwRnQFaX52LMGsBvOCnNmmAeivitpw0jWqcQgQYAyx4dXG82onUr/bz/H+pv+UC1wZm5pRfy5BA5kbIvfwycHSSEYNqEm/ZkQY/6r4hotrHo7Vm3HfzAVV+tYCsbfen0T3MFSCFbOxfNTlCFccQXq+Im0KcMzMBTUVnCIWkXVPc/VYCVOtc1NpUExB0AMyT7tGTNqQB9Gz3x6YQ4tS7pHuUi60B2wkTWnxrCeLFYCfLYSfFLG0hYNwtaH2AJGAIziPAGNIh4m4LnefxPn6WBBsLqLjX3wYUWz4eZmFIAoYgHzjWuQEeybqT0b04XHvK1mQN6pIypAKDzKqqel583fe/U8MXczecEnF0aHxOGEOGJOpc/HnHCPOTRS+7x7lOWK3btNPTYDttzwEJCu5xml1aEGEveSZpk8a4CIeiPQ8Pp1Tnvyf2K41qUWCmgCGUvUjJNBd3+6UJQMGQu4pOyDnccd0lDXBqth396O6J+gbBPPAP0CFSO2V2zQTyb41E+dPbxz1IKamnvCU6HJK6C6gkH16EtgJq+iJgFpFQavPgAZIE5h8PeXX4j2IDCrLpIjvMomI3kivoFvgUD8klDO5KzDGJEjnE6aQswKKDUUaDOxDbcTHeBuR88wFxyt775wJadxGlG/NBK9DZhkcXNqCBGDZ9kuJqv7VWJuh8mSI3AaaZc0Ta9A/J1L1Xf9pv7F1VudveBD9m1j5DNL/AEgRReUgWaRHDV2dSbUwBstGHtrx/LVFb5NQ+ZM8UBVqhyb1c4flomkotioBnLmjrO781oYxKiLS8AidhZJTB2bwR8xcXIVhh+PVfHgAAAABJRU5ErkJggg==) no-repeat 50% #f7f8fa
}

.fn-part-eight {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAKFSURBVHgB7ZfNbtpAEMdnNzShN3KpCu3BeQN6qEJv8AbNE4Tcqh74eALIE5TQNOqtzRv0DcKpIOXiNwi9NFEv5VLFtPZOZ0zsrAMG1jVVIvGTkHbXs+a/s7OzY4A1DwwBCSk3LnKOytapWaWfNXkZ2ojChj9wOPiYH0ICEgnarV2xkDYJyMW+GLHZf1/owKoFlWqXLRazjG0SUdLEuNS4tHQxQqANCipZ6WwPunnBbVriMHiOQrwrvfHnrEYQoGxpveGWGFcGx/ler7Mz4gFuO8J5gRRLoehNrwEGGAlCxNdB25PeXiBEx6YxoUTzdiSzDwYsHUP+dim4mEwSo3736fY8ewr8n0HQSw+trx8K32AJzLbsBtqS0SIbiq+FNjPnmRjrq+ZAnrVljO5Nxg/4JTHyEB3jMFiv8XEr1lAPfoQeGJAxMaaXH5JPyzAR19itX4EY41GQlTl7j0kooqpG5hhgnBhf1b53EET9jtAexUxOgbT07E3to363YHTsE10dM0VNc0qxUwVDEp0yf9UIB3oCDOGYoYydRAyT+LYP8G99N1vkdjbj2HEnLxVB/Ge/fj+yNmT8rW5KNuPOFT1TkJ9HPPgUnKjUQfgcVzNNCXr59kdRZtTZvFonDfj6cV23cn7y3I6Oa/ieQTijnxWMceAKFP8UF3eUlHVRW/J6R9/CaGLkDIvKuukNPXdj7/zkiQ0poi+aFktl8CbnqXbwPHLsEb1iqF6pZtpimEGH4saDg9sRGSlPIoLIhaGg/vGzL7AiuJDTuhbECboPrAUtYi1oEZE8RCXFKMjQ9EGI8H8Y6p2IhyQqo+ouJU71ztRdRp5p0+i+fn2sAt4NdkCS7/8194q/0AoIHTN4EIAAAAAASUVORK5CYII=) no-repeat 50% #f7f8fa
}

.fn-part-nine {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAPOSURBVHgB7VhLTxNRFD7nzrQ8XFhfKWoMJLrHRDcSFZPujLEJP4Au2POKkrCQBRsSNAjsIYG9JCXElSQ2EliZ0L0mEKNM8ZFGIwidmeM9nc4wnXY6fZmw8EsIdzr3nvvdc849j0EiUqBBPBrPdB4aSmR9+mIaGgTWQ6hv6nPk+w+1W8+ZcZMwLn/qtKThDiKlQioup55HU1AHqibEWsgegiRAcROwG4EigcIBUoowl1talbdvpqK7UAUqEup9mum1tAC9cmq33zwCzFoEKpGktEBIqSGRrKS9IkJsisxX5TFJAqaJ8QAt7AqkpHsD+wCGXI8BB5CbpoQwVr3aKyJ0Z0j7CLY/lBEiCaYVxGSkDZJrASZ4OPap65ceuq8bkGCufvPYrJtzHTE/Qjr4aKHrvJ5eGr+ahTrB2svp2E+m+QA8h96a61DtseonoL1FvdWMa2yjYNa8aWNj37oPjvT35eYJPwHNJFOLbAGnDKeOkAoN4t7Il4Rhin4ecxB89/LKEjSAhgkZJDqpcK3luK504cZ/HwqCr8k4jayUCYQc4Ip+QBnk6GTsfV9r1vcS4nSQj6LHP9Wz8l8JoeNjWveRBWRCQr5PBOyRD4zOgyxZ3O+8JnNeZv+YN+EfQSfDSdoydxXlxGL2SGkgtFRO+WydLCPPa4IuOMlNLHwHApDLkWNW5D39CAmB26Zhja0aqBRbrszM6BnWJmS5MmEJh6XN2Y5JCAC5ZMs1RQcsMln0krHqLJL+y44NTUZMliXgKkcirWIb/AgVbpXDeD+jDEKTcaSHH9tjroW8dVVJHFJCNG+PZQE/2EwtsSzDoCFnL5lqvHNKCG28uMyOnGdNsoQN0lIknFsOhzHGfzyuNFezZDkdSrm8V7bIvzeq9cvSczE/QZau7e1wq9quwQ/sOwdHoQ/2syrMgaoJMWQ5ywHQcj55mstR/fZKnSUsm2pPU7hCdLSzNRu9UW6uby4715IbwEJ7I+9pl5YRM1AnNE1dAFcdfaENYn5zfQm9nr62IxRwYgoR9vcM7y1CjegZ2V+Qvhi3nxUFRyt1LIGda8+oDHyGFfgK1NJn2kVfkE+xmTRNeUWumKPIA27MVA6cgeXHphSALk1xB/v7ENa5UvRbwxmffaZWMnnp1fb2pZqSiwUstYXUebuLyPdexzRBnsawWjI1EWLcfbIXN3LIzl3U6GEhunuJ8G0Kh2Cglpqo5s8x3CJncy3PZAeaqDRPKDR/45I5WWu3i/V+sCpHjPt/ISh5vhUn1+oMpNjoFzT7owKZGLke1Zcb6f+bQqjZ+Auz8c6S3JtD6wAAAABJRU5ErkJggg==) no-repeat 50% #f7f8fa
}

.fn-part-ten {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGESURBVHgB7Zi9ToNQFMfP7Wfi1MEEnGRw7+xXOvAe+gZKSOwmg6MmhPoG9j061I927q5JEwdp4lxTCxwRQwIEvHAvaQnhN13uzYV/+J9z7gGCiHUoEDUoGIUT1AAOeleL3vobNXSHkBVC5nXA4bMh3oSmWWNI7r9Ly1XzFThpEqI+GsK9f81s2de6fQ05YCFowWtmy9BxJH/cahF5fCeMIQOHl6bl3QewE5yvsowGV5bFIfc/uxbanbi1NLbmLmi5snRILgPU5xXfshNlcfGbiiQS/WmpEZw5SICVkKAjxdTQE8POi7GnAgchy1wx57Blopbt+4PpQPw3AN3CNgKWMyyjIG5OVfPMdkCKW5tEDtKNCLJsz/akN0cVVP5K3ajDg2tZpoM2tB9y5kkXh8BBKkF+q7AJyh9Dx8qHjki6cWuTgSjT9qcSFFckkwqj8yeGuWCW37KddkNNatDSkLug0e3uDDiomnwa3permzFvEGg9tqOEzKeGcFBZRoNUP6woFE7QD0fjdroCcj/FAAAAAElFTkSuQmCC) no-repeat 50% #f7f8fa
}

.fn-part-eleven {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGXSURBVHgB7Zi9SgNBEMdn7s6AnYWYCxam0NraELFIK+QNEtBe4wdCGgtLlRhfQEgeQLgHSBGVpNUHEGKVRBRSKSR3N+4GT+40ugTNssL+mpudPbj/7c4wO4tEZIJCGKAYygmyvptIF7pbLsEhAs3ABCDAnmGQY895e5fF+d6PglZ3OzmPoIQwOfiPkg/5zuMwhDcD/8gtcz3Igyx8zIaHluj9WAwz9ZN4HcZkvdhdeH6h++EAsdUsxxfD8yvbHZc/6VNI6CwTERGUKrQv3pdyLfD1+1RL7XSlxZTeMhERQY1yYqN5bvPM+8gqnmWNs3gFJKG3TITaxTW93876Li4zMxn4Bi7lMgdPvdrx7B1IICLIdyFLBLmwjxfA14F3xUwpgtSOIcMCBxGOmPkQ+NCAyvSUeQuSiAi6OU04jbLNBbUC35SFVVnx80WQCmhBIvTxQ4Q+fowlSAX+RyuNrM1l/dLQ5lnGMg9+BVEy6MNEjFwh0yQHJMFrZXg8UtB1ya6iGS2yfw2/bODfWGKXDWE/6gsrAcoJegPcdYwd1Tc/IwAAAABJRU5ErkJggg==) no-repeat 50% #f7f8fa
}

.fn-part-twenty {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAANDSURBVHgBzVhNctMwFH6SS+Oyod0wE2CR3iAsALNqOAHlBE13DNM2yQninCAJ7TDsGk5Ab9CwwgMLcoN6BkoYNg07pyV6PDk4lR2TRErC9JvxyJZk+dN7T+/HADcMDOZAoXy2Hgi7hMDK4WKIJ3AFNe9t1gdDGBFSiTDA9cSwT1fLe52tgQG0CTl7XwtgrRwDQm7KVB9wUPMOH7RgGYQevfqZt6xBnd4oxBZg2MEBqwgQ69zi9SRRRHbCrrAyqxqnEpLq6eNaFRHLsQ8B63EUtY+H9xpqv7PfLQKH6pgEEVqz2NdEQk8OfpSocZN2Qs/NDO+77cZmL+09p9zNgQCXbncSQ1PVmEpI2gmzrDqJOx8bQGgPBlbl85u7HZgBkhhDRuvgdpKYEKLy6ej+yURC4ekZ2O+TdiIXoB3vekfZNhhgkhptK6iokubqeIC3Y0Yr7YSams2Dh6ZkJLzDbMtrZjflWrS+PxpgUAwFoGAkoTxJxxb2BUxgvwik2RdteCP6zsqoE2zVcH3a1S4sAV4jPGVFp9TdilR4eZW5Q02ckC4ib02LFiI10+nrIIqmrjNUwcEAUuwB2l/o1k3YXB6YdewcdM+cl6Sa/0WIvnw6JXTkYBVOpRRh2YTCIxwnI0/hhrwo2ldUUoFYLYMmtG0IGZbY38MpCSRCR8M5OCep8OpwMt8CTWhLiMG1985Y/VZyPOCXDWVyAZZNaNnQJ0TxLLpNs5GMWBs5PGRsppinQt8PMfGB9lEYPvDq0/3vvUh1oV8CdK+n/m6CJrQlFNqIEo9ICnUichEMw46rTPVNHKQ2oY6MOQyexYLkOHy4pDkGMDJqGY/C6I2wixQuRgND+xpmB4aVh3EsC4lRWkFNCxaIEaEAgh5F/OgxRx75eN4aKw1hUJZ5F4pc1Ld6q/8ruo9ljETiNOHMfJijxhojklbLUd6lpjrxjNEKXlDzTunK0eWG0Xv/WxEMIXP0KDtIkGnLJFCdm5rkP947315EjTWtlktLiyeWQaY1lm4tNzOhkJRmjWVay13PmxHTaiwOoreIWk7/Z8O/1DgOo1rO+P8QnTyZT++MGT7ZiVQPeeuGSQk11w+ryL6IxPPhYuZEbiz+ALjXxabhPMR+AAAAAElFTkSuQmCC) no-repeat 50% #f7f8fa
}

.phone-all-use {
    width: 100%;
    overflow: hidden
}

.phone-all-img {
    width: 100%
}

.phone-years {
    overflow: hidden;
    background: #f6f6f7
}

.phone-download-all {
    width: 100%;
    overflow: hidden
}

.download-intro {
    width: 74.6%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 auto
}

.download-part-intro {
    width: 11.04rem;
    height: 11.04rem;
    border-radius: 50%;
    background: #f4f4f5;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    margin-bottom: 2.5rem;
    position: relative;
    text-align: center
}

.download-part-mac {
    text-align: center;
    width: 4.1rem;
    margin: 0 auto;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -2.05rem;
    margin-top: -2.87rem
}

.download-part-mac img {
    margin-bottom: .23rem
}

.download-part-intro span {
    font-size: 1.1rem;
    color: #7d8085;
    line-height: 24px;
    display: block;
    margin-top: 7rem
}

.phone-all-img {
    width: 91%;
    margin: 0 auto
}

.phone-years {
    width: 100%;
    background: url(../img/lx/phone-years.d789dbfa.png) no-repeat 50%;
    height: 31.3rem
}

.phone-years .title_by_phone {
    color: #fff;
    margin-bottom: 0
}

.phone-years .title_by_text {
    margin-top: 0;
    margin-bottom: 3.22rem
}

.phone-year-content {
    width: 75%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between
}

.phone-year-content .phone-year-part {
    width: 50%;
    position: relative;
    margin-bottom: 3.22rem
}

.phone-year-part .phone-year-text {
    color: #fff;
    font-size: 1.8rem;
    margin-bottom: 5px;
    text-align: center
}

.phone-year-part .phone-year-texts {
    color: #fff;
    font-size: 1rem
}

.boder-year {
    position: absolute;
    width: 1px;
    height: 80%;
    background: #fff;
    right: 0;
    display: block;
    top: 15%
}

.download-part-intro p {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -42px;
    margin-top: -8px;
    color: #7d8085;
    display: none
}

.download-macOS-none {
    display: block
}

.header-navbar {
    background: rgba(0, 0, 0, .2);
    line-height: 32px;
    height: 32px;
    color: #fff;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10
}

.header-navbar .fix-pc-one {
    width: 1180px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header-navbar .fix-pc-right {
    float: right
}

.header-navbar .fix-pc-right a {
    margin-left: 50px
}

.header-nav {
    background: transparent;
    transition: top .4s;
    position: fixed;
    top: 32px;
    left: 0;
    right: 0;
    z-index: 10;
    height: 60px;
    -webkit-transition: top .4s;
    -moz-transition: top .4s;
    -ms-transition: top .4s;
    -o-transition: top .4s
}

.fix_pc_two {
    width: 1180px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fix_pc_two .pc-two-logo {
    width: 220px;
    display: flex;
    align-items: center;
}

.pc-two-navs {
    cursor: pointer;
}


.choice-color {
    color: #fff
}

.choice-colors {
    color: #000
}

.pc-two-navs a,.pc-two-navs span {
    display: inline-block;
    margin-left: 60px;
}

.nav-active {
    color: #236def !important;
    font-weight: 800
}

.pc-two-login {
    line-height: 60px
}

.pc-two-login button {
    width: 102px;
    height: 32px;
    background-color: #236def;
    color: #fff;
    cursor: pointer
}

.pc-two-login a,
.pc-two-login button {
    border-radius: 6px;
    border: 1px solid #236def;
    text-align: center;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px
}

.pc-two-login a {
    width: 100px;
    line-height: 30px;
    height: 30px;
    display: inline-block;
    margin-left: 10px;
    color: #236def;
    font-size: 14px
}

.pc-two-login .check-color {
    color: #236def;
    border-color: #236def
}

a {
    text-decoration: none
}

.nav-six-choice,
.video-target {
    position: relative
}

.video-target {
    width: 100%;
    height: 580px;
    box-sizing: border-box;
    overflow: hidden
}

.video-target .video-bg {
    left: 50%;
    transform: translate(-50%, -25%);
    -webkit-transform: translate(-50%, -25%);
    -moz-transform: translate(-50%, -25%);
    -ms-transform: translate(-50%, -25%);
    -o-transform: translate(-50%, -25%)
}

.gradient,
.video-target .video-bg {
    position: absolute;
    top: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto
}

.gradient {
    left: 0;
    background: rgba(0, 10, 32, .7)
}

.video-content {
    width: 1180px;
    margin: 0 auto;
    height: 100%;
    position: absolute;
    left: 50%;
    margin-left: -590px;
    z-index: 8
}

.video-part .center-img {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -32px;
    margin-top: -32px;
    width: 64px;
    height: 64px
}

.video-download-pc {
    width: 160px;
    height: 44px;
    float: left;
    text-align: center;
    line-height: 44px;
    border: 1px solid #386ee7;
    position: relative;
    border-radius: 4px;
    cursor: pointer
}

.alert-video {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 10, 32, .7);
    z-index: 999;
    display: none
}

#video_alert {
    margin-left: -600px;
    margin-top: -322.5px
}

#video_alert,
.video_text {
    position: absolute;
    left: 50%;
    top: 50%
}

.video_text {
    height: 400px;
    width: 546px;
    margin-left: -273px;
    margin-top: -200px;
    display: none
}

.video_text p {
    font-size: 45px;
    color: #fff;
    margin-bottom: 100px
}

.video_text .btn-start {
    width: 175px;
    height: 44px;
    background: #fff;
    border-radius: 4px;
    color: #386ee7;
    font-size: 16px;
    text-align: center;
    line-height: 44px;
    margin: 0 auto;
    cursor: pointer
}

.vclose {
    position: absolute;
    right: -59%;
    top: -30%;
    border-radius: 100%;
    cursor: pointer
}

.videoAagin-pause,
.videoCenter-pause {
    width: 64px;
    height: 64px;
    position: absolute;
    display: none;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 0
}

.btn-startCenter {
    width: 140px;
    height: 44px;
    background: #fff;
    border-radius: 4px;
    color: #386ee7;
    font-size: 16px;
    text-align: center;
    line-height: 44px;
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    bottom: 160px;
    display: none;
    cursor: pointer
}

.pc-two-nav {
    color: #262a33;
    font-size: 16px;
    display: flex;
    align-items: center;
}

.head .nav-top {
    transition: top .4s;
    top: 0;
    background-color: #fff;
    border-bottom: 1px solid #eceff4
}

.head .nav-top .text-color {
    color: #000
}

.download-img-pc {
    margin: 0 auto;
    width: 1120px;
    height: 160px;
    overflow: hidden;
    display: flex;
    justify-content: space-between
}

.download-img-one {
    width: 160px;
    height: 160px;
    position: relative;
    border-radius: 50%;
    background: #f4f4f5;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    float: left;
    cursor: pointer
}

.download-pc-img {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -26px;
    margin-top: -41px
}

.download-pc-img p {
    margin-top: 14px;
    font-size: 16px;
    line-height: 16px;
    color: #7d8085;
    text-align: center
}

.download-pc-imgs {
    width: 52px;
    margin: 0 auto
}

.download-macOS {
    margin-left: -27px
}

.download-macOS,
.download-windows {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -41px
}

.download-windows {
    margin-left: -35px
}

.download-andr {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -31px;
    margin-top: -44px
}

.bottom-phone {
    width: 100%;
    height: 100%;
    opacity: 0
}

.content .bottom-andr {
    transition: all .2s;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -ms-transition: all 2s;
    -o-transition: all 2s
}

.content .bottom-andr img,
.content .bottom-ios img {
    opacity: 0;
    width: 90px;
    height: 90px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -45px;
    margin-top: -45px
}

.download-img-andr span,
.download-img-ios span {
    position: absolute;
    display: block;
    color: #7d8085;
    left: 50%;
    top: 50%;
    margin-left: -28px;
    margin-top: 49px;
    display: none;
    font-size: 14px
}

.download-icon-masOs {
    width: 56px;
    height: 56px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -28px;
    margin-top: -50px;
    display: none
}

.download-img-ios:hover .bottom-phone {
    opacity: 1
}

.download-ios {
    margin-left: -47.5px
}

.download-img-ios:hover .download-ios {
    opacity: 0
}

.download-img-ios:hover .ios-span,
.download-img-macOS:hover .download-icon-masOs {
    display: block
}

.download-img-andr:hover .bottom-andr img {
    opacity: 1
}

.download-img-andr:hover .download-andr {
    opacity: 0
}

.download-img-andr:hover span {
    display: block
}

.swiper-pc-title {
    font-size: 28px;
    color: #262a33;
    font-weight: 600;
    margin-top: 80px
}

.swiper-pc-green,
.swiper-pc-title {
    line-height: 32px;
    margin-bottom: 16px
}

.swiper-pc-green {
    width: 120px;
    height: 32px;
    background: rgba(56, 194, 153, .15);
    border-radius: 4px;
    text-align: center;
    color: #70ccab
}

.swiper-pc-text {
    font-size: 16px;
    width: 400px;
    line-height: 150%;
    color: #51555c;
    margin-bottom: 64px
}

.swiper-pc-modal {
    font-size: 24px;
    line-height: 150%;
    color: #262a33;
    font-weight: 600
}

.swiper-slide .swiper-pc-slide {
    position: absolute;
    right: 0;
    top: 0;
    width: 779px;
    height: 452px
}

.download-pc-now {
    position: absolute;
    color: #51555c;
    font-size: 16px;
    line-height: 16px;
    left: 50%;
    top: 50%;
    margin-left: -32px;
    margin-top: 20px;
    opacity: 0
}

.download-icon-window {
    width: 56px;
    height: 56px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -28px;
    margin-top: -50px;
    display: none
}

.download-img-macOS:hover .download-pc-now {
    opacity: 1
}

.download-img-macOS:hover .download-macOS {
    opacity: 0
}

.download-pc-now-window {
    position: absolute;
    color: #51555c;
    font-size: 16px;
    line-height: 16px;
    left: 50%;
    top: 50%;
    margin-left: -32px;
    margin-top: 20px;
    opacity: 0
}

.download-img-windows:hover .download-pc-now-window {
    opacity: 1
}

.download-img-windows:hover .download-windows {
    opacity: 0
}

.download-img-windows:hover .download-icon-window {
    display: block
}

.clicShow .img-icon {
    display: block;
    float: right;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACiSURBVHgB7ZAxDsIwDEXtMLjdWNnCDRgZ4SjcoJwERjaOUkZGbgAba7YmQk2IBwtKDULq2jdZP///WAYYGQzKsKzuNrW4KyfN5rSfO828qq7Tpi2P+Ejb82F2Y83IowfvAKMNkWo2auGQqDYm2qLwrrcBs8gmygXcSiasZRMJ80z40nsFWglr38JqwWeJOLRw5wbvXLIx5N8j/A7/hXbQkS5Pvh1MwU8RFvwAAAAASUVORK5CYII=) no-repeat 50%
}

.clicShow .img-bottom {
    display: block;
    float: right;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB/SURBVHgB7ZHBDYAgDEVLL/XoCm7gCLqRo7iRjuAGMoJHegGLCR4MlHjnJVyavrY/ADRUpuXsaz1GkznQBgGAkOd9Ha5cH6qy4OWxp610DWoyGZ5ZtmtDjCans0epkwyI275xTE1OlIa8ERx0vfdoc3LkkNoTJ6B1rqv+TuMHN5fuUKyQYCqKAAAAAElFTkSuQmCC) no-repeat 50%
}

.swiper-span-text {
    margin-left: 32px
}

.pc-hover {
    font-size: 16px;
    color: #386ee7;
    font-weight: 400;
    background: #fff;
    height: 44px;
    border-radius: 4px
}

.download-top-now-jump {
    background: #386ee7 !important;
    color: #fff !important
}

.download-top-jump {
    border: 1px solid #386ee7 !important;
    color: #386ee7 !important
}

.hover_top_color {
    background: #3461d0 !important;
    color: #fff !important
}

.hover_top_color_right {
    background: #f4f4f5
}

.h5_hover {
    font-size: 16px;
    color: #fff;
    font-weight: 400;
    height: 44px;
    border-radius: 4px
}

.hover_color:hover {
    background: #f4f4f5
}

.pc_hover_white:hover {
    background: #3461d0
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.swiper-container-no-flexbox .swiper-slide {
    float: left
}

.swiper-container-vertical>.swiper-wrapper {
    -ms-flex-direction: column;
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -ms-flexbox;
    display: flex;
    transition-property: transform;
    box-sizing: content-box
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    transform: translateZ(0)
}

.swiper-container-multirow>.swiper-wrapper {
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-free-mode>.swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
    height: auto
}

.swiper-container-autoheight .swiper-wrapper {
    -ms-flex-align: start;
    align-items: flex-start;
    transition-property: transform, height
}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-wp8-horizontal {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.swiper-wp8-vertical {
    -ms-touch-action: pan-x;
    touch-action: pan-x
}

.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 27px;
    height: 44px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    background-size: 27px 44px;
    background-position: 50%;
    background-repeat: no-repeat
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23007aff'/%3E%3C/svg%3E");
    left: 10px;
    right: auto
}

.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z'/%3E%3C/svg%3E")
}

.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23fff'/%3E%3C/svg%3E")
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23007aff'/%3E%3C/svg%3E");
    right: 10px;
    left: auto
}

.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z'/%3E%3C/svg%3E")
}

.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23fff'/%3E%3C/svg%3E")
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: .3s;
    transform: translateZ(0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: .2
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-white .swiper-pagination-bullet {
    background: #fff
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #007aff
}

.swiper-pagination-white .swiper-pagination-bullet-active {
    background: #fff
}

.swiper-pagination-black .swiper-pagination-bullet-active {
    background: #000
}

.swiper-container-vertical>.swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0, -50%, 0)
}

.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 5px 0;
    display: block
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px
}

.swiper-pagination-progress {
    background: rgba(0, 0, 0, .25);
    position: absolute
}

.swiper-pagination-progress .swiper-pagination-progressbar {
    background: #007aff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top
}

.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
    transform-origin: right top
}

.swiper-container-horizontal>.swiper-pagination-progress {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-container-vertical>.swiper-pagination-progress {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-progress.swiper-pagination-white {
    background: hsla(0, 0%, 100%, .5)
}

.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
    background: #fff
}

.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
    background: #000
}

.swiper-container-3d {
    -o-perspective: 1200px;
    perspective: 1200px
}

.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
    transform-style: preserve-3d
}

.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(270deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(90deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(180deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-coverflow .swiper-wrapper,
.swiper-container-flip .swiper-wrapper {
    -ms-perspective: 1200px
}

.swiper-container-cube,
.swiper-container-flip {
    overflow: visible
}

.swiper-container-cube .swiper-slide,
.swiper-container-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1
}

.swiper-container-cube .swiper-slide .swiper-slide,
.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active,
.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-container-cube .swiper-slide {
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
    transform-origin: 100% 0
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-next+.swiper-slide,
.swiper-container-cube .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible
}

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .6;
    filter: blur(50px);
    z-index: 0
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity
}

.swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.swiper-zoom-container>canvas,
.swiper-zoom-container>img,
.swiper-zoom-container>svg {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, .1)
}

.swiper-container-horizontal>.swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%
}

.swiper-container-vertical>.swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, .5);
    border-radius: 10px;
    left: 0;
    top: 0
}

.swiper-scrollbar-cursor-drag {
    cursor: move
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    animation: Ab 1s steps(12) infinite
}

.swiper-lazy-preloader:after {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%236c6c6c' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E");
    background-position: 50%;
    background-size: 100%;
    background-repeat: no-repeat
}

.swiper-lazy-preloader-white:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%23fff' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E")
}

@keyframes Ab {
    to {
        transform: rotate(1turn)
    }
}

body,
html {
    font-size: 12px;
    font-family: PingFangSC, Microsoft YaHei, sans-serif
}

body,
html,
p {
    margin: 0;
    padding: 0
}

@media screen and (max-width:1920px) {

    body,
    html {
        font-size: 12px
    }

    .all {
        height: 610px;
        padding: 0
    }
}

.all {
    position: relative;
    height: 580px;
    padding: 0;
    margin: 0 auto;
    text-align: center;
    background-color: #f7f9fc;
    background: url(../img/lx/video-img.b2e0e4da.png) no-repeat 50%
}

.phone-banner {
    display: none
}

.please-wait {
    font-size: 1.5rem;
    position: absolute;
    z-index: 999;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    background-color: #fff;
    border-radius: 8px;
    text-align: center;
    opacity: 0
}

.download-ios:hover .please-wait {
    opacity: 1
}

.please-wait span {
    position: absolute;
    left: 0;
    top: 40%;
    bottom: 0;
    right: 0
}

.pc,
.phone {
    display: inline-block
}

.pc-text,
.phone-texts {
    font-size: 16px;
    line-height: 18px;
    color: rgba(38, 42, 51, .5)
}

.container {
    max-width: 1920px;
    margin: 0 auto
}

.all-download {
    margin: 48px 0 0;
    width: 344px;
    height: 4.5rem
}

.container-left {
    width: 550px;
    height: 460px;
    padding-top: 150px;
    text-align: left
}

.container-right {
    float: right;
    width: 630px;
    height: 580px
}

.container-title {
    width: 472px;
    height: 68px;
    font-weight: 600;
    font-size: 40px;
    line-height: 130%;
    color: #262a33;
    text-align: center;
    margin-bottom: 24px
}

.container-text {
    width: 484px;
    text-align: justify;
    height: 72px;
    font-size: 16px;
    line-height: 150%;
    color: #51555c
}

.all-download-pc {
    width: 160px;
    height: 44px;
    float: left;
    text-align: center;
    line-height: 44px;
    border: 1px solid #386ee7;
    position: relative;
    border-radius: 4px;
    cursor: pointer
}

.container-pc {
    width: 1180px;
    margin: 0 auto
}

.all-download-phone {
    width: 160px;
    height: 44px;
    float: right;
    color: #fff;
    line-height: 44px;
    text-align: center;
    background-color: #386ee7;
    position: relative;
    border-radius: 4px;
    cursor: pointer;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px
}

.all-download-phone:hover .all-downloading {
    display: block;
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s
}

.all-no-download {
    height: 3.125rem;
    background-color: #f6f6f6
}

.all-downloading,
.all-no-download {
    font-size: 1rem;
    position: absolute;
    margin: 0 auto;
    top: 5rem;
    left: 0;
    right: 0;
    bottom: 0;
    width: 11.25rem;
    text-align: center;
    line-height: 3.125rem;
    display: none;
    border-radius: .1rem;
    -webkit-border-radius: .1rem;
    -moz-border-radius: .1rem;
    -ms-border-radius: .1rem;
    -o-border-radius: .1rem
}

.all-downloading {
    height: 13.125rem;
    background: #fff
}

.all-downloading .download_show {
    margin: 0 auto;
    line-height: 1.875rem;
    font-size: 1.125rem;
    color: #262a33;
    height: 1.875rem
}

.all-downloading img {
    display: block;
    margin: 1.25rem auto 0
}

.container>.head {
    text-align: left;
    margin: 0 auto;
    width: 75%;
    line-height: 45px
}

.head-right {
    float: right;
    font-size: 1.25rem
}

.head-right>.download-now {
    position: relative
}

.head-right>.enterprise-email {
    margin-left: 2.5rem
}

.download-now>.download-triangle {
    display: none;
    z-index: 2;
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -8px;
    width: 0;
    height: 0;
    border-width: 8px;
    border-style: solid;
    border-color: transparent transparent #fff
}

.download-now>.download-qrcode {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 15px);
    padding: 10px;
    box-shadow: 0 4px 8px rgba(38, 42, 51, .1);
    border-radius: 8px;
    background: #fff;
    border: 1px solid #e1e1e1
}

.download-now:hover>.download-qrcode,
.download-now:hover>.download-triangle {
    display: block
}

.hr {
    width: 6.25rem;
    height: .25rem;
    background-color: #fff;
    margin: 2.5rem auto;
    display: none
}

.container>.all-introduce {
    width: 58%;
    margin: 0 auto;
    font-size: 1.5rem;
    line-height: 2.5rem;
    text-align: center;
    color: #fff;
    display: none
}

.content-phone,
.logo-img {
    display: none
}

.content {
    margin: 0 auto
}

.choice-part {
    width: 100%;
    height: 720px;
    background: #f6f6f6;
    overflow: hidden
}

.choice-centent {
    width: 1180px;
    margin: 0 auto;
    height: 100%;
    text-align: center
}

.all-pc-titile,
.choice-centent .choice-title {
    height: 32px;
    font-weight: 500;
    font-size: 32px;
    line-height: 32px;
    margin-top: 80px;
    color: #262a33;
    margin-bottom: 24px
}

.choice-desc {
    height: 16px;
    font-size: 16px;
    line-height: 16px;
    color: #51555c;
    margin-bottom: 48px
}

.choice-picture {
    width: 1180px;
    height: 332px;
    margin: 0 auto
}

.choice-centent .choice-picture .choice-pic-part {
    float: left;
    width: 280px;
    height: 332px;
    text-align: center;
    background: #fff;
    border-radius: 8px
}

.choice-pic-part:hover {
    box-shadow: 0 8px 40px rgba(38, 42, 51, .08);
    transition: all .4s;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    -o-transition: all .4s
}

.choice-centent .choice-picture .choice-pic-part .choice-img {
    width: 100px;
    height: 72px;
    margin: 0 auto;
    margin-top: 40px;
    margin-bottom: 32px
}

.choice-pic-part .choice-part-advantage {
    font-size: 24px;
    line-height: 24px;
    color: #262a33;
    margin-bottom: 16px
}

.choice-picture p {
    font-size: 14px;
    line-height: 1.875;
    color: #51555c;
}

.choice-download,
.click-download {
    width: 160px;
    height: 44px;
    background: #386ee7;
    border-radius: 4px;
    margin: 0 auto;
    font-size: 16px;
    line-height: 44px;
    text-align: center;
    margin-top: 64px;
    color: #fff;
    cursor: pointer
}

.swiper-page {
    width: 1180px;
    height: 72px;
    margin: 0 auto
}

.swiper-pagination .swiper-pagination-bullet {
    margin: 0 5px
}

.swiper-one {
    width: 220px;
    height: 72px;
    border-radius: 4px;
    float: left;
    line-height: 72px;
    font-weight: 400;
    font-size: 24px;
    color: #676c73;
    text-align: center;
    cursor: pointer;
    position: relative;
    background-color: rgba(38, 42, 51, .04)
}

.swiper-first {
    background: url(../img/office/office_icon01.png) no-repeat 48px 25px rgba(38, 42, 51, .04);
    margin-right: 20px
}

.swiper-second {
    background: url(../img/office/office_icon02.png) no-repeat 48px 25px rgba(38, 42, 51, .04);
    margin-right: 20px
}

.swiper-third {
    background: url(../img/office/office_icon03.png) no-repeat 48px 25px rgba(38, 42, 51, .04);
    margin-right: 20px
}

.swiper-fouth {
    background: url(../img/office/office_icon04.png) no-repeat 48px 25px rgba(38, 42, 51, .04);
    margin-right: 20px
}

.swiper-fifth {
    background: url(../img/office/office_icon04.png) no-repeat 48px 25px rgba(38, 42, 51, .04)
}

.swiper-1 {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIuMjUgNC45NUMyLjI1IDQuMjg3MjYgMi43ODcyNiAzLjc1IDMuNDUgMy43NUgyMC41NUMyMS4yMTI3IDMuNzUgMjEuNzUgNC4yODcyNiAyMS43NSA0Ljk1VjE5LjA1QzIxLjc1IDE5LjcxMjcgMjEuMjEyNyAyMC4yNSAyMC41NSAyMC4yNUgzLjQ1QzIuNzg3MjYgMjAuMjUgMi4yNSAxOS43MTI3IDIuMjUgMTkuMDVWNC45NVoiIHN0cm9rZT0iIzM4NkVFNyIgc3Ryb2tlLXdpZHRoPSIxLjgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8cGF0aCBkPSJNMyA0LjVMMTEuNTU2MiAxMC4yMDQyQzExLjgyNSAxMC4zODMzIDEyLjE3NSAxMC4zODMzIDEyLjQ0MzggMTAuMjA0MkwyMSA0LjUiIHN0cm9rZT0iIzM4NkVFNyIgc3Ryb2tlLXdpZHRoPSIxLjgiLz4KPC9zdmc+Cg==) no-repeat 48px 25px rgba(38, 42, 51, .04);
    margin-right: 20px
}

.swiper-2 {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGNpcmNsZSBjeD0iMTIiIGN5PSI2Ljc1IiByPSIzLjc1IiBzdHJva2U9IiMzODZFRTciIHN0cm9rZS13aWR0aD0iMS44Ii8+CjxwYXRoIGQ9Ik0zIDE1LjVDMyAxNC4zOTU0IDMuODk1NDMgMTMuNSA1IDEzLjVIMTlDMjAuMTA0NiAxMy41IDIxIDE0LjM5NTQgMjEgMTUuNVYxOS44QzIxIDIwLjQ2MjcgMjAuNDYyNyAyMSAxOS44IDIxSDQuMkMzLjUzNzI2IDIxIDMgMjAuNDYyNyAzIDE5LjhWMTUuNVoiIHN0cm9rZT0iIzM4NkVFNyIgc3Ryb2tlLXdpZHRoPSIxLjgiLz4KPC9zdmc+Cg==) no-repeat 48px 25px rgba(38, 42, 51, .04);
    margin-right: 20px
}

.swiper-3 {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik02LjYgNC44VjZIOC40VjQuOEgxNS42VjZIMTcuNFY0LjhIMTkuNzVDMTkuODYwNSA0LjggMTkuOTUgNC44ODk1NCAxOS45NSA1VjguMUg0LjA1VjVDNC4wNSA0Ljg4OTU0IDQuMTM5NTQgNC44IDQuMjUgNC44SDYuNlpNNC4wNSA5LjlWMTlDNC4wNSAxOS4xMTA1IDQuMTM5NTQgMTkuMiA0LjI1IDE5LjJIMTkuNzVDMTkuODYwNSAxOS4yIDE5Ljk1IDE5LjExMDUgMTkuOTUgMTlWOS45SDQuMDVaTTguNCAzSDE1LjZWMS41SDE3LjRWM0gxOS43NUMyMC44NTQ2IDMgMjEuNzUgMy44OTU0MyAyMS43NSA1VjE5QzIxLjc1IDIwLjEwNDYgMjAuODU0NiAyMSAxOS43NSAyMUg0LjI1QzMuMTQ1NDMgMjEgMi4yNSAyMC4xMDQ2IDIuMjUgMTlWNUMyLjI1IDMuODk1NDMgMy4xNDU0MyAzIDQuMjUgM0g2LjZWMS41SDguNFYzWiIgZmlsbD0iIzM4NkVFNyIvPgo8L3N2Zz4K) no-repeat 48px 25px rgba(38, 42, 51, .04);
    margin-right: 20px
}

.swiper-4 {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNSAxOC41QzMuNSAxNC42NDg0IDMuNSA1LjUgMy41IDUuNUMzLjUgMy44NDMxNSA0Ljg0MzE1IDIuNSA2LjUgMi41SDE3LjVWMTUuNUMxNy41IDE1LjUgOS4xMTYzIDE1LjUgNi41IDE1LjVDNC44NSAxNS41IDMuNSAxNi44NDIxIDMuNSAxOC41WiIgc3Ryb2tlPSIjMzg2RUU3IiBzdHJva2Utd2lkdGg9IjEuOCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTcuNSAxNS41QzE3LjUgMTUuNSA3LjA3Njg1IDE1LjUgNi41IDE1LjVDNC44NDMxNSAxNS41IDMuNSAxNi44NDMyIDMuNSAxOC41QzMuNSAyMC4xNTY4IDQuODQzMTUgMjEuNSA2LjUgMjEuNUM3LjYwNDU1IDIxLjUgMTIuOTM3OSAyMS41IDIwLjUgMjEuNVYzLjUiIHN0cm9rZT0iIzM4NkVFNyIgc3Ryb2tlLXdpZHRoPSIxLjgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNNyAxOC41SDE3IiBzdHJva2U9IiMzODZFRTciIHN0cm9rZS13aWR0aD0iMS44IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==) no-repeat 48px 25px rgba(38, 42, 51, .04);
    margin-right: 20px
}

.swiper-5 {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPG1hc2sgaWQ9InBhdGgtMS1pbnNpZGUtMSIgZmlsbD0id2hpdGUiPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTQgM0MyLjg5NTQzIDMgMiAzLjg5NTQzIDIgNVYxNy41QzIgMTguNjA0NiAyLjg5NTQzIDE5LjUgNCAxOS41SDlMMTEuMzIyNSAyMS44MjI1QzExLjY5NjcgMjIuMTk2NyAxMi4zMDMzIDIyLjE5NjcgMTIuNjc3NSAyMS44MjI1TDE1IDE5LjVIMjBDMjEuMTA0NiAxOS41IDIyIDE4LjYwNDYgMjIgMTcuNVY1QzIyIDMuODk1NDMgMjEuMTA0NiAzIDIwIDNINFoiLz4KPC9tYXNrPgo8cGF0aCBkPSJNOSAxOS41TDEwLjEzMTQgMTguMzY4Nkw5LjY2Mjc0IDE3LjlIOVYxOS41Wk0xNSAxOS41VjE3LjlIMTQuMzM3M0wxMy44Njg2IDE4LjM2ODZMMTUgMTkuNVpNMy42IDVDMy42IDQuNzc5MDkgMy43NzkwOSA0LjYgNCA0LjZWMS40QzIuMDExNzggMS40IDAuNCAzLjAxMTc3IDAuNCA1SDMuNlpNMy42IDE3LjVWNUgwLjRWMTcuNUgzLjZaTTQgMTcuOUMzLjc3OTA5IDE3LjkgMy42IDE3LjcyMDkgMy42IDE3LjVIMC40QzAuNCAxOS40ODgyIDIuMDExNzcgMjEuMSA0IDIxLjFWMTcuOVpNOSAxNy45SDRWMjEuMUg5VjE3LjlaTTcuODY4NjMgMjAuNjMxNEwxMC4xOTEyIDIyLjk1MzlMMTIuNDUzOSAyMC42OTEyTDEwLjEzMTQgMTguMzY4Nkw3Ljg2ODYzIDIwLjYzMTRaTTEwLjE5MTIgMjIuOTUzOUMxMS4xOTAyIDIzLjk1MjkgMTIuODA5OCAyMy45NTI5IDEzLjgwODggMjIuOTUzOUwxMS41NDYxIDIwLjY5MTJDMTEuNzk2OCAyMC40NDA1IDEyLjIwMzIgMjAuNDQwNSAxMi40NTM5IDIwLjY5MTJMMTAuMTkxMiAyMi45NTM5Wk0xMy44MDg4IDIyLjk1MzlMMTYuMTMxNCAyMC42MzE0TDEzLjg2ODYgMTguMzY4NkwxMS41NDYxIDIwLjY5MTJMMTMuODA4OCAyMi45NTM5Wk0yMCAxNy45SDE1VjIxLjFIMjBWMTcuOVpNMjAuNCAxNy41QzIwLjQgMTcuNzIwOSAyMC4yMjA5IDE3LjkgMjAgMTcuOVYyMS4xQzIxLjk4ODIgMjEuMSAyMy42IDE5LjQ4ODIgMjMuNiAxNy41SDIwLjRaTTIwLjQgNVYxNy41SDIzLjZWNUgyMC40Wk0yMCA0LjZDMjAuMjIwOSA0LjYgMjAuNCA0Ljc3OTA5IDIwLjQgNUgyMy42QzIzLjYgMy4wMTE3NyAyMS45ODgyIDEuNCAyMCAxLjRWNC42Wk00IDQuNkgyMFYxLjRINFY0LjZaIiBmaWxsPSIjMzg2RUU3IiBtYXNrPSJ1cmwoI3BhdGgtMS1pbnNpZGUtMSkiLz4KPHBhdGggZD0iTTcuNSAxMkM3LjUgMTIgOS4xMzYzNiAxMyAxMiAxM0MxNC44NjM2IDEzIDE2LjUgMTIgMTYuNSAxMiIgc3Ryb2tlPSIjMzg2RUU3IiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=) no-repeat 48px 25px rgba(38, 42, 51, .04)
}

.swiper-part {
    width: 100%;
    height: 1021px
}

.swiper-content {
    width: 1180px;
    height: 461px;
    margin: 0 auto
}

.swiper-span {
    width: 0;
    background-color: #386ee7
}

.boder-outline {
    width: 100%;
    height: 3px;
    position: absolute;
    left: 0;
    bottom: 3px;
    transition: all 10s;
    -webkit-transition: all 10s;
    -moz-transition: all 10s;
    -ms-transition: all 10s;
    -o-transition: all 10s
}

.swiper-click {
    color: #386ee7;
    background-color: #f0f8ff
}

.product-img-part {
    width: 1180px;
    overflow: hidden;
    height: 456px;
    transition: all .5s;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s
}

.product-part {
    width: 100%;
    background: #f6f6f6;
    overflow: hidden
}

.product-desc {
    width: 280px;
    height: 208px;
    background: #fff;
    border-radius: 8px;
    float: left;
    margin-bottom: 20px
}

.product-desc:hover {
    box-shadow: 0 8px 40px rgba(38, 42, 51, .08);
    transition: all .5s;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s
}

.product-desc .redius {
    width: 56px;
    height: 56px;
    background: #f7f8fa;
    border-radius: 50%;
    overflow: hidden;
    margin: 20px 0;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%
}

.redius-child {
    width: 32px;
    height: 32px;
    margin: 0 auto;
    margin-top: 12px
}

.product-desc img {
    width: 100%;
    height: 100%
}

.product-text {
    font-size: 20px;
    color: #111f33;
    margin-bottom: 12px
}

.product-text,
.product-texts {
    line-height: 20px;
    text-align: left;
    margin-left: 5px
}

.product-texts {
    width: 240px;
    height: 60px;
    font-size: 14px;
    color: #676c73
}

.clicShow {
    margin-top: 46px;
    margin-bottom: 80px;
    padding-right: 20px;
    cursor: pointer
}

.clicShow span {
    font-size: 16px;
    line-height: 16px;
    color: #386ee7;
    position: relative
}

.clicShow span img {
    position: absolute;
    right: -20px;
    top: 50%;
    margin-top: -2px
}

.user-part {
    width: 100%;
    height: 585px
}

.user-content {
    width: 1180px;
    margin: 0 auto;
    height: 100%;
    overflow: hidden;
    text-align: center
}

.user-products {
    width: 1180px;
    height: 310px;
    margin: 0 auto
}

.user-desc {
    width: 280px;
    height: 90px;
    float: left
}

.user-img {
    margin: 0 auto;
    width: 174px;
    height: 64px;
    margin-top: 11px
}

.banner-part {
    width: 100%;
    background: url(../img/lx/banner.68295349.png) no-repeat 50%;
    height: 354px;
    overflow: hidden
}

.banner-content {
    width: 1180px;
    height: 80px;
    margin: 0 auto;
    overflow: hidden
}

.banner-desc {
    width: 280px;
    /* padding:0 40px; */
    text-align: center;
    border-right: 1px solid skyblue;
    margin-top: 7px;
    float: left
}

.banner-desc p {
    font-size: 40px;
    line-height: 40px;
    color: #fff;
    font-weight: 700
}

.icon-bottom {
    width: 18px;
    height: 16px;
    display: inline-block;
    vertical-align: bottom
}

.banner-desc div {
    font-size: 16px;
    line-height: 16px;
    text-align: center;
    color: #fff;
    font-weight: 400;
    padding-top: 16px
}

.download-part {
    width: 100%;
    height: 395px
}

.download-img {
    width: 1180px;
    height: 90px
}

.download-desc {
    width: 278px;
    height: 88px;
    border: 1px solid #a8aaad;
    box-sizing: border-box;
    border-radius: 8px;
    float: left;
    cursor: pointer
}

.download-desc-android:hover .download-phone-android,
.download-desc-ios:hover .download-phone-ios {
    display: block;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s
}

.hover-download {
    width: 170px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 20px;
    display: none
}

.part-download .hover-download span {
    width: 42px;
    height: 42px;
    display: block;
    float: left;
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOCAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNCAyOEMyMS43MzIgMjggMjggMjEuNzMyIDI4IDE0QzI4IDYuMjY4MDEgMjEuNzMyIDAgMTQgMEM2LjI2ODAxIDAgMCA2LjI2ODAxIDAgMTRDMCAyMS43MzIgNi4yNjgwMSAyOCAxNCAyOFpNMTMuOTk5OSA3LjAwMTY5QzE0Ljc3MzEgNy4wMDE2OSAxNS4zOTk5IDcuNjI4NDkgMTUuMzk5OSA4LjQwMTY5VjE2Ljg2NTJMMTguNjc3NyAxMy45OTcyQzE5LjI1OTYgMTMuNDg4IDIwLjE0NCAxMy41NDcgMjAuNjUzMiAxNC4xMjg5QzIxLjE2MjMgMTQuNzEwOCAyMS4xMDM0IDE1LjU5NTIgMjAuNTIxNSAxNi4xMDQ0TDE0Ljk1OTMgMjAuOTcxM0MxNC43MDg3IDIxLjIwNzIgMTQuMzcxMiAyMS4zNTE3IDEzLjk5OTkgMjEuMzUxN0MxMy42MzM4IDIxLjM1MTcgMTMuMzAwNSAyMS4yMTEyIDEzLjA1MTEgMjAuOTgxMUw3LjQ3NzY3IDE2LjEwNDRDNi44OTU3OCAxNS41OTUyIDYuODM2ODEgMTQuNzEwOCA3LjM0NTk3IDE0LjEyODlDNy44NTUxMiAxMy41NDcgOC43Mzk1OSAxMy40ODggOS4zMjE0OCAxMy45OTcyTDEyLjU5OTkgMTYuODY1OFY4LjQwMTY5QzEyLjU5OTkgNy42Mjg0OSAxMy4yMjY3IDcuMDAxNjkgMTMuOTk5OSA3LjAwMTY5WiIgZmlsbD0iIzM4NkVFNyIvPgo8L3N2Zz4K) no-repeat 50%
}

.hover-download div {
    display: block;
    float: right;
    font-size: 28px;
    line-height: 28px;
    text-align: center;
    color: #386ee7;
    margin-left: 5px;
    margin-top: 5px
}

.hover-downloads {
    width: 170px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 20px;
    margin-left: 10px;
    display: none
}

.part-download .hover-downloads span {
    width: 42px;
    height: 42px;
    display: block;
    float: left;
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOCAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNCAyOEMyMS43MzIgMjggMjggMjEuNzMyIDI4IDE0QzI4IDYuMjY4MDEgMjEuNzMyIDAgMTQgMEM2LjI2ODAxIDAgMCA2LjI2ODAxIDAgMTRDMCAyMS43MzIgNi4yNjgwMSAyOCAxNCAyOFpNMTMuOTk5OSA3LjAwMTY5QzE0Ljc3MzEgNy4wMDE2OSAxNS4zOTk5IDcuNjI4NDkgMTUuMzk5OSA4LjQwMTY5VjE2Ljg2NTJMMTguNjc3NyAxMy45OTcyQzE5LjI1OTYgMTMuNDg4IDIwLjE0NCAxMy41NDcgMjAuNjUzMiAxNC4xMjg5QzIxLjE2MjMgMTQuNzEwOCAyMS4xMDM0IDE1LjU5NTIgMjAuNTIxNSAxNi4xMDQ0TDE0Ljk1OTMgMjAuOTcxM0MxNC43MDg3IDIxLjIwNzIgMTQuMzcxMiAyMS4zNTE3IDEzLjk5OTkgMjEuMzUxN0MxMy42MzM4IDIxLjM1MTcgMTMuMzAwNSAyMS4yMTEyIDEzLjA1MTEgMjAuOTgxMUw3LjQ3NzY3IDE2LjEwNDRDNi44OTU3OCAxNS41OTUyIDYuODM2ODEgMTQuNzEwOCA3LjM0NTk3IDE0LjEyODlDNy44NTUxMiAxMy41NDcgOC43Mzk1OSAxMy40ODggOS4zMjE0OCAxMy45OTcyTDEyLjU5OTkgMTYuODY1OFY4LjQwMTY5QzEyLjU5OTkgNy42Mjg0OSAxMy4yMjY3IDcuMDAxNjkgMTMuOTk5OSA3LjAwMTY5WiIgZmlsbD0iIzM4NkVFNyIvPgo8L3N2Zz4K) no-repeat 50%
}

.hover-downloads div {
    display: block;
    float: right;
    font-size: 28px;
    line-height: 28px;
    text-align: center;
    color: #386ee7;
    margin-left: 5px;
    margin-top: 5px
}

.download-phone-android,
.download-phone-ios {
    display: none
}

.download-ios-three {
    width: 180px;
    height: 210px;
    background-color: #fff;
    position: absolute;
    left: 50%;
    top: 87px;
    margin-left: -90px;
    z-index: 998;
    box-shadow: 0 4px 8px rgba(38, 42, 51, .1);
    border-radius: 4px;
    font-size: 18px;
    line-height: 18px;
    color: #262a33
}

.download-opacity,
.download-opacitys {
    opacity: 0
}

.answer-part {
    width: 100%;
    background: #f6f6f6;
    height: 364px
}

.download-desc .download-top {
    width: 42px;
    height: 42px;
    float: left;
    margin-top: 20px
}

.part-download {
    width: 150px;
    margin: 0 auto;
    height: 100%;
    position: relative
}

.download-desc .download-wrap {
    font-size: 24px;
    line-height: 42px;
    color: #7d8085;
    height: 42px;
    float: right;
    margin-top: 20px
}

.a {
    list-style: none
}

.ios-one {
    width: 156px;
    height: 156px;
    margin: 12px
}

.finally-part {
    width: 100%;
    background: #2b2e33
}

.finally-part .finally-content {
    width: 1180px;
    height: 100%;
    margin: 0 auto;
    background: #2b2e33
}

.finally-top {
    width: 1180px;
    height: 198px;
    border-bottom: 1px solid #3c3f47
}

.finally-desc {
    width: 590px;
    height: 100%;
    text-align: left;
    overflow: hidden;
    float: left
}

.finally-desc .desc-title {
    font-size: 16px;
    line-height: 16px;
    color: #fff;
    margin-bottom: 20px
}

.desc-partone {
    width: 120px;
    margin-top: 48px;
    margin-right: 80px;
    float: left
}

.finally-desc a {
    width: 130px;
    font-size: 12px;
    display: block;
    margin: 12px 0
}

.slider-part {
    width: 70px;
    height: 250px;
    position: fixed;
    top: 40%;
    right: 10px
}

.boder-hr {
    float: right;
    width: 1px;
    height: 78px;
    background: #3c3f47;
    margin-top: 48px
}

.tellMe {
    width: 580px;
    float: right;
    height: 100%
}

.tellMe div {
    margin-top: 48px;
    margin-left: 82px;
    font-size: 16px;
    line-height: 40px;
    color: #fff;
    display: inline-block
}

.tellMe .p-two,
.tellMe div span {
    color: #7d8085;
    font-size: 12px
}

.finally-container {
    text-align: center;
    padding: 20px 0
}

.finally-lefted {
    float: left
}

.finally-righted {
    width: 764px;
    text-align: center;
    margin: 0 auto
}

.finally-righted a:active,
.finally-righted a:link,
.finally-righted a:visited {
    color: #7d8085
}

.finally-righted a:hover {
    color: #386ee7
}

.finally-righted p {
    margin: 8px 0;
    color: #7d8085
}

.content .experience-now {
    position: relative
}

.content .experience-now div {
    width: 12.5rem;
    height: 4.5rem;
    position: absolute;
    top: 95%;
    left: 50%;
    margin-left: -6.25rem;
    margin-top: -2.25rem;
    border: 1px solid #386ee7;
    box-sizing: border-box;
    border-radius: .5rem;
    text-align: center;
    line-height: 4.5rem;
    font-size: 1.5rem;
    color: #386ee7;
    cursor: pointer;
    -webkit-border-radius: .5rem;
    -moz-border-radius: .5rem;
    -ms-border-radius: .5rem;
    -o-border-radius: .5rem
}

.pc-one {
    width: 100%;
    text-align: left;
    min-width: 76.875rem
}

.pc-one-content {
    max-width: 1920px;
    width: 62%;
    margin: 0 auto;
    overflow: hidden;
    padding: 7.3125rem 0
}

.pc-one-img {
    width: 40%;
    float: left
}

.pc-one-text {
    width: 50%;
    float: right;
    margin-top: 5rem
}

.content .pc-title {
    font-size: 2.5rem;
    font-weight: 500
}

.content .hrs {
    width: 3.90625rem;
    height: .25rem;
    background-color: #386ee7;
    margin: 2.8125rem 0 4.5rem
}

.content .pc-show {
    width: 100%;
    line-height: 1.5625rem
}

.content .pc-show div,
.content .pc-show p {
    font-size: 1.5rem;
    line-height: 2.5rem;
    color: rgba(38, 42, 51, .5)
}

.content .pc-show div {
    margin-top: 1.875rem
}

.content .btn-pc {
    color: #386ee7;
    margin-top: 5rem;
    cursor: pointer;
    font-size: 1.5rem
}

.content .pc-show span {
    color: #386ee7;
    font-weight: 900;
    margin-right: 3px
}

.pc-two {
    width: 100%;
    margin-bottom: 9.0625rem
}

.pc-two-text {
    width: 68.75rem;
    margin: 0 auto;
    padding: 8.75rem 0 0;
    text-align: center
}

.pc-two-title {
    font-size: 2.5rem;
    font-weight: 500
}

.pc-two-show {
    font-size: 1.5rem;
    line-height: 2.5rem;
    color: rgba(38, 42, 51, .5)
}

.pc-two .pc-two-main {
    margin-top: 3rem
}

.pc-two .pc-two-main>span {
    padding-right: 2.7rem;
    margin-top: 2rem
}

.pc-two .pc-two-main>span span {
    color: #386ee7;
    font-weight: 900;
    margin-right: 4px
}

.pc-btn-two {
    width: 12.5rem;
    height: 4.5rem;
    border: 1px solid #386ee7;
    box-sizing: border-box;
    border-radius: 8px;
    margin: 4.5rem auto 3.75rem;
    text-align: center;
    line-height: 4.5rem;
    font-size: 1.5rem;
    cursor: pointer;
    color: #386ee7
}

.pc-three {
    width: 100%;
    margin-bottom: 17.8125rem
}

.pc-three-content {
    width: 74%;
    margin-left: 7%;
    overflow: hidden;
    padding-top: 8.75rem
}

.pc-three-img {
    width: 50%;
    float: left
}

.pc-three-content .pc-one-text {
    width: 43%
}

.pc-four {
    width: 100%;
    background-color: #f4f4f5;
    overflow: hidden
}

.pc-four-content {
    width: 85%;
    overflow: hidden;
    float: right
}

.finally-part a {
    text-decoration: none
}

.pc-four-img {
    position: relative
}

.pc-four-img .fill {
    width: 60%;
    height: 100%;
    float: right;
    background-color: #af161e
}

.pc-four-img img {
    z-index: 999
}

.pc-four-content .pc-four-img {
    width: 55%;
    float: right
}

.pc-four-text {
    margin-top: 16.375rem
}

.content img {
    display: block;
    width: 100%;
    height: 100%
}

.content>.plateform {
    width: 100%;
    height: 37.5rem;
    background: url(../img/lx/plateform.eec7f60a.png) no-repeat 50%;
    margin-top: 15rem;
    -ms-background-size: contain;
    background-size: contain
}

.pc-download-info {
    color: #51555c;
    font-size: 2rem;
    width: 100%;
    text-align: center;
    background-color: #fff;
    margin: 3rem 0 2rem
}

.pc-download-info>.pc-download-hr {
    background-color: #386ee7;
    margin: 2rem auto 1.5rem;
    width: 6%;
    height: 3px
}

.pc-download-info>.pc-download-subtitle {
    font-size: 1.2rem;
    color: rgba(38, 42, 51, .5);
    margin-bottom: 3rem
}

.pc-download-info .download-block {
    display: inline-block;
    font-size: 1.2rem;
    background-color: #fff;
    border: 1px solid #e1e1e1;
    box-shadow: 0 4px 8px rgba(38, 42, 51, .1);
    border-radius: 8px;
    padding: 20px;
    margin: 0 auto
}

.pc-download-info .download-pc-block {
    width: 35px;
    height: 35px;
    padding: 52px
}

.pc-download-info .download-ios {
    color: #386ee7
}

.pc-download-info .download-pc-text {
    font-size: 16px;
    line-height: 18px;
    color: rgba(38, 42, 51, .5);
    width: 30rem;
    margin: 0 auto
}

.pc-download-info .download-pc-text span {
    display: inline-block
}

.pc-download-info .download-android {
    color: #5fc375
}

.pc-download-info .download-block-title {
    float: left;
    line-height: 100px;
    margin-left: 10px
}

.pc-download-info img {
    float: right;
    width: 100px;
    height: 100px
}

.footer {
    background-color: #2b2e33;
    padding: 5rem 15%;
    color: rgba(38, 42, 51, .6);
    font-size: 1rem;
    text-align: right;
    display: none
}

.footer .footer-container {
    max-width: 1920px;
    margin: 0 auto
}

.slider-one {
    width: 70px;
    height: 82px;
    right: 25px;
    top: 28%;
    cursor: pointer;
    z-index: 999;
    margin-bottom: 20px
}

.slider-intro {
    z-index: 999;
    width: 70px;
    color: rgba(38, 42, 51, .8);
    right: 10px;
    height: 150px;
    font-size: 12px;
    line-height: 17px;
    top: 40%;
    color: #386ee7;
    text-align: center;
    background: #fff;
    border: 1px solid #e1e1e1;
    box-sizing: border-box;
    box-shadow: 0 4px 8px rgba(38, 42, 51, .1)
}

.tel-left {
    padding-top: 4px
}

.tel-left,
.tel-right {
    float: left;
    margin-left: 5px
}

.tel-right {
    padding-top: 9px;
    color: #386ee7;
    font-size: 14px;
    line-height: 20px
}

.tel-phone {
    width: 127px;
    height: 41px;
    background: #fff;
    border: 1px solid #386ee7;
    box-sizing: border-box;
    border-radius: 2px;
    position: absolute;
    top: 80%;
    right: 90px;
    opacity: 0
}

.slider-intro>.slider-intro-hr {
    width: 75%;
    background: #386ee7;
    opacity: .16
}

.mask {
    position: fixed;
    z-index: 10;
    background-color: rgba(0, 0, 0, .5);
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.slider-intro>.online-consultings {
    font-size: 14px;
    cursor: pointer
}

.pc-logo-span {
    display: inline-block;
    background: url(../img/lx_logo2.png) no-repeat 50%;
    width: 155px;
    height: 28px;
    background-size: 95% 91%;
}

.pc-logo-white {
    background: url(../img/lx_logo1.png) no-repeat 50%
}

.pc-jump-logo {
    display: inline-block;
    background: url(../img/lx_logo2.png) no-repeat 50%;
    width: 155px;
    height: 28px;
    background-size: 95% 91%;
}

.consulting-modal {
    animation-duration: .3s;
    display: none;
    position: fixed;
    z-index: 20;
    top: 50%;
    left: 50%;
    width: 560px;
    height: 304px;
    margin-top: -152px;
    margin-left: -280px;
    background-color: #fff;
    border: 1px solid rgba(38, 42, 51, .2);
    box-shadow: 0 4px 8px rgba(38, 42, 51, .1);
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 20px
}

.consulting-modal>.modal-header {
    height: 80px;
    line-height: 31px;
    font-size: 24px;
    color: #000;
    border-bottom: 1px solid rgba(38, 42, 51, .2);
    padding: 24px;
    box-sizing: border-box
}

.consulting-modal>.modal-content {
    padding: 16px 24px
}

.consulting-modal>.modal-content>.modal-content-left {
    margin-right: 220px
}

.consulting-modal .intro-title {
    margin-bottom: 16px
}

.consulting-modal .intro-line {
    margin-bottom: 10px
}

.consulting-modal>.modal-content>.modal-content-rigtht {
    float: right;
    width: 220px;
    text-align: center
}

.consulting-modal .modal-header-logo {
    vertical-align: bottom
}

.consulting-modal .modal-header-close {
    vertical-align: middle;
    cursor: pointer;
    float: right;
    width: 20px;
    height: 20px
}

.content-phone img {
    display: block;
    width: 100%;
    height: 100%
}

.download-now-phone {
    display: none
}

.content-phone>.download-immediately {
    background: #386ee7;
    border-radius: 8px;
    height: 50px;
    line-height: 50px;
    color: #fff;
    width: 70%;
    font-size: 1.5rem;
    text-align: center;
    margin: 3rem auto 0;
    display: block
}

.phone-banner .phone-center {
    position: relative
}

.phone-banner .phone-banner-text {
    position: absolute;
    right: 5%;
    top: 21%;
    width: 15rem
}

.phone-banner .phone-banner-text p {
    color: #7d8085;
    font-size: 1.4rem;
    margin-bottom: 1.2rem
}

.phone-banner .phone-banner-text .banner-text-top p {
    line-height: 150%;
    margin-bottom: .75rem;
    font-weight: 600;
    font-size: 1.8rem;
    line-height: 2rem;
    color: #262a33
}

.phone-banner .phone-center img {
    height: 100%;
    width: 100%
}

.phone-banner .banner-btn {
    width: 8.33rem;
    height: 2.9rem;
    text-align: center;
    line-height: 2.9rem;
    background: #386ee7;
    color: #fff;
    font-size: 1.2rem;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px
}

#YSF-BTN-HOLDER {
    display: none !important
}

@media screen and (max-width:768px) {

    body,
    html {
        min-width: 100%
    }

    .video-target {
        display: none
    }

    .phone-banner {
        width: 100%;
        display: block
    }

    .slider-part {
        display: none
    }

    .all .container {
        margin: 0 auto;
        height: 0
    }

    .footer .footer-left {
        float: left;
        margin-top: 10px
    }

    .slider-intro {
        display: none
    }

    .footer .footer-right {
        margin-left: 25%
    }

    .footer a:active,
    .footer a:link,
    .footer a:visited {
        color: rgba(38, 42, 51, .6)
    }

    .footer a:hover {
        color: #386ee7
    }

    .footer p {
        margin: .625rem auto
    }

    a,
    a:active,
    a:hover,
    a:link,
    a:visited {
        text-decoration: none;
        color: #fff
    }

    .slider-one {
        display: none
    }

    .hr {
        width: 6.25rem;
        height: .25rem;
        background-color: #fff;
        margin: 2.5rem auto;
        display: block
    }

    .all {
        background: #386ee7;
        height: 0;
        background: url(../img/lx/h5-banner.67e00b67.png) no-repeat 50%;
        margin-top: 54px;
        background-size: 100% 100%
    }

    .container-pc,
    .fix-pc-one {
        display: none
    }

    .logo-img {
        display: block;
        margin-top: 5px
    }

    .header-nav,
    .header-navbar {
        display: none
    }

    .container>.head {
        width: auto;
        height: 34px;
        line-height: 34px;
        margin: 0;
        background: #fff;
        position: fixed;
        padding: 10px 20px;
        top: 0;
        right: 0;
        left: 0;
        z-index: 999
    }

    .download-now {
        display: none !important
    }

    .download-now-phone {
        font-size: 1.2rem;
        line-height: 34px;
        padding: 0 8px;
        border: 1px solid #fff;
        color: #fff;
        border-radius: 8px;
        background: #386ee7;
        display: block
    }

    .container>.all-introduce {
        width: 90%;
        text-align: left;
        font-size: 1.25rem;
        line-height: 2.8125rem;
        display: block
    }

    .content,
    .enterprise-email {
        display: none
    }

    .content-phone {
        display: block
    }

    .pc-one {
        text-align: center;
        overflow: hidden
    }

    .phone-two .phone-content {
        padding: 0 11%;
        margin-top: 3.75rem;
        text-align: center;
        font-size: 1.25rem;
        line-height: 2.5rem
    }

    .hrs {
        width: 5rem;
        height: .25rem;
        background-color: #386ee7;
        margin: 2.5rem auto
    }

    .phone-two .phone-text .phone-title {
        font-size: 2.2rem
    }

    .phone-show {
        color: rgba(38, 42, 51, .5);
        margin-bottom: 3rem
    }

    .blue {
        color: #386ee7;
        font-weight: 900
    }

    .left-text {
        float: left
    }

    .right-text {
        float: right
    }

    .btn-first {
        margin-left: -6rem
    }

    .btn-phone {
        width: 10rem;
        height: 3rem;
        border: .0625rem solid #386ee7;
        text-align: center;
        line-height: 3rem;
        color: #386ee7;
        cursor: pointer;
        margin: 0 auto;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px
    }

    .phone-img {
        margin-top: 4rem
    }

    .phone-banner .phone-banner-text {
        width: 276px
    }

    .phone-banner .phone-banner-text .banner-text-top {
        font-size: 46px;
        line-height: 150%
    }

    .phone-banner .phone-banner-text p {
        color: #7d8085;
        font-size: 28px
    }

    .phone-banner .banner-btn {
        width: 200px;
        height: 70px;
        text-align: center;
        background: #386ee7;
        color: #fff;
        font-size: 28px;
        line-height: 70px;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        -o-border-radius: 8px
    }

    .footer {
        padding: 3rem 4%;
        text-align: center;
        display: block
    }

    .footer .footer-left {
        height: 26px;
        display: block;
        float: none;
        margin: 0 auto 20px
    }

    .footer .footer-right {
        margin-left: 0
    }

    .phone-year-part .phone-year-texts {
        text-align: left;
    }
}

@media screen and (max-width:450px) {

    body,
    html {
        min-width: 100%;
        font-size: 12px
    }

    .phone-banner {
        width: 100%;
        display: block
    }

    .all .container {
        margin: 0 auto;
        height: 0
    }

    .footer .footer-left {
        float: left;
        margin-top: 10px
    }

    .footer .footer-right {
        margin-left: 25%;
        text-align: left
    }

    .footer a:active,
    .footer a:link,
    .footer a:visited {
        color: rgba(38, 42, 51, .6)
    }

    .footer a:hover {
        color: #386ee7
    }

    .footer p {
        margin: 1.25rem auto;
        text-align: center
    }

    a,
    a:active,
    a:hover,
    a:link,
    a:visited {
        text-decoration: none;
        color: #fff
    }

    .slider-one {
        display: none
    }

    .hr {
        width: 6.25rem;
        height: .25rem;
        background-color: #fff;
        margin: 2.5rem auto;
        display: block
    }

    .all {
        background: #386ee7;
        height: 0;
        background: url(../img/lx/h5-banner.67e00b67.png) no-repeat 50%;
        margin-top: 54px;
        background-size: 100% 100%
    }

    .container-pc,
    .fix-pc-one {
        display: none
    }

    .logo-img {
        display: block;
        margin-top: 5px
    }

    .header-nav,
    .header-navbar {
        display: none
    }

    .container>.head {
        width: auto;
        height: 34px;
        line-height: 34px;
        margin: 0;
        background: #fff;
        position: fixed;
        padding: 10px 20px;
        top: 0;
        right: 0;
        left: 0;
        z-index: 999
    }

    .download-now {
        display: none !important
    }

    .download-now-phone {
        font-size: 1.2rem;
        line-height: 34px;
        padding: 0 8px;
        border: 1px solid #fff;
        color: #fff;
        border-radius: 8px;
        background: #386ee7;
        display: block
    }

    .container>.all-introduce {
        width: 90%;
        text-align: left;
        font-size: 1.25rem;
        line-height: 2.8125rem;
        display: block
    }

    .content,
    .enterprise-email {
        display: none
    }

    .content-phone {
        display: block;
        margin-top: -3px
    }

    .pc-one {
        text-align: center;
        overflow: hidden
    }

    .phone-banner .phone-banner-text {
        width: 15rem
    }

    .phone-banner .phone-banner-text .banner-text-top {
        font-size: 2rem;
        font-weight: 600;
        line-height: 150%;
        margin-bottom: .8rem
    }

    .phone-banner .banner-btn {
        display: block;
        width: 8.33rem;
        height: 2.9rem;
        text-align: center;
        line-height: 2.9rem;
        background: #386ee7;
        color: #fff;
        font-size: 1.2rem;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px
    }

    .phone-banner .phone-banner-text p {
        color: #7d8085;
        font-size: 1.1rem;
        margin-bottom: 1.8rem;
        line-height: 1.7rem
    }

    .phone-two .phone-content {
        padding: 0 11%;
        margin-top: 3.75rem;
        text-align: center;
        font-size: 1.25rem;
        line-height: 2.5rem
    }

    .hrs {
        width: 5rem;
        height: .25rem;
        background-color: #386ee7;
        margin: 2.5rem auto
    }

    .phone-two .phone-text .phone-title {
        font-size: 2.2rem
    }

    .phone-show {
        color: rgba(38, 42, 51, .5);
        margin-bottom: 3rem
    }

    .blue {
        color: #386ee7;
        font-weight: 900
    }

    .left-text {
        float: left
    }

    .right-text {
        float: right
    }

    .btn-first {
        margin-left: -6rem
    }

    .btn-phone {
        width: 10rem;
        height: 3rem;
        border: .0625rem solid #386ee7;
        text-align: center;
        line-height: 3rem;
        color: #386ee7;
        cursor: pointer;
        margin: 0 auto;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px
    }

    .phone-img {
        margin-top: 4rem
    }

    .footer {
        padding: 1.5rem 0;
        text-align: center;
        display: block
    }

    .footer .footer-left {
        height: 26px;
        display: block;
        float: none;
        margin: 0 auto 20px
    }

    .footer .footer-right {
        margin-left: 0
    }
}

@media screen and (max-width:375px) {

    body,
    html {
        font-size: 12px
    }

    .phone-banner .phone-banner-text {
        width: 14rem
    }

    .phone-banner .phone-banner-text .banner-text-top {
        font-size: 2rem;
        font-weight: 600;
        line-height: 150%;
        margin-bottom: .45rem
    }

    .phone-banner .banner-btn {
        width: 8.33rem;
        height: 2.9rem;
        text-align: center;
        line-height: 2.9rem;
        background: #386ee7;
        color: #fff;
        font-size: 1.2rem;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px
    }

    .phone-banner .phone-banner-text p {
        color: #7d8085;
        font-size: 1.1rem;
        margin-bottom: 1.2rem;
        line-height: 1.7rem
    }

    .g-animate-nav .swiper-slide span {
        margin-left: 2rem
    }

    .fn-part-show {
        width: 48.6%;
        height: 10.66rem
    }

    .fn-part-bottom {
        font-size: 1rem
    }

    .fn-part-top span {
        font-size: 1.16rem
    }

    .fn-part-top div {
        width: 2.33rem;
        height: 2.33rem
    }

    .fn-part-top span {
        line-height: 2.33rem
    }

    .download-part-intro {
        width: 10rem;
        height: 10rem;
        margin-bottom: 1.6rem
    }

    .download-part-intro span {
        margin-top: 6.5rem
    }
}