.clearfix:after { clear: both; display: block; visibility: hidden; height: 0; content: "" } 
.fr { float:right; } 
/* layout */
.ks-row::after { display: block; clear: both; content: ''; } 

.ks-col-1 { width: 4.16667%; } 

.ks-col-2 { width: 8.33333%; } 

.ks-col-3 { width: 12.5%; } 

.ks-col-4 { width: 16.66667%; } 

.ks-col-5 { width: 20.83333%; } 

.ks-col-6 { width: 25%; } 

.ks-col-7 { width: 29.16667%; } 

.ks-col-8 { width: 33.33333%; } 

.ks-col-9 { width: 37.5%; } 

.ks-col-10 { width: 41.66667%; } 

.ks-col-11 { width: 45.83333%; } 

.ks-col-12 { width: 50%; } 

.ks-col-13 { width: 54.16667%; } 

.ks-col-14 { width: 58.33333%; } 

.ks-col-15 { width: 62.5%; } 

.ks-col-16 { width: 66.66667%; } 

.ks-col-17 { width: 70.83333%; } 

.ks-col-18 { width: 75%; } 

.ks-col-19 { width: 79.16667%; } 

.ks-col-20 { width: 83.33333%; } 

.ks-col-21 { width: 87.5%; } 

.ks-col-22 { width: 91.66667%; } 

.ks-col-23 { width: 95.83333%; } 

.ks-col-24 { width: 100%; } 

[class*=ks-col-] { float: left; box-sizing: border-box; } 

/* image */
.ks-image img { object-fit: cover; width: 100%; height: 100%; } 
/* button */
.ks-button { display: inline-block; line-height: 1; white-space: nowrap; cursor: pointer; background: #fff; border: 1px solid #dcdfe6; color: #606266; -webkit-appearance: none; text-align: center; box-sizing: border-box; outline: none; margin: 0; transition: .1s; font-weight: 500; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; padding: 12px 20px; font-size: 14px; border-radius: 4px; } 
.ks-button+.ks-button { margin-left: 10px; } 
.ks-button--primary { color: #fff; background-color: #4184f5; border-color: #4184f5; } 
.ks-button--success { color: #fff; background-color: #35bf57; border-color: #35bf57; } 
.ks-button--info { color: #fff; background-color: #909399; border-color: #909399; } 
.ks-button--medium { padding: 10px 20px; font-size: 14px; border-radius: 4px; } 
.ks-button--medium { padding: 10px 20px; font-size: 14px; border-radius: 4px; } 
.ks-button--small { padding: 9px 15px; font-size: 13px; border-radius: 3px; } 
.ks-button--mini { padding: 7px 15px; font-size: 12px; border-radius: 3px; } 


.ks-button--primary:focus, .ks-button--primary:hover { background: #5994f7; border-color: #5994f7; color: #fff; } 
.ks-button--success:focus, .ks-button--success:hover { background: #47cf69; border-color: #47cf69; color: #fff; } 
.ks-button--warning { background: #f59121; border-color: #f59121; color: #fff; } 
.ks-button--warning:focus, .ks-button--warning:hover { background: #f79930; border-color: #f79930; color: #fff; } 
/* tag */
.ks-tag { background-color: #ecf5ff; display: inline-block; height: 32px; padding: 0 10px; line-height: 30px; font-size: 12px; color: #409eff; border: 1px solid #d9ecff; border-radius: 4px; box-sizing: border-box; white-space: nowrap; } 
.ks-tag+.ks-tag { margin-left: 10px; } 
.ks-tag.ks-tag--warning { background-color: #fdf6ec; border-color: #faecd8; color: #e6a23c; } 
.ks-tag.ks-tag--success { background-color: #f0f9eb; border-color: #e1f3d8; color: #67c23a; } 
.ks-tag.ks-tag--info { background-color: #f4f4f5; border-color: #e9e9eb; color: #909399; } 
.ks-tag.ks-tag--danger { background-color: #fef0f0; border-color: #fde2e2; color: #f56c6c; } 
.ks-tag--medium { height: 28px; line-height: 26px; } 
.ks-tag--small { height: 24px; padding: 0 8px; line-height: 22px; } 
.ks-tag--mini { height: 20px; padding: 0 5px; line-height: 19px; } 


/*input*/
.ks-input { -webkit-appearance: none; background-color: #fff; background-image: none; border-radius: 4px; border: 1px solid #dcdfe6; box-sizing: border-box; color: #606266; display: inline-block; font-size: inherit; outline: none; padding: 0 15px; transition: border-color .2s cubic-bezier(.645,.045,.355,1); width: 100%; font-size: 14px; } 
.ks-input { height: 40px; line-height: 40px; } 
textarea.ks-input { height: 120px; padding:10px 15px; line-height: 24px; } 
.ks-input:hover { border-color: #c0c4cc; } 
.ks-input:focus { outline: none; border-color: #4184f5; } 
/*alert*/
.ks-alert { width: 100%; padding: 8px 16px; margin: 0; box-sizing: border-box; border-radius: 4px; position: relative; background-color: #f4f4f5; color: #909399; overflow: hidden; opacity: 1; align-items: center; } 
.ks-alert--success { background-color: #f0f9eb; color: #67c23a; } 
.ks-alert--warning { background-color: #fdf6ec; color: #e6a23c; } 
.ks-alert--error { background-color: #fef0f0; color: #f56c6c; } 
/*字数限制*/
.ks-input-limit { position: relative; } 
.ks-input-limit__text { position: absolute; right: 15px; bottom: 15px; color:#909399; } 


/*图片预览放大*/
.ks-preview { background: #000; width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 9999; overflow: hidden; } 
.ks-preview__pagination { position: fixed; left: 0; width: 100%; height: 32px; line-height: 32px; top: 0; text-align: center; color:#fff; z-index: 11; background:rgba(0,0,0,0.5) } 
.ks-preview .swiper-zoom-container img { max-width: 100%; max-height: 100%; position: relative; z-index: 10; } 
/*课时目录*/

.ks-catalog-title { font-size: 14px; background-color: #f5f7fa; border-bottom: 1px solid #e6e9ed; color:#787c82; position: relative; } 
a.ks-catalog-title__periodname { color:#787c82; display: block; } 
a.ks-catalog-title__periodname:hover { color:#4184f5; } 
.ks-catalog-title__lock { width: 30px; height: 50px; background: url(./images/catalog/lesson_icon_lock.png) no-repeat 50% 50%; float: right; margin-left: 10px; } 

.ks-catalog-title__th { height: 50px; line-height: 50px; overflow: hidden; padding: 0 20px; position: relative; z-index: 1; white-space: nowrap; text-overflow: ellipsis; } 
.ks-catalog-title__th--pointer { cursor: pointer; } 
.ks-catalog-title .ks-tag { margin-left: 10px; } 
.ks-catalog-title__time { float: right; margin-left: 10px; } 

.ks-catalog-title__money { float: right; margin-left: 20px; color:#f59121; } 
.ks-catalog-title__arrow { float: right; width: 50px; height: 50px; background: url(./images/catalog/lesson_icon_pulldown.png) no-repeat 50% 50%; cursor: pointer; position: relative; right: -20px; } 
.ks-catalog-title__arrow--pullup { background: url(./images/catalog/lesson_icon_pullup.png) no-repeat 50% 50%; } 
.ks-catalog-title .ks-button { float: right; position: relative; top:8px; margin-left: 20px; display: none; } 
.ks-catalog-chapter > .ks-catalog-title { font-size: 16px; background-image: url(./images/catalog/lesson_icon_chapter.png); background-repeat: no-repeat; background-position: 20px 50%; background-size:auto 14px; padding-left: 30px; } 
.ks-catalog-period { background: #fff; } 
.ks-catalog-period > .ks-catalog-title { background: none; } 
.ks-catalog-period:hover { background: #e6f0fd; } 
.ks-catalog-period:hover .ks-button { display: block; } 
.ks-catalog-section > .ks-catalog-title { background: #f0f2f5; } 

.ks-catalog-schedule,
.ks-catalog-schedule__learned { width: 100%; height: 100%; position: absolute; left: 0; top:0; } 
.ks-catalog-title__try { background: #4184f5; color:#fff; border-color:#4184f5; } 
.ks-catalog-schedule { background: #e6f0fd; } 
.ks-catalog-schedule__learned { background: #d9e7fd; } 
.ks-catalog-title__type0,
.ks-catalog-title__type1,
.ks-catalog-title__type2,
.ks-catalog-title__type3,
.ks-catalog-title__type-live { padding-right: 28px; height: 100%; } 
.ks-catalog-title__type0 { background: url(./images/catalog/lesson_icon_video.png) no-repeat 100% 50%; } 
.ks-catalog-title__type1 { background: url(./images/catalog/lesson_icon_audio.png) no-repeat 100% 50%; } 
.ks-catalog-title__type2 { background: url(./images/catalog/lesson_icon_picture.png) no-repeat 100% 50%; } 
.ks-catalog-title__type3 { background: url(./images/catalog/lesson_icon_pdf.png) no-repeat 100% 50%; } 
.ks-catalog-title__type-live { background: url(./images/catalog/lesson_icon_live.png) no-repeat 100% 50%; } 
.ks-catalog-title__live-state1 { color:#4184f5; } 
.ks-catalog-title__more { float: right; width: 40px; height: 50px; background: url(./images/catalog/lesson_icon_more.png) no-repeat 50% 50%; background-size: 16px 16px; cursor: pointer; position: relative; margin-left: 10px; margin-right: -10px; z-index: 1; } 
.ks-catalog-title__btns { width: 120px; position: absolute; right: 0; top: 40px; background: #fff; z-index: 9; border-radius: 4px; box-shadow: 0 1px 12px rgba(0, 0, 0, 0.1); display: none; } 
.ks-catalog-title__btns a { display: block; height: 44px; line-height: 44px; color:#787c82; padding: 0 20px 0 42px; background-repeat: no-repeat; background-position: 20px 50%; } 
.ks-catalog-title__btns a:hover { background-color:#f9f9f9; color:#7cc5fe; } 
.ks-catalog-title__btn-lx { background-image: url(./images/catalog/lesson_icon_lx.png); } 
.ks-catalog-title__btn-record { background-image: url(./images/catalog/lesson_icon_record.png); } 
.ks-catalog-title__btn-down { background-image: url(./images/catalog/lesson_icon_down.png); } 

/*课时目录的另一种风格*/
.ks-catalog--axis { position: relative; } 
.ks-catalog--axis::before { content: ''; width: 1px; height: 100%; background: #a4aab2; position:absolute; left:30px; top: 0; } 
.ks-catalog--axis .ks-catalog-title { background:none; border-bottom: 0px; padding:5px 0 5px 31px; } 
.ks-catalog--axis .ks-catalog-chapter > .ks-catalog-title { font-size: 14px; color:#606367; } 
.ks-catalog--axis .ks-catalog-period { position: relative; } 

.ks-catalog--axis .ks-catalog-schedot { width: 11px; height: 11px; position: absolute; left: 24px; top: 16px; background: #fff; border:1px solid #bbc2cb; border-radius: 50%; overflow: hidden; } 
.ks-catalog--axis .ks-catalog-schedot__learned { width: 100%; background: #4184f5; position: absolute; bottom: 0; left: 0; } 
.ks-catalog--axis .ks-catalog-title .ks-button { display: none; } 

.ks-catalog--axis .ks-catalog-title__try { display: none; } 
.ks-catalog--axis .ks-catalog-title__time { font-size: 12px; } 
.ks-catalog--axis .ks-catalog-title__type0,
.ks-catalog--axis .ks-catalog-title__type1,
.ks-catalog--axis .ks-catalog-title__type2,
.ks-catalog--axis .ks-catalog-title__type3,
.ks-catalog--axis .ks-catalog-title__type-live { background-size: auto 16px; padding-right: 22px; } 
.ks-catalog--axis .ks-catalog-title__id { height: 25px; width: 25px; text-align: center; font-size: 14px; border: 1px solid #bcc3cc; position: absolute; left: 17px; background: #fff; top: 50%; margin-top:-13px; border-radius:13px; text-align: center; line-height: 25px; box-sizing: border-box; font-size: 14px; } 
.ks-catalog--axis .ks-catalog-title__id--section { width: 31px; left: 15px; font-size: 12px; } 
.ks-catalog--axis .ks-catalog-title__btns { display: block; position: relative; width: inherit; top: -5px; background: none; box-shadow:0px 0px 0px #fff; line-height: 24px; height: 24px; overflow: hidden; display:none; } 
.ks-catalog--axis .ks-catalog-title__btns a { height: 24px; line-height: 24px; color:#98d2fd; width: 33.3%; float: left; box-sizing: border-box; padding-right: 0px; padding-left: 35px; background-position: 15px 50%; font-size: 13px; } 
.ks-catalog--axis .ks-catalog-title__btns a:hover { background-color: inherit; } 
.ks-catalog--axis .ks-catalog-period:hover,
.ks-catalog--axis .ks-catalog-period.active { background: #2f3133; } 
.ks-catalog--axis .ks-catalog-period.active .ks-catalog-title__btns { display: block; } 
.ks-catalog--axis .ks-catalog-period:hover .ks-catalog-title,
.ks-catalog--axis .ks-catalog-period.active .ks-catalog-title { color:#fff; } 
.ks-catalog--axis .ks-catalog-period:hover .ks-catalog-title__th a,
.ks-catalog--axis .ks-catalog-period.active .ks-catalog-title__th a { color:#fff; } 
.ks-catalog--axis .ks-catalog-period:hover .ks-catalog-title__time,
.ks-catalog--axis .ks-catalog-period.active .ks-catalog-title__time { color:#bcc3cc; } 
.ks-catalog--axis .ks-catalog-period:hover .ks-catalog-schedot,
.ks-catalog--axis .ks-catalog-period.active .ks-catalog-schedot { background: #2f3133; } 
.ks-catalog--axis .ks-catalog-period { background: none; } 
.ks-catalog--axis .ks-catalog-title__th { padding: 0 15px; } 
.ks-catalog--axis .ks-catalog-title__lock,
.ks-catalog--axis .ks-catalog-period .ks-catalog-title__th { height: 36px; line-height: 36px; } 
.ks-catalog--axis .ks-catalog-section > .ks-catalog-title { padding-left: 41px; } 

.ks-catalog-period-info { position: absolute; width: 100%; left: 0; top: -40px; background: #fff; padding: 10px; color:#6a6e75; display: none; z-index: 10; width: 92%; left: 4%; box-sizing: border-box; box-shadow: 0 3px 12px rgba(0,0,0,0.2); padding: 15px; top: -50px; font-weight: bold; } 
.ks-catalog-period-info::after { content: ''; width: 14px; height: 7px; background: url(./images/popover/icon_arrow.png) no-repeat; position: absolute; left: 10px; bottom: -7px; } 

/*纯课时带swiper样式，适用手机版*/
.ks-catalog--slide { padding-right:10px; } 
.ks-catalog--slide .ks-catalog-period { background: #fff; padding: 40px 10px 20px 10px; margin-left: 10px; border: 1px solid #f2f4f6; background: #f2f4f6; border-radius: 4px; } 
.ks-catalog--slide .ks-catalog-title { border-bottom: 0px; line-height: 20px; font-size: 14px; height: 60px; overflow: hidden; } 
.ks-catalog--slide .ks-catalog-period__type { position: absolute; left: 10px; top: 10px; background: #8891a6; color:#fff; height: 20px; line-height: 20px; font-size: 10px; padding: 0 10px; } 
.ks-catalog--slide .active .ks-catalog-period { border: 1px solid #ff663d; background: #fff; } 
.ks-catalog--slide .active .ks-catalog-title { color:#ff663d; } 
.ks-catalog--slide .active .ks-catalog-period__type { background: #ff663d; color:#fff; } 
.ks-catalog--slide .ks-catalog-period__lock { width: 20px; height: 20px; background: url(./images/catalog/lesson_icon_lock.png) no-repeat 50% 50%; background-size: 20px; position: absolute; right: 10px; bottom: 10px; } 
/*课时资料*/
.ks-catalog-data__head { background: #f9f9f9; } 
.ks-catalog-data td { padding: 5px 10px; line-height: 32px; border-bottom: 1px solid #eee; } 
.ks-catalog-data__head td { text-align: center; border-bottom: 0px; } 

/*Popover 弹出框*/
.ks-popover { min-width:200px; position: absolute; left: 0; top: 0; background: #fff; padding:12px 15px; line-height: 20px; box-shadow: 0 3px 15px rgba(0, 0, 0, 0.15); box-sizing: border-box; font-size: 14px; color: #787c82; z-index: 10; display: none; border-radius: 3px; } 
.ks-popover--takeicon { padding-left: 42px; } 
.ks-popover__icon { position: absolute; left: 15px; top: 15px; } 
.ks-popover::after { content: ''; width: 14px; height: 7px; background: url(./images/popover/icon_arrow.png) no-repeat; position: absolute; left: 10px; bottom: -7px; } 
.ks-popover--left::after { left:auto; right: 10px; } 
.ks-popover--top { box-shadow: 0 -3px 15px rgba(0, 0, 0, 0.15); } 
.ks-popover--top::after { bottom: auto; top: -7px; background: url(./images/popover/icon_arrow_up.png) no-repeat; } 

/*弹窗*/
.ks-popup { position: fixed; width: 800px; height: 400px; left: 50%; margin-left: -400px; top: 50%; margin-top: -200px; background: #fff; z-index: 10000; border-radius: 6px; color:#6a6e75; } 
.ks-popup-head { height: 46px; line-height: 46px; text-align: center; font-size: 16px; border-bottom: 1px solid #eee; color:#6a6e75; } 
.ks-popup-head__close { width: 46px; height: 46px; position: absolute; right: 0; top: 0; background: url(./images/popup/close.png) no-repeat 50% 50%; cursor: pointer; } 
.ks-popup--open .ks-popup-body { position: relative; height: calc(100% - 46px); overflow-x: hidden; overflow-y: auto; } 
.ks-popup-content { padding: 20px; line-height: 24px; font-size: 14px; position: relative; } 
.ks-popup-content--takeicon { padding-left: 62px; } 
.ks-popup-content__icon { position: absolute; left: 20px; top:16px; height: 32px; } 
.ks-popup-body__iframe { width: 100%; height: 100%; position: absolute; left: 0; top: 0; border: 0px; } 
.ks-popup--msg { max-width: 320px; background: rgba(0, 0, 0, .6); color:#fff; } 
.ks-popup--msg .ks-popup-content { padding:12px 15px; } 
.ks-popup-mask { width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 999; background: rgba(0, 0, 0, .6) } 
.ks-popup-mask--msg { background: none; } 
.ks-popup-footer { padding: 15px; text-align: right; } 

/*讨论*/
.ks-comment { margin:20px 0; } 
.ks-comment-textarea { resize: none; outline: none; border: 1px #ddd solid; border-radius: 4px; width: 100%; height: 140px; overflow: auto; font-size: 15px; padding:15px; box-sizing:border-box; display: block; } 
.ks-comment-set { min-height: 35px; margin-top:10px; } 
.ks-comment__expression,.ks-comment__image { margin-left:10px; margin-top:6px; float:left; position:relative; } 
#ks-comment__emoji { height: 22px; } 
.ks-comment__expression img,.ks-comment__image img { width:22px; height: 22px; } 
.ks-submit-btn { line-height: 32px; width: 100px; text-align: center; background-color: #3c81f9; color: #fff; border: 1px solid #3c81f9; float: right; border-radius: 3px; font-size: 14px; transition: .3s; cursor: pointer; } 
.ks-comment-img .comment-img { display: inline-block; width:120px; height: 80px; overflow: hidden; margin-right: 10px; margin-bottom: 10px; border-radius: 4px; } 
.ks-comment-img .comment-img img { width: 100%; height: 100%; object-fit: cover; } 
.ks-comment-zan { padding-left: 18px; background: url(images/zanicon.png) no-repeat center left; background-size: 15px; cursor: pointer; } 
.ks-comment-zaned { background: url(images/zaniconh.png) no-repeat center left; background-size: 15px; color: #10ae58; } 
.ks-comment-replies { cursor: pointer; } 
.ks-comment__reply-btn { display: inline-block; width: 50px; line-height: 25px; text-align: center; border: 1px solid #eee; background: #3c81f9; color: #fff; margin-top: 5px; border-radius: 5px; cursor: pointer; } 
.ks-comment__reply-text { display: none; margin-top: 15px; position: relative; padding: 5px 15px 10px; background-color: #fafafa; border: 1px solid #eee; } 
.ks-comment__reply-text textarea { padding: 5px 10px; font-size: 12px; line-height: 16px; height: 65px; width: 100%; overflow-y: auto; overflow-x: hidden; background: #fff; border: 1px solid #eee; box-sizing: border-box; } 
.ks-comment__reply-info { line-height: 24px; font-size: 14px; margin-bottom:5px; } 
.ks-comment__reply-info span { color: #3c81f9; } 
.ks-mobile-comment .ks-comment-zan { position: absolute; right: 0; top: 0; margin-right: 0; line-height: 15px; height: 15px; } 
.ks-mobile-comment .ks-comment-look { margin-right: 0; } 
.ks-comment-tag { display: inline-block; font-size: 12px; padding: 2px 5px; 
 border-radius: 3px; color: #fff; margin-left: 15px; } 
.student-tag { background: #4CAF50; } 
.teacher-tag{background: #ff9800;}
.school-tag{background:#f44336;}

/*开关特效*/
#ks-comment-switch1 { width:42px; height:24px; border-radius:20px; position:relative; cursor:pointer; float:left; margin-top:4px; } 
#ks-comment-switch2 { width:22px; height:22px; border-radius:20px; position:absolute; background:#fff; box-shadow:0 2px 4px rgba(0,0,0,.4) } 
.ks-comment-open1 { background:#3c81f9; border:1px solid #3c81f9; } 
.ks-comment-open2 { top:0px; right:0px; } 
.ks-comment-close1 { background:#f5f5f5; border:1px solid #d3d3d3; } 
.ks-comment-close2 { left:0; top:0; } 
.ks-switch-text { float:left; line-height:26px; color:#999; margin-left:10px; margin-top:4px; } 
.ks-comment-list { margin-top:30px; } 
.ks-comment__li { margin-bottom: 20px; border-bottom: 1px solid #eee; } 
.ks-comment__box { position:relative; padding-left:54px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #eee; } 
.ks-comment__box:last-child { margin-bottom:0; border-bottom:0; } 
.ks-comment__first { margin-bottom:0; border-bottom:0; } 
.ks-comment__avator { width:43px; height:43px; position:absolute; left:0; top:0; overflow:hidden; border-radius:43px; } 
.ks-comment__avator img { width: 100%; height: 100%; object-fit: cover; } 
.ks-comment__user-info h3 { font-weight: normal; margin-bottom: 15px; color: #666; line-height: 14px; font-size: 14px; } 
.ks-comment__content { line-height: 20px; font-size: 14px; margin-bottom: 15px; color: #666; } 
.ks-comment__bottom { color: #bcc3cc; line-height: 13px; font-size:13px; } 
.ks-comment__bottom span { margin-right:20px; } 
.ks-comment-look { color: #3c81f9; cursor: pointer; } 
.ks-comment__reply { background: #f5f7fa; padding: 20px 20px 0; margin-bottom: 20px; display:none; } 
.ks-no-reply { padding:0 !important; margin-bottom:0 !important; } 
.ks-emoji-img { width:20px; vertical-align: middle; } 
#ks-upload-showui:after,#ks-upload-showinput:after,#ks-upload-showimg:after { display: none !important; } 

/*评论*/

.ks-evaluation-comment__head { height: 49px; line-height: 44px; font-size: 14px; color:#909399; margin-top: 10px; } 
.ks-evaluation-comment__score { display: inline-block; } 
.ks-evaluation-comment__star { width: 24px; height: 24px; display: inline-block; margin-left:5px; position: relative; top: 5px; background-image: url(./images/evaluation/common_btn_star_n.png); background-repeat: no-repeat; background-size: auto 100%; cursor: pointer; } 
.ks-evaluation-comment__star--on { background-image: url(./images/evaluation/common_btn_star_s.png); } 
.ks-evaluation-comment__scoretext { display: inline-block; color: #f5891e; margin-left: 15px; } 
.ks-evaluation-comment__foot { text-align: right; padding: 10px 0 15px 0; border-bottom: 1px solid #eee; margin-bottom: 20px; } 
.ks-evaluation { position: relative; min-height: 40px; padding: 15px 0; } 
.ks-evaluation-head { padding-bottom: 15px; } 
.ks-evaluation__avatar { position: absolute; left: 0; top: 15px; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; } 
.ks-evaluation__item { padding:15px 0 15px 50px; position: relative; } 
.ks-evaluation__name { font-size: 14px; height: 24px; line-height: 24px; overflow: hidden; } 
.ks-evaluation__time { font-size: 12px; color: #A4AAB2; } 
.ks-evaluation__satr { width: 82px; height: 14px; position: relative; background: url(./images/evaluation/common_btn_star_n.png) no-repeat; background-size: 82px 100%; margin-top:5px; } 
.ks-evaluation__satr--on { width: 0%; height: 100%; position: absolute; background: #fff url(./images/evaluation/common_btn_star_s.png) no-repeat; background-size: 82px 100%; } 
.ks-evaluation__comment { font-size: 14px; color:#606266; line-height: 24px; margin-top:10px; word-wrap:break-word; } 

/*表情*/
.ks-emoji { width: 426px; box-sizing: border-box; padding: 24px; box-shadow: 0 1px 20px 0 rgba(0,0,0,.1); position: absolute; left: 0; z-index: 99; background: #fff; top:28px; } 
.hide { display: none; } 
.ks-emoji li { float: left; height: 20px; width: 20px; padding: 3px; cursor: pointer; } 
.ks-emoji li img { width: 20px; display: block; } 
.ks-emoji li:hover { background: #f3f3f3; } 

/*图片上传*/
.ks-upload-box { display: none; margin-top: 15px; } 
.ks-upload-btn { padding: 9px 0; background: #3c81f9; color: #FFFFFF; border-radius: 3px; border: 0; margin-top: 15px; width: 100px; } 
.ks-upload-upimg { float: left; position: relative; width: 100px; height: 100px; box-sizing: border-box; border:1px dashed #ddd; background: url(images/addimg.svg) no-repeat center; } 
.ks-upload-upimg input { position: absolute; width: 100px; height: 100px; opacity: 0; } 
#ks-upload-showui li { width: 100px; height: 100px; position: relative; overflow: hidden; margin-right: 5px; float: left; margin-bottom: 5px; } 
#ks-upload-showui li img.ks-upload-showimg { position: absolute; text-align: center; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 6; width: 100%; height: 100%; object-fit: cover; } 
.ks-upload-showdiv { position: absolute; z-index: 9; bottom: 0; width: 100%; padding: 5px; text-align: center; box-sizing: border-box; background: rgba(0, 0, 0, .6); } 
.ks-upload-showdiv img { width: 20px; height: 20px; cursor: pointer; margin: 0 5px; } 
#ks-upload-showui li:first-child img.ks-upload-left { opacity: .6; cursor: no-drop; } 
#ks-upload-showui li:last-child img.ks-upload-right { opacity: .6; cursor: no-drop; } 
.ks-upload-oneright { opacity: .6; cursor: no-drop !important; } 

/*分页*/
.ks-page-box { text-align: center; } 
.ks-page { display:inline-block; } 
.ks-page-box .icon-prev,.ks-page-box .icon-next { display: block; height:28px; width: 10px; margin: auto; } 
.ks-page-box .icon-prev { background: url(images/paging-prev.png) no-repeat 50% 50%; } 
.ks-page-box .icon-next { background: url(images/paging-next.png) no-repeat 50% 50%; } 
.ks-page-total { display:inline-block; margin-right:20px; line-height:35px; color:#666; font-size:14px } 
.ks-page-number { display:inline-block; color:#666; font-size:14px } 
.ks-page-number span { position:relative; box-sizing:border-box; display:inline-block; margin:5px; vertical-align: middle; border-radius: 3px; padding:0 5px; min-width: 30px; line-height:28px; background: #f0f2f5; text-align:center; transition:all .2s; cursor:pointer } 
.ks-page-number span.active { background:#3c81f9; color:#fff; border-color:#3c81f9; z-index:3 } 
.ks-page-number span.active:hover { background:#3c81f9; color:#fff; border-color:#3c81f9; z-index:3 } 
.ks-page-number span:hover { background-color:#eee } 
.ks-page-number span.span-disabled { cursor:not-allowed; color:#ccc; background: #f0f2f5; } 
.ks-page-number span.span-disabled .icon-prev,.ks-page-number span.span-disabled .icon-next { opacity: 0.5; } 
.ks-page-skip { display:inline-block; margin-left:20px; line-height:35px; color:#666; font-size:14px } 
.ks-page-skip input { box-sizing:border-box; display:inline-block; width:45px; height:35px; line-height:35px; text-align:center; vertical-align:top; border:1px solid #ddd; outline:0; transition:all .2s } 
.ks-page-skip input:focus { border-color:#3c81f9 } 
.ks-page-skip span { display:inline-block; padding:0 14px; line-height:30px; vertical-align:top; color:#666; outline:0; border:1px solid #ddd; cursor:pointer; transition:all .2s } 
.ks-page-skip span:hover { background:#3c81f9; color:#fff; border:1px solid #3c81f9 } 

/*放大图片*/
.ks-amplification { position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); left: 0; top: 0; z-index: 1000; } 
.ks-amplification-box { width: 800px; height:600px; overflow-y:auto; position: absolute; left: 50%; top:50%; margin-left: -400px; margin-top: -300px; background: #fff; border-radius: 5px; } 
.ks-amplification-img { margin-top: 50px; text-align: center; } 
.ks-amplification-img img { max-width: 100%; } 
.ks-amplification-close { position: absolute; top: 15px; right: 15px; cursor: pointer; } 
.no-scroll { overflow: hidden; } 

/*======手机版的问答======*/
.ks-mobile-comment .ks-comment__expression { position: static; } 
.ks-mobile-comment .ks-emoji { left: 0; width: 100%; position: absolute; top: auto; } 
.ks-mobile-comment .ks-upload-upimg { background-color: #fff; } 
.ks-mobile-comment .ks-comment-set { margin-left: 10px; margin-right: 10px; } 
.ks-mobile-comment .ks-upload-box { padding-left: 10px; padding-right: 10px; } 
.ks-mobile-comment .ks-comment-textarea { border-radius: 0; border-left: 0; border-right: 0; border-color: #eee; } 
.ks-mobile-comment #ks-upload-showui li,.ks-mobile-comment .ks-upload-upimg,.ks-mobile-comment .ks-upload-upimg input { width: 80px; height: 80px; } 
.ks-mobile-comment .ks-comment-list { margin-top: 10px; } 
.ks-mobile-comment .ks-comment-list { background: #fff; padding: 10px 10px 5px; } 
.ks-mobile-comment .ks-page-box { background: #fff; padding-bottom: 10px; } 
.ks-mobile-comment .ks-amplification-box { width: 100%; margin-left: -50%; height: 60%; top: 20%; margin-top: 0; border-radius: 0; } 
.ks-mobile-comment .ks-comment__bottom { line-height: 12px; font-size: 12px; } 
.ks-mobile-comment .ks-comment__user-info h3 { line-height: 12px; font-size: 12px; margin-bottom: 10px; } 
.ks-mobile-comment .ks-comment__content { font-size: 14px; margin-bottom: 10px; } 

/* 播放页的问答 */
.ks-play-comment .ks-emoji { width: 320px; left: -102px; padding: 14px; } 
.ks-play-comment .comment-img { width: 50px; height: 50px; } 
/*课程资料*/

.ks-course-data__item { padding: 10px 15px; cursor: pointer; } 
.ks-course-data__item+.ks-course-data__item { border-top: 1px solid #eee; } 
.ks-course-data__name { line-height: 28px; font-size: 14px; max-height: 28px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } 
.ks-course-data__name img { width: 28px; height: 28px; float: left; margin-right: 5px; } 


/*课程考试*/

.ks-course-exam__item { padding: 10px 15px; cursor: pointer; } 
.ks-course-exam__item + .ks-course-exam__item { border-top: 1px solid #eee; } 
.ks-course-exam__item .ks-button { float: right; margin-left: 10px; } 
.ks-course-data__item:hover,
.ks-course-exam__item:hover { background: #e6f0fd; } 
.ks-course-exam__name { line-height: 28px; font-size: 14px; max-height: 28px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } 
.ks-course-exam__alert { color:#e6a23c; } 
.ks-course-exam__lock { width: 16px; height: 16px; background: url(./images/exam/lesson_icon_lock.png) no-repeat; background-size: 100% 100%; float: right; position: relative; top: 6px; } 
.ks-course-exam__item--disabled { color:#999; cursor: default; } 
.ks-course-exam__item--disabled:hover { background: none; } 

/*音频播放器*/
.ks-audio-player { background: #fff; padding: 60px 30px 40px 30px; position: relative; } 
.ks-audio-player__icon-list { position: absolute; right: 15px; top: 15px; background: url(./images/audio/icon-list.png) no-repeat; background-size: 21px 21px; height: 21px; line-height: 21px; padding-left: 27px; } 
.ks-audio-player__icon-list span { background: #c7c7c7; color:#fff; height: 17px; line-height: 17px; min-width: 9px; padding: 0 4px; text-align: center; display: inline-block; border-radius: 30px; position: relative; top: 2px; } 
.ks-audio-player__list { position: absolute; display: none; right: 15px; top: 50px; width: 80%; height: calc(100% - 50px); background: #fff; z-index: 9; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; } 
.ks-audio-player__list-tit { height: 44px; line-height: 44px; font-size: 14px; padding: 0 15px; font-weight: bold; } 
.ks-audio-player__list-item { height: 32px; line-height: 32px; padding: 0 15px; position: relative; font-size: 12px; cursor: pointer; white-space: nowrap; text-overflow: ellipsis; } 
.ks-audio-player__list-item--active { position: relative; } 
.ks-audio-player__list-item--active { color:#f60; } 
.ks-audio-player__list-item--active::after { content:''; width: 2px; height: 100%; position: absolute; left: 0; top: 0; background: #f60; } 
.ks-audio-player__list-item:nth-child(even) { background: #eee; } 
.ks-audio-player__cover { width: 170px; position: relative; margin: 0 auto; overflow: hidden; border-radius: 50%; z-index: 1; } 
.ks-audio-player__run { padding: 20px; height: 130px; overflow: hidden; } 
.ks-audio-player__msg { line-height: 22px; color:#999; margin-top: 5px; max-height: 22px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } 
.ks-audio-player__msg--error { color:#ff663d } 
.ks-audio-player__runing { animation: rotate 6s linear infinite } 
@keyframes rotate { 
 from { transform: rotate(0deg) } 
 to { transform: rotate(360deg) } 
 }
.ks-audio-player__cover-bg { background-size: cover; background-repeat: no-repeat; width: 100%; height: 100%; position: absolute; left: 0; top:0; filter: blur(40px) } 
.ks-audio-player__cover img { width: 100%; height: 100%; border-radius: 50%; margin: 0 auto; position: relative; z-index: 9; object-fit: cover; } 

.ks-audio-player__title { font-size: 14px; margin-top: 30px; color:#666; height: 24px; line-height: 24px; overflow: hidden; white-space: nowrap; } 
.ks-audio-player__title span { color:#999; } 
.ks-audio-player__progress { position: relative; padding: 0 50px; margin-top: 20px; line-height: 25px; } 

.ks-audio-player__total-time { position: absolute; right: 0; top: 0; font-size: 14px; } 
.ks-audio-player__progress-bar { height: 25px; position: relative; } 
.ks-audio-player__progress-bar::after { content: ''; position: absolute; width: 100%; height: 4px; background: #eee; border-radius: 10px; top: 11px; left: 0; } 
.ks-audio-player__progress-bar--on { width: 0%; height: 4px; background: #ff663d; position: absolute; left: 0; top: 11px; border-radius: 30px; z-index: 1; } 
.ks-audio-player__progress-dot { width: 25px; height: 25px; position: absolute; right: -11px; top: -11px; } 
.ks-audio-player__progress-dot i { width: 8px; height: 8px; border-radius: 50%; position: absolute; left:50%; top: 50%; border: 3px solid rgba(255, 102, 61, 0.3); margin-top:-7px; margin-left: -7px; } 
.ks-audio-player__progress-dot i::after { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #ff663d; position: absolute; left: 50%; top: 50%; margin-top: -4px; margin-left: -4px; } 
.ks-audio-player__total-time,
.ks-audio-player__time { color:#666; position: absolute; top: 0; font-size: 12px; font-weight: bold; } 
.ks-audio-player__time { left: 0; } 
.ks-audio-player__total-time { right: 0; } 
.ks-audio-player__tool { position: relative; height: 60px; width: 240px; margin: 20px auto 0; } 
.ks-audio-player__play,
.ks-audio-player__prev,
.ks-audio-player__next { background-position: 50% 50%; background-repeat: no-repeat; border-radius: 50%; } 

.ks-audio-player__play { width: 60px; height: 60px; margin: 0 auto; background-color: #ff663d; background-image: url(./images/audio/icon-play.png); background-size: 24px 24px; } 
.ks-audio-player__play--pause { background-image: url(./images/audio/icon-pause.png); } 
.ks-audio-player__prev,
.ks-audio-player__next { width: 50px; height: 50px; position: absolute; background-size: 20px 20px; top: 5px; } 
.ks-audio-player__prev { left: 0; background-image: url(./images/audio/icon-prev.png); } 
.ks-audio-player__next { right: 0; background-image: url(./images/audio/icon-next.png); } 
.ks-audio-player__prev--disabled,
.ks-audio-player__next--disabled { opacity: 0.5; cursor: no-drop; } 
@media(max-width:480px){
 .ks-button+.ks-button { margin-left: 6px; } 
 /*评论*/
 .ks-evaluation-comment__star { width: 20px; height: 20px; top:3px; } 

 /*课时目录*/
 .ks-catalog-title__type-live span { display: none; } 
 .ks-catalog-title__th { padding: 0 15px; } 
 .ks-catalog-period:hover .ks-button { display: none; } 
 /* .ks-catalog-title__time { display: none; } */ } 


/*轮播图*/

.swiper-container .swiper-button-prev { background-image: url(../swiper/images/index_btn_arrowleft.png); } 
.swiper-container .swiper-button-next { background-image: url(../swiper/images/index_btn_arrowright.png); } 
