﻿/*T-YX125*/
/*
==============================================
CSS3 ANIMATION CHEAT SHEET
==============================================
使用方法 ： http://xiaoguoji.siteconfirm.com/lyy/animates/animates01
==============================================
*/
@charset "UTF-8";
.bgFull {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
}
.vcenter {
  display: block;
  max-width: 100%;
  max-height: 100%;
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tHide {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.blockFull {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}
.block {
  display: block;
  position: relative;
}
.centerBlock {
  margin-left: auto;
  margin-right: auto;
}
.clearfix {
  clear: both;
}
.magictime {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.magic {
  -webkit-animation-name: magic;
  animation-name: magic;
}
.openDownLeft {
  -webkit-animation-name: openDownLeft;
  animation-name: openDownLeft;
}
.openDownRight {
  -webkit-animation-name: openDownRight;
  animation-name: openDownRight;
}
.openUpLeft {
  -webkit-animation-name: openUpLeft;
  animation-name: openUpLeft;
}
.openUpRight {
  -webkit-animation-name: openUpRight;
  animation-name: openUpRight;
}
.openDownLeftRetourn {
  -webkit-animation-name: openDownLeftRetourn;
  animation-name: openDownLeftRetourn;
}
.openDownRightRetourn {
  -webkit-animation-name: openDownRightRetourn;
  animation-name: openDownRightRetourn;
}
.openUpLeftRetourn {
  -webkit-animation-name: openUpLeftRetourn;
  animation-name: openUpLeftRetourn;
}
.openUpRightRetourn {
  -webkit-animation-name: openUpRightRetourn;
  animation-name: openUpRightRetourn;
}
.openDownLeftOut {
  -webkit-animation-name: openDownLeftOut;
  animation-name: openDownLeftOut;
}
.openDownRightOut {
  -webkit-animation-name: openDownRightOut;
  animation-name: openDownRightOut;
}
.openUpLeftOut {
  -webkit-animation-name: openUpLeftOut;
  animation-name: openUpLeftOut;
}
.openUpRightOut {
  -webkit-animation-name: openUpRightOut;
  animation-name: openUpRightOut;
}
.perspectiveDown {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: perspectiveDown;
  animation-name: perspectiveDown;
}
.perspectiveLeft {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: perspectiveLeft;
  animation-name: perspectiveLeft;
}
.perspectiveRight {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: perspectiveRight;
  animation-name: perspectiveRight;
}
.perspectiveUp {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: perspectiveUp;
  animation-name: perspectiveUp;
}
.perspectiveDownRetourn {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: perspectiveDownRetourn;
  animation-name: perspectiveDownRetourn;
}
.perspectiveLeftRetourn {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: perspectiveLeftRetourn;
  animation-name: perspectiveLeftRetourn;
}
.perspectiveRightRetourn {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: perspectiveRightRetourn;
  animation-name: perspectiveRightRetourn;
}
.perspectiveUpRetourn {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: perspectiveUpRetourn;
  animation-name: perspectiveUpRetourn;
}
.puffIn {
  -webkit-animation-name: puffIn;
  animation-name: puffIn;
}
.puffOut {
  -webkit-animation-name: puffOut;
  animation-name: puffOut;
}
.rotateDown {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: rotateDown;
  animation-name: rotateDown;
}
.rotateLeft {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: rotateLeft;
  animation-name: rotateLeft;
}
.rotateRight {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: rotateRight;
  animation-name: rotateRight;
}
.rotateUp {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: rotateUp;
  animation-name: rotateUp;
}
.slideDown {
  -webkit-animation-name: slideDown;
  animation-name: slideDown;
}
.slideLeft {
  -webkit-animation-name: slideLeft;
  animation-name: slideLeft;
}
.slideRight {
  -webkit-animation-name: slideRight;
  animation-name: slideRight;
}
.slideUp {
  -webkit-animation-name: slideUp;
  animation-name: slideUp;
}
.slideDownRetourn {
  -webkit-animation-name: slideDownRetourn;
  animation-name: slideDownRetourn;
}
.slideLeftRetourn {
  -webkit-animation-name: slideLeftRetourn;
  animation-name: slideLeftRetourn;
}
.slideRightRetourn {
  -webkit-animation-name: slideRightRetourn;
  animation-name: slideRightRetourn;
}
.slideUpRetourn {
  -webkit-animation-name: slideUpRetourn;
  animation-name: slideUpRetourn;
}
.swap {
  -webkit-animation-name: swap;
  animation-name: swap;
}
.twisterInDown {
  -webkit-animation-name: twisterInDown;
  animation-name: twisterInDown;
}
.twisterInUp {
  -webkit-animation-name: twisterInUp;
  animation-name: twisterInUp;
}
.vanishIn {
  -webkit-animation-name: vanishIn;
  animation-name: vanishIn;
}
.vanishOut {
  -webkit-animation-name: vanishOut;
  animation-name: vanishOut;
}
.swashOut {
  -webkit-animation-name: swashOut;
  animation-name: swashOut;
}
.swashIn {
  -webkit-animation-name: swashIn;
  animation-name: swashIn;
}
.foolishOut {
  -webkit-animation-name: foolishOut;
  animation-name: foolishOut;
}
.foolishIn {
  -webkit-animation-name: foolishIn;
  animation-name: foolishIn;
}
.holeOut {
  -webkit-animation-name: holeOut;
  animation-name: holeOut;
}
.tinRightOut {
  -webkit-animation-name: tinRightOut;
  animation-name: tinRightOut;
}
.tinLeftOut {
  -webkit-animation-name: tinLeftOut;
  animation-name: tinLeftOut;
}
.tinUpOut {
  -webkit-animation-name: tinUpOut;
  animation-name: tinUpOut;
}
.tinDownOut {
  -webkit-animation-name: tinDownOut;
  animation-name: tinDownOut;
}
.tinRightIn {
  -webkit-animation-name: tinRightIn;
  animation-name: tinRightIn;
}
.tinLeftIn {
  -webkit-animation-name: tinLeftIn;
  animation-name: tinLeftIn;
}
.tinUpIn {
  -webkit-animation-name: tinUpIn;
  animation-name: tinUpIn;
}
.tinDownIn {
  -webkit-animation-name: tinDownIn;
  animation-name: tinDownIn;
}
.bombRightOut {
  -webkit-animation-name: bombRightOut;
  animation-name: bombRightOut;
}
.bombLeftOut {
  -webkit-animation-name: bombLeftOut;
  animation-name: bombLeftOut;
}
.boingInUp {
  -webkit-animation-name: boingInUp;
  animation-name: boingInUp;
}
.boingOutDown {
  -webkit-animation-name: boingOutDown;
  animation-name: boingOutDown;
}
.spaceOutUp {
  -webkit-animation-name: spaceOutUp;
  animation-name: spaceOutUp;
}
.spaceOutRight {
  -webkit-animation-name: spaceOutRight;
  animation-name: spaceOutRight;
}
.spaceOutDown {
  -webkit-animation-name: spaceOutDown;
  animation-name: spaceOutDown;
}
.spaceOutLeft {
  -webkit-animation-name: spaceOutLeft;
  animation-name: spaceOutLeft;
}
.spaceInUp {
  -webkit-animation-name: spaceInUp;
  animation-name: spaceInUp;
}
.spaceInRight {
  -webkit-animation-name: spaceInRight;
  animation-name: spaceInRight;
}
.spaceInDown {
  -webkit-animation-name: spaceInDown;
  animation-name: spaceInDown;
}
.spaceInLeft {
  -webkit-animation-name: spaceInLeft;
  animation-name: spaceInLeft;
}
@-webkit-keyframes magic {
  0% {
    opacity: 1;
    -webkit-transform-origin: 100% 200%;
    -webkit-transform: scale(1, 1) rotate(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 200% 500%;
    -webkit-transform: scale(0, 0) rotate(270deg);
  }
}
@keyframes magic {
  0% {
    opacity: 1;
    transform-origin: 100% 200%;
    transform: scale(1, 1) rotate(0deg);
  }
  100% {
    opacity: 0;
    transform-origin: 200% 500%;
    transform: scale(0, 0) rotate(270deg);
  }
}
@-webkit-keyframes openDownLeft {
  0% {
    -webkit-transform-origin: bottom left;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    -webkit-transform-origin: bottom left;
    -webkit-transform: rotate(-110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
}
@keyframes openDownLeft {
  0% {
    transform-origin: bottom left;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
  100% {
    transform-origin: bottom left;
    transform: rotate(-110deg);
    animation-timing-function: ease-in-out;
  }
}
@-webkit-keyframes openDownRight {
  0% {
    -webkit-transform-origin: bottom right;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    -webkit-transform-origin: bottom right;
    -webkit-transform: rotate(110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
}
@keyframes openDownRight {
  0% {
    transform-origin: bottom right;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
  100% {
    transform-origin: bottom right;
    transform: rotate(110deg);
    animation-timing-function: ease-in-out;
  }
}
@-webkit-keyframes openUpLeft {
  0% {
    -webkit-transform-origin: top left;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    -webkit-transform-origin: top left;
    -webkit-transform: rotate(110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
}
@keyframes openUpLeft {
  0% {
    transform-origin: top left;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
  100% {
    transform-origin: top left;
    transform: rotate(110deg);
    animation-timing-function: ease-in-out;
  }
}
@-webkit-keyframes openUpRight {
  0% {
    -webkit-transform-origin: top right;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    -webkit-transform-origin: top right;
    -webkit-transform: rotate(-110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
}
@keyframes openUpRight {
  0% {
    transform-origin: top right;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
  100% {
    transform-origin: top right;
    transform: rotate(-110deg);
    animation-timing-function: ease-in-out;
  }
}
@-webkit-keyframes openDownLeftRetourn {
  0% {
    -webkit-transform-origin: bottom left;
    -webkit-transform: rotate(-110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
  100% {
    -webkit-transform-origin: bottom left;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
}
@keyframes openDownLeftRetourn {
  0% {
    transform-origin: bottom left;
    transform: rotate(-110deg);
    animation-timing-function: ease-in-out;
  }
  100% {
    transform-origin: bottom left;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
}
@-webkit-keyframes openDownRightRetourn {
  0% {
    -webkit-transform-origin: bottom right;
    -webkit-transform: rotate(110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
  100% {
    -webkit-transform-origin: bottom right;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
}
@keyframes openDownRightRetourn {
  0% {
    transform-origin: bottom right;
    transform: rotate(110deg);
    animation-timing-function: ease-in-out;
  }
  100% {
    transform-origin: bottom right;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
}
@-webkit-keyframes openUpLeftRetourn {
  0% {
    -webkit-transform-origin: top left;
    -webkit-transform: rotate(110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
  100% {
    -webkit-transform-origin: top left;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
}
@keyframes openUpLeftRetourn {
  0% {
    transform-origin: top left;
    transform: rotate(110deg);
    animation-timing-function: ease-in-out;
  }
  100% {
    transform-origin: top left;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
}
@-webkit-keyframes openUpRightRetourn {
  0% {
    -webkit-transform-origin: top right;
    -webkit-transform: rotate(-110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
  100% {
    -webkit-transform-origin: top right;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
}
@keyframes openUpRightRetourn {
  0% {
    transform-origin: top right;
    transform: rotate(-110deg);
    animation-timing-function: ease-in-out;
  }
  100% {
    transform-origin: top right;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
}
@-webkit-keyframes openDownLeftOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: bottom left;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: bottom left;
    -webkit-transform: rotate(-110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
}
@keyframes openDownLeftOut {
  0% {
    opacity: 1;
    transform-origin: bottom left;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
  100% {
    opacity: 0;
    transform-origin: bottom left;
    transform: rotate(-110deg);
    animation-timing-function: ease-in-out;
  }
}
@-webkit-keyframes openDownRightOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: bottom right;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: bottom right;
    -webkit-transform: rotate(110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
}
@keyframes openDownRightOut {
  0% {
    opacity: 1;
    transform-origin: bottom right;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
  100% {
    opacity: 0;
    transform-origin: bottom right;
    transform: rotate(110deg);
    animation-timing-function: ease-in-out;
  }
}
@-webkit-keyframes openUpLeftOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: top left;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: top left;
    -webkit-transform: rotate(110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
}
@keyframes openUpLeftOut {
  0% {
    opacity: 1;
    transform-origin: top left;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
  100% {
    opacity: 0;
    transform-origin: top left;
    transform: rotate(110deg);
    animation-timing-function: ease-in-out;
  }
}
@-webkit-keyframes openUpRightOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: top right;
    -webkit-transform: rotate(0deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: top right;
    -webkit-transform: rotate(-110deg);
    -webkit-animation-timing-function: ease-in-out;
  }
}
@keyframes openUpRightOut {
  0% {
    opacity: 1;
    transform-origin: top right;
    transform: rotate(0deg);
    animation-timing-function: ease-out;
  }
  100% {
    opacity: 0;
    transform-origin: top right;
    transform: rotate(-110deg);
    animation-timing-function: ease-in-out;
  }
}
@-webkit-keyframes perspectiveDown {
  0% {
    -webkit-transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(0deg);
  }
  100% {
    -webkit-transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(-180deg);
  }
}
@keyframes perspectiveDown {
  0% {
    transform-origin: 0 100%;
    transform: perspective(800px) rotateX(0deg);
  }
  100% {
    transform-origin: 0 100%;
    transform: perspective(800px) rotateX(-180deg);
  }
}
@-webkit-keyframes perspectiveLeft {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(-180deg);
  }
}
@keyframes perspectiveLeft {
  0% {
    transform-origin: 0 0;
    transform: perspective(800px) rotateY(0deg);
  }
  100% {
    transform-origin: 0 0;
    transform: perspective(800px) rotateY(-180deg);
  }
}
@-webkit-keyframes perspectiveRight {
  0% {
    -webkit-transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
  }
  100% {
    -webkit-transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(180deg);
  }
}
@keyframes perspectiveRight {
  0% {
    transform-origin: 100% 0;
    transform: perspective(800px) rotateY(0deg);
  }
  100% {
    transform-origin: 100% 0;
    transform: perspective(800px) rotateY(180deg);
  }
}
@-webkit-keyframes perspectiveUp {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(180deg);
  }
}
@keyframes perspectiveUp {
  0% {
    transform-origin: 0 0;
    transform: perspective(800px) rotateX(0deg);
  }
  100% {
    transform-origin: 0 0;
    transform: perspective(800px) rotateX(180deg);
  }
}
@-webkit-keyframes perspectiveDownRetourn {
  0% {
    -webkit-transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(-180deg);
  }
  100% {
    -webkit-transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(0deg);
  }
}
@keyframes perspectiveDownRetourn {
  0% {
    transform-origin: 0 100%;
    transform: perspective(800px) rotateX(-180deg);
  }
  100% {
    transform-origin: 0 100%;
    transform: perspective(800px) rotateX(0deg);
  }
}
@-webkit-keyframes perspectiveLeftRetourn {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(-180deg);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
  }
}
@keyframes perspectiveLeftRetourn {
  0% {
    transform-origin: 0 0;
    transform: perspective(800px) rotateY(-180deg);
  }
  100% {
    transform-origin: 0 0;
    transform: perspective(800px) rotateY(0deg);
  }
}
@-webkit-keyframes perspectiveRightRetourn {
  0% {
    -webkit-transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(180deg);
  }
  100% {
    -webkit-transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
  }
}
@keyframes perspectiveRightRetourn {
  0% {
    transform-origin: 100% 0;
    transform: perspective(800px) rotateY(180deg);
  }
  100% {
    transform-origin: 100% 0;
    transform: perspective(800px) rotateY(0deg);
  }
}
@-webkit-keyframes perspectiveUpRetourn {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(180deg);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg);
  }
}
@keyframes perspectiveUpRetourn {
  0% {
    transform-origin: 0 0;
    transform: perspective(800px) rotateX(180deg);
  }
  100% {
    transform-origin: 0 0;
    transform: perspective(800px) rotateX(0deg);
  }
}
@-webkit-keyframes puffIn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(2, 2);
    -webkit-filter: blur(2px);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
}
@keyframes puffIn {
  0% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(2, 2);
    filter: blur(2px);
  }
  100% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
    filter: blur(0px);
  }
}
@-webkit-keyframes puffOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(2, 2);
    -webkit-filter: blur(2px);
  }
}
@keyframes puffOut {
  0% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(2, 2);
    -webkit-filter: blur(2px);
  }
}
@-webkit-keyframes rotateDown {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 100%;
    -webkit-transform: perspective(800px) rotateX(-180deg) translateZ(300px);
  }
}
@keyframes rotateDown {
  0% {
    opacity: 1;
    transform-origin: 0 0;
    transform: perspective(800px) rotateX(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 100%;
    transform: perspective(800px) rotateX(-180deg) translateZ(300px);
  }
}
@-webkit-keyframes rotateLeft {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    -webkit-transform: perspective(800px) rotateY(180deg) translateZ(300px);
  }
}
@keyframes rotateLeft {
  0% {
    opacity: 1;
    transform-origin: 0 0;
    transform: perspective(800px) rotateY(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 0;
    transform: perspective(800px) rotateY(180deg) translateZ(300px);
  }
}
@-webkit-keyframes rotateRight {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg) translate3d(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    -webkit-transform: perspective(800px) rotateY(-180deg) translateZ(150px);
  }
}
@keyframes rotateRight {
  0% {
    opacity: 1;
    transform-origin: 0 0;
    transform: perspective(800px) rotateY(0deg) translate3d(0px);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 0;
    transform: perspective(800px) rotateY(-180deg) translateZ(150px);
  }
}
@-webkit-keyframes rotateUp {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    -webkit-transform: perspective(800px) rotateX(180deg) translateZ(100px);
  }
}
@keyframes rotateUp {
  0% {
    opacity: 1;
    transform-origin: 0 0;
    transform: perspective(800px) rotateX(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 0;
    transform: perspective(800px) rotateX(180deg) translateZ(100px);
  }
}
@-webkit-keyframes slideDown {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateY(0%);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateY(100%);
  }
}
@keyframes slideDown {
  0% {
    transform-origin: 0 0;
    transform: translateY(0%);
  }
  100% {
    transform-origin: 0 0;
    transform: translateY(100%);
  }
}
@-webkit-keyframes slideLeft {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateX(0%);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateX(-100%);
  }
}
@keyframes slideLeft {
  0% {
    transform-origin: 0 0;
    transform: translateX(0%);
  }
  100% {
    transform-origin: 0 0;
    transform: translateX(-100%);
  }
}
@-webkit-keyframes slideRight {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateX(0%);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateX(100%);
  }
}
@keyframes slideRight {
  0% {
    transform-origin: 0 0;
    transform: translateX(0%);
  }
  100% {
    transform-origin: 0 0;
    transform: translateX(100%);
  }
}
@-webkit-keyframes slideUp {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateY(0%);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateY(-100%);
  }
}
@keyframes slideUp {
  0% {
    transform-origin: 0 0;
    transform: translateY(0%);
  }
  100% {
    transform-origin: 0 0;
    transform: translateY(-100%);
  }
}
@-webkit-keyframes slideDownRetourn {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateY(100%);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateY(0%);
  }
}
@keyframes slideDownRetourn {
  0% {
    transform-origin: 0 0;
    transform: translateY(100%);
  }
  100% {
    transform-origin: 0 0;
    transform: translateY(0%);
  }
}
@-webkit-keyframes slideLeftRetourn {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateX(-100%);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateX(0%);
  }
}
@keyframes slideLeftRetourn {
  0% {
    transform-origin: 0 0;
    transform: translateX(-100%);
  }
  100% {
    transform-origin: 0 0;
    transform: translateX(0%);
  }
}
@-webkit-keyframes slideRightRetourn {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateX(100%);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateX(0%);
  }
}
@keyframes slideRightRetourn {
  0% {
    transform-origin: 0 0;
    transform: translateX(100%);
  }
  100% {
    transform-origin: 0 0;
    transform: translateX(0%);
  }
}
@-webkit-keyframes slideUpRetourn {
  0% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateY(-100%);
  }
  100% {
    -webkit-transform-origin: 0 0;
    -webkit-transform: translateY(0%);
  }
}
@keyframes slideUpRetourn {
  0% {
    transform-origin: 0 0;
    transform: translateY(-100%);
  }
  100% {
    transform-origin: 0 0;
    transform: translateY(0%);
  }
}
@-webkit-keyframes swap {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 100%;
    -webkit-transform: scale(0, 0) translate(-700px, 0px);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    -webkit-transform: scale(1, 1) translate(0px, 0px);
  }
}
@keyframes swap {
  0% {
    opacity: 0;
    transform-origin: 0 100%;
    transform: scale(0, 0) translate(-700px, 0px);
  }
  100% {
    opacity: 1;
    transform-origin: 100% 100%;
    transform: scale(1, 1) translate(0px, 0px);
  }
}
@-webkit-keyframes twisterInDown {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 100%;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);
  }
  30% {
    -webkit-transform-origin: 0 100%;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0%);
  }
}
@keyframes twisterInDown {
  0% {
    opacity: 0;
    transform-origin: 0 100%;
    transform: scale(0, 0) rotate(360deg) translateY(-100%);
  }
  30% {
    transform-origin: 0 100%;
    transform: scale(0, 0) rotate(360deg) translateY(-100%);
  }
  100% {
    opacity: 1;
    transform-origin: 100% 100%;
    transform: scale(1, 1) rotate(0deg) translateY(0%);
  }
}
@-webkit-keyframes twisterInUp {
  0% {
    opacity: 0;
    -webkit-transform-origin: 100% 0;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);
  }
  30% {
    -webkit-transform-origin: 100% 0;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0);
  }
}
@keyframes twisterInUp {
  0% {
    opacity: 0;
    transform-origin: 100% 0;
    transform: scale(0, 0) rotate(360deg) translateY(100%);
  }
  30% {
    transform-origin: 100% 0;
    transform: scale(0, 0) rotate(360deg) translateY(100%);
  }
  100% {
    opacity: 1;
    transform-origin: 0 0;
    transform: scale(1, 1) rotate(0deg) translateY(0);
  }
}
@-webkit-keyframes vanishIn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(2, 2);
    -webkit-filter: blur(90px);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
}
@keyframes vanishIn {
  0% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(2, 2);
    -webkit-filter: blur(90px);
  }
  100% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
}
@-webkit-keyframes vanishOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(2, 2);
    -webkit-filter: blur(20px);
  }
}
@keyframes vanishOut {
  0% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(2, 2);
    -webkit-filter: blur(20px);
  }
}
@-webkit-keyframes swashOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
  80% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(0.9, 0.9);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0);
  }
}
@keyframes swashOut {
  0% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
  }
  80% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(0.9, 0.9);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(0, 0);
  }
}
@-webkit-keyframes swashIn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0);
  }
  90% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(0.9, 0.9);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
  }
}
@keyframes swashIn {
  0% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(0, 0);
  }
  90% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(0.9, 0.9);
  }
  100% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
  }
}
@-webkit-keyframes foolishOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1) rotate(360deg);
  }
  20% {
    opacity: 1;
    -webkit-transform-origin: 0% 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
  }
  40% {
    opacity: 1;
    -webkit-transform-origin: 100% 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
  }
  60% {
    opacity: 1;
    -webkit-transform-origin: 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
  }
  80% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0) rotate(0deg);
  }
}
@keyframes foolishOut {
  0% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1) rotate(360deg);
  }
  20% {
    opacity: 1;
    transform-origin: 0% 0%;
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  40% {
    opacity: 1;
    transform-origin: 100% 0%;
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  60% {
    opacity: 1;
    transform-origin: 0%;
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  80% {
    opacity: 1;
    transform-origin: 0% 100%;
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(0, 0) rotate(0deg);
  }
}
@-webkit-keyframes foolishIn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0) rotate(360deg);
  }
  20% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
  }
  40% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
  }
  60% {
    opacity: 1;
    -webkit-transform-origin: 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
  }
  80% {
    opacity: 1;
    -webkit-transform-origin: 0% 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1) rotate(0deg);
  }
}
@keyframes foolishIn {
  0% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(0, 0) rotate(360deg);
  }
  20% {
    opacity: 1;
    transform-origin: 0% 100%;
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  40% {
    opacity: 1;
    transform-origin: 100% 100%;
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  60% {
    opacity: 1;
    transform-origin: 0%;
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  80% {
    opacity: 1;
    transform-origin: 0% 0%;
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  100% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1) rotate(0deg);
  }
}
@-webkit-keyframes holeOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1) rotateY(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0) rotateY(180deg);
  }
}
@keyframes holeOut {
  0% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1) rotateY(0deg);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(0, 0) rotateY(180deg);
  }
}
@-webkit-keyframes tinRightOut {
  0%,
  20%,
  40%,
  50% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateX(0);
  }
  10%,
  30% {
    opacity: 1;
    -webkit-transform: scale(1.1, 1.1) translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1, 1) translateX(900%);
  }
}
@keyframes tinRightOut {
  0%,
  20%,
  40%,
  50% {
    opacity: 1;
    transform: scale(1, 1) translateX(0);
  }
  10%,
  30% {
    opacity: 1;
    transform: scale(1.1, 1.1) translateX(0);
  }
  100% {
    opacity: 0;
    transform: scale(1, 1) translateX(900%);
  }
}
@-webkit-keyframes tinLeftOut {
  0%,
  20%,
  40%,
  50% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateX(0);
  }
  10%,
  30% {
    opacity: 1;
    -webkit-transform: scale(1.1, 1.1) translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1, 1) translateX(-900%);
  }
}
@keyframes tinLeftOut {
  0%,
  20%,
  40%,
  50% {
    opacity: 1;
    transform: scale(1, 1) translateX(0);
  }
  10%,
  30% {
    opacity: 1;
    transform: scale(1.1, 1.1) translateX(0);
  }
  100% {
    opacity: 0;
    transform: scale(1, 1) translateX(-900%);
  }
}
@-webkit-keyframes tinUpOut {
  0%,
  20%,
  40%,
  50% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateY(0);
  }
  10%,
  30% {
    opacity: 1;
    -webkit-transform: scale(1.1, 1.1) translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1, 1) translateY(-900%);
  }
}
@keyframes tinUpOut {
  0%,
  20%,
  40%,
  50% {
    opacity: 1;
    transform: scale(1, 1) translateY(0);
  }
  10%,
  30% {
    opacity: 1;
    transform: scale(1.1, 1.1) translateY(0);
  }
  100% {
    opacity: 0;
    transform: scale(1, 1) translateY(-900%);
  }
}
@-webkit-keyframes tinDownOut {
  0%,
  20%,
  40%,
  50% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateY(0);
  }
  10%,
  30% {
    opacity: 1;
    -webkit-transform: scale(1.1, 1.1) translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1, 1) translateY(900%);
  }
}
@keyframes tinDownOut {
  0%,
  20%,
  40%,
  50% {
    opacity: 1;
    transform: scale(1, 1) translateY(0);
  }
  10%,
  30% {
    opacity: 1;
    transform: scale(1.1, 1.1) translateY(0);
  }
  100% {
    opacity: 0;
    transform: scale(1, 1) translateY(900%);
  }
}
@-webkit-keyframes tinRightIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(1, 1) translateX(900%);
  }
  50%,
  70%,
  90% {
    opacity: 1;
    -webkit-transform: scale(1.1, 1.1) translateX(0);
  }
  60%,
  80%,
  100% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateX(0);
  }
}
@keyframes tinRightIn {
  0% {
    opacity: 0;
    transform: scale(1, 1) translateX(900%);
  }
  50%,
  70%,
  90% {
    opacity: 1;
    transform: scale(1.1, 1.1) translateX(0);
  }
  60%,
  80%,
  100% {
    opacity: 1;
    transform: scale(1, 1) translateX(0);
  }
}
@-webkit-keyframes tinLeftIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(1, 1) translateX(-900%);
  }
  50%,
  70%,
  90% {
    opacity: 1;
    -webkit-transform: scale(1.1, 1.1) translateX(0);
  }
  60%,
  80%,
  100% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateX(0);
  }
}
@keyframes tinLeftIn {
  0% {
    opacity: 0;
    transform: scale(1, 1) translateX(-900%);
  }
  50%,
  70%,
  90% {
    opacity: 1;
    transform: scale(1.1, 1.1) translateX(0);
  }
  60%,
  80%,
  100% {
    opacity: 1;
    transform: scale(1, 1) translateX(0);
  }
}
@-webkit-keyframes tinUpIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(1, 1) translateY(-900%);
  }
  50%,
  70%,
  90% {
    opacity: 1;
    -webkit-transform: scale(1.1, 1.1) translateY(0);
  }
  60%,
  80%,
  100% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateY(0);
  }
}
@keyframes tinUpIn {
  0% {
    opacity: 0;
    transform: scale(1, 1) translateY(-900%);
  }
  50%,
  70%,
  90% {
    opacity: 1;
    transform: scale(1.1, 1.1) translateY(0);
  }
  60%,
  80%,
  100% {
    opacity: 1;
    transform: scale(1, 1) translateY(0);
  }
}
@-webkit-keyframes tinDownIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(1, 1) translateY(900%);
  }
  50%,
  70%,
  90% {
    opacity: 1;
    -webkit-transform: scale(1.1, 1.1) translateY(0);
  }
  60%,
  80%,
  100% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateY(0);
  }
}
@keyframes tinDownIn {
  0% {
    opacity: 0;
    transform: scale(1, 1) translateY(900%);
  }
  50%,
  70%,
  90% {
    opacity: 1;
    transform: scale(1.1, 1.1) translateY(0);
  }
  60%,
  80%,
  100% {
    opacity: 1;
    transform: scale(1, 1) translateY(0);
  }
}
@-webkit-keyframes bombRightOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: rotate(0deg);
    -webkit-filter: blur(0px);
  }
  50% {
    opacity: 1;
    -webkit-transform-origin: 200% 50%;
    -webkit-transform: rotate(160deg);
    -webkit-filter: blur(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 200% 50%;
    -webkit-transform: rotate(160deg);
    -webkit-filter: blur(20px);
  }
}
@keyframes bombRightOut {
  0% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: rotate(0deg);
    -webkit-filter: blur(0px);
  }
  50% {
    opacity: 1;
    transform-origin: 200% 50%;
    transform: rotate(160deg);
    -webkit-filter: blur(0px);
  }
  100% {
    opacity: 0;
    transform-origin: 200% 50%;
    transform: rotate(160deg);
    -webkit-filter: blur(20px);
  }
}
@-webkit-keyframes bombLeftOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: rotate(0deg);
    -webkit-filter: blur(0px);
  }
  50% {
    opacity: 1;
    -webkit-transform-origin: -100% 50%;
    -webkit-transform: rotate(-160deg);
    -webkit-filter: blur(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: -100% 50%;
    -webkit-transform: rotate(-160deg);
    -webkit-filter: blur(20px);
  }
}
@keyframes bombLeftOut {
  0% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: rotate(0deg);
    -webkit-filter: blur(0px);
  }
  50% {
    opacity: 1;
    transform-origin: -100% 50%;
    transform: rotate(-160deg);
    -webkit-filter: blur(0px);
  }
  100% {
    opacity: 0;
    transform-origin: -100% 50%;
    transform: rotate(-160deg);
    -webkit-filter: blur(20px);
  }
}
@-webkit-keyframes boingInUp {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(-90deg);
  }
  50% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(50deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(0deg);
  }
}
@keyframes boingInUp {
  0% {
    opacity: 0;
    transform-origin: 50% 0%;
    transform: perspective(800px) rotateX(-90deg);
  }
  50% {
    opacity: 1;
    transform-origin: 50% 0%;
    transform: perspective(800px) rotateX(50deg);
  }
  100% {
    opacity: 1;
    transform-origin: 50% 0%;
    transform: perspective(800px) rotateX(0deg);
  }
}
@-webkit-keyframes boingOutDown {
  0% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);
  }
  20% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(10deg);
  }
  30% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);
  }
  40% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    -webkit-transform: perspective(800px) rotateX(10deg) rotateY(10deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 100% 100%;
    -webkit-transform: perspective(800px) rotateX(90deg) rotateY(0deg);
  }
}
@keyframes boingOutDown {
  0% {
    opacity: 1;
    transform-origin: 100% 100%;
    transform: perspective(800px) rotateX(0deg) rotateY(0deg);
  }
  20% {
    opacity: 1;
    transform-origin: 100% 100%;
    transform: perspective(800px) rotateX(0deg) rotateY(10deg);
  }
  30% {
    opacity: 1;
    transform-origin: 0% 100%;
    transform: perspective(800px) rotateX(0deg) rotateY(0deg);
  }
  40% {
    opacity: 1;
    transform-origin: 0% 100%;
    transform: perspective(800px) rotateX(10deg) rotateY(10deg);
  }
  100% {
    opacity: 0;
    transform-origin: 100% 100%;
    transform: perspective(800px) rotateX(90deg) rotateY(0deg);
  }
}
@-webkit-keyframes spaceOutUp {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: scale(1) translate(0%, 0%);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: scale(.2) translate(0%, -200%);
  }
}
@keyframes spaceOutUp {
  0% {
    opacity: 1;
    transform-origin: 50% 0%;
    transform: scale(1) translate(0%, 0%);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 0%;
    transform: scale(.2) translate(0%, -200%);
  }
}
@-webkit-keyframes spaceOutRight {
  0% {
    opacity: 1;
    -webkit-transform-origin: 100% 50%;
    -webkit-transform: scale(1) translate(0%, 0%);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 100% 50%;
    -webkit-transform: scale(.2) translate(200%, 0%);
  }
}
@keyframes spaceOutRight {
  0% {
    opacity: 1;
    transform-origin: 100% 50%;
    transform: scale(1) translate(0%, 0%);
  }
  100% {
    opacity: 0;
    transform-origin: 100% 50%;
    transform: scale(.2) translate(200%, 0%);
  }
}
@-webkit-keyframes spaceOutDown {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 100%;
    -webkit-transform: scale(1) translate(0%, 0%);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 100%;
    -webkit-transform: scale(.2) translate(0%, 200%);
  }
}
@keyframes spaceOutDown {
  0% {
    opacity: 1;
    transform-origin: 50% 100%;
    transform: scale(1) translate(0%, 0%);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 100%;
    transform: scale(.2) translate(0%, 200%);
  }
}
@-webkit-keyframes spaceOutLeft {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0% 50%;
    -webkit-transform: scale(1) translate(0%, 0%);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 0% 50%;
    -webkit-transform: scale(.2) translate(-200%, 0%);
  }
}
@keyframes spaceOutLeft {
  0% {
    opacity: 1;
    transform-origin: 0% 50%;
    transform: scale(1) translate(0%, 0%);
  }
  100% {
    opacity: 0;
    transform-origin: 0% 50%;
    transform: scale(.2) translate(-200%, 0%);
  }
}
@-webkit-keyframes spaceInUp {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: scale(.2) translate(0%, -200%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: scale(1) translate(0%, 0%);
  }
}
@keyframes spaceInUp {
  0% {
    opacity: 0;
    transform-origin: 50% 0%;
    transform: scale(.2) translate(0%, -200%);
  }
  100% {
    opacity: 1;
    transform-origin: 50% 0%;
    transform: scale(1) translate(0%, 0%);
  }
}
@-webkit-keyframes spaceInRight {
  0% {
    opacity: 0;
    -webkit-transform-origin: 100% 50%;
    -webkit-transform: scale(.2) translate(200%, 0%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 100% 50%;
    -webkit-transform: scale(1) translate(0%, 0%);
  }
}
@keyframes spaceInRight {
  0% {
    opacity: 0;
    transform-origin: 100% 50%;
    transform: scale(.2) translate(200%, 0%);
  }
  100% {
    opacity: 1;
    transform-origin: 100% 50%;
    transform: scale(1) translate(0%, 0%);
  }
}
@-webkit-keyframes spaceInDown {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 100%;
    -webkit-transform: scale(.2) translate(0%, 200%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 100%;
    -webkit-transform: scale(1) translate(0%, 0%);
  }
}
@keyframes spaceInDown {
  0% {
    opacity: 0;
    transform-origin: 50% 100%;
    transform: scale(.2) translate(0%, 200%);
  }
  100% {
    opacity: 1;
    transform-origin: 50% 100%;
    transform: scale(1) translate(0%, 0%);
  }
}
@-webkit-keyframes spaceInLeft {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0% 50%;
    -webkit-transform: scale(.2) translate(-200%, 0%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0% 50%;
    -webkit-transform: scale(1) translate(0%, 0%);
  }
}
@keyframes spaceInLeft {
  0% {
    opacity: 0;
    transform-origin: 0% 50%;
    transform: scale(.2) translate(-200%, 0%);
  }
  100% {
    opacity: 1;
    transform-origin: 0% 50%;
    transform: scale(1) translate(0%, 0%);
  }
}
/*
	--------------------------------------------
	首页样式 
	--------------------------------------------
*/
/*banner---------------------------- */
.banner {
  width: 100%;
  height: 544px;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.banner ul {
  width: 1800px;
  height: 544px;
  position: absolute;
  left: 50%;
  margin-left: -900px;
  overflow: hidden;
}
.banner li {
  width: 1800px;
  height: 544px;
  list-style: none;
  position: absolute;
  left: 0px;
  top: 0px;
  float: left;
  display: none;
}
.banner .arrows {
  position: relative;
  z-index: 2;
  height: 20px;
  width: 180px;
  margin: 0 auto;
  margin-top: 505px;
}
.banner .arrows .prev,
.arrows .next {
  width: 87px;
  height: 20px;
  display: block;
  position: absolute;
}
.banner .arrows .prev {
  background: url(../images/left_btn.png) no-repeat;
  left: 0;
}
.banner .arrows .next {
  background: url(../images/right_btn.png) no-repeat;
  right: 0;
}
/*案例展示--------------------------- */
.case-nav {
  text-align: center;
}
.case-nav li {
  display: inline-block;
  width: 83px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  color: #848484;
  border: solid 1px #b8b8b8;
  margin-left: 20px;
  cursor: pointer;
  overflow:hidden
}
.case-nav li.select {
  color: #fff;
  background: #1a508e;
  border: solid 1px #1a508e;
}
.case-content {
  margin-top: 50px;
  position: relative;
  height: 305px;
}
.case-content li {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  width: 100%;
}
.case-content li.active {
  opacity: 1;
  filter: alpha(opacity=100);
  z-index: 99;
}
.case-content .case-img {
  position: relative;
}
.case-content .case-img p {
  position: relative;
  width: 292px;
  height: 305px;
}
.case-content .case-img:hover .case-bg {
  opacity: 1;
  filter: alpha(opacity=100);
  transition: All 0.4s ease-in-out;
  -webkit-transition: All 0.4s ease-in-out;
  -moz-transition: All 0.4s ease-in-out;
  -o-transition: All 0.4s ease-in-out;
}
.case-content .case-bg {
  position: absolute;
  background: url(../images/bg_3.png) repeat;
  top: 7px;
  left: 7px;
  width: 278px;
  text-align: center;
  height: 290px;
  text-transform: uppercase;
  color: #fff;
  font-family: arial;
  opacity: 0;
  filter: alpha(opacity=0);
}
.case-content .case-bg h3 {
  font-weight: normal;
  font-size: 20px;
  margin-top: 100px;
  height: 24px;
  line-height: 24px;
  overflow: hidden;
}
.case-content .case-bg h3 a {
  color: #fff;
}
.case-content .case-bg p {
    font-size: 18px;
    height: 24px;
    line-height: 24px;
    overflow: hidden;
    width: 280px;
}
.case-content .case-bg .more {
  display: inline-block;
  border-bottom: solid 1px #e3d1d3;
  border-top: solid 1px #e3d1d3;
  height: 30px;
  text-align: center;
  width: 110px;
  line-height: 30px;
  color: #e3d1d3;
  margin-top: 10px;
}
.case-content .case-bg .more:hover {
  border-bottom: solid 1px #fff;
  border-top: solid 1px #fff;
  color: #fff;
}
.case-text {
  width: 905px;
  margin: 0 auto;
  text-align: center;
  line-height: 24px;
  height: 72px;
  overflow: hidden;
  margin-top: 45px;
}
.case-more {
  text-align: center;
  margin-top: 40px;
}
.case-more a {
  display: inline-block;
  background: #1a508e;
  width: 136px;
  height: 27px;
  line-height: 27px;
  text-align: center;
  border: solid 1px #134279;
  color: #fff;
}
/*工程法律--------------------------- */
.column-3 {
  background: #efefef;
  padding-bottom: 50px;
  overflow: hidden;
}
.column-3-content {
  background: #fff;
  height: 428px;
  margin-top: 60px;
}
.column-3-content .text {
  width: 575px;
  float: left;
  margin-left: 40px;
  line-height: 29px;
}
.column-3-content .text h3 {
  line-height: 21px;
  font-weight: normal;
  color: #1a508e;
  border-bottom: solid 1px #d9d9d9;
  padding-bottom: 15px;
  margin: 55px 0 15px 0;
  text-transform: uppercase;
}
.column-3-content .text h3 p {
  font-size: 21px;
  font-family: arial;
}
.column-3-content .text h3 span {
  font-size: 18px;
}
.column-3-content .text .more {
  margin-top: 20px;
  display: inline-block;
  background: #1a508e;
  width: 136px;
  height: 27px;
  line-height: 27px;
  text-align: center;
  border: solid 1px #134279;
  color: #fff;
}
/*新闻--------------------------- */
.news {
  position: relative;
}
.news ul {
  background: url(../images/news_line.jpg) repeat-y top left;
  height: 670px;
}
.news li {
  float: left;
  position: relative;
  width: 600px;
  margin-top: 40px;
}
.news li:hover dt a {
  opacity: 1;
  filter: alpha(opacity=100);
  transition: All 0.4s ease-in-out;
  -webkit-transition: All 0.4s ease-in-out;
  -moz-transition: All 0.4s ease-in-out;
  -o-transition: All 0.4s ease-in-out;
  width: 238px;
  height: 200px;
}
.news li:hover em {
  background: url(../images/news_icon3.jpg) no-repeat;
}
.news dl {
  height: 202px;
}
.news dd {
  width: 290px;
  text-align: right;
  float: left;
}
.news dd span {
  color: #6c6c6c;
  font-family: arial;
  display: inline-block;
  background: url(../images/news_icon1.jpg) no-repeat;
  text-indent: 20px;
  margin-top: 15px;
}
.news dd h3 {
  font-weight: normal;
  height: 24px;
  line-height: 24px;
  overflow: hidden;
  margin-top: 12px;
}
.news dd h3 a {
  color: #333;
}
.news dd h3 a:hover {
  color: #000;
}
.news dd p {
  color: #7b7a7a;
  height: 54px;
  overflow: hidden;
  line-height: 18px;
  margin-top: 12px;
}
.news dd .more {
  color: #ce434a;
  font-size: 13px;
  font-family: arial;
  display: block;
  margin-top: 12px;
}
.news dt {
  width: 238px;
  float: left;
  position: relative;
  margin-left: 20px;
}
.news dt img {
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
  padding-bottom: 0%;
}
.news dt a {
  display: block;
  background: url(../images/news_hover.png) no-repeat;
  width: 0px;
  height: 0px;
  position: absolute;
  bottom: 0;
  right: 0;
  opacity: 0;
  filter: alpha(opacity=0);
}
.news em {
  display: inline-block;
  position: absolute;
  top: 0;
  right: -3px;
  background: url(../images/news_icon5.jpg) no-repeat;
  width: 44px;
  height: 11px;
}
.news .news-more {
  background: #1a508e;
  border-bottom: solid 5px #0d407c;
  color: #fff;
  width: 164px;
  height: 42px;
  line-height: 42px;
  text-align: center;
  display: inline-block;
  font-size: 14px;
}
/*优秀团队 */
.column-4 {
  background: #efefef;
  height: 550px;
  margin-top: 50px;
}
.column-4 .team-slick {
  margin-top: 40px;
}
.column-4 .team-img {
  background: #fff;
  width: 274px;
  height: 330px;
  padding: 7px;
  margin-right: 60px;
  float: left;
}
.column-4 i {
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
  padding-bottom: 100%;
}
.column-4 p {
  height: 60px;
  line-height: 60px;
  overflow: hidden;
  text-align: center;
}
/*联系我们-------------------------------------- */
.content-left {
  width: 370px;
  float: left;
  line-height: 30px;
}
.content-message {
  width: 724px;
  float: right;
}
.content-message li {
  padding-top: 10px;
  overflow: hidden;
}
.content-message li p {
  float: left;
  margin-left: 10px;
}
.content-message li p:first-child {
  margin-left: 0;
}
.content-message li input {
  border: solid 1px #b2b2b2;
  height: 33px;
  line-height: 33px;
  width: 220px;
  text-indent: 9px;
}
.content-message li input[type="button"] {
  width: 142px;
  height: 35px;
  background: #1a508e;
  color: #fff;
  font-weight: normal;
  border: 0;
  float: right;
}
.content-message em {
  font-style: normal;
  color: #f30;
  padding-left: 7px;
}
/*
	--------------------------------------------
	公共样式 (如： 头部，底部，内页banner ... )
	--------------------------------------------
*/
.font13 {
  font-size: 13px;
}
.font14 {
  font-size: 14px;
}
.waper {
  width: 1200px;
  margin: 0 auto;
}
.paT40 {
  padding-top: 40px;
}
/*头部-------------------------------------- */
.header {
  margin-bottom: 10px;
}
.header .top {
  background: #1a508e;
  height: 37px;
  line-height: 37px;
  border-bottom: solid 1px #173251;
  color: #7088af;
}
.header .top a {
  color: #a8b5cc;
  padding: 0 9px;
}
.header .top a:hover {
  color: #fff;
}
.header .top input {
  border: solid 1px #5f85b0;
  height: 17px;
  line-height: 17px;
  background: #1a508e;
  border-right: 0;
  text-indent: 7px;
  color: #7088af;
  vertical-align: top;
  margin-top: 9px;
}
.header .top input[type="button"] {
  background: url(../images/search_btn.png) no-repeat;
  width: 18px;
  height: 19px;
  border: 0;
}
.header .logo {
  margin-top: 10px;
}
/*导航-------------------------------------- */
.nav {
  float: right;
}
.nav li {
  float: left;
  font-size: 15px;
  line-height: 40px;
  margin-top: 40px;
  position: relative;
  z-index: 99;
  padding-bottom: 2px;
}
.nav li > a {
  font-weight: bold;
  color: #2e2e2e;
  margin-left: 65px;
  line-height: 30px;
  display: block;
}
.nav > ul > li > a:hover,
.nav > ul > li:hover > a,
.nav > ul > li.active > a {
  border-bottom: solid 3px #1b4f8b;
  color: #1b4f8b;
}
.nav > ul > li > div {
  position: absolute;
  left: 40px;
  top: 34px;
  background: url(../images/white.png) repeat;
  width: 120px;
  padding: 25px 0 10px 0;
  display: none;
}
.nav > ul > li > div > a {
  height: 30px;
  line-height: 30px;
  overflow: hidden;
  font-size: 14px;
}
.nav > ul > li > div > a {
  display: block;
  padding-left: 25px;
  background: url(../images/nav_icon.png) no-repeat 13px 13px;
}
.nav > ul > li > ul > li > a:hover {
  font-weight: bold;
  color: #fff;
  background: url(../images/nav_icon2.png) no-repeat 13px 13px #1a508e;
}
.subnav {
  float: right;
}
.subnav li {
  float: left;
  width: 94px;
  text-align: center;
  font-size: 15px;
  color: #2e2e2e;
  height: 100px;
  margin-left: 70px;
}
.subnav li a {
  color: #2e2e2e;
  font-weight: bold;
  display: block;
  line-height: 100px;
}
.subnav li a:hover {
  background: url(../images/subnav_hover.jpg);
  color: #fff;
}
.subnav .cur {
  background: url(../images/subnav_hover.jpg);
  color: #fff;
}
/*底部------------------------------------- */
.footer {
  margin-top: 50px;
}
.footer li {
  margin-left: 32px;
  float: left;
  font-size: 14px;
  line-height: 24px;
}
.footer li h3 {
  font-weight: normal;
  font-size: 16px;
  border-bottom: solid 1px #d1d1d1;
  width: 214px;
  margin-bottom: 20px;
  padding-bottom: 12px;
}
.footer li h3 a {
  color: #333;
}
.footer li a {
  display: block;
  padding-left: 10px;
}
.footer li:first-child {
  margin-left: 0;
}
.footer-copy {
  background: #040e29;
  color: #fff;
  padding: 20px 0 30px 0;
  overflow: hidden;
  font-size: 14px;
  line-height: 24px;
}
.footer-copy a {
  color: #fff;
}
.footer-copy img {
  vertical-align: middle;
  margin-left: 20px;
}
.footer-copy p:first-child {
  padding-bottom: 6px;
}
/*
	--------------------------------------------
	公共组件 (如：面包屑导航，按钮，标题 ... )
	--------------------------------------------
*/
.title {
  text-align: center;
  margin: 50px 0;
  background: url(../images/line.jpg) no-repeat center bottom;
}
.gtitle {
  border-bottom: solid 1px #e8e8e8;
  height: 36px;
  line-height: 36px;
  font-size: 13px;
}
.gtitle p {
    height: 33px;
    overflow: hidden;
    padding-left: 15px;
}
.gtitle span {
  color: #1b4f8b;
}
.gline {
  border-left: solid 1px #e8e8e8;
  height: 36px;
}
.gtitle-2 {
  background: url(../images/line.png) no-repeat center bottom;
  text-align: center;
  margin-bottom: 45px;
}
.gtitle-2 h3 {
  text-transform: uppercase;
  font-size: 29px;
  font-weight: normal;
  font-family: arial;
}
.gtitle-2 p {
  font-size: 18px;
  padding-bottom: 15px;
}
.gtitle-3 {
  background: url(../images/servise_title.png) no-repeat center bottom;
  text-align: center;
  margin-bottom: 45px;
  padding-top: 40px;
  color: #fff;
}
.gtitle-3 h3 {
  text-transform: uppercase;
  font-size: 29px;
  font-weight: normal;
  font-family: arial;
}
.gtitle-3 p {
  font-size: 18px;
  padding-bottom: 15px;
}
/*
	--------------------------------------------
	栏目样式 (如：关于我们，产品，新闻 ... )
	--------------------------------------------
*/
.sider-content {
  line-height: 24px;
  padding-top: 50px;
}
.sider-nav {
  text-align: center;
  font-size: 14px;
}
.sider-nav li {
  display: inline-block;
  width: 83px;
  height: 30px;
  text-align: center;
  color: #848484;
  margin-left: 20px;
  cursor: pointer;
  overflow: hidden;
}
.sider-nav li a {
  display: block;
  border: solid 1px #b8b8b8;
  height: 28px;
  line-height: 28px;
}
.sider-nav li a:hover,
.sider-nav li.select > a {
  color: #fff;
  background: #1a508e;
  border: solid 1px #1a508e;
}
/*
    --------------------------------------------
   资质荣誉
    --------------------------------------------
*/
.honer ul {
  width: 1270px;
}
.honer li {
  float: left;
  position: relative;
  width: 266px;
  height: 263px;
  margin-right: 45px;
}
.honer li div {
  position: relative;
  width: 247px;
  height: 170px;
  border: solid 1px #ccc;
  padding: 6px;
}
.honer li p {
  text-align: center;
  height: 30px;
  line-height: 30px;
  overflow: hidden;
  margin-top: 10px;
}
.honer li span {
  position: absolute;
  left: 5px;
  top: 5px;
  background: url(../images/honer_hover.png) no-repeat;
  display: block;
  width: 247px;
  height: 170px;
  opacity: 0;
  filter: alpha(opacity=0);
}
.honer li span a {
  display: block;
  width: 247px;
  height: 170px;
}
.honer li:hover span {
  opacity: 1;
  filter: alpha(opacity=100);
}
/*
    --------------------------------------------
   新闻中心
    --------------------------------------------
*/
.newlist {
  font-size: 14px;
}
.newlist li:first-child {
  margin-top: 0;
}
.newlist li {
  height: 96px;
  padding: 0 3px;
  margin-top: 30px;
}
.newlist li:hover {
  background: #f8f8f8;
}
.newlist li:hover h3 a {
  color: #1b4f8b;
}
.newlist li h3 {
  height: 36px;
  line-height: 36px;
  overflow: hidden;
  font-size: 14px;
  border-bottom: solid 2px #c2c2c5;
}
.newlist li h3 span {
  font-weight: normal;
  float: right;
  color: #999;
  font-size: 12px;
}
.newlist li p {
  line-height: 22px;
  height: 44px;
  overflow: hidden;
  margin-top: 6px;
  color: #909090;
}
.news-title {
  text-align: center;
  font-size: 22px;
  color: #333;
  font-weight: normal;
}
.news-info {
  color: #ababab;
  border-bottom: dotted 1px #bfbebe;
  padding: 20px;
  overflow: hidden;
  text-align: center;
}
.news-page {
  border-top: solid 1px #e0e0e0;
  padding-top: 20px;
  margin-top: 40px;
}
.news-page li {
  margin-top: 7px;
  height: 32px;
  line-height: 32px;
}
.news-page li a {
  width: 800px;

  line-height:32px;

}
.news-page li a:hover {
color:#1b4f8b
}
.news-page li span {
  display: inline-block;
  width: 88px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  color: #fff;
  background: #b7b7b7;
  margin-right: 13px;
  float:left;
}
.news-page li .active {
  background: #ce434a;
}
.news-show {
  border-bottom: solid 1px #ccc;
  font-size: 14px;
  color: #1b4f8b;
  padding-bottom: 20px;
  margin-top: 40px;
}
.news-show-list {
  padding: 20px 0;
  background: #f8f8f8;
  overflow: hidden;
}
.news-show-list li {
  height: 40px;
  line-height: 40px;
  overflow: hidden;
  padding: 0 10px;
  float: left;
  width: 500px;
  margin: 0 25px;
}
.news-show-list li a {
  display: inline-block;
  height: 40px;
  line-height: 40px;
  overflow: hidden;
  width: 350px;
  background: url(../images/icon_11.png) no-repeat left 17px;
  text-indent: 20px;
}
.news-show-list li span {
  float: right;
  font-family: arial;
  color: #999;
  font-size: 12px;
}
.news-show-list2 {
  padding: 20px 0;
  background: #f8f8f8;
  overflow: hidden;
}
.news-show-list2 li {
  height: 40px;
  line-height: 40px;
  overflow: hidden;
  padding: 0 10px;
  float: left;
  width: 370px;
  margin: 0 10px;
}
.news-show-list2 li a {
  display: inline-block;
  height: 40px;
  line-height: 40px;
  overflow: hidden;
  width: 270px;
  background: url(../images/icon_11.png) no-repeat left 17px;
  text-indent: 20px;
}
.news-show-list2 li span {
  float: right;
  font-family: arial;
  color: #999;
  font-size: 12px;
}
.return_a {
  padding-top: 40px;
  text-align: right;
}
.return_a a {
  display: inline-block;
  background: #1a508e;
  color: #fff;
  border: 1px solid #134279;
  padding: 0px 20px;
  height: 28px;
  line-height: 28px;
}
/*
    --------------------------------------------
   我们的服务
    --------------------------------------------
*/
.servise-text {
  background: url(../images/servise_icon.jpg) no-repeat left center;
  text-indent: 20px;
}
.servise-line {
  height: 50px;
  border-bottom: solid 1px #e5e5e5;
}
.servise-title {
  text-align: center;
  text-transform: uppercase;
  font-size: 18px;
  margin-top: 40px;
}
.servise-title h3 {
  font-weight: normal;
  color: #333;
}
.servise-title span {
  font-family: arial;
}
.servise-title em {
  font-style: normal;
  color: #ccc;
  font-size: 10px;
}
/*
    --------------------------------------------
   相关团队
    --------------------------------------------
*/
.team-list {
  padding-top: 40px;
  width: 1000px;
  margin: 0 auto;
}
.team-list ul {
  width: 1064px;
}
.team-list li {
  background: #ebebeb;
  width: 274px;
  height: 330px;
  padding: 7px;
  margin-right: 60px;
  float: left;
}
.team-list i {
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
  padding-bottom: 100%;
}
.team-list p {
  height: 60px;
  line-height: 60px;
  overflow: hidden;
  text-align: center;
}
/*
    --------------------------------------------
   相关案例
    --------------------------------------------
*/
.case-list {
  width: 1000px;
  margin: 0 auto;
}
.case-list ul {
  width: 1020px;
}
.case-list li {
  float: left;
  width: 326px;
  height: 258px;
  margin-top: 40px;
  margin-right: 10px;
}
.case-list li i {
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
  padding-bottom: 55%;
}
.case-list li div {
  background: #fafafa;
  padding: 0 9px;
  height: 77px;
  padding-top: 6px;
}
.case-list li div h3 {
  font-weight: normal;
  border-bottom: solid 1px #dcdcdc;
  height: 36px;
  line-height: 36px;
}
.case-list li div p {
  height: 38px;
  line-height: 38px;
}
.case-list li div p a {
  color: #999;
  display: inline-block;
  background: url(../images/service_icon3.png) no-repeat left center;
  text-indent: 15px;
}
.case-list li:hover div {
  background: #1a508e;
  color: #fff;
}
.case-list li:hover div h3 > a {
  color: #fff;
}
.case-list li:hover div p > a {
  background: url(../images/service_icon2.png) no-repeat left center;
  color: #fff;
}
.case-list-2 ul {
  width: 1220px;
}
.case-list-2 li {
  float: left;
  width: 273px;
  height: 360px;
  margin-top: 40px;
  margin-right: 20px;
  overflow: hidden;
}
.case-list-2 li i {
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
  padding-bottom: 100%;
}
.case-list-2 li div {
  background: #fafafa;
  padding: 0 9px;
  height: 77px;
  padding-top: 6px;
}
.case-list-2 li div h3 {
  font-weight: normal;
  border-bottom: solid 1px #dcdcdc;
  height: 36px;
  line-height: 36px;
  overflow: hidden;
}
.case-list-2 li div p {
  height: 38px;
  line-height: 38px;
  text-indent: 15px;
}
.case-list-2 li:hover div {
  background: #1a508e;
  color: #fff;
}
.case-list-2 li:hover div h3 > a {
  color: #fff;
}
.case-list-2 li:hover div p > a {
  background: url(../images/service_icon2.png) no-repeat left center;
  color: #fff;
}
/*
    --------------------------------------------
   优秀团队
    --------------------------------------------
*/
.team-coulmn {
  background: url(../images/bg_3.jpg) no-repeat top center;
  min-height: 579px;
  overflow: hidden;
  margin-top: 50px;
}
.team-list-2 ul {
  width: 1220px;
}
.team-list-2 li {
  background: #fff;
  width: 274px;
  height: 330px;
  padding: 6px;
  margin-right: 15px;
  float: left;
  border: solid 1px #ccc;
  margin-top: 50px;
  margin-bottom: 60px;
}
.team-list-2 i {
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
  padding-bottom: 100%;
}
.team-list-2 p {
  height: 60px;
  line-height: 60px;
  overflow: hidden;
  text-align: center;
}
.team-show {
  text-align: center;
}
.team-show h1 {
  padding-bottom: 30px;
}
.team-show div {
  background: url(../images/case_line.jpg) no-repeat center bottom;
  padding-bottom: 30px;
}
.servise-list {
  width: 1000px;
  margin: 0 auto;
  margin-top: 40px;
}
.servise-list p {
  height: 33px;
  line-height: 33px;
  text-align: center;
  background: #efefef;
}
.servise-list a {
  display: inline-block;
}
.servise-list img {
  vertical-align: middle;
  padding-right: 10px;
}
.return {
  display: inline-block;
  color: #fff;
  width: 136px;
  height: 27px;
  text-align: center;
  background: #1a508e;
  border: solid 1px #134279;
  line-height: 27px;
  font-size: 14px;
}
.contact-title {
  color: #333;
  font-size: 22px;
  padding-bottom: 10px;
}
.contact-cot {
  margin-top: 40px;
  font-family: arial;
}
.contact-cot li {
  border: solid 1px #ccc;
  width: 388px;
  min-height: 323px;
  overflow: hidden;
  float: left;
  line-height: 28px;
  margin-left: 15px;
}
.contact-cot li .tit {
  background: #1b4f8b;
  color: #fff;
  font-size: 32px;
  text-align: center;
  height: 90px;
  padding-top: 40px;
  text-transform: uppercase;
}
.contact-cot li:first-child {
  margin-left: 0;
}
.contact-address {
  overflow: hidden;
  margin-top: 30px;
}
.contact-address ul {
  width: 1230px;
}
.contact-address li {
  border-bottom: solid 1px #dadada;
  height: 46px;
  line-height: 46px;
  font-family: arial;
}
.contact-address li:first-child {
  background: #1b4f8b;
  font-weight: bold;
  color: #fff;
  font-size: 16px;
}
.contact-address p {
  float: left;
  border-right: solid 1px #dadada;
  padding-left: 50px;
}
.contact-address .add-1 {
  width: 150px;
}
.contact-address .add-2 {
  width: 340px;
}
.contact-address .add-3 {
  width: 570px;
}
.job-cot {
  margin-top: 40px;
  font-family: arial;
}
.job-cot li {
  border: solid 1px #e6e6e6;
  width: 386px;
  min-height: 400px;
  overflow: hidden;
  float: left;
  margin-left: 15px;
  padding-bottom: 24px;
  color: #767676;
}
.job-cot li span {
  position: relative;
  width: 386px;
  height: 173px;
  display: block;
}
.job-cot li div {
  padding: 0 20px;
}
.job-cot li .tit {
  font-size: 16px;
  color: #1a508e;
  overflow: hidden;
  padding: 25px 0 10px 0;
}
.job-cot li:first-child {
  margin-left: 0;
}
.problem {
  margin-top: 50px;
}
.problem li:first-child {
  background: #1b4f8b;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
}
.problem li {
  border-bottom: solid 1px #e8e8e8;
  background: #fff;
  font-size: 13px;
  cursor: pointer;
  background: url(../images/job_icon.png) no-repeat center right;
  padding: 10px 0;
}
.problem li:hover {
  background: url(../images/job_icon2.jpg) no-repeat center right;
}
.problem li p {
  padding: 0px 18px;
}
.problem li.active {
  background: url(../images/job_icon2.jpg) no-repeat right 10px;
  border-bottom: solid 1px #e8e8e8;
}
.problem li.active .job-2 {
  color: #ce434a;
  font-weight: bold;
}
.problem li > div {
  display: none;
  color: #626262;
  padding: 20px 0px;
  line-height: 30px;
  font-size: 13px;
}
.problem li .job-1 {
  width: 360px;
  float: left;
}
.problem li .job-2 {
  color: #333;
}
.page {
  text-align: center;
  margin-top: 40px;
}
.page a {
  display: inline-block;
  border: solid 1px #d9d9d9;
  border-radius: 2px;
  padding: 0 26px;
  height: 38px;
  line-height: 38px;
  margin-left: 3px;
  font-family: arial;
}
.page span {
  display: inline-block;
  border: solid 1px #d9d9d9;
  border-radius: 2px;
  padding: 0 26px;
  height: 38px;
  line-height: 38px;
  margin-left: 3px;
  font-family: arial;
}
.page a:hover,
.page #prve {
  color: #fff;
  background: #616161;
  border: solid 1px #616161;
}
/*
    --------------------------------------------
   案例展示详细页
    --------------------------------------------
*/
.caseshow {
  width: 1000px;
  margin: 0 auto;
}
.caseshow .return_a {
  padding-top: 40px;
  text-align: center;
}
.caseshow .return_a a {
  display: inline-block;
  background: #1a508e;
  color: #fff;
  border: 1px solid #134279;
  padding: 0px 20px;
  height: 28px;
  line-height: 28px;
}
.caseshow-img {
  height: 570px;
}
.caseshow-img .ul-img {
  float: left;
  width: 799px;
  height: 527PX;
  position: relative;
}
.caseshow-img .ul-img li {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 527px;
}
.caseshow-img .ul-img li span {
  width: 100%;
  display: block;
  height: 527px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
}
.caseshow-img .ul-img li p {
  margin-top: -60px;
  height: 60px;
  line-height: 60px;
  background: url(../images/caseshow_p.png);
  color: #fff;
  font-size: 24px;
  padding: 0px 22px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.caseshow-img .ul-img li:first-child {
  display: block;
}
.caseshow-img .ul-bt {
  float: right;
  width: 197px;
}
.caseshow-img .ul-bt li {
  width: 197px;
  height: 130px;
  margin-bottom: 2px;
  position: relative;
  cursor: pointer;
}
.caseshow-img .ul-bt li span {
  width: 100%;
  display: block;
  height: 130px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
}
.caseshow-img .ul-bt li b {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: url(../images/caseshow_bt_bg.png) no-repeat;
}
.caseshow-img .ul-bt li.cur b {
  display: block;
}
.caseshow-table td {
  padding: 10px 20px;
  line-height: 18px;
}
.caseshow-table .titt {
  font-size: 15px;
  color: #333333;
  font-weight: bold;
}
/*
    --------------------------------------------
   发展历程
    --------------------------------------------
*/
.fzlc_bg {
  width: 608px;
  margin: 0 auto;
  padding: 50px 0px 80px;
  position: relative;
}
.fzlc_bg .spant {
  position: absolute;
  top: 0px;
  left: 290px;
  display: block;
  background: #fff;
  width: 20px;
  height: 78px;
}
.fzlc_bg .spanb {
  position: absolute;
  bottom: 0px;
  left: 295px;
  display: block;
  background: #fff;
  width: 20px;
  height: 277px;
}
.fzlc-ul {
  width: 100%;
  background: url(../images/fzlc_ul.png) repeat-y top center;
}
.fzlc-ul li {
  float: left;
  margin-top: 66px;
  width: 253px;
  height: 241px;
  padding-right: 14px;
  text-align: right;
  background: url(../images/fzlc_li.png) no-repeat;
}
.fzlc-ul li p {
  padding-right: 18px;
  height: 30px;
  line-height: 30px;
}
.fzlc-ul li .p1 {
  padding-top: 14px;
  font-size: 18px;
  color: #1a508e;
  font-weight: bold;
}
.fzlc-ul li .p2 {
  font-size: 14px;
}
.fzlc-ul li span {
  margin: 10px auto 0px;
  width: 249px;
  display: block;
  padding-bottom: 155px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
}
.fzlc-ul .li2 {
  float: right;
  padding-right: 0px;
  padding-left: 14px;
  text-align: left;
  background: url(../images/fzlc_li2.png) no-repeat;
}
.fzlc-ul .li2 p {
  padding-right: 0px;
  padding-left: 18px;
}
.form-box {
  border: 1px solid #e6e6e6;
  width: 840px;
  padding: 50px 50px 25px 50px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
}
.form-box li {
  margin-bottom: 25px;
}
.form-box p {
  margin-bottom: 12px;
}
.form-box select,
.form-box textarea,
.form-box input[type='email'],
.form-box input[type='text'] {
  border: 1px solid #e6e6e6;
  padding: 10px 0;
  width: 100%;
  max-width: 100%;
}
.form-box textarea {

  font-family: "Microsoft YaHei";
    font-size: 12px;
    font-weight: 500;
    height: 388px;
}
.form-box span {
  color: #f30;
}
.form-conroller {
  width: 940px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20px;
  text-align: right;
}
.form-conroller input[type='button'],
.form-conroller input[type='button'] {
  margin-left: 10px;
  padding: 10px 70px;
  color: #fff;
  border: 0;
  font-weight: 600;
}
#map {
  display: none;
}
/*美容用品 */
.pro-nav {
  width: 250px;
  float: left;
  border: solid 1px #bfbfbf;
  padding: 15px;
}
.pro-nav-tit {
  font-size: 24px;
  color: #3e342f;
  line-height: 30px;
  background: url(../images/sa-img1.png) no-repeat center bottom;
  padding-bottom: 44px;
  text-align: center;
  padding-top: 15px;
}
.pro-nav #inlnav {
  margin-top: 21px;
}
.pro-nav #inlnav li {
  border-top: solid 1px #e2e2e2;
  font: normal 14px/49px "微软雅黑";
  background: url(../images/snav.jpg) no-repeat;
}
.pro-nav #inlnav li:first-child {
  border-top: 0;
}
.pro-nav #inlnav li > a {
  height: 49px;
  line-height: 49px;
  cursor: pointer;
  display: block;
  overflow: hidden;
  padding-left: 25px;
}
.pro-nav #inlnav li:hover > a,
#inlnav li.curr > a {
  font-weight: bold;
  height: 49px;
  background: url(../images/snavhover.jpg) no-repeat;
  color: #666;
}
.pro-nav #inlnav li > div {
  width: 250px;
  display: none;
  background: #f7f7f7;
}
.pro-nav #inlnav li > div a {
  height: 49px;
  line-height: 49px;
  color: #939393;
  display: block;
  overflow: hidden;
  border-top: solid 1px #e2e2e2;
  padding-left: 60px;
}
.pro-nav #inlnav li > div i {
  font-style: normal;
  font-family: "宋体";
  font-size: 14px;
  padding-right: 5px;
}
.pro-nav #inlnav li > div a:hover,
#inlnav li > div a.curr {
  color: #1b4f8b;
}
.pro-list {
  width: 891px;
  margin-top: 0px;
}
.pro-list li {
  float: left;
  width: 274px;
  height: 332px;
  border: solid 1px #ccc;
  padding: 3px;
  margin-left: 15px;
  margin-top: 30px;
}
.pro-list li i {
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
  padding-bottom: 100%;
}
.pro-list li p {
  height: 60px;
  line-height: 60px;
  overflow: hidden;
  text-align: center;
  font-size: 14px;
  background: #f8f8f8;
  margin-top: 1px;
}
.pro-show {
  width: 891px;
  float: right;
  margin-top: 0px;
}
.proshow-list ul {
  width: 910px;
}
.proshow-list li {
  float: left;
  width: 190px;
  height: 220px;
  border: solid 1px #ccc;
  padding: 3px;
  margin-right: 22px;
  margin-top: 30px;
}
.proshow-list li i {
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-behavior: url(css/backgroundsize.min.htc);
  behavior: url(css/backgroundsize.min.htc);
  padding-bottom: 100%;
}
.proshow-list li p {
  height: 30px;
  line-height: 30px;
  overflow: hidden;
  text-align: center;
  font-size: 14px;
  background: #f8f8f8;
  margin-top: 1px;
}
/* 网站地图------------------------ */
.maplist ul {
  width: 1240px;
}
.maplist li {
  width: 236px;
  display: inline-block;
  margin-right: 70px;
  vertical-align: top;
  padding-top: 30px;
  line-height: 28px;
}
.maplist li h3 {
  font-size: 14px;
  border-bottom: solid 2px #e5e5e5;
  height: 40px;
  line-height: 40px;
  overflow: hidden;
  margin-bottom: 5px;
}
.maplist li h3 a {
  color: #1b4f8b;
}
.maplist li p {
  height: 28px;
  line-height: 28px;
  overflow: hidden;
}
.maplist li p a {
  color: #999;
}
.maplist li p a:hover {
  color: #71558d;
}
/*# sourceMappingURL=public.css.map */
