/*--公共部分--*/

html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; cursor: pointer; }



body, form, img, ul, ol, li, dl, dt, dd, p, tr, td, strong, span, pre { margin: 0; padding: 0; border: 0; }



h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-weight: normal; }



body, button, input, select, textarea { font: 14px/1.5 'Microsoft YaHei', 'Hiragino Sans GB', sans-serif,Arial; color: #333; }



ul, li { list-style: none; }



img { border: 0px; vertical-align: middle; }



table { border-collapse: collapse; border-spacing: 0; }



table th, table td { border: 1px solid #ccc; }



*, :after, :before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-repeat: no-repeat; }



article, aside, footer, header, nav, section { display: block; }



a { background-color: transparent; -webkit-text-decoration-skip: objects; text-decoration: none; color: #333; outline: none; cursor: pointer; }



a:hover { background-repeat: no-repeat; text-decoration: none; }



a, input[type="button"], button, label, input[type="submit"], input[type="reset"] { cursor: pointer; }



sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }



sub { bottom: -0.25em; }



sup { top: -0.5em; }



audio, video { display: inline-block; }



[type="checkbox"], [type="radio"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; }



input, textarea, select { outline: none; }



input[type="text"], input[type="password"], input[type="button"], input[type="submit"], input[type="reset"], select, textarea { outline-style: none; -webkit-appearance: none; resize: none; border: none; -webkit-border-radius: 0; border-radius: 0; }



textarea { overflow: auto; vertical-align: top; }



input:-webkit-autofill { -webkit-box-shadow: 0 0 0px rgba(255, 255, 255, 0) inset !important; }



.bd_weixin_popup, .content-box { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }



.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }



.clearfix { *zoom: 1; }



.clear { clear: both; line-height: 0; height: 0; font-size: 0; }



.fl { float: left; }



.fr { float: right; }



.show { display: block !important; }



.hide { display: none !important; }



.container { padding: 0px 10px; }



.row { margin-left: 0px; margin-right: 0px; }



.commonleft { float: none; }



.commonright { float: none; }



.visible-sm, .visible-md, .visible-lg { display: none; }



.hidden-sm, .hidden-md, .hidden-lg { display: block; }



.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 { float: left; padding-left: 10px; padding-right: 10px; }



.col-xs-12 { width: 100%; }



.col-xs-11 { width: 91.66666667%; }



.col-xs-10 { width: 83.33333333%; }



.col-xs-9 { width: 75%; }



.col-xs-8 { width: 66.66666667%; }



.col-xs-7 { width: 58.33333333%; }



.col-xs-6 { width: 50%; }



.col-xs-5 { width: 41.66666667%; }



.col-xs-4 { width: 33.33333333%; }



.col-xs-3 { width: 25%; }



.col-xs-2 { width: 16.66666667%; }



.col-xs-1 { width: 8.33333333%; }



@media (max-width: 320px) { body { min-width: 320px; } }



@media (min-width: 768px) { .container { padding: 0px 10px; }

  .row { margin-left: -10px; margin-right: -10px; }

  .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { float: left; padding-left: 10px; padding-right: 10px; }

  .col-sm-12 { width: 100%; }

  .col-sm-11 { width: 91.66666667%; }

  .col-sm-10 { width: 83.33333333%; }

  .col-sm-9 { width: 75%; }

  .col-sm-8 { width: 66.66666667%; }

  .col-sm-7 { width: 58.33333333%; }

  .col-sm-6 { width: 50%; }

  .col-sm-5 { width: 41.66666667%; }

  .col-sm-4 { width: 33.33333333%; }

  .col-sm-3 { width: 25%; }

  .col-sm-2 { width: 16.66666667%; }

  .col-sm-1 { width: 8.33333333%; }

  .visible-sm { display: block; }

  .hidden-sm { display: none; }

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



@media (min-width: 992px) { .container { padding: 0px 10px; }

  .row { margin-left: -10px; margin-right: -10px; }

  .commonleft { float: left; }

  .commonright { float: right; }

  .visible-md { display: block; }

  .hidden-md { display: none; }

  .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { float: left; padding-left: 10px; padding-right: 10px; }

  .col-md-12 { width: 100%; }

  .col-md-11 { width: 91.66666667%; }

  .col-md-10 { width: 83.33333333%; }

  .col-md-9 { width: 75%; }

  .col-md-8 { width: 66.66666667%; }

  .col-md-7 { width: 58.33333333%; }

  .col-md-6 { width: 50%; }

  .col-md-5 { width: 41.66666667%; }

  .col-md-4 { width: 33.33333333%; }

  .col-md-3 { width: 25%; }

  .col-md-2 { width: 16.66666667%; }

  .col-md-1 { width: 8.33333333%; }

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



@media (min-width: 1260px) { html { cursor: default; }

  .commonleft { float: left; }

  .commonright { float: right; }

  .visible-lg { display: block; }

  .hidden-lg { display: none; }

  .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { float: left; padding-left: 10px; padding-right: 10px; }

  .col-lg-12 { width: 100%; }

  .col-lg-11 { width: 91.66666667%; }

  .col-lg-10 { width: 83.33333333%; }

  .col-lg-9 { width: 75%; }

  .col-lg-8 { width: 66.66666667%; }

  .col-lg-7 { width: 58.33333333%; }

  .col-lg-6 { width: 50%; }

  .col-lg-5 { width: 41.66666667%; }

  .col-lg-4 { width: 33.33333333%; }

  .col-lg-3 { width: 25%; }

  .col-lg-2 { width: 16.66666667%; }

  .col-lg-1 { width: 8.33333333%; } }



@media (min-width: 1260px) { .container { margin: 0px auto; max-width: 1200px; } }



/* layout start*/

.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 { -webkit-box-orient: vertical; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; }



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



.swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translate3d(0, 0, 0); -o-transform: translate(0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }



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



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



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



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



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



.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: center; background-repeat: no-repeat; }



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



.swiper-pagination { position: absolute; text-align: center; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: 10; }



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



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



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



.swiper-container-fade .swiper-slide { pointer-events: none; -webkit-transition-property: opacity; -o-transition-property: opacity; 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-pagination.swiper-pagination-hidden { opacity: 0; }



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



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



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



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



/* .swiper-scrollbar { -webkit-border-radius: 10px; border-radius: 10px; position: relative; -ms-touch-action: none; background: #dde2e9; } */



.swiper-container-horizontal > .swiper-scrollbar { position: absolute; left: 0px; bottom: 40px; z-index: 50; height: 2px; width: 100%; }



.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: #c1c7cf; -webkit-border-radius: 10px; border-radius: 10px; left: 0; top: 0; } */



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



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



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



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



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



@-webkit-keyframes bounce { 0%, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  40%, 43% { -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0); }

  40%, 43%, 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); }

  70% { -webkit-transform: translate3d(0, -15px, 0);

    transform: translate3d(0, -15px, 0); }

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

    transform: translate3d(0, -4px, 0); } }



@-o-keyframes bounce { 0%, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  40%, 43% { -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0); }

  40%, 43%, 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -o-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); }

  70% { -webkit-transform: translate3d(0, -15px, 0);

    transform: translate3d(0, -15px, 0); }

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

    transform: translate3d(0, -4px, 0); } }



@keyframes bounce { 0%, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  40%, 43% { -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0); }

  40%, 43%, 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -o-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); }

  70% { -webkit-transform: translate3d(0, -15px, 0);

    transform: translate3d(0, -15px, 0); }

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

    transform: translate3d(0, -4px, 0); } }



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



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

  25%, 75% { opacity: 0; } }



@-o-keyframes flash { 0%, 50%, to { opacity: 1; }

  25%, 75% { opacity: 0; } }



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

  25%, 75% { opacity: 0; } }



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



@-webkit-keyframes pulse { 0% { -webkit-transform: scaleX(1);

    transform: scaleX(1); }

  50% { -webkit-transform: scale3d(1.05, 1.05, 1.05);

    transform: scale3d(1.05, 1.05, 1.05); }

  to { -webkit-transform: scaleX(1);

    transform: scaleX(1); } }



@-o-keyframes pulse { 0% { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); }

  50% { -webkit-transform: scale3d(1.05, 1.05, 1.05);

    transform: scale3d(1.05, 1.05, 1.05); }

  to { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); } }



@keyframes pulse { 0% { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); }

  50% { -webkit-transform: scale3d(1.05, 1.05, 1.05);

    transform: scale3d(1.05, 1.05, 1.05); }

  to { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); } }



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



@-webkit-keyframes rubberBand { 0% { -webkit-transform: scaleX(1);

    transform: scaleX(1); }

  30% { -webkit-transform: scale3d(1.25, 0.75, 1);

    transform: scale3d(1.25, 0.75, 1); }

  40% { -webkit-transform: scale3d(0.75, 1.25, 1);

    transform: scale3d(0.75, 1.25, 1); }

  50% { -webkit-transform: scale3d(1.15, 0.85, 1);

    transform: scale3d(1.15, 0.85, 1); }

  65% { -webkit-transform: scale3d(0.95, 1.05, 1);

    transform: scale3d(0.95, 1.05, 1); }

  75% { -webkit-transform: scale3d(1.05, 0.95, 1);

    transform: scale3d(1.05, 0.95, 1); }

  to { -webkit-transform: scaleX(1);

    transform: scaleX(1); } }



@-o-keyframes rubberBand { 0% { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); }

  30% { -webkit-transform: scale3d(1.25, 0.75, 1);

    transform: scale3d(1.25, 0.75, 1); }

  40% { -webkit-transform: scale3d(0.75, 1.25, 1);

    transform: scale3d(0.75, 1.25, 1); }

  50% { -webkit-transform: scale3d(1.15, 0.85, 1);

    transform: scale3d(1.15, 0.85, 1); }

  65% { -webkit-transform: scale3d(0.95, 1.05, 1);

    transform: scale3d(0.95, 1.05, 1); }

  75% { -webkit-transform: scale3d(1.05, 0.95, 1);

    transform: scale3d(1.05, 0.95, 1); }

  to { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); } }



@keyframes rubberBand { 0% { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); }

  30% { -webkit-transform: scale3d(1.25, 0.75, 1);

    transform: scale3d(1.25, 0.75, 1); }

  40% { -webkit-transform: scale3d(0.75, 1.25, 1);

    transform: scale3d(0.75, 1.25, 1); }

  50% { -webkit-transform: scale3d(1.15, 0.85, 1);

    transform: scale3d(1.15, 0.85, 1); }

  65% { -webkit-transform: scale3d(0.95, 1.05, 1);

    transform: scale3d(0.95, 1.05, 1); }

  75% { -webkit-transform: scale3d(1.05, 0.95, 1);

    transform: scale3d(1.05, 0.95, 1); }

  to { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); } }



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



@-webkit-keyframes shake { 0%, to { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

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

    transform: translate3d(-10px, 0, 0); }

  20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0);

    transform: translate3d(10px, 0, 0); } }



@-o-keyframes shake { 0%, to { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

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

    transform: translate3d(-10px, 0, 0); }

  20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0);

    transform: translate3d(10px, 0, 0); } }



@keyframes shake { 0%, to { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

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

    transform: translate3d(-10px, 0, 0); }

  20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0);

    transform: translate3d(10px, 0, 0); } }



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



@-webkit-keyframes headShake { 0% { -webkit-transform: translateX(0);

    transform: translateX(0); }

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

    transform: translateX(-6px) rotateY(-9deg); }

  18.5% { -webkit-transform: translateX(5px) rotateY(7deg);

    transform: translateX(5px) rotateY(7deg); }

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

    transform: translateX(-3px) rotateY(-5deg); }

  43.5% { -webkit-transform: translateX(2px) rotateY(3deg);

    transform: translateX(2px) rotateY(3deg); }

  50% { -webkit-transform: translateX(0);

    transform: translateX(0); } }



@-o-keyframes headShake { 0% { -webkit-transform: translateX(0);

    -o-transform: translateX(0);

    transform: translateX(0); }

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

    transform: translateX(-6px) rotateY(-9deg); }

  18.5% { -webkit-transform: translateX(5px) rotateY(7deg);

    transform: translateX(5px) rotateY(7deg); }

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

    transform: translateX(-3px) rotateY(-5deg); }

  43.5% { -webkit-transform: translateX(2px) rotateY(3deg);

    transform: translateX(2px) rotateY(3deg); }

  50% { -webkit-transform: translateX(0);

    -o-transform: translateX(0);

    transform: translateX(0); } }



@keyframes headShake { 0% { -webkit-transform: translateX(0);

    -o-transform: translateX(0);

    transform: translateX(0); }

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

    transform: translateX(-6px) rotateY(-9deg); }

  18.5% { -webkit-transform: translateX(5px) rotateY(7deg);

    transform: translateX(5px) rotateY(7deg); }

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

    transform: translateX(-3px) rotateY(-5deg); }

  43.5% { -webkit-transform: translateX(2px) rotateY(3deg);

    transform: translateX(2px) rotateY(3deg); }

  50% { -webkit-transform: translateX(0);

    -o-transform: translateX(0);

    transform: translateX(0); } }



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



@-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg);

    transform: rotate(15deg); }

  40% { -webkit-transform: rotate(-10deg);

    transform: rotate(-10deg); }

  60% { -webkit-transform: rotate(5deg);

    transform: rotate(5deg); }

  80% { -webkit-transform: rotate(-5deg);

    transform: rotate(-5deg); }

  to { -webkit-transform: rotate(0deg);

    transform: rotate(0deg); } }



@-o-keyframes swing { 20% { -webkit-transform: rotate(15deg);

    -o-transform: rotate(15deg);

    transform: rotate(15deg); }

  40% { -webkit-transform: rotate(-10deg);

    -o-transform: rotate(-10deg);

    transform: rotate(-10deg); }

  60% { -webkit-transform: rotate(5deg);

    -o-transform: rotate(5deg);

    transform: rotate(5deg); }

  80% { -webkit-transform: rotate(-5deg);

    -o-transform: rotate(-5deg);

    transform: rotate(-5deg); }

  to { -webkit-transform: rotate(0deg);

    -o-transform: rotate(0deg);

    transform: rotate(0deg); } }



@keyframes swing { 20% { -webkit-transform: rotate(15deg);

    -o-transform: rotate(15deg);

    transform: rotate(15deg); }

  40% { -webkit-transform: rotate(-10deg);

    -o-transform: rotate(-10deg);

    transform: rotate(-10deg); }

  60% { -webkit-transform: rotate(5deg);

    -o-transform: rotate(5deg);

    transform: rotate(5deg); }

  80% { -webkit-transform: rotate(-5deg);

    -o-transform: rotate(-5deg);

    transform: rotate(-5deg); }

  to { -webkit-transform: rotate(0deg);

    -o-transform: rotate(0deg);

    transform: rotate(0deg); } }



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



@-webkit-keyframes tada { 0% { -webkit-transform: scaleX(1);

    transform: scaleX(1); }

  10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);

    transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); }

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

    transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); }

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

    transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); }

  to { -webkit-transform: scaleX(1);

    transform: scaleX(1); } }



@-o-keyframes tada { 0% { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); }

  10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);

    transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); }

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

    transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); }

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

    transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); }

  to { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); } }



@keyframes tada { 0% { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); }

  10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);

    transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); }

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

    transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); }

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

    transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); }

  to { -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); } }



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



@-webkit-keyframes wobble { 0% { -webkit-transform: none;

    transform: none; }

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

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

  30% { -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);

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

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

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

  60% { -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);

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

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

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

  to { -webkit-transform: none;

    transform: none; } }



@-o-keyframes wobble { 0% { -webkit-transform: none;

    -o-transform: none;

    transform: none; }

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

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

  30% { -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);

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

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

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

  60% { -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);

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

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

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

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes wobble { 0% { -webkit-transform: none;

    -o-transform: none;

    transform: none; }

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

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

  30% { -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);

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

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

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

  60% { -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);

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

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

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

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes jello { 0%, 11.1%, to { -webkit-transform: none;

    transform: none; }

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

    transform: skewX(-12.5deg) skewY(-12.5deg); }

  33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg);

    transform: skewX(6.25deg) skewY(6.25deg); }

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

    transform: skewX(-3.125deg) skewY(-3.125deg); }

  55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

    transform: skewX(1.5625deg) skewY(1.5625deg); }

  66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    transform: skewX(-0.78125deg) skewY(-0.78125deg); }

  77.7% { -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);

    transform: skewX(0.39063deg) skewY(0.39063deg); }

  88.8% { -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);

    transform: skewX(-0.19531deg) skewY(-0.19531deg); } }



@-o-keyframes jello { 0%, 11.1%, to { -webkit-transform: none;

    -o-transform: none;

    transform: none; }

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

    -o-transform: skewX(-12.5deg) skewY(-12.5deg);

    transform: skewX(-12.5deg) skewY(-12.5deg); }

  33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg);

    -o-transform: skewX(6.25deg) skewY(6.25deg);

    transform: skewX(6.25deg) skewY(6.25deg); }

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

    -o-transform: skewX(-3.125deg) skewY(-3.125deg);

    transform: skewX(-3.125deg) skewY(-3.125deg); }

  55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

    -o-transform: skewX(1.5625deg) skewY(1.5625deg);

    transform: skewX(1.5625deg) skewY(1.5625deg); }

  66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    -o-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    transform: skewX(-0.78125deg) skewY(-0.78125deg); }

  77.7% { -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);

    -o-transform: skewX(0.39063deg) skewY(0.39063deg);

    transform: skewX(0.39063deg) skewY(0.39063deg); }

  88.8% { -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);

    -o-transform: skewX(-0.19531deg) skewY(-0.19531deg);

    transform: skewX(-0.19531deg) skewY(-0.19531deg); } }



@keyframes jello { 0%, 11.1%, to { -webkit-transform: none;

    -o-transform: none;

    transform: none; }

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

    -o-transform: skewX(-12.5deg) skewY(-12.5deg);

    transform: skewX(-12.5deg) skewY(-12.5deg); }

  33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg);

    -o-transform: skewX(6.25deg) skewY(6.25deg);

    transform: skewX(6.25deg) skewY(6.25deg); }

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

    -o-transform: skewX(-3.125deg) skewY(-3.125deg);

    transform: skewX(-3.125deg) skewY(-3.125deg); }

  55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

    -o-transform: skewX(1.5625deg) skewY(1.5625deg);

    transform: skewX(1.5625deg) skewY(1.5625deg); }

  66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    -o-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    transform: skewX(-0.78125deg) skewY(-0.78125deg); }

  77.7% { -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);

    -o-transform: skewX(0.39063deg) skewY(0.39063deg);

    transform: skewX(0.39063deg) skewY(0.39063deg); }

  88.8% { -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);

    -o-transform: skewX(-0.19531deg) skewY(-0.19531deg);

    transform: skewX(-0.19531deg) skewY(-0.19531deg); } }



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



@-webkit-keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); }

  20% { -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1); }

  40% { -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9); }

  60% { opacity: 1;

    -webkit-transform: scale3d(1.03, 1.03, 1.03);

    transform: scale3d(1.03, 1.03, 1.03); }

  80% { -webkit-transform: scale3d(0.97, 0.97, 0.97);

    transform: scale3d(0.97, 0.97, 0.97); }

  to { opacity: 1;

    -webkit-transform: scaleX(1);

    transform: scaleX(1); } }



@-o-keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); }

  20% { -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1); }

  40% { -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9); }

  60% { opacity: 1;

    -webkit-transform: scale3d(1.03, 1.03, 1.03);

    transform: scale3d(1.03, 1.03, 1.03); }

  80% { -webkit-transform: scale3d(0.97, 0.97, 0.97);

    transform: scale3d(0.97, 0.97, 0.97); }

  to { opacity: 1;

    -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); } }



@keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); }

  20% { -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1); }

  40% { -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9); }

  60% { opacity: 1;

    -webkit-transform: scale3d(1.03, 1.03, 1.03);

    transform: scale3d(1.03, 1.03, 1.03); }

  80% { -webkit-transform: scale3d(0.97, 0.97, 0.97);

    transform: scale3d(0.97, 0.97, 0.97); }

  to { opacity: 1;

    -webkit-transform: scaleX(1);

    -o-transform: scaleX(1);

    transform: scaleX(1); } }



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



@-webkit-keyframes bounceInDown { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(0, -3000px, 0);

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

  60% { opacity: 1;

    -webkit-transform: translate3d(0, 25px, 0);

    transform: translate3d(0, 25px, 0); }

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

    transform: translate3d(0, -10px, 0); }

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

    transform: translate3d(0, 5px, 0); }

  to { -webkit-transform: none;

    transform: none; } }



@-o-keyframes bounceInDown { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(0, -3000px, 0);

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

  60% { opacity: 1;

    -webkit-transform: translate3d(0, 25px, 0);

    transform: translate3d(0, 25px, 0); }

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

    transform: translate3d(0, -10px, 0); }

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

    transform: translate3d(0, 5px, 0); }

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes bounceInDown { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(0, -3000px, 0);

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

  60% { opacity: 1;

    -webkit-transform: translate3d(0, 25px, 0);

    transform: translate3d(0, 25px, 0); }

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

    transform: translate3d(0, -10px, 0); }

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

    transform: translate3d(0, 5px, 0); }

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes bounceInLeft { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(-3000px, 0, 0);

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

  60% { opacity: 1;

    -webkit-transform: translate3d(25px, 0, 0);

    transform: translate3d(25px, 0, 0); }

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

    transform: translate3d(-10px, 0, 0); }

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

    transform: translate3d(5px, 0, 0); }

  to { -webkit-transform: none;

    transform: none; } }



@-o-keyframes bounceInLeft { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(-3000px, 0, 0);

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

  60% { opacity: 1;

    -webkit-transform: translate3d(25px, 0, 0);

    transform: translate3d(25px, 0, 0); }

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

    transform: translate3d(-10px, 0, 0); }

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

    transform: translate3d(5px, 0, 0); }

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes bounceInLeft { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(-3000px, 0, 0);

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

  60% { opacity: 1;

    -webkit-transform: translate3d(25px, 0, 0);

    transform: translate3d(25px, 0, 0); }

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

    transform: translate3d(-10px, 0, 0); }

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

    transform: translate3d(5px, 0, 0); }

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes bounceInRight { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(3000px, 0, 0);

    transform: translate3d(3000px, 0, 0); }

  60% { opacity: 1;

    -webkit-transform: translate3d(-25px, 0, 0);

    transform: translate3d(-25px, 0, 0); }

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

    transform: translate3d(10px, 0, 0); }

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

    transform: translate3d(-5px, 0, 0); }

  to { -webkit-transform: none;

    transform: none; } }



@-o-keyframes bounceInRight { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(3000px, 0, 0);

    transform: translate3d(3000px, 0, 0); }

  60% { opacity: 1;

    -webkit-transform: translate3d(-25px, 0, 0);

    transform: translate3d(-25px, 0, 0); }

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

    transform: translate3d(10px, 0, 0); }

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

    transform: translate3d(-5px, 0, 0); }

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes bounceInRight { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(3000px, 0, 0);

    transform: translate3d(3000px, 0, 0); }

  60% { opacity: 1;

    -webkit-transform: translate3d(-25px, 0, 0);

    transform: translate3d(-25px, 0, 0); }

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

    transform: translate3d(10px, 0, 0); }

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

    transform: translate3d(-5px, 0, 0); }

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes bounceInUp { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(0, 3000px, 0);

    transform: translate3d(0, 3000px, 0); }

  60% { opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0); }

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

    transform: translate3d(0, 10px, 0); }

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

    transform: translate3d(0, -5px, 0); }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@-o-keyframes bounceInUp { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(0, 3000px, 0);

    transform: translate3d(0, 3000px, 0); }

  60% { opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0); }

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

    transform: translate3d(0, 10px, 0); }

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

    transform: translate3d(0, -5px, 0); }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@keyframes bounceInUp { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

  0% { opacity: 0;

    -webkit-transform: translate3d(0, 3000px, 0);

    transform: translate3d(0, 3000px, 0); }

  60% { opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0); }

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

    transform: translate3d(0, 10px, 0); }

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

    transform: translate3d(0, -5px, 0); }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



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



@-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9); }

  50%, 55% { opacity: 1;

    -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1); }

  to { opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); } }



@-o-keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9); }

  50%, 55% { opacity: 1;

    -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1); }

  to { opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); } }



@keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9); }

  50%, 55% { opacity: 1;

    -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1); }

  to { opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); } }



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



@-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0);

    transform: translate3d(0, 10px, 0); }

  40%, 45% { opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0); } }



@-o-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0);

    transform: translate3d(0, 10px, 0); }

  40%, 45% { opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0); } }



@keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0);

    transform: translate3d(0, 10px, 0); }

  40%, 45% { opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0); } }



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



@-webkit-keyframes bounceOutLeft { 20% { opacity: 1;

    -webkit-transform: translate3d(20px, 0, 0);

    transform: translate3d(20px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

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



@-o-keyframes bounceOutLeft { 20% { opacity: 1;

    -webkit-transform: translate3d(20px, 0, 0);

    transform: translate3d(20px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

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



@keyframes bounceOutLeft { 20% { opacity: 1;

    -webkit-transform: translate3d(20px, 0, 0);

    transform: translate3d(20px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

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



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



@-webkit-keyframes bounceOutRight { 20% { opacity: 1;

    -webkit-transform: translate3d(-20px, 0, 0);

    transform: translate3d(-20px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0); } }



@-o-keyframes bounceOutRight { 20% { opacity: 1;

    -webkit-transform: translate3d(-20px, 0, 0);

    transform: translate3d(-20px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0); } }



@keyframes bounceOutRight { 20% { opacity: 1;

    -webkit-transform: translate3d(-20px, 0, 0);

    transform: translate3d(-20px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0); } }



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



@-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0);

    transform: translate3d(0, -10px, 0); }

  40%, 45% { opacity: 1;

    -webkit-transform: translate3d(0, 20px, 0);

    transform: translate3d(0, 20px, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

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



@-o-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0);

    transform: translate3d(0, -10px, 0); }

  40%, 45% { opacity: 1;

    -webkit-transform: translate3d(0, 20px, 0);

    transform: translate3d(0, 20px, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

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



@keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0);

    transform: translate3d(0, -10px, 0); }

  40%, 45% { opacity: 1;

    -webkit-transform: translate3d(0, 20px, 0);

    transform: translate3d(0, 20px, 0); }

  to { opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

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



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



@-webkit-keyframes fadeIn { 0% { opacity: 0; }

  to { opacity: 1; } }



@-o-keyframes fadeIn { 0% { opacity: 0; }

  to { opacity: 1; } }



@keyframes fadeIn { 0% { opacity: 0; }

  to { opacity: 1; } }



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



@-webkit-keyframes fadeInDown { 0% { opacity: 0;

    -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    transform: none; } }



@-o-keyframes fadeInDown { 0% { opacity: 0;

    -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes fadeInDown { 0% { opacity: 0;

    -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes fadeInDownBig { 0% { opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

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

  to { opacity: 1;

    -webkit-transform: none;

    transform: none; } }



@-o-keyframes fadeInDownBig { 0% { opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

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

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes fadeInDownBig { 0% { opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

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

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes fadeInLeft { 0% { opacity: 0;

    -webkit-transform: translate3d(-30px, 0, 0);

    transform: translate3d(-30px, 0, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    transform: none; } }



@-o-keyframes fadeInLeft { 0% { opacity: 0;

    -webkit-transform: translate3d(-30px, 0, 0);

    transform: translate3d(-30px, 0, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes fadeInLeft { 0% { opacity: 0;

    -webkit-transform: translate3d(-30px, 0, 0);

    transform: translate3d(-30px, 0, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes fadeInLeftBig { 0% { opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

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

  to { opacity: 1;

    -webkit-transform: none;

    transform: none; } }



@-o-keyframes fadeInLeftBig { 0% { opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

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

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes fadeInLeftBig { 0% { opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

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

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes fadeInRight { 0% { opacity: 0;

    -webkit-transform: translate3d(30px, 0, 0);

    transform: translate3d(30px, 0, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    transform: none; } }



@-o-keyframes fadeInRight { 0% { opacity: 0;

    -webkit-transform: translate3d(30px, 0, 0);

    transform: translate3d(30px, 0, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes fadeInRight { 0% { opacity: 0;

    -webkit-transform: translate3d(30px, 0, 0);

    transform: translate3d(30px, 0, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes fadeInRightBig { 0% { opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    transform: none; } }



@-o-keyframes fadeInRightBig { 0% { opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes fadeInRightBig { 0% { opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes fadeInUp { 0% { opacity: 0;

    -webkit-transform: translate3d(0, 30px, 0);

    transform: translate3d(0, 30px, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    transform: none; } }



@-o-keyframes fadeInUp { 0% { opacity: 0;

    -webkit-transform: translate3d(0, 30px, 0);

    transform: translate3d(0, 30px, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes fadeInUp { 0% { opacity: 0;

    -webkit-transform: translate3d(0, 30px, 0);

    transform: translate3d(0, 30px, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



.fadeInUp { -webkit-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; }



@-webkit-keyframes fadeInUpBig { 0% { opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    transform: none; } }



@-o-keyframes fadeInUpBig { 0% { opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes fadeInUpBig { 0% { opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



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

  to { opacity: 0; } }



@-o-keyframes fadeOut { 0% { opacity: 1; }

  to { opacity: 0; } }



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

  to { opacity: 0; } }



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



@-webkit-keyframes fadeOutDown { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0); } }



@-o-keyframes fadeOutDown { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0); } }



@keyframes fadeOutDown { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0); } }



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



@-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0); } }



@-o-keyframes fadeOutDownBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0); } }



@keyframes fadeOutDownBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0); } }



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



@-webkit-keyframes fadeOutLeft { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0);

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



@-o-keyframes fadeOutLeft { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0);

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



@keyframes fadeOutLeft { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0);

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



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



@-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

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



@-o-keyframes fadeOutLeftBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

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



@keyframes fadeOutLeftBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

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



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



@-webkit-keyframes fadeOutRight { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0); } }



@-o-keyframes fadeOutRight { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0); } }



@keyframes fadeOutRight { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0); } }



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



@-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0); } }



@-o-keyframes fadeOutRightBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0); } }



@keyframes fadeOutRightBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0); } }



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



@-webkit-keyframes fadeOutUp { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

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



@-o-keyframes fadeOutUp { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

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



@keyframes fadeOutUp { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

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



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



@-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

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



@-o-keyframes fadeOutUpBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

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



@keyframes fadeOutUpBig { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

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



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



@-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(-1turn);

    transform: perspective(400px) rotateY(-1turn); }

  0%, 40% { -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out; }

  40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);

    transform: perspective(400px) translateZ(150px) rotateY(-190deg); }

  50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);

    transform: perspective(400px) translateZ(150px) rotateY(-170deg); }

  50%, 80% { -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in; }

  80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);

    transform: perspective(400px) scale3d(0.95, 0.95, 0.95); }

  to { -webkit-transform: perspective(400px);

    transform: perspective(400px);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in; } }



@-o-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(-1turn);

    transform: perspective(400px) rotateY(-1turn); }

  0%, 40% { -webkit-animation-timing-function: ease-out;

    -o-animation-timing-function: ease-out;

    animation-timing-function: ease-out; }

  40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);

    transform: perspective(400px) translateZ(150px) rotateY(-190deg); }

  50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);

    transform: perspective(400px) translateZ(150px) rotateY(-170deg); }

  50%, 80% { -webkit-animation-timing-function: ease-in;

    -o-animation-timing-function: ease-in;

    animation-timing-function: ease-in; }

  80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);

    transform: perspective(400px) scale3d(0.95, 0.95, 0.95); }

  to { -webkit-transform: perspective(400px);

    transform: perspective(400px);

    -webkit-animation-timing-function: ease-in;

    -o-animation-timing-function: ease-in;

    animation-timing-function: ease-in; } }



@keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(-1turn);

    transform: perspective(400px) rotateY(-1turn); }

  0%, 40% { -webkit-animation-timing-function: ease-out;

    -o-animation-timing-function: ease-out;

    animation-timing-function: ease-out; }

  40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);

    transform: perspective(400px) translateZ(150px) rotateY(-190deg); }

  50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);

    transform: perspective(400px) translateZ(150px) rotateY(-170deg); }

  50%, 80% { -webkit-animation-timing-function: ease-in;

    -o-animation-timing-function: ease-in;

    animation-timing-function: ease-in; }

  80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);

    transform: perspective(400px) scale3d(0.95, 0.95, 0.95); }

  to { -webkit-transform: perspective(400px);

    transform: perspective(400px);

    -webkit-animation-timing-function: ease-in;

    -o-animation-timing-function: ease-in;

    animation-timing-function: ease-in; } }



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



@-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg);

    transform: perspective(400px) rotateX(90deg);

    opacity: 0; }

  0%, 40% { -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in; }

  40% { -webkit-transform: perspective(400px) rotateX(-20deg);

    transform: perspective(400px) rotateX(-20deg); }

  60% { -webkit-transform: perspective(400px) rotateX(10deg);

    transform: perspective(400px) rotateX(10deg);

    opacity: 1; }

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

    transform: perspective(400px) rotateX(-5deg); }

  to { -webkit-transform: perspective(400px);

    transform: perspective(400px); } }



@-o-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg);

    transform: perspective(400px) rotateX(90deg);

    opacity: 0; }

  0%, 40% { -webkit-animation-timing-function: ease-in;

    -o-animation-timing-function: ease-in;

    animation-timing-function: ease-in; }

  40% { -webkit-transform: perspective(400px) rotateX(-20deg);

    transform: perspective(400px) rotateX(-20deg); }

  60% { -webkit-transform: perspective(400px) rotateX(10deg);

    transform: perspective(400px) rotateX(10deg);

    opacity: 1; }

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

    transform: perspective(400px) rotateX(-5deg); }

  to { -webkit-transform: perspective(400px);

    transform: perspective(400px); } }



@keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg);

    transform: perspective(400px) rotateX(90deg);

    opacity: 0; }

  0%, 40% { -webkit-animation-timing-function: ease-in;

    -o-animation-timing-function: ease-in;

    animation-timing-function: ease-in; }

  40% { -webkit-transform: perspective(400px) rotateX(-20deg);

    transform: perspective(400px) rotateX(-20deg); }

  60% { -webkit-transform: perspective(400px) rotateX(10deg);

    transform: perspective(400px) rotateX(10deg);

    opacity: 1; }

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

    transform: perspective(400px) rotateX(-5deg); }

  to { -webkit-transform: perspective(400px);

    transform: perspective(400px); } }



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



@-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg);

    transform: perspective(400px) rotateY(90deg);

    opacity: 0; }

  0%, 40% { -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in; }

  40% { -webkit-transform: perspective(400px) rotateY(-20deg);

    transform: perspective(400px) rotateY(-20deg); }

  60% { -webkit-transform: perspective(400px) rotateY(10deg);

    transform: perspective(400px) rotateY(10deg);

    opacity: 1; }

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

    transform: perspective(400px) rotateY(-5deg); }

  to { -webkit-transform: perspective(400px);

    transform: perspective(400px); } }



@-o-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg);

    transform: perspective(400px) rotateY(90deg);

    opacity: 0; }

  0%, 40% { -webkit-animation-timing-function: ease-in;

    -o-animation-timing-function: ease-in;

    animation-timing-function: ease-in; }

  40% { -webkit-transform: perspective(400px) rotateY(-20deg);

    transform: perspective(400px) rotateY(-20deg); }

  60% { -webkit-transform: perspective(400px) rotateY(10deg);

    transform: perspective(400px) rotateY(10deg);

    opacity: 1; }

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

    transform: perspective(400px) rotateY(-5deg); }

  to { -webkit-transform: perspective(400px);

    transform: perspective(400px); } }



@keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg);

    transform: perspective(400px) rotateY(90deg);

    opacity: 0; }

  0%, 40% { -webkit-animation-timing-function: ease-in;

    -o-animation-timing-function: ease-in;

    animation-timing-function: ease-in; }

  40% { -webkit-transform: perspective(400px) rotateY(-20deg);

    transform: perspective(400px) rotateY(-20deg); }

  60% { -webkit-transform: perspective(400px) rotateY(10deg);

    transform: perspective(400px) rotateY(10deg);

    opacity: 1; }

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

    transform: perspective(400px) rotateY(-5deg); }

  to { -webkit-transform: perspective(400px);

    transform: perspective(400px); } }



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



@-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px);

    transform: perspective(400px); }

  30% { -webkit-transform: perspective(400px) rotateX(-20deg);

    transform: perspective(400px) rotateX(-20deg);

    opacity: 1; }

  to { -webkit-transform: perspective(400px) rotateX(90deg);

    transform: perspective(400px) rotateX(90deg);

    opacity: 0; } }



@-o-keyframes flipOutX { 0% { -webkit-transform: perspective(400px);

    transform: perspective(400px); }

  30% { -webkit-transform: perspective(400px) rotateX(-20deg);

    transform: perspective(400px) rotateX(-20deg);

    opacity: 1; }

  to { -webkit-transform: perspective(400px) rotateX(90deg);

    transform: perspective(400px) rotateX(90deg);

    opacity: 0; } }



@keyframes flipOutX { 0% { -webkit-transform: perspective(400px);

    transform: perspective(400px); }

  30% { -webkit-transform: perspective(400px) rotateX(-20deg);

    transform: perspective(400px) rotateX(-20deg);

    opacity: 1; }

  to { -webkit-transform: perspective(400px) rotateX(90deg);

    transform: perspective(400px) rotateX(90deg);

    opacity: 0; } }



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



@-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px);

    transform: perspective(400px); }

  30% { -webkit-transform: perspective(400px) rotateY(-15deg);

    transform: perspective(400px) rotateY(-15deg);

    opacity: 1; }

  to { -webkit-transform: perspective(400px) rotateY(90deg);

    transform: perspective(400px) rotateY(90deg);

    opacity: 0; } }



@-o-keyframes flipOutY { 0% { -webkit-transform: perspective(400px);

    transform: perspective(400px); }

  30% { -webkit-transform: perspective(400px) rotateY(-15deg);

    transform: perspective(400px) rotateY(-15deg);

    opacity: 1; }

  to { -webkit-transform: perspective(400px) rotateY(90deg);

    transform: perspective(400px) rotateY(90deg);

    opacity: 0; } }



@keyframes flipOutY { 0% { -webkit-transform: perspective(400px);

    transform: perspective(400px); }

  30% { -webkit-transform: perspective(400px) rotateY(-15deg);

    transform: perspective(400px) rotateY(-15deg);

    opacity: 1; }

  to { -webkit-transform: perspective(400px) rotateY(90deg);

    transform: perspective(400px) rotateY(90deg);

    opacity: 0; } }



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



@-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);

    transform: translate3d(100%, 0, 0) skewX(-30deg);

    opacity: 0; }

  60% { -webkit-transform: skewX(20deg);

    transform: skewX(20deg); }

  60%, 80% { opacity: 1; }

  80% { -webkit-transform: skewX(-5deg);

    transform: skewX(-5deg); }

  to { -webkit-transform: none;

    transform: none;

    opacity: 1; } }



@-o-keyframes lightSpeedIn { 0% { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);

    transform: translate3d(100%, 0, 0) skewX(-30deg);

    opacity: 0; }

  60% { -webkit-transform: skewX(20deg);

    -o-transform: skewX(20deg);

    transform: skewX(20deg); }

  60%, 80% { opacity: 1; }

  80% { -webkit-transform: skewX(-5deg);

    -o-transform: skewX(-5deg);

    transform: skewX(-5deg); }

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



@keyframes lightSpeedIn { 0% { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);

    transform: translate3d(100%, 0, 0) skewX(-30deg);

    opacity: 0; }

  60% { -webkit-transform: skewX(20deg);

    -o-transform: skewX(20deg);

    transform: skewX(20deg); }

  60%, 80% { opacity: 1; }

  80% { -webkit-transform: skewX(-5deg);

    -o-transform: skewX(-5deg);

    transform: skewX(-5deg); }

  to { -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



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



@-webkit-keyframes lightSpeedOut { 0% { opacity: 1; }

  to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);

    transform: translate3d(100%, 0, 0) skewX(30deg);

    opacity: 0; } }



@-o-keyframes lightSpeedOut { 0% { opacity: 1; }

  to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);

    transform: translate3d(100%, 0, 0) skewX(30deg);

    opacity: 0; } }



@keyframes lightSpeedOut { 0% { opacity: 1; }

  to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);

    transform: translate3d(100%, 0, 0) skewX(30deg);

    opacity: 0; } }



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



@-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center; transform-origin: center;

    -webkit-transform: rotate(-200deg);

    transform: rotate(-200deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: center; }

  to { -webkit-transform-origin: center; transform-origin: center;

    -webkit-transform: none;

    transform: none;

    opacity: 1; } }



@-o-keyframes rotateIn { 0% { -o-transform-origin: center; transform-origin: center;

    -webkit-transform: rotate(-200deg);

    -o-transform: rotate(-200deg);

    transform: rotate(-200deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: center; }

  to { -o-transform-origin: center; transform-origin: center;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



@keyframes rotateIn { 0% { -webkit-transform-origin: center; -o-transform-origin: center; transform-origin: center;

    -webkit-transform: rotate(-200deg);

    -o-transform: rotate(-200deg);

    transform: rotate(-200deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: center; }

  to { -webkit-transform-origin: center; -o-transform-origin: center; transform-origin: center;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



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



@-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -webkit-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1; } }



@-o-keyframes rotateInDownLeft { 0% { -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(-45deg);

    -o-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



@keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(-45deg);

    -o-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -webkit-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



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



@-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(45deg);

    transform: rotate(45deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -webkit-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1; } }



@-o-keyframes rotateInDownRight { 0% { -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(45deg);

    -o-transform: rotate(45deg);

    transform: rotate(45deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



@keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(45deg);

    -o-transform: rotate(45deg);

    transform: rotate(45deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -webkit-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



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



@-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(45deg);

    transform: rotate(45deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -webkit-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1; } }



@-o-keyframes rotateInUpLeft { 0% { -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(45deg);

    -o-transform: rotate(45deg);

    transform: rotate(45deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



@keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(45deg);

    -o-transform: rotate(45deg);

    transform: rotate(45deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -webkit-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



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



@-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(-90deg);

    transform: rotate(-90deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -webkit-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1; } }



@-o-keyframes rotateInUpRight { 0% { -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(-90deg);

    -o-transform: rotate(-90deg);

    transform: rotate(-90deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



@keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(-90deg);

    -o-transform: rotate(-90deg);

    transform: rotate(-90deg);

    opacity: 0; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -webkit-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;

    opacity: 1; } }



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



@-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center; transform-origin: center;

    opacity: 1; }

  0%, to { -webkit-transform-origin: center; }

  to { -webkit-transform-origin: center; transform-origin: center;

    -webkit-transform: rotate(200deg);

    transform: rotate(200deg);

    opacity: 0; } }



@-o-keyframes rotateOut { 0% { -o-transform-origin: center; transform-origin: center;

    opacity: 1; }

  0%, to { -webkit-transform-origin: center; }

  to { -o-transform-origin: center; transform-origin: center;

    -webkit-transform: rotate(200deg);

    -o-transform: rotate(200deg);

    transform: rotate(200deg);

    opacity: 0; } }



@keyframes rotateOut { 0% { -webkit-transform-origin: center; -o-transform-origin: center; transform-origin: center;

    opacity: 1; }

  0%, to { -webkit-transform-origin: center; }

  to { -webkit-transform-origin: center; -o-transform-origin: center; transform-origin: center;

    -webkit-transform: rotate(200deg);

    -o-transform: rotate(200deg);

    transform: rotate(200deg);

    opacity: 0; } }



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



@-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -webkit-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(45deg);

    transform: rotate(45deg);

    opacity: 0; } }



@-o-keyframes rotateOutDownLeft { 0% { -o-transform-origin: left bottom; transform-origin: left bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(45deg);

    -o-transform: rotate(45deg);

    transform: rotate(45deg);

    opacity: 0; } }



@keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -webkit-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(45deg);

    -o-transform: rotate(45deg);

    transform: rotate(45deg);

    opacity: 0; } }



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



@-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -webkit-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 0; } }



@-o-keyframes rotateOutDownRight { 0% { -o-transform-origin: right bottom; transform-origin: right bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(-45deg);

    -o-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 0; } }



@keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -webkit-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(-45deg);

    -o-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 0; } }



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



@-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -webkit-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 0; } }



@-o-keyframes rotateOutUpLeft { 0% { -o-transform-origin: left bottom; transform-origin: left bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(-45deg);

    -o-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 0; } }



@keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: left bottom; }

  to { -webkit-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom;

    -webkit-transform: rotate(-45deg);

    -o-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 0; } }



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



@-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -webkit-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(90deg);

    transform: rotate(90deg);

    opacity: 0; } }



@-o-keyframes rotateOutUpRight { 0% { -o-transform-origin: right bottom; transform-origin: right bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(90deg);

    -o-transform: rotate(90deg);

    transform: rotate(90deg);

    opacity: 0; } }



@keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom;

    opacity: 1; }

  0%, to { -webkit-transform-origin: right bottom; }

  to { -webkit-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom;

    -webkit-transform: rotate(90deg);

    -o-transform: rotate(90deg);

    transform: rotate(90deg);

    opacity: 0; } }



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



@-webkit-keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; }

  0%, 20%, 60% { -webkit-transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out; }

  20%, 60% { -webkit-transform: rotate(80deg);

    transform: rotate(80deg);

    -webkit-transform-origin: top left;

    transform-origin: top left; }

  40%, 80% { -webkit-transform: rotate(60deg);

    transform: rotate(60deg);

    -webkit-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

    opacity: 1; }

  to { -webkit-transform: translate3d(0, 700px, 0);

    transform: translate3d(0, 700px, 0);

    opacity: 0; } }



@-o-keyframes hinge { 0% { -o-transform-origin: top left; transform-origin: top left; }

  0%, 20%, 60% { -webkit-transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    -o-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out; }

  20%, 60% { -webkit-transform: rotate(80deg);

    -o-transform: rotate(80deg);

    transform: rotate(80deg);

    -o-transform-origin: top left;

    transform-origin: top left; }

  40%, 80% { -webkit-transform: rotate(60deg);

    -o-transform: rotate(60deg);

    transform: rotate(60deg);

    -webkit-transform-origin: top left;

    -o-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    -o-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

    opacity: 1; }

  to { -webkit-transform: translate3d(0, 700px, 0);

    transform: translate3d(0, 700px, 0);

    opacity: 0; } }



@keyframes hinge { 0% { -webkit-transform-origin: top left; -o-transform-origin: top left; transform-origin: top left; }

  0%, 20%, 60% { -webkit-transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    -o-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out; }

  20%, 60% { -webkit-transform: rotate(80deg);

    -o-transform: rotate(80deg);

    transform: rotate(80deg);

    -webkit-transform-origin: top left;

    -o-transform-origin: top left;

    transform-origin: top left; }

  40%, 80% { -webkit-transform: rotate(60deg);

    -o-transform: rotate(60deg);

    transform: rotate(60deg);

    -webkit-transform-origin: top left;

    -o-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    -o-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

    opacity: 1; }

  to { -webkit-transform: translate3d(0, 700px, 0);

    transform: translate3d(0, 700px, 0);

    opacity: 0; } }



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



@-webkit-keyframes rollIn { 0% { opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);

    transform: translate3d(-100%, 0, 0) rotate(-120deg); }

  to { opacity: 1;

    -webkit-transform: none;

    transform: none; } }



@-o-keyframes rollIn { 0% { opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);

    transform: translate3d(-100%, 0, 0) rotate(-120deg); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



@keyframes rollIn { 0% { opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);

    transform: translate3d(-100%, 0, 0) rotate(-120deg); }

  to { opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none; } }



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



@-webkit-keyframes rollOut { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);

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



@-o-keyframes rollOut { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);

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



@keyframes rollOut { 0% { opacity: 1; }

  to { opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);

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



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



@-webkit-keyframes zoomIn { 0% { opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); }

  50% { opacity: 1; } }



@-o-keyframes zoomIn { 0% { opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); }

  50% { opacity: 1; } }



@keyframes zoomIn { 0% { opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); }

  50% { opacity: 1; } }



.zoomIn { -webkit-animation-name: zoomIn; -o-animation-name: zoomIn; animation-name: zoomIn; }



@-webkit-keyframes zoomInDown { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@-o-keyframes zoomInDown { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@keyframes zoomInDown { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



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



@-webkit-keyframes zoomInLeft { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@-o-keyframes zoomInLeft { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@keyframes zoomInLeft { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



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



@-webkit-keyframes zoomInRight { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@-o-keyframes zoomInRight { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@keyframes zoomInRight { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



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



@-webkit-keyframes zoomInUp { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 30px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 30px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -30px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -30px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@-o-keyframes zoomInUp { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 30px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 30px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -30px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -30px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@keyframes zoomInUp { 0% { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 30px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 30px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  60% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -30px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -30px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



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



@-webkit-keyframes zoomOut { 0% { opacity: 1; }

  50% { -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); }

  50%, to { opacity: 0; } }



@-o-keyframes zoomOut { 0% { opacity: 1; }

  50% { -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); }

  50%, to { opacity: 0; } }



@keyframes zoomOut { 0% { opacity: 1; }

  50% { -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3); }

  50%, to { opacity: 0; } }



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



@-webkit-keyframes zoomOutDown { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  to { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    -webkit-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@-o-keyframes zoomOutDown { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  to { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    -webkit-transform-origin: center bottom;

    -o-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@keyframes zoomOutDown { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  to { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    -webkit-transform-origin: center bottom;

    -o-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



.zoomOutDown { -webkit-animation-name: zoomOutDown; -o-animation-name: zoomOutDown; animation-name: zoomOutDown; }



@-webkit-keyframes zoomOutLeft { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);

    transform: scale(0.1) translate3d(-2000px, 0, 0);

    -webkit-transform-origin: left center;

    transform-origin: left center; } }



@-o-keyframes zoomOutLeft { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);

    transform: scale(0.1) translate3d(-2000px, 0, 0);

    -webkit-transform-origin: left center;

    -o-transform-origin: left center;

    transform-origin: left center; } }



@keyframes zoomOutLeft { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);

    transform: scale(0.1) translate3d(-2000px, 0, 0);

    -webkit-transform-origin: left center;

    -o-transform-origin: left center;

    transform-origin: left center; } }



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



@-webkit-keyframes zoomOutRight { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);

    transform: scale(0.1) translate3d(2000px, 0, 0);

    -webkit-transform-origin: right center;

    transform-origin: right center; } }



@-o-keyframes zoomOutRight { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);

    transform: scale(0.1) translate3d(2000px, 0, 0);

    -webkit-transform-origin: right center;

    -o-transform-origin: right center;

    transform-origin: right center; } }



@keyframes zoomOutRight { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); }

  to { opacity: 0;

    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);

    transform: scale(0.1) translate3d(2000px, 0, 0);

    -webkit-transform-origin: right center;

    -o-transform-origin: right center;

    transform-origin: right center; } }



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



@-webkit-keyframes zoomOutUp { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  to { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    -webkit-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@-o-keyframes zoomOutUp { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  to { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    -webkit-transform-origin: center bottom;

    -o-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



@keyframes zoomOutUp { 40% { opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }

  to { opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    -webkit-transform-origin: center bottom;

    -o-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }



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



@-webkit-keyframes slideInDown { 0% { -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@-o-keyframes slideInDown { 0% { -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@keyframes slideInDown { 0% { -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



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



@-webkit-keyframes slideInLeft { 0% { -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@-o-keyframes slideInLeft { 0% { -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@keyframes slideInLeft { 0% { -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



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



@-webkit-keyframes slideInRight { 0% { -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@-o-keyframes slideInRight { 0% { -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@keyframes slideInRight { 0% { -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



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



@-webkit-keyframes slideInUp { 0% { -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@-o-keyframes slideInUp { 0% { -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



@keyframes slideInUp { 0% { -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

    visibility: visible; }

  to { -webkit-transform: translateZ(0);

    transform: translateZ(0); } }



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



@-webkit-keyframes slideOutDown { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0); } }



@-o-keyframes slideOutDown { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0); } }



@keyframes slideOutDown { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0); } }



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



@-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(-100%, 0, 0);

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



@-o-keyframes slideOutLeft { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(-100%, 0, 0);

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



@keyframes slideOutLeft { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(-100%, 0, 0);

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



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



@-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0); } }



@-o-keyframes slideOutRight { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0); } }



@keyframes slideOutRight { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0); } }



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



@-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(0, -100%, 0);

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



@-o-keyframes slideOutUp { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(0, -100%, 0);

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



@keyframes slideOutUp { 0% { -webkit-transform: translateZ(0);

    transform: translateZ(0); }

  to { visibility: hidden;

    -webkit-transform: translate3d(0, -100%, 0);

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



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







.hideScroll { overflow: hidden; }



/*--SmartFabric头部--*/

.SmartFabric .header { position: fixed; background: #fff; left: 0px; top: 0px; right: 0px; padding: 10px 15px; border-bottom: 1px solid #eee; }



.SmartFabric .header a.logo { display: block; float: left; }



.SmartFabric .header a.logo img { display: block; height: 39px; }



.SmartFabric .header a.logo img.logoPc { display: none; }



.SmartFabric .header a.logo img.logoM { display: block; }



.SmartFabric .header .header-btn { float: right; padding-top: 5px; position: static; }



.SmartFabric .header .header-btn a { display: inline-block; vertical-align: middle; width: 36px; height: 30px; -webkit-border-radius: 50%; border-radius: 50%; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; }



.SmartFabric .header .header-btn a.SF_searchBtn { background: url(../images/SmartFabric_02.png) no-repeat center 3px; }



.SmartFabric .header .header-btn a.SF_navbtn { padding: 6px 4px 0; margin-left: 10px; }



.SmartFabric .header .header-btn a.SF_navbtn span { position: relative; display: block; width: 100%; height: 2px; margin: 0px 0px 6px; background: #000; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; }



.SmartFabric .header .header-btn a.SF_navbtn span:nth-child(2) { width: 70%; }



.SmartFabric .header .header-btn a.SF_navClosebtn span:nth-child(1) { top: 8px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }



.SmartFabric .header .header-btn a.SF_navClosebtn span:nth-child(2) { opacity: 0; }



.SmartFabric .header .header-btn a.SF_navClosebtn span:nth-child(3) { top: -8px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }



.SmartFabric .nav { display: none; position: fixed; left: 0px; top: 60px; bottom: 0px; right: 0px; overflow-y: auto; background: #fff; }



.SmartFabric .nav ul { padding: 15px; }



.SmartFabric .nav ul li { font-size: 14px; border-bottom: 1px solid #ddd; }



.SmartFabric .nav ul li a { color: #333; display: block; line-height: 40px; }



.SmartFabric .header .headSearchbox { display: none; position: absolute; left: 0px; top: 60px; right: 0px; padding: 15px; background: #fff; }



.SmartFabric .header .headSearchbox .SearchformBox { position: relative; }



.SmartFabric .header .headSearchbox label { border: 1px solid #ddd; padding: 8px 40px 7px 15px; display: block; -webkit-border-radius: 25px; border-radius: 25px; position: relative; }



.SmartFabric .header .headSearchbox label input { background: none; outline: none; width: 100%; color: #666; font-size: 13px; }



.SmartFabric .header .headSearchbox label input::-webkit-input-placeholder { color: #666; }



.SmartFabric .header .headSearchbox label input:-moz-placeholder { color: #666; }



.SmartFabric .header .headSearchbox label input::-moz-placeholder { color: #666; }



.SmartFabric .header .headSearchbox label input:-ms-input-placeholder { color: #666; }



.SmartFabric .header .headSearchbox input.headSearchBtn { width: 35px; height: 38px; outline: none; background: url(../images/Navy_blue_temp_icon21.png) no-repeat left center; position: absolute; right: 0px; top: 0px; }



/*--SmartFabric底部--*/

.SmartFabric .footerbg { background: #11121b; padding: 40px 0px 30px; }



.SmartFabric .footer { padding-bottom: 30px; }



.SmartFabric .footer .footLogo { display: inline-block; vertical-align: middle; }



.SmartFabric .footer .footLogo img { height: 39px; }



.SmartFabric .footer .QRcode { display: inline-block; vertical-align: middle; padding-left: 10px; }



.SmartFabric .footer .QRcode a { width: 30px; height: 30px; display: block; background-size: 100%; background-image: url(../images/SmartFabric_04.png); background-repeat: no-repeat; background-position: center; background-color: rgba(255, 255, 255, 0.2); -webkit-border-radius: 100%; border-radius: 100%; }



.SmartFabric .footer .QRcode span { position: absolute; left: 40px; }



.SmartFabric .footer dd { padding-top: 30px; }



.SmartFabric .footer dd h3 { color: #fff; font-size: 16px; padding-bottom: 8px; }



.SmartFabric .footer dd p { position: relative; }



.SmartFabric .footer dd p label { display: block; border: 1px solid #3e3e46; padding: 9px 100px 9px 10px; }



.SmartFabric .footer dd p label input { width: 100%; background: none; border: none; color: #88898d; font-size: 12px; }



.SmartFabric .footer dd p input.footEmailBtn { position: absolute; background: none; border: none; border-left: 1px solid #3e3e46; right: 0px; top: 0px; bottom: 0px; width: 90px; color: #fff; font-size: 14px; }



.SmartFabric .foot { border-top: 1px solid rgba(255, 255, 255, 0.1); font-size: 14px; color: rgba(255, 255, 255, 0.5); padding-top: 30px; text-align: center; }



.SmartFabric .foot dt { padding-bottom: 10px; line-height: 24px; }



/*--头部开始--*/

.Navybluetemp .headerBox { padding-top: 60px; }



.Navybluetemp .header { position: fixed; top: 0px; left: 0px; height: 60px; background-color: #fff; width: 100%; padding: 15px 15px 0px; z-index: 9999; }



.Navybluetemp .header .logo { float: left; }



.Navybluetemp .header .logo img { height: 33px; }



.Navybluetemp .header .logo img.lglogo { display: none; }



.Navybluetemp .header .nav { display: none; position: fixed; left: 0px; top: 60px; right: 0px; bottom: 0px; background-color: #fff; overflow-y: auto; }



.Navybluetemp .header .nav ul { padding: 20px; }



.Navybluetemp .header .nav ul li { border-bottom: 1px solid #ddd; position: relative; }



.Navybluetemp .header .nav ul li > a { color: #64656d; font-size: 16px; font-weight: 700; line-height: 50px; }



.Navybluetemp .header .nav ul li span { position: absolute; height: 50px; right: 0px; width: 50%; top: 0px; display: block; }



.Navybluetemp .header .nav ul li span:after { position: absolute; top: 50%; right: 10px; width: 10px; height: 10px; border-top: 2px solid #ddd; border-right: 2px solid #ddd; -webkit-transform: translateY(-50%) rotate(45deg); -ms-transform: translateY(-50%) rotate(45deg); -o-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg); -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; content: ""; }



.Navybluetemp .header .nav ul li.cur span:after { -webkit-transform: translateY(-50%) rotate(135deg); -ms-transform: translateY(-50%) rotate(135deg); -o-transform: translateY(-50%) rotate(135deg); transform: translateY(-50%) rotate(135deg); }



.Navybluetemp .header .nav ul li:nth-child(1) { padding-left: 0px; }



.Navybluetemp .header .nav ul li p { display: none; padding: 5px 20px 10px; border-top: 1px solid #ddd; }



.Navybluetemp .header .nav ul li p a { display: block; line-height: 35px; font-size: 14px; color: #64656d; }



.Navybluetemp .header .Language { float: right; height: 30px; padding-right: 30px; border-right: 1px solid rgba(255, 255, 255, 0.2); padding-top: 4px; margin-top: 5px; display: none; }



.Navybluetemp .header .Language span { display: block; background: url(../images/Navy_blue_temp_icon02.png); width: 31px; height: 21px; }



.Navybluetemp .header .headSearchbox { display: none; position: absolute; left: 0px; top: 60px; right: 0px; padding: 15px; background: #fff; }



.Navybluetemp .header .headSearchbox .SearchformBox { position: relative; }



.Navybluetemp .header .headSearchbox label { border: 1px solid #ddd; padding: 8px 40px 7px 15px; display: block; -webkit-border-radius: 25px; border-radius: 25px; position: relative; }



.Navybluetemp .header .headSearchbox label input { background: none; outline: none; width: 100%; color: #666; font-size: 13px; }



.Navybluetemp .header .headSearchbox label input::-webkit-input-placeholder { color: #666; }



.Navybluetemp .header .headSearchbox label input:-moz-placeholder { color: #666; }



.Navybluetemp .header .headSearchbox label input::-moz-placeholder { color: #666; }



.Navybluetemp .header .headSearchbox label input:-ms-input-placeholder { color: #666; }



.Navybluetemp .header .headSearchbox input.headSearchBtn { width: 35px; height: 38px; outline: none; background: url(../images/Navy_blue_temp_icon21.png) no-repeat left center; position: absolute; right: 0px; top: 0px; }



.Navybluetemp .header-btn { float: right; }



.Navybluetemp .header-btn a { display: inline-block; vertical-align: middle; width: 36px; height: 36px; -webkit-border-radius: 50%; border-radius: 50%; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; }



.Navybluetemp .header .msearchBtn { margin-right: 10px; background: url(../images/Navy_blue_temp_icon21.png) no-repeat center 3px; }



.Navybluetemp .header .navbtn { padding: 6px 4px 0; }



.Navybluetemp .header .navbtn span { position: relative; display: block; width: 100%; height: 2px; margin: 0 auto 6px; background: #64656d; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; }



.Navybluetemp .header .navClosebtn span:nth-child(1) { top: 8px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }



.Navybluetemp .header .navClosebtn span:nth-child(2) { opacity: 0; }



.Navybluetemp .header .navClosebtn span:nth-child(3) { top: -8px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }



/*--banner图和二级导航--*/

.Navybluetemp .commonBannerbox { position: relative; }



.Navybluetemp .commonBanner { width: 100%; position: relative; }



.Navybluetemp .commonBanner img { display: block; width: 100%; }



.Navybluetemp .commonBanner p { position: absolute; left: 0px; top: 50%; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); color: #fff; text-align: center; font-size: 24px; font-weight: 700; text-transform: uppercase; }



.Navybluetemp .commonClass { width: 100%; border-bottom: 1px solid #ddd; text-align: center; position: relative; z-index: 999; }



.Navybluetemp .commonClass h3 { display: block; line-height: 45px; font-size: 16px; font-weight: 700; color: #282828; }



.Navybluetemp .commonClass ul { display: none; border-bottom: 1px solid #ddd; background: #fff; position: absolute; left: 0px; right: 0px; top: 46px; padding: 0px 0px 20px; }



.Navybluetemp .commonClass ul li { line-height: 45px; font-size: 16px; padding: 0px 20px; }



.Navybluetemp .commonClass ul li a { display: block; font-size: 14px; color: #64656d; font-weight: 700; }



.Navybluetemp .commonClass ul li.cur a { color: #282828; border-bottom: 1px solid #64656d; }



/*--共用标题--*/

.Navybluetemp .common_Title { text-align: center; padding-top: 30px; font-size: 20px; font-weight: 700; color: #282828; }



.Navybluetemp .common_Title:after { content: ''; width: 1px; height: 30px; background-color: #e60012; margin: 10px auto 0px; display: block; }



/*--文章页--*/

.Navybluetemp .details_title { padding: 25px 0px; margin-top: 20px; }



.Navybluetemp .details_title h1 { color: #3d3f48; font-size: 22px; padding: 0px 20px 0px 40px; text-align: center; }



.Navybluetemp .details_title p { color: #d41e1e; font-size: 14px; padding-top: 8px; text-align: center; }



.Navybluetemp .details_content { font-size: 14px; color: #737479; line-height: 24px; padding: 20px 0px; border-top: 1px solid #dddddd; }



.Navybluetemp .details_content img { max-width: 100%; }



.Navybluetemp .details_page { margin-top: 40px; border-top: 1px solid #3d3f48; border-bottom: 1px solid #3d3f48; }



.Navybluetemp .details_page p { border-bottom: 1px solid #dddddd; position: relative; padding: 0px 90px 0px 90px; font-size: 14px; line-height: 50px; white-space: nowrap; height: 50px; }



.Navybluetemp .details_page p span { position: absolute; left: 0px; padding-left: 10px; top: 0px; display: block; width: 75px; }



.Navybluetemp .details_page p span:after { content: ''; border-left: 5px solid transparent; border-bottom: 5px solid #000000; border-right: 5px solid transparent; position: absolute; right: 0%; width: 0px; height: 0px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }



.Navybluetemp .details_page p em { position: absolute; right: 0px; font-style: normal; top: 0px; padding-right: 0px; width: 80px; display: block; }



.Navybluetemp .details_page p a { display: block; text-overflow: ellipsis; overflow: hidden; }



.Navybluetemp .details_page p:nth-child(2) { border: none; }



.Navybluetemp .details_page p:nth-child(2) span:after { border-bottom: none; border-top: 5px solid #000000; }



.Navybluetemp .details_return { text-align: center; padding: 30px 0px; }



.Navybluetemp .details_return a { border: 1px solid #d41e1e; line-height: 40px; width: 120px; color: #3d3f48; -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; display: inline-block; letter-spacing: 3px; }



.Navybluetemp .details_return a:hover { background-color: #d41e1e; color: #fff; }



/*--产品中心--*/

.Navybluetemp .productbg { background-color: #f2f2f2; margin: 20px 0px 0px 0px; padding-top: 30px; }



.Navybluetemp .productBanner { width: 100%; overflow: hidden; position: relative; margin-top: 0px; }



.Navybluetemp .productBanner ul li { position: relative; }



.Navybluetemp .productBanner ul li img { display: block; width: 100%; }



.Navybluetemp .productBanner ul li dl { padding: 20px 0px; }



.Navybluetemp .productBanner ul li dl h3 { font-size: 16px; font-weight: 700; color: #282828; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }



.Navybluetemp .productBanner ul li dl p.desc { font-size: 20px; color: #282828; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-top: 10px; }



.Navybluetemp .productBanner ul li dl p.desc1 { font-size: 12px; color: #64656d; margin-top: 15px; }



.Navybluetemp .productBanner ul li dl p.more span { display: inline-block; width: 100px; height: 30px; text-align: center; margin-top: 15px; background-color: #fff; line-height: 30px; color: #939393; font-weight: 700; background-image: url(../images/Navy_blue_temp_icon08.png); background-repeat: no-repeat; background-position: 10% center; text-indent: 30px; }



.Navybluetemp .productClassbox { position: relative; margin: 30px 15px 0px; }



.Navybluetemp .productClassbox span { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); width: 20px; height: 20px; cursor: pointer; }



.Navybluetemp .productClassbox span:after { content: ''; border-left: 1px solid #64656d; border-bottom: 1px solid #64656d; position: absolute; top: 50%; margin-top: -7px; width: 15px; height: 15px; }



.Navybluetemp .productClassbox span.productClassPrev { left: -20px; }



.Navybluetemp .productClassbox span.productClassPrev:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); left: 5px; }



.Navybluetemp .productClassbox span.productClassNext { right: -20px; }



.Navybluetemp .productClassbox span.productClassNext:after { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); right: 5px; }



.Navybluetemp .productClass { overflow: hidden; position: relative; }



.Navybluetemp .productClass ul li { float: left; width: 20%; }



.Navybluetemp .productClass ul li a { display: block; height: 40px; font-size: 14px; color: #282828; font-weight: 700; line-height: 40px; text-align: center; text-overflow: ellipsis; white-space: nowrap; border: 1px solid #bfbfbf; -webkit-border-radius: 25px; border-radius: 25px; }



.Navybluetemp .productClass ul li a:hover { background-color: #e60012; border: 1px solid #e60012; color: #fff; }



.Navybluetemp .productClass ul li.cur a { background-color: #e60012; border: 1px solid #e60012; color: #fff; }



.Navybluetemp .productlistMain { padding: 0px 0px 60px 0px; }



.Navybluetemp .productlist { border: 2px solid #f2f2f2; background-color: #fff; margin-top: 30px; position: relative; -webkit-transition: all .4s; -o-transition: all .4s; transition: all .4s; }



.Navybluetemp .productlist dt img { display: block; margin: 0px auto; max-width: 100%; }



.Navybluetemp .productlist dd div { border-top: 2px solid #e60012; padding: 15px; background-color: #f2f2f2; position: relative; }



.Navybluetemp .productlist dd div:after { position: absolute; left: 0px; top: -2px; content: ''; width: 35%; height: 2px; background-color: #334fa9; }



.Navybluetemp .productlist dd div h3 { font-size: 16px; color: #282828; font-size: 20px; font-weight: 700; }



.Navybluetemp .productlist dd div p.desc { color: #6f7075; margin-top: 10px; font-size: 12px; display: -webkit-box; height: 36px; line-height: 18px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }



.Navybluetemp .productlist dd div p.more { padding-top: 15px; }



.Navybluetemp .productlist dd div p.more span { color: #a2a2a2; font-weight: 700; background-image: url(../images/Navy_blue_temp_icon08.png); background-repeat: no-repeat; background-position: left center; padding-left: 20px; }



.Navybluetemp .productlist:hover { border: 2px solid #e60012; -webkit-box-shadow: 0px 30px 30px rgba(40, 40, 40, 0.4); box-shadow: 0px 30px 30px rgba(40, 40, 40, 0.4); }



/*--发展历程--*/

.Navybluetemp .developmentBanner { margin-top: 20px; position: relative; }



.Navybluetemp .developmentBanner img { display: block; width: 100%; }



.Navybluetemp .developmentBanner dl { padding-left: 20px; position: relative; right: 0px; margin-top: 20px; }



.Navybluetemp .developmentBanner dl:after { content: ''; display: block; width: 5px; height: 100%; position: absolute; left: 0px; bottom: 0px; background-color: #e60012; }



.Navybluetemp .developmentBanner dl h3 { color: #64656d; font-size: 14px; }



.Navybluetemp .developmentBanner dl p { color: #282828; font-size: 18px; line-height: 24px; padding-top: 10px; }



.Navybluetemp .developmentClassfixed { min-height: 45px; }



.Navybluetemp .developmentClassbox { position: relative; margin: 40px 15px 0px; background-color: #fff; }



.Navybluetemp .developmentClassbox span { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); width: 20px; height: 20px; cursor: pointer; }



.Navybluetemp .developmentClassbox span:after { content: ''; border-left: 1px solid #64656d; border-bottom: 1px solid #64656d; position: absolute; top: 50%; margin-top: -7px; width: 15px; height: 15px; }



.Navybluetemp .developmentClassbox span.developmentPrev { left: -20px; }



.Navybluetemp .developmentClassbox span.developmentPrev:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); left: 5px; }



.Navybluetemp .developmentClassbox span.developmentNext { right: -20px; }



.Navybluetemp .developmentClassbox span.developmentNext:after { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); right: 5px; }



.Navybluetemp .developmentClassfixedTop { position: fixed !important; margin: 0px !important; z-index: 9999; left: 0px; right: 0px; top: 0px; padding: 0px 30px; margin: 0px; }



.Navybluetemp .developmentClassfixedTop span.developmentPrev { left: 5px !important; }



.Navybluetemp .developmentClassfixedTop span.developmentNext { right: 5px !important; }



.Navybluetemp .developmentClass { width: 100%; position: relative; overflow: hidden; border-left: 1px solid #e5e5e5; }



.Navybluetemp .developmentClass ul li { float: left; width: 25%; }



.Navybluetemp .developmentClass ul li a { display: block; height: 45px; line-height: 45px; font-size: 16px; text-align: center; border: 1px solid #e5e5e5; border-left: none; }



.Navybluetemp .developmentClass ul li.cur a { border-bottom: none; }



.Navybluetemp .developmentClass ul li:hover a { border-bottom: none; }



.Navybluetemp .development dl { padding: 20px 0px; border-bottom: 1px solid #e3e3e3; }



.Navybluetemp .development dt { font-size: 28px; color: #213f95; }



.Navybluetemp .development dt span { position: relative; padding-right: 60px; }



.Navybluetemp .development dd { padding-top: 15px; padding-bottom: 15px; }



.Navybluetemp .development dd div.developmentContent { position: relative; padding-left: 68px; padding-bottom: 15px; }



.Navybluetemp .development dd div.developmentContent p { font-size: 14px; color: #424856; line-height: 24px; }



.Navybluetemp .development dd div.developmentContent span.num { width: 68px; position: absolute; left: 0px; font-size: 18px; color: #424856; top: 0px; text-align: center; padding-left: 9px; }



.Navybluetemp .development dd div.developmentContent span.num:after { width: 9px; height: 9px; content: ''; display: block; position: absolute; left: 0px; top: 7px; background-color: #d2d2d2; -webkit-border-radius: 100%; border-radius: 100%; }



.Navybluetemp .development dd div.developmentContent:before { top: 9px; bottom: -10px; content: ''; display: block; left: 4px; width: 1px; background-color: #d2d2d2; position: absolute; }



.Navybluetemp .development dd div.developmentContent:last-child { padding-bottom: 0px; }



.Navybluetemp .development dd div.developmentContent:last-child:before { display: none; }



.Navybluetemp .development dd div.developmentContent:hover span.num:after { background-color: #e60012; }



.Navybluetemp .development dl:last-child { border-bottom: none; }



/*--团队--*/

.Navybluetemp .teamBanner { width: 100%; position: relative; margin-top: 20px; }



.Navybluetemp .teamBanner img { width: 100%; display: block; }



.Navybluetemp .teamBanner dl { padding-left: 30px; position: relative; margin-top: 20px; }



.Navybluetemp .teamBanner dl:after { content: ''; display: block; width: 5px; height: 100%; position: absolute; left: 0px; top: 0px; background-color: #e60012; }



.Navybluetemp .teamBanner dl h3 { color: rgba(35, 31, 24, 0.8); font-size: 16px; }



.Navybluetemp .teamBanner dl p.desc { color: #d26720; font-size: 20px; line-height: 24px; padding-top: 8px; }



.Navybluetemp .teamBanner dl p.desc1 { color: rgba(40, 40, 40, 0.6); font-size: 14px; line-height: 20px; padding-top: 15px; }



.Navybluetemp .teamListbox { padding: 20px 0px 60px; }



.Navybluetemp .teamList { padding-top: 40px; }



.Navybluetemp .teamList .bigimg { position: relative; overflow: hidden; }



.Navybluetemp .teamList .bigimg img { display: block; width: 100%; -webkit-transition: all .8s ease-in-out; -o-transition: all .8s ease-in-out; transition: all .8s ease-in-out; -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); }



.Navybluetemp .teamList .bigimg p { position: absolute; display: none; left: 50px; right: 50px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); color: #fff; font-size: 14px; line-height: 24px; z-index: 99; text-align: center; }



.Navybluetemp .teamList .bigimg:after { position: absolute; display: block; left: 0px; top: 0px; bottom: 0px; right: 0px; background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(#e60012)); background: -o-linear-gradient(top, rgba(255, 255, 255, 0), #e60012); background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #e60012); }



.Navybluetemp .teamList .Name { text-align: center; font-size: 20px; font-weight: 700; color: #282828; padding-top: 20px; }



.Navybluetemp .teamList .positionName { color: rgba(40, 40, 40, 0.6); text-align: center; font-size: 14px; padding-top: 10px; }



.Navybluetemp .teamList:hover .bigimg p { display: block; }



.Navybluetemp .teamList:hover .bigimg:after { content: ''; }



.Navybluetemp .teamList:hover .bigimg img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); }



/*--解决方案--*/

.Navybluetemp .solutionBanner { width: 100%; position: relative; margin-top: 20px; border-bottom: 1px solid #e8e8e8; }



.Navybluetemp .solutionBanner img { width: 100%; display: block; }



.Navybluetemp .solutionBanner dl { padding: 20px 0px; }



.Navybluetemp .solutionBanner dl dt { color: #3d3f48; font-size: 18px; padding-bottom: 15px; }



.Navybluetemp .solutionBanner dl dd { font-size: 14px; color: #737479; }



.Navybluetemp .solutionListBox { padding: 0px 0px 50px; }



.Navybluetemp .solutionListTitle { text-align: center; padding-top: 30px; font-size: 20px; font-weight: 700; color: #282828; }



.Navybluetemp .solutionList { position: relative; padding-top: 30px; }



.Navybluetemp .solutionList img { width: 100%; display: block; }



.Navybluetemp .solutionListContent { background-color: #fff; padding: 20px 10px 0px; position: relative; z-index: 9; }



.Navybluetemp .solutionListContent h3 { font-size: 16px; font-weight: 700; color: #3d3f48; }



.Navybluetemp .solutionListContent p { font-size: 14px; color: #737479; line-height: 24px; padding-top: 10px; }



.Navybluetemp .applicationbg { background: url(../images/Navy_blue_temp_img08.jpg) no-repeat center; background-size: cover; padding: 30px 0px; }



.Navybluetemp .applicationTitle { text-align: center; padding: 0px 0px 50px; font-size: 20px; font-weight: 700; color: #FFF; }



.Navybluetemp .application { padding: 15px 0px; }



.Navybluetemp .application img { display: block; margin: 0px auto; max-width: 70%; border: 1px solid rgba(255, 255, 255, 0.3); -webkit-border-radius: 100%; border-radius: 100%; }



.Navybluetemp .application h3 { font-size: 14px; color: #fff; font-weight: 700; text-align: center; padding-top: 15px; }



.Navybluetemp .application:hover img { background-color: #d41e1e; border: 1px solid #d41e1e; }



.Navybluetemp .applicationbg ul li:nth-child(4n) { clear: left; }



.Navybluetemp .solutionList2 { padding: 0px 0px 30px; }



.Navybluetemp .solutionList2 dl dt { padding: 0px; }



.Navybluetemp .solutionList2 dl dt img { display: block; width: 100%; }



.Navybluetemp .solutionList2 dl dd { padding: 0px; }



.Navybluetemp .solutionListText { padding: 15px; }



.Navybluetemp .solutionListText p.num { font-size: 30px; color: #d41e1e; }



.Navybluetemp .solutionListText p.num:after { content: ''; width: 30px; height: 2px; background: #c2c2c2; display: block; }



.Navybluetemp .solutionListText h3 { padding-top: 10px; font-size: 20px; color: #3d3f48; }



.Navybluetemp .solutionListText p.desc { font-size: 14px; color: #737479; line-height: 24px; margin-top: 5px; }



/*--联系我们--*/

.Navybluetemp .contactDesc { font-size: 16px; color: #282828; line-height: 24px; text-align: center; padding-top: 20px; }



.Navybluetemp .contact { text-align: center; padding: 0px 0px 20px; }



.Navybluetemp .contact img { display: block; max-width: 100%; margin: 0px auto; }



.Navybluetemp .contact h3 { font-size: 16px; color: #141d29; padding-top: 10px; }



.Navybluetemp .contact p { padding-top: 10px; color: #141d29; font-size: 13px; }



.Navybluetemp .contactbox { padding: 45px 0px; }



.Navybluetemp .contactbox ul li { position: relative; }



.Navybluetemp .contactbox ul li:last-child:after { display: none; }



.Navybluetemp #dituContent { width: 100%; height: 500px; }



.Navybluetemp .iw_poi_title { color: #CC5522; font-size: 14px; font-weight: bold; overflow: hidden; padding-right: 13px; white-space: nowrap; }



.Navybluetemp .iw_poi_content { font: 12px arial,sans-serif; overflow: visible; padding-top: 4px; white-space: -moz-pre-wrap; word-wrap: break-word; }



/*--组织架构--*/

.Navybluetemp .organization { background: url(../images/Navy_blue_temp_icon18.png) no-repeat center top; background-size: 100%; margin-top: 20px; padding-bottom: 70px; }



.Navybluetemp .organization img { max-width: 100%; display: block; margin: 0px auto; }



/*--招聘--*/

.Navybluetemp .RecruitmentHead { background: url(../images/Navy_blue_temp_icon19.png) repeat-x bottom; padding-bottom: 17px; margin-top: 20px; }



.Navybluetemp .RecruitmentHead dt { font-size: 18px; color: #323232; font-weight: 700; padding-bottom: 10px; }



.Navybluetemp .RecruitmentHead .RecruitmentHeadSearch { position: relative; }



.Navybluetemp .RecruitmentHead .RecruitmentHeadSearch label { border: 1px solid #e5e5e5; display: block; padding: 12px 60px 12px 20px; }



.Navybluetemp .RecruitmentHead .RecruitmentHeadSearch label input { width: 100%; background: none; outline: none; color: #323232; font-size: 13px; }



.Navybluetemp .RecruitmentHead .RecruitmentHeadSearch input.RecruitmentHeadSearchBtn { background: url(../images/Navy_blue_temp_icon01.png) no-repeat center #d30006; position: absolute; right: 0px; top: 0px; width: 47px; height: 47px; border: 1px solid #e5e5e5; }



.RecruitmentBox { padding: 0px 0px 100px; }



.RecruitmentBox ul li { margin-top: 10px; }



.Navybluetemp .RecruitmentPosition { border: 1px solid #e5e5e5; padding: 25px 30px; overflow: hidden; cursor: pointer; }



.Navybluetemp .RecruitmentPosition span { display: block; float: left; height: 26px; line-height: 26px; }



.Navybluetemp .RecruitmentPosition span.name { color: #323232; font-size: 14px; width: 25%; font-weight: 700; }



.Navybluetemp .RecruitmentPosition span.num { width: 25%; font-size: 14px; color: #929292; display: none; }



.Navybluetemp .RecruitmentPosition span.time { background: url(../images/Navy_blue_temp_icon20.png) no-repeat left center; padding-left: 30px; display: none; }



.Navybluetemp .RecruitmentPosition span.btn { float: right; position: relative; width: 26px; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; }



.Navybluetemp .RecruitmentPosition span.btn:after { width: 100%; height: 1px; background-color: #bfbfbf; content: ''; position: absolute; top: 50%; left: 0px; }



.Navybluetemp .RecruitmentPosition span.btn:before { width: 1px; height: 100%; background-color: #bfbfbf; content: ''; position: absolute; top: 0; left: 50%; }



.Navybluetemp .RecruitmentInfo { padding: 30px 40px; font-size: 13px; color: #a7a7a7; line-height: 22px; display: none; }



.Navybluetemp .RecruitmentInfo h3.title { color: #282828; font-size: 18px; font-weight: 700; }



.Navybluetemp .RecruitmentBox ul li.cur .RecruitmentPosition { background-color: #f9f9f9; }



.Navybluetemp .RecruitmentBox ul li.cur .RecruitmentPosition span.name { color: #d30006; }



.Navybluetemp .RecruitmentBox ul li.cur .RecruitmentPosition span.btn { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }



.Navybluetemp .RecruitmentBox ul li.cur .RecruitmentPosition span.btn:after { background-color: #d30006; }



.Navybluetemp .RecruitmentBox ul li.cur .RecruitmentPosition span.btn:before { background-color: #d30006; }



/*--底部--*/

.Navybluetemp .footer { background-color: #2a292f; padding-top: 40px; }



.Navybluetemp .footer_address dt img { max-width: 100%; display: block; }



.Navybluetemp .footer_address dd { color: #bdbdbe; font-size: 14px; padding-top: 17px; line-height: 24px; }



.Navybluetemp .footer_address dd div.share { padding-top: 20px; }



.Navybluetemp .footer_address dd div.share a { display: inline-block; width: 24px; height: 24px; margin: 0px 6px 0px 0px; padding: 0px; background-repeat: no-repeat; }



.Navybluetemp .footer_address dd div.share a.wx { background-image: url(../images/Navy_blue_temp_icon03.png); }



.Navybluetemp .footer_address dd div.share a.wb { background-image: url(../images/Navy_blue_temp_icon04.png); }



.Navybluetemp .footer_address dd div.share a.fbook { background-image: url(../images/Navy_blue_temp_icon05.png); }



.Navybluetemp .footer_address dd div.share a.twi { background-image: url(../images/Navy_blue_temp_icon06.png); }



.Navybluetemp .footer_class { padding-top: 27px; }



.Navybluetemp .footer_class li h3 { color: #ffffff; padding: 15px 0px; border-bottom: 1px solid #fff; position: relative; }



.Navybluetemp .footer_class li h3:before { position: absolute; top: 50%; right: 10px; width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: translateY(-50%) rotate(45deg); -ms-transform: translateY(-50%) rotate(45deg); -o-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg); -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; content: ""; }



.Navybluetemp .footer_class li h3.cur:before { -webkit-transform: translateY(-50%) rotate(135deg); -ms-transform: translateY(-50%) rotate(135deg); -o-transform: translateY(-50%) rotate(135deg); transform: translateY(-50%) rotate(135deg); }



.Navybluetemp .footer_class li p { display: none; padding: 10px; border-bottom: 1px solid #fff; }



.Navybluetemp .footer_class li p a { display: block; color: rgba(255, 255, 255, 0.3); line-height: 30px; }



.Navybluetemp .footer_class li p a:hover { color: #fff; }



.Navybluetemp .foot { border-top: 1px solid rgba(255, 255, 255, 0.1); margin-top: 30px; }



.Navybluetemp .foot dl { padding: 15px; }



.Navybluetemp .foot dl dt { color: rgba(255, 255, 255, 0.3); padding-top: 10px; text-align: center; }



.Navybluetemp .foot dl dd { display: none; position: relative; }



.Navybluetemp .foot dl dd h3 { width: 180px; border: 1px solid #626262; cursor: pointer; line-height: 40px; padding-left: 20px; position: relative; color: rgba(255, 255, 255, 0.6); font-size: 12px; }



.Navybluetemp .foot dl dd h3 span { position: absolute; right: 0px; width: 40px; height: 40px; top: 0px; border-left: 1px solid #626262; }



.Navybluetemp .foot dl dd h3 span:after { content: ''; display: block; position: absolute; left: 50%; top: 50%; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; -webkit-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); -o-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); width: 7px; height: 7px; border-right: 1px solid #bfbfbf; border-bottom: 1px solid #bfbfbf; }



.Navybluetemp .foot dl dd h3.cur span:after { -webkit-transform: translate(-50%, -50%) rotate(-135deg); -ms-transform: translate(-50%, -50%) rotate(-135deg); -o-transform: translate(-50%, -50%) rotate(-135deg); transform: translate(-50%, -50%) rotate(-135deg); }



.Navybluetemp .foot dl dd p { position: absolute; bottom: 41px; right: 0px; left: 0px; border: 1px solid #626262; background-color: rgba(255, 255, 255, 0.6); max-height: 200px; overflow-y: auto; display: none; }



.Navybluetemp .foot dl dd p a { display: block; line-height: 35px; font-size: 12px; padding-left: 20px; }



.Navybluetemp .page { text-align: center; padding-top: 70px; }



.Navybluetemp .page a { display: inline-block; width: 140px; text-align: center; color: #282828; line-height: 40px; font-size: 14px; border: 1px solid #bfbfbf; -webkit-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out; }



.Navybluetemp .page a:hover { background-color: #e60012; border: 1px solid #e60012; color: #fff; font-weight: 700; }



/*--公司简介--*/

.Navybluetemp .companyIntroBox { position: relative; margin: 20px 0px 0px; }



.Navybluetemp .companyIntroBox img.bigimg { width: 100%; display: block; }



.Navybluetemp .companyIntroBox dl dt { background: #213f95; padding: 20px; }



.Navybluetemp .companyIntroBox dl dt h3 { font-weight: 700; font-size: 16px; color: rgba(255, 255, 255, 0.6); }



.Navybluetemp .companyIntroBox dl dt p.desc1 { font-size: 20px; color: #fff; line-height: 30px; margin-top: 5px; }



.Navybluetemp .companyIntroBox dl dt p.desc2 { font-size: 14px; color: rgba(255, 255, 255, 0.4); line-height: 24px; margin-top: 5px; }



.Navybluetemp .companyIntroDesc { padding: 20px 10px; position: relative; color: #64656d; font-size: 14px; line-height: 24px; z-index: 8; }



.Navybluetemp .companyIntroNumbg { background: url(../images/Navy_blue_temp_img11.png) no-repeat center; padding: 60px 0px; }



.Navybluetemp .companyIntroNum { padding: 20px 0px; text-align: center; border: 1px solid transparent; }



.Navybluetemp .companyIntroNum h3 { font-size: 16px; color: rgba(40, 40, 40, 0.6); font-weight: 700; }



.Navybluetemp .companyIntroNum h3:after { height: 2px; background-color: #e60012; width: 30px; margin: 15px auto 0px; content: ''; display: block; }



.Navybluetemp .companyIntroNum p { font-size: 50px; color: #3f3e43; }



.Navybluetemp .companyIntroNum:hover { border: 1px solid #e0e3e8; }



.Navybluetemp .companyIntroNum:hover p { color: #e60012; }



.Navybluetemp .companyIntroFoot { background: url(../images/Navy_blue_temp_img12.jpg) no-repeat center; background-size: cover; text-align: center; min-height: 600px; padding-top: 200px; }



.Navybluetemp .companyIntroFoot p { color: #fff; position: relative; z-index: 9; }



.Navybluetemp .companyIntroFoot p.desc { font-size: 30px; }



.Navybluetemp .companyIntroFoot p.desc1 { font-size: 48px; font-weight: 700; }



/*--荣誉资质--*/

.Navybluetemp .qualificationsbox { padding: 0px 0px 50px; }



.Navybluetemp .qualifications { text-align: center; padding: 20px 0px; position: relative; }



.Navybluetemp .qualifications p { width: 100%; padding: 10px 10px; border: 1px solid #d2d2d2; }



.Navybluetemp .qualifications p span { min-height: 140px; width: 100%; position: relative; display: block; overflow: hidden; border: 1px solid #d8d8d8; }



.Navybluetemp .qualifications p img { display: block; max-height: 100%; -webkit-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); -webkit-transition: all .8s ease-in-out; -o-transition: all .8s ease-in-out; transition: all .8s ease-in-out; position: absolute; left: 50%; top: 50%; }



.Navybluetemp .qualifications:hover p img { -webkit-transform: translate(-50%, -50%) scale(1.1); -ms-transform: translate(-50%, -50%) scale(1.1); -o-transform: translate(-50%, -50%) scale(1.1); transform: translate(-50%, -50%) scale(1.1); }



.Navybluetemp .qualifications h3 { font-size: 14px; color: #282828; padding-top: 20px; }



.Navybluetemp .qualificationsLine { padding: 0px 10px; clear: left; }



.Navybluetemp .qualificationsLine:after { display: block; content: ''; height: 1px; background-color: #d2d2d2; }



.zoomify { cursor: pointer; cursor: -webkit-zoom-in; cursor: zoom-in; }



.zoomify.zoomed { cursor: -webkit-zoom-out; cursor: zoom-out; padding: 0; margin: 0; border: none; -webkit-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; position: relative; z-index: 1501; }



.zoomify-shadow { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; display: block; z-index: 1500; background: rgba(0, 0, 0, 0.3); opacity: 0; }



.zoomify-shadow.zoomed { opacity: 1; cursor: pointer; cursor: -webkit-zoom-out; cursor: zoom-out; }



/*--员工活动--*/

.Navybluetemp .staffbox { overflow: hidden; padding: 0px 80px; margin: 20px 0px 60px; position: relative; }



.Navybluetemp .staffbox span { position: absolute; top: 0px; bottom: 50px; width: 40px; cursor: pointer; background-color: #fff; z-index: 91; }



.Navybluetemp .staffbox span:after { position: absolute; width: 12px; height: 12px; border-bottom: 1px solid #333333; border-left: 1px solid #333333; content: ''; top: 50%; left: 50%; margin-left: -6px; margin-top: -6px; }



.Navybluetemp .staffbox span.staffPrev { left: 40px; }



.Navybluetemp .staffbox span.staffPrev:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }



.Navybluetemp .staffbox span.staffNext { right: 40px; }



.Navybluetemp .staffbox span.staffNext:after { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); }



.Navybluetemp .staff { width: 100%; position: relative; }



.Navybluetemp .staff img { width: 100%; display: block; }



.Navybluetemp .staff p { text-align: center; height: 40px; line-height: 40px; font-size: 16px; margin-top: 10px; text-overflow: ellipsis; overflow: hidden; }



/*--新闻列表--*/

.Navybluetemp .newsListBg { background-color: #f2f2f2; margin: 20px 0px 0px; padding: 30px 0px 50px 0px; }



.Navybluetemp .newsBanner { overflow: hidden; position: relative; }



.Navybluetemp .newsBanner dl { background-color: #323846; padding-bottom: 40px; }



.Navybluetemp .newsBanner dl dt img { width: 100%; display: block; }



.Navybluetemp .newsBanner dl dd { padding: 20px 15px; top: 0px; }



.Navybluetemp .newsBanner dl dd p.time { color: #e60012; font-size: 14px; }



.Navybluetemp .newsBanner dl dd h3 { font-size: 18px; color: #fff; margin-top: 8px; }



.Navybluetemp .newsBanner dl dd p.desc { font-size: 14px; color: rgba(255, 255, 255, 0.6); line-height: 24px; margin-top: 10px; /* display: -webkit-box; height: 48px; line-height: 24px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2;*/ }



.Navybluetemp .newsBannerDot { position: absolute; right: 0px; width: 100%; text-align: center; z-index: 99; bottom: 20px; padding-left: 0px; }



.Navybluetemp .newsBannerDot span { width: 6px; height: 6px; -webkit-border-radius: 0px; border-radius: 0px; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; background-color: #70747d; margin: 0px 3px; }



.Navybluetemp .newsBannerDot span.swiper-pagination-bullet-active { width: 20px; background-color: #e60012; }



.Navybluetemp .newsSearch { padding-top: 20px; }



.Navybluetemp .newsScreen { padding-top: 10px; padding-bottom: 10px; }



.Navybluetemp .newsScreen a { font-size: 14px; font-weight: 700; color: #b6b9c0; margin-left: 20px; }



.Navybluetemp .newsScreen a:first-child { margin-left: 0px; }



.Navybluetemp .newsScreen a.cur { color: #323846; }



.Navybluetemp .newsSearchBox { position: relative; }



.Navybluetemp .newsSearchBox label { border: 1px solid #c6c7cb; background: #e0dfe5; padding: 12px 130px 12px 10px; display: block; }



.Navybluetemp .newsSearchBox label input { width: 100%; background: none; }



.Navybluetemp .newsSearchBox input.newsSearchBtn { position: absolute; right: 0px; top: 0px; width: 120px; bottom: 0px; background: url(../images/Navy_blue_temp_icon22.png) no-repeat center #323846; }



.Navybluetemp .newListbox { margin-top: 20px; margin-bottom: 20px; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; }



.Navybluetemp .newListimg { position: relative; overflow: hidden; }



.Navybluetemp .newListimg span { position: absolute; z-index: 99; display: block; left: 0px; top: 0px; right: 0px; bottom: 0px; background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), #e60012); -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; opacity: 0; filter: alpha(opacity=0); }



.Navybluetemp .newListimg span:after { position: absolute; top: 50%; left: 50%; width: 1px; margin-top: -40px; height: 80px; content: ''; background-color: #fff; }



.Navybluetemp .newListimg span:before { position: absolute; top: 50%; left: 50%; margin-left: -40px; width: 80px; height: 1px; content: ''; background-color: #fff; }



.Navybluetemp .newListimg img { display: block; width: 100%; -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transition: all .8s ease-in-out; -o-transition: all .8s ease-in-out; transition: all .8s ease-in-out; }



.Navybluetemp .newListTitle { background-color: #fff; padding: 15px; }



.Navybluetemp .newListTitle h3 { font-size: 16px; color: #3c3f46; display: -webkit-box; height: 48px; line-height: 24px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }



.Navybluetemp .newListTitle p { color: #e60012; font-size: 16px; padding-top: 8px; }



.Navybluetemp .newListbox:hover { -webkit-box-shadow: 0px 10px 20px rgba(87, 105, 127, 0.4); box-shadow: 0px 10px 20px rgba(87, 105, 127, 0.4); }



.Navybluetemp .newListbox:hover .newListimg span { opacity: 1; filter: alpha(opacity=100); }



.Navybluetemp .newListbox:hover .newListimg img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); }



/*--图片入场效果--*/

.Navybluetemp .ImgAdmission { position: relative; overflow: hidden; }



.Navybluetemp .ImgAdmission:after { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 1; -webkit-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out; display: block; content: ''; background-color: #2a292f; }



.Navybluetemp .goAway:after { left: 101%; }



/*--产品详情--*/

.Navybluetemp .productMain { padding-top: 40px; }



.Navybluetemp .productImgbox { position: relative; }



.Navybluetemp .productBigImg { overflow: hidden; position: relative; }



.Navybluetemp .productBigImg img { display: block; width: 100%; }



.Navybluetemp .productSmallImg { z-index: 99; max-width: 320px; margin: 0px auto; }



.Navybluetemp .productSmallImg ul li { padding: 20px 0px; float: left; width: 33.3333%; }



.Navybluetemp .productSmallImg ul li img { max-width: 100%; display: block; margin: 0px auto; -webkit-border-radius: 6px; border-radius: 6px; border: 3px solid #dcdcdc; cursor: pointer; }



.Navybluetemp .productSmallImg ul li.cur img { border: 3px solid #e60012; }



.Navybluetemp .productInfo { padding: 0px; }



.Navybluetemp .productInfo .class { font-size: 16px; padding: 20px 0px 5px; }



.Navybluetemp .productInfo .Title { font-size: 22px; padding: 0px 0px 15px; font-weight: 700; color: #e60012; border-bottom: 1px solid #e3e3e3; }



.Navybluetemp .productInfo .subTitle { font-size: 20px; padding: 15px 0px; color: #333333; }



.Navybluetemp .productInfo .desc { font-size: 14px; color: #696969; line-height: 24px; }



.Navybluetemp .productInfo .buybtn { padding-top: 20px; }



.Navybluetemp .productInfo .buybtn a { display: inline-block; width: 30%; text-align: center; color: #282828; line-height: 40px; font-size: 14px; border: 1px solid #bfbfbf; margin-right: 10px; }



.Navybluetemp .productInfo .buybtn a.buy { background-color: #e60012; border: 1px solid #e60012; color: #fff; font-weight: 700; }



.Navybluetemp .productTabClass { border: 1px solid #e5e5e5; line-height: 52px; margin-top: 30px; text-align: center; }



.Navybluetemp .productTabClass span { display: inline-block; color: #b4b4b4; cursor: pointer; margin: 0px 1%; position: relative; }



.Navybluetemp .productTabClass span.cur { color: #282828; }



.Navybluetemp .productTabClass span.cur:after { left: 0px; right: 0px; content: ''; position: absolute; display: block; top: -1px; height: 3px; background: #e60012; }



.Navybluetemp .productDetail { padding: 30px 0px; font-size: 14px; line-height: 30px; }



.Navybluetemp .productDetail .title { font-size: 18px; color: #333333; font-weight: 700; text-align: center; }



.Navybluetemp .productDetail .subTitle { color: #9a9a9a; font-size: 24px; text-align: center; padding: 20px 0px 25px; }



.Navybluetemp .productDetail img { max-width: 100%; }



.Navybluetemp .productDetaildesc { position: relative; margin-top: 20px; padding-bottom: 10px; }



.Navybluetemp .productDetaildesc ul { position: relative; z-index: 99; }



.Navybluetemp .productDetaildesc ul li { padding-bottom: 20px; }



.Navybluetemp .productDetaildesc ul li p.num { border: 1px solid #efefef; margin: 0px auto; width: 105px; height: 105px; background: #fff; -webkit-border-radius: 100%; border-radius: 100%; position: relative; }



.Navybluetemp .productDetaildesc ul li p.num span { width: 65px; height: 65px; background: #e60012; color: #fff; display: block; -webkit-border-radius: 100%; border-radius: 100%; text-align: center; font-size: 18px; line-height: 65px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out; }



.Navybluetemp .productDetaildesc ul li h3 { color: #282828; font-size: 16px; text-align: center; padding-top: 18px; }



.Navybluetemp .productDetaildesc ul li p.desc { font-size: 14px; line-height: 24px; display: -webkit-box; height: 72px; line-height: 24px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; color: #929292; margin-top: 10px; text-align: center; }



.Navybluetemp .productDetaildesc ul li:hover p.num span { -webkit-box-shadow: -4px 5px 11px -4px #45bd96, 4px 5px 12px -5px #40a7d9; box-shadow: -4px 5px 11px -4px #45bd96, 4px 5px 12px -5px #40a7d9; }



.Navybluetemp .Imgtextbox dl { position: relative; }



.Navybluetemp .Imgtextbox dl dt { padding: 0px; position: relative; }



.Navybluetemp .Imgtextbox dl dt img { width: 100%; display: block; }



.Navybluetemp .ImgtextContent { padding: 15px 10px; }



.Navybluetemp .ImgtextContent h3 { font-size: 22px; color: #282828; line-height: 36px; }



.Navybluetemp .ImgtextContent h3:after { display: block; width: 30px; height: 3px; background-color: #e60012; content: ''; margin-top: 10px; }



.Navybluetemp .ImgtextContent p { color: #969696; font-size: 14px; padding-top: 10px; line-height: 24px; }



.Navybluetemp .ProductsParameter { padding-top: 40px; }



.Navybluetemp .ProductsParameter h3.title { background-color: #e60012; color: #fff; height: 50px; position: relative; line-height: 50px; text-align: left; padding-left: 20px; font-size: 18px; font-weight: 700; }



.Navybluetemp .ProductsParameter h3.title a { position: absolute; right: 10px; font-size: 14px; color: #fff; font-weight: 700; background: url(../images/Navy_blue_temp_img23.png) no-repeat left center; padding-left: 40px; }



.Navybluetemp .ProductsParameterDesc { font-size: 14px; line-height: 28px; color: #696969; padding: 20px; }



.Navybluetemp .ProductsRelatedNews { background-color: #e5e5eb; margin-top: 30px; padding: 30px 0px; }



.Navybluetemp .ProductsRelatedNews h3.title { font-size: 18px; color: #333333; font-weight: 700; text-align: center; padding-bottom: 0px; }



.Navybluetemp .ProductsVideo { padding: 30px 0px; }



.Navybluetemp .ProductsVideo h3.title { font-size: 18px; color: #333333; font-weight: 700; text-align: center; padding-bottom: 0px; }



.Navybluetemp .ProductsVideo p { margin-top: 20px; position: relative; cursor: pointer; }



.Navybluetemp .ProductsVideo p img { max-width: 100%; display: block; }



.Navybluetemp .ProductsVideo p span { position: absolute; bottom: 20px; left: 20px; width: 60px; height: 60px; border: 4px solid #e60012; }



.Navybluetemp .ProductsVideo p span:after { position: absolute; left: 50%; top: 50%; content: ''; display: block; width: 0px; height: 0px; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-bottom: 8px solid transparent; border-top: 8px solid transparent; border-left: 16px solid #e60012; }



.Navybluetemp .RelatedProductsbox { position: relative; padding-bottom: 60px; }



.Navybluetemp .RelatedProductsbox:after { position: absolute; left: 0px; right: 0px; content: ''; background-color: #e60012; bottom: 0px; height: 50%; z-index: 1; }



.Navybluetemp .RelatedProductsbox h3.title { font-size: 18px; color: #333333; font-weight: 700; text-align: center; padding-bottom: 20px; }



.Navybluetemp .RelatedProducts { overflow: hidden; position: relative; z-index: 99; }



.Navybluetemp .RelatedProducts ul li { float: left; width: 33.3333%; position: relative; }



.Navybluetemp .RelatedProducts ul li img { width: 100%; display: block; }



.Navybluetemp .RelatedProducts ul li p { position: absolute; left: 0px; bottom: 10px; right: 0px; padding: 10px; font-size: 16px; color: #282828; text-align: center; }



.Navybluetemp .RelatedProductsDot { text-align: center; padding-top: 20px; position: relative; z-index: 99; }



.Navybluetemp .RelatedProductsDot span { background-color: #000000; width: 6px; height: 6px; margin: 0px 3px; }



.Navybluetemp .RelatedProductsDot span.swiper-pagination-bullet-active { background-color: #fff; }



/*--弹窗视频播放器--*/

.Navybluetemp .videoPopBoX { position: fixed; z-index: 9999; left: 0px; top: 0px; bottom: 0px; right: 0px; background-color: rgba(0, 0, 0, 0.7); display: none; }



.Navybluetemp .videoPop { position: absolute; left: 0px; right: 0px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }



.Navybluetemp .videoPop dl { max-width: 800px; margin: 0px auto; position: relative; padding: 0px 20px; }



.Navybluetemp .closevideoPopbtn { display: block; width: 25px; height: 25px; position: absolute; right: 30px; top: -5px; cursor: pointer; margin: -20px -20px 0 0; z-index: 9; }



.Navybluetemp .closevideoPopbtn:after { content: ''; position: absolute; top: 10px; width: 20px; height: 2px; background-color: #FFF; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }



.Navybluetemp .closevideoPopbtn:before { content: ''; position: absolute; top: 10px; width: 20px; height: 2px; background-color: #FFF; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }



/*--企业文化--*/

.Navybluetemp .enterpriseCore h3.title { text-align: center; font-size: 20px; padding-top: 15px; color: #282828; font-weight: 700; }



.Navybluetemp .enterpriseCore p.desc { text-align: center; font-size: 14px; padding-top: 10px; color: #282828; }



.Navybluetemp .enterpriseCore dl { margin-top: 20px; text-align: center; }



.Navybluetemp .enterpriseCore dl dt { padding: 30px 0px; background: #1e314a; }



.Navybluetemp .enterpriseCore dl dd { padding: 30px 0px; background: #c73125; }



.Navybluetemp .enterpriseCore dl img { height: 40px; }



.Navybluetemp .enterpriseCore dl h3 { font-size: 16px; color: #fff; font-weight: 700; padding-top: 10px; }



.Navybluetemp .enterpriseCore dl h3:after { content: ''; width: 30px; height: 2px; background: #fff; display: block; margin: 10px auto 0px; }



.Navybluetemp .enterpriseCore dl p { font-size: 14px; color: #fff; padding-top: 10px; }



.Navybluetemp .enterpriseCoreDesc { max-width: 740px; margin: 0px auto; font-size: 14px; color: #686868; font-weight: 700; text-align: center; padding: 30px 0px; }



.Navybluetemp .FourvaluesIconbox dl { float: left; width: 50%; text-align: center; padding: 0px 10px; }



.Navybluetemp .FourvaluesIconbox dl dt img { display: block; height: 65px; width: 65px; margin: 0px auto; }



.Navybluetemp .FourvaluesIconbox dl dd { padding: 0px 0px 20px 0px; }



.Navybluetemp .FourvaluesIconbox dl h3 { font-size: 16px; padding-top: 8px; color: #282828; font-weight: 700; }



.Navybluetemp .FourvaluesIconbox dl p { font-size: 14px; padding-top: 5px; color: #282828; }



.Navybluetemp .FourvaluesIconbox dl:nth-child(2n) { clear: left; }



.Navybluetemp .FourvaluesDesc { display: none; }



.Navybluetemp .FourvaluesDesc p { color: #1e314a; font-size: 20px; line-height: 34px; text-align: left; }



.Navybluetemp .enterpriseBanner { background-size: cover; background-position: center; height: 200px; text-align: center; color: #fff; font-size: 24px; margin-top: 50px; position: relative; }



.Navybluetemp .enterpriseBanner dl { position: absolute; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left: 0; top: 50%; }



.Navybluetemp .enterpriseCoreList { background: #fff; margin-top: -40px; padding-top: 80px; position: relative; z-index: 9; padding-bottom: 60px; }



.Navybluetemp .enterpriseCoreList dl { padding-bottom: 30px; }



.Navybluetemp .enterpriseCoreList dl dt img { display: block; width: 100%; }



.Navybluetemp .enterpriseCoreList dl h3 { font-size: 16px; margin-top: 10px; color: #282828; font-weight: 700; }



.Navybluetemp .enterpriseCoreList dl p { font-size: 12px; margin-top: 10px; color: #282828; line-height: 24px; }



@media (min-width: 768px) { /*--招聘--*/

  .Navybluetemp .RecruitmentHead dd { text-align: right; }

  .Navybluetemp .RecruitmentHead .RecruitmentHeadSearch { display: inline-block; max-width: 360px; width: 360px; position: relative; }

  .Navybluetemp .RecruitmentPosition span.name { width: 25%; }

  .Navybluetemp .RecruitmentPosition span.num { width: 25%; font-size: 14px; color: #929292; display: block; }

  .Navybluetemp .RecruitmentPosition span.time { background: url(../images/Navy_blue_temp_icon20.png) no-repeat left center; padding-left: 30px; display: block; }

  /*--底部--*/

  .Navybluetemp .footer_address dt { float: left; width: 160px; }

  .Navybluetemp .footer_address dt img { max-width: 100%; display: block; }

  .Navybluetemp .footer_address dd { float: left; width: -webkit-calc(100% - 160px); width: calc(100% - 160px); padding-left: 30px; color: #bdbdbe; font-size: 14px; padding-top: 17px; line-height: 24px; }

  .Navybluetemp .footer_class li { float: left; width: 21%; }

  .Navybluetemp .footer_class li h3 { color: #ffffff; padding: 0px 15px 0px 0px; border-bottom: none; }

  .Navybluetemp .footer_class li h3:before { display: none; }

  .Navybluetemp .footer_class li p { display: block; padding: 0px; border-bottom: none; }

  .Navybluetemp .footer_class li:last-child { float: right; width: auto; }

  /*--产品--*/

  .Navybluetemp .productbg { background-color: #f2f2f2; margin: 125px 0px 0px 0px; padding: 0px; }

  .Navybluetemp .productDeviation { -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); -o-transform: translateY(-100px); transform: translateY(-100px); margin-bottom: -50px; }

  .Navybluetemp .productlist { border: 2px solid #fff; margin-top: 25px; margin-right: 30px; }

  .Navybluetemp .productlist dt { float: left; width: 50%; overflow: hidden; }

  .Navybluetemp .productlist dt img { display: block; width: 100%; -webkit-transition: all .8s ease-in-out; -o-transition: all .8s ease-in-out; transition: all .8s ease-in-out; -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); }

  .Navybluetemp .productlist dd { width: 50%; position: absolute; right: 0px; bottom: 0px; top: 0px; }

  .Navybluetemp .productlist dd div { border-top: 2px solid #e60012; position: absolute; left: 0px; top: 60px; right: -30px; padding: 30px 30px 0px; bottom: -2px; background-color: #f2f2f2; -webkit-box-shadow: 30px 30px 30px rgba(40, 40, 40, 0.4); box-shadow: 30px 30px 30px rgba(40, 40, 40, 0.4); }

  .Navybluetemp .productBanner ul li dl { position: absolute; padding: 0px; left: 4%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); width: 35%; }

  .Navybluetemp .productBanner ul li dl h3 { font-size: 18px; font-weight: 700; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

  .Navybluetemp .productBanner ul li dl p.desc { font-size: 22px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-top: 10px; }

  .Navybluetemp .productBanner ul li dl p.desc1 { font-size: 12px; color: rgba(255, 255, 255, 0.6); display: -webkit-box; height: 54px; line-height: 18px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; margin-top: 15px; }

  .Navybluetemp .productBanner ul li dl p.more span { display: inline-block; width: 120px; height: 35px; text-align: center; margin-top: 15px; background-color: #fff; line-height: 35px; color: #939393; font-weight: 700; background-image: url(../images/Navy_blue_temp_icon08.png); background-repeat: no-repeat; background-position: 20% center; text-indent: 30px; }

  .Navybluetemp .productClass ul li a { display: block; height: 50px; font-size: 18px; color: #282828; font-weight: 700; line-height: 50px; text-align: center; text-overflow: ellipsis; white-space: nowrap; border: 1px solid #bfbfbf; -webkit-border-radius: 25px; border-radius: 25px; }

  .Navybluetemp .productlist:hover dt img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); }

  /*--发展历程--*/

  .Navybluetemp .developmentClass ul li a { display: block; height: 55px; line-height: 55px; font-size: 20px; text-align: center; }

  .Navybluetemp .developmentBanner dl { padding: 0px 0px 0px 40px; left: 40px; bottom: 40px; position: absolute; right: 0px; }

  .Navybluetemp .developmentBanner dl:after { content: ''; display: block; width: 10px; height: 150px; position: absolute; left: 0px; bottom: 0px; background-color: #e60012; }

  .Navybluetemp .developmentBanner dl h3 { color: rgba(255, 255, 255, 0.8); font-size: 16px; }

  .Navybluetemp .developmentBanner dl p { color: #fff; font-size: 22px; line-height: 30px; padding-top: 10px; }

  .Navybluetemp .developmentClassfixed { min-height: 55px; }

  .Navybluetemp .development dt { float: left; width: 230px; font-size: 48px; color: #213f95; }

  .Navybluetemp .development dt span { position: relative; padding-right: 60px; }

  .Navybluetemp .development dt span:after { content: ''; display: block; width: 30px; height: 2px; background-color: #e60012; position: absolute; right: 0px; top: 50%; }

  .Navybluetemp .development dd { float: left; width: -webkit-calc(100% - 230px); width: calc(100% - 230px); padding-top: 25px; padding-bottom: 25px; }

  /*--解决方案--*/

  .Navybluetemp .solutionListTitle { text-align: center; padding-top: 60px; font-size: 30px; font-weight: 700; color: #282828; }

  .Navybluetemp .solutionListContent { background-color: #fff; padding: 50px 25px 0px; margin-top: -75px; margin-left: 30px; position: relative; z-index: 9; }

  .Navybluetemp .solutionListContent h3 { font-size: 20px; font-weight: 700; color: #3d3f48; }

  .Navybluetemp .solutionListContent p { font-size: 14px; color: #737479; line-height: 24px; padding-top: 20px; }

  .Navybluetemp .solutionBanner dl { padding: 40px 0px; }

  .Navybluetemp .solutionBanner dl dt { color: #3d3f48; font-size: 30px; padding-bottom: 20px; }

  .Navybluetemp .solutionBanner dl dd { font-size: 14px; color: #737479; }

  .Navybluetemp .applicationbg { background: url(../images/Navy_blue_temp_img08.jpg) no-repeat center; background-size: cover; min-height: 720px; padding: 150px 0px 0px; }

  .Navybluetemp .applicationTitle { text-align: center; padding: 0px 0px 50px; font-size: 30px; font-weight: 700; color: #FFF; }

  .Navybluetemp .application h3 { font-size: 18px; color: #fff; font-weight: 700; text-align: center; padding-top: 25px; }

  /*--荣誉资质--*/

  .Navybluetemp .qualifications { padding: 50px 0px; }

  .Navybluetemp .qualifications p span { min-height: 210px; }

  .Navybluetemp .qualifications p { padding: 18px; }

  .Navybluetemp .qualifications h3 { font-size: 18px; color: #282828; padding-top: 20px; }

  /*--新闻列表--*/

  .Navybluetemp .newsSearchBox { display: inline-block; position: relative; float: right; width: 380px; }

  .Navybluetemp .newListTitle { background-color: #fff; padding: 25px; }

  .Navybluetemp .newListTitle h3 { font-size: 18px; color: #3c3f46; display: -webkit-box; height: 52px; line-height: 26px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

  .Navybluetemp .newListTitle p { color: #e60012; font-size: 16px; padding-top: 15px; }

  /*--企业文化--*/

  .Navybluetemp .enterpriseCoreList dl dt { width: 240px; }

  .Navybluetemp .enterpriseCoreList dl dd { width: -webkit-calc(100% - 240px); width: calc(100% - 240px); }

  .Navybluetemp .enterpriseCoreList dl h3 { font-size: 18px; margin-top: 10px; color: #282828; font-weight: 700; }

  .Navybluetemp .enterpriseCoreList dl p { font-size: 14px; margin-top: 10px; color: #282828; display: -webkit-box; height: 60px; line-height: 20px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } }



@media (min-width: 992px) { /*--头部开始--*/

  .Navybluetemp .headerBox { padding-top: 0px; }

  .Navybluetemp .header-btn { display: none; }

  .Navybluetemp .header { position: absolute; background: none; height: auto; padding: 15px; }

  .Navybluetemp .header .logo img { height: 42px; }

  .Navybluetemp .header .logo img.xslogo { display: none; }

  .Navybluetemp .header .logo img.lglogo { display: block; }

  .Navybluetemp .header .nav { display: block; position: absolute; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); top: 0px; right: auto; bottom: 0px; background: none; overflow: initial; z-index: 9999; }

  .Navybluetemp .header .nav ul { padding: 0px; width: 130%; }

  .Navybluetemp .header .nav ul li { float: left; width: 90px; border-bottom: none; padding-top: 28px; padding-bottom: 10px; text-align: center; }

  .Navybluetemp .header .nav ul li > a { color: #fff; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; font-size: 16px; font-weight: 700; line-height: 24px; }

  .Navybluetemp .header .nav ul li span { display: none; }

  .Navybluetemp .header .nav ul li:nth-child(1) { padding-left: 0px; }

  .Navybluetemp .header .nav ul li p { position: absolute; padding: 46px 0px 0px; border-top: none; display: block; left: -10px; right: -10px; top: 61px; overflow: hidden; visibility: hidden; height: 0px; opacity: 0; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; text-align: center; }

  .Navybluetemp .header .nav ul li p a { font-size: 14px; font-weight: 700; color: #8f8f8f; line-height: 36px; }

  .Navybluetemp .header .nav ul li p a:hover { color: #e60012; }

  .Navybluetemp .header .nav ul li:hover > a { color: #e60012; }

  .Navybluetemp .header .navbg { overflow: hidden; position: fixed; left: 0; top: -50px; width: 100%; height: 0; background: #fff; z-index: 9998; -webkit-transition: height 0.3s ease-in-out; -o-transition: height 0.3s ease-in-out; transition: height 0.3s ease-in-out; }

  .Navybluetemp .header .navbg span { width: 100px; position: absolute; top: 132px; height: 1px; background: #e60012; display: block; left: 0px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; z-index: 99; visibility: hidden; -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s; }

  .Navybluetemp .header .navbg:after { position: absolute; top: 132px; width: 100%; left: 0; height: 1px; background-color: #ddd; content: ""; }

  .Navybluetemp .header .navMask { opacity: 0; filter: Alpha(opacity=0); position: fixed; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); display: none; }

  .Navybluetemp .header .headSearchbox { margin-left: 20px; position: relative; padding: 0px; width: 136px; display: block; float: right; top: 0px; background: none; }

  .Navybluetemp .header .headSearchbox label { border: 1px solid rgba(255, 255, 255, 0.2); padding: 8px 40px 7px 15px; display: block; -webkit-border-radius: 25px; border-radius: 25px; }

  .Navybluetemp .header .headSearchbox label input { background: none; outline: none; width: 100%; color: #fff; font-size: 13px; }

  .Navybluetemp .header .headSearchbox label input::-webkit-input-placeholder { color: #fff; }

  .Navybluetemp .header .headSearchbox label input:-moz-placeholder { color: #fff; }

  .Navybluetemp .header .headSearchbox label input::-moz-placeholder { color: #fff; }

  .Navybluetemp .header .headSearchbox label input:-ms-input-placeholder { color: #fff; }

  .Navybluetemp .header .headSearchbox input.headSearchBtn { width: 35px; height: 38px; outline: none; background: url(../images/Navy_blue_temp_icon01.png) no-repeat left center; position: absolute; right: 0px; top: 0px; }

  .Navybluetemp .header .Language { padding-right: 20px; display: block; }

  .Navybluetemp .navDown .nav ul { position: relative; z-index: 9999; }

  .Navybluetemp .navDown .nav ul li > a { color: #282828; font-size: 16px; font-weight: 700; line-height: 24px; }

  .Navybluetemp .navDown .nav ul li p { height: 260px; opacity: 1; filter: Alpha(opacity=100); visibility: visible; -webkit-transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.1s; -o-transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.1s; transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.1s; }

  .Navybluetemp .navDown .logo { position: relative; z-index: 9999; }

  .Navybluetemp .navDown .logo img.xslogo { display: block; }

  .Navybluetemp .navDown .logo img.lglogo { display: none; }

  .Navybluetemp .navDown .navbg { height: 400px; }

  .Navybluetemp .navDown .navMask { z-index: 9997; opacity: 1; filter: Alpha(opacity=100); display: block; }

  .Navybluetemp .navDown .Language { position: relative; z-index: 9999; border-right: 1px solid #e5e5e5; }

  .Navybluetemp .navDown .Language span { background: url(../images/Navy_blue_temp_icon002.png); }

  .Navybluetemp .navDown .headSearchbox { z-index: 9999; }

  .Navybluetemp .navDown .headSearchbox input.headSearchBtn { background: url(../images/Navy_blue_temp_icon001.png) no-repeat left center; }

  .Navybluetemp .navDown .headSearchbox label { border: 1px solid #ececec; }

  .Navybluetemp .navDown .headSearchbox label input::-webkit-input-placeholder { color: #282828; }

  .Navybluetemp .navDown .headSearchbox label input:-moz-placeholder { color: #282828; }

  .Navybluetemp .navDown .headSearchbox label input::-moz-placeholder { color: #282828; }

  .Navybluetemp .navDown .headSearchbox label input:-ms-input-placeholder { color: #282828; }

  /*--banner图和二级导航--*/

  .Navybluetemp .commonBanner p { position: absolute; left: 0px; top: 50%; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); color: #fff; text-align: center; font-size: 48px; font-weight: 700; text-transform: uppercase; }

  .Navybluetemp .commonClass { position: absolute; left: 0px; bottom: 0px; width: 100%; background-color: rgba(0, 0, 0, 0.6); border-bottom: none; text-align: center; }

  .Navybluetemp .commonClass h3 { display: none; }

  .Navybluetemp .commonClass ul { display: block; position: relative; top: 0px; border: none; padding: 0px; background: none; }

  .Navybluetemp .commonClass ul li { display: inline-block; line-height: 60px; font-size: 16px; padding: 0px 20px; }

  .Navybluetemp .commonClass ul li a { display: block; border-bottom: 4px solid transparent; font-size: 16px; color: #fff; font-weight: 700; }

  .Navybluetemp .commonClass ul li.cur a { border-bottom: 4px solid #fff; color: #fff; }

  .Navybluetemp .commonClass ul li:hover a { border-bottom: 4px solid #fff; color: #fff; }

  /*--共用标题--*/

  .Navybluetemp .common_Title { text-align: center; padding-top: 80px; font-size: 30px; font-weight: 700; color: #282828; }

  .Navybluetemp .common_Title:after { content: ''; width: 1px; height: 30px; background-color: #e60012; margin: 10px auto 0px; display: block; }

  /*--底部--*/

  .Navybluetemp .footer { background-color: #2a292f; padding-top: 60px; }

  .Navybluetemp .footer_address { float: left; width: 51%; }

  .Navybluetemp .footer_class { float: right; width: 48%; padding-top: 17px; }

  .Navybluetemp .footer_class li { float: left; width: 20%; }

  .Navybluetemp .foot dl { padding: 15px 0px; }

  .Navybluetemp .foot dl dt { float: left; color: rgba(255, 255, 255, 0.3); padding-top: 10px; }

  .Navybluetemp .foot dl dd { float: right; position: relative; display: block; }

  /*--产品--*/

  .Navybluetemp .productbg { background-color: #f2f2f2; margin: 200px 0px 0px 0px; padding: 0px; }

  .Navybluetemp .productDeviation { -webkit-transform: translateY(-150px); -ms-transform: translateY(-150px); -o-transform: translateY(-150px); transform: translateY(-150px); margin-bottom: -80px; }

  .Navybluetemp .productlist { margin-top: 50px; }

  .Navybluetemp .productlist dd div h3 { color: #282828; font-size: 16px; font-weight: 700; }

  .Navybluetemp .productlist dd div p.desc { color: #6f7075; margin-top: 15px; font-size: 12px; display: -webkit-box; height: 36px; line-height: 18px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

  .Navybluetemp .productlist dd div p.more { padding-top: 20px; }

  .Navybluetemp .productBanner ul li dl { position: absolute; left: 4%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); width: 35%; }

  .Navybluetemp .productBanner ul li dl h3 { font-size: 20px; font-weight: 700; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

  .Navybluetemp .productBanner ul li dl p.desc { font-size: 30px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-top: 20px; }

  .Navybluetemp .productBanner ul li dl p.desc1 { font-size: 14px; color: rgba(255, 255, 255, 0.6); display: -webkit-box; height: 72px; line-height: 24px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; margin-top: 25px; }

  .Navybluetemp .productBanner ul li dl p.more span { display: inline-block; width: 160px; height: 50px; text-align: center; margin-top: 25px; background-color: #fff; line-height: 50px; color: #939393; font-weight: 700; background-image: url(../images/Navy_blue_temp_icon08.png); background-repeat: no-repeat; background-position: 30% center; text-indent: 30px; }

  /*--发展历程--*/

  .Navybluetemp .developmentBanner dl { padding-left: 40px; left: 40px; bottom: 40px; position: absolute; right: 0px; }

  .Navybluetemp .developmentBanner dl:after { content: ''; display: block; width: 10px; height: 150px; position: absolute; left: 0px; bottom: 0px; background-color: #e60012; }

  .Navybluetemp .developmentBanner dl h3 { color: rgba(255, 255, 255, 0.8); font-size: 18px; }

  .Navybluetemp .developmentBanner dl p { color: #fff; font-size: 22px; line-height: 30px; padding-top: 10px; }

  /*--团队--*/

  .Navybluetemp .teamBanner { width: 100%; position: relative; margin-top: 20px; }

  .Navybluetemp .teamBanner img { width: 100%; display: block; }

  .Navybluetemp .teamBanner dl { padding-left: 40px; left: 40px; top: 0px; margin-top: 0px; position: absolute; right: 0px; padding-top: 80px; right: 38%; }

  .Navybluetemp .teamBanner dl:after { content: ''; display: block; width: 10px; height: 150px; position: absolute; left: 0px; top: 0px; background-color: #e60012; }

  .Navybluetemp .teamBanner dl h3 { color: rgba(35, 31, 24, 0.8); font-size: 18px; }

  .Navybluetemp .teamBanner dl p.desc { color: #d26720; font-size: 24px; line-height: 30px; padding-top: 15px; }

  .Navybluetemp .teamBanner dl p.desc1 { color: rgba(40, 40, 40, 0.5); font-size: 14px; line-height: 22px; padding-top: 30px; margin-right: 20%; }

  /*--联系我们--*/

  .Navybluetemp .contactDesc { font-size: 20px; }

  .Navybluetemp .contact h3 { font-size: 18px; }

  .Navybluetemp .contact p { font-size: 14px; }

  .Navybluetemp .contactbox ul li:after { content: ''; right: 0px; width: 2px; height: 59px; background-color: #bdc5d0; display: block; top: 7px; position: absolute; }

  /*--文章详情--*/

  .Navybluetemp .details_title h1 { float: left; color: #3d3f48; font-size: 28px; width: -webkit-calc(100% - 140px); width: calc(100% - 140px); padding: 0px 20px 0px 40px; text-align: left; }

  .Navybluetemp .details_title p { color: #d41e1e; font-size: 18px; float: right; padding-top: 8px; width: 140px; text-align: center; }

  .Navybluetemp .details_content { font-size: 14px; color: #737479; line-height: 24px; padding: 40px; border-top: 1px solid #dddddd; }

  .Navybluetemp .details_page p span { position: absolute; left: 0px; padding-left: 40px; top: 0px; display: block; width: 15%; }

  .Navybluetemp .details_page p span:after { content: ''; border-left: 5px solid transparent; border-bottom: 5px solid #000000; border-right: 5px solid transparent; position: absolute; right: 0%; width: 0px; height: 0px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }

  .Navybluetemp .details_page p em { position: absolute; right: 0px; font-style: normal; top: 0px; padding-right: 30px; width: 120px; display: block; }

  .Navybluetemp .details_page p { border-bottom: 1px solid #dddddd; position: relative; padding: 0px 130px 0px 20%; font-size: 18px; line-height: 70px; white-space: nowrap; height: 70px; }

  .Navybluetemp .details_return { text-align: center; padding: 60px 0px; }

  .Navybluetemp .details_return a { border: 1px solid #d41e1e; line-height: 56px; width: 200px; color: #3d3f48; -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; display: inline-block; letter-spacing: 3px; }

  /*--荣誉资质--*/

  .Navybluetemp .qualifications { padding: 60px 0px; }

  .Navybluetemp .qualifications p span { min-height: 310px; }

  .Navybluetemp .qualifications p { padding: 23px; }

  .Navybluetemp .qualifications h3 { font-size: 22px; }

  /*--员工活动--*/

  .Navybluetemp .staffbox { overflow: hidden; padding: 0px 120px; margin: 20px 0px 60px; position: relative; }

  .Navybluetemp .staffbox span { position: absolute; top: 0px; bottom: 80px; width: 60px; cursor: pointer; }

  .Navybluetemp .staffbox span.staffPrev { left: 60px; }

  .Navybluetemp .staffbox span.staffNext { right: 60px; }

  .Navybluetemp .staff p { text-align: center; height: 60px; line-height: 60px; font-size: 20px; margin-top: 20px; text-overflow: ellipsis; overflow: hidden; }

  /*--公司简介--*/

  .Navybluetemp .companyIntroBox dl dt { position: absolute; left: 50px; bottom: 0px; top: 50px; width: -webkit-calc(100% - 650px); width: calc(100% - 650px); background: #213f95; padding: 50px 25px 0px 30px; }

  .Navybluetemp .companyIntroBox dl dt h3 { font-weight: 700; font-size: 20px; color: rgba(255, 255, 255, 0.6); }

  .Navybluetemp .companyIntroBox dl dt p.desc1 { font-size: 24px; color: #fff; line-height: 30px; margin-top: 15px; }

  .Navybluetemp .companyIntroBox dl dt p.desc2 { font-size: 14px; color: rgba(255, 255, 255, 0.4); line-height: 26px; margin-top: 20px; }

  .Navybluetemp .companyIntroBox dl dd { padding: 0px 0px 0px -webkit-calc(100% - 600px); padding: 0px 0px 0px calc(100% - 600px); }

  .Navybluetemp .companyIntroDesc { padding: 40px 5px 10px 20px; position: relative; color: #64656d; font-size: 14px; line-height: 24px; z-index: 8; }

  .Navybluetemp .companyIntroDesc:after { position: absolute; left: -10px; width: 10px; top: 0px; bottom: 0px; background-color: #e60012; content: ''; display: block; }

  .Navybluetemp .companyIntroNum { padding: 48px 0px; text-align: center; border: 1px solid transparent; }

  .Navybluetemp .companyIntroNum h3 { font-size: 18px; color: rgba(40, 40, 40, 0.6); font-weight: 700; }

  .Navybluetemp .companyIntroNum h3:after { height: 2px; background-color: #e60012; width: 30px; margin: 15px auto 0px; content: ''; display: block; }

  .Navybluetemp .companyIntroNum p { font-size: 92px; color: #3f3e43; }

  /*--新闻列表--*/

  .Navybluetemp .newsListBg { background-color: #f2f2f2; margin: 175px 0px 0px 0px; padding: 0px; }

  .Navybluetemp .newsListbox { -webkit-transform: translateY(-160px); -ms-transform: translateY(-160px); -o-transform: translateY(-160px); transform: translateY(-160px); margin-bottom: -90px; }

  .Navybluetemp .newsBanner dl { background-color: #323846; padding-right: 395px; position: relative; padding-bottom: 0px; }

  .Navybluetemp .newsBanner dl dd { position: absolute; right: 0px; width: 395px; padding: 30px 20px 0px; top: 0px; }

  .Navybluetemp .newsBanner dl dd p.time { color: #e60012; font-size: 16px; }

  .Navybluetemp .newsBanner dl dd h3 { font-size: 20px; color: #fff; margin-top: 10px; display: -webkit-box; height: 60px; line-height: 30px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

  .Navybluetemp .newsBanner dl dd p.desc { font-size: 14px; color: rgba(255, 255, 255, 0.6); line-height: 24px; margin-top: 10px; display: -webkit-box; height: 72px; line-height: 24px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }

  .Navybluetemp .newsBannerDot { position: absolute; right: 0px; width: 395px; z-index: 99; bottom: 10%; padding-left: 30px; text-align: left; }

  .Navybluetemp .newListTitle h3 { font-size: 18px; color: #3c3f46; display: -webkit-box; height: 60px; line-height: 30px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

  /*--产品详情--*/

  .Navybluetemp .productMain { padding-top: 100px; }

  .Navybluetemp .productInfo { padding: 0px 0px 0px 20px; }

  .Navybluetemp .productInfo .class { font-size: 18px; padding: 10px 0px 5px; }

  .Navybluetemp .productInfo .Title { font-size: 26px; padding: 0px 0px 15px; font-weight: 700; }

  .Navybluetemp .productInfo .subTitle { font-size: 22px; padding: 15px 0px; }

  .Navybluetemp .productInfo .desc { font-size: 14px; line-height: 22px; }

  .Navybluetemp .productInfo .buybtn { padding-top: 20px; }

  .Navybluetemp .productInfo .buybtn a { display: inline-block; width: 36%; line-height: 50px; font-size: 14px; margin-right: 10px; }

  .Navybluetemp .productInfo .buybtn a.buy { font-weight: 700; }

  .Navybluetemp .productTabClass { border: 1px solid #e5e5e5; line-height: 52px; margin-top: 60px; padding-right: 16px; text-align: right; }

  .Navybluetemp .productTabClass span { display: inline-block; color: #b4b4b4; margin: 0px 0px 0px 44px; cursor: pointer; position: relative; }

  .Navybluetemp .productDetail .title { font-size: 22px; color: #333333; font-weight: 700; text-align: center; }

  .Navybluetemp .productDetail .subTitle { color: #9a9a9a; font-size: 30px; text-align: center; padding: 20px 0px 25px; }

  .Navybluetemp .productDetaildesc { position: relative; margin-top: 20px; padding-bottom: 120px; }

  .Navybluetemp .productDetaildesc b { right: 0px; left: 0px; top: 55px; position: absolute; background-color: #eeeeee; height: 1px; content: ''; display: block; }

  .Navybluetemp .productDetaildesc b:after { -webkit-border-radius: 100%; border-radius: 100%; background: #e60012; content: ''; width: 5px; height: 5px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); right: 0px; position: absolute; }

  .Navybluetemp .productDetaildesc b::before { -webkit-border-radius: 100%; border-radius: 100%; background: #e60012; content: ''; width: 5px; height: 5px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left: 0px; position: absolute; }

  .Navybluetemp .productDetaildesc ul li h3 { color: #282828; font-size: 20px; text-align: center; padding-top: 18px; }

  .Navybluetemp .Imgtextbox { overflow: hidden; }

  .Navybluetemp .Imgtextbox dl { position: relative; }

  .Navybluetemp .Imgtextbox dl dt { padding: 0px; width: 50%; position: relative; }

  .Navybluetemp .Imgtextbox dl dt:after { position: absolute; left: -200%; top: 0px; bottom: 0px; width: 200%; content: ''; background-color: #f8f8f8; }

  .Navybluetemp .Imgtextbox dl dt img { width: 100%; display: block; }

  .Navybluetemp .Imgtextbox dl dd { padding: 0px; position: absolute; left: 50%; right: 0px; top: 0px; bottom: 0px; min-height: 120px; }

  .Navybluetemp .Imgtextbox dl:nth-child(2n) dt { float: right; }

  .Navybluetemp .Imgtextbox dl:nth-child(2n) dt:after { left: 200%; }

  .Navybluetemp .Imgtextbox dl:nth-child(2n) dd { left: 0px; right: 50%; }

  .Navybluetemp .ImgtextContent { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left: 0px; padding: 0px 35px; }

  .Navybluetemp .ImgtextContent h3 { font-size: 24px; color: #282828; line-height: 36px; }

  .Navybluetemp .ImgtextContent h3:after { display: block; width: 30px; height: 3px; margin-top: 20px; }

  .Navybluetemp .ImgtextContent p { color: #969696; font-size: 14px; padding-top: 20px; line-height: 24px; }

  .Navybluetemp .ProductsParameter h3.title { height: 60px; position: relative; line-height: 60px; text-align: center; font-size: 22px; font-weight: 700; }

  .Navybluetemp .ProductsParameterDesc { font-size: 18px; line-height: 36px; padding: 50px 40px; }

  .Navybluetemp .ProductsVideo p span { bottom: 30px; left: 30px; width: 90px; height: 90px; }

  .Navybluetemp .ProductsVideo p span:after { border-bottom: 10px solid transparent; border-top: 10px solid transparent; border-left: 20px solid #e60012; }

  .Navybluetemp .productSmallImg { position: absolute; top: 50%; left: 20px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); width: 72px; z-index: 99; }

  .Navybluetemp .productSmallImg ul li { padding: 10px 0px; float: none; width: auto; }

  .Navybluetemp .productSmallImg ul li img { width: 72px; height: 72px; display: block; -webkit-border-radius: 6px; border-radius: 6px; border: 3px solid transparent; cursor: pointer; }

  .Navybluetemp .ProductsParameter { padding-top: 80px; }

  .Navybluetemp .ProductsRelatedNews { padding: 80px 0px; }

  .Navybluetemp .ProductsRelatedNews h3.title { font-size: 22px; padding-bottom: 20px; }

  .Navybluetemp .ProductsVideo { padding: 80px 0px; }

  .Navybluetemp .ProductsVideo h3.title { font-size: 22px; padding-bottom: 20px; }

  .Navybluetemp .RelatedProductsbox h3.title { font-size: 22px; padding-bottom: 20px; }

  .Navybluetemp .RelatedProducts ul li p { font-size: 20px; }

  /*--解决方案--*/

  .Navybluetemp .solutionListBox { padding: 0px 0px 100px; }

  .Navybluetemp .solutionList2 { padding: 0px 0px 100px; }

  .Navybluetemp .solutionList2 dl:nth-child(2n) dt { float: right; }

  .Navybluetemp .solutionListText { padding: 15px 30px 0px; }

  .Navybluetemp .solutionListText p.num { font-size: 38px; color: #d41e1e; }

  .Navybluetemp .solutionListText p.num:after { content: ''; width: 30px; height: 2px; background: #c2c2c2; display: block; }

  .Navybluetemp .solutionListText h3 { padding-top: 10px; font-size: 24px; color: #3d3f48; }

  .Navybluetemp .solutionListText p.desc { font-size: 14px; color: #737479; line-height: 20px; margin-top: 10px; }

  /*--企业文化--*/

  .Navybluetemp .enterpriseCore dl dt { padding: 50px 0px; }

  .Navybluetemp .enterpriseCore dl dd { padding: 50px 0px; }

  .Navybluetemp .enterpriseCore dl h3 { font-size: 20px; color: #fff; font-weight: 700; padding-top: 20px; }

  .Navybluetemp .enterpriseCoreDesc { max-width: 740px; margin: 0px auto; font-size: 20px; color: #686868; font-weight: 700; text-align: center; padding: 50px 0px; }

  .Navybluetemp .Fourvaluesbox { width: 400px; height: 400px; margin: 0px auto; -webkit-border-radius: 100%; border-radius: 100%; border: 1px solid #e2e2e2; position: relative; }

  .Navybluetemp .FourvaluesIconbox { width: 310px; height: 310px; -webkit-border-radius: 100%; border-radius: 100%; border: 1px solid #1e314a; position: absolute; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); left: 50%; top: 50%; }

  .Navybluetemp .FourvaluesDesc { display: block; width: 145px; height: 145px; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); left: 50%; top: 50%; color: #fff; font-size: 30px; position: absolute; background: #1e314a; -webkit-border-radius: 100%; border-radius: 100%; }

  .Navybluetemp .FourvaluesDesc p { position: absolute; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left: 0; top: 50%; color: #fff; font-size: 22px; line-height: 34px; text-align: center; letter-spacing: -2px; }

  .Navybluetemp .FourvaluesIconbox dl { position: absolute; width: 65px; height: 65px; left: 2px; top: 40px; }

  .Navybluetemp .FourvaluesIconbox dl dt img { display: block; height: 65px; width: 65px; }

  .Navybluetemp .FourvaluesIconbox dl dd { width: 295px; padding: 0px 65px 0px 0px; text-align: right; position: absolute; top: 0px; left: -320px; }

  .Navybluetemp .FourvaluesIconbox dl h3 { font-size: 18px; padding-top: 15px; color: #282828; font-weight: 700; }

  .Navybluetemp .FourvaluesIconbox dl p { font-size: 14px; padding-top: 10px; color: #282828; }

  .Navybluetemp .FourvaluesIconbox dl span { position: absolute; width: 50px; height: 1px; background: #bfbfbf; right: 0px; top: 28px; }

  .Navybluetemp .FourvaluesIconbox dl span:after { position: absolute; right: 0px; width: 6px; height: 6px; top: 50%; margin-top: -3px; content: ''; display: block; background: #6d8373; -webkit-border-radius: 100%; border-radius: 100%; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(2) { left: auto; right: 5px; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(2n) dd { left: 93px; padding: 0px 0px 0px 65px; text-align: left; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(2n) span { left: 0px; right: auto; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(2n) span:after { left: 0px; right: auto; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(3) { top: auto; bottom: 30px; left: 3px; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(4) { top: auto; bottom: 30px; left: auto; right: 6px; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(2n) { clear: none; }

  .Navybluetemp .enterpriseCoreList dl dt { width: 320px; }

  .Navybluetemp .enterpriseCoreList dl dd { width: -webkit-calc(100% - 320px); width: calc(100% - 320px); }

  .Navybluetemp .enterpriseCoreList dl h3 { font-size: 20px; margin-top: 30px; color: #282828; font-weight: 700; }

  .Navybluetemp .enterpriseCoreList dl p { font-size: 14px; margin-top: 10px; color: #282828; display: -webkit-box; height: 66px; line-height: 22px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }

  .Navybluetemp .enterpriseBanner { background-size: cover; background-position: center; height: 300px; text-align: center; color: #fff; font-size: 30px; margin-top: 100px; position: relative; }

  /*--SmartFabric头部--*/

  .SmartFabric .header { padding: 15px 20px 0px; background: none; border: none; }

  .SmartFabric .header a.logo img { height: 59px; }

  .SmartFabric .header a.logo img.logoPc { display: block; }

  .SmartFabric .header a.logo img.logoM { display: none; }

  .SmartFabric .header .header-btn { padding-top: 21px; position: relative; }

  .SmartFabric .header .header-btn a.SF_navbtn { display: none; }

  .SmartFabric .header .header-btn a.SF_searchBtn { background: url(../images/SmartFabric_03.png) no-repeat center 3px; }

  .SmartFabric .nav { float: right; padding-top: 15px; display: block; position: relative; top: auto; left: auto; right: auto; bottom: auto; background: none; overflow-y: visible; }

  .SmartFabric .nav ul { padding: 0px; }

  .SmartFabric .nav ul li { float: left; font-size: 16px; padding-right: 25px; border: none; }

  .SmartFabric .nav ul li a { color: #fff; display: block; line-height: 40px; }

  .SmartFabric .header .headSearchbox { position: absolute; left: auto; top: 60px; right: 0px; width: 300px; padding: 0px; background: none; }

  .SmartFabric .header .headSearchbox form label { background: #fff; }

  /*--SmartFabric底部--*/

  .SmartFabric .footerbg { padding: 100px 0px 60px; }

  .SmartFabric .footer .footLogo img { height: 59px; }

  .SmartFabric .footer .QRcode { display: inline-block; vertical-align: middle; padding-left: 30px; }

  .SmartFabric .footer .QRcode a { width: 40px; height: 40px; }

  .SmartFabric .footer dt { float: left; }

  .SmartFabric .footer dd { float: right; width: 550px; padding-top: 0px; }

  .SmartFabric .footer dd p label { padding: 9px 140px 9px 20px; }

  .SmartFabric .footer dd p label input { font-size: 16px; }

  .SmartFabric .footer dd p input.footEmailBtn { width: 130px; }

  .SmartFabric .footer { padding-bottom: 50px; }

  .SmartFabric .foot { padding-top: 50px; } }



@media (min-width: 1260px) { /*--头部开始--*/

  .Navybluetemp .header { padding: 20px 30px; }

  .Navybluetemp .header .nav ul li { width: 110px; }

  .Navybluetemp .header .headSearchbox { margin-left: 30px; }

  .Navybluetemp .header .Language { padding-right: 30px; }

  /*--底部--*/

  .Navybluetemp .footer_class li { float: left; width: 21%; }

  /*--产品--*/

  .Navybluetemp .productbg { background-color: #f2f2f2; margin: 245px 0px 0px 0px; padding: 0px; }

  .Navybluetemp .productDeviation { -webkit-transform: translateY(-220px); -ms-transform: translateY(-220px); -o-transform: translateY(-220px); transform: translateY(-220px); margin-bottom: -150px; }

  .Navybluetemp .productlist dd div h3 { color: #282828; font-size: 20px; font-weight: 700; }

  .Navybluetemp .productlist dd div p.desc { color: #6f7075; margin-top: 15px; display: -webkit-box; height: 48px; line-height: 24px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 14px; }

  .Navybluetemp .productlist dd div p.more { padding-top: 30px; }

  .Navybluetemp .productClassbox { margin: 60px 0px 0px 0px; }

  .Navybluetemp .productClassbox span { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); width: 30px; height: 30px; cursor: pointer; }

  .Navybluetemp .productClassbox span.productClassPrev { left: -30px; }

  .Navybluetemp .productClassbox span.productClassPrev:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); left: 5px; }

  .Navybluetemp .productClassbox span.productClassNext { right: -30px; }

  .Navybluetemp .productClassbox span.productClassNext:after { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); right: 5px; }

  /*--发展历程--*/

  .Navybluetemp .developmentBanner dl { padding-left: 40px; left: 40px; bottom: 40px; position: absolute; right: 0px; }

  .Navybluetemp .developmentBanner dl:after { content: ''; display: block; width: 10px; height: 150px; position: absolute; left: 0px; bottom: 0px; background-color: #e60012; }

  .Navybluetemp .developmentBanner dl h3 { color: rgba(255, 255, 255, 0.8); font-size: 20px; }

  .Navybluetemp .developmentBanner dl p { color: #fff; font-size: 30px; line-height: 30px; padding-top: 10px; }

  .Navybluetemp .developmentClassbox { position: relative; margin: 40px 0px 0px; }

  .Navybluetemp .developmentClassbox span { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); width: 30px; height: 30px; cursor: pointer; }

  .Navybluetemp .developmentClassbox span.developmentPrev { left: -30px; }

  .Navybluetemp .developmentClassbox span.developmentPrev:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); left: 5px; }

  .Navybluetemp .developmentClassbox span.developmentNext { right: -30px; }

  .Navybluetemp .developmentClassbox span.developmentNext:after { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); right: 5px; }

  /*--团队--*/

  .Navybluetemp .teamBanner { width: 100%; position: relative; margin-top: 20px; }

  .Navybluetemp .teamBanner img { width: 100%; display: block; }

  .Navybluetemp .teamBanner dl { padding-left: 40px; left: 40px; top: 0px; position: absolute; right: 0px; padding-top: 80px; right: 38%; }

  .Navybluetemp .teamBanner dl:after { content: ''; display: block; width: 10px; height: 150px; position: absolute; left: 0px; top: 0px; background-color: #e60012; }

  .Navybluetemp .teamBanner dl h3 { color: rgba(35, 31, 24, 0.8); font-size: 20px; }

  .Navybluetemp .teamBanner dl p.desc { color: #d26720; font-size: 30px; line-height: 30px; padding-top: 15px; }

  .Navybluetemp .teamBanner dl p.desc1 { color: rgba(40, 40, 40, 0.5); font-size: 16px; line-height: 26px; padding-top: 30px; margin-right: 20%; }

  /*--解决方案--*/

  .Navybluetemp .applicationbg ul li:nth-child(4n) { clear: none; }

  .Navybluetemp .solutionListText { padding: 55px 60px 0px; }

  .Navybluetemp .solutionListText p.num { font-size: 48px; color: #d41e1e; }

  .Navybluetemp .solutionListText p.num:after { content: ''; width: 30px; height: 2px; background: #c2c2c2; display: block; }

  .Navybluetemp .solutionListText h3 { padding-top: 15px; font-size: 30px; color: #3d3f48; }

  .Navybluetemp .solutionListText p.desc { font-size: 14px; color: #737479; line-height: 24px; margin-top: 20px; }

  /*--公司简介--*/

  .Navybluetemp .companyIntroBox dl dt { position: absolute; left: 50px; bottom: 0px; top: 50px; width: -webkit-calc(100% - 795px); width: calc(100% - 795px); background: #213f95; padding: 80px 25px 0px 30px; }

  .Navybluetemp .companyIntroBox dl dt h3 { font-weight: 700; font-size: 20px; color: rgba(255, 255, 255, 0.6); }

  .Navybluetemp .companyIntroBox dl dt p.desc1 { font-size: 30px; color: #fff; line-height: 40px; margin-top: 25px; }

  .Navybluetemp .companyIntroBox dl dt p.desc2 { font-size: 16px; color: rgba(255, 255, 255, 0.4); line-height: 26px; margin-top: 30px; }

  .Navybluetemp .companyIntroBox dl dd { padding: 0px 0px 0px -webkit-calc(100% - 745px); padding: 0px 0px 0px calc(100% - 745px); }

  /*--新闻列表--*/

  .Navybluetemp .newsListBg { background-color: #f2f2f2; margin: 245px 0px 0px 0px; padding: 0px; }

  .Navybluetemp .newsListbox { -webkit-transform: translateY(-220px); -ms-transform: translateY(-220px); -o-transform: translateY(-220px); transform: translateY(-220px); margin-bottom: -150px; }

  .Navybluetemp .newsBanner dl dd { position: absolute; right: 0px; width: 395px; padding: 50px 30px 0px; top: 0px; }

  .Navybluetemp .newsBanner dl dd p.time { color: #e60012; font-size: 18px; }

  .Navybluetemp .newsBanner dl dd h3 { font-size: 22px; color: #fff; margin-top: 20px; }

  .Navybluetemp .newsBanner dl dd p.desc { font-size: 14px; color: rgba(255, 255, 255, 0.6); line-height: 24px; margin-top: 20px; display: -webkit-box; height: 96px; line-height: 24px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }

  /*--产品详情--*/

  .Navybluetemp .productInfo { padding: 0px 0px 0px 20px; }

  .Navybluetemp .productInfo .class { font-size: 18px; padding: 35px 0px 15px; }

  .Navybluetemp .productInfo .Title { font-size: 36px; padding: 0px 0px 25px; font-weight: 700; }

  .Navybluetemp .productInfo .subTitle { font-size: 30px; padding: 25px 0px; }

  .Navybluetemp .productInfo .desc { font-size: 14px; line-height: 24px; }

  .Navybluetemp .productInfo .buybtn { padding-top: 30px; }

  .Navybluetemp .productInfo .buybtn a { display: inline-block; width: 36%; line-height: 50px; font-size: 14px; margin-right: 10px; }

  .Navybluetemp .productInfo .buybtn a.buy { font-weight: 700; }

  .Navybluetemp .productTabClass { border: 1px solid #e5e5e5; line-height: 52px; margin-top: 60px; padding-right: 130px; text-align: right; }

  .Navybluetemp .ImgtextContent h3 { font-size: 30px; color: #282828; line-height: 36px; }

  .Navybluetemp .ImgtextContent h3:after { display: block; width: 40px; height: 3px; background-color: #e60012; content: ''; margin-top: 20px; }

  .Navybluetemp .ImgtextContent p { color: #969696; font-size: 14px; padding-top: 20px; line-height: 24px; }

  .Navybluetemp .ProductsVideo p span { bottom: 40px; left: 40px; width: 120px; height: 120px; }

  /*--企业文化--*/

  .Navybluetemp .Fourvaluesbox { width: 500px; height: 500px; }

  .Navybluetemp .FourvaluesIconbox { width: 410px; height: 410px; }

  .Navybluetemp .FourvaluesDesc { width: 245px; height: 245px; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); left: 50%; top: 50%; color: #fff; font-size: 30px; position: absolute; background: #1e314a; -webkit-border-radius: 100%; border-radius: 100%; }

  .Navybluetemp .FourvaluesDesc p { position: absolute; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left: 0; top: 50%; color: #fff; font-size: 30px; line-height: 34px; text-align: center; letter-spacing: -2px; }

  .Navybluetemp .FourvaluesIconbox dl { position: absolute; width: 65px; height: 65px; left: 20px; top: 40px; }

  .Navybluetemp .FourvaluesIconbox dl dt img { display: block; height: 65px; width: 65px; }

  .Navybluetemp .FourvaluesIconbox dl dd { width: 295px; padding: 0px 85px 0px 0px; text-align: right; position: absolute; top: 0px; left: -320px; }

  .Navybluetemp .FourvaluesIconbox dl h3 { font-size: 20px; padding-top: 15px; color: #282828; font-weight: 700; }

  .Navybluetemp .FourvaluesIconbox dl p { font-size: 14px; padding-top: 10px; color: #282828; }

  .Navybluetemp .FourvaluesIconbox dl span { position: absolute; width: 70px; height: 1px; background: #bfbfbf; right: 0px; top: 31px; }

  .Navybluetemp .FourvaluesIconbox dl span:after { position: absolute; right: 0px; width: 6px; height: 6px; top: 50%; margin-top: -3px; content: ''; display: block; background: #6d8373; -webkit-border-radius: 100%; border-radius: 100%; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(2) { left: auto; right: 20px; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(2n) dd { left: 90px; padding: 0px 0px 0px 85px; text-align: left; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(2n) span { left: 0px; right: auto; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(2n) span:after { left: 0px; right: auto; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(3) { top: auto; bottom: 30px; left: 26px; }

  .Navybluetemp .FourvaluesIconbox dl:nth-child(4) { top: auto; bottom: 30px; left: auto; right: 26px; }

  /*--SmartFabric头部--*/

  .SmartFabric .header { padding: 15px 5% 0px; }

  .SmartFabric .header a.logo img { height: 59px; }

  .SmartFabric .header .header-btn { padding-top: 21px; }

  .SmartFabric .header .header-btn a.SF_navbtn { display: none; }

  .SmartFabric .nav { float: right; padding-top: 15px; }

  .SmartFabric .nav ul li { float: left; font-size: 18px; padding-right: 40px; }

  .SmartFabric .nav ul li a { line-height: 40px; }

  /*--SmartFabric底部--*/

  .SmartFabric .foot dt { float: left; padding: 0px; }

  .SmartFabric .foot dt p { display: inline-block; padding-right: 20px; }

  .SmartFabric .foot dt p:last-child { padding-right: 0px; }

  .SmartFabric .foot dd { float: right; } }