.w1200{
    min-width: 1200px;
    margin: 0 auto;
}
.w_1200{
    width: 1200px;
    margin: 0px auto;
}
.titleIcon{
    background: url(../images/new/title.png) 0 0 no-repeat;
}
.icon{
    background: url(../images/img/icon.png) 0 0 no-repeat;
}
.clear {
    zoom: 1;
}
.clear:after {
    content: ".";
    display: block;
    clear: both;
    height: 0px;
    visibility: hidden;
}
body{
    /*color: #926629;*/
    background: #181820;
    font-family: '思源黑体 CN';
}
body::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}
body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0.5rem rgba(91,131,229,0.2);
    background: #e8dcc5;
}
body::-webkit-scrollbar-thumb {
    border-radius: 20px;
    -webkit-box-shadow:  0 0 0.5rem rgba(243,212,250,0.2);
    background: #c7a666;
}
.flex{display: flex;align-items: center;}
.normalBtn{color: #666a85;text-decoration: underline;cursor: pointer;}
.normalBtn:hover{color: #fe4200;}
[v-cloak]{opacity: 0 !important;}
.fl{float: left;}
.fr{float: right;}
.numImg{background: url(../images/new/num.png) 0 0 no-repeat;}
.iconImg{background: url(../images/iconImg.png) 0 0 no-repeat;}
.iconImg1{background: url(../images/iconImg1.png?v=001) 0 0 no-repeat;}
.iconImg3{background: url(../images/iconImg3.png) 0 0 no-repeat;}
.iconImg4{background: url(../images/iconImg4.png) 0 0 no-repeat;}
.iconImg2{background: url(../images/img/icon2.png) 0 0 no-repeat;}
.btnIcon{background: url(../images/new/btnIcon1.png) 0 0 no-repeat;}
/*.asideIcon{background: url(../images/asideIcon.png) 0 0 no-repeat;}*/
.guildGiftTitleIcon{background: url(../images/guildGiftTitle.png) 0 0 no-repeat;}
.page-title-bg{background: url(../images/title.png) center 0 no-repeat;}
#app .page .head{
    position: absolute;
    width: 1920px;
    height: 980px;
    top: 0;
    background: url(//cdn.51img3.com/game/2024/202412/20241227/d42a4dd0f4eafbbf8fcc8174c0737d87.jpg) bottom center; no-repeat;
    left: 50%;
     z-index: -1;
    transform: translate(-50%);background-position-y: -44px;
}
#app .page.isShowSign .head{
    background: url(../images/new/head2.jpg?v=003) center 0 no-repeat;
}
#app .page .headTitle{
    position: absolute;
    top: 562px;
    left: 50%;
    width:706px;height:70px;margin-left:-350px;
    background:url(//cdn.51img3.com/game/2024/202412/20241227/9681e23c6d4398974cea95054ce044f6.png) 0 0 no-repeat;
}
#app .page .headTitle .leftHeadTitle{
    position: absolute;
    top: 56px;
    left: 50%;
    transform: translate(-145%);
    width: 521px;
    height: 247px;
    background: url(../images/img/headTitleL.png?v=005) center no-repeat;
}
#app .page .headTitle .rightHeadTitle{
    position: absolute;
    width: 558px;
    height: 230px;
    top: 56px;
    left: 50%;
    transform: translate(-29%);
    background: url(../images/img/headTitleR.png) center no-repeat;
}
#app .page .headTitle.isShowSign{
    width: 1485px;
    top: 226px;
    transform: translate(-50%);
    height: 599px;
    background: url(../images/img/title_new.png?v=001) center no-repeat;
}
#app .page .headTitle.isShowSign .rightHeadTitle, #app .page .headTitle.isShowSign .leftHeadTitle, #app .page .headTitle.isShowSign .time{display: none;}
#app .page{margin-top: -1px;overflow: hidden;}
#app .page1{width: 100%;height: 1012px;padding-top: 0;background: url(../images/new/head.png?v=002) bottom center no-repeat;position: relative;overflow: hidden;transition: all 0.3s;}
#app .page1.isShowSign{margin-top: 0px;}
#app .page2{width: 100%;height: 820px;background: url(../images/new/page1.jpg?v=002) top center no-repeat;position: relative;overflow: inherit;}
#app .page3{width: 100%;height: 730px;background: url(../images/new/page2.jpg?v=002) top center no-repeat;}
/*#app .page4{width: 100%;height: 722px;background: url(../images/new/page3.jpg?v=003) top center no-repeat;padding-top: 24px;overflow: inherit;}*/
#app .page5{width: 100%;height: 967px;background: url(../images/new/page3.jpg?v=003) top center no-repeat;overflow: initial;}
#app .page6{width: 100%;height: 1634px;background: url(../images/new/page4.jpg?v=003) top center no-repeat;overflow: inherit;}

/*#app .page2 .content{margin-top: 38px;}*/

.allA{position: relative;}
.allA a{position: absolute;left: 0;right: 0;top: 0;bottom: 0;}
#app .aside{
    width: 185px;
    height: 649px;
    background: url(../images/new/popup/asideBg.png) center no-repeat;
    position: fixed;
    right: -172px;
    top: 50%;
    z-index: 2;
    transform: translateY(-50%);
    text-align: center;
}
#app .aside .openBtn{
    position: absolute;
    top: 63%;
    cursor: pointer;
    transform: translateY(-50%);
    left: -8px;
    width: 16px;
    height: 40px;
    z-index: 1;
    background-position:-365px -62px;
}
#app .aside.open{
    right: 10px;
}
#app .aside.open .openBtn{
    background-position-x: -400px;
}
#app .aside .topContent{
    color: #f3f9ff;
    font-size:14px;
}
#app .aside .topContent dt p{font-size:16px;margin-top:-10px;  text-shadow:
    -1px -1px 2px #000,
    1px -1px 2px #000,
    -1px 1px 2px #000,
    1px 1px 2px #000; }
#app .aside .topContent dt p span{font-size:26px;color:#ffac35}
#app .aside .topContent dt img{display:block;width:76px;height:76px;margin:4px auto 0;}
#app .aside .topContent dd{height:22px;line-height:22px;}
#app .aside .topContent dd:last-child{color:#bee2f3;font-size:12px}
#app .aside .topContent dd:last-child span{color:#ffac35}
.aside_info{background:url(../images/new/popup/aside_info.png) 0 0 no-repeat;}
#app .aside ul{position: relative;width:132px;height:204px;margin:-4px auto 0;box-sizing:border-box;padding-top:26px;z-index:2}
#app .aside ul li{height:22px;line-height:22px;margin:0 0 21px;color:transparent;font-size:0;cursor:pointer;position:relative;z-index:2}
#app .aside .btn_bg{width:192px;height:66px;background:url(../images/new/popup/asideBtnBg.png) 0 0 no-repeat;position:absolute;top: 151px;z-index: 1;left: -11px;}
#app .aside .qr_code{width:90px;height:90px;margin:1px auto;background-position:-176px -26px}
.aside .server_info{font-size:14px;color:#d0d0d0;width:156px;height:66px;background:rgba(4,30,52,.4);border-radius:4px;margin:0 auto 0;padding-top: 3px;box-sizing: border-box;}
.aside .server_info div{display:flex;align-items:center;justify-content:center;margin:0 8px;border-bottom:1px solid rgba(255,227,145,.1);height:26px;cursor:pointer;}
.aside .server_info div p{width:90px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.aside .server_info div span{color:#b0c7f4;}
#app .aside.step1 .btn_bg{top:194px}
#app .aside.step2 .btn_bg{top:237px}
#app .aside.step3 .btn_bg{top:280px}

.aside .edit_btn{display:flex;align-items:center;justify-content:center;margin:40px 0 6px}
.aside .edit_btn a{width:72px;height:26px;background-position:-148px -148px;display:block;font-size:0;color:transparent;margin:0 5px}
.aside .edit_btn a.rules{background-position-x:-231px}


#app .aside .goTop{
    position: absolute;
    bottom: 14px;
    width: 30px;
    height: 24px;
    left: 50%;
    cursor: pointer;
    transition: all 0.1s;
    transform: translateX(-50%);
}
#app .aside .goTop:hover , .aside .edit_btn a:hover{
    filter: brightness(1.1);
}
.aside .gift_log{font-size:14px;color:#ffac35;text-align:center;display:block;text-decoration:underline;width: 100px;margin: 4px auto 0;cursor:pointer;}
#app .top{
    position: relative;
    z-index: 1;
    width: 100%;
    min-width: 1200px;
    height: 80px;top: 24px;
}
#app .top.isShowSign{background: url(../images/img/nav_bg.png) center no-repeat;}
#app .top .topInfo{display: flex;align-items: center;height: 100%;width: 1200px;justify-content: space-between;}
#app .top .topInfo .logo{width: 152px;height:70px;background: url(../images/img/logo.png) center no-repeat;cursor: pointer;}
#app .top .topInfo .topTitle{width: 199px;height: 35px;background: url(../images/new/topTitle.png) center / 100% no-repeat;margin: 0 24px 0 36px;}
#app .top .topInfo .home .homeBtn, #app .top .topInfo .home .gameBtn{
    width:130px;
    height: 36px;
    margin-left: 10px;
    cursor: pointer;
    background: url(../images/img/btn-enter.png) 0 0 no-repeat;
}
#app .top .topInfo .home .gameBtn{background-position-x: -143px;}
#app .top .topInfo .home .gameBtn:hover, #app .top .topInfo .home .homeBtn:hover{
    background-position-y:-46px;
}
#app .top .topInfo .home{display: flex;}
#app .top .topInfo .nav{display: flex;color: #ffffff;height: 100%;line-height: 60px;font-size: 18px;}
#app .top .topInfo .nav .navLi{cursor: pointer;margin: 0 14px;}
#app .top .topInfo .nav .navLi:hover{color: #ffc35c;}
#app .hiddenTop{position: absolute;width: 100%;justify-content: center;background: rgba(0,0,0,0.5);height: 80px;top: -80px;transition: all 0.3s;}
#app .hiddenTop.show{top: 0;position: fixed;z-index: 10;display: flex;min-width: 1200px;}

#app .hiddenTop .hiddenTopLi{
    width: 196px;
    height: 48px;
    cursor: pointer;
    margin: 0 10px;
    background: url(../images/new/hiddenTop.png) 0 0 no-repeat;
}
#app .hiddenTop .hiddenTopLi.hiddenTopLi1{background-position-x: 0;}
#app .hiddenTop .hiddenTopLi.hiddenTopLi2{background-position-x: 0;}
#app .hiddenTop .hiddenTopLi.hiddenTopLi3{background-position-x: 0;}
#app .hiddenTop .hiddenTopLi.hiddenTopLi4{background-position-x: 0;}
#app .hiddenTop .hiddenTopLi:hover, #app .hiddenTop .hiddenTopLi.cur{background-position-y: -90px;}
/* page1 */
#app .page1 .time{
    text-align: center;
    line-height: 48px;
    color: #fff;
    background:radial-gradient(circle at center,#000,rgba(0,0,0,.7),rgba(0,0,0,.8),rgba(0,0,0,0));
    font-size: 26px;font-weight: bold;font-family:宋体;display:none;
}
#app .page1 .btnBox {
    /*width: 800px;*/
    display: flex;
    justify-content: center;
    margin-top:582px;
}
#app .page1 .btnBox.isShowSign{
    display: none;
}
#app .page1 .btnBox .signBtn{
    width: 325px;
    height: 110px;
    background: url(../images/new/gameBtn.png) -15px -15px no-repeat;
    margin: 0 34px;
    cursor: pointer;
}
#app .page1 .btnBox .signBtn:hover{filter:brightness(1.1);}
#app .page1 .btnBox .signBtn.sign.geted{background-position-y: -252px;}
/*#app .page1 .btnBox .signBtn.sign.waitGet:hover,#app .page1 .btnBox .signBtn.entry:hover{background-position-y: -134px;}*/
#app .page1 .btnBox .signBtn.entry{background-position: -15px -134px;}
/*#app .page1 .btnBox .signBtn.entry:hover{background-image: url(../images/img/entry_mut.png);}*/
#app .page1 .progressBg{
    position: relative;
    width: 982px;
    height: 38px;
    background: url(../images/img/jdtBg.png) center no-repeat;
    /*overflow: hidden;*/
    border-radius: 60px;
}
#app .page1 .progressBox{
    position: relative;
    margin: 0 auto 14px;
    display: flex;
    transition: all 0.3s;
    justify-content: center;
}
#app .page1 .timelinebox{width:860px;height:178px;background:url(../images/new/timeline.png) 0 0 no-repeat;margin:28px auto 0;position:relative;left:57px}
#app .page1 .progressBox.isShowSign{margin: 716px auto 40px;}
#app .page1 .progressBox .progress{
    position: absolute;
    left: 2px;
    top: 12px;
    border-radius: 6px;
    width: 0%;
    height: 14px;
    background: url(../images/img/jdt1.png?v=002) 0 0 / 100% 100% no-repeat;
}
#app .page1 .progressBox .progress .light{
    position: absolute;
    right: -120px;
    top: 50%;
    transform: translateY(-50%);
    width: 244px;
    height: 35px;
    background: url(../images/img/light.png) center no-repeat;
}
#app .page1 .progressBox .progress .pf{
    width: 528px;
    height: 324px;
    background: url(../images/img/pf.png) -50px -136px no-repeat;
    position: absolute;
    right: -274px;
    top: -227px;
    transform: scale(0.5);
    animation: pf 1s steps(8) infinite;
}
@keyframes pf{
    0%{background-position-x: -50px;}
    100%{background-position-x: -4960px;}
}
#app .page1 .progressBox .progress .pf .yyt{
    position: absolute;
    left: -76px;
    top: 138px;
    color: #f1b06a;
    font-size: 12px;
    transform: scale(2);
    width: 164px;
    height: 35px;
    /*background: url(../images/img/yyt.png) center no-repeat;*/
}
#app .page1 .progressBox .progress .pf .yyt .signTimesBg{
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    width: 164px;
    height: 35px;
    transition: all 0.3s;
    background: url(../images/img/yyt.png) center no-repeat;
}
#app .page1 .progressBox .progress .pf .yyt.inset{left: 430px;}
#app .page1 .progressBox .progress .pf .yyt.inset .signTimesBg{transform: rotateY(180deg);left: -6px;}
#app .page1 .signGiftBox{
    width: 1065px;
    height: 207px;
    margin: 0 auto;
    background: url(../images/new/signGiftBg.png) center no-repeat;
}
#app .page1 .signGiftBox.isShowSign{display: none;}
#app .page1 .signGiftBox .signGiftBoxDiv{
    display: flex;
    justify-content: space-between;
    width: 100%;
}
#app .page1 .signGiftBox .giftBox{
    position: relative;
    width: 145px;
    height: 134px;
    margin-top: 45px;
}
#app .page1 .signGiftBox .giftBox .gift{
    width: 70px;
    height: 66px;
    background: center no-repeat;
    margin: 0 auto;
}
#app .page1 .signGiftBox .giftBox.giftBox5 .gift{
    width: 404px;
    height: 203px;
    background: 0 -48px no-repeat;
    background-image: url(../images/new/ch.png) !important;
    animation: giftCh 1s steps(8) infinite;
    position: absolute;
    top: -69px;
    left: -130px;
    transform: scale(0.6);
}
#app .page1 .signGiftBox .giftBox.giftBox5 .giftName{margin-top: 76px;}
@keyframes giftCh{
    0%{background-position-x: 0;}
    100%{background-position-x: -3200px;}
}
#app .page1 .signGiftBox .giftBox .giftName{
    color: #74563c;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
}
#app .page1 .signGiftBox .giftBox .giftBtn{
    position: absolute;
    bottom: 3px;
    left: 50%;
    transform: translate(-50%);
    width: 138px;
    height: 34px;
    background-position: 2px 0;
    cursor: pointer;
}
#app .page1 .signGiftBox .giftBox .giftBtn.waitGet:hover{background-position-x: -146px;}
#app .page1 .signGiftBox .giftBox .giftBtn.notAllow{background-position-x: -295px;}
#app .page1 .signGiftBox .giftBox .giftBtn.isGet{background-position-x: -443px;}
#app .page2 .taskBox{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1200px;
    height: 113px;
    background: url(../images/new/taskBg.png) center no-repeat;
    margin:10px auto 0;
}
#app .page2 .taskBox.isShowSign{display: none;}
#app .page2 .taskBox .left{
    display: flex;justify-content:space-between;width:1200px;font-weight:normal;
}
#app .page2 .taskBox .left .task{
    width: 267px;
    height:113px;
    font-size: 14px;box-sizing:border-box;padding:0 16px;
}
#app .page2 .taskBox .left .task .title{
    color: #fff9f4;padding-top:52px;
}
#app .page2 .taskBox .left .task .taskDesc{
    color: #ff9e44;
}
#app .page2 .taskBox .left .task .taskBtn{
    width: 73px;
    height: 26px;
    background-position: 0 -93px;
    cursor: pointer;
}
#app .page2 .taskBox .left .task .taskBtn.cannot:hover, #app .page2 .taskBox .left .task .taskBtn.get:hover{background-position-x: -83px;}
#app .page2 .taskBox .left .task .taskBtn.geted{background-position-x: -165px;position:relative;}
#app .page2 .taskBox .left .task .taskBtn.get{background-position-y: -132px;}
#app .page2 .taskBox .left .task .taskBtn.geted::after{content:"";width:80px;height:70px;background:url(../images/new/btnIcon1.png) -274px -96px no-repeat; position:absolute;top:-92px;right:0}
/*#app .page2 .taskBox .left .task .taskBtn.get:hover{background: url(../images/img/taskBtn_mut.png) center no-repeat;}*/
#app .page2 .taskBox .left .bottom{
    display: flex;
    justify-content: space-between;
    margin-top: 4px;
}
#app .page2 .taskBox .right{
    font-size: 16px;
    /*color: red;*/
    margin-right: 66px;
}

#app .left{
    display: flex;
    align-items: center;
    font-size: 24px;
    color: #767677;
    font-weight: bold;
}
#app #page6 .left{margin-top: -90px;}
#app .page2 .topTitle{justify-content: space-between;}
#app .page2 .topTitle .guessLog{
    margin-right: 22px;
    font-size: 16px;
}
#app .page2 .topTitle .guessRule{font-size: 16px;}
#app .pageTitle{
    width: 666px;
    height: 140px;
    background-position:0 0;margin:0 auto;
}
#app .page2 .gameInfo{
    transition: all 0.3s;
    display: flex;
    flex-flow: wrap;
    width: 870px;
    margin: 0 18px 0 0;
    float:right;height: 366px;
  align-items: center;
  justify-content: center;
}
#app .page2 .toggleBtnBox{width:1200px;height:550px;background:url(../images/new/jcbg.png) 0 0 no-repeat;margin:0 auto;}
#app .page2 .toggleBtnBox .toggleTop{
    justify-content: flex-end;
    margin-top: 14px;
    margin-bottom: 12px;
}
#app .page2 .toggleBtnBox .toggleTop .guessCoin{
    color: #f7f9ed;width:360px;height:56px;
    font-size: 14px;
    display:flex;align-items:center;justify-content:flex-start;
}
#app .page2 .toggleBtnBox .toggleTop .guessCoin p{margin-right: 14px;width:148px}
#app .page2 .toggleBtnBox .toggleTop .guessCoin span{color:#ffcc00;font-size:22px;width: 62px;display: inline-block;text-align:center;}
#app .page2 .toggleBtnBox .toggleTop .guessCoin a{color:#ffa729;font-size:14px;text-decoration:underline;margin-right:16px}
.transition{
    transition: all 0.3s;
}
.secendTop{display:flex;align-items:center;justify-content:flex-end;width:1100px;margin:-2px 0 0 60px}
.secendTop div{width:216px;height:54px;background-position:-231px -614px;cursor:pointer;margin:0 -2px}
.secendTop div.match_4{background-position-y:-687px}
.secendTop div.match_3{background-position-y:-760px}
.secendTop div.match_1{background-position-y:-833px}
.secendTop div:hover,.secendTop div.cur{background-position-x:0}
.toggleLeft .toggleServerBtn{
    width:250px;height:80px;background-position:0 -220px;margin:16px 0 16px 50px;cursor:pointer;
}
.toggleLeft{float:left;margin-top:-10px}
.toggleLeft .toggleServerBtn.hundun{background-position-y:-316px}
.toggleLeft .toggleServerBtn.kaitian{background-position-y:-413px}
.toggleLeft .toggleServerBtn.wanjian{background-position-y:-509px}
.toggleLeft .toggleServerBtn:hover, .toggleLeft .toggleServerBtn.cur{
    background-position-x:-257px;
}
#app .page2 .toggleBtnBox .toggleBottom .toggleGame{
    margin-right: 62px;
}
#app .page2 .toggleBtnBox .toggleBottom .toggleGame.cur,#app .page4 .toggleType div.cur{color: #fe4200;}
#app .page2 .gameInfo .gameBox{
    position: relative;
    width: 428px;
    height: 188px;
    background: url(../images/new/jcitem.png) 0 0 no-repeat;float:left;

}
#app .page2 .gameInfo .gameBox.jifen{
    height: 232px;
}
#app .page2 .gameInfo .gameBox .gameTop{
    width: 354px;
    height: 40px;
    /*background: url(../images/img/scroll.png) 0 0;*/
    line-height: 40px;
    color: #fff;
    font-size: 16px;
    justify-content: space-between;
    padding:3px 0 0 26px;
}
#app .page2 .gameTime {justify-content:flex-start;}
#app .page2 .gameTime p{color:#ffffff;font-weight:bold;font-size:16px}
#app .page2 .gameInfo.center{justify-content: center;margin: 0;width:884px;height:388px;transition: none;align-items: center;}
#app .page2 .gameInfo .gameBox .gameTop .scroll{display: none;}
#app .page2 .gameInfo .gameBox .gameTop.underway{
    position: relative;
    background-image: url(../images/img/redbg.png);
}
#app .page2 .gameInfo .gameBox .gameTop.underway .scroll{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../images/img/jt.png?v=001) 0 0;
    animation: jt 5s linear infinite;
}
@keyframes jt{
    0%{background-position-x: -373px;}
    100%{background-position-x: 0;}
}
/*#app .page2 .gameInfo .gameBox .gameTop.notStart{
    background-position-y: -108px;
}
#app .page2 .gameInfo .gameBox .gameTop .gameTime .date{
    margin-left: 20px;
}*/
#app .page2 .gameInfo .gameBox .info{display: flex;justify-content: space-between;width:368px;margin:0 auto;}
#app .page2 .gameInfo .gameBox .info .gamerGuildName{font-size:16px;color:#b54315;font-weight:bold;white-space:nowrap;}
#app .page2 .gameInfo .gameBox .info .gamerServerName{line-height:16px;margin:6px 0 2px}
#app .page2 .gameInfo .gameBox .info .gameServerInfo{
    position: relative;
    display: flex;
    flex-flow: column;
    cursor: pointer;
    align-items: center;
    color: #686e76;
    font-size: 12px;
    width: 140px;
    height: 84px;
    padding-top: 16px;
    line-height: 16px;margin:0 4px;
}
#app .page2 .info .gameServerInfo .guess_coin span{color:#2059d1}
#app .page2 .gameInfo .gameBox.jifen .info .gameServerInfo{
    position: relative;
    display: flex;
    flex-flow: column;
    /*cursor: pointer;*/
    align-items: center;
    color: #686e76;
    font-size: 12px;
    width: 132px;
    height: 160px;
    padding-top: 32px;
    line-height: 16px;
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .gamerImg{
    width: 56px;
    height: 56px;
    background: center / 100% no-repeat;
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .score{
    position: absolute;
    right: -32px;
    top: 24px;
    width: 34px;
    height: 52px;
    /*display: none;*/
    background-position: -208px -242px;
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .isChoose{
    position: absolute;
    left: 14px;
    top: 6px;
    width: 46px;
    height: 46px;
    text-align: center;
    line-height: 58px;
    font-size: 22px;
    font-weight: bold;
    color: #bf4c00;
    background: url(../images/img/ya.png) center no-repeat;
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo.gameServerInfo1 .score{
    right: 134px;
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .jifenRank{
    width: 30px;
    height: 34px;
    background: url(../images/new/jifen1.png) center no-repeat;
    position: absolute;
    right: 24px;
    top: 27px;
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .jifenRank.jifen2{background-image: url(../images/new/jifen2.png);}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .jifenRank.jifen3{background-image: url(../images/new/jifen3.png);}
#app .page2 .gameInfo .gameBox .info .gameServerInfo.gameServerInfo .score.win{background-position-x: -208px;}
#app .page2 .gameInfo .gameBox .info .gameServerInfo.gameServerInfo .score.lose{background-position-x: -273px;}
#app .page2 .gameInfo .gameBox .info .gameServerInfo.gameServerInfo .score.not{background-position-x: -338px;}
#app .page2 .gameInfo .gameBox .scoreCenter{
    position: absolute;
    top: 86px;
    left: 50%;
    width: 8px;
    height: 14px;
    background-position:-627px -268px;
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .gamerBtn{
    position: relative;
    width: 109px;
    height: 24px;
    background-position: -291px -123px;
    cursor: pointer;
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .gamerBtn:hover{
    filter: brightness(1.1);
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .gamerBtn.waitGet.notAllow:hover{/*background-position-x: -384px;*/}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .gamerBtn.notAllow{
    filter: grayscale(1);
}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .gamerBtn.geted{background-position-y: -86px;}
#app .page2 .gameInfo .gameBox .info .gameServerInfo .gamerBtn.get{background-position-y:-123px}
#app .page2 .gameInfo .gameBox .gameBtn{
    position: absolute;
    top: 132px;
    left: 50%;
    width: 150px;
    height: 32px;
    background-position: -291px -167px;margin-left:-75px;
}
#app .page2 .gameInfo .gameBox .gameBtn.live{
    background-position-y:-216px;
}
#app .page2 .gameInfo .gameBox .gameBtn:hover{
    background-position-x: -448px
}
/*#app .page2 .gameInfo .gameBox .gameBtn.notStart:hover{background-position-x:-268px}*/
#app .page2 .gameInfo .gameBox .gameBtn.notStart{background-position:-291px -257px;}

#app .page2 .gameInfo .gameBox.jifen .gameBtn{
    position: absolute;
    top: 46px;
    left: 89%;
    transform: translate(-50%);
    width: 56px;
    height: 16px;
    text-decoration: underline;
    text-align: center;
    color: #fe4f12;
    background-position: -292px -168px;
}
#app .page2 .gameInfo .gameBox.jifen .gameBtn.live{
    background-position-y: -215px;
}
#app .page2 .gameInfo .gameBox.jifen .gameBtn.notStart{background-position-y: -262px;}
#app .page2 .gameInfo .gameBox.jifen .gameBtn:hover{
    background-position-x: -416px;
    color: #ff7d4f;
}
#app .page2 .gameInfo .gameBox.jifen .gameBtn.notStart:hover{background-position-x: -292px;}
#app .page3 .gameVideo{
    width: 500px;
    height: 350px;
    overflow: hidden;margin:10px 0px 0 4px;
}
.page3 .news_con_box{width:1220px;height:540px;background:url(../images/new/page3_con.png) 0 0 no-repeat;margin:0 auto;display:flex;align-items:center;justify-content:flex-start;box-sizing:border-box;padding-left:95px}
.news_con_box .zhiboBox{width:508px;height:370px;background:url(../images/new/popup/page3_bg.png) 0 0 no-repeat;}
#app .page3 .gameVideo .mSwiper {
    width: 100%;
    height: 100%;
}
.swiper-pagination .swiper-pagination-bullet{width:24px;height:16px;background:url(../images/new/popup/aside_info.png) -396px -150px no-repeat;opacity:1;margin:0 2px;border-radius:0;}
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-position-x:-359px}
.swiper-pagination-box .swiper-pagination{width: 500px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-top: 12px;}
#app .page3 .gameVideo img{width:100%;height:100%}
#app .page3 .toggleBox{
    /*width: 418px;*/
    margin: 14px 0 16px;
}
#app .page3 .content{
    display: flex;
    flex-wrap:wrap;
    margin-top: 16px;width:1220px;
}
#app .page3 .newsBox{
    width: 502px;margin:0 0 0 32px;height:400px;
}
#app .page3 .newsBox .more{
    font-size: 16px;
}
#app .page3 .news_type{display:flex;align-items:center;justify-content:space-between;}
#app .page3 .news_type p{width:164px;height:36px;background-position:0 -902px;cursor:pointer;float:left;}
#app .page3 .news_type p:nth-child(2){background-position-x:-176px}
#app .page3 .news_type p:hover,#app .page3 .news_type p.cur{background-position-y:-949px}
#app .page3 .news_type a{font-size:14px;color:#e5b985;text-decoration:underline;}
#app .page3 .newsBox .left{justify-content: space-between;}
#app .page3 .newsBox .newsUl{
    color: #808080;
    font-size: 16px;
    display: flex;
    flex-flow: column;
    height: 338px;margin-top:16px;
}
/*#app .page3 .newsBox .newsUl .newsLi{cursor: pointer;}*/
.cursor{cursor: pointer;}
#app .page3 .newsBox .newsUl .newsLi{display: flex;align-items: center;position: relative;transition: all 0.1s;padding: 0 0 0 14px;font-size: 16px;color:#b5b5b5;height:16px;margin:7px 0;}
#app .page3 .newsBox .newsUl .newsLi .title{
    width: 514px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 24px;
}
#app .page3 .newsBox .newsUl .newsLi.newtop{
    font-size: 22px;
    color: #dd6b2e;
    border: none;
    margin: 4px auto 0;
    text-align: center;
    padding: 0 0 14px;
    justify-content: center;
    height:24px;
}
#app .page3 .newsBox .newsUl .newsLi.newtop .point {opacity: 0;}
#app .page3 .newsBox .newsUl .newsLi.newtop .title{font-size: 22px;font-weight: bold;
    white-space: wrap;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;}
#app .page3 .newsBox .newsUl .newsLi:hover{color: #e8a966;}
#app .page3 .newsBox .newsUl .newsLi.newtop .time{font-size: 14px;}
#app .page3 .newsBox .newsUl .newsLi .point{
    position: absolute;
    width: 8px;
    height: 8px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: url(../images/img/point.png) center no-repeat;
}
#app .page3 .newsBox .newsUl .newsLi:hover .time{font-size: 14px;}
#app .page3 .newsBox .newsUl .newsLi.newtop:hover{color: #ff8f19;}
#app .page3 .newsBox .newsUl .newsLi .time{position: absolute;right: 0;bottom: 8px;}
#app .page3 .pageTitle{background-position-y: -161px;}
#app .page3 .newsBox .pageTitle{background-position-y: -118px;width: 198px;background-position-x: -10px;}
/*#app .page3 .newsBox .newsUl .newsLi .*/
#app .page3 .newsBox .togglePageBtnBox{
    justify-content: flex-end;
    /*margin-top: 18px;*/
}
#app .page3 .newsBox .togglePageBtnBox .togglePage{
    width: 25px;
    height: 24px;
    margin: 0 4px;
    border: 1px solid;
    color: #808080;
    font-size: 14px;
    text-align: center;
    line-height: 25px;
}
#app .page3 .newsBox .togglePageBtnBox .togglePage:hover, #app .page3 .newsBox .togglePageBtnBox .togglePage.cur{color: #1c1c1c;background: url(../images/new/pageBg.png) 0 0 no-repeat;border-color: #cfb277;}

#app .page4 .content{margin-top: 24px;}
#app .page4 .toggleType div{margin-right: 30px;margin-top: 10px;margin-bottom: 10px;}
#app .page4 .pageTitle{
    background-position-y: -176px;
    background-position-x: -10px;
    width: 206px;
}
#app .page4 .gamerBox .gamerInfo{
    width: 156px;
    color: #fff;
}
#app .page4 .gamerBox.sixth .gamerInfo{
    margin-right: 46px;
    width: 178px;
    margin-bottom: 28px;
}
#app .page4 .gamerBox.sixth .gamerInfo:nth-child(4n){
    margin-right: 0;
}
#app .page4 .gamerBox.sixth .jifenRankBox{
    position: relative;
    width: 330px;
    height: 608px;
    background: url(../images/new/jifenRankBox.png) center no-repeat;
}
#app .page4 .gamerBox.sixth .jifenRankBox .desc{
    position: absolute;
    bottom: 28px;
    padding: 0 42px;
    color: #bb4b00;
}
#app .page4 .gamerBox.sixth .jifenRankBox .jifenList{
    display: flex;
    justify-content: space-between;
    width: 95%;
    text-align: center;
    margin: 68px auto -58px;
    color: #6b370c;
    font-size: 14px;
}
#app .page4 .gamerBox.sixth .jifenRankBox .jifenList div{flex: 1;white-space: nowrap;}
#app .page4 .gamerBox.sixth .gamerInfoBox{
    display: flex;
    flex-wrap: wrap;
    flex: 1;
}
#app .page4 .gamerInfo .gameInfoTop{color: #71758b;font-size: 12px;justify-content: space-between;margin-bottom: 2px;}
#app .page4 .gamerInfo .gameInfoTop .gameBtn{color: #f4d178;text-decoration: underline;}
#app .page4 .gamerInfo .gameInfoTop .timeBox div{margin-right: 10px;}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo{position: relative;border-left: 2px solid #242532;height: 36px;justify-content: space-between;font-size: 12px;background: #3d3e4d;margin-bottom: 1px;}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo .stauts{
    font-size: 20px;
    font-weight: bold;
    height: 100%;
    width: 28px;
    text-align: center;
    line-height: 36px;
    background: #242532;
}
#app .page4 .sixth .gamerInfo .gameServerInfoBox .gameServerInfo .stauts{
    width: 48px;
    font-size: 28px;
}
#app .page4 .sixth .gamerInfo .gameServerInfoBox .gameServerInfo .stauts span{
    font-size: 13px;
    font-weight: 200;
}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo .hoverServer{
    position: absolute;
    display: flex;
    flex-flow: column;
    align-items: center;
    bottom: 36px;
    left: 50%;
    transform: translate(-50%);
    width: 117px;
    overflow: hidden;
    color: #885c38;
    height: 0px;
    transition: all 0.3s;
    background: url(../images/new/popup/mutBg.png) center no-repeat;
}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo:hover .hoverServer .hoverServerImg{
    width: 72px;
    height: 72px;
    margin-top: 6px;
    background: center / 100% no-repeat;
}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo:hover .hoverServer .hoverServerGuildCC{margin-top: 6px;}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo:hover .hoverServer .hoverServerGuildName{margin-top: 6px;color: #bb4b00;}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo:hover .hoverServer .hoverServerName{margin-top: 6px;}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo:hover .hoverServer {height: 156px;opacity: 1;}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo .gameImg{width: 26px;height: 26px;background: center/100% no-repeat;margin: 0 4px;}
#app .page4 .gamerInfo .gameServerInfoBox .gameServerInfo .gameName{width: 89px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
#app .page4 .gamerInfo.end .gameServerInfo.win{background: #b08960;border-color: #987355;}
#app .page4 .gamerInfo.end .gameServerInfo.win .stauts{background-image: linear-gradient(to bottom, #dcb161, #a5693f);border-color: #e84949;}
#app .page4 .gamerInfo.end .gameServerInfo.loser{background: #3d3e4d;border-color: #242532;}
#app .page4 .gamerInfo.end .gameServerInfo.loser .stauts{background: #242532;border-color: #787878;}
/*#app .page4 .gamerInfo.notStart .gameServerInfo0{background: #770f0e;border-color: #e95251;}*/
/*#app .page4 .gamerInfo.notStart .gameServerInfo0 .stauts{background: #f33c3c;border-color: #f33c3c;}*/
/*#app .page4 .gamerInfo.notStart .gameServerInfo1{background: #4e0100;border-color: #e95251;}*/
/*#app .page4 .gamerInfo.notStart .gameServerInfo1 .stauts{background: #f34140;border-color: #f34140;}*/

#app .page4 .gamerInfo.notGamer .gameServerInfo0{background: #c08245;border-color: #f6dc80;}
#app .page4 .gamerInfo.notGamer .gameServerInfo0 .stauts{background: #f6dc80;border-color: #f6dc80;}
#app .page4 .gamerInfo.notGamer .gameServerInfo1{background: #ca925c;border-color: #f6dc80;}
#app .page4 .gamerInfo.notGamer .gameServerInfo1 .stauts{background: #f6dc80;border-color: #f6dc80;}

#app .page4 .gamerBox{flex-flow: wrap;}
#app .page4 .gamerBox.sixth{margin-top: 0;justify-content: space-between;align-items: flex-start;}
#app .page4 .gamerBox.eight{
    display: none;
    width: 980px;
    height: 500px;
    margin: 252px auto 0;
    /*background: url(../images/img/line.png?v=001) center no-repeat;*/
}
#app .page4 .gamerBox.eight .listBox{position: relative;justify-content: space-between;}
#app .page4 .gamerBox.eight .listBox .trophy{
    position: absolute;
    width: 205px;
    height: 170px;
    top: -160px;
    left: 50%;
    transform: translate(-47%);
    background: url(../images/img/trophy.png) center top no-repeat;
}
#app .page4 .gamerBox.eight .gamerList{width: 156px;position: relative;display: flex;flex-flow: column;justify-content: space-between;}
#app .page4 .gamerBox.eight .gamerList .gamerInfo{margin: 0;}
#app .page4 .gamerBox.eight .gamerList.eight .gamerInfo.gamerInfo0{position: relative;top: 14px;}
/*#app .page5 .content{margin-top: 20px;}*/
#app .page5 .pageTitle{
    font-size: 14px;
    color: #725d49;
    text-align: center;
    background-position-y: -336px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    height: 154px;margin-top:-20px;
}
#app .page4 .gamerBox.eight .gamerList .img{
    position: absolute;
    width: 21px;
    height: 82px;
    top: 50%;
    left: -21px;
    transform: translateY(-50%);
    background: url(../images/img/eightImg.png) center no-repeat;
}
#app .page4 .gamerBox.eight .gamerList.right .img{left: 156px;}
#app .page4 .gamerBox.eight .gamerList.four .img{background-image: url(../images/img/eightImg.png);}
#app .page4 .gamerBox.eight .gamerList.three .img{background-image: url(../images/img/fourImg.png);}
#app .page4 .gamerBox.eight .gamerList.two .img{background-image: url(../images/img/twoImg.png);}
#app .page4 .gamerBox.eight .gamerList.one .img{background-image: url(../images/img/oneImg.png);}
#app .page4 .gamerBox.eight .gamerList .gameServerInfoBox{position: relative;}
#app .page4 .gamerBox.eight .gamerList .gameServerInfoBox:hover{z-index: 1;}
#app .page4 .gamerBox.eight .gamerList.eight{height: 468px;}
#app .page4 .gamerBox.eight .gamerList.four{position: relative;left: 18px;}
#app .page4 .gamerBox.eight .gamerList.four.right{left: -38px;}
#app .page4 .gamerBox.eight .gamerList.four .gamerInfo.gamerInfo0{position: relative;top: -66px;}
#app .page4 .gamerBox.eight .gamerList.four .gamerInfo.gamerInfo1{position: relative;top: 82px;}
#app .page4 .gamerBox.eight .gamerList.three .gamerInfo.gamerInfo0{position: relative;left: -40px;top: 7px;}
#app .page4 .gamerBox.eight .gamerList.three.right .gamerInfo.gamerInfo0{position: relative;left: 40px;}
#app .page4 .gamerBox.eight .gamerList.one .gamerInfo.gamerInfo0{position: relative;top: 6px;left: 10px;}
#app .page4 .gamerBox.eight .gamerList.two .gamerInfo.gamerInfo0{position: relative;top: 41px;left: 10px;}
#app .page4 .gamerBox.eight .gamerList.three{z-index: 1;}
#app .page4 .gamerBox.eight .gamerList.two{}
#app .page4 .gamerBox.eight .gamerList.one{}
#app .page5 .topInfo {justify-content: space-between;}
#app .page5 .topInfo .rightInfo{display:flex;align-items:center;justify-content:flex-end;width:100%;margin-top:-28px}
#app .page5 .topInfo .rightInfo span{color:#2c37c3;font-size:22px;}
#app .page5 .topInfo .rightInfo .normalBtn{font-size:14px;color:#d36500;margin:0 16px}
#app .page5 .topInfo .rightInfo .guessCoin{
    color: #74604d;
    font-size: 14px;
}
#app .page5 .giftContent{
    display: flex;
    flex-flow: wrap;
    justify-content: space-between;
    /*width: 952px;*/
    margin:-14px auto 0;
}
#app .page5 .giftContent .giftBox{
    position: relative;
    width: 191px;
    height: 204px;
    display: flex;
    flex-flow: column;
    align-items: center;
    color: #f3f9ff;
    margin: 24px 22px 0;
    font-size: 14px;
    background: url(../images/new/exchangeGiftBg.png) 0 0 no-repeat;
}
#app .page5 .giftContent .giftBox .giftImg{
    width: 70px;
    height: 70px;
    background: center no-repeat;
    margin:38px 0 2px;
}
#app .page5 .giftContent .giftBox .giftName{
    width: 100px;
    white-space: nowrap;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    text-align: center;margin:4px 0;
    /*height: 34px;*/
}
#app .page5 .giftContent.special{width:660px;margin-top: 20px;}
#app .page5 .giftContent.special li{
    width:234px;height:314px;margin:0 35px;
    background-position-x:-255px;color:#f3f9ff;
}
#app .page5 .giftContent.special .giftBox .giftCoin{width:190px;height:46px;left:22px;font-size:16px;color:#e4dad6;top:0;align-items:center;justify-content:center;flex-direction:column;font-weight:bold;}
#app .page5 .giftContent.special .giftBox .giftImg{width:166px;height:140px;margin-top:44px;background-position:center;position:relative;}
#app .page5 .giftContent.special .giftImg p{width:250px;height:116px;background:url(../images/txdy.png) 0 0 no-repeat;position:absolute;left: -44px;top: 16px;animation: txdy_p 1s steps(8) infinite;}
#app .page5 .giftContent.special .sjms .giftImg p{background:url(../images/jcgj.png)  -58px -50px / 2100px auto no-repeat;animation:sjms_p 1s steps(6) infinite;height:250px;top: -42px;left: -26px;}

@keyframes sjms_p {
    0% {background-position-x: -58px;}
    100% {background-position-x: -2158px;}
}
@keyframes txdy_p {
    0% {background-position-x: 0;}
    100% {background-position-x: -2000px;}
}



#app .page5 .giftContent.special .giftBox .giftCoin span{color:#ffac35;font-size:14px}
#app .page5 .giftContent .giftBox .giftLimit{
    color: #9bb1b8;font-size:12px;
}
#app .page5 .giftContent .giftBox .giftBtn{
    width: 163px;
    height: 36px;
    cursor: pointer;
    background: url(../images/new/exchange.png) 0 0 no-repeat;
    margin: 2px 0;
}
/*#app .page5 .giftContent .giftBox .giftBtn.waitGet:hover{background-position-x: -150px;}*/
#app .page5 .giftContent .giftBox .giftBtn.notAllow{background-position-x: -372px;}
#app .page5 .giftContent .giftBox .giftBtn.Geted{background-position-x: -558px;}
#app .page5 .giftContent .giftBox .giftBtn.waitGet{background-position-x: -186px;}
#app .page5 .giftContent.special .giftBox .giftBtn.notAllow{background-position-x: -737px;}
#app .page5 .giftContent.special .giftBox .giftBtn.isGet{background-position-x: -910px;}
#app .page5 .giftContent .giftBox .giftCoin{
    position: absolute;
    left: 116px;
    top: 6px;
    display: flex;
}
#app .page5 .giftContent .giftBox .giftCoin .Coin{
    width: 15px;
    height: 24px;background-position:0 0
}
#app .page5 .giftContent  .giftBox .giftCoin .giftCoin1{background-position-y: 0}
#app .page5 .giftContent  .giftBox .giftCoin .giftCoin2{background-position-y: -45px}
#app .page5 .giftContent  .giftBox .giftCoin .giftCoin3{background-position-y: -92px}
#app .page5 .giftContent  .giftBox .giftCoin .giftCoin4{background-position-y: -138px}
#app .page5 .giftContent  .giftBox .giftCoin .giftCoin5{background-position-y: -184px}
/*#app .page6 .content{padding-top: 160px;}*/
#app .page6 .pageTitle{
    background-position-y: -500px;
    margin-top:-34px;
}
#app .page6 .list{
    position: relative;
    flex-flow: column;
    height: 580px;
    justify-content: space-between;
    align-items: self-start;
    margin: 56px 0;
}
.rank_ul{width:1150px;height:707px;background:url(../images/rank.png) 0 0 no-repeat;margin:0 auto;}
.rank_ul li{margin:0 auto;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;padding-top:130px;position:relative;}
.rank_ul li:nth-child(1){width:800px;margin:0 0 0 175px}
.rank_ul li:nth-child(2){width:350px;margin:0 0 0 110px;padding-top:127px;float:left;}
.rank_ul li:nth-child(3){width:290px;margin:0 0 0 724px;padding-top:127px;}
.rank_ul li:nth-child(4),.rank_ul li:nth-child(5),.rank_ul li:nth-child(6){background:url(../images/rankinfo.png) 0 0 no-repeat;width:1150px;height:240px;padding:24px 0 0 216px;margin-top:72px;box-sizing:border-box;justify-content:flex-start;}
.rank_ul li:nth-child(4) dl,
.rank_ul li:nth-child(5) dl,
.rank_ul li:nth-child(6) dl{margin:0 -23px 0 0}
.rank_ul li:nth-child(1) dl:nth-child(1),
.rank_ul li:nth-child(3) dl:nth-child(1),
.rank_ul li:nth-child(1) dl:nth-child(2),
.rank_ul li:nth-child(1) dl:nth-child(3),
.rank_ul li:nth-child(1) dl:nth-child(4)
{
margin:0 21px 13px;
}
.rank_ul li:nth-child(4) dd,.rank_ul li:nth-child(5) dd,.rank_ul li:nth-child(6) dd{width:90px}
.rank_ul li:nth-child(6),.rank_ul li:nth-child(5){background-position-y: -250px;height: 198px;padding-top: 0;margin-top:14px}
.rank_ul li:nth-child(6) dl,.rank_ul li:nth-child(5) dl{margin-top:-12px}
.rank_ul li:nth-child(6){background-position-y: -460px;}
.rank_ul dl dt{width:70px;height:70px;margin:0 auto;position:relative;display: flex;align-items: center;justify-content: center;}
.rank_ul dl img{height:68px;margin:0 auto 0;}
.rank_ul dl {font-size:14px;color:#f3f9ff;text-align:center;width:134px;margin:0 5px 13px;height:94px}
.rank_ul dl dd{margin:4px auto 0;}
.rank_ul dl dt p,.rank_ul li>div div span i{width:369px;height:272px;background:url(../images/new/ch_mask.png) 0 0 no-repeat;position:absolute;z-index: 1;bottom: 38px;left:50%;display:none;margin-left: -188px;}
.rank_ul dl dt:hover p{display:block;}
/*.rank_ul dl dt span{display:block;width:200px;background:url(../images/lshy.png) 0 0 no-repeat;height:300px}*/


.rank_ul li:nth-child(2) dl{margin:0px 12px 13px}

.rank_ul li>div{font-size:14px;color:#f1be66;text-decoration:underline;position:absolute;right: -134px;top: 68px;}
.rank_ul li:nth-child(2)>div{right:-60px}
.rank_ul li:nth-child(3)>div{right:-96px}
.rank_ul li>div div{z-index: 2;width:585px;height:340px;background:url(../images/tips.png) 0 0 no-repeat;font-size:14px;color:#f3f9ff;position:absolute;text-decoration:none;right:0;display: none;cursor:pointer;align-items: center;justify-content: center;align-content: center;flex-wrap: wrap;box-sizing:border-box;padding:68px 0 0}
.rank_ul li>div div p{width:80px;text-align:center;margin:0 18px 10px;height:110px}
.rank_ul li>div div span{display:flex;width:70px;height:70px;background-position: -393px -914px;align-items:center;justify-content:center;margin: 0 auto;position:relative;}
.rank_ul li>div div span img{display:block;height:64px;margin:0 auto;}
.rank_ul li>div:hover div{display:flex;}
.rank_ul li:nth-child(3)>div div{background-position-y:-343px}
.rank_ul li:nth-child(2)>div div{background-position-y:-684px}
.rank_ul li:nth-child(1)>div div p{margin:0 12px 10px}
.rank_ul li>div div span>span:hover i{display:block;}
/*.rank_ul li>div div span i{display:block;}*/
.rank_ul li>div div span a{display:block;width:100%;height:100%}
.rank_ul li>div div span i a,.rank_ul dl dt div .move_bg span.szwg{transform:scale(1);left: -98px;position: absolute;top: -34px;display:block;width:500px;background:url(../images/lshy.png) 0 -52px / 4200px auto no-repeat;height:336px;animation:lszj 1s steps(8) infinite;}



@keyframes lszj {
    0% {background-position-x: 0;}
    100% {background-position-x: -4200px;}
}
.rank_ul li>div div span .s6ch a,.rank_ul dl dt .s6ch{width: 158px;height: 76px;background: url(../images/dfwz.png) 0 0 /1200px auto no-repeat;position: absolute;left: -39px;top: -2px;animation:s6ch_mov 1s steps(8) infinite;}
@keyframes s6ch_mov {
    0% {background-position-x: 0;}
    100% {background-position-x: -1200px;}
}
.rank_ul li>div div span .s6ch i a,.rank_ul dl dt div span{background: url(../images/dfwz.png) 0 0 /2800px auto no-repeat;width: 351px;height: 194px;left: 11px;top: 28px;animation:s6ch_mov_i 1s steps(8) infinite;display:block;position:absolute;}
@keyframes s6ch_mov_i {
    0% {background-position-x: 0;}
    100% {background-position-x: -2800px;}
}

.rank_ul dl dt div span.yywg,.rank_ul li > div div span .yywg a{background:url(../images/yywg.png) -54px -5px /2000px auto no-repeat;animation:yywg_an 1s steps(7) infinite;width: 200px;height: 174px;top: -70px;left: -55px;}
.rank_ul dl dt div .move_bg span.yywg,.rank_ul li > div div span .yywg i a{transform: scale(1);width:354px;left:7px;top:-8px;height:254px;background-size:3584px auto;animation:yywg_an_move 1s steps(7) infinite;}
.rank_ul li > div div span .yywg a{top: -52px;left: -57px;position: absolute;transform: scale(.6);}
@keyframes yywg_an {
    0% {background-position-x: -54px;}
    100% {background-position-x: -2054px;}
}
@keyframes yywg_an_move {
    0% {background-position-x: -80px;}
    100% {background-position-x: -3664px;}
}
.rank_ul dl dt div span.zjwg,.rank_ul li > div div span .zjwg a{background:url(../images/zjwg.png) 0 0 /1000px auto no-repeat;animation:zjwg_an 1s steps(6) infinite;width:164px;left:-48px;top:-70px}
.rank_ul li > div div span .zjwg a{top: -60px;left: -48px;position: absolute;transform: scale(.6);height:186px}
.rank_ul dl dt div .move_bg span.zjwg,.rank_ul li > div div span .zjwg i a{transform: scale(1);width:300px;left:34px;top:-42px;height:312px;background-size:1800px auto;animation:zjwg_an_move 1s steps(6) infinite;}
@keyframes zjwg_an {
    0% {background-position-x: -0px;}
    100% {background-position-x: -1000px;}
}
@keyframes zjwg_an_move {
    0% {background-position-x: -0px;}
    100% {background-position-x: -1800px;}
}





.rank_ul dl dt div span.szwg,.rank_ul li > div div span .szwg>a{background:url(../images/lshy.png) 0 0 / 2000px auto no-repeat;animation:szwg_an 1s steps(8) infinite;width:200px;top:-80px;left:-94px;}
.rank_ul li > div div span .szwg>a{top: -70px;left: -88px;position: absolute;transform: scale(.7);height: 190px;}
@keyframes szwg_an {
    0% {background-position-x: 0;}
    100% {background-position-x: -2000px;}
}

.rank_ul dl dt div span.hzsz{background:url(../images/hzsz.png) -22px 0 /2000px auto no-repeat;animation:hzsz_an 1s steps(8) infinite;width:200px;left: -72px;top: -76px;}
.rank_ul dl dt div .move_bg span.hzsz{background-size:5000px auto;animation:hzsz_an_move 1s steps(8) infinite;width: 470px;height: 358px;background-position: -62px -94px;top:-40px;left:-90px}
@keyframes hzsz_an {
    0% {background-position-x: -22px;}
    100% {background-position-x: -2022px;}
}
@keyframes hzsz_an_move {
    0% {background-position-x: -62px;}
    100% {background-position-x: -5062px;}
}

#app .page6 .list .rule p{
    font-size: 16px;
    margin: 22px 0;
    padding: 0 108px 0 0;
    line-height: 28px;
    color: #767677;
}
#app .page6 .list .rule a{color: #47b5ff;}
#app .page6 .list .giftLi{
    position: relative;
    width: ;
    height: 102px;
    background: url(../images/img/bottomGiftBg.png) 0 0;
}
#app .page6 .list .giftLi .giftBox.inGift{
    position: absolute;
    width: ;
    height: 0;
    opacity: 0;
    bottom: -110px;
    z-index: -1;
    transition: all 0.3s;
}
#app .page6 .list .giftLi.top_1 .inGift,#app .page6 .list .giftLi.top_2 .inGift,#app .page6 .list .giftLi.top_3 .inGift{
    width: 1130px;
    height: 213px;
    display: flex;
    flex-flow: wrap;
    bottom: -110px;
    background: url(../images/img/giftBg/one.png) center no-repeat;
}
#app .page6 .list .a{position: absolute;right: 0;top: -62px;font-size: 18px !important;}
#app .page6 .list .a a:hover{color: #8ac8f1;}
#app .page6 .list .giftLi.top_2 .inGift{
    background-image: url(../images/img/giftBg/two.png);
}
#app .page6 .list .giftLi.top_3 .inGift{
    background-image: url(../images/img/giftBg/three.png);
}
#app .page6 .list .giftLi.top_1:hover .inGift{height: 213px;opacity: 1;bottom: -214px;z-index: 1;}
#app .page6 .list .giftLi.top_2:hover .inGift{height: 213px;opacity: 1;bottom: -214px;z-index: 1;}
#app .page6 .list .giftLi.top_3:hover .inGift{height: 102px;opacity: 1;bottom: -103px;z-index: 1;}
#app .page6 .list .giftLi .inGift .box{
    flex-flow: wrap;
    margin-left: 112px;
    margin-top: -4px;
}
#app .page6 .list .giftLi .inGift .box .gift{margin-bottom: 20px;margin-top: 12px;background: url(../images/img/giftBg/giftBg.png) center no-repeat !important;}
#app .page6 .list .giftLi.top_3 .inGift .box .gift{margin: 0 28px;}
#app .page6 .list .giftLi.top_3 .inGift .box{margin-top: -16px;}
#app .page6 .list .giftLi .hoverText{
    position: absolute;
    top: -24px;
    left: 0;
    color: #f1b06a;
    text-decoration: underline;
    height: 26px;
}
#app .page6 .list .giftLi .leftTitle{width: 113px;height: 102px;background: url(../images/img/giftBg/bg1.png) center no-repeat;}
#app .page6 .list .giftLi.top_2 .leftTitle{background-image: url(../images/img/giftBg/bg2.png);}
#app .page6 .list .giftLi.top_3 .leftTitle{background-image: url(../images/img/giftBg/bg3.png);}
#app .page6 .list .giftLi.top_4 .leftTitle{background-image: url(../images/img/giftBg/bg4.png);}
#app .page6 .list .giftLi.top_8 .leftTitle{background-image: url(../images/img/giftBg/bg5.png);}
#app .page6 .list .giftLi.top_16 .leftTitle{width: 127px;background-image: url(../images/img/giftBg/bg6.png);}
#app .page6 .list .giftLi.top_32 .leftTitle{width: 127px;background-image: url(../images/img/giftBg/bg7.png);}
#app .page6 .list .giftLi .giftBox .gift{
    position: relative;
    display: flex;
    justify-content: center;
    flex-flow: column;
    width: 70px;
    color: #f1b06a;
    font-size: 12px;
    height: 70px;
    margin: 0 37.65px;
    background: url(../images/img/giftBg/giftBg.png) center no-repeat;
}
#app .page6 .list .giftLi .giftBox{display: flex;align-items: center;margin-top: -14px;}
#app .page6 .list .giftLi .giftBox .gift .giftImg{width: 70px;height: 70px;background: center no-repeat;margin: -5px 0 0 1px;}
#app .page6 .list .giftLi .giftBox .gift .giftName{position: absolute;width: 140px;text-align: center;left: 50%;transform: translate(-50%);bottom: -20px;}
#app .page6 .list .giftLi.top_16 .gift,#app .page6 .list .giftLi.top_32 .gift{margin: 0 36.65px;}
#app .page6 .list .giftLi.top_1 .giftBox .gift,#app .page6 .list .giftLi.top_2 .giftBox .gift,#app .page6 .list .giftLi.top_3 .giftBox .gift{background: none;}
#app .page6 .list .giftLi.top_1,#app .page6 .list .giftLi.top_2,#app .page6 .list .giftLi.top_3{
    width: 1130px;
    height: 103px;
    background: url(../images/img/giftBg/oneBg.png) center no-repeat;
}
#app .page6 .list .giftLi.top_2{width: 770px;background-image: url(../images/img/giftBg/twoBg.png);}
#app .page6 .list .giftLi.top_3{width: 645px;background-image: url(../images/img/giftBg/threeBg.png);}
#app .page6 .list .giftLi.top_1 .giftBox.outGift{margin-left: 13px;margin-top: -15px;}
#app .page6 .list .giftLi.top_1 .giftBox.outGift .gift{margin: 0 24px;
    margin-right: 30px;background: none;}
#app .page6 .list .giftLi.top_1 .giftBox.outGift .gift.gift4{}
#app .page6 .list .giftLi.top_1 .inGift .box .gift .giftImg.zq_s,#app .page6 .list .giftLi.top_2 .inGift .box .gift .giftImg.zq_s,#app .page6 .list .giftLi.top_1 .giftBox.outGift .gift .giftImg.zq_s,#app .page6 .list .giftLi.top_2 .giftBox.outGift .gift .giftImg.zq_s,#app .page6 .list .giftLi.top_3 .giftBox.outGift .gift .giftImg.zq_s{
    width: 154px !important;
    height: 129px !important;
    background: url(../images/img/giftBg/zj.png) -82px -105px no-repeat;
     animation: zq_s 1s steps(8) infinite;
    left: -45px !important;
    top: -8px !important;
    position: absolute;
}
@keyframes zq_s {
    0% {
        background-position-x: -82px;
    }

    100% {
        background-position-x: -2642px;
    }
}
#app .page6 .list .giftLi.top_1 .inGift .box .gift .giftImg.cb_s,#app .page6 .list .giftLi.top_2 .giftBox.inGift .gift .giftImg.cb_s,#app .page6 .list .giftLi.top_3 .giftBox.inGift .gift .giftImg.cb_s,#app .page6 .list .giftLi.top_1 .giftBox.outGift .gift .giftImg.cb_s,#app .page6 .list .giftLi.top_2 .giftBox.outGift .gift .giftImg.cb_s,#app .page6 .list .giftLi.top_3 .giftBox.outGift .gift .giftImg.cb_s{
    width: 120px;
    height: 138px;
    background: url(../images/img/giftBg/cb.png) -52px -40px no-repeat;
     animation: cb_s 1s steps(8) infinite; 
    left: -26px;
    top: -36px;
    position: absolute;
}
#app .page6 .list.thirdTwo .giftLi .giftBox .gift.gift6 .giftImg,
#app .page6 .list .giftLi.top_1 .inGift .box .gift:nth-child(10) .giftImg,
#app .page6 .list .giftLi.top_2 .inGift .box .gift:nth-child(9) .giftImg,
#app .page6 .list .giftLi.top_3 .inGift .box .gift:nth-child(8) .giftImg{
    position: absolute;
    width: 134px;
    height: 164px;
    top: -60px;
    left: -38px;
    transform: scale(0.8);
    background: 0 0 no-repeat;
    background-image: url(../images/img/jbch.png) !important;
    animation: jbch 1s steps(10) infinite;
}
@keyframes jbch {
    0% {
        background-position-x: 0;
    }

    100% {
        background-position-x: -1500px;
    }
}

#app .page6 .list .giftLi .inGift .box .gift .giftImg.cb_s{background-image: url(../images/img/giftBg/cb.png) !important;}
#app .page6 .list .giftLi .inGift .box .gift .giftImg.zq_s{background-image: url(../images/img/giftBg/zj.png) !important;}
@keyframes cb_s {
    0% {
        background-position-x: -52px;
    }

    100% {
        background-position-x: -1772px;
    }
}
#app .page6 .list .giftLi.top_2 .giftBox.outGift .gift{
    margin: -4px 16px 0 38px;
}
#app .page6 .list .giftLi.top_3 .giftBox.outGift .gift{
    margin: -4px 16px 0 38px;
}


/*foot*/
.wrapper-footer {position: relative; min-width: 1200px; background: transparent; height: 202px;margin-top: -5px;margin-top: -12px;}
.wrapper-inner { width: 1000px; margin: 0 auto; position: relative }
.wrapper-inner .qr-left { float: left; width: 282px; height: 138px; background: url(//cdn.51img3.com/game/2024/202411/20241105/a3616904892947f98499a76890cf413a.png) center / 100% no-repeat; margin: 30px 0 0 90px }
/*.x .wrapper-inner .qr-left {background-image: url(//cdn.51img3.com/game/2022/202204/20220426/42447f6b33f221a841d3a593bb2994cc.png);}*/
.wrapper-inner .f-info-right { float: right; width: 500px; height: 40px; margin: 35px 40px 0 0; text-align: center }
.wrapper-inner .f-info-right a { color: #fff; }
.f-info-right .footer-logo { display: block; width: 127px; height: 45px; margin: 10px auto }
.f-info-right p { color: #fff; line-height: 30px }


/* 弹框 */
.alert-wrap{
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 90;
}
.alert-wrap .btn-close{
    position: absolute;
    width: 27px;
    height: 26px;
    background: url(../images/new/popup/closePopup.png) center no-repeat;
    right: 50px;
    top: 42px;
    cursor: pointer;
    transition: transform 0.3s;
}
.alert-wrap .btn-close:hover{
    transform: rotate(180deg);
}
.alert-wrap .shadow-box{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0,0,0,0.5);
}
.alert-wrap .msg-alert{
    width: 858px;
    height: 514px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url(../images/new/popup/normalPopupBg.png) center no-repeat;
}
.alert-wrap .msg-alert.myGiftTableGuessLog{
    width: 800px;
    background-image: url(../images/new/popup/guessPopupBg.png);
}
/*.alert-wrap .msg-alert.calendar{
    background-image: url();
}*/
.alert-wrap .msg-alert .msg-tit{
    text-align: center;
}
.alert-wrap .msg-alert h3{
    font-size: 26px;
    padding: 26px 40px 26px 48px;
    color: #4b545d;font-weight:normal;margin:22px auto 0;
}
.alert-wrap .msg-alert.myGuessRules .msg-con{
    font-size: 16px;
    margin: 0px 40px 0 48px;
    width: auto;
    height: 366px;
}

.alert-wrap .msg-alert .msg-con{
    margin:0 40px 0 48px;
    height: 335px;
    color: #1d2127;
    font-size:24px;
    margin: 14px 34px;
    overflow-y: auto;
    overflow-x: hidden;
}
.alert-wrap .msg-alert.showHDRule .msg-con{
    font-size: 16px;
    width:774px;height:368px;
}
.alert-wrap .msg-alert .msg-con p{
    line-height: 30px;text-align:center;
}
.alert-wrap .msg-alert.showHDRule .msg-con p,.alert-wrap .msg-alert.myGuessRules p{text-align: left;line-height: 26px;margin: 0 0 14px;text-align:left;}
.alert-wrap .msg-alert.myGuessRules .msg-con p{margin:0}
.alert-wrap .msg-alert .msg-con::-webkit-scrollbar {
    width: 6px;
    height: 5px;
}
.alert-wrap .msg-alert .msg-con::-webkit-scrollbar-track {
    /*-webkit-box-shadow: inset 0 0 0.5rem rgba(91,131,229,0.2);*/
    background: #e8dcc5;
    border-radius: 20px;
}
.alert-wrap .msg-alert .msg-con::-webkit-scrollbar-thumb {
    border-radius: 20px;
    /*-webkit-box-shadow:  0 0 0.5rem rgba(243,212,250,0.2);*/
    background: #c7a666;
}
.alert-wrap .msg-alert.myGiftTable .msg-con{
    margin-top: 22px;
    height: 310px;
}
.alert-wrap .msg-alert.myGiftTable.guessRankPopup .msg-con{
    height: 234px;
}
.alert-wrap .msg-alert.myGiftTable.myGiftTableLog .msg-con{margin-top: 0;width:800px;height:362px}
.alert-wrap .msg-alert.myGiftTable .msg-con .myRank{
    position: absolute;
    display: flex;
    top: 72px;
    left: 50%;
    transform: translate(-50%);
    color: #ff9500;
    font-weight: bold;
    font-size: 20px;
    white-space: nowrap;
    justify-content: space-between;
    width: 66%;
}
.alert-wrap .msg-alert .msg-con table{
    width:800px;margin:0 auto;
    text-align: center;
}
.alert-wrap .msg-alert .msg-con table.guessRank {
    width: 84%;
    text-align: center;
    margin: 0 auto;
}
.alert-wrap .msg-alert .msg-con table th,.alert-wrap .msg-alert .msg-con table td{text-align: center;width: 200px;}
.alert-wrap .msg-alert .msg-con table th{color:#b54315;font-size:18px;font-weight:normal;}
.alert-wrap .msg-alert.myGiftTableGuessLog .msg-con table th, .alert-wrap .msg-alert.myGiftTableGuessLog .msg-con table td{width: 117px;white-space: nowrap;}
.alert-wrap .msg-alert .msg-con table.guessRank th,.alert-wrap .msg-alert .msg-con table.guessRank td{text-align: center;width: 106px;white-space: nowrap;}
.alert-wrap .msg-alert .msg-con table tbody tr{
    display: flex;
    justify-content: space-around;
    margin-bottom: 8px;
    font-size: 15px;
}
.alert-wrap .msg-alert .msg-con .luckGiftBox{
    margin-top: 35px;
    font-size: 16px;
}
.alert-wrap .msg-alert .msg-con .luckGiftBox .pimg{display: flex;justify-content: center;margin-bottom: 20px;}
.alert-wrap .msg-alert .msg-con .luckGiftBox p{text-align: center;}
.alert-wrap .msg-alert .msg-con .tip2{text-align: center;font-size: 16px;margin-top: 62px;}
.alert-wrap .msg-alert .msg-con .service-nav{
    z-index: 1;
    width: 286px;
    margin: 50px auto 0;
    position: absolute;
    left: 52%;
    transform: translate(-50%);
    top: 124px;
}
.alert-wrap .msg-alert .msg-con .service-nav .uname{margin-top: 18px;}
.alert-wrap .msg-alert .msg-con .service-nav .uname .searchable-select-caret{display: none;}
.alert-wrap .msg-alert .msg-con .service-nav #comment_role_name{
    border: 1px solid #cccccc;
    border-radius: 4px;
    width: 200px;
    height: 33px;text-align:center;
    appearance: none;
    color: #555;
    outline: none;
    padding-left: 7px;
}
.alert-wrap .msg-alert .msg-con .btn-alert{
    position: absolute;
    left: 50%;
    bottom: 45px;
    transform: translateX(-48%);
    width: 166px;
    height: 43px;
    color: #30060a;
    background: url(../images/new/popup/popupBtn.png) center no-repeat;
    text-align: center;
    line-height: 46px;
    font-weight: bold;
    font-size: 22px;
    cursor: pointer;
    transition: filter 0.2s;font-family: 宋体;
      font-style: italic;
      font-weight: bold;
}
.alert-wrap.resPopup .msg-alert .msg-con .btn-alert .btn-alert{
    bottom: 30px;
}
.alert-wrap .msg-alert .msg-con .btn-alert:hover{
    filter: brightness(1.1);
}
.alert-wrap .msg-alert.myGuessRules tr{
    margin: 0 !important;
}
.alert-wrap .msg-alert.myGuessRules tr th{
    background: #525961;
    color: #fff;
    border: 1px solid #525961;
    padding: 8px 4px;
}
.alert-wrap .msg-alert.myGuessRules tr th:last-child{
    /*border-right-color: #525961;*/
}
.alert-wrap .msg-alert.myGuessRules tr td{
    color: #1d2127;
    /*border: 1px solid;*/
    margin-bottom: -1px;
    margin-left: 0px;
    padding: 8px 4px;
}
/*.alert-wrap .msg-alert.myGuessRules .msg-con p{
    padding: 0 70px;
    line-height: 32px;
    color: #525961;
}*/
.alert-wrap .msg-alert.myGuessRules .msg-con p:first-child{
    margin-top: 20px;
}
.alert-wrap .msg-alert.myGuessRules .msg-con table{
    width: 436px;
    margin: 0 auto 10px;border-color:#525961;
}
/* 兑换框 */
.alert-wrap.exchangePopup{display: none;}
.alert-wrap.exchangePopup .msg-alert{
    width: 470px;
    height: 335px;
    background: url(../images/new/popup/smallPopupBg.png) center no-repeat;
}
.alert-wrap.exchangePopup .msg-alert .bottom{justify-content: center;margin: 34px 0 24px 0;}
.alert-wrap.exchangePopup .msg-alert .bottom .add, .alert-wrap.exchangePopup .msg-alert .bottom .cut{
    color: #525961;
    border: 1px solid;
    /* padding: 0px 10px; */
    font-size: 42px;
    cursor: pointer;
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.3s;overflow:hidden;
}
.notdisplay{display: block !important;}
.alert-wrap.exchangePopup .msg-alert .bottom .add:hover, .alert-wrap.exchangePopup .msg-alert .bottom .cut:hover{
    color: #fff;
    background: #525961;
    border-color: #525961;
}
.alert-wrap.exchangePopup .msg-alert .bottom .cut span{margin-top: -12px;font-size: 66px;}
.alert-wrap.exchangePopup .msg-alert .bottom .input{
    position: relative;
    height: 32px;
    width: 200px;
    background: none;
    margin: 0 10px;
    color: #3b0100;
    line-height: 32px;
}
.alert-wrap.exchangePopup .msg-alert .bottom .input .giftNum{
    position: absolute;
    color: #e8a865;
    background: rgba(0,0,0,0.6);
    width: 20px;
    top: -27px;
    display: flex;
    justify-content: center;
    border-radius: 14px 14px 48px 48px;
}
.alert-wrap.exchangePopup .msg-alert .msg-con{text-align: center;}
.alert-wrap.exchangePopup .msg-alert .msg-con .mtitle{
    margin: 14px 0 14px 0;
}
.alert-wrap.votePopup div{text-align: center;}
.alert-wrap.votePopup .mtitle{font-size: 18px;color: #1d2127;margin-bottom:4px}
.alert-wrap.votePopup.resPopup .mtitle.text1{
    margin-top: 28px;
    font-size: 22px;
}
.alert-wrap.votePopup.resPopup .mtitle.text3{
    font-size: 22px;
}
.alert-wrap.votePopup.resPopup .mtitle.text2, .alert-wrap.votePopup.resPopup .mtitle.text4{
    font-size: 32px;
    color: #b54315;
    font-weight: bold;
    margin:-6px 0 16px ;
}
.alert-wrap.votePopup.resPopup .mtitle.text5{color: #1d2127;font-size: 14px;margin-top: 16px;width: 400px;
  top: 392px;
  left: 65px;position:absolute;}
.alert-wrap.votePopup .guildName{
    font-size: 20px;
    color: #bb4b00;
}
.alert-wrap.votePopup .tips_error{color: #f36027;font-size: 14px;margin-top: 16px;}
.alert-wrap.votePopup .bottom{
    display: flex;
    justify-content: center;
    margin-top: 20px;
}
.alert-wrap.votePopup .bottom .add, .alert-wrap.votePopup .bottom .cut{
    color: #525961;
    border: 1px solid;
    font-size: 42px;
    cursor: pointer;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.3s;overflow:hidden;
}
.alert-wrap.votePopup .bottom .input{
    background: url(../images/new/input.png) center no-repeat;
    margin: 0 16px;
    width: 104px;
    color: #3b0100;
    line-height: 32px;
}
.alert-wrap.votePopup .msg-alert .bottom .add:hover, .alert-wrap.votePopup .msg-alert .bottom .cut:hover{
    color: #fff;
    background: #525961;
    border-color: #525961;
}
.alert-wrap.votePopup .msg-alert {
    width: 515px;
    height: 534px;
    background-image: url(../images/new/newspaper.png);
}


.searchable-select-dropdown{z-index: 1;}

/* 隐藏range控件默认样式 */
    [type="range"] {
      -webkit-appearance: none;
      appearance: none;
      margin: 0;
      outline: 0;
      background-color: transparent;
      width: 200px;
      border-radius: 10px;
    }
    /* 定义range控件轨道的样式 */
    [type="range"]::-webkit-slider-runnable-track {
      height: 4px;
      background: #e8a865;
      border-radius: 10px;
    }
    /* 定义range控件容器的样式 */
    [type="range" i]::-webkit-slider-container {
      height: 20px;
      overflow: hidden;
      border-radius: 10px;
    }
    /* 定义range控件拇指的样式 */
    [type="range"]::-webkit-slider-thumb {
      -webkit-appearance: none;
      border-radius: 10px;
      appearance: none;
      cursor: grab;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background-color: #e8a865;
      border: 1px solid transparent;
      margin-top: -8px;
      /* 使用border-image属性给拇指添加渐变边框 */
      border-image: linear-gradient(#525961, #525961) 0 fill / 8 20 8 0 / 0px 0px 0 2000px;
    }
    ul, ol, li {
    list-style: none;
}
video{
    position: absolute;
    left: 50%;
    z-index: -1;
    width: 1920px;
    height: 1080px;
    transform: translate(-50%);
    top:-96px;
    transition: all 0.3s;display:none;
}
/*.page1 video{display: none;}*/
video.isShowSign{top: 0;}
#news_mask{
    left: -1304px;
}
.page1_card_group {
    width: 1128px;
    top: 9px;
    position: relative;
    display: flex;
    justify-content: space-between;
    margin: 36px auto;
}

.page1_card_1 {
    background: url(../images/rank1.png?v=2432703) top center no-repeat;
    width: 333px;
    height: 677px;
    position: relative;
}

.page1_card_2 {
    background: url(../images/rank2.png?v=2432702) top center no-repeat;
    width: 333px;
    height: 573px;
    margin-top: 44px;
    position: relative;
}

.page1_card_3 {
    background: url(../images/rank3.png?v=2432702) top center no-repeat;
    width: 333px;
    height: 573px;
    margin-top: 44px;
    position: relative;
}

.page1_card_box {
    width: 260px;
    margin: 34px auto 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.page1_card_top {
    margin: 64px auto 0px;
    width: 286px;
    height: 94px;
    background: url(../images/rank_top.png) top center no-repeat;
    position: relative;
    left: -2px;
}

.page1_award {
    width: 116px;
    height: 96px;
    margin-bottom: 42px;
    position: relative;
}

.page1_award .page1_award_img {
    width: 100%;
    height: 100%;
    display: block;
}

.page1_card_2 .page1_award_name {
    white-space: nowrap;
    font-size: 14px;
    color: #48597b;
    margin-top: 5px;
    text-align: center;
    position: absolute;
    bottom: -25px;
    width: 100%;
    text-align: center;
}

.page1_card_1 .page1_award {
    margin-bottom: 36px;
    width: 116px;
}

.page1_card_1 .page1_award_name {
    white-space: nowrap;
    font-size: 14px;
    color: #6f4a1a;
    margin-top: 5px;
    text-align: center;
    position: absolute;
    bottom: -25px;
    width: 100%;
    text-align: center;
}

.page1_card_3 .page1_card_box {
    margin-top: 47px;
}

.page1_card_3 .page1_card_box .page1_award:first-child {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.page1_card_3 .page1_card_box .page1_award:first-child .page1_award_img {
    width: 96px;
}

.page1_card_3 .page1_award_name {
    font-size: 14px;
    color: #934940;
    margin-top: 5px;
    text-align: center;
    position: absolute;
    bottom: -25px;
    width: 100%;
    text-align: center;
}

.page1_btn_1.page1_btn_active {
    background-position: -0px -632px;
}

.page1_btn_2.page1_btn_active {
    background-position: -340px -632px;
}

.page1_btn_3.page1_btn_active {
    background-position: -677px -632px;
}

.si_div {
    position: absolute;
    top: 5px;
    left: 164px;
    padding-top: 20px;
    display: flex;
}

.si_div li {
    width: 106px;
    height: 94px;
    float: left;
    margin: 0 17.5px;
    text-align: center;
    white-space: nowrap;
}

.si_div li div {
    width: 72px;
    height: 72px;
    background-position: -589px -33px;
    margin: 0 auto 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.si_div li div img {
    display: block;
    width: 70px;
}

.si_div.gu5 {
    top: 178px;
}

.si_div.gu6 {
    top: 352px;
}

.page1_card1_tip,.page1_card2_tip,.page1_card3_tip {
    font-size: 16px;
    color: #767677;
    text-decoration: underline;
    position: absolute;
    bottom: -30px;
    width: 100%;
    text-align: center;
    cursor: pointer;
}

.page1_card1_box {
    width: 1173px;
    height: 0px;
    position: absolute;
    bottom: 30px;
    left: 209px;
    margin-left: -207px;
    transition: 0.5s height;
    overflow: hidden;
    color: #feefcb
}

.page1_card1_pop {
    width: 1173px;
    height: 246px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/card2_pop.png?v=120211) no-repeat;
    position: absolute;
    z-index: 99;
    cursor: default;
}

.page1_card1_tip:hover .page1_card1_box {
    height: 246px
}

.page1_card2_box {
    width: 1173px;
    height: 0px;
    position: absolute;
    bottom: 30px;
    left: -214px;
    margin-left: -207px;
    transition: 0.5s height;
    overflow: hidden;
    color: #feefcb
}

.page1_card2_pop {
    width: 1173px;
    height: 246px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/card1_pop.png?v=120211) no-repeat;
    position: absolute;
    z-index: 99;
    cursor: default;
}

.page1_card2_tip:hover .page1_card2_box {
    height: 246px
}

.page1_card3_box {
    width: 1173px;
    height: 0px;
    position: absolute;
    bottom: 30px;
    left: -590px;
    margin-left: -207px;
    transition: 0.5s height;
    overflow: hidden;
    color: #feefcb
}

.page1_card3_pop {
    width: 1173px;
    height: 246px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/card3_pop.png?v=120211) no-repeat;
    position: absolute;
    z-index: 99;
    cursor: default;
}

.page1_card3_tip:hover .page1_card3_box {
    height: 246px
}

.page1_award2 {
    padding-top: 1px;
    margin-bottom: 70px;
}

.page1_award2 .page1_award_box {
    margin-top: 5px;
}

.page1_card4_pop {
    width: 1130px;
    height: 110px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/card4_pop.png?v=120211) no-repeat;
}

.page1_card5_pop {
    width: 1130px;
    height: 110px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/card5_pop.png?v=120211) no-repeat;
}

.page1_card6_pop {
    width: 1130px;
    height: 110px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/card6_pop.png?v=120211) no-repeat;
}

.page1_card7_pop {
    width: 1130px;
    height: 110px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/card7_pop.png?v=120211) no-repeat;
}

/*.page1_card4_pop .page1_award_box,.page1_card5_pop .page1_award_box,.page1_card6_pop .page1_award_box,.page1_card7_pop .page1_award_box {padding-right:40px;box-sizing: border-box;;justify-content: space-between;width: 1033px;}*/
.page1_award_group {
    position: relative;
    width: 1173px;
    height: 487px;
    background: url(../images/new/bottomGiftBg.png);
    top: 96px;
    margin: 0 auto;

}

/*.page1_award_group>div{margin-top: -5px;width: 100%}*/
.award_title {
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/award_title.png) 0 0 no-repeat;
    height: 45px;
    width: 444px;
    margin-bottom: 7px;
}

.page1_award_box {
    width: 1074px;
    margin: -3px auto;
    height: 92px;
    text-align: center;
    color: #f1b06a;
    font-size: 14px;
    display: flex;
    flex-wrap: wrap;
    margin-top: 26px;
    margin-left: 154px
}

.page1_award_item {
    width: 72px;
    height: 94px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/icon.png) -589px -33px no-repeat;
    margin: 0 14px 14px 53px;
}

.page1_award_item img {
    display: block;
    width: 64px;
    height: 64px;
    margin: 3px auto 6px;
}

.page1_award_item span {
    display: block;
    width: 150px;
    margin-left: -39px;
    font-size: 12px;
    color: #333
}

.page1_award_line {
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/award_line.png) top center no-repeat;
    width: 1229px;
    height: 23px;
    margin-left: -15px;
}

.page1_award_16_title {
    background-position: 0px -82px
}

.page1_award_8_title {
    background-position: 0px -154px
}

.page1_award_4_title {
    background-position: 0px -240px
}

.page1_award_3_title {
    background-position: 0px -314px
}

.page1_award_2_title {
    background-position: 0px -383px
}

.page1_award_1_title {
    background-position: 0px -449px
}

.page1_rule_group {
    width: 1018px;
    color: #f1b06a;
    font-size: 14px;
    line-height: 26px;
    position: absolute;
    top: 100px ;
    left: 90px;
}

.top_three_group {
    position: absolute;
    top: 894px;
}

.ani.ani1 {
    width: 160px;
    height: 160px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/hz.png) -36px -26px no-repeat;
    animation: ani1 1s steps(8) infinite;
    left: -30px;
    top: -60px;
    position: absolute;
}

@keyframes ani1 {
    0% {
        background-position-x: -36px;
    }

    100% {
        background-position-x: -2236px;
    }
}

.ani.ani0 {
    width: 160px;
    height: 160px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/cy.png) -40px -24px no-repeat;
    animation: ani0 1s steps(8) infinite;
    left: -30px;
    top: -60px;
    position: absolute;
}

@keyframes ani0 {
    0% {
        background-position-x: -40px;
    }

    100% {
        background-position-x: -2240px;
    }
}

.ani.ani2 {
    width: 160px;
    height: 160px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/lscb.png) 0 0 no-repeat;
    animation: cb_s 1s steps(8) infinite;
    left: -28px;
    top: -44px;
    position: absolute;
}

@keyframes cb_s {
    0% {
        background-position-x: 0;
    }

    100% {
        background-position-x: -1400px;
    }
}

.ani.ani3 {
    width: 230px;
    height: 200px;
    background: url(//cdn3.51img1.com/v7/huodong/xb/xbs5booking/images/images/sj.png) 0 0 no-repeat;
    animation: zq_s .5s steps(4) infinite;
    left: -67px;
    top: -84px;
    position: absolute;
}

@keyframes zq_s {
    0% {
        background-position-x: 0;
    }

    100% {
        background-position-x: -1170px;
    }
}
.el-tooltip__popper.is-dark{
    color: #fff !important;
    background: rgba(0, 0, 0, 0.6) !important;
    min-width: 2px !important;
    display: flex !important;
    font-size: 14px;
    justify-content: center;
    border-radius: 14px 14px 48px 48px;
}
.el-slider__button {border-color: #525961 !important;background-color: #fff !important;}
.el-slider__bar{background-color: #525961 !important;}
.el-slider__runway{background-color: #a1a2a2 !important;}

.alert-wrap.votePopup .msg-alert .msg-con{height:428px;text-align:left;}
.news_div_alert{border:3px solid #434d57;width:820px;height:420px;position:absolute;transform: scale(.466);top: 88px;left: -148px;}
#newsPaper{width:820px;height:420px;background:center no-repeat;position:relative;}
#newsPaper .news_role_name{font-size:46px;color:#434d57;text-align:left;font-weight:bold;top:86px;left:64px;position:absolute;}
#newsPaper p,#newsPaper h5{text-align:left;}
#newsPaper h5{font-size:26px;color:#ffffff;font-weight:bold;position:absolute;top:340px;left:66px}
#newsPaper h5 p{font-size:20px;color:#dcc0ff}
#newsPaper h5 p span{font-size:12px;color:#dedede;font-weight:normal;}