.toppic {
    height: 100%;
    margin: 0 auto;
    width: 100%;
}
.toppic a:link, .toppic a:visited {
    color: #fff;
}
.topside {
    background: #40484a none repeat scroll 0 0;
    float: left;
    height: 88%;
    width: 100%;
}
.logoLink {
    background: transparent url("../images/logo.gif") no-repeat scroll left 0.4%;/*兼容不支持css3浏览器*/
    background: transparent url("../images/logo.gif") no-repeat scroll left 0.4% / 71.14% auto;
    display: block;
    float: left;
    font-size: 0;
    height: 0;
    margin-left: 9%;
    overflow: hidden;
    padding-top: 3.6%;
    width: 12.3%;
}
.topNav {
    padding-right: 12.2%;
    width: 65%;
}
.topNav li {
    float: right;
    margin-left: 8%;
}
.topNav li a {
    float: left;
    font-size: 1.1em;
    height: 100%;
    line-height: 3.9em;
    padding: 0 0.5em;
}
.topNav li a:hover {
    background: #ea5350 none repeat scroll 0 0;
}
.topNav li.current a {
    background: #ea5350 none repeat scroll 0 0;
}
.content {
    width: 100%;
}
.content h1 {
    background: #fff url("../images/brand.png") no-repeat scroll center center;
    background: #fff url("../images/brand.png") no-repeat scroll center center / 100% auto;
    height: 0;
    margin-bottom: -3%;
    margin-top: -4.4%;
    overflow: hidden;
    padding-top: 23%;
    width: 100%;
}
.activebg {
    background: #fff none no-repeat fixed center 0 ;
    background: #fff none no-repeat fixed center 0 / 100% auto;
    height: 600px;
    position: relative;
    width: 100%;
}
.fisrtbg {
    background-image: url("../images/office-620822.png");
    margin-top: -4.5%;
}
.secondbg {
    background-image: url("../images/avd.png");
    margin-top: -27.9%;
}
.thirdbg {
    background-image: url("../images/blog.png");
    margin-top: -7.9%;
}
.fourthbg {
    background-image: url("../images/fourthbg.png");
    height: 25%;
    margin-top: -8%;
}
.fifthbg {
    background-image: url("../images/fifthbg.png");
    margin-top: 3.2%;
}
.qfigure {
    background: #fff none repeat scroll 0 0;
    background: #fff none repeat scroll 0 0 / 100% auto;
    width: 100%;
     height: 600px;
}
.qw960 {
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 66%;
}
.qcallAnimate {
    background: transparent url("../images/iPhoneWhite.png") no-repeat scroll 0 0;
    background: transparent url("../images/iPhoneWhite.png") no-repeat scroll 0 0 / 100% auto;
    float:left;
    height: 100%;
    margin-left: -16%;
    margin-top: -28.6%;
    width: 48%;
}
.qcall .txtwrap {
    background: transparent url("../images/first.png") no-repeat scroll 0 0;
    background: transparent url("../images/first.png") no-repeat scroll 0 0 / 100% auto;
   /* float: right;*/
    height: 100%;
    margin-left: 41%;
    margin-top: 7%;
    width: 50%;
}
.qfile {
    height: 100%;
}
.qfileAnimate {
    background: transparent url("../images/pic2.png") no-repeat scroll 0 0;
    background: transparent url("../images/pic2.png") no-repeat scroll 0 0 / 100% auto;
    height: 100%;
    margin-left: 74%;
    margin-top:  6.4%;;
    width: 27%;
   /* float: right;*/
}
.qfile .txtwrap {
    background: transparent url("../images/second.png") no-repeat scroll 0 0 ;
    background: transparent url("../images/second.png") no-repeat scroll 0 0 / 92% auto;
    float: left;
    height: 100%;
    margin-left: -2.9%;
    margin-top: 10%;
    width: 63%;
}
.qfourthAnimate {
    background: transparent url("../images/pic4.png") no-repeat scroll 0 0;
    background: transparent url("../images/pic4.png") no-repeat scroll 0 0 / 100% auto;
    height: 160%;
    margin-left: 64%;
    margin-top: -16.6%;
    width: 49%;
}
.qfourth .txtwrap {
    background: transparent url("../images/fourth.png") no-repeat scroll 0 0;
    background: transparent url("../images/fourth.png") no-repeat scroll 0 0 / 86% auto;
    float: left;
    height: 100%;
    margin-left: -1.9%;
    margin-top: 29%;
    width: 70%;
}
.qblog {
    height: 100%;
}
.qblogAnimate {
    background: transparent url("../images/pic3.png") no-repeat scroll 0 0 ;
    background: transparent url("../images/pic3.png") no-repeat scroll 0 0 / 100% auto;
    float: left;
    height: 100%;
    margin-left: -20%;
    margin-top: -8.6%;
    width: 65%;
}
.qblog .txtwrap {
    background: transparent url("../images/third.png") no-repeat scroll 0 0;
    background: transparent url("../images/third.png") no-repeat scroll 0 0 / 100% auto;
    height: 100%;
    margin-left: 60%;
    margin-top: 13.6%;
    width: 56%;
}
.users {
    background: transparent url("../images/users.png") no-repeat scroll center center;
    background: transparent url("../images/users.png") no-repeat scroll center center / 100% auto;
    margin-top: -17.1%;
    width: 100%;
}
.qfifthAnimate {
    background: transparent url("../images/fifthPhone.png") no-repeat scroll 0 0;
    background: transparent url("../images/fifthPhone.png") no-repeat scroll 0 0 / 100% auto;
    float: left;
    height: 100%;
    margin-left: -19%;
    margin-top: -17.6%;
    width: 50%;
}
.qfifths .txtwrap {
     background: transparent url("../images/fifth.png") no-repeat scroll 0 0 ;
    background: transparent url("../images/fifth.png") no-repeat scroll 0 0 / 65% auto;
    float: right;
    height: 100%;
    margin-right: 3%;
    margin-top: 11%;
    width: 50%;
}

/*底部*/
.qfifth {
    width: 100%;
    background: -moz-linear-gradient(top, #fbfbfb 0%, #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#ffffff));
    background: -webkit-linear-gradient(top, #fbfbfb 0%,#ffffff 100%);
    background: -o-linear-gradient(top, #fbfbfb 0%,#ffffff 100%);
    background: -ms-linear-gradient(top, #fbfbfb 0%,#ffffff 100%);
    background: linear-gradient(to bottom, #fbfbfb 0%,#ffffff 100%);
    margin-top: -18.92%;
    display:inline-block;
}
.qfifthMain {
    height: 100%;
    text-align: center;
    width: 100%;
    padding-top: 5.1%;
}
.qfifthMain ul {
    height: auto;
    overflow: hidden;
    text-align: center;
    width: 100%;
}
.qfifthMain ul li {
    display: inline-block;
    margin: 0 6% 2.5%;
    vertical-align: middle;
}
.qfifthMain ul li img {
    display: block;
}
.qfifthMain .iphone_down {
    background: rgba(0, 0, 0, 0) url("../images/iphone_down.png") no-repeat scroll 30px 0;
    border: 2px solid #474747;
    border-radius: 45px;
    box-sizing: border-box;
    color: #474747;
    display: inline-block;
    font-size: 27px;
    height: 66px;
    margin-bottom: 25px;
    padding-left: 55px;
    padding-top: 10px;
    width: 256px;
}
.qfifthMain .android_down {
    background: rgba(0, 0, 0, 0) url("../images/android_down.png") no-repeat scroll 30px 0;
    border: 2px solid #474747;
    border-radius: 45px;
    box-sizing: border-box;
    color: #474747;
    display: inline-block;
    font-size: 27px;
    height: 66px;
    margin-bottom: 25px;
    padding-left: 55px;
    padding-top: 10px;
    width: 256px;
}
.qfifthMain .weibo {
    background: rgba(0, 0, 0, 0) url("../images/weibo_wechat.png") no-repeat scroll 0 3px;
    cursor: pointer;
    display: block;
    font-weight: bold;
    height: 40px;
    line-height: 40px;
    margin: 0 auto;
    padding-left: 55px;
    text-align: left;
    width: 126px;
}
.qfifthMain .wechat {
    background: rgba(0, 0, 0, 0) url("../images/weibo_wechat.png") no-repeat scroll 0 -40px;
    cursor: pointer;
    display: block;
    font-weight: bold;
    height: 40px;
    line-height: 40px;
    margin: 0 auto 25px;
    padding-left: 55px;
    text-align: left;
    width: 126px;
}

#footer {
    background: #fff none repeat scroll 0 0;
    height: auto;
    overflow: hidden;
    width: 100%;
}
#footer dt {
    color: #888888;
     font-size: 0.96em;
    font-weight: bold;
    letter-spacing: 0.02em;
    line-height: 4em;
    text-align: center;
    width: 100%;
    margin-top: 1.2%;
}
#footer dd {
    color: #525252;
    font-size: 0.96em;
    font-weight: bold;
    height: 30px;
    line-height: 30px;
    text-align: center;
    width: 100%;
}
.banner {
    overflow: auto;
    position: relative;
    width: 100%;
    height: auto;
}
.banner img {
    display: block;
    height: auto;
    overflow: hidden;
    width: 100%;
}
.banner li {
    list-style: outside none none;
}
.banner ul li {
    float: left;
}

.banner .dots {
     bottom: 20px;
    position: absolute;
    padding-left: 47%;

}
.banner .dots li 
{ 
    display: inline-block; 
    width: 10px; 
    height: 10px; 
    margin: 0 4px; 
    text-indent: -999em; 
    border: 2px solid #fff; 
    border-radius: 6px; 
    cursor: pointer; 
    opacity: .4; 
    -webkit-transition: background .5s, opacity .5s; 
    -moz-transition: background .5s, opacity .5s; 
    transition: background .5s, opacity .5s;
}
.banner .dots li.active 
{
    background: #fff;
    opacity: 1;
}