@charset "utf-8";
/* CSS Document */
.headbx{
	position:relative;
	width:100%;
	padding-bottom:50.4%;/*1008*/
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image: url(../images/index.jpg);
	background-size:100% auto;
	overflow:hidden;
	}
.allbg.on .headbx{padding-bottom:50%;}/*56.9*/

.logo{
	position:absolute;
	width:17.3%;/*346*/
	padding-bottom:7.8%;/*156*/
	display:block;
	cursor:pointer;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image: url(../images/logo.png);
	background-size:100% auto;
	top:0;
	left:0;
	z-index:6;
	}
.mlogo{
	position:relative;
	width:100%;	
	padding-bottom:49.35897435897436%;/*385*/
	display:none;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image: url(../images/mlogo.png);
	background-size:90% auto;
	}
/*.lantern_l,.lantern_r{
	position:absolute;
	pointer-events:none;
	display:block;
	}
.lantern_l > div,.lantern_r > div,
.lantern_l > div::before,.lantern_r > div::before{
	position:relative;
	width:100%;
	display:block;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-size:100% auto;
	}*/
/*.lantern_l > div::before,.lantern_r > div::before{content:'';}
.lantern_l > div{background-image: url(../images/lantern_l.png);}
.lantern_l > div::before{
	padding-bottom:152.91%;
	background-image: url(../images/lantern_l_1.png);
	-moz-animation:fin2 2.5s linear infinite;
	-webkit-animation:fin2 2.5s linear infinite;
	-o-animation:fin2 2.5s linear infinite;
	-ms-animation:fin2 2.5s linear infinite;
	animation:fin2 2.5s linear infinite;
	}*/
/*.lantern_r > div{background-image: url(../images/lantern_r.png);}
.lantern_r > div::before{
	padding-bottom:204.4334975369458%;
	background-image: url(../images/lantern_r_1.png);
	-moz-animation:fin2 2.2s linear infinite;
	-webkit-animation:fin2 2.2s linear infinite;
	-o-animation:fin2 2.2s linear infinite;
	-ms-animation:fin2 2.2s linear infinite;
	animation:fin2 2.2s linear infinite;
	}
.lantern_l{
	width:18.9%;
	left:9.45%;
	top:-5%;
	-webkit-animation:ma1 4s linear infinite;
	-o-animation:ma1 4s linear  infinite;
	animation:ma1 4s linear  infinite;
	}
.lantern_r{
	width:20.3%;
	right:6.3%;
	top:-11.5%;
	-webkit-animation:ma2 3.8s linear infinite;
	-o-animation:ma 3.8s linear infinite;
	animation:ma2 3.8s linear infinite;
	}*/
.allbg{
	position:relative;
	width:100%;
	display:block;
	background-color:#010102;
	background-attachment:scroll;
	background-repeat:repeat;
	background-position:50% 0%;
	background-image:url(../images/mbg.jpg);
	background-size:39% auto;/**/
	}
.allbg::after{
	position: relative;
	width: 100%;
	content:'';
	display:block;
	}
.cbxh{
	position:absolute;
	width:100%;
	padding-bottom:21%;/*441*/
	display:block;
	bottom:0;
	left: 0;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image: url(../images/t_bg.png);
	background-size:100% auto;
	opacity:0;
	/*transition: all .5s;*/
	}
.allbg.on .cbxh{
	opacity:1;
	}

/*.cbxh::before{
	position:absolute;
	width: 100%;
	height: 100%;
	content:'';
	display:block;
	pointer-events: none;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image: url(../images/cbxh_1.png);
	background-size:100% auto;
	top: 0;
	left: 0;
	z-index: 4;
	}
.money{
	position:absolute;
	width: 100%;
	padding-bottom:8.4%;
	display:block;
	pointer-events:none;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image: url(../images/cbxh_2.png);
	background-size:100% auto;
	bottom:0;
	left: 0;
	z-index: 2;
	}*/
.gobtbx,.allbg.on .gobtbx{
	position:relative;
	width:100%;
	display: none;
	padding-bottom:50%;
	}
/*.fr1{
	position:absolute;
	width:7.75vw;*//*155*/
	/*padding-bottom:4.35vw;*//*87*/
	/*display:block;
	pointer-events:none;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;	
	background-image: url(../images/fr1.png);
	background-size:90% auto;
	right: 8vw;
	top:47.8vw;
	z-index:2;
	}
.allbg.on .fr1{right:8.5vw;top:48.2vw;}*/
/*.fireworks,.fireworks2,.fireworks3,.fireworks4{
	position:absolute;
	display:block;
	pointer-events:none;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;	
	background-size:100% auto;
	z-index:1;
	}
.fireworks,.fireworks2{
	width:10.3%;
	padding-bottom:10.3%;
	}
.fireworks{
	background-image: url(../images/fireworks0.png);
	background-size:100% auto;
	top:7.3vw;
	left:7.5%;
	}
.fireworks2{
	background-image: url(../images/fireworks1.png);
	top:56%;
	left:85.5%;
	}
.fireworks3{
	width:8.5%;
	padding-bottom:8.5%;
	background-image: url(../images/fireworks2.png);
	background-size:100% auto;
	top:62%;
	left:8%;
	}
.fireworks4{
	width:7.5%;
	padding-bottom:7.5%;
	background-image: url(../images/fireworks3.png);
	background-size:100% auto;
	top:.8%;
	left:63%;
	}*/
/**/
.mubx{
	position:absolute;
	width:100%;
	display:block;
	left:0;
	top:0;/*22vw*/
	/*z-index:5;
	background-color: #FFF;*/
	}
.mbg{
	position:relative;
	width:100%;
	display:block;
	}

.adbx{
	position:relative;
	width:17.8%;/*350*/
	padding:1.4vw 0 0;
	margin:0 0 0 75%;/*-21.2vw 0 0 75%*/
	display:block;
	overflow:hidden;
/*	-webkit-filter: drop-shadow(0 15px 85px rgba(29, 6, 2, 1));
	filter: drop-shadow(0 15px 85px rgba(29, 6, 2, 1));
  	transition: all .5s;*/
	}
.adbx a{
	position: relative;
	padding-bottom:2.3vw;/*46*/
	display:block;
	background-attachment:scroll;
	background-repeat:no-repeat;	
	background-size:100% auto;
	}
.adbx a::before{
	position: absolute;
	width:100%;
	height:100%;
	display:block;
	content:"";
	background-attachment:scroll;
	background-repeat:no-repeat;	
	background-size:100% auto;
	opacity: 0;
	transition: all .5s;
	}
.adbx a:hover::before{opacity:1;}
.adbx a.acc{
	width:6vw;/*120*/
	background-position:100% 50%;
	float:left;
	background-image: url(../images/acc_dwn_01.png);
	}
.adbx a.acc::before{
	background-position:100% 50%;
	background-image: url(../images/acc_dwn_01a.png);
	}
.adbx a.dwn{
	width:5.45vw;/*109*/
	background-position:0% 50%;
	float: left;
	background-image: url(../images/acc_dwn_02.png);
	}
.adbx a.dwn::before{
	background-position:0% 50%;
	background-image: url(../images/acc_dwn_02a.png);
	}
#reset_password2{
	width:6.05vw;/*121*/
	background-position:0% 50%;
	float: left;
	display:block;
	background-image: url(../images/acc_dwn_03.png);
	}
#reset_password2::before{
	background-position:0% 50%;
	background-image: url(../images/acc_dwn_03a.png);
	}

.fbbx{
	position: absolute;
	display: block;
	text-align:right;
	top:1.28vw;/*-21.33vw*/
	right:1.1%;
	z-index:1;
	}
.fbbx a{
	position: relative;
	width:2.5vw;/*50*/
	padding-bottom:2.5vw;
	display:inline-block;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;	
	background-size:100% auto;
	margin: 0 0.25vw;/*5*/
	}
.fbbx a.fb1{background-image: url(../images/f_bt.png);}
.fbbx a.fb2{background-image: url(../images/f_bt2.png);}

/*.r_mubx{
	position:fixed;
	width:2px;
	height:63.8vh;
	display:block;
	background-attachment:scroll;
	background-repeat:repeat-y;
	background-position:0% 0%;	
	background-image: url(../images/rms.png);
	background-size:100% 100%;
	top:0;
	right:3%;
	-webkit-filter: drop-shadow(0 0 25px rgba(41, 22, 19, .6));
	filter: drop-shadow(0 0 25px rgba(41, 22, 19, .6));
	z-index:1;
	}
.r_mubx::before{
	position:absolute;
	width:10vw;
	padding-bottom:12.5vw;
	display:block;
	content:"";
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;	
	background-image: url(../images/r_p.png);
	background-size:100% auto;
	left:-6vw;
	bottom:-5vw;
	}
.r_mb2{
	position:absolute;
	width:6vw;
	height:12.9vw;
	display:block;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;	
	background-image: url(../images/r_mubg.png);
	background-size:100% auto;
	left:50%;
	top:95%;
	transform: translateX(-50%);
	}
.r_mb2::before{
	position:relative;
	width:100%;
	padding-bottom:33.5%;
	display:block;
	content:"";

	}
.r_mb2 a{
	position:relative;
	width:100%;
	padding-bottom:28.33%;
	display:block;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;	
	background-size:100% auto;
	opacity:.8;
	transition: all .5s;
	}
.r_mb2 a:hover{opacity:1;}
.r_mb2 a#new_hero{background-image: url(../images/r_mu1.png);}
.r_mb2 a#hero_return{background-image: url(../images/r_mu2.png);}
.r_mb2 a#reset_password{background-image: url(../images/r_mu_04.png);}
.topbt{
	position: relative;
	width:100%;
	padding-bottom:35%;
	display:block;
	cursor:pointer;
	}*/
.topbx2{
	position: absolute;
	height: 100%;
	display:block;
	right:0.7%;
	top:0;
	z-index: 2;
	}
.topbt2{
	position: sticky;
    width:55px;
    height:40px;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 100%;	
	background-image: url(../images/top2.png);
	background-size:100% auto;
    top:50%;
	right:0;
	display:block;
	cursor:pointer;
	}

/**/
.mbk{
	position:absolute;
	width:100%;
	top: 0;
	left: 0; 
	}
.mh{
	position: relative;
	width:100%;
	/*height:38.6vw;34.8*/
	display:none;
	pointer-events:none;
	}
.allbg.on .mh{display:block;}

/*.mbx{
	position:absolute;
	width:100%;
	display:block;
	left: 0;
	bottom:0;
	z-index:5;
	}*/
.mbxr{
	position:fixed;/*absolute*/
	width:0;/*100% 187px*/
	display:block;
	top:50%;
	right:0;
	transform: translateY(-50%);
	/**/
	pointer-events:none;
	opacity:0;
	/**/
	transition: all .5s;
	}
.moc{
	position: relative;
	width:46px;
	padding-bottom:46px;
	display: block;
	cursor: pointer;	
	margin:0 auto;
	/*left:-60px;*/
	transition: all .5s;
	}
.moc > div{
	position:absolute;
	width:100%;
	height:100%;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	top:0;
	left:0;
	}
.moc .mo{background-image: url(../images/moc2.png);}
.moc .mc{background-image: url(../images/moc1.png);}
.mbxr.on .moc .mo,.mbxr .moc .mc{ display:none; }
.mbxr.on .moc .mc,.mbxr .moc .mo{display:block; }
.mmbx{
	position:relative;
	width:187px;
	padding-left:200px;
	transition: all .5s;
	overflow:hidden;
	}
.mmbx:before,.mmbx:after{
	position:relative;
	width:100%;/*187*/
	padding-bottom:26.7379679144385%;/*50*/
	display:block;
	content:"";
	background-attachment:scroll;
	background-repeat:no-repeat;	
	background-size:100% auto;
	transition: all .5s;
	}
.mmbx:before{background-image: url(../images/mmbx_01.png);}
.mmbx:after{background-image: url(../images/mmbx_03.png);}
.mmb{
	position:relative;
	width:100%;/*187*/
	background-attachment:scroll;
	background-repeat:repeat-y;	
	background-image: url(../images/mmbx_02.png);
	background-size:100% auto;
	overflow: hidden;
	transition: all .5s;
	}
.mbx{
	position:relative;/*absolute*/
	width:180px;/*100%*/
	min-height:8.3vw;/*179 8.95*/
	display:block;
	/*pointer-events:none;*/
	/*bottom:-1vw;
	top:50%;
	right:0;
	transform: translateY(-50%);*/
	left: 12px;
	text-align:center;
	/*background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;	
	background-image: url(../images/mbx.png);
	background-size:100% auto;*/
	/*opacity:0;*/
	/**/
	transition: all .5s;
	}
/*.mbx::before{
	position: relative;
	width:100%;
	padding-bottom:4.5vw;
	display:block;
	content:"";
	}*/
.allbg.on .mbxr{ /*.mbx*/
	/*position:sticky;
	bottom:0;*/
	width:0;
	pointer-events:auto;
	opacity: 1;
	z-index:1;
	-webkit-filter: drop-shadow(-15px 0 55px rgba(0, 0, 0, 1));
	filter: drop-shadow(-15px 0 55px rgba(0, 0, 0, 1));/**/
	}
.allbg.on .mbxr.on{width:187px;z-index:5;}

.allbg.on .mbxr .mmbx{padding-left:200px;}

.allbg.on .mbxr.on .mmbx{padding-left:0;}

.allbg.on .mbxr.on .moc{left:10px;}
.allbg.on .mbxr .moc{left:-60px;}



.mbx li{
	position: relative;
	/*width:11vw;220*/
	/*height:3.25vw;65*/
	width:100%;/*230 11.5vw*/
	padding-bottom: 29.565%;
	/*height:3.4vw;*//*68 */
	display:inline-block;
	margin:.3rem auto;/*0 -0.6vw*/
	transition: all .5s;
	}
.mubx2{
	position:absolute;/*relative*/
	width: 50.2%;/*1004*/
	display: block;
	text-align:center;
	top:37vw;/*770*/
	left:17.9vw;/*390*/
	z-index:5;
	/*transition: all .5s;*/
	}
.allbg.on .mubx2{
	pointer-events:none;
	opacity:0;
	}
/*.allbg.on .mubx2 li:nth-child(1),.allbg.on .mubx2 li:nth-child(2),.allbg.on .mubx2 li:nth-child(3),.allbg.on .mubx2 li:nth-child(4){margin-bottom:0.1vw;}*/
.allbg.on .mubx2 li{
	/*width:11.5vw;230*/
	/*height:3.4vw;68*/
	}
.mubx2 li{
	position: relative;
	width:12.55vw;/*251*/
	height:3.7vw;/*74*/
	display:inline-block;
	margin: 0 -0.5vw;/*-3 22*/
	transition: all .5s;
	}
.mubx2 li:nth-child(1),.mubx2 li:nth-child(2),.mubx2 li:nth-child(3),.mubx2 li:nth-child(4){margin-bottom:1.1vw;}
.mubx2 li a,.mbx li a{
	position:absolute;
	width:100%;
	height:100%; 
	display:block;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;	
	background-size:100% auto;
	top:0;
	left:0;
	z-index:1;
	transition: all .5s;
	}
.mubx2 li:hover a ,.mubx2 li.on a{
	/*height:107%;
	top:-15%;
	-webkit-filter: drop-shadow(0 0 20px rgba(41, 22, 19, .8));
	filter: drop-shadow(0 0 20px rgba(41, 22, 19, .8));*/
	}

/*.mubx2 li::before,.mubx2 li::after{
	position:absolute;
	width:100%;
	height:100%; 
	display:block;
	content:"";
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	left:0;
	top:0;
	transition: all .5s;
	-webkit-filter: drop-shadow(0 0 25px rgba(41, 22, 19, .8));
	filter: drop-shadow(0 0 25px rgba(41, 22, 19, .8));
	}
.mubx2 li::before{background-image: url(../images/mu_b.png);}*/
/*.mubx2 li::after{background-image: url(../images/mu_a.png);}
.mubx2 li:hover::before,.mubx2 li.on::before{animation: rotate 6s linear infinite;}
.mubx2 li:hover::after,.mubx2 li.on::after{animation: rotate2 6s linear infinite;}*/

.mubx2 li a::before,.mbx li a::before{
	position:absolute;
	width:100%;
	height:100%;
	display:block;
	content:"";
	background-size:100% auto;
	top:0;
	left:0;
	opacity: 0;
	transition: all .5s;
	/*mix-blend-mode:multiply;*/
	}
.mubx2 li a.mu1::before,.mbx li a.mu1::before{background-image: url(../images/mu1a.png);}
.mubx2 li a.mu2::before,.mbx li a.mu2::before{background-image: url(../images/mu2a.png);}
.mubx2 li a.mu3::before,.mbx li a.mu3::before{background-image: url(../images/mu3a.png);}
.mubx2 li a.mu4::before,.mbx li a.mu4::before{background-image: url(../images/mu4a.png);}
.mubx2 li a.mu5::before,.mbx li a.mu5::before{background-image: url(../images/mu5a.png);}
.mubx2 li a.mu6::before,.mbx li a.mu6::before{background-image: url(../images/mu6a.png);}
.mubx2 li a.mu7::before,.mbx li a.mu7::before{background-image: url(../images/mu7a.png);}
.mubx2 li a.mu8::before,.mbx li a.mu8::before{background-image: url(../images/mu8a.png);}
.mubx2 li.on,.mubx2 li:hover,.mbx li.on,.mbx li:hover{
	-webkit-filter: drop-shadow(0 0 15px rgba(15, 18, 20, .8));
	filter: drop-shadow(0 0 15px rgba(15, 18, 20,.8));
	z-index: 1;
	}
.mubx2 li.on a::before,.mbx li.on a::before{opacity:1;}
.mubx2 li a:hover::before,.mbx li a:hover::before{opacity:1;}
/*.mubx2 li a::after{
	position:absolute;
	width: 100%;
	padding-bottom:14.51612903225806%;
	display:block;
	content:"";
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 100%;
	background-size:100% auto;
	left: 0;
	bottom:0;
	}*/
.mu1{background-image: url(../images/mu1.png);}
.mu2{background-image: url(../images/mu2.png);}
.mu3{background-image: url(../images/mu3.png);}
.mu4{background-image: url(../images/mu4.png);}
.mu5{background-image: url(../images/mu5.png);}
.mu6{background-image: url(../images/mu6.png);}
.mu7{background-image: url(../images/mu7.png);}
.mu8{background-image: url(../images/mu8.png);}
/*.mu9{background-image: url(../images/mu9.png);}
.mu10{background-image: url(../images/mu10.png);}*/

/* 三明治 */
.menut{
	position:fixed;
 	width:55px;
 	height:55px;
	display:none;
	z-index:5;
	top:0;
	right:0;
	}
.menut::before{
	position:absolute;
	width:85%;
	height:85%;
	display:block;
	content:"";
	border-radius:99px;
	background-image: url(../images/mbg.jpg);
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	opacity:0;
	transition: all .5s;
	}
.menut.on::before{opacity:1;}

.mubx.on .menut.on::before{opacity:0;}	
	
.menu-trigger{
	position:absolute;
 	width:100%;
 	height:100%;
 	cursor:pointer;
 	flex-direction:column;
 	display:flex;
 	align-items:center;
 	justify-content:center;
	top:0;
	left:0;
 	} 
.menu-trigger>.line{
	width:50%;
 	height:3px;
 	border-radius:5px;
 	background-color:#cedaea; 
 	transition: all .3s;
 	-moz-transition: all .3s;
 	-webkit-transition: all .3s;
 	-o-transition: all .3s;
 	}
.menu-trigger>.line:first-child{margin-bottom:8.77%;}
.menu-trigger>.line:last-child{margin-top:8.77%;}
.mubx.on .menu-trigger >.line{opacity:0;transform:rotate(45deg)}
.mubx.on .menu-trigger >.line:first-child{
 	opacity:1;
 	margin-bottom:-3.5%;
 	transform:rotate(-45deg);
 	}
.mubx.on .menu-trigger >.line:last-child{opacity:1;margin-top:-7.01%;}

/**/
.cnbx{
	position:relative;
	width: 100%;
	display:none;
	margin:0 auto;
	}
.allbg.on .cnbx{display: block;}

.cnbx::after,.cnbx::before{
	width: 100%;
	display:block;
	content:"";
	}
.cnbx::before{
	position:relative;
	padding-bottom:0;/*1.2%*/
	}
/*.cnbx::after{
	position: absolute;
	padding-bottom:12.75%;*//*255*/
	/*background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 100%;
	background-image: url(../images/cbxh_3.png);
	background-size:100% auto;
	left: 0;
	bottom:-2.8vw;
	z-index:2;
	}*/
.dwbx{
	position:relative;
	width: 100%;
	padding-bottom:3.8%;
	display:block;
	}
.cobx2{
	position:relative;
	width:1500px;
	margin:0 auto;
	/*z-index:3;*/
	-webkit-filter: drop-shadow(0 -35px 55px rgba(0, 0, 0, .8));
	filter: drop-shadow(0 -35px 55px rgba(0, 0, 0, .8));
	}
.cobx2 .tit{
	position:absolute;
	width:39%;/*586*/
	padding-bottom:6.255972696245734%;/*94*/
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image: url(../images/tit.png);
	background-size:100% auto;
	top:26px;
	left:50%;
	transform: translateX(-50%);
	transition: all .5s;
	}
.cobx2 .con{
	position:relative;
	width: 100%;
	min-height:100px;/**/
	background-attachment:scroll;
	background-repeat:repeat-y;
	background-position:50% 50%;
	background-image: url(../images/cnbx_02.png);
	background-size:100% auto;
	}
.cobx2::after,.cobx2::before{
	position:relative;
	width: 100%;
	display:block;
	content:"";
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-size:100% auto;
	}
.cobx2::before{
	padding-bottom:12.13333333333333%;/*182*/
	background-position:50% 100%;
	background-image: url(../images/cnbx_01.png);
	}
.cobx2::after{
	padding-bottom:11%;/*165*/
	background-position:50% 0%;
	background-image: url(../images/cnbx_03.png);
	}
.clos{
	position: absolute;
	width:6.1%;/*6.6*/
	display:block;
	cursor: pointer;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-image: url(../images/clos.png);
	background-size:100% auto;
	top:-2px;
	right:10.5%;
	z-index: 3;
	}
.clos::before{
	position:relative;
	width:100%;
	padding-bottom:130%;/*130*/
	display:block;
	content:"";
	}
#content{
	position:relative;
	width:85%;
	margin:0 auto;
	}
.gb{
	position: absolute;
	width: 50px;
	height: 50px;
	display: block;
	pointer-events: none;
	z-index:1;
	left: 0;
	bottom:-1.3vw;
	}

/*.pp1{
	position: absolute;
	width:5.6vw;/*112*/
	/*padding-bottom:12.3vw;*//*246*/
	/*right: 48.18vw;
	top: 24vw;
	}
.pp1::before,.pp1::after{
	position:absolute;
	width:100%;
	height:100%;
	display:block;
	content:"";
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-size:100% auto;
	top: 0;
	left: 0;
	}
.pp1::before{
	background-image: url(../images/pp1a.png);
	-webkit-animation: ma3 2.5s linear infinite;
  	-o-animation: ma3 2.5s linear infinite;
  	animation: ma3 2.5s linear infinite;
	}
.pp1::after{
	background-image: url(../images/pp1.png);
	-webkit-animation: ma2 2.5s linear infinite;
  	-o-animation: ma2 2.5s linear infinite;
  	animation: ma2 2.5s linear infinite;
	}*/
#kkb{
  position: absolute;
  width: 100%;
  height: 100vh;
  display:block;
  left: 0;
  top: 0;
  z-index:3;
  pointer-events: none;
  overflow: hidden;
	}
.pbg{
	position:absolute;
	width:100%;
	height:100%; 
	display:block;
	pointer-events:none;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image: url(../images/pbg.png);
	background-size:100% auto;
	top: 0;
	left:0;
	/*z-index: 1;*/
	}
.cloud{
	position:absolute;
	width:100%;
	padding-bottom:50.4%;
	overflow:hidden;
	pointer-events:none;
	/**/
	mix-blend-mode:screen;
	-moz-mix-blend-mode:screen;
	-webkit-mix-blend-mode:screen;
	-o-mix-blend-mode:screen;
	-ms-mix-blend-mode:screen;
	top:0;
	left:0;
	opacity:.5;
	}
/*.cloud::before{
	position:absolute;	
	width:105%;
	padding-bottom:12%;
	display: block;
	content:'';
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image: url(../images/cck.png);
	background-size:100% auto;
	bottom: 0;
	left:50%;
	transform:translateX(-50%);
	z-index: 1;
	}*/
.cloud video{
	position:absolute;
	width:115%;
	/*x-blend-mode:screen;
	-moz-mix-blend-mode:screen;
	-webkit-mix-blend-mode:screen;
	-o-mix-blend-mode:screen;
	-ms-mix-blend-mode:screen;*/
	bottom: 0;
	left:50%;
	transform:translateX(-50%);
	}
.allbg.on .cloud{padding-bottom: 44.5%;opacity:1;}


@media only screen and (max-width:1500px){
/**/
.cobx2{width:100%;}
.cobx2 .tit{top:2vw;}
	
/**/
.mmbx{width:177px;}
.mbx{
	width:170px;
	left:12px;
	}
.allbg.on .mbxr.on{width:177px;}	
	
	
	
}
@media only screen and (max-width:1400px){
/**/

}
@media only screen and (max-width:1000px){	
/**/
/**/
.mmbx{width:167px;}
.mbx{
	width:160px;
	left:12px;
	}
.allbg.on .mbxr.on{width:167px;}
.mbx li {margin: .15rem auto;}
	
	
}
@media only screen and (max-width:900px){
/**/

}
@media only screen and (max-width:780px){
/**/
.headbx{
	padding-bottom:173.5%;
	background-image: url(../images/index_m.jpg);
	}
.allbg.on .headbx{padding-bottom:172%;}
.logo{
	width:44.358%;/*346*/
	padding-bottom:19.99956%;/*156*/
	top:-.5%;
	left:-3.2%;
	z-index:2;
	}
.mlogo{display:block;}
	
	
/*.lantern_l > div{background-image: url(../images/lantern_l_m.png);}
.lantern_l > div::before{
	padding-bottom:166.6666666666667%;
	background-image: url(../images/lantern_l_m_1.png);
	}
.lantern_r > div{background-image: url(../images/lantern_r_m.png);}
.lantern_r > div::before{
	padding-bottom:237.9204892966361%;
	background-image: url(../images/lantern_r_m_1.png);
	}*/
/*.lantern_l{
	width:47.69230769230769%;
	left:-13%;
	top:0%;
	}
.lantern_r{
	width:41.92307692307692%;
	right:-17%;
	top:0%;
	}*/
.allbg{/*background-image:url(../images/cbxhbg_m.png);*/background-size:100% auto;}
/*.allbg::after{padding-bottom:15%;}*/
.cbxh{padding-bottom:36.8%;/*255*/}
.allbg.on .cbxh{background-image: url(../images/tm_bg.png);}
	
/*.cbxh::before{background-image: url(../images/cbxh_m_1a.png);}
.money{
	padding-bottom:32%;
	background-image: url(../images/cbxh_2_m.png);
	}
.fr1 {display:none;}*/
.gobtbx{
	position: absolute;
	width:64.1025641025641%;/*500*/
	padding-bottom:27.82051282051282%;/*217*/
	display:block;
	bottom:5.5vw;
	left:50%;
	transform: translateX(-50%);
	/**/
	-webkit-filter: drop-shadow(0 0 25px rgba(0, 0, 0, .8));
	filter: drop-shadow(0 0 25px rgba(0, 0, 0, .8));
	}
.gobtbx::after{/*.gobtbx::before,*/
	position:absolute;
	width:100%;
	height:100%; 
	display:block;
	pointer-events:none;
	content:"";
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	left:0;
	top:0;
	/*transition: all .5s;*/
	}
/*.gobtbx::before{background-image: url(../images/mu_b.png);animation: rotate 6s linear infinite;}*/
.gobtbx::after{background-image: url(../images/gobt_1a.png);animation: fin 1.5s linear infinite;}
	
.allbg.on .gobtbx{display:none;}
.gobtbx a{
	position: absolute;
	width:100%;
	height:100%; 
	display:block;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image: url(../images/gobt_1.png);
	background-size:100% auto;
	top:0;
	left:0;
	}
/*.gobtbx a::before{
	position: absolute;
	width:100%;
	height:100%;
	content:'';
	display:block;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image: url(../images/gobt_2.png);
	background-size:100% auto;
	opacity: .5;
	top: 0;
	left: 0;
	animation: rotate 10s linear infinite;	
	}
.fireworks{
	width:17%;
	padding-bottom:17%;
	top:auto;
	bottom: -3vw;
	left:81.5%;
	z-index:2;
	}
.fireworks2{
	width:22%;
	padding-bottom:22%;
	top:62.5%;
	left:90.5%;
	}
.fireworks3{
	width:22%;
	padding-bottom:22%;
	top:62.5%;
	left:-13%;
	}
.fireworks4{
	width:20.5%;
	padding-bottom:20.5%;
	top:1.8%;
	left:63%;
	}*/
/**/
.mubx{
	position:fixed;
	width:100%;
	display:block;
  	top: 0;
	z-index:5;
	}
.mbg{
	position:relative;
	width:100%;
	height:100vh;
	display:none;
	background-attachment:scroll;
	background-repeat:repeat-y;
	background-position:50% 50%;
	background-image: url(../images/mbg.jpg);
	background-size:100% auto;
	overflow:auto;
	}
.mbg::after{
	position:relative;
	width:100%;
	padding-bottom:10%;
	content:'';
	display: block;
	}
	
.mh{display:none;}
.mbxr{display:none;}/*.mbx*/	
	
.mubx.on .mbg{display:block;}
.adbx{
	width:90%;
	padding:0;
	margin:0 auto 25px;/*15*/
	text-align: center;
	overflow: hidden;
	-webkit-filter: drop-shadow(0 0 0 rgba(29, 6, 2, 0));
	filter: drop-shadow(0 0 0 rgba(29, 6, 2, 0));
	}
.adbx::before{
	position:absolute;
	width:1px;
	height:50%;
    content:'';
    background-color:#948b6b;
    left:50%;
    top:25%;
	transform: translateX(-50%);
    opacity:.5;
	}
.adbx a{
	position:relative;
	width:50%;
	padding-bottom:0;
	display:inline-block;
	text-align:center;
	margin:0 -2px;
	/**/
	font-size:5.76923vw;/*45*/
	line-height:10.25641vw;/*80*/
	color:#daad81;
	}
.adbx a::before{
	position:relative;
	width:100%;
	height:auto;
	opacity:1;
	}
#download{display:none;}	
#reset_password2{
	width:50%;
	float:none;
	display:inline-block;
	background-image:none;
	}	
.adbx a.acc{
	width:50%;
	float:none;
	background-image:none;
	}
.adbx a.acc::before{content:"帳號申請";background-image:none;}
.adbx a.dwn{
	float:none;
	background-image:none;
	}
.adbx a#reset_password2::before{width:100%;content:"找回密碼";background-image:none;}	
	
.fbbx{
	position:relative;
	text-align:center;
	top:0;
	right:0;
	margin:25px auto 0;/*15*/
	}
.fbbx a{
	position: relative;
	width:80px;
	padding-bottom:80px;
	margin: 0 3.5%;
	}
/*.r_mubx{
	position:relative;
	width:100%;
	height:auto;
	background-image:none;
	right:0;
	-webkit-filter: drop-shadow(0 0 0 rgba(29, 6, 2, 0));
	filter: drop-shadow(0 0 0 rgba(29, 6, 2, 0));
	}
.r_mubx::before{display:none;}
.r_mb2{
	position:relative;
	width:85%;
	height:auto;
	background-image:none;
	text-align:center;
	left:0;
	top:0;
	transform: translateX(0);
	margin:0 auto;
	}
.r_mb2::before{
	padding-bottom:11px;
	margin:8px auto;
	content:"";
	background-attachment:scroll;
	background-repeat:no-repeat,no-repeat,repeat-x;
	background-position:0% 50%,100% 50%,50% 50%;
	background-image:url(../images/ms_2a.png),url(../images/ms_2a.png),url(../images/ms_2.png);
	background-size:auto 11px, auto 11px, auto 2px; 
	}
.r_mb2 a{
	position:relative;
	width:100%;
	padding-bottom:0;
	display:block;
	opacity:1;
	}
.r_mb2 a::before{
	position:relative;
	display:block;
	}
	
.r_mb2 a#new_hero::before{content:'英雄崛起';}
.r_mb2 a#hero_return::before{content:'英雄回歸';}
.r_mb2 a:hover{opacity:1;}
.r_mb2 a#new_hero{
	background-position:50% 100%;
	background-image: url(../images/ms_1.png);
	background-size:100% 2px;
	}
.r_mb2 a#hero_return{background-image:none;}
.r_mb2 a#reset_password{background-image:none; display:block;}*/
.topbt{display:none;}
.topbx2{display:block;}
	
	
.mbk{
	position: relative;
	width:85%;
	margin:0 auto;
	padding: 15px 0;
	background-attachment:scroll;
	background-repeat:no-repeat,no-repeat,no-repeat,no-repeat,repeat-x,repeat-y,repeat-x,repeat-y;
	background-position:0% 0%,100% 0%,100% 100%,0% 100%,50% 0%,100% 50%,50% 100%,0% 50%;
	background-image:url(../images/mb2_1.png),url(../images/mb2_2.png),url(../images/mb2_3.png),url(../images/mb2_4.png),url(../images/mb2_5.png),url(../images/mb2_6.png),url(../images/mb2_5.png),url(../images/mb2_6.png);
	/**/
	font-size:5vw;
	line-height:11.5vw;
	color: #917252;
	}
.mbk a{
	font-size:5vw;
	line-height:12.5vw;
	color:#917252;/*c5a86e*/
	}
.mubx2{
	position: relative;
	width:85%;
	top: 0;
	left: 0;
	margin:0 auto;
	}
.allbg.on .mubx2{
	position: relative;
	left: 0;
	opacity:1;
	pointer-events:auto;
	}	
.mubx2 li{
	position: relative;
	width:100%;
	height:auto;
	display:block;
	margin:0;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 100%;
	background-image: url(../images/ms_1.png);
	background-size:100% 2px;
	}
/*.mubx2 li:hover::before,.mubx2 li.on::before{ animation-play-state:paused;}
.mubx2 li:hover::after,.mubx2 li.on::after{ animation-play-state:paused;}
.mubx2 li::before,.mubx2 li::after{display:none;}*/
	
.mubx2 li:last-child{background-image:none;}
.mubx2 li a{
	position:relative;
	width:100%;
	height:auto;
	text-align:center;
	}
.mubx2 li.on a::before {
  	width: 11%;
  	padding-bottom: 11%;
	height:auto;
  	background-image: url(../images/circle.png);
  	top: 14%;
  	left:23%;
	}
.mubx2 li.on:hover a::before{opacity:1;}	
.mubx2 li.on a{color:#ffc272;}
.mubx2 li:hover a::before{opacity:0;}	
.mubx2 li:hover a,.mubx2 li.on a{
	height:auto;
	top:0;
	-webkit-filter: drop-shadow(0 0 0 rgba(41, 22, 19, 0));
	filter: drop-shadow(0 0 0 rgba(41, 22, 19, 0));
	}
/*.mubx2 li::before{display:none;}*/	
.mubx2 li .mu1::after{content:"鎖妖塔";}
.mu1{background-image:none;}
.mubx2 li .mu2::after{content:'職業技改';}	
.mu2{background-image:none;}
.mubx2 li .mu3::after{content:'全面優化';}
.mu3{background-image:none;}
.mubx2 li .mu4::after{content:'北陸雪國';}
.mu4{background-image:none;}
.mubx2 li .mu5::after{content:'祖龍戰歌';}
.mu5{background-image:none;}
.mubx2 li .mu6::after{content:'改版活動';}
.mu6{background-image:none;}
.mubx2 li .mu7::after{content:'商城新品';}
.mu7{background-image:none;}
.mubx2 li .mu8::after{content:'儲值活動';}
.mu8{background-image:none;}
/*.mubx2 li .mu9::after{content:'財福商城 • 購喜慶';}
.mu9{background-image:none;}
.mubx2 li .mu10::after{content:'新春迎福 • 馬上來';}
.mu10{background-image:none;}*/
	
	
/* 三明治 */
.menut{display:block;}
/**/
.cnbx::after{ display:none;}
.cobx2{top:-8vw;}
.cobx2 .tit{
	width:65.1%;/*586*/
	padding-bottom:10.44266211604096%;/*94*/
	top:2.85vw;
	}	
.cobx2 .con{background-image: url(../images/cnbx_m_02.png);}
.cobx2::before{
	padding-bottom:20.22222222222222%;/*182*/
	background-image: url(../images/cnbx_m_01.png);
	}
.cobx2:after{
	padding-bottom:18.33333333333333%;/*165*/
	background-image: url(../images/cnbx_m_03.png);
	}
.dwbx{padding-bottom: 2%;}
.clos{
	width:11%;/*6.6*/
	background-image: url(../images/clos_m.png);
	top:-14vw;
	right:auto;
	left:50%;
	transform:translateX(-50%);
	}
.clos::before{
	width:100%;
	padding-bottom:100%;
	}
#content{width:85%;}
.gb{bottom:20vw;}	
	
/*
.pp1{
	width:14.35897435897436vw;
	padding-bottom:31.53846153846154vw;
	right: .8vw;
	top: 67vw;
	}*/
/**/
.pbg{display: none;}	
.cloud{display: none;}	
	
	
}
@media only screen and (max-width:685px){ 
/**/

}
@media only screen and (max-width:580px){
/**/	
		
}
@media only screen and (max-width:560px){
/**/
.adbx{margin:0 auto 4.46vw;/*25*/}
.fbbx{margin:4.46vw auto 0;/*25*/}
.r_mb2::before{
	padding-bottom:9px;
	margin:6px auto;
	background-size:auto 9px, auto 9px, auto 2px; 
	}	
.fbbx a{
	width:60px;
	padding-bottom:60px;
	}
/**/
#content {width: 83.5%;}
.cobx2 .tit{
	width:76%;/*586 73.25*/
	padding-bottom:12.19112627986348%;/*94 11.75*/
	top:2.8vw;/*6 1.071428571428571*/
	}	
.cobx2 .con{background-image: url(../images/cnbx_m2_02.png);}
.cobx2::before{
	padding-bottom:22.75%;/*182*/
	background-image: url(../images/cnbx_m2_01.png);
	}
.cobx2::after{
	padding-bottom:20.625%;/*165*/
	background-image: url(../images/cnbx_m2_03.png);
	}
	
}
@media only screen and (max-width:470px){
/**/
.topbt2{
    width:40px;
    height:29px;
	}	
}
@media only screen and (max-width:380px){
/**/

}
@media only screen and (max-width:360px){
/**/
}
@media only screen and (max-width:340px){
/**/
	
}
/**/
@keyframes fin {
   0% {opacity:.1;}
   50% {opacity:1;}
   100% {opacity:.1;}
	}
@keyframes fin2 {
   0% {opacity:0;}
   30% {opacity:1;}
   60% {opacity:1;}
   100% {opacity:0;}
	}
@keyframes ma1{
	0% {
  	transform:rotate(2.2deg);
  	transform-origin: 50% 0%;
	}
	50% {
  	transform:rotate(-1.3deg);
  	transform-origin:50% 0%;
	}
	100% {
  	transform:rotate(2.2deg);
  	transform-origin:50% 0%;
	}
}
@keyframes ma2{
	0% {
  	transform: rotate(-2deg);
  	transform-origin: 50% 100%;
	}
	50% {
  	transform: rotate(1.6deg);
  	transform-origin: 50% 100%;
	}
	100% {
  	transform: rotate(-2deg);
  	transform-origin: 50% 100%;
	}
}
@keyframes ma3{
	0% {
	opacity: .5;
  	transform: rotate(1.3deg);
  	transform-origin: 50% 100%;
	}
	50% {
	opacity:1;
  	transform: rotate(-2deg);
  	transform-origin: 50% 100%;
	}
	100% {
	opacity: .5;
  	transform: rotate(1.3deg);
  	transform-origin: 50% 100%;
	}
}
/**/
@-webkit-keyframes py {
   from { background-position: 0%; }
     to { background-position: -400%; }
}

@keyframes py {
   from { background-position: 0%; }
     to { background-position: -400%; }
}
/**/
@-webkit-keyframes py2 {
   from { background-position: 0%; }
     to { background-position: -500%; }
}

@keyframes py2 {
   from { background-position: 0%; }
     to { background-position: -500%; }
}