@charset "utf-8";
/* header */
.header{width: 100%; background: #414141;}
.header-con{ width: 1200px; margin: 0 auto;height:100px; overflow: hidden; zoom: 1;}
.header .logo{ width: 220px; height: 50px; float: left; background: url(../images/logo2.png) no-repeat; text-indent: -9999px;margin-top: 25px;}

.header-con .nav{float: left; padding: 10px 0 0 140px; overflow: hidden; zoom: 1;}
.header-con .nav a{display: block;font-size:15px;color: #fff;float: left; height: 80px;margin-right: 20px;width: 70px;}
.header-con .nav a em{display: block; width: 33px; height: 28px; background: url(../images/home-icons.png) no-repeat; margin: 14px auto 8px;}
.header-con .nav a span{display: block; width: 100%; height: 24px; line-height: 24px; font-size: 15px; color: #fff; text-align: center;}
.header-con .nav a:hover{background: #a6a6a6;}
.header-con .nav a.soft em{background-position: -37px 0;}
.header-con .nav a.game em{background-position: -74px 0;}
.header-con .nav a.zt em{background-position: -112px 0;}
.header-con .nav a.rank em{background-position: -149px 0;}

.header-con .nav a.active em{background-position-y: -32px;}
.header-con .nav a.active span{color: #59c301;}

.search-box{width: 360px;height: 33px;float: right;margin-top: 33px;display:none;}
.search-box form{display: block; width: 100%; height: 100%;overflow: hidden;zoom:1;}
.search-box form input{border:none;outline: none;padding: 0;}
.search-box form input:focus{border:none;}
.search-box .search-input{ background: #fff;color: #888;font-family: "microsoft Yahei";width: 307px;height: 33px; border-top-left-radius: 2px; border-bottom-left-radius: 2px; text-indent: 10px; line-height: 33px;float: left;}
.search-box .search-input::-webkit-input-placeholder {color: #888;}
.search-box .search-submit{width: 53px;height: 33px;display: inline-block;background: url(../images/soft_icons.png) no-repeat;text-indent: -9999px; float: left;cursor: pointer;}

/* wrap-box */
.wrap-box{padding: 30px 0; margin: 0 auto; width: 1200px;}

.hot-game{height: 150px; overflow: hidden; zoom: 1; border:1px solid #ff9758; width: 1198px; margin-bottom: 30px;}
.hot-game .tit{float: left; width: 20px; height: 150px; background: #ff9758; text-align: center; line-height: 23px; font-size: 18px;color: #fff; font-weight: bold; position: relative; padding: 0 10px;}
.hot-game .tit em{display: block; width: 18px; height: 19px; background: url(../images/home-icons.png) no-repeat; background-position: 0 -68px; margin: 16px auto 7px;}
.hot-game .tit::after{display: inline-block;content: ' '; width: 0;height: 0; border:10px solid transparent; border-left-color: #ff9758; position: absolute; left: 40px; top: 65px;}

.hot-game ul{width: 1150px; padding-top: 23px; overflow: hidden; zoom: 1;}
.hot-game ul li{width: 80px; float: left; margin-left: 46px; transition: all .3s;}
.hot-game ul li a{display: block; width: 100%;}
.hot-game ul li a span{display: block; width: 80px; height: 80px; border-radius: 12px; overflow: hidden;}
.hot-game ul li a span img{display: block; width: 80px; height: 80px; border-radius: 12px; }
.hot-game ul li a p{height: 35px; font-size: 15px; color: #555; text-align: center; line-height: 35px;overflow: hidden;}
.hot-game ul li:hover{transform: translateY(-5px);}
.hot-game ul li:hover p{color: #59c301;}
.hot-game ul li.li-1{margin-left: 40px;}

/* fir-con */
.fir-l{width: 400px; float: left; margin-right: 30px;}
.fir-slide .gallery-top{width: 100%; height: 240px; margin-bottom: 10px;}
.fir-slide .gallery-top a{display: block; width: 100%; height: 100%; position: relative;}
.fir-slide .gallery-top img{width: 100%; height: 240px;}
.fir-slide .gallery-top a p{width: 374px; padding: 30px 13px 8px; height: 24px; line-height: 24px; font-size: 16px; color: #fff; font-weight: bold; overflow: hidden; position: absolute; left: 0; bottom: 0; background: linear-gradient(to top,rgba(0,0,0,.8),rgba(0,0,0,0));}

.fir-slide .gallery-thumbs{width: 100%; height: 75px; padding-top: 5px;}
.fir-slide .gallery-thumbs img{width: 125px; height: 75px; border:1px solid #fff; box-sizing: border-box;}
.fir-slide .gallery-thumbs .swiper-slide{opacity: 1; position: relative;}
.fir-slide .gallery-thumbs .swiper-slide-thumb-active img{border-color: #ff3b3b;}
.fir-slide .gallery-thumbs .swiper-slide-thumb-active::before{display: inline-block;content: ' '; width: 0; height: 0; border-left:3px solid transparent; border-right: 3px solid transparent; border-bottom: 4px solid #ff3b3b; position: absolute; left: 60px; top: -4px;}

/* fir-tit */
.fir-tit{height: 24px; line-height: 24px; overflow: hidden; zoom: 1;color: #121212;}
.fir-tit em{display: block; width: 4px; height:18px; background: #59c301; float: left;border-radius: 3px; margin:3px 10px 0 0;}
.fir-tit h2{float: left; font-size: 18px; font-weight: normal;}
.fir-tit .more{float: right; color: #999; font-size: 14px;}
.fir-tit .tab{float: right;height: 24px; color: #333; font-size: 16px; line-height: 24px;}
.fir-tit .tab span{cursor: pointer;}
.fir-tit .tab span.active{color: #59c301;}
.fir-tit .tab i{color: #ddd; margin: 0 10px; font-style: normal;}
.fir-tit .more:hover{color: #59c301;}

/* hot-type */
.hot-type{padding-top: 27px;}

.hot-type-list{width: 420px; overflow: hidden; zoom: 1; padding-top: 17px;}
.hot-type-list a{display: block; width:193px; height: 38px; margin: 0 10px 12px 0; float: left;position: relative; border:1px solid #eee;}
.hot-type-list a span{display: block; width: 5px; height: 38px; background: #ff8080;transition: all .3s;}
.hot-type-list a p{display: block; width: 100%; height: 100%; line-height:38px; position: absolute; left: 0; top: 0; text-align: center; font-size: 15px; color: #ff8080;transition: all .3s;}
.hot-type-list a.type2 p{color: #aacc5a;}
.hot-type-list a.type2 span{background: #aacc5a;}

.hot-type-list a.type3 p{color: #ff9758;}
.hot-type-list a.type3 span{background: #ff9758;}

.hot-type-list a.type4 p{color: #69cfff;}
.hot-type-list a.type4 span{background: #69cfff;}

.hot-type-list a.type5 p{color: #5fdddd;}
.hot-type-list a.type5 span{background: #5fdddd;}

.hot-type-list a.type6 p{color: #a98fd7;}
.hot-type-list a.type6 span{background: #a98fd7;}

.hot-type-list a:hover p{color: #fff;}
.hot-type-list a:hover span{width: 100%;}

/* fir-mid */
.fir-mid{width:420px; float: left;}

/* mid-top */
.fir-mid .mid-top{padding-bottom: 15px; border-bottom: 1px solid #e8e8e8; text-align: center;}
.fir-mid .mid-top .zd{color: #ff4f4f;font-size: 18px;text-align: center;font-weight: bold; display: block; height: 28px; line-height: 28px; overflow: hidden; margin-bottom:10px;}
.fir-mid .mid-top .zd:hover{ text-decoration:underline;}
.fir-mid .mid-top p{height:24px;text-align: center; line-height: 24px;}
.fir-mid .mid-top p a{color: #999;font-weight:300;margin:0px 10px;font-family: "Simsun";}
.fir-mid .mid-top p a:hover{color:#59c301;}

/* update-box */
.update-box{width: 420px; overflow: hidden; padding-top: 20px;}
.update-list{width: 200%; overflow: hidden; zoom:1}
.update-list ul{width: 420px; float: left; transition: all .3s;}
.update-list li{height: 24px; overflow: hidden; zoom: 1; margin-top: 18px;}
.update-list li .type{display: block; float: left; width: 68px; height: 22px; line-height: 22px; text-align: center; color: #999; border:1px solid #eee; margin-right: 12px; font-size: 14px; position: relative;}

.update-list li .t{width: 255px; display: block; height: 24px; line-height: 24px; color: #333; overflow: hidden;zoom: 1; float: left; transition: all .3s;}
.update-list li .t img{display: block; float: left; width: 24px; height: 24px; margin-right: 8px;}
.update-list li>span{float: right; color: #999;}
.update-list li .date{color:#ff4f4f;}

.update-list li .type:hover {color: #59c301; border-color: #59c301;}
.update-list li .t:hover{color: #59c301; transform: translateX(3px);}
.update-list ul.up{margin-left: -420px;}

/* fir-r */
.fir-r{width: 280px; float: right; padding: 16px 20px 5px; background: #f9f9f9;}
.fir-intro{width: 100%; padding: 0 0 10px; border-bottom: 1px solid #e2e2e2;}
.fir-intro .fir-tit{margin-bottom: 15px;}
.fir-intro .change-btn{line-height: 24px;height: 24px; font-size: 14px; color: #999;cursor: pointer; float: right;}
.fir-intro .change-btn em{display: inline-block; width: 18px; height: 14px; background: url(../images/home-icons.png) no-repeat; background-position: -30px -67px; transition: all .5s; margin: 0 auto; vertical-align:top; margin: 5px 5px 0 0;}
.fir-intro .change-btn:hover em{transform: rotate(180deg);}

.swiper-container3 .detail{overflow: hidden; zoom: 1; margin-bottom: 12px; height: 80px;}
.swiper-container3 .detail .img{width: 80px; height: 100%; float: left; overflow: hidden; border-radius: 15px; margin-right: 14px;}
.swiper-container3 .detail .img img{width: 100%; height: 100%; border-radius: 15px;}
.swiper-container3 .detail div .t{font-size: 16px; height: 26px; line-height: 26px; color: #333; display: block; overflow: hidden; margin-bottom: 4px;}
.swiper-container3 .detail div span{font-size: 14px; height: 26px; line-height: 26px; color: #999; display: block; overflow: hidden;}

.swiper-container3 .swiper-slide .desc{line-height: 24px; font-size: 14px; color: #999; overflow: hidden; max-height: 72px; position: relative;}
.swiper-container3 .swiper-slide .desc .btn{color: #ff4f4f; position: absolute; right: 0; bottom: 0; line-height: 24px; opacity: 0; filter: alpha(opacity=0); transition: all .3s;}
.swiper-container3 .swiper-slide .desc .btn.on{opacity: 1; filter: alpha(opacity=100);}
/* hg-box */
.hg-box{padding-top: 15px;}
.hg-box .hg-list li{padding: 13px 0;overflow: hidden;zoom: 1;border-bottom: 1px dashed #e2e2e2;height: 60px;}

.hg-box .hg-list li .img{display: block; width: 60px; height: 60px; float: left; border-radius: 9px; overflow: hidden; float: left; margin-right: 14px;}
.hg-box .hg-list li .img img{width: 60px; height: 60px; border-radius: 9px; transition: all .3s;}
.hg-box .hg-list li .mid{width: 150px; float: left;}
.hg-box .hg-list li .mid .t{display: block; height: 30px; line-height: 30px; color: #333; overflow: hidden; font-size: 15px; margin-bottom: 8px;}
.hg-box .hg-list li .mid p{font-size: 12px; color: #999; height: 20px; line-height: 20px; overflow: hidden;}
.hg-box .hg-list li .mid p i{font-style: normal; margin: 0 5px;}

.hg-box .hg-list li .btn{width: 52px;float: right;}
.hg-box .hg-list li .btn span{display: block; height: 30px; line-height: 30px; text-align: center; font-weight: bold; color: #59c301; text-align: center; overflow: hidden;}
.hg-box .hg-list li .btn a{display: block;width: 50px; height: 22px; border-radius: 4px ;color: #59c301; font-size: 13px; text-align: center;transition: all .3s; border:1px solid #59c301;}

.hg-box .hg-list li .mid .t:hover{ color: #59c301;}
.hg-box .hg-list li .btn:hover a{color: #fff; background: #59c301;}
.hg-box .hg-list li .img img:hover{transform: scale(1.1);}
.hg-box .hg-list li:last-child{border-bottom: none;}

/* zt-box */
.home-tit{height: 38px; border-bottom: 2px solid #ececec;}
.home-tit h2{float: left; color: #121212; font-weight: bold;height: 38px; line-height: 38px; border-bottom: 2px solid #59c301; font-size: 18px;}
.home-tit .more{font-size: 14px; color: #999; float: right; line-height: 38px;}
.home-tit .more:hover{color: #59c301;}

.zt-box{padding-top: 10px;}
.zt-box .swiper-container{margin-top: 20px;}
.zt-box .swiper-container .swiper-slide{width: 280px;}
.zt-box .swiper-container .swiper-slide a{ display: block; }
.zt-box .swiper-container .swiper-slide a span{width: 100%; height:150px; display: block;overflow: hidden;}
.zt-box .swiper-container .swiper-slide img{ width: 100%; height:150px; display: block; transition: all .3s;}
.zt-box .swiper-container .swiper-slide p{color:#333;text-align: center;font-size: 16px; height: 24px; line-height: 24px; margin-top: 10px; overflow: hidden;}
.zt-box .swiper-container .swiper-button-prev{ width: 20px; height: 40px; left:0; background:url(../images/home-icons.png) no-repeat; background-position: 0 -95px; top: 55px; margin-top: 0;}
.zt-box .swiper-container .swiper-button-next{ width: 20px; height: 40px; right:0; background:url(../images/home-icons.png) no-repeat; background-position:-24px -95px; top: 55px; margin-top: 0;}
.zt-box .swiper-container .swiper-button-prev::after,.zt-box .swiper-container .swiper-button-next::after{display: none;}
.zt-box .swiper-container .swiper-slide:hover p{ color: #59c301;}
.zt-box .swiper-container .swiper-slide:hover img{transform: scale(1.1);}
/* game-intro */
.game-intro{padding-top: 15px;}
.game-intro ul{padding-top: 20px; width: 1250px; overflow: hidden; zoom: 1;}
.game-intro ul li{float: left; width: 88px; float: left; margin: 0 36px 15px 0; transition: all .3s;}
.game-intro ul li a{display: block; width: 100%;}
.game-intro ul li span{width: 88px; height: 88px; display: block; border-radius: 15px; overflow: hidden;}
.game-intro ul li img{width: 88px; height: 88px; display: block; border-radius: 15px;}
.game-intro ul li p{display: block; height: 24px; font-size: 16px; line-height: 24px; overflow: hidden;text-align: center; margin-top: 10px;transition: all .3s;}
.game-intro ul li:hover p{color: #59c301;}
.game-intro ul li:hover{transform: translateY(-5px);}
/* latest-box */
.latest-box{overflow: hidden; zoom: 1;}
.latest-box .left-box{float: left; width: 586px;}
.latest-box .right-box{float: right; width: 586px;}
.latest-box .bot-list{padding-top: 10px; overflow: hidden; zoom: 1;}
.latest-box .bot-list a{float: left; margin-right: 25px; font-size: 15px; color: #333; display: block; height: 36px; line-height: 36px;transition: all .3s;}
.latest-box .bot-list a:nth-child(1),.latest-box .bot-list a:nth-child(6),.latest-box .bot-list a:nth-child(9),.latest-box .bot-list a:nth-child(11),.latest-box .bot-list a:nth-child(13),.latest-box .bot-list a:nth-child(17){color: #59c301;}
.latest-box .bot-list a:hover{color: #59c301;transform: translateX(3px);}

/* soft-intro */
.soft-intro{padding-top: 10px;}
.soft-intro ul{padding-top: 20px; width: 1250px; overflow: hidden; zoom: 1;}
.soft-intro ul li{float: left; width: 88px; float: left; margin: 0 36px 15px 0;transition: all .3s;}
.soft-intro ul li a{display: block; width: 100%;}
.soft-intro ul li span{width: 88px; height: 88px; display: block; border-radius: 15px; overflow: hidden;}
.soft-intro ul li img{width: 88px; height: 88px; display: block; border-radius: 15px;}
.soft-intro ul li p{display: block; height: 24px; font-size: 16px; line-height: 24px; overflow: hidden;text-align: center; margin-top: 10px;transition: all .3s;}
.soft-intro ul li:hover p{color: #59c301;}
.soft-intro ul li:hover{transform: translateY(-5px);}
/* rank-box */
.rank-box{overflow: hidden;}
.rank-box .rank-item{padding: 15px 20px 0; overflow: hidden; zoom: 1;}
.rank-item .item{width: 340px; float: left;}
.rank-item .item1{margin-right: 70px;}

.rank-item .item h3{height: 28px; line-height: 28px; overflow: hidden; zoom: 1; font-size: 18px; color: #333;}
.rank-item .item h3 em{display: block; width: 13px; height: 18px; float: left; margin: 6px 7px 0 0; background: url(../images/home-icons.png) no-repeat; background-position: -60px -95px;}
.rank-item .item ul li{padding: 15px 0; border-bottom:1px dashed #e8e8e8; padding-left: 28px;position: relative;}

.rank-item .item ul li .num{float:left;display:block;width:18px; height:18px;font-size:12px; text-align:center; background:#c8c8c8; color:#fff;line-height: 18px; text-align: center; border-radius: 2px;transition: all .3s; position: absolute; left: 0; top: 15px;}
.rank-item .item ul li.open .num{height: 34px; line-height: 34px; top: 30px;}
.rank-item .item ul li.open .r-a{display:none;}
.rank-item .item ul li.open .r-b{display:block;}

.rank-item .item ul li.top-1 .num {background: #ff3b3b;}
.rank-item .item ul li.top-2 .num {background: #ff6b6b;}
.rank-item .item ul li.top-3 .num {background: #ff9393;}

.r-a{overflow:hidden;zoom: 1; height: 18px; line-height: 18px;}
.r-a a{display: block;float:left;line-height:18px;height:18px; font-size: 15px; color: #333;width: 240px; overflow: hidden;}
.r-a span{float: right; font-size: 12px; color: #999;}

.r-b{height:88px; display: none; overflow:hidden;zoom:1;}
.r-b .img{display: block; width: 88px; height: 88px; border-radius: 15px; float: left; overflow: hidden; margin-right: 15px;}
.r-b .img img{width: 100%; height: 100%; border-radius: 15px;}

.r-b .infor .tit{display: block; font-size: 16px; height: 26px; line-height: 26px; overflow: hidden;}
.r-b .infor .type{font-size: 12px; height: 20px; line-height: 20px; color: #999; margin: 3px 0 7px; overflow: hidden;}
.r-b .infor .type i{margin: 0 7px; color: #ddd; font-style: normal;}
.r-b .infor .type em{display: inline-block; width: 9px; height: 11px; vertical-align: top; margin: 4px 5px 0 0; background: url(../images/home-icons.png) no-repeat; background-position: -149px -95px;}
.r-b .infor .btn{ width:106px; height:28px; line-height: 28px; text-align: center; color: #fff; display: inline-block; border-radius: 2px; background: #ff6b6b;}

/* item2 */
.rank-item .item2{margin-right: 70px;}
.rank-item .item2 h3 em{background-position-x: -90px; width: 12px;}
.rank-item .item2 .r-b .infor .btn{background: #6ad671;}
.rank-item .item2 ul li.top-1 .num {background: #38d27d;}
.rank-item .item2 ul li.top-2 .num {background: #6ad671;}
.rank-item .item2 ul li.top-3 .num {background: #8ee994;}

/* item3 */
.rank-item .item3 h3 em{background-position-x: -116px; width: 18px;}
.rank-item .item3 .r-b .infor .btn{background: #59bcfa;}
.rank-item .item3 ul li.top-1 .num {background: #409aff;}
.rank-item .item3 ul li.top-2 .num {background: #59bcfa;}
.rank-item .item3 ul li.top-3 .num {background: #82d3f4;}

.footer{margin-top: 0;}

/* link-box */
.link-box{padding-top: 15px;}
.link-box ul{width: 1240px;margin-top:20px;}
.link-box ul li{float:left;width: 120px;margin-right: 35px;margin-bottom: 10px;padding-left: 10px;height: 19px;}
.link-box ul li a{color:#666666;font-size:14px;display: block;width: 100%;height: 100%;overflow: hidden;}
.link-box ul li a:hover{color: #59c301;}

/*homepage*/
.arp_title{ width: 100%; height: 44px; background: #262626; }
.arp_title h1{ width: 1100px; line-height: 44px; height: 100%; font-size: 12px; color: #fff;margin: 0 auto; }
.d_content{ width: 1100px;margin: 0 auto; font-size: 20px; color: #666; }
.d_content .con{ margin-bottom: 55px; width: 100%; overflow: hidden;zoom:1;}
.d_content .con>div{ width: 632px; padding-top: 40px; float: right; }
.d_content .con>div p{ line-height: 36px;  }
.d_content .con img{ width:440px; height: 280px; float: left;}
.d_slide{ width: 1100px; height: 490px; margin: 0 auto 48px; position: relative;z-index: 0;}
.d_slide .mySwiper {width: 1100px; height: 490px;}
.d_slide .swiper-slide { width: 100%; height: 490px;position: relative;}
.d_slide .swiper-slide .tit{position: absolute; width: 100%; height: 50px; background: rgba(0,0,0,0.5); font-size: 20px; line-height: 50px; text-indent: 20px; color: #fff; bottom: 0; left: 0;}
.nfooter{ width: 100%; padding: 50px 0 60px; background:#262626; }
.nfooter{ text-align: center;font-size: 20px; color: #fff; line-height: 36px; }
.nfooter a{ font-size: 20px; color: #fff; line-height: 36px; }

.allin{width:1200px;margin:0 auto; overflow:hidden;zoom:1;}
.allin .fir-con{width: 420px; float: left;}
.allin .rank-box{width: 400px; float: right;}

.allin .soft-intro{width: 100%; float: left;}

/*hide*/
/*
.banner_con .nav a:nth-child(n+3){display: none;}
.hot-game,.fir-l,.fir-mid .mid-top,.fir-tit .tab{display: none;}
.update-list ul:first-child,.fir-r,.zt-box,.game-intro,.latest-box,.rank-item .item1,.rank-item .item2{display: none;}
.wrap-box{position: relative;}
.rank-box{width: 360px; position: absolute;right: 0;top: 40px;}
.soft-intro{padding-top:200px;}
*/