body{background-color: #e6e6e6}
/*头部*/
#header{width: 100%;background-color: rgba(255,255,255,0.5);position: fixed;top: 0;z-index: 999;transition: all 0.3s}
#header.fixed{background-color: #fff;box-shadow:0 0 20px rgba(0,0,0,0.1)}
#header .mainbox{height: 100px;box-sizing: border-box;overflow: hidden;padding-top: 32px}
#header .logo{width: 265px;float: left;display: inline-block;vertical-align: middle;}
#header .right{float: right;}
#header .right .nav{float: left; }
#header .right .nav li{float: left;padding: 0 45px;position: relative;}
#header .right .nav li a{font-size: 16px;line-height: 36px;color:#333;transition: color 0.3s}
#header .right .nav li a:after{content: '';width: 16px;height: 15px;background-size: 100%;position: absolute;top: 36px;left: 0;right: 0;margin:auto;}
#header .right .nav li a.active{color: #c30d23;}
#header .right .nav li a.active:after{background-image: url(../images/nav_on_star.png);}
#header .right .nav li a:hover{color: #c30d23;}
#header .right .music{float: right;width: 36px;height: 36px;border-radius: 50%;background-image: url(../images/music_off.png);background-size: 28px;background-position: center;cursor: pointer;}
#header .right .music.play{background-image:url(../images/music.png)}
/*页面*/
#page{width: 100%;height: auto;background-size:100% auto;background-position: center top;background-repeat: repeat;}
/*banner*/
.banner{width: 100%;height: 940px;background-size: cover;background-position: center bottom;background-color: #ccc}
.banner .mainbox{height: 100%;display: flex;align-items: center;justify-content: flex-end;}
.banner .mainbox .txtbox{width: auto;}
.banner .mainbox .txtbox .txt1{width: 513px;margin:0 auto;}
.banner .mainbox .txtbox .txt2{width: 548px;margin:15px auto 0;}
.banner .mainbox .txtbox .txt3{width: 521px;margin:36px auto 0;}
.banner .mainbox .txtbox .txt4{width: 430px;margin:28px auto 0;}
.banner .mainbox .txtbox .btn{display: block;margin:50px auto 0;overflow: hidden;width: 380px}
.banner .mainbox .txtbox .btn a{width: 140px;height: 44px;float: left;}
.banner .mainbox .txtbox .btn a.video{margin-left: 100px;}
/*主体内容*/
.container{width: 100%;padding-bottom: 80px}
.container .section {overflow: hidden;}
.container .mainbox .title{line-height: normal;text-align: center;margin-top: 100px}
.container .mainbox .title img{width: 277px;display: inline-block;}
.container .mainbox .tab{width: 100%;text-align: center;margin-top:30px;position: relative;}
.container .mainbox .tab a{display: inline-block;line-height: 42px;font-size: 20px;color: #454545;margin:0 30px;position: relative;transition: color 0.3s}
.container .mainbox .tab a:after{content: '';width: 44px;height: 4px;position: absolute;left: 0;right: 0;bottom: 0;margin:auto;}
.container .mainbox .tab a.active{color: #d0121b}
.container .mainbox .tab a.active:after{background-color: #d0121b}
.container .mainbox .tab a:hover{color: #d0121b}
.container .mainbox .tab a.more{color: #999;position: absolute;right: 0;top: 0;font-size: 16px;}
.container .mainbox .tab a.more em{line-height: 42px;font-size: 16px;font-family: "宋体";color: #999;transition: color 0.3s;}
.container .mainbox .tab a.more:hover{color: #d0121b}
.container .mainbox .tab a.more:hover em{color: #d0121b}
/*剧目剧情*/
.section1{}
.section1 .tabcon{width: 100%;box-sizing: border-box;padding: 0 60px 0 180px;overflow: hidden;margin-top: 30px}
.section1 .tabcon .text{width: 720px;float: left;}
.section1 .tabwrap{width: 100%;display: none}
.section1 .tabwrap.active{display: block;}
.section1 .tabwrap p{text-indent: 2em;font-size: 16px;line-height: 32px;color: #454545;}
.section1 .tabcon .imgbox{overflow:hidden;margin-left: 22px;width: 414px;float: right;padding-top: 10px}
.section1 .tabcon .imgbox img{float: left;background-color: #ccc}
.section1 .tabcon .imgbox .img1{width: 198px;}
.section1 .tabcon .imgbox .img2{width: 196px;float: right;}
.section1 .tabcon .imgbox .img3{width: 169px;margin-top: 20px;margin-left: 30px}
/*主创主演*/
.section2{}
.section2 .tabcon{width: 100%;margin-top: 40px;padding-bottom: 20px}
.section2 .tabcon .swiper-slide{background-color: #ccc}
.section2 .tabwrap{width: 100%;position: relative;box-sizing: border-box;padding: 0 40px;display: none}
.section2 .tabwrap.active{display: block;}
.section2 .swiper-button-next{right: 0;top: 45%}
.section2 .swiper-button-prev{left: 0;top: 45%}
.section2 .tabwrap .swiper-pagination{left: 0;right: 0;margin: auto;height: 10px;bottom: -20px}
.section2 .tabwrap .swiper-pagination-bullet{width: 10px;height: 10px;background-color: #999;opacity: 1;margin:0 14px;vertical-align: top;}
.section2 .tabwrap .swiper-pagination-bullet-active{background-color: #d0121b}
.swiper-button-next:after, .swiper-button-prev:after{font-size: 20px;font-weight: bold;color: #999}
.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity: 1}
.swiper-button-next.swiper-button-disabled:after,.swiper-button-prev.swiper-button-disabled:after{color: #d0121b}
.section2 .tabwrap .swiper-container{padding: 0 20px 20px}
.section2 .tabwrap .img{position: relative;width: 100%;}
.section2 .tabwrap .img img{background-color: #ccc}
.section2 .tabwrap .img .hide{background-color: transparent;width: 160px;height: 80px;position: absolute;bottom: 0;right: 0;box-sizing: border-box;transition: all 0.3s;overflow:hidden;opacity: 0}
.section2 .tabwrap .img .hide h3{font-size: 16px;line-height: 26px;color: #fff;padding: 15px 20px 0}
.section2 .tabwrap .img .hide p{font-size: 14px;line-height: 26px;color: #fff;padding: 0 20px 15px }
.section2 .tabwrap .img:hover .hide{opacity: 1;background-color: rgba(208,18,27,0.8);bottom: -20px;right: -20px}
/*舞美效果*/
.section3{margin:0 -10px;}
.section3 .tabcon{margin-top: 33px;overflow: hidden;}
.section3 .tabcon .img{padding:10px;overflow: hidden;cursor: pointer;}
.section3 .tabcon .img img{background-color: #ccc;transition: all 0.3s}
.section3 .tabcon .img1{width: 526px;float: left;}
.section3 .tabcon .img2{width: 250px;}
.section3 .tabcon .img3{width: 250px;}
.section3 .tabcon .img4{width: 334px;float: left;padding-top: 7px}
.section3 .tabcon .img5{width: 440px;float: left;padding-top: 7px}
.section3 .tabcon .img6{width: 585px;padding-left: 9px}
.section3 .tabcon .img7{width: 281px;float: left;padding-left: 9px}
.section3 .tabcon .img8{width: 284px;}
.section3 .tabcon .img9{width: 284px;}
.section3 .tabcon .left{float: left;width: 816px}
.section3 .tabcon .img2box{float: left;}
.section3 .tabcon .img8box{float: left;}
.section3 .tabcon .right{float: right;}
.section3 .tabcon .img>div{width: 100%;height: 100%;overflow: hidden;}
.section3 .tabcon .img:hover img{transform: scale(1.1);}
/*幕后精彩*/
.section4{margin:0 -10px;}
.section4 .tabcon{margin-top: 33px;overflow: hidden;}
.section4 .tabcon .img{padding:10px;overflow: hidden;box-sizing: border-box;cursor: pointer;}
.section4 .tabcon .img img{background-color: #ccc;transition: all 0.3s}
.section4 .tabcon .top{display: flex;}
.section4 .tabcon .top .row1>.img{flex-basis: 50%}
.section4 .tabcon .top .row2{flex-wrap: wrap;}
.section4 .tabcon .top .row2 .img{flex-basis: 100%}
.section4 .tabcon .top .row1 .row{flex-basis: 100%;display: flex;}
.section4 .tabcon .top .row .vid{padding: 10px;overflow: hidden;box-sizing: border-box;cursor: pointer;}
.section4 .tabcon .top .row1 .row .img4 video{width: 100%;height: 100%;}
.section4 .tabcon .bot{display: flex;}
.section4 .tabcon .bot .row1{display: flex;flex-wrap: wrap;flex-basis:43.661%}
.section4 .tabcon .bot .row1 .row{flex-basis: 100%;display: flex;}
.section4 .tabcon .bot .row2{flex-basis:56%;display: flex;}
.section4 .tabcon .img>div{width: 100%;height: 100%;overflow: hidden;}
.section4 .tabcon .img:hover img{transform: scale(1.1);}
.section4 .tabcon .top .row1 .row .vid img{background-color: #ccc;transition: all 0.3s}
.section4 .tabcon .top .row1 .row .vid>div{width: 100%;height: 100%;overflow: hidden;position: relative;}
.section4 .tabcon .top .row1 .row .vid:hover>div>img{transform: scale(1.1);}
.section4 .tabcon .top .row1 .row .vid>div .vid1{position: absolute;left: 0;width: 50%;top: 0;bottom:0;height: 100%;display: flex;align-items: center;justify-content: center;}
.section4 .tabcon .top .row1 .row .vid>div .vid2{position: absolute;right: 0;width: 50%;top: 0;bottom:0;height: 100%;display: flex;align-items: center;justify-content: center;}
.section4 .tabcon .top .row1 .row .vid>div .play{width: 72px;margin:0 auto;}
.section4 .tabcon .top .row1 .row .vid>div .play img{background-color: transparent;}
.section4 .tabcon .top .row1 .row .vid>div .vid1 p{font-size: 20px;line-height: 35px;color: #fff;text-align: center;margin-top: 50px}
.section4 .tabcon .top .row1 .row .vid>div .vid2 p{font-size: 20px;line-height: 35px;color: #fff;text-align: center;margin-top: 50px}
/*媒体报道*/
.section5{}
.section5 .tabcon{width: 72%;margin:21px auto 0;}
.section5 .tabcon .item{width: 100%;display: flex;align-items: center;justify-content: space-between;color: #454545;padding: 14px 0}
.section5 .tabcon .item span{font-size: 16px;line-height: 30px;}
.section5 .tabcon .item em{font-size: 14px;line-height: 30px;margin-left: 80px;flex-shrink: 0}
.section5 .tabcon .item:hover{color: #d0121b}

/*底部*/
#footer{padding: 48px 0;background-image: url(../images/footerbg.png);background-size: cover;}
#footer .mainbox{overflow: hidden;width: 1197px;display: flex;align-items: center;justify-content: space-between;}
#footer .left{float: left;width: 422px;}
#footer .left .weibo{display: block;width: 100%;margin-bottom: 14px}
#footer .con{float: right;width: 669px;}

/* 查看图片 */
#imgshowbox{position: fixed;top: 0;bottom: 0;left: 0;right: 0;z-index: 9999;display: none;}
#imgshowbox .shadow{position: absolute;top: 0;bottom: 0;left: 0;right: 0;background-color: rgba(0,0,0,0.85);}
#imgshowbox .warp{height: 75%;width: 1230px;max-height: 650px;position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin:auto;box-sizing: border-box;padding: 0 60px;}
#imgshowbox .warp .close{position: absolute;right: -60px;top: 0;width: 40px;height: 40px;background-size: cover;background-position: center;cursor: pointer;background-image: url(../images/close.png);}
#imgshowbox .swiper-slide img{width: auto;max-width: 100%;max-height: 100%; position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);background-color: #ccc}
#imgshowbox .swiper-container{height: 100%;overflow: hidden;width: 100%;}
#imgshowbox .swiper-wrapper{height: 100%}
#imgshowbox .swiper-slide{height: 100%;}
#imgshowbox .swiper-button-next{right: 0;width: 30px;height: 40px;background-image: url(../images/icon-next.png);background-size: 25px 40px;transition: opacity 0.3s}
#imgshowbox  .swiper-button-prev{left: 0;width: 30px;height: 40px;background-image: url(../images/icon-prev.png);background-size: 25px 40px;transition: opacity 0.3s}
#imgshowbox .swiper-button-next:after,#imgshowbox  .swiper-button-prev:after{display: none;}
#imgshowbox .swiper-button-next.swiper-button-disabled,#imgshowbox .swiper-button-prev.swiper-button-disabled{opacity: 0.4}

#videoshowbox{position: fixed;top: 0;bottom: 0;left: 0;right: 0;z-index: 9999;display: none;}
#videoshowbox .shadow{position: absolute;top: 0;bottom: 0;left: 0;right: 0;background-color: rgba(0,0,0,0.85);}
#videoshowbox .warp{height: 75%;width: 975px;max-height: 650px;position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin:auto;box-sizing: border-box;}
#videoshowbox .warp .video{width: 100%;height: 100%;display: flex;align-self: center;}
#videoshowbox .warp .video video{width: 100%;}
#videoshowbox .warp .close{position: absolute;right: -60px;top: 0;width: 40px;height: 40px;background-size: cover;background-position: center;cursor: pointer;background-image: url(../images/close.png);}

@media screen and (max-width:1596px){
	#header .right .nav li{padding: 0 30px}
    .section1 .tabcon{padding: 0 4% 0 12%;}
    .section1 .tabcon .text{width:62%}
    .section1 .tabcon .imgbox{width: 36%;margin-left: 2%}
    .section1 .tabcon .imgbox .img1{width: 48%}
    .section1 .tabcon .imgbox .img2{width: 47%}
    .section1 .tabcon .imgbox .img3{width: 40%}
    .section3 .tabcon{display: flex;}
    .section3 .tabcon .img{width: auto;}
    .section3 .tabcon .row{display: flex;}
    .banner{height: 650px;}
    .banner .mainbox .txtbox{margin-top: 30px}
    .banner .mainbox .txtbox .txt1{width: 413px}
    .banner .mainbox .txtbox .txt2{width: 438px}
    .banner .mainbox .txtbox .txt3{width: 416px;margin-top: 15px;}
    .banner .mainbox .txtbox .txt4{width: 344px;margin-top: 15px;}
    .banner .mainbox .txtbox .btn{margin-top: 30px;width: 320px;}
    .banner .mainbox .txtbox .btn a.video{margin-left: 40px}
    .section4 .tabcon .top .row1 .row .vid>div .vid1 p{font-size: 16px;margin-top: 30px}
    .section4 .tabcon .top .row1 .row .vid>div .vid2 p{font-size: 16px;margin-top: 30px}
}
@media screen and (max-width:1360px){
	#footer .mainbox{width: 90%}
	#footer .left{width: 35%}
	#footer .con{width: 56%}
    #imgshowbox .warp{width: 1095px}
    #imgshowbox .warp .close{top: -40px;right: 0}
}
@media screen and (max-width:1260px){
    #header .right .nav li{padding: 0 15px}
}