@import url(public.css);.main-nav-wrap{height:46px;padding:15px 0px;background:#2C63BF}
.main-nav-logo{margin-top:3px;float:left}
.main-nav-logo img{height:40px;}
.main-nav{padding-left:140px;float:left;}
.main-nav li{line-height:46px;float:left;font-size:15px}
.main-nav li a{padding-left:20px;padding-right:20px;display:block;color:#f0f0f0}
.main-nav li a:hover{color:#fff}
.main-nav li a.new:after{content:"";position:absolute;right:9px;top:11px;display:block;width:7px;height:7px;border-radius:50%;background:#e8403d}
.main-nav li.active a{background:#2e363b}
#menu-toggle {display: none;}
@media screen and (max-width: 1000px) {
    .main-nav-logo img{height:40px;}
    .main-nav{display:none;padding-left:0px;position:fixed;top:45px;left:140px;width:100%;height:100%;background:#000;}
    .main-nav li{float:none;}
    .menu-button-container {height: 100%;width: 30px;cursor: pointer;flex-direction: column;justify-content: center;align-items: center;float:right;margin-right:10px;}
    .menu-button,
    .menu-button::before,
    .menu-button::after {display: block;background-color: #ddd;position: absolute;height: 4px;width: 30px;transition: transform 400ms cubic-bezier(0.23, 1, 0.32, 1);border-radius: 2px;}
    .menu-button{margin-top:17px;}
    .menu-button::before {content: "";margin-top: -10px;}
    .menu-button::after {content: "";margin-top: 10px;}
    #menu-toggle:checked + .menu-button-container .menu-button::before {margin-top: 0px;transform: rotate(405deg);}
    #menu-toggle:checked + .menu-button-container .menu-button {background: rgba(255, 255, 255, 0);}
    #menu-toggle:checked + .menu-button-container .menu-button::after {margin-top: 0px;transform: rotate(-405deg);}
    #menu-toggle ~ .header_box li {clear:both;  height: 0;  margin: 0;  padding: 0;  border: 0;  transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);}
    #menu-toggle:checked ~ .header_box a {border: 1px solid #333;  height: 2.5em;  padding: 0.5em;  transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);}
}

.game-recommend-tab{margin-bottom:20px;background:#FFF;}
.game-recommend-tab-title{position:relative;}
.game-recommend-tab-title:before{content:"";border-bottom:1px solid #EEE;position:absolute;bottom:0px;width:100%;}
.game-recommend-tab-title span{margin-left:20px;position:relative;display:inline-block;height:48px;line-height:48px;font-size:15px;cursor: pointer;color:#666;}
.game-recommend-tab-title span.active{color:#eb4e18;font-weight:bold;}
.game-recommend-tab-title span.active:before {content:"";border-bottom:2px solid #2C63BF;position:absolute;bottom:0px;left:0px;width:100%;}
.game-recommend-list{display:none;}
.game-recommend-list.active{display:block;}
.game-recommend-list ul{overflow:hidden;padding:20px 0px 0px 20px;}
.game-recommend-list ul li{float:left;text-align:center;width:117px;padding-bottom:15px;}
.game-recommend-list ul li p{line-height:24px;height:24px;overflow:hidden;}
.game-recommend-list ul li a{font-size:12px;}
.game-recommend-list ul li img{width:86px;height:86px;border-radius:15px;}
@media screen and (max-width:1000px) {
    .game-recommend-tab{margin-bottom:5px;}
    .game-recommend-tab-title span{margin-left:0px;padding:0px 5px;font-size:14px;}
    .game-recommend-list ul{overflow:auto;display:-webkit-flex;display:flex;padding:20px 20px 0px 0px;}
    .game-recommend-list ul li{margin-left:15px;}
    .game-recommend-list ul li img{width:66px;height:66px;}
}

.banner{width:480px;height:280px;position:relative;}
.banner img{width:480px;height:280px}
.tt-box-l{width:480px;float:left;}
.tt-box-l h2{font-size:18px;height:45px;line-height:35px}
.tt-box-l ol{background:#FFF;padding:12px 15px 14px 15px;border-top:1px solid #EEE;margin-top:10px;}
.tt-box-l ol:nth-child(1){border-top:0px;}
.tt-box-l ol li{clear:both;height:35px;line-height:35px;overflow:hidden;}
.tt-box-l ol li.tt-box-td{height:auto;padding-bottom:15px;margin-bottom:10px;border-bottom:1px solid #EEE;}
.tt-box-l ol li.tt-box-td p{clear:both;}
.tt-box-l ol li.tt-box-td p:nth-child(1){font-size:16px;}
.tt-box-l ol li.tt-box-td span{content:'推荐';display:block;float:left;background:#fe8900;color:#fff;padding:0px 10px;line-height:30px;margin-right:12px;border-radius:15px;}
.tt-box-l ol li.tt-box-td p:nth-child(1) a{color:#fe8900}
.tt-box-l ol li.tt-box-td p:nth-child(2){color:#999;font-size:14px;padding-top:10px;height:40px;line-height:20px;overflow:hidden;}
.tt-box-l ol li a{float:left;color:#666;}
.tt-box-l ol li time{float:right;color:#999;font-size:12px;}

.tt-menu{background:#FFF;height:45px;border-radius:45px;line-height:45px;font-size:18px;margin-bottom:10px;width:452px;}
.tt-menu span{font-weight:bold;cursor:pointer;}
.tt-menu span.active{color:#ff6600;position:relative;}
.tt-menu span.active::after{content:'';height:3px;width:100%;background:#ff6600;display:block;position:absolute;bottom:0px;left:0px;}

.tt-boxs{width:700px;float:right;}
.tt-boxs-data{background:#FFF;overflow:hidden;}
.tt-box-c{width:452px;float:left;}
.tt-box-c ul{background:#FFF;overflow:hidden;clear:both;padding:6px 0px;display:none}
.tt-box-c ul.active{display:block}
.tt-box-c ul li{padding:13px 0px 13px 18px;width:400px;overflow:hidden;float:left;}
.tt-box-c ul li img{width:90px;height:65px;border-radius:8px;float:left;margin-right:10px;}
.tt-box-c ul li p.news-title{height:30px;line-height:30px;overflow:hidden;margin-bottom:10px;}
.tt-box-c ul li p.news-title a{color:#333;font-size:16px;}
.tt-box-c ul li p time{float:left;font-size:14px;color:#999;}
.tt-box-c ul li p span{float:right;font-size:14px;color:#999;}


.tt-box-r{float:right;width:248px;}
.tt-box-r ul{padding:8px;background:#FFF;}
.tt-box-r li{position:relative;padding:10px 0px 10px 23px;border-left:1px solid #EEE;height:62px;}
.tt-box-r li::before{content:'';position:absolute;top:0px;left:-5px;width:8px;height:8px;border-radius:8px;background:#FFF;border:1px solid #EEE;}
.tt-box-r li:hover::before{background:#3C82FA;left:-8px;top:-2px;width:10px;height:10px;border-radius:10px;border:2px solid #DDD;}
.tt-box-r li img{width:66px;height:66px;float:left;margin-right:10px;}
.tt-box-r li p span,.tt-box-r li p time{font-size:12px;color:#999;margin-right:15px;}
.tt-box-r li .game-title{font-size:15px;max-height:44px;line-height:22px;overflow:hidden;}
.tt-box-r li .game-install{font-size:12px;color:#999;padding-top:6px;}

.tt-box-r .gamebox{position:relative;padding:0px 15px 0px 100px;height:104px;overflow:hidden;margin-top:15px;margin-left:8px}
.tt-box-r .qrcode-data{position:absolute;left:0px;top:0px;}
.tt-box-r .gamebox p{padding-top:12px;text-align:center;}
.tt-box-r .gamebox p:nth-child(2){padding-top:2px;}
.tt-box-r .gamebox p .btn{width:100%;padding:0px;line-height:33px;}
@media screen and (max-width:1000px) {
    .tt-box-l h2{display:none}
    .tt-box-l{width:100%;float:none;}
    .tt-box-l ol{margin-top:0px;}
    .banner{width:100%;}
    .tt-boxs{float:none;width:100%;}
    .tt-menu{width:100%;margin-top:10px;}
    .tt-boxs-data{background:none;}
    .tt-box-c{width:auto;float:none;}
    .tt-box-c ul li{width:auto;float:none;padding:12px;}
    .tt-box-r{float:none;width:100%;margin-top:10px;}
    .tt-box-r .gamebox{padding:15px 15px 15px 115px;height:88px;background:#FFF;overflow:hidden;}
    .tt-box-r .qrcode-data{left:15px;top:15px;}

}

.game-zone-title{height:48px;line-height:48px;border-bottom:1px solid #EEE;padding:0px 15px;}
.game-zone-title h2{float:left;font-size:18px;}
.game-zone-title a{float:right;}
.game-zone{background:#FFF;margin-bottom:20px;overflow:hidden;}
.game-zone ol{}
.game-zone ol li{float:left;margin-left:13px;width:105px;height:35px;box-sizing:border-box;border:1px solid #d2d2d2;font-size:15px;margin-bottom:15px;position: relative;cursor: pointer;}
.game-zone ol li span{display:block;width:4px;height:35px;background:#ff5858;transition:all .3s;z-index:1;position:absolute;left: -1px;top: -1px;}
.game-zone ol li a{display:block;line-height:35px;width:100%;text-align:center;position:absolute;z-index:2;}
.game-zone ol li:hover span{width:100px;}
.game-zone ol li.game-zone-type-1 a{color:#ff9758;}
.game-zone ol li.game-zone-type-1 span{background:#ff9758;}
.game-zone ol li.game-zone-type-2 a{color:#63a2e9;}
.game-zone ol li.game-zone-type-2 span{background:#63a2e9;}
.game-zone ol li.game-zone-type-3 a{color:#a98fd7;}
.game-zone ol li.game-zone-type-3 span{background:#a98fd7;}
.game-zone ol li.game-zone-type-4 a{color:#ff70ce;}
.game-zone ol li.game-zone-type-4 span{background:#ff70ce;}
.game-zone ol li.game-zone-type-5 a{color:#5eccd6;}
.game-zone ol li.game-zone-type-5 span{background:#5eccd6;}
.game-zone ol li.game-zone-type-6 a{color:#ebc83d;}
.game-zone ol li.game-zone-type-6 span{background:#ebc83d;}
.game-zone ol li.game-zone-type-7 a{color:#b09696;}
.game-zone ol li.game-zone-type-7 span{background:#b09696;}
.game-zone ol li.game-zone-type-8 a{color:#5ed895;}
.game-zone ol li.game-zone-type-8 span{background:#5ed895;}
.game-zone ol li:hover a{color:#FFF;}
.game-zone ul{overflow:hidden;clear:both;}
.game-zone ul li{float:left;text-align:center;width:120px;padding-bottom:15px;}
.game-zone ul li p{height:24px;line-height:24px;overflow:hidden;}
.game-zone ul li span{line-height:24px;height:24px;overflow:hidden;border:1px solid #ff9000;font-size:12px;color:#ff9000;height:20px;line-height:20px;border-radius:3px;padding:3px 8px}
.game-zone ul li img{width:80px;height:80px;border-radius:15px;}
@media screen and (max-width:1000px){
    .game-zone ul li{width:22%;margin-left:2%;}
    .game-zone ul li p{font-size:12px;}
    .game-zone ul li img{width:66px;height:66px;}
}

.ranking{margin-top: 15px;}
.ranking .ranking-tit{font-size:16px;height:56px;line-height:56px;border-bottom:1px solid #EEE;padding:0px 15px;}

.ranking .list{background: #fff;width: 362px;padding: 0 15px;border-radius: 7px;float: left;}
.ranking .list .title_ph{height: 70px;line-height: 70px;text-align: center;}
.ranking .list .title_ph .bt{font-size: 20px;font-weight: bold;}
.ranking .list .title_ph .bt i{height: 30px;width: 31px;background-position-y: -71px;display: inline-block;vertical-align: middle;margin: -10px 10px 0 0;}
.ranking .list .title_ph .bt .ico3{background-position-x: 0px;}
.ranking .list .title_ph .bt .ico2{background-position-x: -41px;}
.ranking .list .title_ph .bt .ico1{background-position-x: -83px;}
.ranking .list ul{margin-top: 10px;padding-bottom: 10px;}
.ranking .list ul li{padding: 7px 0;}
.ranking .list ul li .num{width: 24px;height: 24px;border-radius: 2px;text-align: center;line-height: 24px;float: left;background: #47d897;color: #fff;}
.ranking .list ul li .box_a{height: 24px;line-height: 24px;}
.ranking .list ul li .box_a .num{margin: 0px 6px 0 0;}
.ranking .list ul li .box_a a{display: block;float: left;white-space: nowrap;text-overflow: ellipsis;width: auto;overflow: hidden;font-size: 15px;}
.ranking .list ul li .box_a span{text-align: right;float: right;width: 70px;color: #969696;font-size: 13px;overflow: hidden;height: 100%;}
.ranking .list ul li .box_b{display: none;background: url(../img/ranking-bg1.png) no-repeat center;width: 362px;height: 72px;padding: 13px 0 11px 0;margin: 3px 0;}
.ranking .list ul li .box_b .numb{float: left;width: 44px;text-align: center;line-height: 72px;color: #fff;font-size: 26px;}
.ranking .list ul li .box_b .img,
.ranking .list ul li .box_b .img img{width: 72px;height: 72px;border-radius: 10px;display: block;float: left;position: relative;overflow: hidden;}
.ranking .list ul li .box_b .infor{float: left;width: 210px;padding-left: 11px;color: #fff;}
.ranking .list ul li .box_b .infor .name{display: block;height: 25px;line-height: 25px;color: #fff;padding-bottom: 5px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;width: 100%;font-size: 15px;}
.ranking .list ul li .box_b .infor p{height: 21px;line-height: 21px;overflow: hidden;width: 100%;font-size: 12px;}
.ranking .list ul li+li .num{background: #58aafe;}
.ranking .list ul li+li+li .num{background: #f3a658;}
.ranking .list ul li+li+li+li .num{background: #d2d2d2;color: #434343;}
.ranking .list ul .on .box_a{display: none;}
.ranking .list ul .on .box_b{display: block;}
.ranking .list+.list{margin-left: 12px;}
.ranking .list+.list ul li .num{background: #ffa23b;}
.ranking .list+.list ul li .box_b{background-image: url(../img/ranking-bg2.png);}
.ranking .list+.list ul li+li .num{background: #58aafe;}
.ranking .list+.list ul li+li+li .num{background: #f3a658;}
.ranking .list+.list ul li+li+li+li .num{background: #d2d2d2;color: #434343;}
.ranking .list+.list+.list{margin-left: 12px;}
.ranking .list+.list+.list ul li .num{background: #a57cfe;}
.ranking .list+.list+.list ul li .box_b{background-image: url(../img/ranking-bg3.png);}
.ranking .list+.list+.list ul li+li .num{background: #58aafe;}
.ranking .list+.list+.list ul li+li+li .num{background: #f3a658;}
.ranking .list+.list+.list ul li+li+li+li .num{background: #d2d2d2;color: #434343;}
@media screen and (max-width:1000px) {
    .ranking{margin-top:10px;}
    .ranking .list,.ranking .list + .list,.ranking .list+.list+.list{margin-left:0px;margin-top:10px;width:auto;float:none;}

}

.news-box{width:860px;float:left;}
.news-box {clear:both;background:#FFF;border-radius:5px;}
.news-box .news-tab {position:relative;}
.news-box .news-tab:before {content:'';border-bottom:1px solid #EEE;position:absolute;bottom:0px;width:100%;}
.news-box .news-tab span{font-size:16px;position:relative;display:inline-block;padding:0px 20px;height:56px;line-height:52px;cursor:pointer;}
.news-box .news-tab span.active{color:#dc191b;font-weight:bold;}
.news-box .news-tab span.active:before {content: ''; display: block; width:100%; height: 4px; background: #dc191b; border-radius: 100px; margin: auto;}
.news-box .news-list{display:none;overflow:hidden;}
.news-box .news-list.active {display:block;}
.news-box .news-list ul.news-list-big li{padding:18px 0px 10px 18px;overflow:hidden;float:left;width:262px;}
.news-box .news-list ul.news-list-big li img{width:262px;height:156px;border-radius:8px;}
.news-box .news-list ul.news-list-big li p.news-title{height:30px;line-height:30px;overflow:hidden;padding-top:6px}
.news-box .news-list ul.news-list-big li p.news-title a{color:#333;font-size:14px;}
.news-box .news-list ul.news-list-big li p.news-desc{font-size:14px;color:#999;padding-top:15px;line-height:24px;height:48px;overflow:hidden;}

.news-box .news-list ul.news-list-small{border-top:1px solid #EEE;clear:both;}
.news-box .news-list ul.news-list-small li{padding:16px 0px 16px 18px;width:400px;overflow:hidden;float:left;}
.news-box .news-list ul.news-list-small li img{width:90px;height:65px;border-radius:8px;float:left;margin-right:10px;}
.news-box .news-list ul.news-list-small li p.news-title{height:30px;line-height:30px;overflow:hidden;margin-bottom:10px;}
.news-box .news-list ul.news-list-small li p.news-title a{color:#333;font-size:16px;}
.news-box .news-list ul.news-list-small li p time{float:left;font-size:14px;color:#999;}
.news-box .news-list ul.news-list-small li p span{float:right;font-size:14px;color:#999;}

.news-game{background:#FFF;width:320px;float:right;}
.news-game-tit{font-size:16px;height:56px;line-height:56px;border-bottom:1px solid #EEE;padding:0px 15px;}
.news-game ul{overflow:hidden;padding-bottom:16px;}
.news-game ul li{overflow:hidden;width:160px;padding:18px 0px 10px 0px;float:left;text-align:center;}
.news-game ul li img{width:90px;height:90px;border-radius:8px;}
.news-game ul li p{font-size:14px;padding-top:6px;}
.news-game ul li .news-game-down{width:90px;display:inline-block;border:1px solid #ff9000;font-size:12px;color:#ff9000;height:20px;line-height:20px;border-radius:3px;}
@media screen and (max-width:1000px) {
    .news-box{width:100%;float:none;}
    .news-box .news-list ul.news-list-big li{width:47%;padding:0px;margin:10px 0px 0px 2%;text-align:center;}
    .news-box .news-list ul.news-list-big li img{width:auto;height:100px;}
    .news-box .news-list ul.news-list-big li:nth-child(3){display:none;}
    .news-box .news-list ul.news-list-small li{width:auto;}
    .news-game{float:none;width:100%;margin-top:10px;}
    .news-game ul li{width:47%;padding:15px 0px 0px 0px;margin-left:2%;}
}

.index-question{margin-top:20px;clear:both;background:#FFF;}
.index-question-title{height:48px;line-height:48px;border-bottom:1px solid #EEE;padding:0px 15px;}
.index-question-title h2{float:left;font-size:18px;}
.index-question-title a{float:right;}
.index-question li{font-size:14px;float:left;background:#FFF;width:360px;padding:15px;margin-top:12px;}
.index-question li h4{font-size:16px;}
.index-question li p{font-size:12px;color:#999;height:40px;line-height:20px;padding-top:10px;overflow:hidden;}
.index-question li div{height:24px;display:block;padding-top:10px;}
.index-question li span:nth-child(1){border:1px solid #FF4400;color:#FF4400;padding:0px 15px;height:20px;line-height:20px;border-radius:10px;font-size:12px;}
.index-question li span:nth-child(2){float:right;color:#999;font-size:12px;}
@media screen and (max-width:1000px) {
    .index-question{margin-top:8px;}
    .index-question li{width:auto;float:none;margin-top:0px;}
}

.game-vs-update{background:#FFF;overflow:hidden;}
.game-vs-update ol{padding:15px 0px;overflow:hidden;}
.game-vs-update ol li{float:left;padding-left:15px;width:280px;height:30px;line-height:30px;overflow:hidden;}
.index-friends{background:#FFF;}
.index-friends .t {padding:0px 15px;font-size:16px;line-height:38px;height:38px;position:relative;border-bottom:1px solid #EEE;}
.index-friends .t .more {position:absolute;right:15px;top:0;font-size:12px}
.index-friends .b{padding:15px}
.index-friends .b a {float:left;margin:10px 0 0 0;line-height:20px;padding-right:15px}
.index-friends .b a+a {border-left:1px solid #eee;padding:0 15px}
.foot {width:100%;background-color:#fff;border-top:3px solid #0cc6c6;margin-top:20px;}
.foot-line {text-align:center;line-height:60px;width:100%;overflow:hidden;border-bottom:1px solid #eee;border-top:1px solid #eee;position:relative}
.foot-line a{margin:0px 8px;vertical-align:middle}
.foot-line a,.copyright a {color:#a0a0a0}
.foot-line a:hover,
.copyright a:hover {color:#0cc6c6}
.copyright {text-align:center;color:#a0a0a0;padding:15px 0}
.copyright p {margin:5px 0}
.mobile-nav{display:none;}
@media screen and (max-width:1000px) {
    .game-vs-update ul li{float:none;width:auto;}
    .footer{display:none}

    .mobile-nav{position:fixed;display:block;bottom:0px;left:0px;width:100%;text-align:center;background:#2C63BF;z-index:9999;}
    .mobile-nav ul{display:flex;}
    .mobile-nav li{width:20%;}
    .mobile-nav li a{display:block;padding:5px 0px;color:#FFF;}
    .mobile-nav li p:nth-child(1){padding-bottom:3px;font-size:13px;}
    .mobile-nav li p .icons{font-size:20px;}
}