* {margin:0;padding:0;}
/*#banner {width:100%;margin-top:-4px;height:500px;}*/
body { font: 12px;font-family:"黑体"}



.clearfix:after{content:"";display:block;clear:both;}
.clearfix{zoom:1;}
.banner{width:510px; height:330px; position:relative; overflow:hidden;}
.banner-btn{ display:none;}

.banner-btn a{ display:block; line-height:40px; position:absolute;top:120px; width:40px; height:40px;overflow: hidden; z-index:4;}
.prevBtn{left:5px;}
.nextBtn{right:5px;}
.banner-img{ font-size:0; *word-spacing:-1px;/* IE6、7 */ letter-spacing: -3px; position:relative;}
.banner-img li{ display:inline-block;*display:inline;*zoom:1;/* IE6、7 */ vertical-align: top; letter-spacing: normal;word-spacing: normal; font-size:12px;}

@keyframes myfirst{
    0% {
        /*top:0;*/
 left:0;opacity:0;
    }
    100% {
    opacity:1;
    }

}
.banner-contents {width:1000px;height:500px;color:white;}
 .banner-contents .create  { opacity:0; opacity:1;  font-size:22px;position:absolute;top:100px;left:200px;animation:create 1s linear  1s 1 alternate;width:150px;}
 @keyframes create{
    0% {
     top:0;
     opacity:0;
    }
    100% {
    left:200px;
    opacity:1;
    }
}
 .banner-contents .improve  {opacity:0; opacity:1;font-size:28px;margin:10px 0 10px 0;position:absolute;top:120px;left:200px;animation:improve 1s linear  1s 1 alternate;}
  @keyframes improve{
    0% {
   left:500px; opacity:0;
    }
    100% {
   right:400px;  opacity:1;
    }
}
.banner-contents .save  {opacity:0; opacity:1;font-size:28px;position:absolute;top:170px;left:200px;animation:save 1s linear  1s 1 alternate;}
  @keyframes save{
    0% {
   top:500px; opacity:0;
    }
    100% {
   right:400px;  opacity:1;
    }
}
.banner-contents .customized{animation:customized 1s linear  1s 1 alternate;position:absolute;top:220px;left:200px;width:140px;height:40px;line-height:40px;text-align:center;background:#ff6a00;border-radius:20px;margin:15px 0 5px 0;font-size:15px;}
  @keyframes customized{
    0% {
   left:600px; opacity:0;
    }
    100% {
   bottom:10px;  opacity:1;
    }
}
#what {width:1100px;margin:10px auto;height:520px;overflow:hidden;}
h1 {margin:30px 0;}
i {font-size:20px;}
.contents {line-height:30px;margin:20px 0 10px 0;}
/*#what ul {width:1050px;text-align:center;}
#what ul li {float:left;width:350px;text-align:center;}
#what ul li img { margin-top:10px; }*/
h3 {margin:25px 0;}
/*#what ul li p {line-height:24px;}*/
#how {width:1100px;margin:20px auto;border-bottom:1px solid #808080;}
    /*#how .howcontent {margin:20px 0 10px 0;}*/
#why {width:1100px;margin:0 auto;border-bottom:1px solid #808080;}
    #why p {width:750px; /*border:1px solid red;*/ }
    #why .computer {/**//*position:relative;top:-410px;left:750px;display:block;*/ }

#pantner {width:100%;height:420px;background:#4db0e2;margin:30px auto;overflow:hidden;clear:both;position:relative;}
/*主要用来美化样式*/
.content{padding:0 5px;width:1100px;margin: auto;overflow:hidden;}
 #pantner .title {color:white;text-align:center;border:1px solid #4db0e2;}
#m_182 {overflow:hidden;width:1100px;}
#m_182 table tr td a {margin:0 5px;width:264px;display:block;height:264px;border-radius:5px;}
    #m_182 table tr td a img {border-radius:5px;}
#m_182 table tr td  a .hover{font-size:18px;border-radius:5px;width:264px;height:264px;background:rgba(0, 0, 0, 0.65);position:relative;left:0;top:-267px;display:block;color:White;}
#m_182 table tr td  a  .hover:hover{border-radius:5px;width:264px;height:264px;background:rgba(0, 0, 0, 0.00);position:relative;left:0;top:-267px;display:block;color:rgba(0, 0, 0, 0.00)}
    #m_182 table tr td a .hover p{padding:100px 0 0 0 ;}
   /*#m_182 table tr td a img {opacity:0.7;filter:alpha(opacity=70);}
        #m_182 table tr td a img:hover{opacity:1;filter:alpha(opacity=100);}*/
#video {width:1100px;height:330px;margin:0 auto;}
  .team {border:1px solid #808080 ;width:240px;height:330px;float:left;}
    .team ul li {line-height:65px;text-align:center;}
    .team ul li a{color:black;/*font-weight:bold;*/font-size:14px;}
.video {width:510px;height:330px;border:1px solid #808080;float:left;margin-left:50px;}
    .video img {
    margin-top:2px;border-radius:4px; }
 /*#mp4 {width:540px;height:260px;display:block;margin:10px 10px 0px 10px;}*/
.service {border:1px solid #808080 ;width:240px;height:330px;margin-left:855px;}
  .service ul li {line-height:65px;text-align:left;}
    .service ul li a{color:black;/*font-weight:bold;*/font-size:14px;margin-left:50px;}
#lines {margin:40px auto;width:100%;height:20px;}
    #lines img {width:100%;}
    /*我们是怎么做的*/
          #PerfectProject {width:1100px;height:340px;margin:0 auto;/*border:1px solid red;*/}
#ProjectTitle {width:1100px;height:48px;margin:0 auto;/*border:1px solid red;*/text-align:center;font-size:30px;}
#ProjectTitle p {height:48px;margin:0 auto;}
#ProjectTitle span {display:block;text-align:center;font-size:12px}
#PerfectProject ul{ margin:70px auto 0;}
#PerfectProject ul li {float:left;width:183.3px;text-align:center;margin:auto;}
#PerfectProject ul li a { width:205px;display:block;color:black;}
#PerfectProject ul li a span{ display:block;font-size:19px;}
#PerfectProject ul li a span span{ display:block;font-size:10px;/*border:1px solid green;*/}
#WhatUsIsDo,#NationalBrand {width:1100px;height:100px;margin:0 auto;/*border:1px solid red;*/text-align:center;font-size:30px;}
/*#WhatUsIsDo p,#WhatUsIsDo span {
position:relative;
animation:mymove 3s ease-out;
-webkit-animation:mymove 3s ease-out; }
@keyframes mymove
{
from {bottom:-50px;}
to {bottom:0px;}
}

@-webkit-keyframes mymove 
{
from {bottom:-50px;}
to {bottom:0px;}
}*/
#WhatUsIsDo span ,#NationalBrand span{ display:block;text-align:center;font-size:12px;/*border:1px solid green;*/padding:10px;line-height:20px;}
#what ul{margin:20px auto;width:1100px;height:520px;}
#what ul li {float:left;width:220px;height:430px;overflow:hidden;text-align:center;}
#what ul li  .do-img,#what ul li  .do-img1{width:205px;text-align:center;display:block;color:black;}
#what ul li a span{display:block;padding:5px 0;margin-top:20px; text-align:center;}
#what ul li .do-img1 { transform: rotateY(0);transition: all 0.50s ease-in-out 0s;margin-top:40px;}
#what ul li:hover .do-img1{transform: rotateY(-90deg);}
#what ul li .do-img { transform: rotateY(90deg);transition: all 0.50s ease-in-out 0s;position:relative;top:-260px;}
#what ul li:hover .do-img{transform: rotateY(0);}

#NationalBrand {
    border-bottom: 1px solid #808080;
}