@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: #009ea1;
	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: #009ea1;
	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: #009ea1;
}
.about-description .description {
	line-height: 26px;
	font-size: 14px;
	color: #7e7e7e;
	margin: 45px 0 0;
	visibility: hidden;
}
.about-description .description p {
	text-indent: 28px;
}
.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: 90%;
    top: 32%;
    z-index: 2;
    color: #fff;
    left: 5%;
}
.about-video .item .ico p{
	text-indent: 40px;
}
.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: #01adb0;
	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%;
	min-height: 240px;
}
.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;
	width: 80%;
	left: 10%;
}
.about-video .item .ico img {
	max-height: 100%;
}
.about-video .item .title {
	padding-left: 55px;
	letter-spacing: 55px;
}
	.max-w100{
	max-width: 100%;
    min-height: 240px;
	}
}

@media only screen and (max-width: 480px) {
.about-video .item .title {
	padding-left: 30px;
	letter-spacing: 30px;
}
.about-video .item .ico {
	top: 10%;
}
.about-video .item .brief {
	top: 55%;
}
.about-video .item .name {
	font-size: 16px;
	bottom: 15%;
}
	.about-video .item.teshu{
		min-height: 320px;
	}
	.about-video .teshu .max-w100{
		min-height: 320px;
	}
.about-development .item.left .year {
	left: -47%;
}
.about-development .item.right .year {
	right: -47%;
}
}