body { background: url("../images/bg_45.jpg") center top no-repeat;}

.main, .side { float: left; margin: 35px 0 0; width: 790px; height: 792px; box-sizing: border-box; padding: 30px 30px 0; background: url("../images/bg_46.png") repeat-x;}
.side { float: right; width: 480px; padding: 30px 22px 0;}
.title { font-size: 24px; line-height: 24px;}
.main .title { padding-left: 16px; background: url("../images/bg_47.png") left center no-repeat;}

.footer { margin-top: 70px;}

.videolist li { height: 112px; overflow: hidden; margin-top: 20px;}
.videolist li img { float: left; width: 200px; height: 112px; border-radius: 5px; margin-right: 20px;}
.videolist li strong { display: block; margin-top: 7px; font-size: 18px; line-height: 20px; color: #333; font-weight: normal; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.videolist li p { margin-top: 14px; font-size: 14px; line-height: 16px; color: #999; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.videolist li span { display: block; margin-top: 35px; font-size: 14px; line-height: 16px; color: #666; padding-left: 22px; background: url("../images/icon_51.png") left center no-repeat; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}

.side .videolist li strong { margin-top: 1px; line-height: 30px; white-space:normal; height:60px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.side .videolist li span { margin-top: 30px;}

.videoframe { width: 100%; height: 760px; margin-top: 35px; overflow: hidden; background: #333;}
.videoframe .content { float: left; width: 790px;}
.videoframe .content video { display: block; width: 100%; height: 445px; background: #333;}
.videoframe .content strong { display: block; font-size: 24px; line-height: 26px; font-weight: normal; color: white; padding: 18px 0 30px 25px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.videoframe .content p { font-size: 16px; line-height: 30px; color: #ccc; padding-left: 25px; height:150px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical;}
.videoframe .content .share { float: left; margin: 30px 0 0 25px;}

.videoframe .tab { float: right; width: 460px; margin-right: 20px;}
.videoframe .tabnav { font-size: 24px; line-height: 34px; color: white; margin-top: 20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.videoframe .tabnav span { float: left; font-size: 18px; line-height: 32px; margin-right: 30px; cursor: pointer;}
.videoframe .tabnav span.current, .videoframe .tabnav span:hover { color: #ff7735; border-bottom: #ff7735 2px solid;}
.videoframe .tabcontent { width: 100%; height: 680px; margin-top: 26px;}
.videoframe .swiper-container { width: 100%; height: 100%;}
.videoframe .swiper-slide { height: auto;}
.videoframe .swiper-scrollbar { width: 6px; height: 640px; background: #464646; right: 0; top: 0;}
.videoframe .swiper-scrollbar-drag { height: 240px; background: #7a7a7a; cursor: grab;}

.videoframe .videolist li { padding-right: 24px;}
.videoframe .videolist li:first-child { margin-top: 0;}
.videoframe .videolist li:last-child { margin-bottom: 20px;}
.videoframe .videolist li strong { margin-top: 1px; line-height: 30px; color: white; white-space:normal; height:60px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.videoframe .videolist li strong a { color: white;}
.videoframe .videolist li strong a:hover { color: #ae4184;}
.videoframe .videolist li span { margin-top: 30px; color: white; background-image:url("../images/icon_49.png");}
