@font-face{
	font-family: "PingFangT";
	src: url('../images/PingFangHK-Regular-.ttf');
}
@font-face{
	font-family: "PingFangL";
	src: url('../images/PingFangLight.ttf');
}
html,body {
	margin:0;
	padding:0;
	font-family:"PingFang Regular";
}
html,body,div,p,h1,h2,h3,h4,h5,h6,blockquote,ul,ol,li,table,th,td,span,img,dl,dd,dt,input,textarea,button {
	border:medium none;
	padding:0;
	margin:0;
}
body {
	background: #fff;
	font-size:0
}
p {
	margin:0;
	padding:0;
	list-style: none
}
a:hover{-webkit-tap-highlight-color: transparent;}
.re{
	position: relative
}
.textPart{
	position: relative;
}
.textPart .p1{
	font-size: .24rem;
	position: absolute;
	top: 1%;
	left: 2%;
}

img {
	width:100%;
}
.header {
	width:100%;
	position:relative;
	overflow:hidden }
#video {
	width: 77.6%;
	position: absolute;
	top: 1.2%;
	left: 50%;
	transform: translateX(-50%)
	/* border: .06rem solid #ffc0f9; */
}
.zhuBo {
	position: absolute;
	width: 100%;
	top: 3.5%;
	left: 0;
	z-index: 9
}
.line {
	position: absolute;
	width: 100%;
	bottom: 17.5%;
	left: 0;
	z-index: 9
}
.youhui1 {
	width:50%;
	display: block;
	float:left;
}
.youhui2 {
	width:50%;
	float:left;
	display: block;
}
.button img {
	width:50%;
	float:left;
}
.button1 img {
	width:50%;
	float:right;
}
.part2 {
	font-size:0;
	width:100%;
}
.part2:after{

content: "." ; 
display: block ;
height: 0 ;
clear: both ;
visibility: hidden ;

}
.part2 a {
	float:left;
	width:50%;
	display:block;
}
.part3:after{
	content: "." ; 
display: block ;
height: 0 ;
clear: both ;
visibility: hidden ;
}
.part3 {
	font-size: 0;
	width:100%;
}
.part3 a {
	float:left;
	width:33.333333%;
	display:block;
}
.part4:after{
	content: "." ; 
display: block ;
height: 0 ;
clear: both ;
visibility: hidden ;
}
.part4 {
	font-size: 0;
	width:100%;
}
.part4 a:first-child {
	float:left;
	width:18.8%;
	display:block;
}
.part4 a:nth-child(2) {
	float:left;
	width:63.2%;
	display:block;
}
.part4 a:nth-child(3) {
	float:left;
	width:18%;
	display:block;
}
.part5:after{
	content: "." ; 
display: block ;
height: 0 ;
clear: both ;
visibility: hidden ;
}
.part5 {
	font-size: 0;
	width:100%;
}
.part5 a:first-child {
	float:left;
	width:78.93%;
	display:block;
}
.part5 a:nth-child(2) {
	float:left;
	width:21.07%;
	display:block;
}
#fixed {
	position:fixed;
	right:-102px;
	font-size:0;
	z-index:10;
	top:98px;
	width:102px;
}
#fixed a {
	display:block;
	width:100%;
}
#fixed a img {
	width:100%;
}
.link01{
	position: absolute;
	top: 37%;
	left: 10%;
	width: 79.87%;
}
#jiantou {
	display:block;
	position:absolute;
	width:25px;
	top:150px;
	left:-35px;
	z-index:10;
}
#jiantou img {
	width:100%;
}
.rotate {
	transform:rotate(180deg);
	transition: all 1.5s ease-in-out;
}
.remove {
	transition: all 1.5s ease-in-out;
}
.left {
	animation:jian 1s linear infinite;
}
.animated.infinite {
	-webkit-animation-iteration-count:1;
}
.ele01 {
	/* animation: ele01Ani .3s ease-in .5s forwards; */
	/* -webkit-animation: ele01Ani .3s ease-in .5s forwards; */
	width:32%;
	position: absolute;
	top:17.5%;
	right: 2%;
	z-index: 1;
	display: none;
	opacity: 1
	/* margin-left:-4.2%; */
}
@-webkit-keyframes ele01Ani{
  0%{
    opacity: 0;
    -webkit-transform: translate3d(0%,-200%,0);
    transform: translate3d(0%,-200%,0)
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}
.ele02{
	animation: ele02Ani .3s ease-in .5s forwards;
	-webkit-animation: ele02Ani .3s ease-in .5s forwards;
	width: 13.3%;
	opacity: 0;
	position: absolute;
	top: 18%;
	left: 2%;
	z-index: 9;
	/* -webkit-animation: ele02Ani .2s ease-in .5s forwards; */
}
.ele02_a{
	animation: ele02Ani .3s ease-in .55s forwards;
	-webkit-animation: ele02Ani .3s ease-in .55s forwards;
}
.ele02_b{
	animation: ele02Ani .3s ease-in .6s forwards;
	-webkit-animation: ele02Ani .3s ease-in .6s forwards;
}
.ele02_c{
	animation: ele02Ani .3s ease-in .65s forwards;
	-webkit-animation: ele02Ani .3s ease-in .65s forwards;
}
.ele02_d{
	animation: ele02Ani .3s ease-in .7s forwards;
	-webkit-animation: ele02Ani .3s ease-in .7s forwards;
}
.ele02_e{
	animation: ele02Ani .3s ease-in .75s forwards;
	-webkit-animation: ele02Ani .3s ease-in .75s forwards;
}
.ele02_f{
	animation: ele02Ani .3s ease-in .8s forwards;
	-webkit-animation: ele02Ani .3s ease-in .8s forwards;
}
@-webkit-keyframes ele02Ani{
	0% {
				opacity: 0;
        transform: translate3d(400%,0%,0)
    }
  100% {
  		opacity: 1;
      transform: none
  }
}

.ele03{
	animation: ele03Ani 3s both infinite;
	-webkit-animation: ele03Ani 3s both infinite;
	transform-origin: center;
	width: 33.33%;
	opacity: 1;
	position: absolute;
	top: 51%;
	left: 50%;
	margin-left: -16.66%;
	z-index: 99;
	/* -webkit-animation: ele02Ani .2s ease-in .5s forwards; */
}
@-webkit-keyframes ele03Ani{
	0% {
        transform: scale(1);
        transform: scale(1)
    }

    70%,73%{
        transform: scale(1) rotate(0deg);
        transform: scale(1) rotate(0deg)
    }

    77%,83%,90%,97%  {
        transform: scale(1.1) rotate(3deg);
        transform: scale(1.1) rotate(3deg)
    }

    80%,87%,93%{
        transform: scale(1.1) rotate(-3deg);
        transform: scale(1.1) rotate(-3deg)
    }

    100% {
        transform: scale(1) rotate(0);
        transform: scale(1) rotate(0)
    }
}
.ele04{
	animation: ele04Ani .3s ease-in .5s forwards;
	-webkit-animation: ele04Ani .3s ease-in .5s forwards;
	width: 29.87%;
	opacity: 0;
	position: absolute;
	top: 32%;
	right: 6%;
	z-index: 9;
	/* -webkit-animation: ele02Ani .2s ease-in .5s forwards; */
}
.ele05{
	animation: ele04Ani .3s ease-in .5s forwards;
	-webkit-animation: ele04Ani .3s ease-in .5s forwards;
	width: 29.87%;
	opacity: 0;
	position: absolute;
	top: 48%;
	right: 6%;
	margin-left: -14.66%;
	z-index: 9;
	/* -webkit-animation: ele02Ani .2s ease-in .5s forwards; */
}
.ele06a{
	width: 66.67%;
	opacity: 1;
	position: absolute;
	top: 76%;
	left: 25%;
	z-index: 9;
	/* -webkit-animation: ele02Ani .2s ease-in .5s forwards; */
}
.ele06a_ani{
	animation: ele06Ani_a .2s ease-in .5s forwards;
	-webkit-animation: ele06Ani_a .2s ease-in .5s forwards;
}
@-webkit-keyframes ele06Ani_a{
	0%{
		opacity: 0;
		transform: translate3d(-50%,0,0)
	}
	100%{
		opacity: 1;
		transform: none;
	}
}
.ele06b{
	width: 38.67%;
	opacity: 1;
	position: absolute;
	top: 59%;
	left: 8%;
	z-index: 9;
	/* -webkit-animation: ele02Ani .2s ease-in .5s forwards; */
}
.ele06b_ani{
	animation: ele06Ani_b .2s ease-in .5s forwards;
	-webkit-animation: ele06Ani_b .2s ease-in .5s forwards;
}

@-webkit-keyframes ele06Ani_b{
	0%{
		opacity: 0;
		transform: translate3d(50%,0,0)
	}
	95%{
		opacity: 1;
		transform: translate3d(-5%,0,0)
	}
	100%{
		opacity: 1;
		transform: none;
	}
}
@-webkit-keyframes ele04Ani{
	0%{
		opacity: 0;
		transform: translate3d(-300%, 0%, 0);
	}
	100%{
		opacity: 1;
		transform:  none;
	}
}
.a {
	animation:title03 1s linear infinite;
}
.lightSpeedIn02 {
	-webkit-animation-name:lightSpeedIn02;
	animation-name:lightSpeedIn02;
	-webkit-animation-timing-function:ease-out;
	animation-timing-function:ease-out
}
@-webkit-keyframes lightSpeedIn02 {
	0% {
	-webkit-transform:translate3d(-100%,0,0) skewX(-30deg);
	opacity:0
}
60% {
	-webkit-transform:skewX(20deg);
	transform:skewX(20deg)
}
60%,80% {
	opacity:1
}
80% {
	-webkit-transform:skewX(-5deg);
	transform:skewX(-5deg)
}
to {
	-webkit-transform:none;
	transform:none;
	opacity:1
}
}	