@charset "utf-8";
/*网页的全局样式 解决兼容问题*/
body,div,p,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,table,tr,td,form,input,select,textarea,span,img,a,em,strong,*{ margin:0; padding:0;box-sizing: border-box;-webkit-tap-highlight-color:transparent;}
ul,ol,li{ list-style:none;}
h1,h2,h3,h4,h5,h6{ font-weight:normal; font-size:12px;}
img{ border:none; vertical-align:middle;width: 100%;}
a{ text-decoration:none;cursor: pointer; }
input,select,textarea { outline: none; }
em, s, i { font-style: normal; text-decoration:none;}

.wrap { max-width: 1920px;margin: 0 auto;width: 100%;}
.topwrap { height: 100vh;background: url("../image/rexuejianghu/lp/hj/bg01.jpg") no-repeat 50% 0;position: relative;background-size: cover;}
.topwrap .enter { width: 16%;padding-top: 7.44%;background: url("../image/rexuejianghu/lp/hj/enter.png") no-repeat;background-size: 100%;position: absolute;top:0;right:11.77%;}
.topwrap .enter:hover { background-image: url("../image/rexuejianghu/lp/hj/enter2.png");}
.topwrap .main { width: 100%;position: absolute;top:50%;transform: translateY(-50%);left: 0;padding-left: 10.5%;}
.logo { width: 22.6%;margin-left: 12%;}
.txt { width: 45%;}
.content { width: 26%;border-radius: 10px;background: rgba(255,255,255,.7);margin:-3.2% 0 0 9.5%;padding:.5% 1%;overflow: hidden;position: relative;}
.ewm { float: left;width: 24.34%;}
.download { width: 38.9%;float: left;margin-left: 4%;}
.download a { width: 100%;padding-top: 29%;display: block;}
.download a.appstore { background: url("../image/rexuejianghu/lp/hj/appstore.png") no-repeat;background-size: 100%;}
.download a.appstore:hover { background-image:url("../image/rexuejianghu/lp/hj/appstore2.png");}
.download a.android { background: url("../image/rexuejianghu/lp/hj/android.png") no-repeat;background-size: 100%;margin-top: 9%;}
.download a.android:hover { background-image:url("../image/rexuejianghu/lp/hj/android2.png");}
.lb { width: 23%;float: left;margin-left: 6%;cursor: pointer;}
.webshop { width: 11.3%;border-radius: 10px;background: rgba(255,255,255,.7);margin:-7.3% 0 0 36%;padding:.5% 1%;overflow: hidden;position: relative;}
.webshop2 { width: 11.3%;border-radius: 10px;background: rgba(255,255,255,.7);margin:-7.3% 0 0 48%;padding:.5% 1%;overflow: hidden;position: relative;}

.gamewrap { height: 100vh;background: url("../image/rexuejianghu/lp/hj/bg02.jpg") no-repeat 50% 0;position: relative;background-size: cover;}
.gamewrap .main { width: 100%;position: absolute;top:50%;transform: translateY(-50%);left: 0;display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-align: center;-webkit-align-items: center;align-items: center;-webkit-flex-direction: column;flex-direction: column; }
.title { width: 50.88%;}
.picbox { width: 64.5%;margin-top: 2%;}
#pic { width: 100%;padding-bottom: 4%;}
#pic .swiper-slide { border: 2px solid #fff;width: 67%;}
.gamenext,.gameprev { width: 3%;height: 14%;outline: none;}
.swiper-button-next:after,.swiper-button-prev:after { content: '';}
.gamenext { background: url("../image/rexuejianghu/lp/hj/right.png") no-repeat;background-size: 100%;right:10%;}
.gameprev { background: url("../image/rexuejianghu/lp/hj/left.png") no-repeat;background-size: 100%;left: 10%;}
#pic>.pic-pa { bottom: 0;}
#pic>.pic-pa .swiper-pagination-bullet { width: 15px;height:15px;opacity: 1;border: 1px solid #fff;background: transparent;margin: 0 6px;}
#pic>.pic-pa .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #e60012;}
.link { margin-top: 1.5%;width: 100%;text-align: center;font-size: 0;}
.link a { display: inline-block;width: 13%;padding-top: 4%;margin: 0 3px;}
.link a.appstore { background: url("../image/rexuejianghu/lp/hj/appstore.png") no-repeat;background-size: 100%;}
.link a.appstore:hover { background-image:url("../image/rexuejianghu/lp/hj/appstore2.png");}
.link a.android { background: url("../image/rexuejianghu/lp/hj/android.png") no-repeat;background-size: 100%;}
.link a.android:hover { background-image:url("../image/rexuejianghu/lp/hj/android2.png");}
.link a.enter { background: url("../image/rexuejianghu/lp/hj/enter3.png") no-repeat;background-size: 100%;}

/*foot*/
.copyright {width:100%;background: #000; padding: 30px 0; overflow: hidden;height:125px;box-sizing: border-box;}
.foot{ width:1000px;margin:0 auto; position: relative;text-align:center;}
.longtu{display:inline-block;padding:0 20px 0 25px;}
.regard {display:inline-block;padding-left:15px;white-space:nowrap;text-align:left;vertical-align:top;padding-top: 5px;}
.regard p{color:#8c8c8c;font-size:13px;line-height:20px;}
.regard .p,.regard .p a{color:#ccc;font-size: 13px;padding-right: 5px;}
.regard .p a:hover{text-decoration:underline;}
.regard p img{width: 24px;}
.longtu p{color:#ccc;font-size:12px;}

.topbtn { width: 25px;height: 81px;background: url("../image/rexuejianghu/lp/hj/top.png") no-repeat;background-size: 100%;position: fixed;bottom:130px;right:50px;z-index: 99;}
.pf { width: 9.58%;position: fixed;right:0;top:100px;z-index: 99;}
.pf a { width: 12.5%;height: 100%;position: absolute;top:0;left: 0;}
.pf a.close { background: url("../image/rexuejianghu/lp/hj/pf2.png") no-repeat;background-size: 100%;}

.lbpop { width:519px;height:423px;background:url("../image/rexuejianghu/web/v1/lbpop.png") no-repeat;position:fixed;display:none;z-index: 2;top:50%;left: 50%;transform: translate(-50%,-50%); }
.lbpop .btnclose { width:30px;height:30px;position:absolute;top:0;left:388px;background:none; }
.lbewm { width:190px;padding:50px 0 0 170px;text-align:center; }
.lbewm img { width:180px;height:180px; }

@media screen and (min-width:769px) {   
    .mobile-only {
        display: none;
    }
}
@media screen and (max-width:768px) {   
    .desktop-only {
        display: none;
    }

    .topwrap { background-image: url("../image/rexuejianghu/lp/hj/m/bg01.jpg");height: 18.54rem;}
    .topwrap .enter { width: 3.57rem;height:1.66rem;padding-top: 0;right: -.4rem;}
    .topwrap .main { padding: 0;transform: none;top:.78rem;}
    .logo { width: 4.01rem;margin: 0 auto;}
    .txt { width: 8.3rem;margin: 0 auto;}
    .webshop { width: 3.8rem;margin: -7.3% 0 0 9%;margin-top: 6rem;}
    .webshop2 { width: 3.8rem;margin: -26.1% 0 0 52%;}
    .gamewrap { background-image: url("../image/rexuejianghu/lp/hj/m/bg02.jpg");}
    .gamewrap .main { top:.84rem;transform: none;}
    .title { width: 100%;}
    .picbox { width: 100%;margin-top: 1.7rem;}
    #pic { padding-bottom: .6rem;}
    #pic>.pic-pa .swiper-pagination-bullet { width: .15rem;height:.15rem;border-color: #38a771;}
    #pic>.pic-pa .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #252727;}
    .topbtn { width: .25rem;height: .81rem;bottom:200px;right:.5rem;}
    .link { margin-top: 10%;}
    .link a { width: 28%;padding-top: 9%;margin: 0 3px;}

    /*foot*/
    .copyright { text-align:center;padding-top:15px;width:100%;background-color:#000;height:auto;}
    .copyright img {vertical-align:middle;display:inline-block;margin-bottom:5px;width: 112px; }
    .foot { width: 100%;}
    .longtu { padding: 0;}
    .regard { text-align: center;padding: 0;white-space: normal;}
}