@charset "utf-8"; 
*{margin:0;padding:0}
.icon{background:url(../images/index_icon.png) no-repeat;background-size:600px 600px}
.crumb{width:1200px;margin:0 auto;height:46px;line-height:46px}
.crumb,.crumb a{font-size:12px;color:#aaa}
.crumb a:hover{color:#01cf78}
.crumb i{display:inline-block;width:18px;height:14px;background-position:-361px 0;margin-right:10px;position:relative;top:1px}

.main{width:1200px;margin:0 auto;overflow:hidden}
.main .main_left {
    width: 900px;
    padding: 10px 30px;
    box-sizing: border-box;
    border: 1px solid #e3e3e3;
    float: left
}

.main_left .sort_links {
    overflow: hidden;
    width: 100%;
    margin-top: 20px
}

.main_left .sort_links a {
    float: left;
    display: block;
    width: 140px;
    height: 38px;
    background: #f3f3f3;
    border-radius: 4px;
    line-height: 38px;
    text-align: center;
    font-size: 14px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color: #333333;
    margin-bottom: 10px;
    margin-right: 10px
}

.main_left .sort_links a:nth-child(6n) {
    margin-right: 0px
}

.main_left .sort_links a.active {
    color: #ffffff;
    background: #fa612f
}

.game_list {
    padding-bottom: 50px
}

.game_list .item {
    width: 100%;
    height: 150px;
    display: flex;
    align-items: center;
    border-bottom: 1px dashed #ececec
}

.game_list .item:hover {
    background-color: #fafafa
}

.game_list .item .left {
    width: 620px;
    float: left;
    overflow: hidden;
    margin-right: 10px
}

.game_list .item .left .photo {
    width: 90px;
    height: 90px;
    margin-right: 20px;
    float: left
}

.game_list .item .left .photo img {
    width: 100%;
    height: 100%;
    border-radius: 20px
}

.game_list .item .left .msg {
    width: 510px;
    float: left
}

.game_list .item .left .msg h4 {
    color: #323232;
    font-size: 18px;
    margin-bottom: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.game_list .item:hover .left .msg h4 {
    color: #fa612f
}

.game_list .item .left .msg .tip {
    color: #999;
    font-size: 12px
}

.game_list .item .left .msg .tip i {
    color: #323232
}

.game_list .item .right {
    float: right;
    display: flex;
    align-items: center
}

.game_list .item .right .score {
    width: 75px;
    height: 100%;
    color: #999;
    font-size: 12px;
    float: left;
    margin-right: 10px
}

.game_list .item .right .score:after {
    content: "";
    width: 75px;
    height: 12px;
    display: block;
    background: url(//js.18183.com/hongpigdl/index/2018/img/score-star.png) 0 0
}

.game_list .item .right .score.star-0:after {
    background: url(//js.18183.com/hongpigdl/index/2018/img/score-star.png) 0 -120px
}

.game_list .item .right .score.star-1:after {
    background: url(//js.18183.com/hongpigdl/index/2018/img/score-star.png) 0 -96px
}

.game_list .item .right .score.star-2:after {
    background: url(//js.18183.com/hongpigdl/index/2018/img/score-star.png) 0 -72px
}

.game_list .item .right .score.star-3:after {
    background: url(//js.18183.com/hongpigdl/index/2018/img/score-star.png) 0 -48px
}

.game_list .item .right .score.star-4:after {
    background: url(//js.18183.com/hongpigdl/index/2018/img/score-star.png) 0 -24px
}

.game_list .item .right .score.star-5:after {
    background: url(//js.18183.com/hongpigdl/index/2018/img/score-star.png) 0 0
}

.game_list .item .right .qrcode_btn {
    width: 100px;
    height: 40px;
    color: #fa612f;
    line-height: 40px;
    text-align: center;
    background-color: #f5f2f2;
    float: left;
    position: relative
}

.game_list .item .right .qrcode_btn:hover {
    color: #fff;
    background-color: #fa612f
}

.game_list .item .right .qrcode_btn .code {
    width: 100px;
    height: 100px;
    padding: 10px;
    box-sizing: border-box;
    border: 1px solid #fa612f;
    position: absolute;
    z-index: 1
}

.game_list .item .right .qrcode_btn .code img {
    width: 100%;
    height: 100%
}

.new_list .item {
    width: 100%;
    height: 150px;
    display: flex;
    align-items: center;
    border-bottom: 1px dashed #ececec
}

.new_list .item .msg {
    width: 685px;
    margin-right: 60px
}

.new_list .item .msg .name {
    width: 100%;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    margin-bottom: 20px
}

.new_list .item .msg .name h4 {
    width: 530px;
    color: #323232;
    font-size: 22px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    float: left
}

.new_list .item:hover .msg .name h4 {
    color: #fa612f
}

.new_list .item .msg .name span {
    color: #323232;
    font-size: 14px;
    float: right
}

.new_list .item .msg p {
    color: #999;
    font-size: 12px;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    white-space: normal!important;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical
}

.new_list .item .qrcode_btn {
    width: 100px;
    height: 40px;
    color: #fa612f;
    line-height: 40px;
    text-align: center;
    background-color: #f5f2f2;
    float: left;
    position: relative
}

.new_list .item .qrcode_btn:hover {
    color: #fff;
    background-color: #fa612f
}

.new_list .item .qrcode_btn .code {
    width: 100px;
    height: 100px;
    padding: 10px;
    box-sizing: border-box;
    border: 1px solid #fa612f;
    position: absolute;
    z-index: 1
}

.new_list .item .qrcode_btn .code img {
    width: 100%;
    height: 100%
}

.la-pages {
    margin: 55px 0
}

.la-pages ul {
    width: 100%;
    height: 35px;
    font-size: 0;
    text-align: center
}

.la-pages li {
    display: inline-block;
    *display: inline;
    *zoom:1;margin: 0 3px;
    padding: 0 12px;
    height: 33px;
    font-size: 14px;
    color: #767676;
    line-height: 33px;
    text-align: center;
    border: 1px solid #d3d3d3
}

.la-pages li a {
    color: #767676
}

.la-pages li a:hover {
    text-decoration: underline
}

.la-pages li.active {
    color: #fff;
    border-color: #fa612f;
    background: #fa612f
}

.main .main_right {
    width: 270px;
    border: 1px solid #e3e3e3;
    float: right;
    padding: 0 15px;
    box-sizing: border-box
}
/*分类导航*/
.sort_nav .list{margin-top:15px;margin-right:-4px;box-sizing:border-box}
.sort_nav .list .item{width:74px;height:34px;line-height:34px;text-align:center;color:#666;font-size:14px;background-color:#f7f7f7;display:inline-block;margin-right:4px;margin-bottom:8px}
.sort_nav .list .item:hover{color:#fa612f}

/*热门游戏*/
.hot_box .list{overflow:hidden;margin-top:15px;margin-right:-20px}
.hot_box .list .item{width:66px;margin-right:20px;margin-bottom:15px;float:left}
.hot_box .list .item:nth-child(10n){margin-right:0}
.hot_box .list .item .photo{width:66px;height:66px;margin-bottom:10px}
.hot_box .list .item .photo img{width:100%;height:100%;border-radius:20px}
.hot_box .list .item span{width:100%;color:#333;font-size:14px;display:block;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.hot_box .list .item:hover span{color:#fa612f}
