#open{
	background: url(../img/index/open-bg.jpg) repeat;
	position:  fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 999;
	overflow:  hidden;
}
#open .wrap{
	position:relative;
	top: 50%;
	transform: translateY(-50%);
}
#open .open-logo{
	text-align: center;
}
#open .drop1{
	text-align: center;
	padding: 0 0 0 0;
	animation: dropc 1s infinite linear both;
}
@keyframes dropc{
	0%{
		transform: translateY(0);
		opacity: 0;
	}
	10%{
		transform: translateY(5px);
		opacity: 1;
	}
	80%{
		transform: translateY(25px);
		opacity: 0;
	}
	
	100%{
		transform: translateY(30px);
		opacity: 0;
	}
}
#progress{
  height:1px;
  background:#000;
  width:0;
	z-index: 99;
}
#progstat{
  font-size:14px;
  letter-spacing: 3px;
  width:100%;
  text-align:center;
  color:#000;
	z-index: 99;
	height: 40px;
}

#key .slide-fade {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	height: 1050px;
	overflow:  hidden;
}
#key .slide-fade li {
	height: 1050px;
	width: 100%;
	animation: zoombg 10s infinite linear;
}
/*
@keyframes zoombg{
	0%{
		transform: scale(1);
	}
	100%{
		transform: scale(1.2);
	}
}*/

#key .slide-fade .bg1 {
	background: url(../img/index/key-slider1.jpg) no-repeat center center / cover;
}
#key .slide-fade .bg2 {
	background: url(../img/index/key-slider2.jpg) no-repeat center center / cover;
}
#key .slide-fade .bg3 {
	background: url(../img/index/key-slider3.jpg) no-repeat center center / cover;
}
#key .slide-fade .bg4 {
	background: url(../img/index/key-slider4.jpg) no-repeat center center / cover;
}
#sec1 {
	position: relative;
	padding-bottom: 65px;
}
#sec1 h2 {
	margin-left: -75px;
	padding: 138px 0 172px 0;
}
#sec1 h3 {
	text-align: right;
	margin-right: 101px;
	padding: 0 0 109px 0;
}
#sec1 .sec1-txt {
	background: url(../img/index/sec1-txt-bg.jpg) no-repeat center top / 100% 100%;
	color: #fff;
	padding: 85px 85px 84px 100px;
	width: 415px;
	position: relative;
	z-index: 2;
	margin-left: 400px;
}
#sec1 .sec1-img1 {
	position: absolute;
	top: 417px;
	left: -313px;
	z-index: 1;
}
#sec1 .sec1-img2 {
	margin-top: -101px;
	margin-left: -96px;
	position: relative;
	z-index: 1;
	width: 910px;
	height: 432px;
}
#paralax {
	min-height: 560px;
	overflow: hidden;
	background-image: url(../img/index/sec1-bg.jpg);
	position: relative;
	animation: bgColor 1s linear forwards;
	margin-bottom: 88px;
}
#paralax:before {
	background: #fff;
	content: "";
	position: absolute;
	top: -100px;
	left: -200%;
	right: -200%;
	height: 200px;
	transform: rotate(-5deg);
}
#paralax:after {
	background: #fff;
	content: "";
	position: absolute;
	bottom: -100px;
	left: -200%;
	right: -200%;
	height: 200px;
	transform: rotate(-5deg);
}
#paralax p {
	padding: 258px 0 0 0;
}
@keyframes bgColor {
 0% {
 -webkit-filter: grayscale(1);
 filter: grayscale(1);
}
80% {
 -webkit-filter: grayscale(1);
 filter: grayscale(1);
	}
	
90% {
 -webkit-filter: grayscale(0.5);
 filter: grayscale(0.5);
	}
		
 100% {
 -webkit-filter: grayscale(0);
 filter: grayscale(0);
}
}
#sec2 {
	position: relative;
	padding-bottom: 107px;
}
#sec2 h2 {
	margin-right: -29px;
	padding: 0px 0 86px 0;
}
#sec2 h3 {
	margin-left: 174px;
	padding: 0 0 77px 0;
}
#sec2 .sec2-txt {
	padding-bottom: 63px;
	width: 450px;
}
#sec2 .sec2-img1 {
	position: absolute;
	top: 174px;
	right: -39px;
}
#sec3 {
	background: url(../img/index/sec3-bg2.png) no-repeat center top / 100% 100%;
	min-height: 881px;
	position: relative;
}
#sec3:before {
	background: url(../img/index/sec3-bg1.jpg) no-repeat center center / cover;
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 720px;
	z-index: 0;
	bottom: 80px;
}
#sec3 h2 {
	padding: 125px 0 290px 0;
}
#sec3 h3 {
	position: absolute;
	top: 416px;
	left: 390px;
}
#sec3 .sec3-txt {
	color: #fff;
	margin-left: 556px;
}


#sec3 .sec3-btn {
	position: absolute;
	bottom: -70px;
	right: 195px;
	z-index: 1;
}
#sec4 {
	position: relative;
}
#sec4 h2 {
	position: absolute;
	top: 40px;
	right: -7px;
}
#sec4 h3 {
	padding: 97px 0 12px 0;
}
#sec4 .sec4-txt {
	width: 310px;
	padding-bottom: 27px;
}
#sec4 .sec4-img2 {
	margin-top: 20px;
	margin-left: 39px;
	position: relative;
	z-index: 2;
	pointer-events: none;
}
#sec4 .sec4-btn {
	position: absolute;
	top: 664px;
	right: 164px;
	z-index: 1;
}
#sec4 .sec4-img1 {
	position: absolute;
	top: 177px;
	right: 0;
}
#sec5 {
	background: url(../img/index/sec5-bg.png) no-repeat center top / 100% 100%;
	height: 779px;
}
#sec5 .wrap p {
	text-align: center;
	padding: 206px 0 60px 0;
}



#ins{
	max-width: 1600px;
	margin: auto;
	padding: 0 10px;
}
#ins > *{
	width: 16.66%;
	float: left;
	text-align: center;
}
#ins > * > *{
	padding: 5px;
	display: block;
}

#ins img{
	width: 100%;
	height: auto;
	display: block;
}
@media (max-width: 1400px){
	#sec5 .wrap p {
    padding: 205px 0 15px 0;
}
	#ins{
		width: 50%;
		margin: 0 auto;
	}
	#ins > * {
    width: 33%;
    float: left;
    text-align: center;
}
}