/*****star*****/
.star{background: #000000; padding-top: 75px; position: relative; height: 100%;}
.swiper-container{ width: 100%;  height: 100%; margin-left: auto; margin-right: auto;}
.swiper-slide { width: 100%; height: 100%; }
.star-srcoll{ background-image: url(../images/star/star-bg.jpg);}
.star-srcoll .headline{ padding-top: 180px;}
.star-srcoll .headline img{ width: 40%;}
.star-srcoll .con{ position: absolute; bottom:17%; left:0px; width: 100%;}
.star-srcoll .slick{ max-width:1000px; padding: 0px 50px; width: 100%; margin: 0 auto; }
.star-srcoll .slick .slick-slide{ padding: 0px 25px;}
.star-srcoll .slick a{ display: block; width: 100%;position: relative;}
.star-srcoll .slick img{ position: absolute; top:0px; left:0px; width: 100%; height: 100%; opacity: .4;}
.star-srcoll .slick i{ display: inline-block; padding-bottom: 144%;}
.star-srcoll .slick-center img{ opacity: 1;}
.star-srcoll .slick-prev,.star-srcoll .slick-next{height: 39px; width: 19px; top:50%; margin-top: -20px; background-position: center center;  background-repeat: no-repeat; background-size: cover;  -ms-behavior: url(/plugin/backgroundsize.min.htc);  behavior: url(backgroundsize.min.htc);}
.star-srcoll .slick-prev{ left:10px; background-image: url(../images/star/prev-button.png);}
.star-srcoll .slick-next{ right:10px; background-image: url(../images/star/next-button.png);}
.star .item{ padding:60px 8% 0;}
.star .item:nth-child(odd){ text-align: right;}
.star .box{ display: inline-block; width: 425px; height: 534px; padding: 130px 50px 0px; position: relative; text-align: left;vertical-align: middle;}
.star .box+i{ display: inline-block; height: 100%; vertical-align: middle;}
.star .box a{ display: block; cursor: pointer;}
.star .box .tit{ margin-bottom: 20px; font-size: 32px; text-align: center; font-weight: bold;}
.star .box .text{ line-height: 22px;}
.star .box span{ display: block; position: absolute; bottom:80px; left:0px; width: 100%; text-align: center; color: #333333;}


@media screen and (max-width:1300px) {
	.star .item{ padding:40px 5% 0;}
}
@media screen and (max-width: 1240px){
    .star{ padding-top:60px;}
}
@media screen and (max-width:780px) {	
	.star-srcoll .con{ bottom: 20%;}
	.star-srcoll .slick{ padding:0px 30px;}
	.star-srcoll .slick .slick-slide{ padding: 0px 10px;}	
	.star-srcoll .slick-prev,.star-srcoll .slick-next{ height:21px; width: 10px; margin-top:-10px;}
	.star .item{ padding:20px 5% 0;}
    .star .box{ width: 350px; height: 430px; padding: 80px 30px 0px;}
    .star .box .tit{ font-size: 22px;}
	.star .box .text{ font-size: 12px;}
	.star .box span{ bottom:60px;}
}
@media screen and (max-width:480px) {
	.star-srcoll .headline{ padding-top:150px;}
	.star-srcoll .slick .slick-slide{ padding: 0px 5px;}	
	.star .item{ text-align:center; padding:50px 0 0;}
	.star .item:nth-child(odd){ text-align: center;}
	.star .box{ width: 275px; height:338px; padding:65px 15px 0px; vertical-align: middle;}
    .star .box .tit{ font-size: 16px; margin-bottom: 10px;}
	.star .box .text{ line-height: 16px; }
	.star .box span{ bottom:45px;}
}
@media screen and (max-width:1600px) and (min-width:1000px) and (max-height:600px){
	.star-srcoll .headline{ padding-top:80px;}
	.star-srcoll .headline img{ max-width: 20%;}
	.star-srcoll .con{ position: absolute; left:15%; width:70%; bottom: 15%;}
	.star-srcoll .slick{ padding:0px 30px;}
	.star-srcoll .slick .slick-slide{ padding: 0px 10px;}	
	.star-srcoll .slick-prev,.star-srcoll .slick-next{ height:21px; width: 10px; margin-top:-10px;}
    .star .box{ width: 350px; height: 430px; padding: 80px 30px 0px;}
    .star .box .tit{ font-size: 22px;}
	.star .box .text{ font-size: 12px;}
	.star .box span{ bottom:60px;}
}


/*****star_detail*****/
.w1300{ max-width: 1300px; margin: 0 auto; padding: 0 15px;}
.detail{ color: #474747;}
.detail a{ color: #474747;}
.detail .kv{ width: 100%; padding-top: 75px;}
.detail .kv img{ display: block; width: 100%;}
.detail .main{ padding: 55px 0px 120px; color: #FFFFFF; background-image:url(../images/star/red.jpg); background-position: bottom center;}
.detail .main .w870{ max-width: 870px; padding: 0px 15px;  width: 100%; margin:0 auto;}
.detail .main .tit{ font-size: 38px; font-weight: bold; margin-bottom: 25px;text-align: center; }
.detail .main .con{ font-size: 16px; line-height: 22px; text-align: center;}
.cartoon{ text-align: center;  font-size: 16px;  padding-bottom: 55px;}
.cartoon ul li{ float: left; width: 33.3%; padding:0px 5px;}
.cartoon2 ul li{ width: 25%;}
.cartoon .video{ margin: 45px auto 0; width: 100%; max-width: 830px; cursor: pointer;}
.cartoon .video p{ margin-top: 20px; line-height: 26px;}
.film{ text-align: center; background-image:url(../images/star/film-bg.jpg); padding-bottom: 60px;}
.film #film-video{ cursor: pointer;}
@media screen and (max-width: 1240px){
    .detail .kv{  padding-top:60px;}
}
@media screen and (max-width:1000px) {
	.detail .main .tit{ font-size: 30px;}
	.detail .main .con{ font-size: 14px;}
}
@media screen and (max-width:640px) {
	.detail .kv{  padding-top:0px;}
	.detail .main{ padding: 20px 0px 70px;}
	.detail .main .tit{ font-size: 20px; margin-bottom: 10px;}
	.detail .main .con{ font-size: 12px; line-height: 20px;}
	.cartoon{ font-size: 12px; padding-bottom: 30px;}
	.cartoon .video{ margin-top: 20px;}
	.cartoon .video p{ line-height: 22px;}
	.film{ padding-bottom: 30px;}
}


.film-list{ padding-bottom: 60px;}
.film-list .des{ max-width: 797px; width: 100%; height: 74px; line-height: 74px; margin: 0 auto 40px; background:url(../images/star/film-des.png) center; text-align: center; font-size: 18px; font-weight: bold; color: #FFFFFF; }
.film-slick{ padding: 0 20px;}
.film-slick .slick-prev,.film-slick .slick-next{height: 35px; width: 14px; top:50%; margin-top: -12px; background-position: center center;  background-repeat: no-repeat; background-size: cover;  -ms-behavior: url(/plugin/backgroundsize.min.htc);  behavior: url(backgroundsize.min.htc);}
.film-slick .slick-prev{ left:-10px; background-image: url(../images/star/film-prev.png);}
.film-slick .slick-next{ right:-10px; background-image: url(../images/star/film-next.png);}
.film-slick .slick-prev:hover{ background-image: url(../images/star/film-prevh.png);}
.film-slick .slick-next:hover{ background-image: url(../images/star/film-nexth.png);}
.film-slick .slick-dots{ bottom:-30px;}
.film-slick .slick-slide{ padding: 0px 18px; font-size: 13px; line-height: 20px;} 
.film-slick .slick-slide a{ display: block; cursor: pointer;}
.film-slick .slick-slide .con{ display: block; position: relative;}
.film-slick .slick-slide .con span{ display: block; width: 100%; position: relative; z-index: 1;}
.film-slick .slick-slide .con span img{ position: absolute; top:0px; left:0px; width: 100%; height: 100%;}
.film-slick .slick-slide .con span i{ display: inline-block; padding-bottom: 146.46%;}
.film-slick .slick-slide .text{ display: none; position: absolute; top:0; left:0; width: 100%; height: 100%; padding: 15px; color: #FFFFFF;background: rgba(0,0,0,.8); z-index: 2;}
.film-slick .slick-slide .red{ color: #df3343;}
.film-slick .slick-slide .year{ margin-top: 5px; color: #df3343;}
.film-slick .slick-slide a:hover .text{ display: block;}
.film-slick2 .slick-prev:hover{ background-image: url(../images/star/film-prevh2.png);}
.film-slick2 .slick-next:hover{ background-image: url(../images/star/film-nexth2.png);}
.film-slick3 .slick-prev:hover{ background-image: url(../images/star/film-prevh3.png);}
.film-slick3 .slick-next:hover{ background-image: url(../images/star/film-nexth3.png);}
.film-slick6 .slick-prev:hover{ background-image: url(../images/star/film-prevh6.png);}
.film-slick6 .slick-next:hover{ background-image: url(../images/star/film-nexth6.png);}
.film-slick7 .slick-prev:hover{ background-image: url(../images/star/film-prevh7.png);}
.film-slick7 .slick-next:hover{ background-image: url(../images/star/film-nexth7.png);}
@media screen and (max-width:1000px) {
	.film-slick{ padding: 0px;}
	.film-slick .slick-slide{ padding: 0px 10px; font-size: 12px; line-height: 18px;}
}
@media screen and (max-width:840px){
	.film-list .des{ height: auto; padding: 10px; font-size: 14px; line-height: 24px; margin-bottom: 20px; background-repeat: repeat-y; }
}

.stageshow2{ background-image:url(../images/star/star4-tit3.jpg); padding-bottom: 70px;}
.stageshow2 ul{ margin-top: 60%; color: #FFFFFF;}

.stageshow{ background-image:url(../images/star/stageshow-bg.jpg); padding-bottom: 70px;}
.stageshow ul{ margin-top: 60%; color: #FFFFFF;}
.stageshow ul li{ width: 33.3%; float: left; padding: 0px 5px; font-size: 16px; line-height: 22px; }
.stageshow ul li div{ background:rgba(0,0,0,.5);  position: relative;}
.stageshow ul li p{ margin-left: 10px; width: 220px; display: inline-block; vertical-align: middle; padding: 10px;}
.stageshow ul li span{ display: inline-block; font-size: 20px; vertical-align: middle; padding-left: 12px; height: 136px; width: 60px; background:url(../images/star/stageshow-span.png) center left;}
.stageshow ul li span em{font-style: normal; display: inline-block; vertical-align: middle;}
.stageshow ul li div i{ display: inline-block; vertical-align: middle; height: 100%;}
.stageshow3 ul li span{  background:url(../images/star/stageshow-span2.png) center left;}
@media screen and (max-width:1000px) {
	.stageshow ul{ margin-top: 30%;}
	.stageshow ul li{ margin-top: 10px; width: 100%; font-size: 14px; line-height: 20px;}
	.stageshow ul li div{ padding-left: 40px;}
	.stageshow ul li p{ width: 80%; }
	.stageshow ul li div i{ min-height: 100px;}
	.stageshow ul li span{ position: absolute; top:0px; left:0px; height: 100%; background: #df3343; width: 40px; padding-left: 0px; text-align: center;}
	.stageshow3 ul li span{ background:#e98db5;}
}
@media screen and (max-width:780px){
	.stageshow{ padding-bottom: 30px;}
	.stageshow ul{ margin-top: 0;}
}


.game{ background: #df3343; color:#FFFFFF; padding-bottom: 75px;}
.game .des{ text-align: center; padding: 0px 15px; font-size: 16px; margin-bottom: 40px; }
.game ul{max-width: 1030px; padding:0px 15px; width: 100%; margin:0 auto;}
.game li{ float: left; padding: 0px 18px; width: 50%;}
.game li .con{ background: #FFFFFF;}
.game li .dimg{ position: relative;}
.game li .dimg span{ display: block; width: 100%; position: relative; z-index: 1;}
.game li .dimg span img{ position: absolute; top:0px; left:0px; width: 100%; height: 100%;}
.game li .dimg span i{ display: inline-block; padding-bottom: 48.1%;}
.game li .dimg .erweima{ display: none; position: absolute; top:0px; left:0px; width: 100%; height: 100%; background: rgba(0,0,0,.8); z-index: 2; text-align: center;}
.game li .dimg .erweima div{ float: left; width: 50%;}
.game li .dimg .erweima div p{ padding: 20px 0px; font-size: 18px;}
.game li .tit{ color: #474747; font-size:16px; color: #474747; padding:10px;}
.game li .tit p{ line-height: 24px; height: 48px;overflow: hidden;}
.game li .con:hover .erweima{ display: block;}
@media screen and (max-width:880px){
	.game li{padding: 0px 10px;}
	.game li .dimg .erweima img{ width: 62%;}
	.game li .dimg .erweima div p{ padding: 10px 0px;}
	.game li .tit p{ font-size: 14px; line-height: 22px; height: 44px;}
}
@media screen and (max-width:640px){
	.game{ padding-bottom: 30px;}
	.game .des{ margin-bottom: 0px; font-size: 14px;}
	.game li{ margin-top: 20px; width: 100%; padding: 0px;}
}


.activity{ background: #f3f3f3; padding-bottom: 100px;}
.activity-slick .slick-prev,.activity-slick .slick-next{height: 35px; width: 14px; top:50%; margin-top: -12px; background-position: center center;  background-repeat: no-repeat; background-size: cover;  -ms-behavior: url(/plugin/backgroundsize.min.htc);  behavior: url(backgroundsize.min.htc);}
.activity-slick .slick-prev{ left:-30px; background-image: url(../images/star/film-prev.png);}
.activity-slick .slick-next{ right:-30px; background-image: url(../images/star/film-next.png);}
.activity-slick .slick-prev:hover{ background-image: url(../images/star/film-prevh.png);}
.activity-slick .slick-next:hover{ background-image: url(../images/star/film-nexth.png);}
.activity-slick .slick-dots{ bottom:-30px;}
.activity-slick .slick-slide{ padding: 0px 5px; font-size: 13px; line-height: 20px;} 
.activity-slick .slick-slide a{ display: block; cursor: pointer; background: #FFFFFF; border-bottom: 2px solid #df3343;}
.activity-slick .slick-slide span{ display: block; width: 100%; position: relative; z-index: 1;}
.activity-slick .slick-slide span img{ position: absolute; top:0px; left:0px; width: 100%; height: 100%;}
.activity-slick .slick-slide span i{ display: inline-block; padding-bottom: 67.6%;}
.activity-slick .slick-slide p{ padding: 0px 10px; height: 46px; line-height: 46px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.activity-slick .slick-slide a:hover p{ color: #FFFFFF; background: #df3343;}
.activity2{ background: #FFFFFF;}
.activity2 .activity-slick .slick-slide p{ background: #f9f9f9;}
.activity2 .activity-slick .slick-slide a{ border-bottom: 2px solid #f69408;}
.activity2 .activity-slick .slick-slide a:hover p{ background: #f69408;}
.activity2 .activity-slick .slick-prev:hover{ background-image: url(../images/star/film-prevh2.png);}
.activity2 .activity-slick .slick-next:hover{ background-image: url(../images/star/film-nexth2.png);}
.activity3{ background: #FFFFFF;}
.activity3 .activity-slick .slick-slide a{ border-bottom: 2px solid #e98db5;}
.activity3 .activity-slick .slick-slide a:hover p{ background: #e98db5;}
.activity3 .activity-slick .slick-prev:hover{ background-image: url(../images/star/film-prevh3.png);}
.activity3 .activity-slick .slick-next:hover{ background-image: url(../images/star/film-nexth3.png);}

@media screen and (max-width:1070px) {
	.activity-slick{ padding: 0px 30px;}
	.activity-slick .slick-prev{ left:0px;}
	.activity-slick .slick-next{ right:0px;}
}
@media screen and (max-width:779px) {
	.activity{ padding-bottom: 50px;}
	.activity-slick{ padding: 0px;}
	.activity4 .headline2 img{ w}
}


.derivative{ width: 100%; background: #f4f3f3; padding-bottom: 100px;}
.derivative .con{ max-width: 1030px; padding: 0px 15px;  width: 100%; margin: 0 auto;}
.derivative .leftimg{ float: left; width: 26%;}
.derivative .leftimg img{ width: 100%;}
.derivative .right-con{ float: right; width: 64%; margin-right:40px;}
.derivative .slick-slide{ padding: 0px 10px;}
.derivative .slick-slide a{ display: block; text-align: center; background: #fff; font-size: 14px; color: #323232; margin-bottom: 15px;}
.derivative .slick-slide span{ display: block; width: 100%; position: relative; z-index: 1;}
.derivative .slick-slide span img{ position: absolute; top:0px; left:0px; width: 100%; height: 100%;}
.derivative .slick-slide span i{ display: inline-block; padding-bottom:57.143%;}
.derivative .slick-slide p{ height: 44px; line-height: 44px; padding: 0px 5px; overflow: hidden;}
.derivative .slick-prev,.derivative .slick-next{height: 35px; width: 14px; top:50%; margin-top: -12px; background-position: center center;  background-repeat: no-repeat; background-size: cover;  -ms-behavior: url(/plugin/backgroundsize.min.htc);  behavior: url(backgroundsize.min.htc);}
.derivative .slick-prev{ left:-30px; background-image: url(../images/star/film-prev.png);}
.derivative .slick-next{ right:-30px; background-image: url(../images/star/film-next.png);}
.derivative .slick-prev:hover{ background-image: url(../images/star/film-prevh.png);}
.derivative .slick-next:hover{ background-image: url(../images/star/film-nexth.png);}
.derivative2 .slick-prev:hover{ background-image: url(../images/star/film-prevh2.png);}
.derivative2 .slick-next:hover{ background-image: url(../images/star/film-nexth2.png);}
.derivative3 .slick-prev:hover{ background-image: url(../images/star/film-prevh3.png);}
.derivative3 .slick-next:hover{ background-image: url(../images/star/film-nexth3.png);}
@media screen and (max-width:980px) {
	.derivative .leftimg{ float: none; width: 100%; margin-bottom: 30px;}
	.derivative .right-con{ float: none; width: 100%; margin-right:0px; padding: 0px 30px; }
	.derivative .right-con{}
}
@media screen and (max-width:640px) {
	.derivative{ padding-bottom: 30px;}
	.derivative .right-con{ padding: 0px 15px;}
	.derivative .slick-slide{ padding: 0px 3px;}
	.derivative .slick-prev{ left:-20px;}
	.derivative .slick-next{ right:-20px;}
}



.balala_stageshow{ background-image:url(../images/star/balala_stageshow_bg.jpg); padding: 0 10px; text-align: center; }
.publication{ background: #f4f3f3;  padding-bottom: 90px;}
.publication .w1030{ max-width: 1030px; padding: 0px 15px;  width: 100%; margin: 0 auto;}
.publication .content{ background: #FFFFFF;}
.publication .content .con{ float: left; display: none; width: 70%; padding:20px; background:url(../images/star/publication_jiao.png) center right no-repeat;}
.publication .content .con img{ float: left; width: 55%;}
.publication .content .con .text{ float: left; width: 40%; padding: 20px 20px 0;}
.publication .content .con .text span{ font-size: 66px; color: #e98db5;}
.publication .content .item{ float: left; width:15%; text-align: center; height: 371px; background: #d7d3dc; font-size: 33px; color: #FFFFFF; cursor: pointer;}
.publication .content .item span{display: inline-block; width: 33px; vertical-align: middle;}
.publication .content .item i{ display: inline-block; vertical-align: middle; height: 100%;}
.publication .content .item.active{ font-weight: bold; background: #9d7fc6;}
@media screen and (max-width:640px) {
	.publication{ padding-bottom: 30px;}
	.publication .content .con img{width: 100%;}
	.publication .content .con .text{ width: 100%; padding: 10px 10px 0;}
	.publication .content .con .text span{ font-size: 22px;}
	.publication .content .item{ font-size: 22px; height: 360px;}
}


.introduction8{ background-image:url(../images/star/introduction_08_bg.jpg); padding-bottom: 50px; color: #FFFFFF; }
.introduction8 .con{ max-width: 1030px; padding: 0px 15px; width: 100%; margin: 0 auto; }
.introduction8 .con .leftimg{ float: left; width:42%;}
.introduction8 .con .text{  float: right; width:54%; padding-top:30px; font-size: 15px; line-height:24px;}
.introduction8 .con .text .font22{ font-size: 22px; line-height: 30px;}
@media screen and (max-width:640px){
	.introduction8 .con .leftimg{ width: 100%; text-align: center;}
	.introduction8 .con .text{ width: 100%; font-size: 13px; line-height: 22px;}
	.introduction8 .con .text .font22{ font-size:18px; line-height:28px;}
}
