body{
	background: #181a1a;
	font-family: "Microsoft Yahei";
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
}

.u-btn{
    cursor: pointer;
}

.fl {
    float: left;
}
.cl {
    clear: both;
}
.bl {
    display: block;
}
.ab {
    position: absolute;
}
.rl {
    position: relative;
}
.test{border: 1px solid red;}

.topcontainer{
    margin: 0 auto;
    width: 100%;
    overflow: hidden;
    position: relative;
    height: 1080px;
    background: url(../images/Mbg.jpg) no-repeat center;
}

.Merchants{width:910px;height:607px;left:50%;margin-left:-457px;top:248px;color:#f4af38;}

.Merchants .MerchantInfo{width:278px;height:236px;}
.Merchants .MerchantInfo .MerchantMsg{
	width: 130px;
	height: 109px;
	top: 31px;
	left: 69px;
	color:#000;
	font-size: 12px;
}

.Merchants .MerchantInfo .MerchantQQlink{width:101px;height:27px;background: url(../images/btn-1.jpg) no-repeat center;top:170px;left: 83px;}
.Merchants .MerchantInfo .MerchantWechatQr{width:101px;height:27px;background: url(../images/btn-1.jpg) no-repeat center;top:200px;left: 83px;}

.Merchants .MerchantInfo .MerchantQQlink span{
	width: 48px;
	height: 13px;
	top: 3px;
	left: 26px;
	color: #bf7102;

}
.Merchants .MerchantInfo .MerchantWechatQr span{color:white;width:65px;height:13px;top:3px;left:20px;color: #bf7102;}

.Merchants .marchant1{}
.Merchants .marchant2{top:123px;left:210px;}
.Merchants .marchant3{top:1px;left:423px;}
.Merchants .marchant4{top:123px;left:636px;}
.Merchants .marchant5{top:245px;}
.Merchants .marchant6{top:368px;left:210px;}
.Merchants .marchant7{top:245px;left:423px;}
.Merchants .marchant8{top:368px;left:636px;}

.div1{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
/*    height: 1080px;*/
    /*height: 1080px;*/
    background: url(../images/bg01.gif) center no-repeat;
}

.div2{
    position: absolute;
    top: 0;
    left: 0; 
    width: 100%;
   /* height: 1080px;*/
    background: url(../images/bg02.jpg) center no-repeat;    
}

.div3{
    position: absolute;
    top: 0;
    left: 0; 
    width: 100%;
   /* height: 1080px;*/
   z-index: -1;
    background: url(../images/bg03.jpg) center no-repeat;  
}

.div4{
    position: absolute;
    top: 0;
    left: 0; 
    width: 100%;
   /* height: 1080px;*/
    background: url(../images/bg04.jpg) center no-repeat;  

}

.div4 .circle{width:215px;height:228px;z-index: 50;}
.div4 .circle:hover{background: url(../images/yuan.png) center no-repeat;}
.div4 .circle .ctext{width:163px;height:130px;color: white;top:47px;left:18px;display: none;}

.div4 .square{width:181px;height:120px;z-index: 50;}
.div4 .square:hover{background: url(../images/fang.png) center no-repeat;}
.div4 .square .ctext{width:163px;height:130px;color: white;top:7px;left:18px;display: none;}

.div4 .qzxt{top:322px;left:50%;margin-left:-41px;}
.div4 .qzjx{top:322px;left:50%;margin-left:273px;}
.div4 .yyjx{top:589px;left:50%;margin-left:-88px;}
.div4 .gcld{top:589px;left:50%;margin-left:109px;}
.div4 .stjj{top:589px;left:50%;margin-left:305px;}

.merchantfixed{ display:none; position:fixed; z-index:999; left:0; top:50%; margin-top:-142px; width:66px; height:219px; background:url(../images/leftbtn.png) no-repeat;-webkit-animation:scroll 0.8s ease 0s both;animation:scroll 0.8s ease 0s both; -webkit-transform-origin:300px center;  transform-origin:300px center; }
.BackToMainWeb,.DownloadGame{height:103px;width:48px;}

.nav{
    width:230px;height:124px;left:50%;margin-left:-436px;top:527px;z-index: 50;
}
.nav .nav1{width:230px;height:84px;}
.nav .nav1:hover{background: url(../images/btn02.png) center no-repeat;background-position: 1px 1px;cursor: pointer;}

.nav .nav2,.nav .nav3{width:230px;height:84px;}
.nav .nav2{top:88px;left:1px;}
.nav .nav3{top:88px;left:120px;}
.nav .nav1,.nav .nav3:hover{cursor: pointer;}
.nav .nav2{width:230px;height:84px;}
.nav .nav2:hover{background: url(../images/btn03.png) center no-repeat;/*! background-position: 0px 0px; */cursor: pointer;}

.slideBox{width: 1097px;height: 587px;left:50%;margin-left:-446px;top:306px;z-index: 799;}
.slideBox .hd{ height:522px;overflow:hidden; position:absolute; right:-70px;top:-7px; bottom:5px; z-index:; }
.slideBox .hd ul{ overflow:hidden; zoom:1; float:left; width: 65px;}
.slideBox .hd ul li{ float:left; margin-right:-3px; margin-top:5px; width:65px; height:57px; line-height:50px; text-align:center; color: white;font-size:20px; background: url(../images/btn_bg.png) center no-repeat; cursor:pointer; }
.slideBox .hd ul li.on{ background:#f00; background: url(../images/btn_bgC.png) center no-repeat; }
.slideBox .bd{ position:relative; height:100%; z-index:800;   }
.slideBox .bd li{ zoom:1; vertical-align:middle; margin-left:-10px;margin-top:10px;}
.slideBox .bd img{ width:1097px; height:587px; display:block;  }

/* 下面是前/后按钮代码，如果不需要删除即可 */
.slideBox .prev,
.slideBox .next{ position:absolute; left:3%; top:50%; margin-top:-25px; display:block; width:32px; height:40px; background:url(images/slider-arrow.png) -110px 5px no-repeat; filter:alpha(opacity=50);opacity:0.5;   }
.slideBox .next{ left:auto; right:3%; background-position:8px 5px; }
.slideBox .prev:hover,
.slideBox .next:hover{ filter:alpha(opacity=100);opacity:1;  }
.slideBox .prevStop{ display:none;  }
.slideBox .nextStop{ display:none;  }


.fixed{ display:none; position:fixed; z-index:999; right:0; top:50%; margin-top:-242px; width:122px; height:485px; background:url(../images/bg_fixed.png) no-repeat;-webkit-animation:scroll 0.8s ease 0s both;animation:scroll 0.8s ease 0s both; -webkit-transform-origin:300px center;  transform-origin:300px center; }
.fixed a,.fixed a span,.fixed a ins,.goindex span,.video span,.video ins,.mouse span{ background-image:url(../images/sprite.png); background-repeat:no-repeat; }
.fixed a{ position:absolute; width:83px; height:75px; cursor:pointer; background-position:0 0;-webkit-animation:trans_circle 0.4s ease-out 0s both;animation:trans_circle 0.4s ease-out 0s both;  }
.fixed a:hover,.fixed a.current{  background-position:0 -80px; }
.fixed a.fixed_01{ right:37px; top:76px; animation-delay:0.4s; }
.fixed a.fixed_02{ right:46px; top:86px; animation-delay:0.6s;}
.fixed a.fixed_03{ right:66px; top:156px; animation-delay:0.8s;}
.fixed a.fixed_04{ right:66px; top:228px; animation-delay:1s;}
.fixed a.fixed_05{ right:52px; top:303px; animation-delay:1.2s;}
.fixed a.fixed_06{ right:12px; top:372px; animation-delay:1.4s;}
.fixed a span,.fixed a ins{  position:absolute; width:83px; height:75px; right:0px; top:0px;}
.fixed a span{ -webkit-transition:all 0.8s ease-out 0s;transition:all 0.8s ease-out 0s; }
.fixed a:hover span,.fixed a.current span{ transform:scale(1.1); }
.fixed a ins{ opacity:0; filter:alpha(opacity=0); background-position:0 0; }
.fixed a:hover ins,.fixed a.current ins{ -webkit-animation:scalebig 1s ease-out 0s both;animation:scalebig 1s ease-out 0s both; }
.fixed a.current ins{ -webkit-animation-iteration-count:2; animation-iteration-count:2; }

.fixed a.fixed_01 span{ background-position:0px -155px; }
.fixed a.fixed_02 span{ background-position:0px -232px; }
.fixed a.fixed_03 span{ background-position:-0px -310px; }
.fixed a.fixed_04 span{ background-position:-2px -537px; }
.fixed a.fixed_05 span{ background-position:0px -382px; }
.fixed a.fixed_06 span{ background-position:-1px -461px; }



.fade {
	-webkit-opacity:0;
	-moz-opacity:0;
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition:1s;
	-moz-transition:1s; 
	-ms-transition:1s;
	-o-transition:1s;
	transition:1s
}
.fade.fadeIn {
	z-index:10;
	-webkit-opacity:1;
	-moz-opacity:1;
	opacity:1;
	filter:alpha(opacity=100)
}
 .zb000 {
opacity:0;position: absolute;left: 50%;margin-left: -478px;margin-top: 389px;
}
.fadeIn .zb000 {
opacity:1;position: absolute;left: 50%;margin-left: -478px;margin-top: 389px;
}

.masky{
    width: 100%;
    height: 1080px;
/*    height: 100%;*/
    position: absolute;
    left: 0;
    top: 0;
    z-index: 801;
    -webkit-mask: url(../images/masky.png) center no-repeat;
    -webkit-mask-size: 4000% 100%;
    will-change: transform;
}

.masky.show{
    -webkit-animation: masky .85s steps(39) forwards 300ms 0 ease;
    -moz-animation: masky .85s steps(39) forwards 300ms 0 ease;
    -ms-animation: masky .85s steps(39) forwards 300ms 0 ease;
    animation: masky .85s steps(39) forwards 300ms 0 ease;
    -moz-animation: masky .85s steps(39) forwards;
    -webkit-animation: masky .85s steps(39) forwards;
    -o-animation: masky .85s steps(39) forwards;
    -ms-animation: masky .85s steps(39) forwards;
    animation: masky .85s steps(39) forwards;
}

.masky.end {
	-webkit-mask-position:100% 0
}
@-webkit-keyframes masky {
	0% {
	-webkit-mask-position:0 0
}
100% {
	-webkit-mask-position:100% 0
}
}@-moz-keyframes masky {
	0% {
	-webkit-mask-position:0 0
}
100% {
	-webkit-mask-position:100% 0
}
}@-ms-keyframes masky {
	0% {
	-webkit-mask-position:0 0
}
100% {
	-webkit-mask-position:100% 0
}
}@-o-keyframes masky {
	0% {
	-webkit-mask-position:0 0
}
100% {
	-webkit-mask-position:100% 0
}
}@keyframes masky {
	0% {
	-webkit-mask-position:0 0
}
100% {
	-webkit-mask-position:100% 0
}
}

@-webkit-keyframes moveUp {
  0% {
    -webkit-transform: translateY(20%);
    transform: translateY(20%);
    opacity: 0; }
  50% {
    -webkit-transform: translateY(0%);
    transform: translateY(0%);
    opacity: 1; }
  100% {
    -webkit-transform: translateY(-20%);
    transform: translateY(-20%);
    opacity: 0; } }

@keyframes moveUp {
  0% {
    -webkit-transform: translateY(20%);
    transform: translateY(20%);
    opacity: 0; }
  50% {
    -webkit-transform: translateY(0%);
    transform: translateY(0%);
    opacity: 1; }
  100% {
    -webkit-transform: translateY(-20%);
    transform: translateY(-20%);
    opacity: 0; } }