/****common****/

html,body{ width: 100%; height: 100%; background: #000;}
.header{width: 220px; height: 100%; position:fixed; left: -200px; top: 0; z-index:100; display: flex; align-items: center; opacity: 0; transition: all 0.5s; -webkit-transition: all 0.5s;}
.header-show{ left: 0; opacity: 1;}
.topBox .top-nav,.nav-pop ul li i,.section2 .game-slide ol li span,.agreement .agreement-slide ol li span,.section2 .game-slide ol::before,.section2 .game-slide ol::after,.section3 h3,.section3 .st3-tab li,.section3 .st3-cont .st3-c-1 .spic,.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info .wb-wx .wb-1 .icon,.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info .wb-wx .wx-1 .icon,.section4 h3,.jobBox .bd ul li .p6,.job-details-box .cont .close-btn{ background: url(../images/sprite.png) no-repeat;}

@keyframes page_arr{
	0%{transform:translate(0)}25%{transform:translateY(4px)}75%{transform:translateY(-4px)}to{transform:translate(0)}
}

@-webkit-keyframes page_arr{
	0%{-webkit-transform:translate(0)}25%{-webkit-transform:translateY(4px)}75%{-webkit-transform:translateY(-4px)}to{-webkit-transform:translate(0)}
}

.topBox{ width: 100%; height: 100px; background: #000; position: fixed; top: 0; left: 0; z-index: 100; font-size:24px;}
.topBox .top-logo{ float: left; width: 120px; height: 72px; margin: 14px 0 0 34px;}
.topBox .top-nav{ float: right; width: 40px; height: 30px; background-position: 0 -85px; margin: 36px 26px 0 0;}
.nav-pop{ width: 300px; height: 100%; position: fixed; right: -300px; top: 98px; background: rgba(0,0,0,.9); font-size: 28px; color: #ceab86; transition: all 0.5s ease 0.01s; z-index: 120;}
.nav-pop ul{ padding: 70px 0 0 0;}
.nav-pop ul li{ margin: 0 0 50px 50px; line-height: 50px;}
.nav-pop ul li a{ color: #ceab86;}
.nav-pop ul li i{ display: inline-block; width: 20px; height: 20px; background-position: 0 -178px; margin-right: 22px;}


#wrapper{ font-family: "Microsoft YaHei","SimSun",Arial,sans-serif; font-size:24px; color: #fff; background: #000;}
.section{ overflow:hidden;}
.section1 { width: 100%; background: url(../images/bg1.jpg) no-repeat center center; background-size:100% 100%;}
.section2 { width: 100%; height: 1334px; background: url(../images/bg3.jpg) no-repeat center center; background-size:100% 100%;}
.section3 { width: 100%; height: 1334px; background: url(../images/bg3.jpg) no-repeat center center; background-size:100% 100%;}
.section4 { width: 100%; height: 1334px; background: url(../images/bg3.jpg) no-repeat center center; background-size:100% 100%;}

.sCont{ width:100%; height:100%; position:relative;}


.disn{ display:none;}
.disb{ display:block!important;}


/****游戏产品****/
.section2 .game-slide{ position: relative; height: 100%;}
.section2 .game-slide .gs-cont{ overflow:hidden; position:relative;}
.section2 .game-slide .gs-cont li{ width: 100%; height: 100%; overflow:hidden; float:left;}
.section2 .game-slide .gs-cont li a{ display: block; width: 100%; height: 100%;}
.section2 .game-slide .gs-cont .slide-bg1{ background: url(../images/bg2_1.jpg) no-repeat center center; background-size: 100% 100%;}
.section2 .game-slide .gs-cont .slide-bg2{ background: url(../images/bg2_1.jpg) no-repeat center center; background-size: 100% 100%;}
.section2 .game-slide .gs-cont .slide-bg3{ background: url(../images/bg2_1.jpg) no-repeat center center; background-size: 100% 100%;}
.section2 .game-slide .gs-cont ul{ position:absolute; left:0; top:0px; width:3000px;}



.btm-nav { position: absolute; z-index: 4; left: 50%; top: 8%; opacity: 1; margin-left: -231px;}
.section2 .game-slide ol{ position: relative;}
.section2 .game-slide ol::before,.section2 .game-slide ol::after{ content: ''; width: 70px; height: 16px; position: absolute; top: 70px; background-position: 0 -134px;}
.section2 .game-slide ol::before{ left: -76px;}
.section2 .game-slide ol::after{ right: -76px;}
.section2 .game-slide ol li{ display: inline-block; width: 138px; height: 138px; margin: 8px; position: relative; cursor: pointer;}
.section2 .game-slide ol li span{ width: 180px; height: 180px; line-height: 180px; top: 0; left: 0; margin: -19px 0 0 -22px; border: none; border-radius: 50%; background-position: -64px -229px; color: #666; text-align: center; position: absolute;}
.section2 .game-slide ol li.current span{ background-position: -64px -450px; color: #fee496;}



/****关于我们****/
.section3 h3{ width: 516px; height: 44px; text-indent: -9999px; background-position: 0 -769px; margin: 140px auto 0 auto;}
.section3 .st3-tab ul{ text-align: center; padding-top: 60px;}
.section3 .st3-tab li{ display: inline-block; width: 264px; height: 60px; line-height: 60px; font-size: 32px; color: #ceab86; font-weight: bold; text-align: center; background-position: -264px -893px; margin: 0 23px; cursor: pointer; user-select:none;}
.section3 .st3-tab li.on{ background-position: 0 -893px; color: #000;}
.section3 .st3-cont{ max-width: 1200px; margin: 0 auto;}
.section3 .st3-cont .st3-c{ display: none;}
.section3 .st3-cont .st3-c-1{ padding-top: 92px;}
.section3 .st3-cont .st3-c-1 .btext{ width: 454px; height: 410px; text-indent: -9999px; background: url(../images/pic21.png) no-repeat; margin: 0 auto;}
.section3 .st3-cont .st3-c-1 .stext{ width: 600px; font-size: 24px; color: #fff; line-height: 48px; text-align: left; margin: 0 auto; padding: 64px 0 50px 0;}
.section3 .st3-cont .st3-c-1 .spic{ width: 380px; height: 52px; background-position: 0 -983px; margin: 0 auto;}
.section3 .st3-cont .contact-cont{ padding: 60px 0;}
.section3 .st3-cont .contact-cont .box-lf,.section3 .st3-cont .st3-c-2 .contact-cont .box-rt{ width: 648px; margin: 0 auto;}
.section3 .st3-cont .st3-c-2 .contact-cont .form-box{ position: relative;}
.section3 .st3-cont .st3-c-2 .contact-cont .input-box{ overflow: hidden; width: 646px; margin-bottom: 12px; background: rgba(19, 20, 21, 0.5); border: 1px solid #71614f; border-radius: 3px; color: #666;}
.section3 .st3-cont .st3-c-2 .contact-cont .input-box label{ float: left; padding:26px 0 0 24px; line-height: 24px;}
.section3 .st3-cont .st3-c-2 .contact-cont input{ float: left; background: none; border: none; padding: 0; margin: 0; color: #aaa;}
.section3 .st3-cont .st3-c-2 .contact-cont .input-box input{ width: 500px; height: 76px; line-height: 76px;}
.section3 .st3-cont .st3-c-2 .contact-cont .input-box textarea{ float: left; width: 544px; height: 113px; line-height: 24px; padding: 0; padding: 22px 0; color: #aaa; background: none; border: none; resize: none;}
.section3 .st3-cont .st3-c-2 .contact-cont .verifyBox{ float: left; width: 340px; background: rgba(19, 20, 21, 0.5); border: 1px solid #71614f; border-radius: 3px; color: #666; margin-right: 13px;}
.section3 .st3-cont .st3-c-2 .contact-cont .verifyBox label{ float: left; width: 96px; padding:26px 0 0 24px; line-height: 24px;}
.section3 .st3-cont .st3-c-2 .contact-cont .verifyBox input{ float: left; width: 86px; height: 76px; line-height: 76px;}
.section3 .st3-cont .st3-c-2 .contact-cont .verifyBox img{ float: left; width: 134px; height: 76px; cursor: pointer;}
.section3 .st3-cont .st3-c-2 .contact-cont .submit-btn{ float: left; width: 292px; height: 76px; line-height: 76px; text-align: center; background: #ceab86; padding: 0; font-size: 32px; font-weight: bold; color: #000; border: none; border-radius: 3px; cursor: pointer;}
.tips-pop{ line-height:60px; text-align:center; padding: 10px 80px; background:rgba(0, 0, 0, .7); border-radius:4px; font-size:24px; color:#fff; white-space: nowrap; position:absolute; left:50%; top:80px; z-index: 1100; transform: translate(-50%,0); animation: alertTipsPop 1.7s ease-in-out 0s 1;}
@keyframes alertTipsPop {
  0% {
	transform: translate(-50%,0);
	opacity:1;
  }
  70% {
    transform: translate(-50%,0);
	opacity:1;
  }
  100% {
    transform: translate(-50%,-200px);
	opacity:0;
  }
}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info{ color: #999;}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info strong{ display: block; font-size: 32px; line-height: 32px; font-weight: bold; padding: 60px 0;}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info p{ display: block; line-height: 48px;}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info .wb-wx li{ float: left; position: relative;}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info .wb-wx li .icon{ text-indent: -9999px; width: 60px; height: 60px; margin:32px 20px 0 0;}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info .wb-wx .wb-1 .icon{ background-position: 0 -1063px;}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info .wb-wx .wb-1 .icon a{ display: block; width: 100%; height: 100%;}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info .wb-wx .wx-1 .icon{ background-position: -60px -1063px;}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info .wb-wx img{ display: none; position: absolute; left: -31px; top: -106px; z-index: 10;}
.section3 .st3-cont .st3-c-2 .contact-cont .box-rt .cp-info .wb-wx li:hover img{ display: block;}


/****加入我们****/
.section4 h3{ width: 516px; height: 44px; text-indent: -9999px; background-position: 0 -824px; margin: 140px auto 0 auto;}
/* 滚动 */
.jobBox{ position:relative; width:100%; padding-top:64px;}
.jobBox .hd{ height: 35px; text-align: center;}
.jobBox .hd ul li,.jobBox .hd .prev,.jobBox .hd .next{ display:inline-block;  width:66px; height:66px; line-height: 66px; text-align: center; overflow:hidden; cursor:pointer; background:#070708; color: #ceab86; border-radius: 6px; border: 1px solid #6c5b4a; margin: 0 10px; font-size: 28px;}
.jobBox .hd ul{ display: inline-block; zoom:1; }
.jobBox .hd ul li.on{ background:#6e5d4b; color: #000;}

.jobBox .bd{ overflow:hidden; width:100%;}
.jobBox .bd ul{ width: 750px; overflow:hidden; zoom:1;  float:left; _display:inline;  }
.jobBox .bd ul li{ width: 750px; float:left; _display:inline; overflow:hidden;}
.jobBox .bd ul li .cbox-t{ width: 750px; overflow:hidden;}
.jobBox .bd ul li .cont{ float: left; width: 620px; height: 236px; border: 1px solid #5e5041; border-left: 6px solid #ceab86; margin: 0 0 40px 48px; padding-left: 27px; background: rgba(0,0,0,.3); position: relative;}
.jobBox .bd ul li .p1{ line-height: 32px; font-size: 32px; color: #ceab86; font-weight: bold; padding-top: 38px;}
.jobBox .bd ul li .p2{ font-size: 20px; line-height: 46px; color:#74614c;}
.jobBox .bd ul li .p4{ padding:8px 0 0 0; line-height: 40px; color: #999;}
.jobBox .bd ul li .p5{ padding:0 0 0 0; line-height: 40px; color: #999;}
.jobBox .bd ul li .p6{ width: 221px; height: 61px; line-height: 61px; font-size: 28px; background-position: -97px -89px; text-align: center; color: #ceab86; text-align: center; position: absolute; right: 23px; top: 85px;}
.jobBox .bd ul li .details{ display: none;}

.job-details-box{ display: none; width: 705px; background: rgba(0, 0, 0, .7); border: 1px solid #e6c4a1; position: fixed; left: 20px; top: 120px; border-radius: 10px; z-index: 120; font-size: 28px;}
.job-details-box .cont{ box-sizing: border-box; width: 100%; height: 100%; position: relative; overflow: hidden; padding: 48px 35px;}
.job-details-box .cont .close-btn{ width: 40px; height: 40px; position: absolute; right: 22px; top: 24px; background-position: -138px 0;}
.job-details-box .cont .jdb-cont{ box-sizing: border-box; width: 100%; height: 100%; line-height: 48px; overflow-y:auto; color: #999;}
.job-details-box .cont .jdb-cont strong{ color: #e6c4a1; font-size: 32px; line-height: 46px; font-weight: bold;}
.nav-fade{ display:none; width:100%; height:100%; position:fixed; left:0; top:0; z-index:110; background:rgba(0,0,0,0.4);}


/****自适应：小于以下屏幕宽度时的样式****/
@media screen and (max-width: 1280px) {
	.section .sCont{
		-ms-transform:scale(0.8,0.8);
		transform:scale(0.8,0.8);
	}
  .section2 .btm-nav{
		-ms-transform:scale(0.9,0.9) translate(0,26%);
		transform:scale(0.9,0.9) translate(0,26%);
	}
}

/****协议、私密****/
.agreement { width: 100%; min-height: 1334px; background: #0d0d0d;color: #d9b988;margin-top:100px}
.btm-agreement-nav { margin: 80px auto 0;}
.agreement .agreement-slide{ position: relative; height: 100%;}
.agreement .agreement-slide .gs-cont{ overflow:hidden; position:relative;}
.agreement .agreement-slide .gs-cont li{ width: 100%; height: 100%; overflow:hidden; float:left;}
.agreement .agreement-slide .gs-cont li a{ display: block; width: 100%; height: 100%;}
.agreement .agreement-slide .gs-cont .slide-bg1{ background: url(../images/bg2_1.jpg) no-repeat center center; background-size: 100% 100%;}
.agreement .agreement-slide .gs-cont .slide-bg2{ background: url(../images/bg2_1.jpg) no-repeat center center; background-size: 100% 100%;}
.agreement .agreement-slide .gs-cont .slide-bg3{ background: url(../images/bg2_1.jpg) no-repeat center center; background-size: 100% 100%;}
.agreement .agreement-slide .gs-cont ul{ position:absolute; left:0; top:0px; width:3000px;}



.agreement .agreement-slide ol{ position: relative;width: 580px; margin: auto;}
.agreement .agreement-slide ol li{ display: inline-block; width: 270px; height: 60px; margin: 8px 0; cursor: pointer;}
.agreement .agreement-slide ol li span{ width: 264px; height: 60px; display:inline-block; line-height: 60px; border: none; background-position: -0px -893px; color: #000000; text-align: center; font-size: 28px; font-weight: 600;}
.agreement .agreement-slide ol li.current span{ background-position: -265px -893px; color: #ceab86;}
.agreement .gs-cont{
	margin: 60px auto 12px;
	width: 580px;
}
.agreement .gs-cont .agreement-cont{
	display:none;
	margin-bottom: 80px;
}
.agreement .gs-cont .agreement-cont p{
	line-height: 36px;
	font-size: 21px;
}