*{margin:0;padding:0;border:0;}
html,body{width:100%;height:100%; overflow: hidden;}
ul,ol,li{list-style:none}
a{text-decoration:none; display: inline-block;}
img{width:100%;display:block;}

.wrapper{ width:100%; height:calc(100vh - 50px); position: relative; }

.wrapper .mainSwiper{ width:100%; height:100%; position: relative; overflow:hidden; z-index:0 }
.wrapper .mainSwiper .swiper-slide{ width:100%; height:100%; position: relative; background-size: cover; background-repeat: no-repeat; background-position: top center;}
.wrapper .mainSwiper .part_1{background-image: url(img/part_1.jpg); }
.wrapper .mainSwiper .part_2{background-image: url(img/part_2.jpg); }

.wrapper .video{ width:100%; height: 100%;position: relative; z-index: 0}
.wrapper .video video{width:100%; height: 100%; object-fit: cover; object-position: top center}

.wrapper .btn_yy{ width:17.4%; position: absolute; top:50%; right:8%; margin-top:11.5%; transition: .5s}
.wrapper .btn_yy:hover{ transform:scale(1.05); }
.wrapper .logo{ width:8%; display: block; position: absolute; top: 2%; left: 1%}
.wrapper .nav{ position: absolute; top:50%; left:40px; transform:translateY(-50%); }
.wrapper .nav:before{ content:""; display:block; width:236px; height:81px; background-image:url(img/nav_t.png); position: absolute; top:-80px; left:-20px }
.wrapper .nav a{ width:90px; height:56px; display:block; background-image:url(img/nav.png); position: relative; background-position: left top}
.wrapper .nav a:first-child{ background-position:left top }
.wrapper .nav a:last-child{ background-position:left bottom }
.wrapper .nav a.cur:first-child{ background-position:right top }
.wrapper .nav a.cur:last-child{ background-position:right bottom }
.wrapper .nav a:hover:first-child{ background-position:right top }
.wrapper .nav a:hover:last-child{ background-position:right bottom }

.wrapper .nav a:before{ content:""; width:33px; height: 33px; background-image:url(img/nav_star.png); position: absolute; top:15px; left:-58px; transition: .5s; transform:rotate(-360deg) scale(.5); opacity: 0}
.wrapper .nav a:after{ content:""; width:0; height: 67px; background-image:url(img/nav_line.png); position: absolute; top:2px; left:-28px; transition: .5s;}

.wrapper .nav a.cur:before{ content:""; width:33px; height: 33px; background-image:url(img/nav_star.png); position: absolute; top:15px; left:-28px; transform: rotate(0) scale(1.0); opacity: 1}
.wrapper .nav a.cur:after{ content:""; width:258px; height: 67px; background-image:url(img/nav_line.png); position: absolute; top:2px; left:-28px; }

.wrapper .soc{ position: absolute; top:20px; right:20px; z-index:2 }
.wrapper .soc a{ display:inline-block; transition:.5s }
.wrapper .soc a:hover{ transform:scale(1.05); }


#ageBtn{width:60px;height:86px;position:absolute;bottom:25px;left:20px;z-index:4}

.copyright{ position: absolute; bottom:20px; right:20px; display:block; font-size: 16px; color:#fff; text-shadow: 0 0 10px #000; z-index:3 }
#j-hwy-gamefoot{ width: 100%; position: absolute; bottom:-140px; left:0; z-index:3; transition:.5s }
.hwy_foot_logobox a{ display:inline-block; }

.pop{ width:100%; height:100%; position:fixed; top:0; left:0; background-color:rgba(0, 0, 0, .8); z-index: 9; display: none}
.pop .pop_inner{ width:606px; min-height: 550px; position: absolute; top:50%; left:50%; transform:translate(-50%,-50%); background-image: url(img/pop_bg.png); background-size: 100% 100%}
.pop .close{ width: 68px; display:block; position: absolute; top:23px; right: 40px; transition: .5s}
.pop .close:hover{ transform:scale(1.05); }
.pop .pop_con{ width:100%; padding:25px 20px; box-sizing:border-box; overflow: hidden; }
.pop .pop_t{ width:466px; height: 52px; line-height: 46px; text-align: center; display:block; margin:45px auto 0; font-size:28px; color:#9d5c46; background-image:url(img/t_bg.png); background-size: 100% 100%;}
.pop .xcx{ width:140px; height:140px; padding:15px; background-color:#fff; border-radius:140px; border:1px #c1c1c1 solid; margin:20px auto; position: relative; }
.pop .xcx img{ border-radius:140px; }
/* .pop .xcx:before{ content:""; display:block; width: 63px; height:63px; background-image: url(https://ftimg.friendtimes.cn/images/fsyll/cn/icon/2/256.png); background-size: 100% 100%; border-radius:60px; position: absolute; top:50%; left:50%; transform:translate(-50%,-50%); } */
.pop .yy_xcx p{ font-size:20px; color:#734c26; text-align: center; }
.pop .yy_xcx a{ width:134px; height:40px; line-height:40px; color:#d69f41; display:block; margin:20px auto 0; border-radius:40px; border:1px #d69f41 solid; text-align: center; font-size:17px; text-align: center; transition:.5s }
.pop .yy_xcx a:hover{ color:#333; border:1px #333 solid; }
.pop .phone_form{width: 70%; margin: 10px auto 0; padding-bottom: 40px;}
.pop .phone_form ul li{ margin:10px 0; text-align: center; overflow: hidden;}
.pop .phone_form ul li label{ width:30%; display:inline-block; font-size: 20px; color:#c1c1c1; line-height: 50px;}
.pop .phone_form ul li label input{ display:inline-block; vertical-align: middle; width: 16px; height: 16px; margin-top: -3px; font-size: 16px; color: #333}
.pop .phone_form ul li label span{ display:inline-block; vertical-align: middle; margin-left: 6px;}
.pop .phone_form ul li input{ height:50px; line-height:50px; background-color:#fff; border-radius:5px; box-sizing: border-box; border:1px #bdbee0 solid; text-indent:15px; outline:none }
.pop .phone_form ul li .phone{ width:100%; }
.pop .phone_form ul li .imgCode{ width: 260px; float:left; }
.pop .phone_form ul li .phone_code{ width: 260px; float:left; }
.pop .phone_form ul li .vf_img{ float:left; width:130px; height:52px; float:right; background-color:#fff; border-radius:5px; border:1px #bdbee0 solid; box-sizing:border-box; }
.pop .phone_form ul li .get_code{ float:left; width:130px; height:52px; line-height: 50px; float:right; background-color:#bea59e; color: #fff; border-radius:5px;  }
.pop .phone_form ul li .get_code.timeout{ background-color: #999; }
.pop .phone_form ul li .get_code:hover{ background-color:#b1938b }
.pop .phone_form ul li .get_code.timeout:hover{ background-color: #999; }
.pop .phone_form ul li button{ width: 260px; height:80px; display:block; margin:0 auto; background-image:url(img/btn_yy.png); background-size: 100% 100%; background-color:transparent; transition:.5s; cursor:pointer; }
.pop .phone_form ul li button:hover{ transform:scale(1.02); }
.pop .phone_form ul li .back{ font-size: 16px; color:#666; text-align: center; line-height:30px; display:block; transition: .5s}
.pop .phone_form ul li .back:hover{ color:#4689ce }
.pop .phone_form ul li:last-child{ margin:0; height:30px; padding-bottom: 40px;}

.pop .qrcode{ text-align: center; }
.pop .qrcode img{ width:200px; display:block; margin:15px auto 0; border-radius:20px; }
.pop .qrcode p{ margin:20px 0 15px 0; font-size: 20px; color:#2f96ff }
.pop .qrcode a{ width:120px; height:38px; line-height:38px; margin: 20px auto 0; border-radius:5px; border:1px #2f96ff solid; font-size: 14px; color: #2f96ff; transition: .5s}
.pop .qrcode a:before{content: "一键加群"}
.pop .qrcode a:hover{ background-color:#2f96ff; color:#fff }

.pop .pop_txt{ margin-top:20px; text-align: center; font-size: 16px; line-height: 30px; color: #333}
.pop .pop_txt span{ color:#d69f41 }