@charset "utf-8";
/* CSS Document */

/**生长历程**/
#about-4 #history {height:486px;overflow:hidden;}
#about-4 #history .viewport {position:relative;  margin:0 auto; width:1132px; height:100%; background:url(/kesion-ui/project/p_1_1.png) no-repeat 2px 20px; overflow:visible;}
#about-4 #history .viewport .btn {display:none; position:absolute; top:56%; z-index:2; margin-top:-22px; width:44px; height:44px; background:no-repeat 0 0;}
#about-4 #history .viewport .prev {left:-80px; background-image:url(/kesion-ui/project/btn_prev.png);}
#about-4 #history .viewport .next {right:-80px;background-image:url(/kesion-ui/project/btn_next.png);}
#about-4 #history .viewport .wrap {position:relative; left:0; top:0; z-index:1; width:100%; height:100%;}
#about-4 #history .viewport .wrap .item {position:absolute; bottom:-100%; width:283px; background:url(/kesion-ui/project/p_4_3.jpg) repeat-y 6px 0; -webkit-transition:bottom 500ms; transition:bottom 300ms;}
#about-4 #history .viewport .wrap .on {bottom:0;}
#about-4 #history .viewport .wrap .item div {padding:5px 16px 5px 29px ;background:url(/kesion-ui/project/p_4_2.png) no-repeat 0 0;}
#about-4 #history .viewport .wrap .item div p {margin-bottom:20px; line-height:18px; color:#3c5d38; font-size:13px; letter-spacing:1px;}
#about-4 #history .viewport .wrap .item div p.margin34{ margin-bottom:34px;}
#about-4 #history .viewport .wrap .item div .year {display:block; margin:-10px 0 30px 0; font-size:30px; color:#34772b;}
#about-4 .link {position:relative; z-index:2; padding:15px 0 20px 0; height:165px; background-color:#fff;}


.banner{ background:url(/kesion-ui/project/head_bg.jpg) no-repeat center center; height:703px}
.bigtitle{ text-align:center;}
.bigtitle img{ padding-top:120px;}
.indextit{ text-align:center; padding:0 0 50px 0;}
.indextit img{ width:230px;}
.tipone{ position:absolute; right:100px; top:50px;
animation:return1 4s both infinite;-moz-animation:return1 4s both infinite; /* Firefox */
-webkit-animation:return1 4s both infinite; /* Safari and Chrome */
-o-animation:return1 4s both infinite; /* Opera */}

@keyframes return1
{
0%   {top:50px;}
50%  {top:100px}
100% {top:50px;}
}

@-moz-keyframes return1 /* Firefox */
{
0%   {top:50px;}
50%  {top:100px}
100% {top:50px;}
}

@-webkit-keyframes return1 /* Safari and Chrome */
{
0%   {top:50px;}
50%  {top:100px}
100% {top:50px;}
}

@-o-keyframes return1 /* Opera */
{
0%   {top:50px;}
50%  {top:100px}
100% {top:50px;}
}








.tiptwo{ position:absolute; left:180px; top:115px;
animation:tiptwo 4s both infinite;-moz-animation:tiptwo 4s both infinite; /* Firefox */
-webkit-animation:tiptwo 4s both infinite; /* Safari and Chrome */
-o-animation:tiptwo 4s both infinite; /* Opera */}

@keyframes tiptwo
{
0%   {top:115px;}
50%  {top:60px}
100% {top:115px;}
}

@-moz-keyframes tiptwo /* Firefox */
{
0%   {top:115px;}
50%  {top:60px}
100% {top:115px;}
}

@-webkit-keyframes tiptwo /* Safari and Chrome */
{
0%   {top:115px;}
50%  {top:60px}
100% {top:115px;}
}

@-o-keyframes tiptwo /* Opera */
{
0%   {top:115px;}
50%  {top:60px}
100% {top:115px;}
}





.index1{ background:url(/kesion-ui/project/share_bg.jpg) no-repeat center top;}
.index1 .indexpic{ height:344px;}
.indexpic{ text-align:center;}
.indexpic .pic{ font-size:0; padding:10px 25px; border-radius:10px; display:inline-block; *display:inline; zoom:1;overflow:hidden;}
.indexpic .pic img{ width:480px; height:320px;}


.index2{ background:linear-gradient(to bottom, #66DD7F , #39CD6F)}


.index3{ background:url(data/kesion-ui/project/share_bg.jpg) no-repeat center top; position:relative}
.indexdevelop .item{ width:25%; float:left;}
.indexdevelop{ position:relative;}
.viewport{ overflow:hidden; color:#fff;}
.viewport .btn{ width:50px; height:50px; background:#000; position:absolute}
.viewport .prev{ top:30px; left:10px;}
.viewport .next{ top:30px; right:10px;}

.index4{ background:url(/kesion-ui/project/aqcs_bg.jpg) no-repeat center center; height:809px;}
.index4 .mainbox{ position:relative}
.index4 .part{ width:230px; height:230px; position:absolute; }
.index4 .part1{left:0; top:0;}
.index4 .part2{left:300px; top:85px;}
.index4 .part3{left:620px; top:25px;}
.index4 .part4{right:0; top:120px;}
.index4 .part5{left:450px; top:350px;}
.index4 .part6{ right:127px; top:360px;}
 
 
.picmate{animation:myweak 1s both;-moz-animation:myweak 1s both; /* Firefox */
-webkit-animation:myweak 1s both; /* Safari and Chrome */
-o-animation:myweak 1s both; /* Opera */
}
@keyframes myweak
{
0%   {opacity:0;}
100% {opacity:1;}
}

@-moz-keyframes myweak /* Firefox */
{
0%   {opacity:0;}
100% {opacity:1;}
}

@-webkit-keyframes myweak /* Safari and Chrome */
{
0%   {opacity:0;}
100% {opacity:1;}
}

@-o-keyframes myweak /* Opera */
{
0%   {opacity:0;}
100% {opacity:1;}
} 
 
 
.copyright{ background:#37CA71; text-align:right; padding-bottom:10px;}
.copyright p{ color:#fff; font-size:14px; padding-right:50px;}
 
@-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 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: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

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

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

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

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

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 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: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

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

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

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

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

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: .75s;
          animation-duration: .75s;
}
 
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }

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

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

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

.fadeInUp {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
}<!--耗时1782874990.8173秒-->