body,html{margin:0;padding:0;background:#000;text-align:left;font-family:'PingFang SC','微软雅黑','Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;}
p{margin:0;padding:0;}
ul{list-style:none;margin:0;padding:0;}
img{display:inline-block;vertical-align: bottom;}
a{text-decoration: none;cursor: pointer;}
h1{font-weight:normal;margin:0;padding:0;font-size:36px;color:#fff;}
.flex{display:flex;justify-content: space-between;}
.clearfix:after{content:"";display:block;clear:both;}
.w900{width:900px;margin:0 auto;}
#body{background:#181617;}
.wrapper{width:100%;overflow: hidden;}
.swiper1{width:2560px;height:1000px;transform-origin: left top;overflow: hidden;position: relative;}
.swiper1 .swiper-slide{width:100%;height:100%;}
.content{width:100%;padding-top:20px;box-sizing: border-box;background:#181617;padding-bottom:50px;background:url(https://public-static.zcool.com.cn/special-resource/CGyishu/assets/img/mainbg.jpg) no-repeat center top;background-size:2560px auto;}
.before:before{content:"";display:table;}
.navbox{position: relative;z-index:10;}
.navi{width:1100px;display:flex;margin:0 auto;justify-content: space-between;}
.navi li{width:150px;height:65px;text-align: center;cursor: pointer;line-height:63px;background:#000;box-sizing: border-box;border:1px solid #fff;font-size:20px;color:#fff;transition: all 0.2s linear;position: relative;}
.navi li a{color:#fff;}
.navi li:hover{border:1px solid #b848fa;color:#b848fa;}
.navi li:hover a,.navi li.active a{color:#b848fa;}
.navi li.active{border:1px solid #b848fa;color:#b848fa;transform:translateY(-10px);}
.navi li:last-child:hover .navshare{display:block;}
.navbox{height:65px;width:100%;}
.naviWraper{width:100%;}
.navshare{width:150px;border:1px solid #fff;box-sizing: border-box;line-height:63px;text-align:center;position: absolute;left:-1px;top:63px;display:none;}
.navshare>div:first-child{border-bottom:1px solid #fff;}
.navshare>div{height:65px;}
.navshare>div>a{background:#000;}
.navshare>div:hover>a{background:#b848fa;color:#000;}
.weibo,.swechat{display:inline-block;width:100%;height:100%;color:#fff;}
.conmain{margin:0 auto;margin-top:142px;}
.toptle{text-align:center;position: relative;z-index:5;}
.main1{position: relative;}
.m1box{font-size:16px;color:#fff;line-height:30px;margin-top:30px;position: relative;z-index:3;}
.m1w1{margin-top:292px;}
.m1-1{position: relative;left:-66px;}
.m1rt{width:625px;padding-top:194px;}
.bxq{position: absolute;right:-455px;top:-80px;}
.main2{position: relative;margin-top:220px;}
.m2xq{position: absolute;right:-95px;top:66px;}
.m2box{margin-top:85px;position: relative;z-index:3;overflow: hidden;transition:all 0.3s linear;}
.m2box li{width:295px;float:left;margin-right:7.4px;height:328px;cursor: pointer;text-align:center;border-radius: 1px;overflow: hidden;}
.m2box li:nth-child(3n){margin-right:0;}
.m2timg img{width:100%;display:block;}
.m2timg,.m2bto{box-sizing: border-box;border:1px solid #b5b5b5;}
.m2bto{margin-top:4px;padding-bottom:4px;background:#000;}
.m2w1,.m2w2{font-size:18px;width:100%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;padding:0 5px;box-sizing: border-box;}
.m2w1{line-height:34px;color:#fff;}
.m2w2{line-height:30px;width:285px;margin:0 auto;background:#b5b5b5;}
.m2box li:hover .m2timg,.m2box li:hover .m2bto{border:1px solid #b848fa;}
.m2box li:hover .m2w2{background:#b848fa;}
.m2more{display:inline-block;cursor: pointer;padding:0 20px;line-height:30px;text-align: center;background:#fff;border-radius: 1px;font-size:18px;margin:0 auto;margin-top:20px;}
.m2more:hover{background:#b848fa;}
.m2-1{position: absolute;left:50px;top:-170px;z-index:3;overflow: hidden;width:465px;animation: act1 10s linear infinite;}
.m2-2{position: absolute;left:50px;top:-170px;}
.main3{margin-top:175px;position: relative;}
.m3-1{position: absolute;right:165px;top:-60px;animation: act5 10s linear infinite;}
.m3-1 img{width:200px;}
.m3box{position: relative;margin-top:145px;}
#swiper2{width:100%;}
#swiper2 .swiper-slide{width:295px;box-sizing: border-box;border-radius: 1px;overflow: hidden;}
#swiper2 .swiper-slide img{width:100%;}
.m3box .swiper-button-prev ,.m3box .swiper-button-next{width:17px;height:17px;position: absolute;top:50%;margin-top:-8px;}
.m3box .swiper-button-prev{background:url(https://public-static.zcool.com.cn/special-resource/CGyishu/assets/img/prev1.png) no-repeat center center !important;left:-40px !important;}
.m3box .swiper-button-next{background:url(https://public-static.zcool.com.cn/special-resource/CGyishu/assets/img/next1.png) no-repeat center center !important;right:-40px !important;}
.m3box .swiper-button-prev:hover{background:url(https://public-static.zcool.com.cn/special-resource/CGyishu/assets/img/prev1-h.png) no-repeat center center !important;}
.m3box .swiper-button-next:hover{background:url(https://public-static.zcool.com.cn/special-resource/CGyishu/assets/img/next1-h.png) no-repeat center center !important;}
/* .m4ctn{background:url(https://public-static.zcool.com.cn/special-resource/CGyishu/assets/img/m4bg.jpg) no-repeat center top;background-size:2560px auto;} */
.main4{margin-top:195px;color:#fff;position: relative;}
.m4-1{position: absolute;left:250px;top:-70px;animation: act5 8s linear infinite;}
.m4con{position: relative;}
.m4fc{position: absolute;right:-190px;top:-50px;transform-origin: left top;animation: act2 13s linear infinite;}
.tile{font-size:30px;color:#fff;position: relative;z-index:3;}
.tile span{position: relative;bottom:10px;}
.tile1{margin-top:95px;}
.m4mid{text-align:center;margin-top:80px;margin-bottom:80px;}
.m4w1{font-size:16px;margin-bottom:5px;}
.m4w3{display:inline-block;background:#000;position: relative;width:443px;height:36px;}
.m4w3 span{display: inline-block;width:100%;height:100%;box-sizing: border-box;border:1px solid #fff;line-height:34px;color:#fff;font-size:25px;position: absolute;left:3px;top:3px;cursor: pointer;}
.m4w3 span:hover{color:#b848fa;border:1px solid #b848fa;}
.m4w2{font-size:16px;margin-top:5px;}
.shareBn{font-size:25px;}
.shareBn span{position: relative;bottom:10px;font-size:15px;}
.m4box{margin-top:80px;}
.m4box li{width:448px;float:left;margin-right:4px;box-sizing: border-box;border-radius: 1px;cursor: pointer;transition:all 0.3s linear;margin-bottom:80px;}
.m4box li:hover{transform: translateY(-10px);}
.m4box li:nth-child(2n){margin-right:0;}
.m4top{position: relative;box-sizing: border-box;width:100%;text-align:right;padding:19px;border:1px solid #b5b5b5;background:#000;box-shadow: 2px 10px 5px #000;}
.m4top a{display:inline-block;text-align:center;width:150px;line-height:60px;background: #fff;font-size:20px;font-weight:500;color:#000;}
.m4tx{position: absolute;top:-42px;left:58px;z-index:3;border:3px solid #b5b5b5;box-sizing: border-box;border-radius: 50%;}
.m4tx img{width:180px;height:180px;border-radius: 50%;}
.m4bto{margin-top:20px;padding:24px 16px;border:1px solid #b5b5b5;box-sizing: border-box; position: relative;letter-spacing: 0.5px;background:#000;box-shadow: 2px 10px 5px #000;}
.m4wbox{width:100%;height:200px;line-height:28px;font-size:14px;overflow-y: auto;border-top:1px solid #fff;border-bottom:1px solid #fff;position: relative;}
.m4bto:after{content:"";display:block;border:10px solid transparent;border-top-color:#fff;position: absolute;left:50%;margin-left:-10px;bottom:5px;}
.m4box li:hover .m4top,.m4box li:hover .m4bto{border:1px solid #b848fa;}
.m4box li:hover .m4top a{background:#b848fa;color:#fff;}
.main5{margin-top:185px;position: relative;}
.main5 h1{color:#000;}
.m5box{margin-top:148px;position: relative;}
.m5lb li{float:left;margin-right:7.4px;margin-bottom:7.5px;overflow: hidden;}
.m5lb li img{width:100%;transition: all .3s linear;}
.m5lb li img:hover{transform: scale(1.2);}
.m5lb li:nth-child(3n){margin-right:0;}
.m5box .swiper-button-prev,.m5box .swiper-button-next{background:none;color:#fff;font-size:28px;top:660px;}
.m5box .swiper-button-prev{left:392px;}
.m5box .swiper-button-next{right:392px;}
.m5box .swiper-button-prev:hover,.m5box .swiper-button-next:hover{color:#b848fa;}
.m5-1{position: absolute;top:-198px;left:255px;}
.m5-2{position:absolute;top:-114px;left:303px;animation: float 3s ease-in-out infinite;}
.main7{margin-top:198px;color:#fff;position: relative;}
/* .m7-1{animation: act5 8s linear infinite;} */
.m7xq{position: absolute;right:-88px;top:360px;}
.m7eg{width:594px;}
.m7w1{font-size:18px;line-height:36px;margin-top:80px;}
.shareBn1{margin-top:50px;}
.m7lis{margin-top:36px;}
.m7lis li{width:100px;box-sizing: border-box;border:1px solid transparent;margin-right:33.3px;position: relative;margin-bottom:34px;cursor: pointer;float:left;}
.m7lis li img{width:100%;display:block;}
.m7lis li:hover{border-color:#b848fa;}
.m7lis li:hover .m7opt{opacity: 1;}
.m7lis li:nth-child(7n){margin-right:0;}
.m7opt{width:90px;height:90px;background:rgba(0, 0, 0, 0.6);text-align:center;font-size:18px;color:#fff;position: absolute;left:5px;top:5px;transition:all 0.3s linear;opacity: 0;}
.m7opt p{position: relative;top:50%;transform:translateY(-50%);}
.main8{position: relative;margin-top:98px;position: relative;}
.m8box{margin-top:48px;position: relative;z-index:2;}
.m8box li{width:295px;float:left;border-radius: 1px;overflow: hidden;margin-right:7.4px;margin-bottom:7px;}
.m8box li img{width:100%;}
.m8box li:nth-child(3n){margin-right:0;}
.m8xq{position: absolute;left:-96px;top:-55px;}
.main9{background:url(../img/flg.svg) no-repeat center center;height:300px;background-size:2560px 100%;text-align: center;box-sizing: border-box;padding-top:180px;margin-top:130px;}
.ptr-shape{padding:0;}
.m2yc{position: absolute;bottom:-130px;left:32px;opacity: 0.5;}
.m2yc img{width:750px;}
.wx-qrcode{top:0 !important;margin-top:0 !important;right:-118px !important;}

.ewm{text-align:center;margin-top:40px;display:none;}
.ewm p{font-size:18px;color:#fff;margin-top:10px;}
.ewm img{width:200px;border:15px solid #fff; }


.showBox{position: fixed;z-index:10000;right:0;left:0;top:0;bottom:0;background:rgba(0, 0, 0, 0.6);display:none;}
.showImg{width:900px;box-sizing: border-box;padding:50px;background:#b5b5b5;overflow-y: auto;max-height:100%;height:auto;margin:0px auto;border:1px solid #b848fa;position: relative;top:50%;transform:translateY(-50%);}
.showImg img{width:100%;}
.retv{position: relative;}
.artist{font-size:16px;line-height:28px;color:#e2e2e2;width:100%;background:#000;box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);padding:0 10px;box-sizing: border-box;margin-top:20px;}
.toclose{display:block;width:50px;height:50px;background:#b5b5b5;border-radius: 50%;line-height:50px;text-align:center;cursor: pointer;color:#b848fa;font-size:36px;
position: absolute;right:30px;top:30px;}
@keyframes act1{
    0% {transform:rotateZ(0deg)}
    50%{transform:rotateZ(5deg)}
    100%{transform:rotateZ(0deg)}
}
@keyframes act2{
    0% {opacity: 1;transform: translate3d(0,0,0) scale(1);}
    70%{opacity: 0;transform: translate3d(-20px,20px,-20px) scale(0.2);}
    72%{transform: translate3d(0,0,0) scale(1);opacity: 0;}
    100%{transform: translate3d(0,0,0) scale(1);opacity: 1;}
}

@keyframes act3{
    0%{transform: rotateY(0);}
    100%{transform: rotateY(360deg);}
}
@keyframes act4{
    0%{transform: rotate3d(0,0,0,0);}
    100%{transform: rotate3d(1,1,1,360deg);}
}
@keyframes act5{
    0%{transform: rotateZ(0deg);opacity: 1;}
    25%{transform: rotateZ(90deg);opacity: 0.75;}
    50%{transform: rotateZ(180deg);opacity: 0.5;}
    75%{transform: rotateZ(270deg);opacity: 0.75;}
    100%{transform: rotateZ(360deg);opacity: 1;}
}
@keyframes float{
    from {transform:translate(0, 0px);}
    65% {transform:translate(0, 15px);}
    to {transform: translate(0, -0px);}    
}

.cur{position: fixed;z-index:10000;top:20px;}
.tohide{display:none;}