* {margin: 0;padding: 0;}
html,body{margin: 0; padding: 0; width: 100%;   height: 100%; text-align: center; background: #000;}
.sectionCont{width: 10rem;min-height:14.666666rem;  max-height: 16.226666rem;height: 100%; position: relative; margin: auto; overflow: hidden;}/*min-height:15.546666rem;*/
section{width: 10rem;min-height:14.666666rem;  max-height: 16.226666rem;height: 100%; position: relative; margin: auto;}
/* 15.573333rem  */
.swiper-wrapper {}
.swiper-container {width: 100%;height: 100%;position: absolute;left: 0%;top: 0%;min-height: 15.573333rem;}
.swiper-slide {position: absolute;background-size:100% auto;overflow:hidden;text-align:center;}
.swiper-slide img{max-width:100%;}
  
.logo{width: 4.266666rem; height: 0.506666rem; left: 0.44rem; top: 0.44rem; position: absolute; z-index: 100; background: url(../images/logo.png); background-size: 100% 100%;} 
.musicBtn{width: 0.666666rem; height: 0.666666rem;  position: absolute; right: 0.36rem; top: 0.36rem;background:url(../images/soundBtn.png) center center no-repeat; background-size:100% 100% ; display: none; z-index: 1000; pointer-events: auto;}
.shake{-webkit-animation: shakeAni 1000ms linear infinite;}
@-webkit-keyframes shakeAni{
	25%{-webkit-transform:rotate(-5deg);}
	75%{-webkit-transform:rotate(5deg);}
}

.loadingSection{ position:absolute; left: 0; top: 0; width: 100%; height: 100%;}
.loadingSection .per{position: absolute; left: 50%; width: 3rem; margin-left: -1.5rem; top: 52%; font-size: 14px; color:#be822d;}   
.loadingSection .note{position: absolute; left: 50%; width: 3rem; margin-left: -1.5rem; top: 49%; font-size: 14px; color: #8c5c35 ;}
.loadingSection .loading{width: 1.24rem; height: 1.24rem; position: absolute; left: 50%; margin-left: -0.613333rem; top: 40%;}
.loadingSection .loading img{width: 100%; height: 100%;-webkit-animation: roll 1000ms linear infinite;}
@-webkit-keyframes roll{   
	0%{-webkit-transform: rotate(0deg);}
	100%{-webkit-transform: rotate(360deg);}
}

.bg1{width: 11.333333rem; height: 100%; position: absolute; left: 50%; margin-left: -5.666666rem; background: url(../images/bg1.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.bg2{width: 11.333333rem; height: 100%; position: absolute; left: 50%; margin-left: -5.666666rem; background: url(../images/bg2.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.bg3{width: 11.333333rem; height: 100%; position: absolute; left: 50%; margin-left: -5.666666rem; background: url(../images/bg3.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.bg4{width: 11.333333rem; height: 100%; position: absolute; left: 50%; margin-left: -5.666666rem; background: url(../images/bg4.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.bg5{width: 11.333333rem; height: 100%; position: absolute; left: 50%; margin-left: -5.666666rem; background: url(../images/bg5.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.homebg{width: 100%; height: 100%; background: url(../images/homebg.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.m1{width: 100%; height: 100%; background: url(../images/m1.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.m2{width: 100%; height: 100%; background: url(../images/m2.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.m3{width: 100%; height: 100%; background: url(../images/m3.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.m4{width: 100%; height: 100%; background: url(../images/m4.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.m5{width: 100%; height: 100%; background: url(../images/m5.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.m6{width: 100%; height: 100%; background: url(../images/m6.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.m7{width: 100%; height: 100%; background: url(../images/m7.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.m8{width: 100%; height: 100%; background: url(../images/m8bg.jpg); background-size: 100% auto; background-position: bottom center; opacity: 0;}
.mainbg{width: 100%; height: 100%; background: url(../images/m8bg.jpg); position: absolute; background-size: 100% auto; background-position: bottom center; opacity: 0;-webkit-transition: all 1500ms;}
.in .bgAni1{-webkit-animation: bgIn1 3000ms ease-out forwards;}
.out .bgAni1{-webkit-animation: bgOut1 1500ms forwards;opacity: 1;}
.in .bgAni{-webkit-animation: bgIn 3000ms ease-out forwards;}
.out .bgAni{-webkit-animation: bgOut 1500ms forwards;opacity: 1;}
.in .bgAni3{-webkit-animation: bgIn3 3000ms ease-out forwards;}
.out .bgAni3{-webkit-animation: bgOut3 1500ms forwards;opacity: 1;}
.in .bgAni5{-webkit-animation: bgIn5 3000ms ease-out forwards;}
.out .bgAni5{-webkit-animation: bgOut5 1500ms forwards;opacity: 1;}
@-webkit-keyframes bgIn1{   
	0%{-webkit-transform:  scale(0.9); opacity: 0;}
	20%{-webkit-transform:  scale(1); opacity: 1;}
	100%{-webkit-transform:  scale(1.1); opacity: 1;}
}
@-webkit-keyframes bgOut1{   
	0%{-webkit-transform:  scale(1.1); opacity: 1;}
	100%{-webkit-transform:  scale(1.2); opacity: 0;}
}


@-webkit-keyframes bgIn{   
	0%{-webkit-transform: rotate(3deg) scale(0.96); opacity: 0;}
	20%{-webkit-transform: rotate(0deg) scale(1); opacity: 1;}
	100%{-webkit-transform: rotate(-6deg) scale(1.1); opacity: 1;}
}
@-webkit-keyframes bgOut{   
	0%{-webkit-transform: rotate(-6deg) scale(1.1); opacity: 1;}
	100%{-webkit-transform: rotate(-12deg) scale(1.2); opacity: 0;}
}

@-webkit-keyframes bgIn3{   
	0%{-webkit-transform: rotate(-3deg) scale(0.96); opacity: 0;}
	20%{-webkit-transform: rotate(0deg) scale(1); opacity: 1;}
	100%{-webkit-transform: rotate(6deg) scale(1.1); opacity: 1;}
}
@-webkit-keyframes bgOut3{   
	0%{-webkit-transform: rotate(6deg) scale(1.1); opacity: 1;}
	100%{-webkit-transform: rotate(12deg) scale(1.2); opacity: 0;}
}

@-webkit-keyframes bgIn5{   
	0%{-webkit-transform: translateY(0.533333rem); opacity: 0;}
	20%{-webkit-transform: translateY(0.4rem); opacity: 1;}
	100%{-webkit-transform: translateY(0); opacity: 1;}
}
@-webkit-keyframes bgOut5{   
	0%{-webkit-transform: translateY(0); opacity: 1;}
	100%{-webkit-transform: translateY(-0.133333rem); opacity: 0;}
}

.intro1t1{width: 0.56rem; height: 0.573333rem; position: absolute; left: 50%; margin-left: -2.186666rem; top: 3.24rem; background: url(../images/intro1t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro1t2{width: 0.56rem; height: 0.52rem; position: absolute; left: 50%; margin-left: -1.226666rem; top: 3.293333rem; background: url(../images/intro1t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro1t3{width: 0.573333rem; height: 0.56rem; position: absolute; left: 50%;margin-left: -0.28rem; top: 3.253333rem; background: url(../images/intro1t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro1t4{width: 0.533333rem; height: 0.533333rem; position: absolute; left: 50%;margin-left: 0.68rem; top: 3.28rem; background: url(../images/intro1t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro1t5{width: 0.546666rem; height: 0.56rem; position: absolute; left: 50%;margin-left: 1.64rem; top: 3.253333rem; background: url(../images/intro1t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro1t6{width: 0.56rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: -1.72rem; top: 4.333333rem; background: url(../images/intro1t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro1t7{width: 0.573333rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: -0.773333rem; top: 4.333333rem; background: url(../images/intro1t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro1t8{width: 0.573333rem; height: 0.56rem; position: absolute; left: 50%;margin-left: 0.186666rem; top: 4.32rem; background: url(../images/intro1t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro1t9{width: 0.56rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: 1.146666rem; top: 4.333333rem; background: url(../images/intro1t9.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}

.intro2t1{width: 0.6rem; height: 0.573333rem; position: absolute; left: 50%; margin-left: -1.493333rem; top:2.373333rem; background: url(../images/intro2t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t2{width: 0.56rem; height: 0.52rem; position: absolute; left: 50%; margin-left: -0.666666rem; top: 2.426666rem; background: url(../images/intro2t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t3{width: 0.56rem; height: 0.56rem; position: absolute; left: 50%;margin-left: 0.146666rem; top: 2.386666rem; background: url(../images/intro2t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t4{width: 0.533333rem; height: 0.56rem; position: absolute; left: 50%;margin-left: 0.946666rem; top: 2.386666rem; background: url(../images/intro2t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t5{width: 0.56rem; height: 0.56rem; position: absolute; left: 50%;margin-left: -2.186666rem; top: 3.306666rem; background: url(../images/intro2t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t6{width: 0.56rem; height: 0.573333rem; position: absolute; left: 50%;margin-left: -1.24rem; top: 3.32rem; background: url(../images/intro2t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t7{width: 0.573333rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: -0.28rem; top: 3.32rem; background: url(../images/intro2t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t8{width: 0.56rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: 0.68rem; top: 3.32rem; background: url(../images/intro2t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t9{width: 0.533333rem; height: 0.533333rem; position: absolute; left: 50%;margin-left: 1.64rem; top: 3.346666rem; background: url(../images/intro2t9.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t10{width: 0.56rem; height: 0.52rem; position: absolute; left: 50%;margin-left: -1.573333rem; top: 4.346666rem; background: url(../images/intro2t10.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t11{width: 0.56rem; height: 0.466666rem; position: absolute; left: 50%;margin-left: -0.72rem; top: 4.373333rem; background: url(../images/intro2t11.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t12{width: 0.573333rem; height:0.56rem; position: absolute; left: 50%;margin-left: 0.133333rem; top: 4.32rem; background: url(../images/intro2t12.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro2t13{width: 0.56rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: 1rem; top: 4.32rem; background: url(../images/intro2t13.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}

.intro3t1{width: 0.573333rem; height: 0.56rem; position: absolute; left: 50%; margin-left: -1.24rem; top:3.24rem; background: url(../images/intro3t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro3t2{width: 0.56rem; height: 0.56rem; position: absolute; left: 50%; margin-left: -0.266666rem; top: 3.24rem; background: url(../images/intro3t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro3t3{width: 0.56rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: 0.68rem; top: 3.24rem; background: url(../images/intro3t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro3t4{width: 0.573333rem; height: 0.56rem; position: absolute; left: 50%;margin-left: -1.72rem; top: 4.32rem; background: url(../images/intro3t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro3t5{width: 0.573333rem; height: 0.56rem; position: absolute; left: 50%;margin-left: -0.76rem; top: 4.32rem; background: url(../images/intro3t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro3t6{width: 0.533333rem; height: 0.56rem; position: absolute; left: 50%;margin-left: 0.2rem; top: 4.32rem; background: url(../images/intro3t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro3t7{width: 0.586666rem; height: 0.506666rem; position: absolute; left: 50%;margin-left: 1.146666rem; top: 4.36rem; background: url(../images/intro3t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}

.intro4t1{width: 0.56rem; height: 0.56rem; position: absolute; left: 50%; margin-left: -1.72rem; top:3.253333rem; background: url(../images/intro4t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro4t2{width: 0.56rem; height: 0.546666rem; position: absolute; left: 50%; margin-left: -0.76rem; top: 3.266666rem; background: url(../images/intro4t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro4t3{width: 0.573333rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: 0.186666rem; top: 3.253333rem; background: url(../images/intro4t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro4t4{width: 0.573333rem; height: 0.56rem; position: absolute; left: 50%;margin-left: 1.146666rem; top: 3.253333rem; background: url(../images/intro4t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro4t5{width: 0.573333rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: -1.72rem; top: 4.333333rem; background: url(../images/intro4t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro4t6{width: 0.533333rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: -0.746666rem; top: 4.333333rem; background: url(../images/intro4t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro4t7{width: 0.56rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: 0.2rem; top: 4.333333rem; background: url(../images/intro4t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro4t8{width: 0.56rem; height: 0.573333rem; position: absolute; left: 50%;margin-left: 1.146666rem; top: 4.306666rem; background: url(../images/intro4t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}

.intro5t1{width: 0.52rem; height: 0.493333rem; position: absolute; left: 50%; margin-left:-1.68rem; top: 3.293333rem; background: url(../images/intro5t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro5t2{width: 0.56rem; height: 0.533333rem; position: absolute; left: 50%; margin-left: -0.76rem; top: 3.253333rem; background: url(../images/intro5t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro5t3{width: 0.56rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: 0.186666rem; top: 3.253333rem; background: url(../images/intro5t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro5t4{width: 0.573333rem; height:0.533333rem; position: absolute; left: 50%;margin-left:1.133333rem; top: 3.266666rem; background: url(../images/intro5t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro5t5{width: 0.56rem; height: 0.506666rem; position: absolute; left: 50%;margin-left: -1.72rem; top: 4.373333rem; background: url(../images/intro5t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro5t6{width: 0.56rem; height: 0.493333rem; position: absolute; left: 50%;margin-left: -0.746666rem; top: 4.373333rem; background: url(../images/intro5t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro5t7{width: 0.573333rem; height: 0.56rem; position: absolute; left: 50%;margin-left: 0.2rem; top: 4.32rem; background: url(../images/intro5t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.intro5t8{width: 0.546666rem; height: 0.546666rem; position: absolute; left: 50%;margin-left: 1.146666rem; top: 4.333333rem; background: url(../images/intro5t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}

.homeBox{width: 100%; height: 100%; position: absolute; top: 0; left: 0; -webkit-transform-origin: 50% 75%;}
.homet1{width: 0.4rem; height: 0.426666rem; position: absolute; left: 50%; margin-left: -2.333333rem; bottom: 5.373333rem; background: url(../images/homet1.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet2{width: 0.44rem; height: 0.413333rem; position: absolute; left: 50%; margin-left: -1.84rem; bottom: 5.4rem; background: url(../images/homet2.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet3{width: 0.426666rem; height: 0.426666rem; position: absolute; left: 50%;margin-left: -1.293333rem; bottom: 5.386666rem; background: url(../images/homet3.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet4{width: 0.413333rem; height: 0.413333rem; position: absolute; left: 50%;margin-left: -0.746666rem; bottom: 5.386666rem; background: url(../images/homet4.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet5{width: 0.44rem; height: 0.44rem; position: absolute; left: 50%;margin-left: -0.226666rem; bottom: 5.373333rem; background: url(../images/homet5.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet6{width: 0.426666rem; height: 0.4rem; position: absolute; left: 50%;margin-left: 0.306666rem; bottom: 5.373333rem; background: url(../images/homet6.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet7{width: 0.44rem; height: 0.426666rem; position: absolute; left: 50%;margin-left: 0.84rem; bottom: 5.386666rem; background: url(../images/homet7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.homet8{width: 0.413333rem; height: 0.4rem; position: absolute; left: 50%;margin-left: 1.373333rem; bottom: 5.386666rem; background: url(../images/homet8.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet9{width: 0.426666rem; height: 0.426666rem; position: absolute; left: 50%;margin-left: 1.92rem; bottom: 5.386666rem; background: url(../images/homet9.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet10{width: 0.44rem; height: 0.426666rem; position: absolute; left: 50%;margin-left: -1.053333rem; bottom: 2.6rem; background: url(../images/homet10.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet11{width: 0.44rem; height: 0.426666rem; position: absolute; left: 50%;margin-left: -0.506666rem; bottom: 2.6rem; background: url(../images/homet11.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet12{width: 0.426666rem; height: 0.426666rem; position: absolute; left: 50%;margin-left: 0.053333rem; bottom: 2.6rem; background: url(../images/homet12.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.homet13{width: 0.426666rem; height: 0.426666rem; position: absolute; left: 50%;margin-left: 0.613333rem; bottom: 2.6rem; background: url(../images/homet13.png); background-size: 100% 100%;opacity: 0; -webkit-transition: all 1500ms;}
.hometitle{width: 4.36rem; height: 1.466666rem; position: absolute; left: 50%;margin-left: -2.173333rem; bottom: 3.56rem; background: url(../images/hometitle.png); background-size: 100% 100%;opacity: 0; -webkit-transform:translateY(20px); -webkit-transition: all 1500ms;}
.hometitle img{width: 100%; height: 100%;-webkit-mask-image: url(../images/hometitle_mask.png); -webkit-mask-position: -4.36rem 0; -webkit-mask-repeat: no-repeat;-webkit-animation: ray 3000ms ease-out infinite;}
@-webkit-keyframes ray{   
	0%{-webkit-mask-position: -4.36rem 0;}
	50%{-webkit-mask-position: -4.36rem 0;}
	100%{-webkit-mask-position: 4.36rem 0;}
}
.in .homebg{-webkit-animation: scaleIn 1500ms forwards;}
.out .homebg{-webkit-animation: scaleOut 1500ms forwards;}
.out .homeBox{-webkit-animation: scaleOut 1000ms forwards;}

@-webkit-keyframes scaleIn{   
	0%{-webkit-transform: scale(0.9); opacity: 0;}
	100%{-webkit-transform: scale(1); opacity: 1;}
}
@-webkit-keyframes scaleOut{   
	0%{-webkit-transform: scale(1); opacity: 1;}
	100%{-webkit-transform: scale(1.2); opacity: 0;}
}
.stt1{width: 0.546666rem; height: 0.52rem; position: absolute; left: 50%; margin-left: -1.4rem; top:1.693333rem; background: url(../images/stt1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.stt2{width: 0.533333rem; height: 0.493333rem; position: absolute; left: 50%; margin-left: -0.84rem; top: 1.733333rem; background: url(../images/stt2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.stt3{width: 0.533333rem; height: 0.493333rem; position: absolute; left: 50%;margin-left: -0.28rem; top: 1.733333rem; background: url(../images/stt3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.stt4{width: 0.493333rem; height: 0.52rem; position: absolute; left: 50%;margin-left: 0.306666rem; top: 1.72rem; background: url(../images/stt4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.stt5{width: 0.533333rem; height: 0.52rem; position: absolute; left: 50%;margin-left: 0.84rem; top: 1.733333rem; background: url(../images/stt5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}

.mline{width: 0.853333rem; height: 0.013333rem; position: absolute; left: 50%;margin-left: -0.426666rem; top: 3.546666rem; background: #D79860;opacity: 0;-webkit-transition: all 1500ms;}

.m1t1{width: 0.6rem; height: 0.586666rem;margin-left: -3.16rem; top: 2.506666rem;  position: absolute; left: 50%;background: url(../images/m1t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1t2{width: 0.6rem; height: 0.6rem; margin-left: -2.52rem; top: 2.48rem; position: absolute; left: 50%;background: url(../images/m1t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1t3{width: 0.2rem; height: 0.146666rem; margin-left: -1.813333rem; top: 2.84rem;position: absolute; left: 50%; background: url(../images/m1t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1t4{width: 0.586666rem; height: 0.586666rem;margin-left: -1.24rem; top: 2.48rem;  position: absolute; left: 50%;background: url(../images/m1t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1t5{width: 0.6rem; height: 0.586666rem; margin-left: -0.6rem; top: 2.48rem; position: absolute; left: 50%;background: url(../images/m1t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1t6{width: 0.56rem; height: 0.586666rem; margin-left: 0.053333rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m1t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1t7{width: 0.6rem; height: 0.6rem; margin-left: 0.68rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m1t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1t8{width: 0.6rem; height: 0.586666rem; margin-left: 1.32rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m1t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1t9{width: 0.6rem; height: 0.586666rem; margin-left: 1.96rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m1t9.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1t10{width: 0.56rem; height: 0.586666rem; margin-left: 2.613333rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m1t10.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1note{width: 6.266666rem; height: 1.56rem; margin-left: -3.133333rem; top: 4.04rem;position: absolute; left: 50%; background: url(../images/m1note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m1title{width: 5.093333rem; height: 1.946666rem; position: absolute; left: 50%;margin-left: -2.68rem; bottom: 1.906666rem; background: url(../images/m1title.png); background-size: 100% 100%;opacity: 0; -webkit-transform:translateY(-20px);-webkit-transition: all 1500ms;}
.m1title img{width: 100%; height: 100%;-webkit-mask-image: url(../images/hometitle_mask.png); -webkit-mask-position: -4.36rem 0; -webkit-mask-repeat: no-repeat;-webkit-animation: ray 3000ms ease-out infinite;}

.m2t1{width: 0.6rem; height: 0.6rem;margin-left: -3.8rem; top: 2.48rem;  position: absolute; left: 50%;background: url(../images/m2t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t2{width: 0.6rem; height: 0.6rem; margin-left: -3.16rem; top: 2.48rem; position: absolute; left: 50%;background: url(../images/m2t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t3{width: 0.573333rem; height: 0.6rem; margin-left: -2.52rem; top: 2.48rem; position: absolute; left: 50%; background: url(../images/m2t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t4{width: 0.586666rem; height: 0.586666rem;margin-left: -1.88rem; top: 2.48rem;  position: absolute; left: 50%;background: url(../images/m2t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t5{width: 0.546666rem; height: 0.6rem; margin-left: -1.213333rem; top: 2.48rem; position: absolute; left: 50%;background: url(../images/m2t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t6{width: 0.6rem; height: 0.573333rem; margin-left: -0.6rem; top: 2.506666rem;position: absolute; left: 50%; background: url(../images/m2t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t7{width: 0.586666rem; height: 0.586666rem; margin-left: 0.04rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m2t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t8{width: 0.56rem; height: 0.586666rem; margin-left: 0.693333rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m2t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t9{width: 0.6rem; height: 0.586666rem; margin-left: 1.32rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m2t9.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t10{width: 0.6rem; height: 0.586666rem; margin-left: 1.96rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m2t10.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t11{width: 0.573333rem; height: 0.586666rem; margin-left: 2.613333rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m2t11.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2t12{width: 0.56rem; height: 0.586666rem; margin-left: 3.253333rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m2t12.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2note{width: 7.586666rem; height: 1.986666rem; margin-left:-3.786666rem; top: 4.04rem;position: absolute; left: 50%; background: url(../images/m2note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m2title{width: 4.92rem; height: 2.026666rem; position: absolute; left: 50%;margin-left: -2.68rem; bottom: 1.826666rem; background: url(../images/m2title.png); background-size: 100% 100%;opacity: 0; -webkit-transform:translateY(-20px);-webkit-transition: all 1500ms;}
.m2title img{width: 100%; height: 100%;-webkit-mask-image: url(../images/hometitle_mask.png); -webkit-mask-position: -4.36rem 0; -webkit-mask-repeat: no-repeat;-webkit-animation: ray 3000ms ease-out infinite;}

.m3t1{width: 0.533333rem; height: 0.52rem;margin-left: -3.96rem; top: 2.52rem;  position: absolute; left: 50%;background: url(../images/m3t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t2{width: 0.52rem; height: 0.533333rem;margin-left: -3.346666rem; top: 2.52rem; position: absolute; left: 50%;background: url(../images/m3t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t3{width: 0.52rem; height: 0.453333rem; margin-left: -2.786666rem; top: 2.56rem; position: absolute; left: 50%; background: url(../images/m3t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t4{width: 0.533333rem; height: 0.52rem;margin-left: -2.226666rem; top: 2.52rem;  position: absolute; left: 50%;background: url(../images/m3t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t5{width: 0.533333rem; height: 0.52rem; margin-left: -1.666666rem; top: 2.52rem; position: absolute; left: 50%;background: url(../images/m3t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t6{width: 0.533333rem; height: 0.52rem; margin-left: -1.093333rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m3t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t7{width: 0.546666rem; height: 0.52rem; margin-left: -0.533333rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m3t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t8{width: 0.533333rem; height: 0.506666rem; margin-left: 0.04rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m3t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t9{width: 0.493333rem; height: 0.52rem; margin-left: 0.626666rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m3t9.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t10{width: 0.546666rem; height: 0.52rem; margin-left: 1.16rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m3t10.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t11{width: 0.533333rem; height: 0.52rem; margin-left: 1.733333rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m3t11.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t12{width: 0.506666rem; height: 0.52rem; margin-left: 2.306666rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m3t12.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t13{width: 0.546666rem; height: 0.52rem; margin-left: 2.853333rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m3t13.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3t14{width: 0.52rem; height: 0.52rem; margin-left: 3.44rem; top: 2.533333rem;position: absolute; left: 50%; background: url(../images/m3t14.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3note{width: 6.96rem; height: 1.6rem; margin-left:-3.466666rem; top: 4.013333rem;position: absolute; left: 50%; background: url(../images/m3note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m3title{width: 4.88rem; height: 1.96rem; position: absolute; left: 50%;margin-left: -2.68rem; bottom: 1.893333rem; background: url(../images/m3title.png); background-size: 100% 100%;opacity: 0; -webkit-transform:translateY(-20px);-webkit-transition: all 1500ms;}
.m3title img{width: 100%; height: 100%;-webkit-mask-image: url(../images/hometitle_mask.png); -webkit-mask-position: -4.36rem 0; -webkit-mask-repeat: no-repeat;-webkit-animation: ray 3000ms ease-out infinite;}

.m4t1{width: 0.533333rem; height: 0.533333rem;margin-left: -3.666666rem; top: 2.52rem;  position: absolute; left: 50%;background: url(../images/m4t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t2{width: 0.533333rem; height: 0.493333rem;margin-left: -3.093333rem; top: 2.533333rem; position: absolute; left: 50%;background: url(../images/m4t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t3{width: 0.493333rem; height: 0.52rem; margin-left: -2.506666rem; top: 2.52rem; position: absolute; left: 50%; background: url(../images/m4t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t4{width: 0.546666rem; height: 0.533333rem;margin-left: -1.96rem; top: 2.52rem;  position: absolute; left: 50%;background: url(../images/m4t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t5{width: 0.533333rem; height: 0.533333rem; margin-left: -1.386666rem; top: 2.52rem; position: absolute; left: 50%;background: url(../images/m4t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t6{width: 0.506666rem; height: 0.506666rem; margin-left: -0.813333rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m4t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t7{width: 0.546666rem; height: 0.493333rem; margin-left: -0.253333rem; top: 2.56rem;position: absolute; left: 50%; background: url(../images/m4t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t8{width: 0.533333rem; height: 0.493333rem; margin-left: 0.32rem; top: 2.546666rem;position: absolute; left: 50%; background: url(../images/m4t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t9{width: 0.533333rem; height: 0.52rem; margin-left: 0.893333rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m4t9.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t10{width: 0.546666rem; height: 0.493333rem; margin-left: 1.453333rem; top: 2.546666rem;position: absolute; left: 50%; background: url(../images/m4t10.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t11{width: 0.493333rem; height: 0.52rem; margin-left: 2.053333rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m4t11.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t12{width: 0.533333rem; height: 0.52rem; margin-left: 2.6rem; top: 2.52rem;position: absolute; left: 50%; background: url(../images/m4t12.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4t13{width: 0.533333rem; height: 0.533333rem; margin-left: 3.173333rem; top: 2.506666rem;position: absolute; left: 50%; background: url(../images/m4t13.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}.m4note{width: 6.96rem; height: 1.6rem; margin-left:-3.466666rem; top: 4.013333rem;position: absolute; left: 50%; background: url(../images/m3note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4note{width: 6.293333rem; height: 1.586666rem; margin-left:-3.173333rem; top: 3.986666rem;position: absolute; left: 50%; background: url(../images/m4note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m4title{width: 4.96rem; height: 1.946666rem; position: absolute; left: 50%;margin-left: -2.68rem; bottom: 1.906666rem; background: url(../images/m4title.png); background-size: 100% 100%;opacity: 0; -webkit-transform:translateY(-20px);-webkit-transition: all 1500ms;}
.m4title img{width: 100%; height: 100%;-webkit-mask-image: url(../images/hometitle_mask.png); -webkit-mask-position: -4.36rem 0; -webkit-mask-repeat: no-repeat;-webkit-animation: ray 3000ms ease-out infinite;}

.m5t1{width: 0.68rem; height: 0.653333rem;margin-left: -3.906666rem; top: 2.466666rem;  position: absolute; left: 50%;background: url(../images/m5t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t2{width: 0.64rem; height: 0.666666rem;margin-left: -3.186666rem; top: 2.466666rem; position: absolute; left: 50%;background: url(../images/m5t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t3{width: 0.653333rem; height: 0.653333rem; margin-left: -2.466666rem; top: 2.466666rem; position: absolute; left: 50%; background: url(../images/m5t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t4{width: 0.653333rem; height: 0.626666rem;margin-left: -1.746666rem; top: 2.466666rem;  position: absolute; left: 50%;background: url(../images/m5t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t5{width: 0.68rem; height: 0.666666rem; margin-left: -1.04rem; top: 2.466666rem; position: absolute; left: 50%;background: url(../images/m5t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t6{width: 0.666666rem; height: 0.666666rem; margin-left: -0.32rem; top: 2.466666rem;position: absolute; left: 50%; background: url(../images/m5t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t7{width: 0.64rem; height: 0.666666rem; margin-left: 0.4rem; top: 2.466666rem;position: absolute; left: 50%; background: url(../images/m5t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t8{width: 0.666666rem; height: 0.626666rem; margin-left: 1.12rem; top: 2.493333rem;position: absolute; left: 50%; background: url(../images/m5t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t9{width: 0.626666rem; height: 0.653333rem; margin-left: 1.866666rem; top: 2.466666rem;position: absolute; left: 50%; background: url(../images/m5t9.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t10{width: 0.64rem; height: 0.68rem; margin-left: 2.573333rem; top: 2.466666rem;position: absolute; left: 50%; background: url(../images/m5t10.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5t11{width: 0.68rem; height: 0.68rem; margin-left: 3.266666rem; top: 2.466666rem;position: absolute; left: 50%; background: url(../images/m5t11.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5note{width: 6.973333rem; height: 1.6rem; margin-left:-3.48rem; top: 4.013333rem;position: absolute; left: 50%; background: url(../images/m5note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m5title{width: 5.04rem; height: 1.973333rem; position: absolute; left: 50%;margin-left: -2.68rem; bottom: 1.88rem; background: url(../images/m5title.png); background-size: 100% 100%;opacity: 0; -webkit-transform:translateY(-20px);-webkit-transition: all 1500ms;}
.m5title img{width: 100%; height: 100%;-webkit-mask-image: url(../images/hometitle_mask.png); -webkit-mask-position: -4.36rem 0; -webkit-mask-repeat: no-repeat;-webkit-animation: ray 3000ms ease-out infinite;}

.m6t1{width: 0.666666rem; height: 0.626666rem;margin-left: -2.826666rem; top: 2.48rem;  position: absolute; left: 50%;background: url(../images/m6t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m6t2{width: 0.64rem; height: 0.64rem; margin-left: -2.12rem; top: 2.48rem; position: absolute; left: 50%;background: url(../images/m6t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m6t3{width: 0.68rem; height: 0.64rem; margin-left: -1.4rem; top: 2.453333rem; position: absolute; left: 50%; background: url(../images/m6t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m6t4{width: 0.626666rem; height: 0.653333rem;margin-left: -0.653333rem; top: 2.453333rem;  position: absolute; left: 50%;background: url(../images/m6t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m6t5{width: 0.666666rem; height: 0.653333rem; margin-left: 0.04rem; top: 2.453333rem; position: absolute; left: 50%;background: url(../images/m6t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m6t6{width: 0.653333rem; height: 0.653333rem; margin-left: 0.786666rem; top: 2.453333rem;position: absolute; left: 50%; background: url(../images/m6t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m6t7{width: 0.666666rem; height: 0.653333rem; margin-left: 1.48rem; top: 2.453333rem;position: absolute; left: 50%; background: url(../images/m6t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m6t8{width: 0.653333rem; height: 0.653333rem; margin-left: 2.186666rem; top: 2.453333rem;position: absolute; left: 50%; background: url(../images/m6t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}.m5note{width: 6.973333rem; height: 1.6rem; margin-left:-3.48rem; top: 4.013333rem;position: absolute; left: 50%; background: url(../images/m5note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m6note{width: 7.36rem; height: 1.173333rem; margin-left:-3.426666rem; top: 4.013333rem;position: absolute; left: 50%; background: url(../images/m6note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m6title{width: 5rem; height: 1.946666rem; position: absolute; left: 50%;margin-left: -2.68rem; bottom: 1.906666rem; background: url(../images/m6title.png); background-size: 100% 100%;opacity: 0; -webkit-transform:translateY(-20px);-webkit-transition: all 1500ms;}
.m6title img{width: 100%; height: 100%;-webkit-mask-image: url(../images/hometitle_mask.png); -webkit-mask-position: -4.36rem 0; -webkit-mask-repeat: no-repeat;-webkit-animation: ray 3000ms ease-out infinite;}

.m7t1{width: 0.6rem; height: 0.6rem;margin-left: -3.48rem; top: 2.48rem;  position: absolute; left: 50%;background: url(../images/m7t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t2{width: 0.6rem; height: 0.586666rem; margin-left: -2.853333rem; top: 2.48rem; position: absolute; left: 50%;background: url(../images/m7t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t3{width: 0.6rem; height: 0.586666rem; margin-left: -2.2rem; top: 2.48rem; position: absolute; left: 50%; background: url(../images/m7t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t4{width: 0.586666rem; height: 0.586666rem;margin-left: -1.56rem; top: 2.48rem;  position: absolute; left: 50%;background: url(../images/m7t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t5{width: 0.56rem; height: 0.586666rem; margin-left: -0.906666rem; top: 2.48rem; position: absolute; left: 50%;background: url(../images/m7t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t6{width: 0.6rem; height: 0.586666rem; margin-left: -0.28rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m7t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t7{width: 0.6rem; height: 0.586666rem; margin-left: 0.36rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m7t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t8{width: 0.6rem; height: 0.586666rem; margin-left: 1rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m7t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}.m5note{width: 6.973333rem; height: 1.6rem; margin-left:-3.48rem; top: 4.013333rem;position: absolute; left: 50%; background: url(../images/m5note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t9{width: 0.6rem; height: 0.56rem; margin-left: 1.64rem; top: 2.506666rem;position: absolute; left: 50%; background: url(../images/m7t9.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t10{width: 0.6rem; height: 0.586666rem; margin-left: 2.28rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m7t10.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7t11{width: 0.6rem; height: 0.6rem; margin-left: 2.92rem; top: 2.48rem;position: absolute; left: 50%; background: url(../images/m7t11.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7note{width: 5.12rem; height: 1.16rem; margin-left:-2.653333rem; top: 4.013333rem;position: absolute; left: 50%; background: url(../images/m7note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m7title{width: 4.853333rem; height: 2rem; position: absolute; left: 50%;margin-left: -2.68rem; bottom: 1.853333rem; background: url(../images/m7title.png); background-size: 100% 100%;opacity: 0; -webkit-transform:translateY(-20px);-webkit-transition: all 1500ms;}
.m7title img{width: 100%; height: 100%;-webkit-mask-image: url(../images/hometitle_mask.png); -webkit-mask-position: -4.36rem 0; -webkit-mask-repeat: no-repeat;-webkit-animation: ray 3000ms ease-out infinite;}

.m8t1{width: 0.48rem; height: 0.48rem;margin-left: -2.08rem;   position: absolute; left: 50%; top:8.72rem;background: url(../images/m8t1.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8t2{width: 0.48rem; height: 0.48rem; margin-left: -1.573333rem;  position: absolute; left: 50%; top:8.72rem;background: url(../images/m8t2.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8t3{width: 0.466666rem; height: 0.48rem; margin-left: -1.08rem;  position: absolute; left: 50%; top:8.72rem; background: url(../images/m8t3.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8t4{width: 0.48rem; height: 0.48rem;margin-left: -0.56rem;  position: absolute; left: 50%; top:8.72rem;background: url(../images/m8t4.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8t5{width: 0.493333rem; height: 0.48rem; margin-left: 0.08rem;  position: absolute; left: 50%; top:8.72rem;background: url(../images/m8t5.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8t6{width: 0.48rem; height: 0.48rem; margin-left:0.586666rem; position: absolute; left: 50%; top:8.72rem;background: url(../images/m8t6.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8t7{width: 0.48rem; height: 0.48rem; margin-left: 1.093333rem; position: absolute; left: 50%; top:8.72rem; background: url(../images/m8t7.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8t8{width: 0.48rem; height: 0.48rem; margin-left: 1.6rem; position: absolute; left: 50%; top:8.72rem;background: url(../images/m8t8.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}.m5note{width: 6.973333rem; height: 1.6rem; margin-left:-3.48rem; top: 4.013333rem;position: absolute; left: 50%; background: url(../images/m5note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8card{width: 5.88rem; height: 3.706666rem; margin-left:-2.866666rem; position: absolute; left: 50%; top: 4.226666rem; background: url(../images/m8card.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8note{width: 3.186666rem; height: 1.293333rem; margin-left:-1.586666rem; position: absolute; left: 50%; top: 10.146666rem; background: url(../images/m8note.png); background-size: 100% 100%;opacity: 0;-webkit-transition: all 1500ms;}
.m8title{width: 5.413333rem; height: 1.373333rem; position: absolute; left: 50%;margin-left: -2.586666rem; top: 2.333333rem; background: url(../images/m8title.png); background-size: 100% 100%;opacity: 0; -webkit-transform:translateY(-20px);-webkit-transition: all 1500ms;}
.m8title img{width: 100%; height: 100%;-webkit-mask-image: url(../images/hometitle_mask.png); -webkit-mask-position: -4.36rem 0; -webkit-mask-repeat: no-repeat;-webkit-animation: ray 3000ms ease-out infinite;}
.m8btn1{width: 3.066666rem; height: 0.813333rem; margin-left:-3.253333rem; position: absolute; left: 50%; bottom: 2.186666rem; background: url(../images/m8btn1.png); background-size: 100% 100%;opacity: 0;-webkit-transform:translateY(20px);-webkit-transition: all 600ms;}
.m8btn2{width:  3.066666rem; height: 0.813333rem; margin-left:0.2rem; position: absolute; left: 50%; bottom: 2.186666rem; background: url(../images/m8btn2.png); background-size: 100% 100%;opacity: 0;-webkit-transform:translateY(20px);-webkit-transition: all 600ms;}



.in .titleZero{-webkit-animation: titleIn 1500ms forwards;}
.out .titleZero{-webkit-animation: titleOut 600ms forwards;}
@-webkit-keyframes titleIn{   
	0%{-webkit-transform: translateY(0.533333rem);opacity: 0;}
	100%{-webkit-transform: translateY(0);opacity: 1;}
}
@-webkit-keyframes titleOut{   
	0%{-webkit-transform: translateY(0);opacity: 1;}
	100%{-webkit-transform: translateY(-0.533333rem);opacity:0;}
}
.in .note{-webkit-animation: noteIn 1500ms forwards;}
.out .note{-webkit-animation: noteOut 600ms forwards;}
@-webkit-keyframes noteIn{   
	0%{-webkit-transform: translateY(0.266666rem);opacity: 0;}
	100%{-webkit-transform: translateY(0);opacity: 1;}
}
@-webkit-keyframes noteOut{   
	0%{-webkit-transform: translateY(0);opacity: 1;}
	100%{-webkit-transform: translateY(0);opacity:0;}
}
.swiper-slide-active .titleZero2{opacity: 1; -webkit-transform:translateY(0px);-webkit-transition: all 1000ms 500ms;}
.swiper-slide-active .titleZero3{opacity: 1; -webkit-transform:translateY(0px);-webkit-transition: all 1000ms 800ms;}
.swiper-slide-active .bgfade{opacity: 1; -webkit-transition: all 1000ms;}
.swiper-slide-active .tfade0{opacity: 1; -webkit-transition: all 1000ms 0ms;}
.swiper-slide-active .tfade1{opacity: 1; -webkit-transition: all 1000ms 100ms;}
.swiper-slide-active .tfade2{opacity: 1; -webkit-transition: all 1000ms 200ms;}
.swiper-slide-active .tfade3{opacity: 1; -webkit-transition: all 1000ms 300ms;}
.swiper-slide-active .tfade4{opacity: 1; -webkit-transition: all 1000ms 400ms;}
.swiper-slide-active .tfade5{opacity: 1; -webkit-transition: all 1000ms 500ms;}
.swiper-slide-active .tfade6{opacity: 1; -webkit-transition: all 1000ms 600ms;}
.swiper-slide-active .tfade7{opacity: 1; -webkit-transition: all 1000ms 700ms;}
.swiper-slide-active .tfade8{opacity: 1; -webkit-transition: all 1000ms 800ms;}
.swiper-slide-active .tfade9{opacity: 1; -webkit-transition: all 1000ms 900ms;}
.swiper-slide-active .tfade10{opacity: 1; -webkit-transition: all 1000ms 1000ms;}

.arraw{width: 0.693333rem; height: 0.28rem; position: absolute; left: 50%; margin-left: -0.333333rem; bottom: 1.06rem; opacity: 0;-webkit-transition: all 1000ms;}
.arraw img{ position: absolute; width: 100%; height: 100%; left:0; top:0;-webkit-animation: ar 1000ms ease-in-out infinite;}
@-webkit-keyframes ar{   
	0%{-webkit-transform: translateY(0);}
	50%{-webkit-transform: translateY(0.133333rem);}
	100%{-webkit-transform: translateY(0);}
}



/* popups */

.md-modal {position: fixed;top: 50%;left: 50%;max-width: 10rem;min-width: 4.266666rem;height: auto;z-index: 2000;visibility: hidden;-webkit-backface-visibility: hidden;-webkit-transform: translateX(-50%) translateY(-50%);}
.md-show {visibility: visible;}
.md-overlay {position: fixed;width: 100%;height: 100%;visibility: hidden;top: 0;left: 0;z-index: 1000;opacity: 0;background: rgba(0,0,0,0.6);-webkit-transition: all 0.3s;}
.md-show ~ .md-overlay {opacity: 1;visibility: visible;}

/* Content styles */
.md-content {position: relative;border-radius: 0.133333rem;border: 1px solid #0090FF; box-shadow: 0 0 0.2rem rgba(0,0,0,1); margin: 0 auto;

}
.md-effect-3 .md-content {-webkit-transform: translateY(20%);opacity: 0;-webkit-transition: all 0.3s;}
.md-show.md-effect-3 .md-content {-webkit-transform: translateY(0);opacity: 1;}


.popUp{background: #0c0c0c; border: 0.04rem solid #57391F; width: 8.093333rem; height: 7.96rem;   text-align: center;}
.popUp .md-close{ width: 0.453333rem; height: 0.453333rem; position: absolute; display: block; right: 0.293333rem;top: 0.293333rem; background:url(../images/closeBtn.png); background-size: 100% 100%;z-index: 1;}
.popUp .popUpTitle{width: 2.04rem; height: 0.453333rem; margin: auto; margin-top: 1.133333rem; margin-bottom: 0.626666rem;  background: url(../images/popuptitle.png); background-size: 100% 100%;}
.popUp h3{width: 7.04rem; height: 0.653333rem; line-height: 0.653333rem; text-align: center; background: #553927; color: #FFF; font-size: 15px; font-weight: normal; margin: auto;}
.popUp p{ width: 7.04rem; margin:auto; color: #d28f61; font-size: 13px; text-align: left; margin-top: 0.266666rem; margin-bottom: 0.533333rem;}