@charset "utf-8";

.header.on {
	position: fixed;
	top: 0;
	z-index: 10000;
}

.scrollWrap {
	height: 72px;
	width: 100%;
}

.videoCont .scrollWrap {
	height: 72px;
}

.videoWrap {
	width: 100%;
	background-image: url(../images/playBg.jpg);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	padding-bottom: 24px;
}

.videoWrap .video {
	width: 100%;
	max-height: 516px;
}

.videoContent {
	background-color: #000;
	position: relative;
	overflow: hidden;
}

.videoWrap .title .txt {
	height: 42px;
	line-height: 42px;
	padding-top: 10px;
	font-size: 16px;
	color: #c9c9c9;
	;
}

.videoWrap .title .txt a {
	color: #c9c9c9;
	;
}

.videoWrap .title .txt a:hover {
	text-decoration: underline;
}

.curseInfo .title {
	height: 40px;
	line-height: 40px;
	font-size: 16px;
	color: #131313;
	font-weight: normal;
	border-bottom: 1px solid #e1e1e1;
	position: relative;
}

/*top*/
.top {
	width: 100%;
	height: 70px;
	background: url(../images/video/listen_t_bg.png) repeat-x;
	z-index: 99;
	position: absolute;
	top: 0;
	left: 0
}

.top_box {
	height: 100%;
	margin: 0 auto
}

.top_box .logo {
	width: 380px;
	height: 42px;
	margin-top: 14px;
	position: relative
}

.top_box .logo img {
	width: 100%;
	height: 100%
}

.top_box .logo a {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 11
}

.top_r {
	width: 500px;
	height: 44px;
	margin-top: 13px;
	position: relative;
	text-align: right;
	line-height: 44px;
	color: #fff;
}

.top_r .contact {
	width: 48px;
	height: 44px;
	position: absolute;
	right: 0;
	top: 0
}

.top_r a {
	font-family: "microsoft yahei";
	color: #fff;
	text-align: center;
	line-height: 28px;
}

.top_r .login_but {
	display: block;
	width: 70px;
	height: 30px;
	border: 1px solid #fff;
	position: absolute;
	right: 95px;
	top: 6px
}

.top_r .login_zc {
	display: block;
	width: 70px;
	height: 30px;
	border: 1px solid #fff;
	position: absolute;
	right: 0px;
	top: 6px
}

/*video*/
.video_box {
	width: 100%;
	background: url(../images/video/bg_ceping.png) repeat;
	padding-top: 70px;
	box-sizing: border-box
}

.video_box .video_bar {
	margin: 0 auto
}

.video_bar p {
	height: 40px;
	line-height: 50px;
	color: #8b8b8b
}

.video_bar h3 {
	font-size: 20px;
	color: #fff;
	height: 40px;
	line-height: 30px
}

.video_bg {
	width: 100%;
	background: #000;
	padding: 6px;
	box-sizing: border-box;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4)
}

.share {
	margin-top: 14px;
	height: 24px;
	line-height: 24px
}

.share span {
	display: block;
	width: 60px;
	height: 24px;
	text-indent: 24px;
	color: #fff;
	background: url(../images/video/listen_bg_share.png) no-repeat left center
}

.bdsharebuttonbox a {
	margin: 0 4px 0 0 !important
}

.video_con img {
	width: 100%;
	height: 100%
}

/*content*/
.content {
	margin: 20px auto
}

.con_l .list1,
.con_l .list2,
.con_l .list3 {
	padding: 0 20px;
	box-sizing: border-box;
	border: 1px solid #e1e1e1;
	background: #fff;
	position: relative;
}

.con_l .list2 h3,
.con_l .list3 h3,
.teacher_info h3 {
	height: 42px;
	line-height: 42px;
	border-bottom: 1px solid #e1e1e1;
	padding-left: 10px;
}

.con_l .list2 .atcle2 {
	color: #131313;
	line-height: 24px;
	text-indent: 3em;
	padding: 14px 0;
}

.con_l .list2 .icon,
.con_l .list3 .icon,
.teacher_info h3 .icon {
	position: absolute;
	display: inline-block;
	width: 4px;
	height: 16px;
	background: #ff1e1e;
	border-radius: 4px;
	left: 20px;
	top: 12px;
}

.teacher_info h3 .icon {
	left: 10px;
}

.con_l .list3 .icon {
	background: #1e29ff;
}

.con_l .list3 {
	padding-bottom: 20px;
}

.con_l .list3 .item {
	padding: 0 0 0 12px;
}

.con_l .list3 .item .title {
	height: 50px;
	line-height: 50px;
	border-bottom: 1px solid #e1e1e1;
	padding: 0 20px 0 0;
}

.con_l .list3 .item .title:hover {
	cursor: pointer;
	background: #f1f1f1;
}

.con_l .list3 .item .title .iconfont {
	color: #ff8519;
	position: absolute;
	right: 20px;
	transition: all 0.4s;
}

.con_l .list3 .item.on .title .iconfont {
	transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	/* IE 9 */
	-moz-transform: rotate(-90deg);
	/* Firefox */
	-webkit-transform: rotate(-90deg);
	/* Safari 和 Chrome */
	-o-transform: rotate(-90deg);
	/* Opera */
}

.titleTop {
	padding-top: 20px;
	color: #c2c2c2;
	font-size: 16px;
}

.titleTop a {
	color: #c2c2c2;
	font-size: 16px;
}

.titleTop .sequences {
	font-size: 16px;
	color: #c2c2c2;
	margin-top: 10px;
	margin-bottom: 14px;
}

.sequence {
	display: inline-block;
	width: 24px;
	height: 24px;
	line-height: 24px;
	color: #fff;
	background: #ff8519;
	text-align: center;
	border-radius: 100%;
	margin-right: 10px;
}

.list3 .item .catalogList {
	padding: 0 14px 0 34px;
}

/* .list3 .item .catalogList {
	display: none;
} */

.catalogList .pr .trySeeBtn:hover {
	cursor: pointer;
}

/* .list3 .item.on .catalogList{display:block;} */
.list3 .childItem.active .litterTitle {
	color: #ff8519;
}

.list3 .childItem p {
	line-height: 28px;
}

/* .curseInfo .list3 .childItem:hover {
	color: #ff8519;
	cursor: pointer;
} */
.curseInfo .list3 .childItem .playVideoBtn {
	display: none;
}

.curseInfo .list3 .childItem .playVideoBtn:hover {
	cursor: pointer;
}

.playExam .examRemind {
	width: 360px;
	margin-top: 20px;
}

.catalogList.on.con_l .hd h3 {
	line-height: 60px;
	font-size: 24px;
	color: #333
}

.con_l .hd span a {
	transition: 0.4s;
	display: block;
	font-size: 16px;
	font-family: "microsoft yahei";
	width: 112px;
	height: 36px;
	float: right;
	border: 1px solid #ff1e1e;
	border-radius: 4px;
	line-height: 34px;
	text-align: center;
	color: #ff1e1e;
	margin: 18px 14px 0 0;
}

.con_l .hd span a:hover {
	background: #ff1e1e;
	border-color: #ff1e1e;
	color: #fff
}

.con_l .hd span a.addShopCartBtn.disabled {
	background: #ccc;
	color: #fff;
	border: 1px solid #ccc;
}

.con_l .hd span a.addShopCartBtn.disabled:hover {
	cursor: no-drop;
	background: #ccc;
	color: #fff;
}

.con_l .hd span p {
	width: 370px;
	height: 20px;
	margin-top: 16px;
	font-size: 12px;
	float: left
}

.con_l .bd h2 {
	font-size: 24px;
	height: 60px;
	line-height: 60px;
	color: #333;
	border-bottom: 1px solid #e1e1e1
}

/*课程简介*/
.lesson_info {
	width: 100%;
	border: 1px solid #ddd;
	background: #fff;
	padding: 10px;
	box-sizing: border-box
}

.lesson_info h3 {
	height: 40px;
	line-height: 36px;
	border-bottom: 1px solid #ddd
}

.lesson_info .atcle2 {
	text-indent: 28px;
	line-height: 24px
}

/*讲师简介*/
.teacher_info {
	width: 100%;
	border: 1px solid #ddd;
	background: #fff;
	padding: 0 10px 10px 10px;
	box-sizing: border-box;
	position: relative;
}

.teacher_info .atcle {
	text-indent: 28px;
	line-height: 24px;
}

.teacherInfoTxt {
	padding: 16px 0;
}

/*切换*/
.zt_qiehuan {
	width: 100%;
	margin-top: 20px;
	background: #fff;
	border: 1px solid #ddd;
	padding: 10px;
	box-sizing: border-box
}

.zt_qiehuan .hd {
	padding-top: 10px;
	box-sizing: border-box
}

.zt_qiehuan .hd ul li {
	line-height: 32px;
	height: 32px;
	cursor: pointer
}

.zt_qiehuan .hd ul li a {
	display: block;
	width: 100%;
	height: 32px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.zt_qiehuan .hd ul li.on a {
	color: #ff9f38
}

/*课程描述*/
.kc_ms {
	padding: 20px 0 0;
	box-sizing: border-box
}

.kc_ms p {
	line-height: 28px;
	margin: 10px 0;
	text-indent: 28px;
}

.kf_box_pf {
	width: 150px;
	height: 420px;
	height: 388px;
	position: fixed;
	top: 50%;
	*padding-top: 61px;
	margin-top: -210px;
	right: 10px;
	background: url(../images/video/online_serve.png) no-repeat left top;
	z-index: 9999;
	font-family: "microsoft YaHei"
}

.click_close {
	display: block;
	width: 15px;
	height: 15px;
	background: url(../images/video/online_close_icon.png) no-repeat left center;
	position: absolute;
	top: -4px;
	right: -4px;
	cursor: pointer;
	transition: all 0.4s;
	-moz-transition: all 0.4s;
	-webkit-transition: all 0.4s;
	-o-transition: all 0.4s
}

.click_close:hover {
	transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-o-transform: rotate(360deg)
}

.online_serve_box {
	width: 148px;
	height: 358px;
	*margin-top: 0 !important;
	margin-top: 61px;
	background: #f2ede4;
	border: 1px solid #bfaf93;
	border-top: none !important
}

.online_serve_box ul li {
	width: 148px;
	height: 48px;
	border-bottom: 1px dotted #cbbda3
}

.online_serve_box ul li a {
	display: block;
	width: 146px;
	height: 46px;
	line-height: 46px;
	margin: 1px;
	background: url(../images/video/qq_kefu_icon1.png) no-repeat 10px center;
	text-align: center;
	font-size: 16px;
	color: #4b4435
}

.online_serve_box ul li a:hover {
	background: url(../images/video/qq_kefu_icon2.png) no-repeat 10px center #d1c6b1;
	color: #642b0e
}

.online_serve_box .zj_ewm_box {
	width: 100%;
	height: 140px;
	margin-top: 5px
}

.online_serve_box .zj_ewm_box img {
	width: 100%;
	height: 100%
}

.online_serve_box p {
	line-height: 24px;
	text-align: center;
	color: #4b4435;
	margin-top: 5px
}

@media screen and (min-width:980px) {

	/*top*/
	.top_box {
		width: 1180px
	}

	/*video*/
	.video_box {
		height: 867px;
		*height: 800px;
	}

	.video_box .video_bar {
		width: 1200px;
		height: 790px
	}

	.video_bg {
		height: 665px;
		*height: 653px;
		*width: 1188px
	}

	.video_con {
		width: 1188px;
		height: 653px
	}

	/*content*/
	.content {
		width: 1180px
	}

	.con_l {
		width: 780px;
		*width: 780px;
		height: 100%
	}

	.user_eva {
		width: 750px
	}

	.evaluation_info {
		*width: 850px !important
	}

	.huifu_box {
		*width: 750px !important
	}

	.huifu_in {
		*width: 732px !important
	}

	.con_r {
		width: 380px
	}

	.playExam {
		width: 380px;
	}

	.lesson_info {
		*width: 250px
	}

	.zt_qiehuan {
		*width: 250px;
		height: 312px;
		*height: 285px
	}

	.kc_info {
		*width: 250px;
		height: 264px;
		*height: 244px;
	}

	/*讲师简介*/
	.teacher_info .photo_box .photo {
		display: block;
		margin-right: 20px;
		width: 128px;
		height: 128px;
		line-height: 128px;
	}

	.teacher_info .photo_box .photo img {
		width: 100%;
		height: 100%;
		/* vertical-align: middle; */
		border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		-o-border-radius: 50%;
		-webkit-border-radius: 50%
	}

	.teacher_info .photo_box p {
		font-weight: bold;
		color: #333;
		margin-top: 20px;
		line-height: 36px;
		font-size: 20px;
		font-weight: normal;
	}

	/*切换*/
	.zt_qiehuan .bd img {
		width: 248px;
		height: 120px
	}
}

@media screen and (max-width:1400px) {

	/*top*/
	.top_box {
		width: 1180px
	}

	/*video*/
	.video_box {
		height: 755px;
		*height: 690px
	}

	.video_box .video_bar {
		width: 1000px;
		height: 690px
	}

	.video_bg {
		height: 555px;
		*height: 543px;
		*width: 988px
	}

	.video_con {
		width: 988px;
		height: 543px
	}

	/*content*/
	.content {
		width: 1000px
	}

	.con_l {
		width: 780px;
		*width: 780px;
		height: 100%
	}

	.playExam {
		width: 380px;
	}

	.lesson_info {
		*width: 206px
	}

	.teacher_info {
		*width: 206px;
		height: 330px;
		*height: 310px
	}

	.zt_qiehuan {
		*width: 206px;
		height: 280px;
		*height: 258px
	}

	.kc_info {
		*width: 206px;
		height: 264px;
		*height: 244px;
	}

	/*讲师简介*/
	.teacher_info .photo_box {
		width: 100%;
		height: 68px;
		margin: 15px auto
	}

	.teacher_info .photo_box .photo {
		display: block;
		margin-right: 10px;
		width: 68px;
		height: 68px;
	}

	.teacher_info .photo_box .photo img {
		width: 100%;
		height: 100%;
		border-radius: 50%
	}

	.teacher_info .photo_box p {
		font-weight: normal;
		color: #333;
		margin-top: 10px;
		line-height: 24px
	}

	/*切换*/
	.zt_qiehuan .bd img {
		width: 204px;
		height: 90px
	}
}

/* 试看结束 */
.trySeeMask {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	z-index: 10000;
	background: rgba(0, 0, 0, 0.6);
	display: none;
}

.trySeeMask .cont {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 330px;
	height: 240px;
	margin-left: -165px;
	margin-top: -120px;
	color: #fff;
}

.trySeeMask .cont a {
	display: block;
	width: 228px;
	text-align: center;
	line-height: 36px;
	color: #fff;
	height: 36px;
	background-color: #ff8519;
	border-radius: 4px;
	margin-top: 18px;
	margin-left: 24px;
}

/* 播放器上列表 */
.playListWrap .listMenu {
	width: 10px;
	height: 68px;
	padding: 18px;
	background: rgba(1, 14, 15, 0.8);
	color: #fff;
	transition: 0.4s;
	position: absolute;
	left: -46px;
	top: 50%;
	margin-top: -58px;
}

.playListWrap .listMenu:hover {
	background: rgba(28, 28, 28, 0.8);
	cursor: pointer;
}

.listMenu .unfoldBtn {
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -8px;
}

.listWrap {
	position: absolute;
	width: 360px;
	right: 0px;
	right: -360px;
	z-index: 9999;
	top: 0;
	height: 516px;
	background: #383838;
}

.listWrap:hover {
	cursor: pointer;
}

.playTitle {
	background: #2f2f2f;
	color: #fff;
	font-size: 20px;
	padding: 14px 22px;
	border-bottom: 1px solid #0e0e0e;
}

.listCont {}

.listCont .item {
	transition: 0.4s;
}

.firstStair {
	padding: 10px 6px;
	position: relative;
}

.listCont .item h4:hover {
	background: #1c1c1c;
}

.courseImg {
	width: 120px;
	height: 82px;
}

.playListWrap .iconfont.icon-arrowLeft {
	color: #ff8519;
	position: absolute;
	right: 24px;
	transition: all 0.4s;
	transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-o-transform: rotate(180deg);
}

.playVideoBtn.icon-stop {
	color: #ff8519;
}

.playListWrap .item.on .firstStair .icon-arrowLeft,
.playListWrap .catalogList0 .childItem.on .icon-arrowLeft {
	transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
	-webkit-transform: rotate(270deg);
	-o-transform: rotate(270deg);
}

.listWrap .list3 .item .catalogList0 h4 {
	padding: 10px 20px 10px 12px;
	border-bottom: 1px solid #616161;
	color: #fff;
	position: relative;
}

.listWrap .list3 .item .catalogList1 {
	padding: 0 20px 0 44px;
}

.listWrap .catalogList1 .childItem:hover,
.listWrap .catalogList1 .childItem.active .litterTitle {
	color: #ff8519;
}

.listWrap .playVideoBtn:hover {
	cursor: pointer;
}

/* .listWrap .item .catalogList0 {
	display: none;
}

.listWrap .item .childItem .catalogList1 {
	display: none;
} */

.listCont,
#courseList {
	height: 454px;
	width: 100%;
	overflow-y: auto;
	overflow-x: hidden;
}

.listCont::-webkit-scrollbar,
#courseList::-webkit-scrollbar {
	width: 9px;
	height: 9px;
	border-radius: 4px;
	background-color: #f0f0f0;
}

.listCont::-webkit-scrollbar-track,
#courseList::-webkit-scrollbar-trac {
	background-color: #2f2f2f;
}

.trySeeBtn {
	display: block;
	width: 72px;
	height: 26px;
	line-height: 26px;
	position: absolute;
	top: 8px;
	font-size: 16px;
	right: -10px;
}

.videoCont .catalogList .trySeeBtn,
.videoCont .catalogList1 .trySeeBtn {
	width: 40px;
}

.opacity {
	opacity: 0;
}

/*滚动条中可以拖动的那部分*/
.listCont::-webkit-scrollbar-thumb,
#courseList::-webkit-scrollbar-thumb {
	background-color: #e1e1e1;
	border-radius: 4px;
}

.c13 {
	color: #131313;
}

.cc9 {
	color: #c9c9c9;
}

.cff {
	color: #ff1e1e;
}

.c82 {
	color: #828282;
}

.cf6 {
	color: #f6811b;
}
