@charset "utf-8";
/* 高端定制服务动画效果 */

/*从上往下*/
@-webkit-keyframes a1{
	0%{opacity: 0;transform:translate(0px,-1000px)}
	60%{opacity: 1;transform:translate(0px,0px)}
}

@-moz-keyframes a1{
	0%{opacity: 0;transform:translate(0px,-1000px)}
	60%{opacity: 1;transform:translate(0px,0px)}
}

@-o-keyframes a1{
	0%{opacity: 0;transform:translate(0px,-1000px)}
	60%{opacity: 1;transform:translate(0px,0px)}
}

@keyframes a1{
	0%{opacity: 0;transform:translate(0px,-1000px)}
	60%{opacity: 1;transform:translate(0px,0px)}
}

/*从右往左*/
@-webkit-keyframes a2{
	0%{opacity: 0;transform:translate(1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@-moz-keyframes a2{
	0%{opacity: 0;transform:translate(1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@-o-keyframes a2{
	0%{opacity: 0;transform:translate(1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@keyframes a2{
	0%{opacity: 0;transform:translate(1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}

/*从左往右*/
@-webkit-keyframes a3{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@-moz-keyframes a3{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@-o-keyframes a3{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@keyframes a3{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}

/*从下往上*/
@-webkit-keyframes a4{
	0%{opacity: 0;transform:translate(0px,1000px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@-moz-keyframes a4{
	0%{opacity: 0;transform:translate(0px,1000px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@-o-keyframes a4{
	0%{opacity: 0;transform:translate(0px,1000px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@keyframes a4{
	0%{opacity: 0;transform:translate(0px,1000px)}
	60%{opacity: 1;transform:translate(0,0)}
}

/*从左往右*/
@-webkit-keyframes a5{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@-moz-keyframes a5{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@-o-keyframes a5{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}
@keyframes a5{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	60%{opacity: 1;transform:translate(0,0)}
}

/*放大*/
@-webkit-keyframes a6{
	0%{opacity: 0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);}
	60%{opacity: 1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);}
	100%{opacity: 1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);}
}
@-moz-keyframes a6{
	0%{opacity: 0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);}
	60%{opacity: 1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);}
	100%{opacity: 1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);}
}
@-o-keyframes a6{
	0%{opacity: 0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);}
	60%{opacity: 1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);}
	100%{opacity: 1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);}
}
@keyframes a6{
	0%{opacity: 0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);}
	60%{opacity: 1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);}
	100%{opacity: 1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);}
}

/*左右*/
@-webkit-keyframes a7{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	25%{opacity: 1;transform:translate(0px,0px)}
	50%{opacity: 1;transform:translate(-50px,0px)}
	100%{opacity: 1;transform:translate(0px,0px)}
}
@-moz-keyframes a7{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	25%{opacity: 1;transform:translate(0px,0px)}
	50%{opacity: 1;transform:translate(-50px,0px)}
	100%{opacity: 1;transform:translate(0px,0px)}
}
@-o-keyframes a7{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	25%{opacity: 1;transform:translate(0px,0px)}
	50%{opacity: 1;transform:translate(-50px,0px)}
	100%{opacity: 1;transform:translate(0px,0px)}
}
@keyframes a7{
	0%{opacity: 0;transform:translate(-1000px,0px)}
	25%{opacity: 1;transform:translate(0px,0px)}
	50%{opacity: 1;transform:translate(-50px,0px)}
	100%{opacity: 1;transform:translate(0px,0px)}
}

/*右左*/
@-webkit-keyframes a11{
	0%{opacity: 0;transform:translate(200px,0px)}
	25%{opacity: 1;transform:translate(0px,0px)}
	50%{opacity: 1;transform:translate(50px,0px)}
	100%{opacity: 1;transform:translate(0px,0px)}
}
@-moz-keyframes a11{
	0%{opacity: 0;transform:translate(200px,0px)}
	25%{opacity: 1;transform:translate(0px,0px)}
	50%{opacity: 1;transform:translate(50px,0px)}
	100%{opacity: 1;transform:translate(0px,0px)}
}
@-o-keyframes a11{
	0%{opacity: 0;transform:translate(200px,0px)}
	25%{opacity: 1;transform:translate(0px,0px)}
	50%{opacity: 1;transform:translate(50px,0px)}
	100%{opacity: 1;transform:translate(0px,0px)}
}
@keyframes a11{
	0%{opacity: 0;transform:translate(200px,0px)}
	25%{opacity: 1;transform:translate(0px,0px)}
	50%{opacity: 1;transform:translate(50px,0px)}
	100%{opacity: 1;transform:translate(0px,0px)}
}



/*360度旋转*/
@-webkit-keyframes a8{
from{-webkit-transform:rotate(0deg)}
to{-webkit-transform:rotate(360deg)}
}

@-moz-keyframes a8{
from{-webkit-transform:rotate(0deg)}
to{-webkit-transform:rotate(360deg)}
}

@-ms-keyframes a8{
from{-webkit-transform:rotate(0deg)}
to{-webkit-transform:rotate(360deg)}
}

@keyframes a8{
from{-webkit-transform:rotate(0deg)}
to{-webkit-transform:rotate(360deg)}
}

/**/
@-webkit-keyframes a9{
	0%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(90deg);opacity: 0;}
	100%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(0);opacity: 1;}
}
@-moz-keyframes a9{
	0%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(90deg);opacity: 0;}
	100%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(0);opacity: 1;}
}
@-o-keyframes a9{
	0%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(90deg);opacity: 0;}
	100%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(0);opacity: 1;}
}
@keyframes a9{
	0%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(90deg);opacity: 0;}
	100%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(0);opacity: 1;}
}

/*显示*/
@-webkit-keyframes a10{
	0%{opacity: 0;}
	100%{opacity: 1;}
}




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

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

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




@-webkit-keyframes bounceInLeft {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  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);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes bounceInLeft {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  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);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

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

@-webkit-keyframes bounceInRight {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  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);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes bounceInRight {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  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);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

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



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

  50% {
    opacity: 1;
  }
}

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

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
}
@-webkit-keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

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

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

@-webkit-keyframes bounceInDown {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  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);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes bounceInDown {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  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);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

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

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

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

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

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}
.rollIn {
  -webkit-animation-name: rollIn;
          animation-name: rollIn;
}
/* 高度递增动画 */
.heightInc {
	animation-name: heightInc;
	-webkit-animation-name: heightInc;
	animation-duration:1s;
	-webkit-animation-duration:1s;
	animation-timing-function: ease;
	-webkit-animation-timing-function: ease;
}
@-webkit-keyframes heightInc{0%{height:0;}100%{height:100%;}}
@-moz-keyframes heightInc{0%{height:0;}100%{height:100%;}}
@keyframes heightInc{0%{height:0;}100%{height:100%;}}