﻿@charset "utf-8";
.text-left{text-align: left;}
.text-right{text-align: right;}
.text-center{text-align: center;}
.text-over{text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.over{overflow: hidden;}
.relative{position: relative;z-index: 1;}
.absolute{position: absolute;z-index: 1;}
.fixed{position: fixed;z-index: 1;}
.inline{display: inline;}
.block{display: block;}
.inline-block{display: inline-block;}
.hide{display: none;}
.max-w100{max-width: 100%;}
.max-h100{max-height: 100%;}
.middle{vertical-align: middle;}
.middle-span{height: 100%;vertical-align: middle;display: inline-block;}
.trans{-webkit-transition:all 600ms ease 0s; -moz-transition:all 600ms ease 0s; -ms-transition:all 600ms ease 0s; -o-transition:all 600ms ease 0s; transition:all 600ms ease 0s;}
.clean:after,.clean:before{display: table; content:''; }
.clean:after{clear: both;}
.clean{zoom:1;}
.show1300{display: none;}
.show1200{display: none;}
.show992{display: none;}
.show640{display: none;}
.show320{display: none;}

.table{width: 100%;display: table;}
.table[height='100%']{height: 100%;}
.table-cell{display: table-cell;vertical-align: middle;}
.web-title{padding: 45px 0 40px;}
.web-title .title-0{font-size: 36px;color: #393939;}
.web-title .title-1{line-height: 30px;font-size: 18px;color: #393939;}
.web-title .line{width: 58px;height: 4px;background-color: #3b8cc4;margin: 20px auto 0;}

#banner{z-index: 2;}
#banner .bd{width: 100%;}
#banner .bar{width: 100%;height: 100%;left: 0;letter-spacing: -5px;}    /*letter-spacing: -5px;兼容Safari*/
#banner .bar *{letter-spacing: normal;}
#banner.slide .bar{-webkit-transition: all 800ms ease 0s;-moz-transition: all 800ms ease 0s;-o-transition: all 800ms ease 0s;transition: all 800ms ease 0s;}
#banner .item{width: 100%;height: 100%;background-repeat: no-repeat;background-position: center center;background-size: cover;position: relative;z-index: 1;display: inline-block;}
#banner .item a{width:100%; height:100%; left:0; top:0;}
#banner .item .font{width: 100%;left: 0;top: 53%/*44%*/;}
#banner .item .title-1{line-height: 18px;color: #fff;margin-top: 15px;}
#banner .hd{width: 100%;height: 0;left: 0;bottom: 40px;}
#banner .hd a{width: 20px;height: 20px;border-radius: 100%;margin: 0 5px;display: inline-block;cursor: pointer;-webkit-transition:all 300ms ease 0s; -moz-transition:all 300ms ease 0s; -ms-transition:all 300ms ease 0s; -o-transition:all 300ms ease 0s; transition:all 300ms ease 0s;}
.banner{z-index: 2;}
.banner .bd{width: 100%;}
.banner .hd{width: 100%;height: 0;left: 0;bottom: 65px;}
.banner .hd a{width: 24px;height: 24px;background-color: #fff;border-radius: 100%;margin: 0 10px;display: inline-block;cursor: pointer;}
.banner .hd .on{background-color: #0382db;}
.banner .bar{left: 0;}
.banner.slide .bar{-webkit-transition: all 300ms ease 0s;-moz-transition: all 300ms ease 0s;-o-transition: all 300ms ease 0s;transition: all 300ms ease 0s;}
.banner .item{width: 100%;display: inline-block;position: relative;z-index: 1;}

.about-description{width: 96%;max-width: 1400px;margin: 50px auto 90px;}
.about-description .iTitle{padding:0;}
.about-description .title-0{font-size: 40px;color: #3b8cc4; visibility:hidden;}
.about-description .title-0 span{height: 57px;font-family: Arial;font-size: 130px;color: #c6c6c6;margin: -95px 2% 0; visibility:hidden;}
.about-description .title-1{font-size: 24px;color: #3b8cc4;}
.about-description .description{line-height: 26px;font-size: 14px;color: #7e7e7e;margin: 45px 0 0; visibility:hidden;}

.about-video .item{width: 50%; visibility:hidden;cursor: pointer;}
.about-video .item a{width: 100%;height: 100%;left: 0;top: 0;z-index: 3;}
.about-video .item .title{width: 100%;color: #fff;left: 0;top: 20%;z-index: 2;padding-left: 135px;letter-spacing: 135px;text-transform:uppercase;}
.about-video .item .ico{width: 100%;left: 0;top: 48%;z-index: 2;}
.about-video .item .name{width: 100%;font-size: 20px;color: #fff;left: 0;bottom: 17.489711%;z-index: 2;}
.about-video .item .name::before{width: 25px;height: 1px;background-color: #fff;left: 18.75%;top: 15px;position: absolute;z-index: 1;content: '';}
.about-video .item .name::after{width: 25px;height: 1px;background-color: #fff;right: 18.75%;top: 15px;position: absolute;z-index: 1;content: '';}
.about-video .item .brief{width: 100%;line-height: 30px;font-size: 14px;color: #fff;left: 0;top: 60%;z-index: 2;opacity: 0;}
.about-video .item .mask{width: 95.83333%;height: 91.563786%;background-color: #3b8cc4;left: 2.0833333%;top: 4.1152263%;opacity: 0;visibility: visible;}
.about-video .item:hover .brief{opacity: 1;}
.about-video .item:hover .mask{opacity: .9 !important;}

.about-development{margin: 30px 0 0;}
.about-development .list{padding: 0 3%;}
.about-development .item{width: 100%;max-width: 1165px;min-height: 90px;margin: 0 auto 80px;z-index: 2;cursor: pointer; visibility:hidden;}
.about-development .item:last-child{margin-bottom: 0;}
.about-development .item .year{top: -6px;background-color: #fff;z-index: 2;}
.about-development .item.left .year{left: -180px;}
.about-development .item.right .year{right: -180px;}
.about-development .default{height: 100%;z-index: 2;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX;}
.about-development .development{height: 100%;z-index: 2;display: none;-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important}
.about-development .year{font-size: 30px;color: #9e9e9e;}
.about-development .main{max-width: 80%;font-size: 14px;margin-left: 15px;}
.about-development .bg{left: 0;top: 50%;-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important}
.about-development .round{width: 30px;height: 30px;background-color: #fff;padding: 5px;border: 1px dashed #e9e9e9;border-radius: 20px;left: 50%;top: 0;margin-left: -15px;}
.about-development .round .i{width: 100%;height: 100%;background-color: #a7a7a7;border-radius: 100%;}
.about-development .line{width: 105px;height: 1px;background-color: #e6e7e7;top: 50%;}
.about-development .left .line{right: 100%;}
.about-development .right .line{left: 100%;}
.about-development .table-cell{padding: 10px 20px;}
/*.about-development .on{height: 90px;}*/
.about-development .on .default{display: none;-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important}
.about-development .on .development{display: block;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX;}
.about-development .on .year{color: #fff;margin: 10px 0;background: none;}
.about-development .on .main{color: #fff;margin: 10px 0;}
.about-development .on .bg{width: 100%;height: 100%;background-color: #3e8ec5;border-radius: 90px;top: 0;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX;}
.about-development .on .about-progress{background-color: #a6c5da;}
.about-development .about-progress{width: 5px;background-color: #e0e4e7;left: 50%;top: 35px;padding: 0 0 10000px;margin: 0 0 -10000px -2.5px;}
.about-development .about-progress .i{width: 100%;left: 0;top: 0;background-color: #a0c2d9;}

@media only screen and (max-width: 1680px){
	.about-video .item .title{padding-left: 90px;letter-spacing: 90px;}
}

@media only screen and (max-width: 1440px){
	.about-video .item .title{padding-left: 50px;letter-spacing: 50px;}
}
@media only screen and (max-width: 992px){
	.show992{display: block;}
	.hide992{display: none;}
	.about-video .item{width: 100%;}
	.about-video .item .title{padding-left: 80px;letter-spacing: 80px;}
	.about-description .description img,.about-description .description input{width: inherit!important;height: inherit!important;max-width: 100%;max-height: 100%;}
}

@media only screen and (max-width: 640px){
	.about-video .item .ico{height: 16px;}
	.about-video .item .ico img{max-height: 100%;}
	.about-video .item .title{padding-left: 55px;letter-spacing: 55px;}
}

@media only screen and (max-width: 480px){
	.about-video .item .title{padding-left: 30px;letter-spacing: 30px;}
    .about-video .item .ico{top: 45%;}
    .about-video .item .brief{top: 55%;}
    .about-video .item .name{font-size: 16px;bottom: 15%;}

	.about-development .item.left .year{left: -47%;}
	.about-development .item.right .year{right: -47%;}
}

