html,body {  margin: 0; padding: 0; font-family: 'Heiti SC Thin','微软雅黑','黑体';}
body{
	background: #202125;
	color: #717374;
	color: aliceblue;
	min-height: 100vh;
	position: relative;
}
.nav{
	position: fixed;
	top:0;
	left: 0;
	width: 100vw;
	padding-top: 10px;
	height: 60px;
	color: aliceblue;
	background-color: rgba(0,0,0,0.1);
	z-index: 999;
}
.nav .navcenter{
	width: calc(100vw - 100px);
	max-width: 1600px;
	min-width: 500px;
	margin: 0 auto;
}
.nav .navcenter .logo{
	display: inline-block;
	width: 50px;
}
.nav .navcenter .navigation{
	float: right;
	line-height: 40px;
	padding-top: 5px;
}
.nav .navcenter .navigation .title{
	display: inline-block;
	margin: 0 10px;
}
.nav .navcenter .navigation .title .check{
	display: block;
	width: 20px;
	height: 6px;
	background-color: #fff;
	margin: 0 auto;
	border-radius: 3px;
}
.index .center{
	margin: 0 auto;
	/* background-color: antiquewhite; */
}
.download{
	text-align: center;
	padding-top: 60px;
}
.index .downloadbuttom{
	background-color: #62D4B6;
	padding: 10px 30px;
	margin: 60px 7vw;
	color: #100E1A;
	border-radius: 5px;
}
.index .downloadbuttom img{
	display: inline-block;
	width: 20px;
	margin-right: 5px;
	vertical-align: top;
}
.index .downloadbuttom:hover+.downloadroute{
	display: block;
}
.index .downloadroute{
	position: absolute;
	top: 100%;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	/* width: 167px; */
	/* height: 167px; */
	margin-top: 36px;
	padding: 10px;
	display: none;
	background-color: #fff;
	border-radius: 12px;
	text-align: center;
}
.index .downloadroute img{
	width: 140px;
}
.float-flag-shape{ 
    position: absolute;
    top: -30px;
	left: calc(50% - 15px);
    height: 0;
    width: 0;
    border-left: 15px solid rgba(0, 0, 0, 0);
    border-right: 15px solid rgba(0, 0, 0, 0);
    border-top: 15px solid rgba(0, 0, 0, 0);
    border-bottom: 15px solid #fff;
}
.index .swiper-container{
	width: 100%;
	min-width: 800px;
	height: 100vh;
}
.index .swiper-wrapper{
	width: 100%;
	height: 100%;
	/* background-color: #171925; */
}
.index .swiper-slide{
	width: 100%;
	height: 100%;
	/* background-color: #eee; */
}
.index .swiper-pagination-bullet{
	background: #fff;
	opacity: .5;
}
.index .my-bullet-active{
  background: #62D4B6;
  height: 20px;
  border-radius: 10px;
  opacity: 1;
}
.pageimg .centen{
	text-align: center;
}
.pageimg .centen .title{
	padding-top: calc(50vh - 100px);
	padding-bottom: 20px;
	font-size: 4.5vw;
}
.index .center .pageimg{
	background-image: url('../img/WechatIMG216.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.index .page2 {
	background-image: url('../img/85050ae5ad941cf62ac11d1f70ffa62a_58553.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.index .page2 .centen{
	padding-top: 160px;
	width: calc(100vw - 100px);
	max-width: 1600px;
	min-width: 910px;
	margin: 0 auto;
}
.index .page2 .centen .left{
	display: inline-block;
	width: 40%;
	padding-right: 10%;
	text-align: right;
}
.index .page2 .centen img{
	display: block;
	height: calc(100vh - 260px);
	min-height: 420px;
	margin: 0 auto;
}
.index .page2 .centen .right{
	vertical-align: top;
	width: 40%;
	display: inline-block;
}
.index .page2 .centen .title{
	padding-top: calc(50vh - 240px);
	padding-bottom: 20px;
	font-size: 2.4vw;
}
.record{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: center;
	font-size: 12px;
	padding-top: 20px;
	padding-bottom: 5px;
	line-height: 12px;
}
.indexAbout{
	width: 100vw;
	height: 100vh;
	background-image: url('../img/85050ae5ad941cf62ac11d1f70ffa62a_58553.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.indexAbout .centen{
	margin: 0 auto;
	width: 900px;
	padding-top: calc(50vh - 180px);
	text-align: center;
}
.indexAbout .centen .title{
	text-align: center;
	font-size: 60px;
	padding-bottom: 20px;
}
.indexAbout .centen .f_title{
	
	font-size: 40px;
	padding-bottom: 20px;
}
.indexAbout .centen .center{
	width: 700px;
	font-size: 22px;
	line-height: 32px;
	margin: 0 auto;
}
.indexContact{
	width: 100vw;
	height: 100vh;
	background-image: url('../img/85050ae5ad941cf62ac11d1f70ffa62a_58553.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.indexContact .centen{
	margin: 0 auto;
	width: 500px;
	padding-top: calc(50vh - 180px);
	text-align: center;
}
.indexContact  .centen img{
	margin: 0 auto;
	width: 300px;
	text-align: center;
	margin-bottom: 20px;
}
.indexContact  .centen .center{
	font-size: 30px;
	padding-bottom: 10px;
}
.indexRecharge .nav{
	background: #202125;
}
.indexRecharge .commodityCenter{
	border-radius:10px;
	background-color: #1a1c20;
	border: 1px solid #25282e;
	margin-bottom: 50px;
	padding: 0 20px;
}
.indexRecharge .status{
	width: 100%;
	min-width: 320px;
	border-radius:10px;
	margin: 0 auto;
	/* border: 1px solid #27272B;
	background: #1A1C20; */
	margin-bottom: 20px;
}
.indexRecharge .bannerUrl{
	display: block;
	width: 100%;
	margin: 0 auto;
}
.indexRecharge .centen{
	padding-top: 100px;
	width: calc(100vw - 100px);
	max-width: 1200px;
	min-width: 500px;
	margin: 0 auto;
}
.indexRecharge .centen .user .title{
	font-size: 24px;
}
.indexRecharge .centen .user .input{
	padding: 20px 0 0 0;
}
.indexRecharge .centen .user input {
    width: 236px;
    height: 38px;
    border: 1px solid #25282e;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 400;
    color: #fff;
    text-indent: 10px;
    margin-bottom: 12px;
    outline: none;
	background-color: #1a1c20;
	box-shadow: 1px solid #25282e;
    transition: .2s;
}
.indexRecharge .centen .userDetail{
	width: 480px;
	height: 64px;
	padding: 25px 0 30px 0;
}
.indexRecharge .centen .userDetail .img{
	float: left;
	display: block;
	width: 60px;
	height: 60px;
	padding: 2px;
	border-radius:50%;
	border: 2px solid #62D4B6;
}
.indexRecharge .centen .userDetail .left{
	float: left;
	padding-left: 10px;
}
.indexRecharge .centen .userDetail .left .nick{
	width: 250px;
	padding-top: 5px;
	font-size: 18px;
	color: #fff;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.indexRecharge .centen .userDetail .left .dengji{
	display: inline-block;
	height: 24px;
	line-height: 24px;
	padding: 0 8px;
	margin-top: 10px;
	margin-left: 10px;
	color: #fff;
	font-size: 14px;
	border-radius:8px;
}
.indexRecharge .centen .userDetail .right{
	float: right;
	height: 62px;
	width: 100px;
	text-align: center;
}
.indexRecharge .centen .userDetail .yuer{
	padding-top: 10px;
	font-size: 12px;
	color: #8c8c8c;
}
.indexRecharge .centen .userDetail .coins{
	padding-top: 2px;
	font-size: 22px;
	background-color: #131421;
	color: #62D4B6;
	border-radius: 15px;
}
.indexRecharge .centen .commodity {
	width: 480px;
}
.activity{
	text-align: center;
	color: #FA626B;
	font-size: 20px;
	font-weight: bold;
	padding-bottom: 5px;
}
.activity_time{
	text-align: center;
	color: #93949a;
	font-size: 14px;
	
}
.indexRecharge .centen .commodity .activityCoins{
	display: inline-block;
	background: #fb204a;
	color: rgba(255,255,255,0.8);
	line-height: 20px;
	text-align: center;
	font-size: 10px;
	padding: 0 10px;
	border-radius: 10px;
	font-weight: 400;
	
}
.indexRecharge .centen .commodity  .items{
	width: 100%;
	min-height:75px;
	/*line-height: 64px;*/
	border-bottom: 1px solid  #25282e;
}
.indexRecharge .centen .commodity  .coins{
	/*float: left;*/
	display: inline-block;
	width: calc(100% - 90px);
	min-height: 64px;
	font-size: 20px;
	color: #FA626B;
	font-weight: bold;
	padding-bottom: 10px;
}

.indexRecharge .centen .commodity  .coins span{
	font-size: 12px;
	color: #8c8c8c;
	font-weight: 400;
}
.indexRecharge .centen .commodity  .coins .giveCoins{
	color: #FA626B;
	font-weight: bold;
}
.indexRecharge .centen .commodity  .vip{
	/*float: left;*/
	display: inline-block;
	vertical-align: middle;
	/* width: 80px; */
	height: 20px;
	line-height: 20px;
	font-size: 10px;
	background: #100E1A;
	color: #8c8c8c;
	font-weight: 400;
	padding: 0 10px !important;
	border-radius:10px;
	margin-right: 100px;
}
.indexRecharge .centen .commodity .vip .imgvip{
	display: table-cell;
	vertical-align: middle;
	display: inline-block;
	line-height: 20px;
}
.indexRecharge .centen .commodity .imgcard{
	display: table-cell;
	vertical-align: middle;
	display: inline-block;
	line-height: 20px;
}
.indexRecharge .centen .commodity .vip .vipimg{
	padding-top: 2px;
	width: 14px;
	line-height: 20px;
}

.indexRecharge .centen .commodity .buttom{
	float: right;
	width: 65px;
	height: 34px;
	line-height: 34px;
	font-size: 18px;
	background: #62D4B6;
	border-radius:22px;
	text-align: center;
	margin-top: 20px;
	color: #101D1E;
}
.indexRecharge .centen .commodity .buttom span{
	
	font-size: 14px;
	font-weight: 400;
}
.indexRecharge .centen .commodity .tips{
	width: 100%;
	line-height: 16px;
	padding: 20px 0px;
	text-align: center;
	font-size: 14px;
	color:  #727272;
}
.indexRecharge .centen .commodity .tips .vipResidueCount{
	padding-bottom: 5px;
	font-weight: 400;
	color: #fff;
}
.indexRecharge .centen .commodity .tips .vipResidueCount span{
	
	color: #62D4B6;
}
 .centen .commodity .tip{
	width: 300px;
	line-height: 24px;
	font-size: 18px;
	color:  #FB4C98;
	margin: 0 auto;
	padding-top: 150px;
	text-align: center;
}
.explain .complete{
	padding: 10px 30px;
	background-color: #dad7d7;
	border-radius: 25px;
}

.explain {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.75);
    z-index: 99;
}
.quxiao{
	float: right;
	display: block;
	width: 20px;
	margin-top: -12px;
    margin-right: -15px;
}
.explain .operate{
	position:absolute; 
    top: 50%; 
    left: 50%; 
    width: 290px; 
    height: 300px;
    margin-top: -190px; 
    margin-left: -170px; 
	background: #FFFFFF;
	border-radius: 10px;
	padding: 20px 20px 20px 20px;
    z-index: 110;
	text-align: center;
}

/* 普通IE浏览器 样式清除 */
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
-webkit-appearance: none !important;
}
/* 火狐浏览器样式清除 */
input[type="number"]{
-moz-appearance:textfield;
}
.user .button{
	display: inline-block;
	background-color: #62D4B6;
	margin-left: 10px;
	color: #131421;
	padding: 5px 20px;
	border-radius: 5px;
}
.method{
	display: inline-block;
	width: 80px;
	padding: 10px 15px;
	border: 1px solid #dad7d7;
	margin: 10px;
	border-radius: 5px;
}
.pay{
	border: 2px solid #FECC11;
}
.method img{
	display: block;
	width: 80px;
}
.operate .buttom{
	width: 160px;
	padding: 10px 40px;
	background-color: #62D4B6;
	border-radius: 20px;
	margin: 0 auto;
	
}
.h5nav{
	position: fixed;
	top: 0;
	left: 0;
	width: calc(100vw - 40px);
	padding: 10px 20px 0 20px;
	height: 40px;
	color: aliceblue;
	background-color: rgba(0,0,0,1);
	z-index: 2;
}
.h5nav .logo{
	width: 30px;
}
.h5nav .navigation{
	float: right;
}
.h5nav .navicon{
	width: 24px;
}
.h5 .center{
	width: 100vw;
	height: 100vh;
	transform:translate3d(0,0,0);overflow:hidden;
}
.h5 .swiper-container{
	width: 100%;
	height: 100%;
}
.h5 .swiper-wrapper{
	width: 100%;
	height: 100%;
	background-color: #171925;
}
.h5 .swiper-slide{
	transform:translate3d(0,0,0)
}
.h5 .swiper-pagination-bullet{
	background: #fff;
	opacity: .5;
}
.h5 .my-bullet-active{
  background: #62D4B6;
  height: 20px;
  border-radius: 10px;
  opacity: 1;
}
.h5 .page1{
	background-image: url('../img/7d4245de91a9206529607f841efdbf59_65985.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.h5 .page2{
	background-image: url('../img/fcde81426db7666871f9088686436c41_53958.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.h5 .page1 .centen{
	text-align: center;
	padding-top: calc(50vh - 100px);
}
.h5 .page1 .centen .title{
	font-size: 20px;
	padding-bottom: 20px;
}
.h5 .page1 .down{
	position: absolute;
	width: calc(100vw - 60px);
	bottom: 100px;
	left: 0;
	text-align: center;
	padding: 10px 30px;
	font-size: 14px;
}
.h5 .isAndroid{
	display: block;
	width: calc(100vw - 80px);
	text-align: left;
	margin: 0 auto;
}
.h5 .downbuttom{
	display: inline-block;
	background-color: #62D4B6;
	font-size: 16px;
	padding: 10px 50px;
	border-radius: 5px;
	margin-top: 2.88vh;
	color: #100E1A;
	/* margin-bottom: 20px; */
}
.Androiddownbuttom{
	display: inline-block;
	width: calc(50vw - 60px);
	background-color: #62D4B6;
	font-size: 16px;
	padding: 10px 0;
	border-radius: 5px;
	margin-top: 2.88vh;
	color: #100E1A;
	text-align: center;
}
.Androiddownbuttoms{
	display: inline-block;
	width: calc(50vw - 60px);
	background-color: #62D4B6;
	font-size: 16px;
	padding: 10px 0;
	border-radius: 5px;
	margin-top: 2.88vh;
	color: #100E1A;
	text-align: center;
	float: right;
}
.h5 .page2 .centen{
	width: 100vw;
	padding-top: 11vh;
	text-align: center;
}
.h5 .page2 .centen .title{
	color: #62D4B6;
	font-size: 6.33vw;
	padding-bottom: 2.4vh;
}
.h5 .page2 .centen .f_title{
	/* color: #e1d9ba; */
	font-size: 3.7vw;
	padding-bottom: 1vh;
}
.h5 .page2 .poster{
	display: block;
	margin: 0 auto;
	height: 56vh;
	margin-top: 2.99vh;
}
.hAbout{
	width: 100vw;
	height: 100vh;
	background-image: url('../img/fcde81426db7666871f9088686436c41_53958.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.hAbout .centen{
	padding: 180px 20px 0 20px;
}
.hAbout .centen .title{
	font-size: 24px;
	padding-bottom: 20px;
}
.hAbout .centen .f_title{
	font-size: 18px;
	padding-bottom: 10px;
}
.hAbout .centen .center{
	font-size: 14px;
}
.hContact{
	width: 100vw;
	height: 100vh;
	background-image: url('../img/fcde81426db7666871f9088686436c41_53958.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.hContact .centen{
	padding-top: 180px;
	text-align: center;
}
.hContact .centen img{
	width: 200px;
	margin-bottom: 20px;
}
.hContact .centen .center{
	font-size: 20px;
}
.hRecharge .centen{
	padding: 20px;
}
.hRecharge .centen .user .title{
	font-size: 24px;
}
.hRecharge .centen .user .input{
	padding: 20px 0 0 0;
}
.hRecharge .centen .user input {
    width: 180px;
    height: 38px;
    border: 1px solid #25282e;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 400;
    color: #fff;
    text-indent: 10px;
    margin-bottom: 12px;
    outline: none;
    background-color: #1a1c20;
    box-shadow: 1px solid #25282e;
    transition: .2s;
}
.hRecharge .centen .userDetail{
	width: 100%;
	height: 64px;
	padding: 25px 0 30px 0;
}
.hRecharge .centen .userDetail .img{
	float: left;
	display: block;
	width: 60px;
	height: 60px;
	padding: 2px;
	border-radius:50%;
	border: 2px solid #62D4B6;
}
.hRecharge .centen .userDetail .left{
	float: left;
	padding-left: 10px;
}
.hRecharge .centen .userDetail .left .nick{
	width: calc(100vw - 230px);
	padding-top: 5px;
	font-size: 18px;
	color: #fff;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.hRecharge .centen .userDetail .left .dengji{
	display: inline-block;
	height: 24px;
	line-height: 24px;
	padding: 0 8px;
	margin-top: 10px;
	margin-left: 10px;
	color: #fff;
	font-size: 14px;
	border-radius:8px;
}
.hRecharge .centen .userDetail .right{
	float: right;
	height: 62px;
	width: 100px;
	text-align: center;
}
.hRecharge .centen .userDetail .yuer{
	padding-top: 10px;
	font-size: 12px;
	color: #8c8c8c;
}
.hRecharge .centen .userDetail .coins{
	padding-top: 2px;
	font-size: 22px;
	background-color: #131421;
	color: #62D4B6;
	border-radius: 15px;
}
.hRecharge .centen .commodity {
	width: 100%;
}
.hRecharge .status{
	width: 100%;
	min-width: 320px;
	border-radius:10px;
	margin: 0 auto;
	margin-bottom: 10px;
}
.hRecharge .bannerUrl{
	display: block;
	width: 100%;
	margin: 0 auto;
}
.hRecharge .centen .commodity .activityCoins{
	display: inline-block;
	background: #fb204a;
	color: rgba(255,255,255,0.8);
	line-height: 20px;
	text-align: center;
	font-size: 10px;
	padding: 0 10px;
	border-radius: 10px;
	font-weight: 400;
	
}
.hRecharge .centen .commodityCenter{
	border-radius:10px;
	background-color: #1a1c20;
	border: 1px solid #25282e;
	margin-bottom: 50px;
	padding: 0 20px;
}
.hRecharge .centen .commodity  .items{
	width: 100%;
	min-height:75px;
	/* line-height: 64px; */
	border-bottom: 1px solid  #25282e;
}
.hRecharge .centen .commodity  .coins{
	/*float: left;*/
	display: inline-block;
	width: calc(100% - 90px);
	min-height: 64px;
	font-size: 20px;
	color: #FA626B;
	font-weight: bold;
	padding-bottom: 10px;
}

.hRecharge .centen .commodity  .coins span{
	font-size: 12px;
	color: #8c8c8c;
	font-weight: 400;
}
.hRecharge .centen .commodity  .coins .giveCoins{
	color: #FA626B;
	font-weight: bold;
}
.hRecharge .centen .commodity  .vip{
	/*float: left;*/
	display: inline-block;
	vertical-align: middle;
	/* width: 80px; */
	height: 20px;
	line-height: 20px;
	font-size: 10px;
	background: #100E1A;
	color: #8c8c8c;
	font-weight: 400;
	padding: 0 10px !important;
	border-radius:10px;
	margin-right: 100px;
}
.hRecharge .centen .commodity .vip .imgvip{
	display: table-cell;
	vertical-align: middle;
	display: inline-block;
	line-height: 20px;
}
.hRecharge .centen .commodity .imgcard{
	display: table-cell;
	vertical-align: middle;
	display: inline-block;
	line-height: 20px;
}
.hRecharge .centen .commodity .vip .vipimg{
	padding-top: 2px;
	width: 14px;
	line-height: 20px;
}

.hRecharge .centen .commodity .buttom{
	float: right;
	width: 65px;
	height: 34px;
	line-height: 34px;
	font-size: 18px;
	background: #62D4B6;
	border-radius:22px;
	text-align: center;
	margin-top: 20px;
	color: #101D1E;
}
.hRecharge .centen .commodity .buttom span{
	
	font-size: 14px;
	font-weight: 400;
}
.hRecharge .centen .commodity .tips{
	width: 100%;
	line-height: 16px;
	padding: 20px 0px;
	text-align: center;
	font-size: 14px;
	color:  #727272;
}
.hRecharge .centen .commodity .tips .vipResidueCount{
	padding-bottom: 5px;
	font-weight: 400;
	color: #fff;
}
.hRecharge .centen .commodity .tips .vipResidueCount span{
	
	color: #62D4B6;
}
.hRecharge .centen .commodity .tip{
	width: 300px;
	line-height: 24px;
	font-size: 18px;
	color:  #FB4C98;
	margin: 0 auto;
	padding-top: 150px;
	text-align: center;
}
.guide{
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: #171925;
	background-image: url('../img/WechatIMG218.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	z-index: 3;
}
.guide .dicon{
	position: fixed;
	top: 5px;
	right: 10px;
	z-index: 4;
	width: 40px;
}
.guide .title{
	padding-bottom: 70px;
}
.browser{
	color: #fff;
	padding-top: 40px;
	padding-right: 40px;
	text-align: right;
}
#topimg{
	display: inline-block;
	width: 32px;
	position:fixed;right:10px;
	top:5px;
	vertical-align: middle;
	animation-name: example;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
}
@keyframes example {
	0%   { position:fixed;right:10px; top:5px;}
	50%  { position:fixed;right:10px; top:20px;}
	100% { position:fixed;right:10px; top:5px;}
}
.id_tips{
	padding-bottom: 10px;
	font-size: 10px;
	color:  #727272;
}