.about-banner img{ width:100%; }

.about-nav { text-align: center; padding:20px 0;}
.about-nav li{ display: inline-block; padding:10px 20px; margin: 0 5px; border-radius: 2px; color:#fff; position: relative; cursor: pointer; background: #2b2b2b;}
.about-nav li.on{ background-color: #4884ff;}
.about-nav li.on::after{position: absolute; display: block; width: 0; height: 0; border-color: transparent; border-style: solid; bottom: -19px; left: 50%; margin-left: -10px; content: " "; border-top-color: #fff; border-bottom-width: 0; border-top-color: #4884ff; border-width: 10px;}

.about-box .head{ padding:50px 0; text-align: center;}
.about-box .head h3{ margin:20px 0; padding-bottom:20px; font-size: 28px; font-weight: bold; background:url(../img/common/h3_line.png) bottom center no-repeat;}
.about-box .head p{ font-size: 16px; line-height: 24px;}
.about-box .head img{ vertical-align: middle;}
.about-box .cont{ text-align: center;}
.what-cont{ position: relative;}
.what-cont .goto-trial{ position: absolute; bottom:80px; left: 30px;}
.what-cont .goto-trial .icon{ top:-1px; width:36px; height: 36px; background-size: 100%;}
.what-cont .goto-trial a.btn{ display:inline-block; height: 35px; line-height: 35px; padding:0 20px; border-radius: 2px; }

.dis-box{background:url(../img/common/dis_bg.png);}
.terminal-list li{ float: left; text-align: center; padding:0 70px; padding-bottom:30px;}
.terminal-list li .btn{ display:inline-block; height: 35px; line-height: 35px; border-radius: 2px; padding:0 20px; margin-top:50px;}
.terminal-list li h4{ font-size: 24px; margin:15px 0;}
.terminal-list li .des{ line-height: 24px; color:#666;}

.download-list{ text-align: center;}
.download-list li{ display:inline-block; padding:0 80px;}
.download-list li .btn{ display:inline-block; height: 35px; line-height: 35px; border-radius: 2px; padding:0 20px; margin-top:50px;}
.download-list li .icon{ width:20px; height: 20px; top:4px; background-size: auto 100%;}


.sys-tab{ text-align: center;}
.sys-tab li{ display: inline-block; padding:0 20px; font-size: 16px; cursor: pointer;}
.sys-tab li.on{ color:#666;}

.system-box{ position: relative; margin-top:80px;}
.system-box .head{ position: absolute; top:0; left: 50%; width:1000px; margin-left: -500px; z-index: 9999;}
.one-box{ padding-top:200px; background:url(../img/common/one_bg.jpg) top center no-repeat;}
.two-box{ padding-top:200px; background:url(../img/common/two_bg.jpg) top center no-repeat;}
.one-box,.two-box{height: 600px; overflow: hidden;}

.system-box .img{ width:760px;}
.system-box .img img{ width:760px;}
.system-box .list{ width:400px; padding-left: 40px; padding-top:60px; text-align: left;}
.system-box .list .pic{ width:100px; height: 100px; overflow: hidden;}
.system-box .list li{ height: 100px; padding:10px 0;}
.system-box .list .des{ width:270px; padding-left: 30px; padding-top:10px;}
.system-box .list .des h4{ font-size: 22px; line-height: 35px;}
.system-box .list .des h4.on{ color:#FF6600;}
.system-box .list .des p{ line-height: 20px; color:#666;}
.system-box .two-box .list{ padding:0 40px 0 0;}

.model-box{ background: url(../img/bg/img25.jpg) top center no-repeat fixed;}
.model-box .head{ color:#fff;}
.model-box .head p{ font-size: 20px;}
.model-box .list{ padding:40px; background-color: #fff;}
.model-box .list li{ float: left; width:250px; padding:20px 15px;}
.model-box .list li .img p{ height: 60px; line-height: 60px; font-weight: bold; text-align: center; border-bottom:2px solid #D2D2D2;}
.model-box .list li .des{ padding:10px 0;}
.model-box .list li .des span{ float: left; display:block; width:50%; height:25px; text-align: center;}
.model-box .list li .btn-box{ text-align: center; padding-top:10px;}
.model-box .list li .btn-box .btn{ display:inline-block; padding:0 20px; height: 35px; line-height: 35px; border-radius: 2px;}

.join-box{ padding:50px 0; text-align: center;}
.join-box .btn{ display:inline-block; margin-top:20px; padding:0 20px; height: 35px; line-height: 35px;}

.show-list{ position: relative; padding-bottom:40px;}
.show-list .hd a{ display: block; width:42px; height:80px; position: absolute; top:100px; z-index: 999; cursor: pointer;}
.show-list .hd a.next{ background-image: url(../img/icon/icon-next.png); right: 0;}
.show-list .hd a.prev{ background-image: url(../img/icon/icon-prev.png); left: 0;}
.show-list .bd{ width:610px; margin:0 auto;}
.show-list .bd li{ text-align: center; width:610px;}
.show-list .bd .img{ position: relative; display: inline-block; width:610px;}
.show-list .bd .img img{ width:610px;}
.show-list .bd .des{ position: absolute; left: 0; bottom:0; width:600px; padding:5px; min-height: 130px; color:#fff; background:#000; background:rgba(0, 0, 0, .7)}
.show-list .bd .des h4{ font-size: 24px; line-height: 60px;}
.show-list .bd .des p{ line-height: 20px;}

.safe-box{ padding-bottom:20px; background: url(../img/bg/img35.jpg) top center no-repeat;}
.safe-box .head h3{ padding:0; margin:0; font-weight: normal; background:none;}
.safe-box .list{ padding:40px; background:#fff;}
.safe-box .list li{ float: left; width:540px; padding:0 10px; margin-top:30px;}
.safe-box .list li h4{ font-size: 24px; text-align: center;}
.safe-box .list li h4 span{ display: inline-block; width:90px; height: 2px; background-color: #4884ff;}
.safe-box .list li h5{ font-size: 16px; margin:15px 0; text-align: center;}
.safe-box .list li p{ color:#666; line-height: 24px;}

.service-box{ background:#E5E5E5;}
.service-box .head h3{ padding:0; margin:0; font-weight: normal; background:none;}
.service-box .list{ width:1200px; height: 200px;}
.service-box .list ul{ width:1230px;}
.service-box .list li{ float: left; width:257px; height: 160px; padding:10px; margin-right: 30px; text-align: center; background-color: #F7F7F7; box-shadow: 3px 3px 8px #bbb; -webkit-box-shadow: 3px 3px 8px #bbb; -moz-box-shadow: 3px 3px 8px #bbb; -ms-box-shadow: 3px 3px 8px #bbb; -o-box-shadow: 3px 3px 8px #bbb;}
.service-box .list li h4{ font-size: 16px; line-height: 50px;}
.service-box .list li p{ line-height: 20px; color:#666;}

.add-box{ background:#E5E5E5;}
.add-box .head h3{ padding:0; margin:0; font-weight: normal; background:none;}
.add-box .list{width:1200px; height: 200px; }
.add-box .list ul{ width:1230px;}
.add-box .list li{ float: left; width:320px; height: 60px; padding:30px; margin-right: 30px; background-color: #F7F7F7; box-shadow: 3px 3px 8px #bbb; -webkit-box-shadow: 3px 3px 8px #bbb; -moz-box-shadow: 3px 3px 8px #bbb; -ms-box-shadow: 3px 3px 8px #bbb; -o-box-shadow: 3px 3px 8px #bbb;}
.add-box .list li .img{ width:80px; margin-right: 30px; text-align: center;}
.add-box .list li .img img{ margin-top:10px;}
.add-box .list li .des h4{ font-size: 22px;margin-bottom:10px;}
.add-box .list li .des p{ color:#666; line-height: 20px;}

.use-box{ height: 210px; margin-bottom:-20px; color:#fff; text-align: center; background:url(../img/bg/img36.png) top center no-repeat;}
.use-box h3{ font-size: 28px; padding:30px 0 20px 0; }
.use-box p{ font-size: 16px;}
.use-box .btn{ display: inline-block; padding:0 20px; height: 35px; line-height: 35px; margin-top:30px; font-size: 16px; font-weight: bold; color: #dd3829; background:#fff;}