html, body { width: 100%; height: 100%; }
body { background: url(../Upload/Images/山@2x.png) no-repeat center 100% #ccc !important; }
.title01 { height: 285px; position: relative; }
.bg01, .bg02, .bg03 { position: absolute; }
.bg01 { top: 25.6%; right: 18%; }
.bg02 { top: 52.6%; left: 9.6%; }
.bg03 { top: 62.4%; right: 5.5%; }
.title01Text { width: 344px; height: 84px; background: url(../Upload/Images/title@2x.png) no-repeat center; line-height: 84px; text-align: center; font-size: 40px; font-weight: bold; color: #363636; margin: 131px auto 0; font-family: "SimSun"; }
.title02Text { background: url(../Upload/Images/title2@2x.png) no-repeat center; }
.loginWrapper { width: 567px; height: 464px; padding: 15px; box-sizing: border-box; background: rgba(230,230,230,.5); margin: 0 auto; }
.login { background: #eaeaea; height: 100%; }
.login > div { padding: 0 50px; position: relative; }
.login > div:first-child { margin-top: 30px; }
.login > div p { margin: 15px 0; color: #6c6c6c; font-size: 24px; }
.login > div i { position: absolute; left: 64px; bottom: 14px; }
.login > div input { width: 430px; height: 48px; background: #fff; border: 2px solid #dddddd; text-indent: 49px; font-size: 16px; line-height: 48px; }
.login > div.yz input { width: 216px; text-indent: 23px; border-color: #ffd7ae; }
.login > div input[type=button] { width: 100%; height: 49px; background: #c39f64; color: #fff; font-size: 23px; text-indent: 0; margin-top: 28px; line-height: 40px; }
.sourceWrapper { display: flex; justify-content: space-around; flex-wrap: wrap; padding: 0 84px; }
.sourceWrapper a { display: block; margin: 0 22px 54px; }
.sourceWrapper a img { width: 131px; height: 180px; }
.crumb { margin: 50px 0 0 0; }
.crumb > span, .crumb > span a { display: inline-block; color: #666; }
.crumb > span.active { color: #333; }
.crumb > span + span:before { padding: 0 5px; color: #333; content: ">"; }
.listTab { margin: 19px 0 0 0; padding: 6px 22px; border: 1px solid #dbdbdb; background: #fff; border-radius: 3px; }
.listTab > div { font-size: 17px; line-height: 38px; }
.listTab > div:first-child { margin-right: 25px; height: 100%; }
.listTab > .listFont { padding-left: 76px; }
.listTab > .listFont a { display: inline-block; margin-right: 25px; }
.listTab > .listFont a.active { color: #c39f64; }
.blockWrapper { margin: 34px 0 0 0; display: flex; justify-content: space-between; flex-wrap: wrap; }
.blockWrapper > a { width: 256px; box-shadow: 0 0px 5px #ccc; background: #fff; border-radius: 3px; margin-bottom: 20px; }
.blockWrapper > a p { line-height: 25px; margin: 4px 10px; color: #333; }
.mark { color: #ffa609; }
.blockPagination { display: flex; justify-content: center; }
.blockPagination a { padding: 0 12px; height: 37px; line-height: 37px; border: 1px solid #d9d9d9; color: #999; background: #fff; margin: 0 5px; }
.blockPagination a:hover { color: inherit !important; }
.blockPagination a.active { border-color: #c39f64; color: #333; background: #c39f64; }
.playWrapper { padding: 30px; height: auto; border: 1px solid #c39f64; background: #fff; margin-bottom: 30px; }

#container { height: 594px; width: 100%; background: #ccc; margin-bottom: 20px; }
.playTitle { font-size: 27px; color: #c39f64; margin-bottom: 12px; }
.playAuthor, .playBrief { font-size: 17px; color: #333; line-height: 20px; margin-bottom: 10px; }
.playList { height: auto; border: 1px solid #c39f64; background: #fff; margin-bottom: 30px; padding-bottom: 20px; }
.playList p { line-height: 48px; border-bottom: 1px solid #c39f64; font-size: 17px; font-weight: bold; text-indent: 28px; }
.playList ul { margin-top: 20px; padding: 0 30px; }
.playList ul li + li { margin-top: 20px; text-indent: 50px; }
.playList ul li { line-height: 20px; font-size: 17px; position: relative; }
.playList ul a.active { color: #64c381 !important; }
.playList ul a.active:before { position: absolute; content: '正在播放...'; color: #64c381; font-size: 14px; right: 0; bottom: 2px; }
.playList ul a.active:after { position: absolute; content: ''; width: 0; height: 0; border: 6px solid transparent; border-left: 8px solid #64c381; left: 18px; top: 3px; }

.videoTitle { margin-top: 10.8%; font-size: 28px; color: #333; }
.videoWrapper { width: 100%; height: auto; overflow: hidden; margin-top: 28px; }
.videoCover, .videoCover img { width: 802px; height: 525px; }
.videoInfo { float: right; width: 278px; height: 525px; background: #333; }
.videoInfo h4 { color: #c39f64; font-size: 22px; padding: 24px 40px 16px 21px; }
.videoInfo p.author { padding: 0 0 0 21px; font-size: 17px; color: #fff; }
.videoList { height: 386px; background: #2d2d2d; margin-top: 20px; }
.videoList p { line-height: 48px; font-size: 17px; font-weight: bold; color: #fff; text-indent: 22px; border-bottom: 1px solid #26262b; }
.videoList ul { padding: 0 21px; color: #999; }
.videoList ul li { line-height: 26px; }
.videoList ul li + li { padding-left: 49px; overflow: hidden; -ms-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; }
.videoList ul li a { color: #999; }
.videoBrief { padding: 28px 25px; background: #26262b; color: #fff; font-size: 17px; }