/* CSS Document
use for:www.18183.com
version:1.0
Data:20180717
Author: mzq
*/

* {
    box-sizing: border-box;
}

body {
    background-color: #291778;
    overflow-y: auto;
    overflow-x: hidden;
}

.w {
    width: 1000px;
    margin: 0 auto;
    position: relative;
    left: 0;
    top: 0;
}

.pa {
    position: absolute;
    left: 50%;
    top: 50%;
}
a{
    color: inherit;
}

/* 头部 */

.header {
    height: 996px;
    background: url('../images/bg1.jpg') center top no-repeat;

}

.header .w {
    height: 100%;
}
.header .logo{
    width: 282px;
    height: 112px;
    background: url(https://image.51bph.com/images/you-logo.png) 0 0 no-repeat;
    margin-left: -25px;
}
.header .info {
    margin-top: 280px;
    margin-left: -360px;
    width: 750px;
    height: 90px;
    display: none;

}

.header .info div {
    width: 279px;
    height: 90px;
    font-size: 18px;
    color: #fff;
    line-height: 120px;
    text-align: center;
    float: left;
}

.header .info .addr {
    background: url(../images/spirit.png) -2px -500px no-repeat;
}

.header .info .time {
    margin-left: 191px;
    background: url(../images/spirit.png) -283px -500px no-repeat;
}

.header .nav {
    width: 1020px;
    background-color: #fff;
    border-radius: 40px;
    margin-top: 457px;
    margin-left: -505px;
    border: 3px solid #07319b;
    box-sizing: border-box;
}

.header .nav .guide-nav {
    width: 1000px;
    height: 60px;
    margin: 10px auto;
    background-color: #ffdb45;
    border: 2px solid #4b3d84;
    border-radius: 30px;
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;
}

.header .nav .guide-nav .nav-li {
    display: inline-block;
    width: 174px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    line-height: 56px;
    color: #fff;
    position: relative;
    left: 0;
    top: 0;
}

.header .nav .guide-nav .nav-li.active {

}
.header .nav .guide-nav .nav-li.active .btn {
    color: #fff;
}
.header .nav .guide-nav .nav-li .btn {
    color: #4b3d84;

}

.header .nav .guide-nav .nav-li.active .btn {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -30px 0 0 -87px;
    width: 174px;
    height: 60px;
    border-radius: 30px;
    background-color: #f73c3c;
    border: 2px solid #07319b;
}

/* 主体 */

/* 第一节 */

.section1 {
    height: 530px;
    margin-top: 30px;
}

/*左边轮播图*/
.section1 .news-one {
    width: 1000px;
    height: 430px;
    border-radius: 20px;
    background-color: #34289a;
    margin-left: -500px;
    margin-top: 40px;
    z-index: 10;
    border: 3px solid #64569b;
    box-sizing: border-box;
}

.section1 .news-one .left-slide {
    margin-top: 34px;
    margin-left: 33px;
    float: left;
}

.section1 .news-one .left-slide .slideBox {
    position: relative;
    left: 0;
    top: 0;
    width: 500px;
    height: 360px;
}

.section1 .news-one .left-slide .slideBox .hd {
    position: absolute;
    width: 80px;
    height: 22px;
    left: 50%;
    bottom: 0;
    margin-left: -40px;
    background-color: rgba(52, 40, 147, 0.9);
    z-index: 1;
}

.section1 .news-one .left-slide .slideBox .hd ul {
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;
    justify-content: space-around;
    -webkit-justify-content: space-around;
    align-items: center;
    -webkit-align-items: center;
    width: 100%;
    height: 22px;
    position: relative;
}

.section1 .news-one .left-slide .slideBox .hd ul:before {
    content: '';
    width: 30px;
    height: 22px;
    position: absolute;
    left: -30px;
    top: 0;
    background: url(../images/spirit.png) -457px -449px no-repeat;
}

.section1 .news-one .left-slide .slideBox .hd ul:after {
    content: '';
    width: 30px;
    height: 22px;
    position: absolute;
    right: -30px;
    top: 0;
    background: url(../images/spirit.png) -489px -449px no-repeat;

}

.section1 .news-one .left-slide .slideBox .hd .dot {
    width: 12px;
    height: 8px;
    border-radius: 4px;
    transition: all 0.3s ease;
    background-color: #fff;
    cursor: pointer;

}

.section1 .news-one .left-slide .slideBox .hd .dot.on {
    width: 20px;
    background-color: #fffa78;
}

.section1 .news-one .left-slide .slideBox .img-li {
    float: left;
    width: 500px;
    height: 360px;
}

.section1 .news-one .left-slide .slideBox .prev {
    width: 108px;
    height: 138px;
    cursor: pointer;
    position: absolute;
    left: -16px;
    top: 110px;
    background: url(../images/spirit.png) -574px -821px no-repeat;
}

.section1 .news-one .left-slide .slideBox .prev:hover {
    background: url(../images/spirit.png) -464px -821px no-repeat;

}

.section1 .news-one .left-slide .slideBox .next {
    width: 108px;
    height: 138px;
    cursor: pointer;
    position: absolute;
    right: -16px;
    top: 110px;
    background: url(../images/spirit.png) -587px -685px no-repeat;
}

.section1 .news-one .left-slide .slideBox .next:hover {
    background: url(../images/spirit.png) -478px -685px no-repeat;

}

.section1 .news-one .right-content {
    float: right;
    margin: 34px 32px 0 0;
    width: 412px;
}

.section1 .news-one .right-content .detail-one .detail-o-title {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 412px;
    color: #fffa78;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 30px;
}

.section1 .news-one .right-content .detail-one .detail-o-b {
    color: #d2d2ff;
    font-size: 14px;
    line-height: 20px;
    margin-top: 6px;
    text-align: center;
}
.section1 .news-one .right-content .detail-one:hover .detail-o-b {
    color: #fff;

}
.section1 .news-one .right-content .detail-one .detail-o-time {
    font-size: 14px;
    color: #d2d2ff;
    line-height: 30px;
}

.line {
    height: 8px;
    width: 100%;
    background: url('../images/line.png') 0 0 repeat-x;
    margin: 8px 0;
}

.news-ul {
    width: 100%;

}

.news-ul .news-li {
    width: 100%;
    line-height: 30px;
    position: relative;
    left: 0;
    top: 0;
}

.news-ul .news-li:before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #fff;
    position: absolute;
    left: 2px;
    top: 10px;
}
.news-ul .news-li a{
    display: inline-block;
    width: 100%;
}
.news-ul .news-li .li-title {
    color: #fff;
    font-size: 16px;
    margin-left: 18px;
    width: 324px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    white-space: nowrap;
    float: left;
}
.news-ul .news-li .li-title{

}
.news-ul .news-li .li-time {
    color: #babbfe;
    font-size: 14px;
    float: right;
}
.news-ul .news-li:hover .li-title, .news-ul .news-li:hover .li-time{
    color: #fffa78;
}
.news-ul .news-li:hover:before{
    background-color: #fffa78;

}
.layer{
    left: auto !important;
    top: auto !important;
}
.section1 .dec1 {
    position: absolute;
    right: -176px;
    top: 0;
    width: 377px;
    height: 131px;
    background: url('../images/spirit.png') -594px -2px no-repeat;
}

.section1 .dec2 {
    position: absolute !important;
    left: -176px !important;
    top: 420px !important;
    width: 377px;
    height: 131px;
    background: url('../images/spirit.png') -594px -2px no-repeat;
}
.section1 .dec3 {
    position: absolute !important;
    left: -476px !important;
    top: 100px !important;
    width: 250px;
    height: 227px;
    background: url('../images/spirit.png') -2px -592px no-repeat;
}
.section1 .dec4 {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: #34289a;
    position: absolute !important;
    right: -276px !important;
    top: 230px !important;
}
.section1 .dec5 {
    width: 31px ;
    height: 37px;
    position: absolute !important;
    right: -376px !important;
    top: 400px !important;
    background: url('../images/spirit.png') -388px -449px no-repeat;

}
/* 第二节 */

.section2 {
    /* height: 645px; */
}

.sec-title {
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;
    align-items: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    margin: 0 auto;
    justify-content: center;
    -webkit-justify-content: center;
    -moz-justify-centent: center
}

.sec-title span {
    display: inline-block;
    height: 48px;

}

.sec-title span:nth-child(1) {
    width: 83px;
    background: url('../images/spirit.png') -864px -374px no-repeat;
}

.sec-title span:nth-child(2) {
    font-size: 45px;
    font-weight: bold;
    color: #fff;
    line-height: 48px;
    margin: 0 16px;
}

.sec-title span:nth-child(3) {
    width: 29px;
    background: url('../images/spirit.png') -307px -449px no-repeat;

}

.section2 .type-flag {
    text-align: center;
    margin-top: 30px;
}

.section2 .type-flag div {
    width: 130px;
    height: 42px;
    display: inline-block;
    text-align: center;
    font-size: 17px;
    color: #fff;
    font-weight: bold;
    position: relative;
    left: 0;
    top: 0;
    z-index: 1;
    cursor: pointer;

}

.section2 .type-flag .sy .bg {
    position: absolute;
    width: 130px;
    height: 42px;
    border-radius: 21px;
    background: #34289a;
    left: 0;
    top: 0;
}

.section2 .type-flag .sy .txt {
    position: absolute;
    width: 126px;
    height: 38px;
    line-height: 38px;
    left: 2px;
    top: 2px;
    border-radius: 19px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.section2 .type-flag .sy.active .bg {
    background-color: #ffdb45;
}
.section2 .type-flag .sy.active .txt {
    background-color: #ffdb45;
    color: #07319b;
}

.section2 .type-flag .dy {
    line-height: 38px;
    position: relative;
    left: 0;
    top: 0;
    margin-left: 26px;
}

.section2 .type-flag .dy .txt {
    position: absolute;
    width: 126px;
    height: 38px;
    line-height: 38px;
    left: 0;
    top: 0;
    border-radius: 19px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.section2 .type-flag .dy.active .txt {
    background-color: #ffdb45;
    color: #07319b;
}

.section2 .type-flag .dy .bg {
    position: absolute;
    width: 178px;
    height: 63px;
    background: url('../images/spirit.png') -594px -428px no-repeat;
    left: 50%;
    top: 0;
    margin-top: -18.5px;
    margin-left: -80px;
}
/* 新游报道*/
.section2 .sec-content {
    width: 1000px;
    height: 600px;
    background-color: #34289a;
    border-radius: 20px;
    margin-top: 20px;
    position: relative;
    left: 0;
    top: 0;
    z-index: 10;
    border: 3px solid #64569b;
    box-sizing: border-box;
}

.section2 .sec-content .left-part {
    width: 381px;
    float: left;
    margin: 31px 0 0 32px;
}
.section2 .sec-content .left-part .left-banner .img-box{
    width: 380px;
    height: 280px;
    overflow: hidden;
}
.section2 .sec-content .left-part .left-banner img {
    width: 380px;
    height: 280px;
    -webkit-transition: all 3s ease;
    -moz-transition: all 3s ease;
    -ms-transition: all 3s ease;
    -o-transition: all 3s ease;
    transition: all 3s ease;
}
.section2 .sec-content .left-part .left-banner:hover img {
    -webkit-transform: scale(1.2) translateY(-10px);
    -moz-transform: scale(1.2)  translateY(-10px);
    -ms-transform: scale(1.2)  translateY(-10px);
    -o-transform: scale(1.2)  translateY(-10px);
    transform: scale(1.2)  translateY(-10px);
}
.section2 .sec-content .left-part .left-banner .banner-title {
    font-size: 18px;
    line-height: 30px;
    color: #fffa78;
    text-align: center;
    margin: 10px 0;
    font-weight: bold;
}

.section2 .sec-content .right-part {
    width: 520px;
    height: 540px;
    float: right;
    margin-top: 31px;
    margin-right: 32px;
}

.section2 .sec-content .right-part .img-ul {

}

.section2 .sec-content .right-part .img-ul .img-li {
    float: left;
    width: 170px;
    height: 265px;
    margin-right: 5px;
    overflow: hidden;
    margin-bottom: 5px;
    position: relative;
    left: 0;
    top: 0;
    cursor: pointer;
}

.section2 .sec-content .right-part .img-ul .img-li:nth-child(3n) {
    margin-right: 0;
}

.section2 .sec-content .right-part .img-ul .img-li .img-t {
    width: 100%;
    height: 53px;
    background: url(../images/title.png) 0 0 repeat-x;
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 16px;
    color: #fff;
    line-height: 77px;
    text-align: center;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    opacity: 1;
}
.section2 .sec-content .right-part .img-ul .img-li:hover .img-t{
    opacity: 0;
}
.section2 .sec-content .right-part .img-ul .img-li .img-mask {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: -265px;
    z-index: 10;
    background: rgba(24, 12, 76, 0.8);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    opacity: 0;
}

.section2 .sec-content .right-part .img-ul .img-li:hover .img-mask {
    top: 0;
    opacity: 1;
}

.section2 .sec-content .right-part .img-ul .img-li .img-mask .mask-t {
    color: #fff;
    font-size: 16px;
    line-height: 30px;
    text-align: center;
    margin-top: 100px;
    font-weight: bold;
}

.section2 .sec-content .right-part .img-ul .img-li .img-mask .mask-d {
    color: #fff;
    font-size: 12px;
    line-height: 20px;
    text-align: center;
    width: 140px;
    margin: 0 auto;
}
.section2 .sec-content .news-ul .news-li .li-title{
    width: 310px;
}
/*产业新闻 电竞资讯*/
.section2 .bot-part{
    height: 400px;
    margin-top: 41px;
    position: relative;
    left: 0;
    top: 0;
    z-index: 10;
}
.section2 .bot-part .bot-left-part {
    margin-right: 20px;
}
.section2 .bot-part .bot-p{
    width: 490px;
    height: 400px;
    background: #34289a;
    border-radius: 20px;
    padding: 24px 19px 0 23px;
    float: left;
    border: 3px solid #64569b;
    box-sizing: border-box;
}
.section2 .bot-part .bot-p .p-title{
    font-size: 30px;
    font-weight: bold;
    color: #fff;
    position: relative;
    left: 0;
    top: 0;
    line-height: 30px;
    padding-left: 47px;
}
.section2 .bot-part .bot-p .p-title:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 34px;
    height: 29px;
    background: url(../images/spirit.png) -421px -449px no-repeat;
}
.section2 .bot-part .bot-p .bot-banner{
    margin-top: 15px;
    height: 130px;

}
.section2 .bot-part .bot-p .bot-banner .img-box{
    width: 200px;
    height: 130px;
    overflow: hidden;
    float: left;
    margin-right: 13px;

}
.section2 .bot-part .bot-p .bot-banner img{
    width: 200px;
    height: 130px;
    -webkit-transition: all 3s ease;
    -moz-transition: all 3s ease;
    -ms-transition: all 3s ease;
    -o-transition: all 3s ease;
    transition: all 3s ease;
}

.section2 .bot-part .bot-p .bot-banner:hover img {
    -webkit-transform: scale(1.2) translateY(-10px);
    -moz-transform: scale(1.2)  translateY(-10px);
    -ms-transform: scale(1.2)  translateY(-10px);
    -o-transform: scale(1.2)  translateY(-10px);
    transform: scale(1.2)  translateY(-10px);
}
.section2 .bot-part .bot-p .bot-banner .bot-banner-t{
    float: left;
    font-size: 18px;
    color: #fffa78;
    line-height: 22px;
    font-weight: bold;
    width: 229px;
}
.section2 .bot-part .bot-p .bot-banner .bot-banner-des{
    color: #d2d2ff;
    font-size: 14px;
    line-height: 20px;
    margin-top: 8px;
    float: left;
    width: 229px;
    height: 80px;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}
.section2 .bot-part .bot-p .bot-banner:hover .bot-banner-des {
    color: #fff;

}
.section2 .bot-part .bot-p .line{
    margin-top: 20px;
}
.section .ring{
    border-radius: 50%;
    background-color: #34289a;
    position: absolute !important;

}
.section2 .dec1{
    position: absolute !important;
    width: 143px;
    height: 91px;
    left: -70px !important;
    top: 102px !important;
    background: url('../images/spirit.png') -254px -592px no-repeat;
}
.section2 .dec2{
    position: absolute !important;
    right: -268px !important;
    top: 667px !important;
    width: 377px;
    height: 131px;
    background: url('../images/spirit.png') -594px -2px no-repeat;
}
.section2 .dec3 {
    position: absolute !important;
    right: -398px !important;
    top: 37px !important;
    width: 268px;
    height: 291px;
    background: url('../images/spirit.png') -594px -135px no-repeat;
}
.section2 .dec4 {
    position: absolute !important;
    right: 183px !important;
    top: 35px !important;
    width: 54px;
    height: 24px;
    background: url('../images/spirit.png') -890px -428px no-repeat;
}
.section2 .dec5 {
    position: absolute !important;
    left: -200px !important;
    top: 170px !important;
    width: 55px;
    height: 48px;
    background: url('../images/spirit.png') -833px -428px no-repeat;
}
.section2 .dec6 {
    position: absolute !important;
    left: -400px !important;
    top: 740px !important;
    width: 325px;
    height: 445px;
    background: url('../images/spirit.png') -267px -2px no-repeat;
}
.section2 .dec7 {
    position: absolute !important;
    right: -322px !important;
    top: 780px !important;
    width: 91px;
    height: 74px;
    background: url('../images/spirit.png') -864px -298px no-repeat;
}
.section2 .r1 {
    width: 40px;
    height: 40px;
    left: 50px !important;
    top: 50px !important;
}
.section2 .r2 {
    width: 24px;
    height: 24px;
    right: -30px !important;
    top: 110px !important;
}

.section2 .r3 {
    width: 40px;
    height: 40px;
    left: -200px !important;
    top: 590px !important;
}
.section2 .r4 {
    width: 24px;
    height: 24px;
    left: -330px !important;
    top: 310px !important;
}
.section2 .r5 {
    width: 29px;
    height: 29px;
    right: -130px !important;
    top: 510px !important;
}
.section2 .r6 {
    width: 24px;
    height: 24px;
    left: -100px !important;
    top: 910px !important;
}
.section2 .r7 {
    width: 24px;
    height: 24px;
    left: -130px !important;
    top: 1180px !important;
}
.section2 .r8 {
    width: 24px;
    height: 24px;
    right: -100px !important;
    top: 1200px !important;
}
.section2 .r9 {
    width: 19px;
    height: 19px;
    right: -245px !important;
    top: 900px !important;
}
.section2 .r10 {
    width: 40px;
    height: 40px;
    right: 130px !important;
    top: 1250px !important;
}
/* 第三节 */
/*CJ明星展*/
.section3 {
}

.section3 .sec-title{
    margin-top: 52px;
}
.section3 .slide-star{
    margin-top: 35px;
    width: 2000px;
    position: relative;
    left: 50%;
    top: 0;
    margin-left: -1000px;
    overflow: hidden;
    z-index: 10;
}
.section3 .slide-star:before, .section3 .slide-star:after {
    content: '';
    width: 493px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(24, 12, 76, 0.8);
    z-index: 10;
}
.section3 .slide-star:after {
    left: auto;
    right: -12px;
}
.section3 .slide-star .slide-wrap{
    position: relative;
    left: -506px;
    top: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.section3 .slide-star .slide-wrap .star-ul{
    width: 493px;
    float: left;
    margin-right: 13px;
}
.section3 .slide-star .slide-wrap .star-ul:first-child {
    margin-left: 506px;
}
.section3 .slide-star .slide-wrap .star-ul:last-child {
    margin-right: 506px;
}
.section3 .slide-star .slide-wrap .star-ul .star-li{
    float: left;
    cursor: pointer;
    overflow: hidden;
}

.section3 .slide-star .slide-wrap .star-ul .star-li .img-box{
    width: 100%;
    height: 100%;
    position: relative;
    left: 0;
    top: 0;
}
.section3 .slide-star .slide-wrap .star-ul .star-li .img-box img{
    display: block;
}
.section3 .slide-star .slide-wrap .star-ul .star-li:nth-child(1){
    margin-right: 13px;
    width: 240px;

}
.section3 .slide-star .slide-wrap .star-ul .star-li:nth-child(1) .img-box img{
    width: 240px;
    height: 390px;
    margin: 0;
}
.section3 .slide-star .slide-wrap .star-ul .star-li:nth-child(2){
    margin-bottom: 10px;
    width: 240px;

}
.section3 .slide-star .slide-wrap .star-ul .star-li:nth-child(2) .img-box img{
    width: 240px;
    height: 190px;
}
.section3 .slide-star .slide-wrap .star-ul .star-li:nth-child(3) .img-box img{
    width: 240px;
    height: 190px;
}
.section3 .slide-star .slide-wrap .star-ul .star-li:hover .img-box .img-mask{
    top: 0;

}
.section3 .slide-star .slide-wrap .star-ul .star-li .img-box .img-mask{
    position: absolute;
    left: 0;
    top: -100%;
    width: 100%;
    height: 100%;
    text-align: center;
    background: rgba(24, 12, 76, 0.8);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.section3 .slide-star .slide-wrap .star-ul .star-li .img-box .img-mask .i{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.section3 .slide-star .slide-wrap .star-ul .star-li .img-box .img-mask .name{
    font-size: 16px;
    color: #fff;
    line-height: 40px;
    font-weight: bold;
    margin-bottom: 30px;
    border-bottom: 1px solid #3c3265;
}
.section3 .slide-star .slide-wrap .star-ul .star-li:nth-child(1) .img-box .i {
    top: 40%;
}
.section3 .slide-star .slide-wrap .star-ul .star-li .img-box .img-mask .desc{
    font-size: 12px;
    color: #fff;
    line-height: 20px;
    opacity: 0.9;
    width: 160px;
    margin: 0 auto;
}
.section3 .slide-star .prev , .section3 .slide-star .next{
    width: 112px;
    height: 138px;
    background: url('../images/spirit.png') -350px -821px no-repeat;
    position: absolute;
    left: 400px;
    top: 124px;
    z-index: 20;
    cursor: pointer;
}
.section3 .slide-star .prev:hover{
    background: url('../images/spirit.png') -122px -821px no-repeat;

}
.section3 .slide-star .prev.disable{
    opacity: 0.5;
}
.section3 .slide-star .prev.disable:hover{
    background: url('../images/spirit.png') -350px -821px no-repeat;

}
.section3 .slide-star .next{
    background: url('../images/spirit.png') -254px -685px no-repeat;
    left: auto;
    right: 390px;
}
.section3 .slide-star .next:hover {
    background: url('../images/spirit.png') -366px -685px no-repeat;
}
.section3 .slide-star .next.disable{
    opacity: 0.5;
}
.section3 .slide-star .next.disable:hover{
    background: url('../images/spirit.png') -254px -685px no-repeat;

}
.section3 .dec1{
    position: absolute !important;
    width: 143px ;
    height: 91px;
    left: -200px !important;
    top: 2px !important;
    background: url('../images/spirit.png') -254px -592px no-repeat;
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
}
.section3 .dec2{
    position: absolute !important;
    width: 54px;
    height: 24px;
    left: 110px !important;
    top: -8px !important;
    background: url('../images/spirit.png') -890px -428px no-repeat;
}
/* 第四节 */
/*现场直播*/
.section4 {
}
.section4 .sec-title{
    margin-top: 45px;
}
.section4 .live-box{
    margin-top: 40px;
    width: 1000px;
    height: 600px;
    border-radius: 20px;
    background-color: #34289a;
    position: relative;
    left: 0;
    top: 0;
    padding: 30px;
    z-index: 10;
    border: 3px solid #64569b;
    box-sizing: border-box;
}
.section4 .live-box .live-body{
    width: 100%;
    height: 100%;
}
.section4 .live-box .live-body img{
    display: block;
    width: 940px;
    height: 540px;
}

.section4 .dec1{
    position: absolute !important;
    width: 143px;
    height: 91px;
    left: -66px !important;
    top: 47px !important;
    background: url(../images/spirit.png) -254px -592px no-repeat;
}
.section4 .dec2{
    position: absolute !important;
    width: 54px;
    height: 24px;
    right: 186px !important;
    top: -13px !important;
    background: url(../images/spirit.png) -890px -428px no-repeat;
}
.section4 .dec3{
    position: absolute !important;
    width: 38px;
    height: 49px;
    left: -186px !important;
    top: 113px !important;
    background: url(../images/spirit.png) -267px -449px no-repeat;
}
.section4 .dec4{
    position: absolute !important;
    width: 57px ;
    height: 56px;
    left: -300px !important;
    top: 430px !important;
    background: url(../images/spirit.png) -774px -428px no-repeat;
}
.section4 .dec5{
    position: absolute !important;
    width: 263px;
    height: 496px;
    right: -390px !important;
    top: 290px !important;
    background: url(../images/spirit.png) -2px -2px no-repeat;
}
.section4 .r1 {
    left: 60px !important;
    top: -20px !important;
    width: 40px;
    height: 40px;
}

.section4 .r2 {
    left: -300px !important;
    top: 40px !important;
    width: 40px;
    height: 40px;
}

.section4 .r3 {
    left: -100px !important;
    top: 300px !important;
    width: 24px;
    height: 24px;
}

.section4 .r4 {
    left: -250px !important;
    top: 560px !important;
    width: 40px;
    height: 40px;
}

.section4 .r5 {
    right: -40px !important;
    top: 30px !important;
    width: 24px;
    height: 24px;
}

.section4 .r6 {
    right: -120px !important;
    top: 240px !important;
    width: 40px;
    height: 40px;
}
/* 第五节 */

.section5 {

}
.section5 .sec-title{
    margin-top: 41px;
}
.section5 .video-box{
    margin-top: 40px;
    width: 1000px;
    height: 500px;
    border-radius: 20px;
    background-color: #34289a;
    position: relative;
    left: 0;
    top: 0;
    padding: 30px;
    z-index: 10;
    margin-bottom: 46px;
    border: 3px solid #64569b;
    box-sizing: border-box;
}
.section5 .video-box .video-ul{

}
.section5 .video-box .video-ul .video-li{
    float: left;
    width: 230px;
    cursor: pointer;
}
.section5 .video-box .video-ul .video-li .img{
    height: 160px;
    width: 230px;
    overflow: hidden;
    position: relative;
    left: 0;
    top: 0;
}
.section5 .video-box .video-ul .video-li .img img{
    display: block;
    width: 230px;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.section5 .video-box .video-ul .video-li .title {
    color: #fff;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    margin: 12px auto;
    width: 96%;

}
.section5 .video-box .video-ul .video-li:hover .title {
    color: #fffa78;

}
.section5 .video-box .video-ul .video-li:nth-child(1){
    width: 450px;
    margin-right: 15px;
}
.section5 .video-box .video-ul .video-li:nth-child(2){
    margin-right: 6px;
}
.section5 .video-box .video-ul .video-li:nth-child(4){
    margin-right: 6px;
}
.section5 .video-box .video-ul .video-li:nth-child(1) .img {
    width: 450px;
    height: 390px;
}
.section5 .video-box .video-ul .video-li:nth-child(1) .img img{
    width: 450px;
    height: 390px;
}
.section5 .video-box .video-ul .video-li:nth-child(1) .title {
    color: #fffa78;
    font-size: 18px;
    font-weight: bold;
    line-height: 30px;
    text-align: center;
}
.section5 .video-box .video-ul .video-li{
    position: relative;
    left: 0;
    top: 0;
}
.section5 .video-box .video-li:nth-child(1) .live-mask {
    height: 390px;

}
.section5 .video-box .video-li .live-mask{
    display: none;
    width: 100%;
    height: 160px;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(24, 12, 76, 0.8);
}
.section5 .video-box .video-li .live-mask .play{
    width: 85px;
    height: 85px;
    background: url(../images/spirit.png) -564px -500px no-repeat;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) scale(0.8);
    -moz-transform: translate(-50%, -50%) scale(0.8);
    -ms-transform: translate(-50%, -50%) scale(0.8);
    -o-transform: translate(-50%, -50%) scale(0.8);
    transform: translate(-50%, -50%) scale(0.8);
    cursor: pointer;
}
.section5 .video-box .video-li .live-mask .play .rec{
    width: 118px;
    height: 138px;
    background: url(../images/spirit.png) -2px -821px no-repeat;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: 4px;
    -webkit-transform: translate(-50%, -50%) scale(0.8);
    -moz-transform: translate(-50%, -50%) scale(0.8);
    -ms-transform: translate(-50%, -50%) scale(0.8);
    -o-transform: translate(-50%, -50%) scale(0.8);
    transform: translate(-50%, -50%) scale(0.8);
}
.section5 .dec1{
    position: absolute !important;
    width: 54px;
    height: 24px;
    left: 90px !important;
    top: -20px !important;
    background: url(../images/spirit.png) -890px -428px no-repeat;
}
.section5 .dec2{
    position: absolute !important;
    width: 80px;
    height: 161px;
    left: -200px !important;
    top: 30px !important;
    background: url(../images/spirit.png) -864px -135px no-repeat;
}
.section5 .dec3{
    position: absolute !important;
    width: 75px;
    height: 84px;
    right: -190px !important;
    top: 240px !important;
    background: url(../images/spirit.png) -651px -500px no-repeat;
}
.section5 .r1 {
    width: 24px;
    height: 24px;
    left: -90px !important;
    top: 160px !important;
}

.section5 .r2 {
    width: 40px;
    height: 40px;
    left: -340px !important;
    top: 500px !important;
}
.section5 .r3 {
    width: 24px;
    height: 24px;
    right: -50px !important;
    top: 30px !important;
}
.section5 .r4 {
    width: 24px;
    height: 24px;
    right: -230px !important;
    top: 540px !important;
}

.top{
    position: fixed;
    right: 80px;
    bottom: 100px;
    width: 116px;
    height: 202px;
    background: url(../images/top.png) 0 0 no-repeat;
    cursor: pointer;
    display: none;
    -webkit-transition: all 1s ease-out;
    -moz-transition: all 1s ease-out;
    -ms-transition: all 1s ease-out;
    -o-transition: all 1s ease-out;
    transition: all 1s ease-out;
}
.top.fly {
    bottom: 800px;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}
/* 弹窗 */


.mask {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .8);
    z-index: 21;
}

.mask .close {
    display: block;
    position: absolute;
    right: 30px;
    top: 23px;
    width: 30px;
    height: 30px;
    background: url('../images/close.png') no-repeat;
    cursor: pointer;
    -ms-transition: .4s;
    -o-transition: .4s;
    -moz-transition: .4s;
    -webkit-transition: .4s;
    transition: .4s;
}

.mask .close:hover {
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.mask .item {
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 543px;
    height: 334px;
    margin-left: -271px;
    margin-top: -167px;
}

/* 视频 */

.mask .alert-video {
    position: relative;
    left: 50%;
    top: 50%;
    margin-left: -450px;
    margin-top: -253px;
    width: 900px;
    height: 506px;
}

.mask .alert-video iframe {
    display: block;
    width: 900px;
    height: 506px;
}

.mask .alert-video .close {
    right: -60px;
    top: -30px;
    z-index: 100;
}

/* 上传图片 */

.mask .upload-item {
    background-size: 100% 100%;
}

.mask .upload-item .upload-form {
    position: relative;
    width: 100%;
    height: 100%;
}

.mask .upload-wrap {
    background-size: 100% 100%;
}

.mask .upload-wrap,
.mask .upload-img,
.mask .upload-wrap .webuploader {
    position: relative;
    top: 0;
    width: 150px;
    height: 150px;
    margin: 0 auto;
    cursor: pointer;
}

.mask .upload-wrap {
    top: 60px;
}

.upload-wrap .webuploader {
    filter: alpha(Opacity=0);
    -moz-opacity: 0;
    opacity: 0;
}

.mask .upload-img {
    display: none;
}

.mask .upload-img .ucos {
    position: absolute;
    right: -4px;
    top: -4px;
    width: 14px;
    height: 14px;
    background: url('../images/close.png') no-repeat center top;
    background-size: 100% 100%;
}

.mask .upload-img img {
    display: block;
    width: 100%;
    height: 100%;
}

.mask .upload-form .btn-upload {
    position: absolute;
    margin-left: -80px;
    left: 50%;
    bottom: 50px;
    display: block;
    width: 160px;
    height: 56px;
    background-size: 100% auto;
    outline-style: none;
    border: none;
    cursor: pointer;
}

/* 中奖弹窗 */

.mask .item1 {
    background-size: 100% 100%;
    text-align: center;
    font: 32px 微软雅黑;
    color: #7b7b7b;
}

.mask .item1 .lottery-win {
    position: relative;
    top: 125px;
}

/* 未中奖弹窗 */

.mask .item2 {
    background-size: 100% 100%;
    text-align: center;
    font: 32px 微软雅黑;
    color: #7b7b7b;
}

.mask .item2 .lottery-lose {
    position: relative;
    top: 125px;
}

/* 活动信息弹窗 */

.mask .item-msg {
    background-size: 100% 100%;
    text-align: center;
    font: 32px/334px 微软雅黑;
    color: #7b7b7b;
}

.hide {
    display: none;
    width: 0;
    height: 0;
    overflow: hidden;
}

/* 侧栏悬浮 */

.sidebar {
    position: fixed;
    right: 50px;
    top: 200px;
    height: 134px;
    z-index: 99;
}

.sidebar .code {
    width: 134px;
    height: 148px;
    background-position: -609px -20px;
    text-align: center;
    font: 14px 微软雅黑;
    color: #fff;
}

.sidebar .code img {
    padding-top: 15px;
    display: block;
    margin: 0 auto 0;
}

.sidebar a {
    position: relative;
    display: block;
    margin: 20px auto 0;
    text-indent: -99999em;
}

.sidebar a.btn-gw:after {
    content: "";
    display: table;
    position: absolute;
    width: 1px;
    height: 20px;
    top: -20px;
    left: 50%;
    border-left: 1px dashed #423850;
}

.sidebar a.btn-gw:before {
    content: "";
    display: table;
    position: absolute;
    width: 1px;
    height: 20px;
    bottom: -20px;
    left: 50%;
    border-left: 1px dashed #423850;
}

.sidebar a.btn-gw {
    width: 90px;
    height: 90px;
    background-position: -609px -335px;
}

.sidebar a.btn-gw:hover {
}

.sidebar a.btn-download {
    width: 90px;
    height: 90px;
    background-position: -176px -489px;
}

.sidebar a.btn-download:hover {
}