@charset "UTF-8";
/* 课程列表导航 */
.course-item-nav {
  margin-top: -20px;
  margin-bottom: 20px;
  background-color: #fff;
  padding-bottom: 10px;
}
.course-item-nav .nav-wrapper + .nav-wrapper {
  border-top: 1px #e5e5e5 solid;
  margin-top: 12px;
}
.course-item-nav .nav-wrapper .navright-op {
  position: relative;
}
.course-item-nav .nav-wrapper .navright-op .minmap-tips {
  background-color: #fff;
  position: absolute;
  left: -20px;
  top: -20px;
  width: 60px;
  font-size: 12px;
  border: 1px solid #9399a5;
  padding: 2px 5px;
}
.course-item-nav .nav-wrapper .navright-op .minmap-tips:before, .course-item-nav .nav-wrapper .navright-op .minmap-tips:after {
  content: " ";
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #9399a5;
  position: absolute;
  top: 21px;
  left: 30px;
}
.course-item-nav .nav-wrapper .navright-op .minmap-tips:after {
  top: 21px;
  left: 30px;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 7px solid #fff;
}
.course-item-nav .nav-wrapper .navright-op .op_item {
  display: inline-block;
  color: #fff;
  border-radius: 50%;
  height: 30px;
  width: 30px;
  line-height: 30px;
  text-align: center;
  margin-top: 10px;
  padding-left: 0;
  padding-right: 0;
}
.course-item-nav .nav-wrapper .navright-op .op_item.mindmap {
  background-color: #0f6af3;
}
.course-item-nav .nav-wrapper .navright-op .op_item.mindmap i {
  font-size: 18px;
}
.course-item-nav .nav-wrapper .navright-op .op_item.feedback {
  background-color: #ff7a45;
}
.course-item-nav .nav-wrapper .navright-op .op_item.feedback i {
  font-size: 16px;
}
.course-item-nav .course-mindmap {
  margin-top: 10px;
}
.course-item-nav .course-mindmap .img-wrapper {
  width: 100%;
  padding: 20px;
  text-align: center;
  background: #fff;
  border-radius: 6px;
}
.course-item-nav .course-mindmap .img-wrapper > img {
  max-width: 100%;
}
.course-item-nav a {
  display: block;
  float: left;
  height: 28px;
  line-height: 28px;
  margin-top: 12px;
  margin-left: 5px;
  margin-right: 5px;
  padding-left: 14px;
  padding-right: 14px;
  border-radius: 16px;
  color: #4d4d4d;
}
.course-item-nav a:hover, .course-item-nav a.active {
  color: #0f6af3;
}
.course-item-nav a.active {
  background-color: #eaf1fe;
  color: #0f6af3;
}
.course-item-nav .active1 {
  background-color: #eaf1fe;
  color: #0f6af3;
}
.course-item-nav .active1:hover {
  color: #0f6af3;
  background-color: none;
}
.course-item-nav .active2 {
  color: #0f6af3;
}
.course-item-nav .active2:hover {
  color: #0f6af3;
}
.course-item-nav .yards-info-wrapper {
  width: 100%;
  padding: 20px;
  height: 120px;
  border-radius: 6px;
  margin-bottom: 15px;
  margin-top: 30px;
  background-color: #f7f8fa;
}
.course-item-nav .yards-info-wrapper .img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background-color: #fff;
  margin-right: 20px;
  float: left;
}
.course-item-nav .yards-info-wrapper .info-item {
  float: left;
  line-height: 80px;
}
.course-item-nav .yards-info-wrapper .info-item .info-title-wrapper {
  float: left;
  margin-right: 30px;
}
.course-item-nav .yards-info-wrapper .info-item .info-title-wrapper .info-title {
  font-size: 22px;
  margin-right: 15px;
  color: #3e454d;
}
.course-item-nav .yards-info-wrapper .info-item .info-title-wrapper .course-num {
  padding-left: 15px;
  font-size: 16px;
  color: #9399a5;
  border-left: 1px solid #9399a5;
  vertical-align: top;
}
.course-item-nav .yards-info-wrapper .info-item .desc-wrapper {
  float: left;
  color: #9399a5;
  font-size: 16px;
  max-width: 800px;
}
.course-item-nav .yards-info-wrapper .info-item .desc-wrapper p {
  margin-bottom: 0;
}

.course-item-nav {
  margin-bottom: 10px;
  background-color: #f7f8fa;
  margin-top: 20px;
}
.course-item-nav.course-yards-nav {
  background-color: #fff;
  margin-top: -20px;
}
.course-item-nav.course-yards-nav .nav-wrapper {
  height: auto;
}
.course-item-nav .nav-wrapper {
  position: relative;
  height: auto;
}
.course-item-nav .nav-wrapper:last-child .ul-classify .content {
  border-bottom: none;
}
.course-item-nav .commendatory {
  width: 90%;
}
@media (max-width: 1199px) {
  .course-item-nav .commendatory {
    width: 86%;
  }
}
@media (max-width: 1199px) and (max-width: 991px) {
  .course-item-nav .commendatory {
    width: 84%;
  }
}
@media (max-width: 1199px) and (max-width: 991px) and (max-width: 575px) {
  .course-item-nav .commendatory {
    width: 76%;
  }
}
@media (max-width: 1199px) and (max-width: 991px) and (max-width: 575px) and (max-width: 409px) {
  .course-item-nav .commendatory {
    width: 73%;
  }
}
.course-item-nav .width-teacher-border {
  border-top: 1px solid #e5e5e5;
}
.course-item-nav .content-bottom {
  z-index: 10;
  border-radius: 6px;
  height: auto;
}
.course-item-nav .content-bottom .ctime {
  height: auto;
}
.course-item-nav .content-bottom .ctime .bottom-index {
  padding-bottom: 10px;
  height: auto;
}
.course-item-nav .content-bottom .ul-classify:hover {
  position: relative;
}
.course-item-nav .uniformly {
  height: 51px;
  width: 100%;
  border-top: none;
  overflow: hidden;
}
.course-item-nav .uniformly .content {
  width: 90%;
  height: 51px;
  overflow: hidden;
  border-bottom: 1px solid #e5e5e5;
}
@media (max-width: 1199px) {
  .course-item-nav .uniformly .content {
    width: 87%;
  }
}
@media (max-width: 1199px) and (max-width: 991px) {
  .course-item-nav .uniformly .content {
    width: 84%;
  }
}
@media (max-width: 1199px) and (max-width: 991px) and (max-width: 568px) {
  .course-item-nav .uniformly .content {
    width: 75%;
  }
}
@media (max-width: 1199px) and (max-width: 991px) and (max-width: 568px) and (max-width: 384px) {
  .course-item-nav .uniformly .content {
    width: 73%;
  }
}
.course-item-nav .uniformly .arrow {
  position: absolute;
  bottom: 18px;
  right: 24px;
  font-size: 12px;
  color: #9399a5;
}
.course-item-nav .ul-classify-top {
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}
.course-item-nav .ul-classify-bottom {
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}
.course-item-nav .uniformly:hover {
  height: auto;
  position: absolute;
  background-color: #fff;
  z-index: 10;
  border-radius: 6px;
  box-shadow: 0 4px 16px 0 rgba(95, 101, 105, 0.1);
}
.course-item-nav .uniformly:hover .arrow {
  transform: rotate(180deg);
}
.course-item-nav .ul-teacher {
  height: 51px;
  width: 100%;
  border-top: none;
  overflow: hidden;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}
.course-item-nav .ul-teacher .arrow {
  position: absolute;
  bottom: 10px;
  right: 6px;
  font-size: 12px;
  color: #9399a5;
}
.course-item-nav .commendatory-nav {
  height: auto;
  overflow: auto;
}
.course-item-nav .uniformly:hover .content {
  height: auto;
  padding-bottom: 10px;
  border-bottom: 1px solid transparent;
}
.course-item-nav .nav-uniformly:hover {
  height: 51px;
}
.course-item-nav .nav-uniformly.content-bottom:hover {
  height: auto;
}
.course-item-nav .J-class-hot:hover {
  height: auto;
}
.course-item-nav .J-description:hover {
  height: auto;
}
.course-item-nav .belaud {
  height: auto;
  z-index: 10;
}

@media (max-width: 1200px) {
  .course-item-nav .yards-info-wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }
  .course-item-nav .yards-info-wrapper .info-item {
    line-height: 35px;
    padding-top: 5px;
    width: 85%;
  }
  .course-item-nav .yards-info-wrapper .info-item .info-title-wrapper {
    float: none;
  }
  .course-item-nav .yards-info-wrapper .info-item .desc-wrapper {
    float: none;
    max-width: none;
  }
  .course-item-nav .yards-info-wrapper .info-item.only-title {
    line-height: 80px;
  }
}
@media (max-width: 1199px) and (min-width: 768px) {
  .course-item-nav {
    padding-bottom: 15px;
  }
  .course-item-nav .nav-wrapper {
    margin-left: -10px;
    margin-right: -10px;
  }
  .course-item-nav .nav-wrapper + .nav-wrapper {
    margin-top: 15px;
  }
  .course-item-nav .nav-wrapper .navright-op .minmap-tips {
    left: -6px;
  }
  .course-item-nav a {
    height: 28px;
    line-height: 28px;
    margin-top: 12px;
    margin-left: 10px;
    margin-right: 10px;
  }
}
@media (max-width: 767px) {
  .course-item-nav {
    padding-bottom: 10px;
  }
  .course-item-nav .nav-wrapper {
    margin-left: 0;
    margin-right: 0;
  }
  .course-item-nav .nav-wrapper + .nav-wrapper {
    margin-top: 10px;
  }
  .course-item-nav .nav-wrapper .navright-op .minmap-tips {
    left: -10px;
  }
  .course-item-nav .nav-wrapper .navright-op .op_item {
    margin-left: 5px;
    margin-right: 5px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
  }
  .course-item-nav .nav-wrapper .navright-op .op_item.feedback i {
    font-size: 14px;
  }
  .course-item-nav .nav-wrapper .navright-op .op_item.mindmap i {
    font-size: 16px;
  }
  .course-item-nav a {
    height: 24px;
    line-height: 24px;
    margin-top: 13px;
    margin-left: 0;
    margin-right: 0;
  }
}
@media (max-width: 740px) {
  .course-item-nav .yards-info-wrapper {
    margin-top: 10px;
  }
  .course-item-nav .yards-info-wrapper .info-item {
    width: 80%;
  }
}
@media (max-width: 570px) {
  .course-item-nav .yards-info-wrapper {
    height: 100px;
  }
  .course-item-nav .yards-info-wrapper .img {
    width: 60px;
    height: 60px;
    margin-right: 10px;
  }
  .course-item-nav .yards-info-wrapper .info-item {
    line-height: 25px;
  }
  .course-item-nav .yards-info-wrapper .info-item .info-title-wrapper .info-title {
    font-size: 18px;
    margin-right: 15px;
  }
  .course-item-nav .yards-info-wrapper .info-item .info-title-wrapper .course-num {
    font-size: 14px;
  }
  .course-item-nav .yards-info-wrapper .info-item .desc-wrapper {
    font-size: 14px;
  }
  .course-item-nav .yards-info-wrapper .info-item.only-title {
    line-height: 55px;
  }
}
@media (max-width: 410px) {
  .course-item-nav .yards-info-wrapper .info-item {
    width: 75%;
  }
}
.new-course-item-nav .nav-wrapper + .nav-wrapper {
  border-top: none;
  margin-top: 0px;
}

.new-course-item-nav {
  padding-bottom: 0px;
}
.new-course-item-nav a {
  padding-left: 10px;
  padding-right: 10px;
}
.new-course-item-nav .active1 {
  background-color: #eaf1fe;
  color: #0f6af3;
  border-radius: 4px;
}
.new-course-item-nav .ul-classify-top .new-bottom-index {
  width: calc(100% - 100px);
}
.new-course-item-nav .ul-classify-top .finally-end {
  background-color: #fff;
  border-radius: 4px;
}
.new-course-item-nav .ul-classify-top .finally-end a {
  margin-top: 6px;
  margin-bottom: 6px;
}
.new-course-item-nav .ul-classify-top .finally-end .active {
  background-color: transparent;
}
@media (max-width: 1200px) {
  .new-course-item-nav .ul-classify-top .new-bottom-index {
    width: calc(100% - 110px);
  }
}
@media (max-width: 991px) {
  .new-course-item-nav .ul-classify-top .new-bottom-index {
    width: calc(100% - 120px);
  }
}
.new-course-item-nav .new-direction {
  margin-top: 16px;
}
.new-course-item-nav .new-screening .commendatory-nav .commendatory {
  width: calc(100% - 80px);
}
.new-course-item-nav .new-screening .commendatory-nav .commendatory .active {
  background-color: #eaf1fe;
  color: #0f6af3;
  border-radius: 4px;
}
@media (max-width: 1199px) {
  .new-course-item-nav .new-screening .commendatory-nav .commendatory {
    width: calc(100% - 90px);
  }
}
.new-course-item-nav .new-screening .commendatory-nav .width-teacher-border {
  border-top: 1px solid #E9EAEB;
}
.new-course-item-nav .new-screening .father-box {
  position: relative;
}
.new-course-item-nav .new-screening .father-box .course-icon-search {
  position: absolute;
  bottom: 8px;
  right: 20px;
  color: #9399A5;
  font-size: 14px;
}
.new-course-item-nav .new-screening .course-search {
  width: 240px;
  height: 36px;
  background: #FFFFFF;
  border-radius: 18px;
  margin-top: 12px;
  border: none;
  padding-left: 14px;
}
.new-course-item-nav .new-screening .course-icon-search:hover {
  color: #0f6af3;
}
.new-course-item-nav .maximum {
  background-color: #fff;
}
.new-course-item-nav .maximum .possess {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
}
.new-course-item-nav .maximum .possess .active4 {
  color: #0f6af3;
}
.new-course-item-nav .maximum .possess .right-possess .choice-box {
  margin-left: 14px;
}
@media (max-width: 600px) {
  .new-course-item-nav .maximum .possess {
    flex-direction: column;
    justify-content: left;
  }
}
.new-course-item-nav .task-list-crumbs {
  line-height: 1;
  margin: 10px 0;
  margin-top: 0px;
}
.new-course-item-nav .task-list-crumbs a {
  margin-top: 0px;
  padding-left: 0px;
  padding-right: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
.new-course-item-nav .task-list-crumbs .prev,
.new-course-item-nav .task-list-crumbs .last {
  max-width: 140px;
  display: inline-block;
  vertical-align: bottom;
  color: #3e454d;
  transition: 0.12s color ease-in-out;
}
.new-course-item-nav .task-list-crumbs .prev {
  color: #9399a5;
}
.new-course-item-nav .task-list-crumbs .prev:hover {
  color: #0f6af3;
}
.new-course-item-nav .task-list-crumbs .last:hover {
  color: #3e454d;
}
.new-course-item-nav .task-list-crumbs .iconfont {
  margin-top: 8px;
  padding: 0 7px;
  float: left;
  color: #9399a5;
  font-size: 12px;
}
.new-course-item-nav .nav-wrapper:nth-last-child(2) {
  margin-bottom: 10px;
}

/* 课程列表-网格样式 */
.course-item-grid {
  margin-left: -10px;
  margin-right: -10px;
  margin-top: -20px;
}
.course-item-grid [class*=col-] {
  padding-left: 10px;
  padding-right: 10px;
}
.course-item-grid .item {
  display: block;
  margin-top: 20px;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 95.7894736842%;
  background-color: #fff;
  border-radius: 6px;
  overflow: hidden;
}
.course-item-grid .item .img,
.course-item-grid .item .info {
  position: absolute;
  left: 0;
  right: 0;
  overflow: hidden;
  width: 100%;
}
.course-item-grid .item .img {
  top: 0;
  height: 58.6080586081%;
  line-height: 0;
}
.course-item-grid .item .img > img {
  width: 100%;
  transition: all, 0.3s;
}
.course-item-grid .item .img .is-top-label {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 48px;
  height: 20px;
  border-top-left-radius: 6px;
  border-bottom-right-radius: 6px;
  background-position: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAAAoCAMAAAA2TQ8LAAABWVBMVEX/fw3/////bzr/cDf/cTT/cjH/ehb/fRD/dCv/iQn/6t7/ggr/dSf/qzX/yWr/wl//vlj/cy7/lxf/kxH/kQ7/eRr/diP/jgv/hgn/hAn/zKz/niH/mx3/fBP/dx//oSb/rjz/s0X/eB3/u1L/xmf/xWT/uE7/tkn/sUD/bzz/bzv/mRr/lRT/iwn/6d7/6OD/qDL/py//x7D/pS3/pCr/hzP/q4f/tH//soD/+O3/+PX/t4D/8+L/28f/ya7/zqz/gzv/49L/37T/tn//wnH/tFD/6Mn/2KP/kE//kC7//Pj/8er/4r3/0rn/26r/wKD/05n/mGb/u2H/qTn/jS7/7dT/z73/z6z/vWX/gUH/hTb/ky7/oSr/8un/4NT/1rn/tpX/0ZP/x33/qUX/gj7/gzz/gzn/5ML/vaX/x5//zor/yoX/pHP/7N7/yoP/snD/nF7/t1v/lS5zytgkAAACX0lEQVRIx+3WWVPaUBQHcA776g5CQATs3kpQSyCREPZV9rVgLbt16fr9H3ozMYSMzvRWfOg4/B/ymN/cc05yrmJt7cXL9fWNjYNXr71vPBZL4Ojk4/6+0+lyvd/a+rC9vbOzu3t4aECx2+0Oh8OEokDR6XR7e1oUq9Xnc7ttNpvZbNbr9ZubGo1GrVarVCqlUvnu7QpYASsAD/hiXIzf7y/xQCUqpEIdS/n6KMAIHEfEgUCBOP/w84AfhJBRkEI+EugbDATk7fY8ECZTUwB0wWAQ/L2e1TqbxabHQH1C0T/hCVAPECD2AAHL94ABsQdyoIKKXwShBX8HPN5UOUJnbsbn96aIMYpTJAdIqQUYQLo+zBQgUu5674AfRjHACCdAuZUDlBASB7jOthgAiCSGd8C40+E4DpWeRQ0Qk5MDMXeOmpjNWECCfz8vXEol+n2aTCZDV1AKhULhcLh5r0Qxvsm4QCZCF4CmW2cScAqyhJcCrqvlDF1oJao3iwDX7/fzKM1mk1gSSB+kshH6bJQeLwJxYp74kkDgKD2M0In6uWsR+Gycp7g8UEVAVw5w0t/04RK14RYXaNT5EqUCzn86AQmTpQAWjamQMPsQUIMLGy7g6ZbpQibVwAd8MzcL1ITNmfX4wKiBXyKfr40OMACmhgfUs99QiRCA22TqAsipzUYxzAAHsKS/Jy6rv07EKbrqdFj5d8ASREWhy0WjJQT0KiRAe8rv5BoDFAYQ8Kaq2VF6PqayjSz+TUsK3U8AYAbaXhHYmrD0kdB+ylsFWplalFxOulVQ/+m1ZQWsgOcO/AH3CGimCYN47AAAAABJRU5ErkJggg==);
}
.course-item-grid .item .info {
  bottom: 0;
  height: 41.3919413919%;
  padding-top: 5.1282051282%;
}
.course-item-grid .item .info .title,
.course-item-grid .item .info .attr {
  padding-left: 14px;
  padding-right: 14px;
}
.course-item-grid .item .info .title {
  line-height: 162.5%;
  font-size: 16px;
}
.course-item-grid .item .info .attr {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 17.6991150442%;
}
.course-item-grid .item .info .attr > div {
  float: left;
  line-height: 1;
}
.course-item-grid .item .info .attr > div .iconfont,
.course-item-grid .item .info .attr > div span {
  color: #9399a5;
}
.course-item-grid .item .info .attr > div .iconfont {
  font-size: 13px;
  width: 18px;
  display: inline-block;
}
.course-item-grid .item .info .attr-section {
  padding-right: 20px;
}
.course-item-grid .item .info .attr-section .divider {
  color: #ccc;
  padding-left: 6px;
  padding-right: 6px;
}
.course-item-grid .item .info .attr-market-price {
  margin-bottom: -5px;
  color: #ff7a45;
}
.course-item-grid .item .info .attr-market-price .price-num {
  font-size: 22px;
}
.course-item-grid .item .info .attr-market-num {
  padding-bottom: 6px;
}
.course-item-grid .item .info .attr-market-num .price-num {
  font-size: 14px;
}
.course-item-grid .item:hover .img img {
  transform: scale(1.08);
}
@media (max-width: 1199px) and (min-width: 768px) {
  .course-item-grid .item .info {
    padding-top: 2.9304029304%;
  }
  .course-item-grid .item .info .title {
    font-size: 14px;
  }
  .course-item-grid .item .info .attr > div,
.course-item-grid .item .info .attr > div .iconfont {
    font-size: 13px;
  }
}
@media (max-width: 767px) {
  .course-item-grid {
    margin-left: -8px;
    margin-right: -8px;
    margin-top: -16px;
  }
  .course-item-grid [class*=col-] {
    padding-left: 8px;
    padding-right: 8px;
  }
  .course-item-grid .item {
    margin-top: 16px;
  }
}
@media (max-width: 540px) {
  .course-item-grid .item.attr-two-row {
    padding-bottom: 106.3157894737%;
  }
  .course-item-grid .item.attr-two-row .img {
    height: 52.8052805281%;
  }
  .course-item-grid .item.attr-two-row .info {
    height: 47.1947194719%;
  }
  .course-item-grid .item.attr-two-row .info .attr {
    bottom: 13.986013986%;
  }
  .course-item-grid .item.attr-two-row .info .attr > div {
    float: none;
    width: 100%;
  }
  .course-item-grid .item.attr-two-row .info .attr > div + div {
    padding-top: 2.6402640264%;
  }
  .course-item-grid .item .info {
    padding-top: 2.9304029304%;
  }
  .course-item-grid .item .info .title,
.course-item-grid .item .info .attr {
    padding-left: 8px;
    padding-right: 8px;
  }
  .course-item-grid .item .info .title {
    font-size: 13px;
    line-height: 1.4;
  }
  .course-item-grid .item .info .attr > div {
    font-size: 12px;
  }
  .course-item-grid .item .info .attr > div .iconfont {
    font-size: 11px;
    width: 16px;
  }
  .course-item-grid .item .info .attr-section {
    padding-right: 10px;
  }
  .course-item-grid .item .info .attr-market-price .price-num {
    font-size: 18px;
  }
  .course-item-grid .item .info .attr-market-num {
    padding-bottom: 6px;
  }
  .course-item-grid .item .info .attr-market-num .price-num {
    font-size: 14px;
  }
}
@media (max-width: 375px) {
  .course-item-grid .item .info .title {
    line-height: 1.2;
  }
  .course-item-grid .item .info .attr > div {
    font-size: 11px;
  }
  .course-item-grid .item .info .attr > div .iconfont {
    font-size: 10px;
  }
  .course-item-grid .item .info .attr-market-price .price-symbol {
    font-size: 12px;
  }
  .course-item-grid .item .info .attr-market-price .price-num {
    font-size: 15px;
  }
  .course-item-grid .item .info .attr-market-num {
    padding-bottom: 6px;
  }
  .course-item-grid .item .info .attr-market-num .price-num {
    font-size: 14px;
  }
}

/* 通用进度条 */
.progress--label {
  position: relative;
  width: 140px;
  min-height: 1px;
  overflow: hidden;
}
.progress--label .progress--bar {
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -3px;
  width: 80px;
  min-height: 1px;
}
.progress--label .progress--bar .progress,
.progress--label .progress--bar .progress-bar {
  line-height: 0;
  font-size: 0;
  height: 6px;
  border-radius: 4px;
}
.progress--label .progress--bar .progress {
  margin-bottom: 0;
  background-color: #e8f1ff;
}
.progress--label .progress--bar .progress-bar {
  background-color: #0f6af3;
}
.progress--label .progress--text {
  float: right !important;
  color: #676c73;
}

@media (max-width: 767px) {
  .progress--label {
    width: 128px;
  }
  .progress--label .progress--text {
    font-size: 12px;
  }
}
.item--attr > p {
  line-height: 1;
  margin-bottom: 0;
}
.item--attr > p + p {
  margin-top: 18px;
}
.item--attr > p .iconfont {
  color: #9399a5;
  width: 18px;
  font-size: 13px;
  display: inline-block;
}
.item--attr > p .text,
.item--attr > p .count-down {
  color: #555;
}
.item--attr > p .text .divider {
  color: #ccc;
  padding-left: 6px;
  padding-right: 6px;
}
.item--attr > p .popover-toggle {
  margin-left: 0px;
}
.item--attr > p .popover-toggle .iconfont {
  font-size: 14px;
}
.item--attr > p.living .img-living {
  width: 13px;
  margin-top: -6px;
  margin-right: 5px;
}
.item--attr > p.living > .text {
  color: #ff7a45 !important;
}
.item--attr > p .count-down .text {
  color: #ff7a45;
  margin: 0 2px;
}

@media (max-width: 1199px) and (min-width: 768px) {
  .item--attr > p .iconfont {
    font-size: 13px;
  }
  .item--attr > p .text {
    font-size: 13px !important;
  }
}
@media (max-width: 991px) {
  .item--attr > p + p {
    margin-top: 12px;
  }
}
@media (max-width: 767px) {
  .item--attr > p + p {
    margin-top: 8px;
  }
}
@media (max-width: 540px) {
  .item--attr > p .iconfont {
    font-size: 11px;
    width: 16px;
  }
  .item--attr > p .text {
    font-size: 12px !important;
  }
  .item--attr > p.living .img-living {
    width: 11px;
    margin-top: -4px;
  }
  .item--attr > p .count-down {
    font-size: 12px !important;
  }
}
@media (max-width: 480px) {
  .item--attr > p + p {
    margin-top: 4px;
  }
  .item--attr > p .text .divider {
    padding-left: 3px;
    padding-right: 3px;
  }
}
@media (max-width: 375px) {
  .item--attr > p .iconfont {
    font-size: 10px;
  }
  .item--attr > p .count-down .text {
    margin: 0;
  }
}
.player-study-limit-tip {
  position: relative;
  background-color: #000;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.player-study-limit-tip .img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.player-study-limit-tip .text {
  position: absolute;
  top: 36.3636363636%;
  left: 38.6046511628%;
  color: #fff;
  width: 6.511627907%;
  text-align: center;
  line-height: 1;
  font-size: 24px;
}
.player-study-limit-tip .week {
  position: absolute;
  top: 35.5371900826%;
  left: 62.0930232558%;
  color: #fff;
  width: 6.511627907%;
  text-align: center;
  line-height: 1;
  font-size: 24px;
}
@media (max-width: 991px) {
  .player-study-limit-tip .img {
    transform: scale(1.1);
  }
  .player-study-limit-tip .text {
    top: 34.7107438017%;
    left: 37.9069767442%;
  }
  .player-study-limit-tip .week {
    top: 33.8842975207%;
    left: 63.2558139535%;
  }
}
@media (max-width: 767px) {
  .player-study-limit-tip .text {
    font-size: 3.14vw;
  }
}
@media (max-width: 540px) {
  .player-study-limit-tip .img {
    transform: scale(1.5);
  }
  .player-study-limit-tip .text {
    font-size: 4.28vw;
    top: 28.9256198347%;
    left: 33.023255814%;
    width: 9.3023255814%;
  }
  .player-study-limit-tip .week {
    font-size: 4.28vw;
    top: 28.5123966942%;
    left: 67.4418604651%;
    width: 9.3023255814%;
  }
}

@media (max-width: 991px) {
  .coursewarewap {
    margin-top: 0px;
  }
  .coursewarewap .courseware-body {
    margin-top: 10px;
  }
  .coursewarewap .courseware-body .detail-comment .gross-histry {
    padding-top: 10px;
    text-align: center;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 10px;
  }
  .coursewarewap .courseware-body .detail-comment .gross-histry .history {
    font-size: 16px;
  }
  .coursewarewap .courseware-body .detail-comment .gross .gross-title {
    padding-left: 0px;
    border-left: none;
    font-size: 16px;
    margin-top: 10px;
  }
  .coursewarewap .courseware-body .detail-comment .gross .gross-content {
    margin-top: 10px;
    padding-bottom: 10px;
    padding-left: 0px;
    border-bottom: 1px solid #e5e5e5;
  }
}
@media (max-width: 991px) and (max-width: 520px) {
  .coursewarewap .courseware-body .detail-comment .gross .gross-content .down span {
    display: none;
  }
}
@media (max-width: 991px) {
  .coursewarewap .courseware-body .detail-comment .special {
    border: none;
    padding-top: 10px;
  }
  .coursewarewap .courseware-body .detail-comment .special .resource {
    padding-bottom: 0px;
  }
}
@media (max-width: 991px) and (max-width: 520px) {
  .coursewarewap .courseware-body .detail-comment .special .gross-content .down span {
    display: none;
  }
}
.lesson-intro__width-856 {
  width: 856px;
}
@media (max-width: 1199px) {
  .lesson-intro__width-856 {
    width: 100%;
  }
}

.lesson-teacher {
  display: block !important;
  margin-top: 30px !important;
}
.lesson-teacher .zmodem {
  background-color: #fff;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-radius: 4px;
}
.lesson-teacher .zmodem .zmodem-bg {
  width: 60%;
  height: 36px;
  line-height: 36px;
  background: linear-gradient(to right, #ff9605, #ff6f05, #fff);
}
.lesson-teacher .zmodem .imgage-top {
  margin-top: 24px;
}
.lesson-teacher .zmodem .imgage-right {
  width: 18px;
  height: 18px;
  margin-left: 24px;
}
.lesson-teacher .zmodem .imgage-right img {
  width: 100%;
  vertical-align: text-bottom;
}
.lesson-teacher .zmodem .system {
  font-size: 18px;
  color: #ffffff;
  margin-left: 6px;
}
.lesson-teacher .zmodem .universal {
  margin-top: 20px;
  font-size: 16px;
  color: #3e454d;
  padding-left: 24px;
  padding-right: 24px;
}
.lesson-teacher .zmodem .universal a {
  font-size: 14px;
}
@media (max-width: 1199px) {
  .lesson-teacher {
    display: none !important;
  }
}
.lesson-teacher .resource {
  background-color: #fff;
  padding: 20px 24px;
  margin-bottom: 20px;
  border-radius: 4px;
}
.lesson-teacher .resource .exercises {
  width: 26px;
  height: 24px;
  margin-right: 10px;
  vertical-align: bottom;
}
.lesson-teacher .resource .exercises img {
  width: 100%;
}
.lesson-teacher .resource .down {
  font-size: 16px;
  color: #555;
}
.lesson-teacher .resource .icon-next {
  color: #9399a5;
  font-size: 14px;
}
.lesson-teacher .resource a:hover .down {
  color: #0f6af3;
}
.lesson-teacher .resource {
  background-color: #fff;
  padding: 24px;
}
.lesson-teacher .resource .hot-down {
  color: #3e454d;
  font-size: 18px;
}
.lesson-teacher .resource .down-content {
  margin-top: 4px;
}
.lesson-teacher .resource .down-content .item-down {
  margin-top: 16px;
}
.lesson-teacher .resource .down-content .item-down .down-ico {
  width: 18px;
  height: 18px;
}
.lesson-teacher .resource .down-content .item-down .down-ico img {
  width: 100%;
  height: 100%;
  vertical-align: baseline;
}
.lesson-teacher .resource .down-content .item-down .down-title {
  width: 86%;
  margin-left: 8px;
}
.lesson-teacher .resource .down-content .item-down .down-title a {
  display: block;
}
.lesson-teacher .lesson--recommend--item.lesson-box {
  padding-bottom: 20px !important;
}
.lesson-teacher .lesson--recommend--item .lesson-title {
  height: 50px !important;
}
.lesson-teacher .lesson--recommend--item .content {
  padding-top: 15px;
  padding-bottom: 20px;
  border-bottom: 1px dashed #e5e5e5;
}
.lesson-teacher .lesson--recommend--item .content .related-lecturer .image {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  vertical-align: top;
  overflow: hidden;
  background-color: #667392;
}
.lesson-teacher .lesson--recommend--item .content .related-lecturer .image img {
  width: 100%;
  margin-top: 14px;
}
.lesson-teacher .lesson--recommend--item .content .related-lecturer .teache-card {
  margin-left: 10px;
  margin-top: 4px;
  width: 196px;
}
.lesson-teacher .lesson--recommend--item .content .related-lecturer .teache-card .name {
  margin-left: 10px;
  font-size: 18px;
  color: #3e454d;
}
.lesson-teacher .lesson--recommend--item .content .related-lecturer .teache-card .consultation {
  font-size: 12px;
  color: #ff7a45;
  background-color: #fff4ed;
  width: 94px;
  height: 24px;
  text-align: center;
  line-height: 24px;
  border-radius: 12px;
  margin-top: 10px;
  margin-left: 10px;
}
.lesson-teacher .lesson--recommend--item .content .related-lecturer .teache-card .trainid {
  font-size: 12px;
  width: 75px;
  height: 24px;
  border-radius: 12px;
  text-align: center;
  line-height: 24px;
  color: #0f6af3;
  background-color: #eef4fe;
  margin-top: 10px;
  margin-left: 10px;
}
.lesson-teacher .lesson--recommend--item .content .related-lecturer .teache-card .timetable span {
  display: inline-block;
  background-color: #eaf1fe;
  color: #0f6af3;
  width: 68px;
  height: 24px;
  border-radius: 12px;
  text-align: center;
  line-height: 24px;
  font-size: 12px;
}
.lesson-teacher .lesson--recommend--item .content .related-lecturer .teache-card .director {
  margin-left: 10px;
  margin-top: 12px;
  color: #9399a5;
}
.lesson-teacher .lesson--recommend--item .content .introduced {
  margin-top: 26px;
  color: #9399a5;
}
.lesson-teacher .lesson--recommend--item .content:hover .related-lecturer .teache-card .name {
  color: #0f6af3;
}
.lesson-teacher .lesson--recommend--item .teacher-bottom:last-child {
  border-bottom: none;
}
.lesson-teacher .lesson--recommend--item .certificate .nomal-img {
  text-align: center;
}
.lesson-teacher .lesson--recommend--item .certificate .card-book {
  width: 100%;
  text-align: center;
  padding-bottom: 20px;
}
.lesson-teacher .lesson--recommend--item .certificate .card-book img {
  width: 200px;
}
.lesson-teacher .lesson--recommend--item .certificate .reminder {
  margin-top: 20px;
  text-align: center;
  font-size: 14px;
  color: #9399a5;
  padding-bottom: 20px;
}
.lesson-teacher .lesson--recommend--item {
  padding: 0 24px;
  background-color: #fff;
  margin-bottom: 24px;
  border-radius: 4px;
  padding-bottom: 20px;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--title {
  height: 65px;
  line-height: 65px;
  color: #3e454d;
  font-size: 18px;
  overflow: hidden;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul {
  overflow: hidden;
  width: 100%;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li {
  height: 63px;
  margin-bottom: 24px;
  cursor: pointer;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map {
  float: left;
  width: 60px;
  height: 60px;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map > img {
  height: 100%;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map .map-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 28px;
  color: #fff;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map .lesson--recommend--li--pic--icon {
  font-size: 12px;
  padding: 4px 6px;
  position: absolute;
  top: 5px;
  left: 5px;
  border-radius: 4px;
  transform: scale(0.7);
  transform-origin: left top;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.7);
  color: #fff;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map.icon-colors-1 {
  background: #76B1F6;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map.icon-colors-2 {
  background: #69C4E7;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map.icon-colors-3 {
  background: #999AEF;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map.icon-colors-4 {
  background: #F6CC3D;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map.icon-colors-5 {
  background: #EB6C4B;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic-map.icon-colors-6 {
  background: #86DBAC;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text-map {
  float: right;
  width: 194px !important;
  height: 54px;
  position: relative;
  padding-top: 4px;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text-map .lesson--recommend--li--text--title-map {
  color: #3e454d;
  font-size: 14px;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text-map .lesson--recommend--li--text--title-map .lesson--recommend--li--text--title--tag {
  float: left;
  padding: 3px 4px;
  color: #000;
  font-size: 12px;
  line-height: 1;
  border-radius: 2px;
  margin-right: 4px;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text-map .lesson--recommend--li--text--title-map .lesson--recommend--li--text--title--tag.lesson--recommend--li--text--title--tag__live {
  background: linear-gradient(#ff6700, #f33a0d);
  color: #fff;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text-map .lesson--recommend--li--text--title-map .lesson--recommend--li--text--title--tag.lesson--recommend--li--text--title--tag__await {
  background-color: #5897f7;
  color: #fff;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text-map .lesson--recommend--li--text--title-map .lesson--recommend--li--text--title--tag > .iconfont {
  font-size: 12px;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text-map .lesson--recommend--li--text--descr {
  color: #9399a5;
  font-size: 12px;
  white-space: nowrap;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text-map .lesson--recommend--li--text--descr > span {
  margin-right: 4px;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text-map .lesson--recommend--li--text--descr > .iconfont {
  font-size: 12px;
  margin-right: 2px;
}
.lesson-teacher .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li.lesson-study:hover .lesson--recommend--li--text-map .lesson--recommend--li--text--title-map {
  color: #0f6af3;
}
.lesson-teacher .lesson--recommend--item .lesson--like--ul {
  min-height: 152px;
}
.lesson-teacher .lesson--recommend--relevant .lesson--recommend--relevant--swiper-study {
  height: auto !important;
  padding-bottom: 20px;
}
.lesson-teacher .lesson--recommend--like .lesson--recommend--title--refresh {
  line-height: 70px;
  font-size: 12px;
  color: #9399a5;
  float: right;
  cursor: pointer;
}
.lesson-teacher .lesson--recommend--like .lesson--recommend--title--refresh .iconfont {
  font-size: 12px;
}
@media (max-width: 1199px) {
  .lesson-teacher .lesson-down-content-wrap .lesson--recommend.lesson--recommend__show {
    display: none;
  }
  .lesson-teacher .lesson-down-content-wrap .lesson-intro.lesson-intro__width-856 {
    width: 100%;
  }
}

.learning-progress .study-schedule {
  position: absolute;
  background-color: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100%;
  top: 0;
  z-index: 3;
}
.learning-progress .study-schedule .circle-wrapper {
  display: table;
  position: absolute;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
  width: 100px;
  height: 100px;
}
@media (max-width: 456px) {
  .learning-progress .study-schedule .circle-wrapper {
    width: 80px;
    height: 80px;
  }
}
.learning-progress .study-schedule .circle-wrapper .svg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
}
.learning-progress .study-schedule .circle-wrapper .text-wrapper {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}
.learning-progress .study-schedule .circle-total-progress {
  z-index: 1;
}
.learning-progress .study-schedule .circle-total-progress .svg {
  transform: rotate(-90deg);
}
.learning-progress .study-schedule .circle-total-progress .svg .circle {
  stroke-width: 10px;
}
.learning-progress .study-schedule .circle-total-progress .svg .circle.circle-bar {
  fill: none;
  stroke: #cccee0;
  stroke: rgba(152, 154, 184, 0.7);
  stroke-width: 7.143%;
}
.learning-progress .study-schedule .circle-total-progress .svg .circle.circle-progress {
  fill: none;
  stroke-width: 7.143%;
  stroke-linejoin: round;
  stroke-linecap: round;
}
.learning-progress .study-schedule .circle-total-progress .svg .circle.circle-progress.fill {
  stroke: #fff;
}
.learning-progress .study-schedule .circle-total-progress .text-top {
  font-size: 30px;
  padding-top: 10px;
  padding-bottom: 3px;
}
@media (max-width: 456px) {
  .learning-progress .study-schedule .circle-total-progress .text-top {
    font-size: 24px;
  }
}
.learning-progress .study-schedule .circle-total-progress .text-bottom {
  margin-top: 22px;
}

.learning-progress:hover .study-schedule {
  display: block;
}

.learning-progress:hover .study-schedule .circle-wrapper .text-wrapper {
  color: #fff;
}

a:hover .learning-progress .study-schedule .circle-wrapper .text-wrapper {
  color: #fff;
}

.oldlearning .detail-list-title > a {
  color: #0f6af3 !important;
}
.oldlearning .detail-list-title > a i {
  color: #0f6af3 !important;
}

.hidden-2 {
  display: none;
}

.modal-mobile-task-level-course .modal-body {
  padding: 15px;
  padding-left: 0px;
  padding-right: 0px;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .title {
  padding-left: 4vw;
  padding-right: 4vw;
  padding-bottom: 4vw;
  border-bottom: 1px solid #e5e5e5;
  font-size: 4.8vw;
  color: #3e454d;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .title .recommend-to {
  font-size: 3.7333333333vw;
  color: #9399A5;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .title .close-course i {
  color: #676c73;
  font-size: 3.2vw;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .content {
  padding-left: 4vw;
  padding-right: 4vw;
  padding-top: 6.6666666667vw;
  padding-bottom: 6.6666666667vw;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .content .image {
  width: 18.1333333333vw;
  vertical-align: middle;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .content .image img {
  width: 100%;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .content .midder-content {
  margin-left: 3.7333333333vw;
  vertical-align: middle;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .content .midder-content .midder-title {
  font-size: 4.8vw;
  font-weight: bold;
  color: #000000;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .content .midder-content .midder-intro {
  margin-top: 2.9333333333vw;
  font-size: 3.2vw;
  font-weight: 500;
  color: #9399A5;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .content .open-app {
  margin-top: 4.5333333333vw;
}
.modal-mobile-task-level-course .modal-body .downApp-cousor .content .open-app .interlinkage {
  display: block;
  width: 22.9333333333vw;
  height: 9.0666666667vw;
  line-height: 9.0666666667vw;
  font-size: 4vw;
  border-radius: 100px;
  background-color: #0F6AF3;
  color: #fff;
  text-align: center;
}

.modal-pc-bottom .modal-dialog {
  transition: transform 0.3s ease-out;
  transform: translate(0, 25%);
  width: 100% !important;
  margin-top: 0 !important;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  border-top-left-radius: 28px;
  border-top-right-radius: 28px;
  overflow: hidden;
}

.new-inner-course-classfly {
  background-color: #fff;
}
.new-inner-course-classfly .course-list-wrapper {
  overflow: initial;
}
.new-inner-course-classfly .course-list-wrapper .course-item-grid .item {
  border-radius: 8px;
  box-shadow: 0px 4px 8px 0px rgba(95, 101, 105, 0.05);
}
.new-inner-course-classfly .course-list-wrapper .course-item-grid .item:hover {
  box-shadow: 0 12px 20px 0 rgba(95, 101, 105, 0.1);
}

/* 课程列表 */
.new-header-top {
  background-color: #fff;
}
.new-header-top .course-list-wrapper {
  overflow: initial;
}
.new-header-top .course-list-wrapper .course-item-grid .item {
  border-radius: 8px;
  box-shadow: 0px 4px 8px 0px rgba(95, 101, 105, 0.05);
}
.new-header-top .course-list-wrapper .course-item-grid .item:hover {
  box-shadow: 0 12px 20px 0 rgba(95, 101, 105, 0.1);
}

.course-list-wrapper {
  overflow: hidden;
}
.course-list-wrapper .section {
  padding-top: 10px;
}
.course-list-wrapper .section + .section {
  padding-top: 30px;
}
.course-list-wrapper .section .mod-title {
  z-index: 1;
  position: relative;
  color: #111;
  font-size: 24px;
  line-height: 1;
  padding-bottom: 20px;
}
.course-list-wrapper .section .mod-title .right {
  position: absolute;
  bottom: 22px;
  right: 0;
}
.course-list-wrapper .section .mod-title .right .more {
  font-size: 16px;
}
.course-list-wrapper .section .mod-content .item {
  display: block;
}
@media (max-width: 767px) {
  .course-list-wrapper .section .mod-title {
    font-size: 20px;
    padding-bottom: 15px;
  }
  .course-list-wrapper .section .mod-title .right {
    bottom: 16px;
  }
}

/* 分享、收藏 */
.__attr {
  padding-left: 20px;
}
.__attr > div {
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  height: 30px;
  display: inline-block;
}
.__attr > div ._attr-popup {
  display: none;
}
.__attr .favor.favored > i {
  color: #ff7a45;
}
.__attr .share > i {
  font-size: 15px;
}

@media (min-width: 1200px) {
  .__attr > div {
    cursor: pointer;
  }
  .__attr > div + div {
    margin-left: 16px;
  }
}
@media (min-width: 768px) {
  .__attr > div ._attr-popup {
    position: absolute;
    right: -32px;
    top: 30px;
    z-index: 10;
    background-color: #fff;
    border: 1px solid #d5d5d5;
    border-radius: 4px;
    cursor: default;
  }
  .__attr > div ._attr-popup:before, .__attr > div ._attr-popup:after {
    content: " ";
    border-bottom: 8px solid #d5d5d5;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    position: absolute;
    top: -8px;
    right: 30px;
  }
  .__attr > div ._attr-popup:after {
    border-bottom: 8px solid #fff;
    top: -6px;
  }
  .__attr > div ._attr-popup .popup-body .qrcode {
    width: 100px;
    height: 100px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
  }
  .__attr > div ._attr-popup .popup-body .qrcode > img {
    height: 100%;
  }
  .__attr > div:hover ._attr-popup {
    display: block !important;
  }
  .__attr .share ._attr-popup {
    width: 160px;
    text-align: center;
  }
  .__attr .share ._attr-popup .popup-head {
    line-height: 38px;
  }
  .__attr .share ._attr-popup .popup-body {
    line-height: 0;
  }
  .__attr .share ._attr-popup .popup-foot {
    min-height: 15px;
  }
  .__attr .share ._attr-popup .popup-foot .btn {
    margin-bottom: 5px;
    color: #3e454d;
  }
  .__attr .share ._attr-popup .popup-foot .btn:hover {
    color: #0f6af3;
  }
}
@media (max-width: 1199px) {
  .__attr > div {
    display: block;
  }
}
@media (max-width: 767px) {
  .__attr > div ._attr-popup {
    display: none;
  }
}
@media (max-width: 767px) {
  .__attr {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 5999;
  }
  .__attr > div {
    display: inline-block;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: #fff;
    background: rgba(0, 0, 0, 0.5);
  }
  .__attr > div + div {
    margin-left: 20px;
  }
  .__attr > div > i {
    margin-right: 0;
  }
  .__attr > div .text {
    display: none;
  }
  .__attr .favor .iconfont {
    font-size: 15px;
  }
  .__attr .share .iconfont {
    font-size: 14px;
  }
}
@media (max-width: 540px) {
  .__attr {
    top: 14px;
    right: 14px;
  }
  .__attr > div + div {
    margin-left: 14px;
  }
}

.cousult-header .detail-header-info .item--attr > p.last-child-money {
  margin-top: 20px;
  color: #f34235;
}
.cousult-header .detail-header-info .item--attr > p.last-child-money .money {
  font-size: 18px;
}
.cousult-header .detail-header-info .item--attr > p.last-child-money > span {
  color: #f34235;
}

.learning-user-wrapper {
  line-height: 22px;
}
.learning-user-wrapper .learning-count .iconfont {
  font-size: 18px;
  color: #676c73;
  margin-right: 10px;
  display: inline-block;
  vertical-align: top;
}

.studymap-select-btn {
  display: inline-block;
  color: #676c73;
  margin-left: 15px;
}
.studymap-select-btn .iconfont {
  font-size: 14px;
  color: #ff7a45;
  margin-right: 5px;
}
@media (max-width: 480px) {
  .studymap-select-btn {
    margin-left: 10px;
  }
  .studymap-select-btn,
.studymap-select-btn .iconfont {
    font-size: 12px;
  }
}

/* 课程详情页面 */
.detail-header,
.detail-body {
  background-color: #fff;
  border-radius: 8px;
}
.detail-header .alternative,
.detail-body .alternative {
  padding-left: 20px;
}
.detail-header .alternative .impressive,
.detail-body .alternative .impressive {
  margin-left: 2%;
}
@media (max-width: 768px) {
  .detail-header .alternative,
.detail-body .alternative {
    padding-left: 10px;
  }
}

.detail-header.has-leaning-user {
  position: relative;
  padding-bottom: 24px;
}
.detail-header.has-leaning-user .learning-user-wrapper {
  position: absolute;
  left: 30px;
  top: 270px;
}
@media (max-width: 991px) {
  .detail-header.has-leaning-user .learning-user-wrapper {
    left: 20px;
    top: 204px;
  }
}
@media (max-width: 767px) {
  .detail-header.has-leaning-user {
    padding-bottom: 0;
  }
  .detail-header.has-leaning-user .learning-user-wrapper {
    left: 15px;
    top: auto;
    bottom: 60px;
  }
  .detail-header.has-leaning-user .learning-user-wrapper .they-are-learning {
    margin-left: -2px;
  }
  .detail-header.has-leaning-user .info-study {
    padding-top: 25px;
  }
}
.detail-header .learning-evaluation {
  position: absolute;
  right: 0;
  bottom: 3px;
}
.detail-header .learning-evaluation .text {
  display: inline-block;
  background-color: #e3eeff;
  line-height: 26px;
  padding-left: 20px;
  padding-right: 10px;
  color: #0f6af3;
  border-top-right-radius: 13px;
  border-bottom-right-radius: 13px;
  position: relative;
}
.detail-header .learning-evaluation .text > img {
  position: absolute;
  top: -3px;
  left: -22px;
  width: 32px;
}
.detail-header .learning-evaluation .text.animation > img {
  -webkit-animation: bounceIn 0.75s 0.5s;
          animation: bounceIn 0.75s 0.5s;
}

.detail-header .dl-horizontal {
  margin-bottom: 0;
}
.detail-header .dl-horizontal dt {
  width: 460px;
  height: 285px;
}
.detail-header .dl-horizontal dd {
  margin-left: 460px;
}
.detail-header .detail-header-cover,
.detail-header .detail-header-info {
  padding: 30px;
}
.detail-header .detail-header-cover {
  width: 100%;
  height: 100%;
}
.detail-header .detail-header-cover img {
  width: 100%;
}
.detail-header .detail-header-cover .cover-img {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}
.detail-header .detail-header-cover .cover-img .new-cover-course .new-cover-course-surname {
  width: 188px;
  height: 44px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50px;
}
.detail-header .detail-header-cover .cover-img .new-cover-course .new-cover-play {
  font-size: 16px;
  color: #fff;
}
.detail-header .detail-header-cover .cover-img .new-cover-course .new-cover-play .iconfont {
  font-size: 18px;
  vertical-align: bottom;
  margin-right: 8px;
}
.detail-header .detail-header-cover .cover-course .cover-play {
  font-size: 18px;
  line-height: 1.4285714286;
}
.detail-header .detail-header-cover .cover-course .cover-play .iconfont {
  font-size: 50px;
}
.detail-header .detail-header-info {
  position: relative;
  min-height: 285px;
  padding-left: 0;
  display: table;
  width: 100%;
}
.detail-header .detail-header-info .header-info-tr {
  display: table-row;
}
.detail-header .detail-header-info .header-info-td {
  display: table-cell;
}
.detail-header .detail-header-info .header-info-td.td2 {
  vertical-align: bottom;
  position: relative;
  padding-top: 15px;
}
.detail-header .detail-header-info .header-info-td.td2 .credential {
  position: absolute;
  top: -10%;
  right: 0;
}
.detail-header .detail-header-info .info-title {
  font-size: 20px;
  line-height: 1.4285714286;
  line-height: 36px;
  margin-top: 0;
  margin-bottom: 20px;
}
.detail-header .detail-header-info .item--attr .teacher-span {
  padding-right: 10px;
}
.detail-header .detail-header-info .item--attr .cousult-span {
  padding-left: 10px;
  margin: 0;
  border-left: 1px solid #ccc;
}
.detail-header .detail-header-info .item--attr .cousult-span > a {
  color: #ff7a45;
}
@media (min-width: 768px) {
  .detail-header .detail-header-info .item--attr > p + p {
    margin-top: 8px;
  }
}
@media (min-width: 992px) {
  .detail-header .detail-header-info .item--attr > p + p {
    margin-top: 10px;
  }
}
@media (max-width: 991px) {
  .detail-header .dl-horizontal dt {
    width: 344px;
    height: 211px;
  }
  .detail-header .dl-horizontal dd {
    margin-left: 344px;
  }
  .detail-header .detail-header-cover,
.detail-header .detail-header-info {
    padding: 20px;
  }
  .detail-header .detail-header-info {
    min-height: 211px;
    padding-left: 0;
  }
  .detail-header .detail-header-info .info-title {
    font-size: 16px;
    margin-bottom: 10px;
  }
}
@media (max-width: 767px) {
  .detail-header {
    position: relative;
    margin-left: -15px;
    margin-right: -15px;
  }
  .detail-header .dl-horizontal dt {
    width: auto;
    height: 0;
    padding-bottom: 56.2666666667%;
    float: none;
    position: relative;
  }
  .detail-header .dl-horizontal dd {
    margin-left: 0;
  }
  .detail-header .detail-header-cover,
.detail-header .detail-header-info {
    padding: 0;
  }
  .detail-header .detail-header-cover {
    position: absolute;
    top: 0;
    left: 0;
  }
  .detail-header .detail-header-info {
    position: static;
    min-height: auto;
    padding: 15px;
  }
}

.new-detail-header {
  background-color: transparent;
}
.new-detail-header .dl-horizontal dt {
  width: 430px;
  height: 255px;
}
.new-detail-header .dl-horizontal dd {
  margin-left: 430px;
}
@media (max-width: 991px) {
  .new-detail-header .dl-horizontal dt {
    width: 324px;
    height: 191px;
  }
  .new-detail-header .dl-horizontal dd {
    margin-left: 324px;
  }
}
@media (max-width: 991px) and (max-width: 767px) {
  .new-detail-header .dl-horizontal dt {
    width: auto;
    height: 0;
    padding-bottom: 56.2666666667%;
    float: none;
    position: relative;
  }
  .new-detail-header .dl-horizontal dd {
    margin-left: 0px;
  }
  .new-detail-header .dl-horizontal dd .detail-header-info {
    padding-top: 15px;
  }
}
.new-detail-header .dl-horizontal .new-detail-header-cover {
  padding-top: 0px;
  padding-left: 0px;
}
.new-detail-header .dl-horizontal .new-detail-header-cover .cover-img {
  border-radius: 12px;
}
@media (max-width: 767px) {
  .new-detail-header .dl-horizontal .new-detail-header-cover .cover-img {
    border-radius: 0;
  }
}
.new-detail-header .dl-horizontal .new-detail-header-info {
  padding-top: 0px;
  min-height: 255px;
}
@media (max-width: 991px) {
  .new-detail-header .dl-horizontal .new-detail-header-info {
    min-height: 191px;
  }
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-title {
  font-size: 24px;
  color: #1f2329;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .__attr > div {
  height: 28px;
  width: 28px;
  border-radius: 4px;
  background-color: #fff;
  text-align: center;
  line-height: 28px;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .__attr > div:hover .icon-kedan {
  color: #0f6af3;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .__attr > div:hover .icon-share {
  color: #0f6af3;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .__attr > div:hover .icon-star-empty {
  color: #ff7a45;
}
@media (max-width: 1199px) {
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .__attr > div {
    margin-top: 10px;
  }
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .__attr i {
  font-size: 12px;
}
@media (max-width: 767px) {
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .__attr > div {
    display: inline-block;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: #fff;
    background: rgba(0, 0, 0, 0.5);
  }
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .__attr .favor .iconfont {
    font-size: 15px;
  }
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .__attr i {
    font-size: 16px;
  }
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .filleted {
  border-radius: 22px;
}
@media (max-width: 1199px) {
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .filleted {
    border-radius: 20px;
  }
}
@media (max-width: 1199px) and (max-width: 991px) {
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .filleted {
    border-radius: 18px;
  }
}
@media (max-width: 1199px) and (max-width: 991px) and (max-width: 767px) {
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .filleted {
    border-radius: 16px;
  }
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .free-blue {
  background: transparent;
  color: #0f6af3;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 24px;
  margin-right: 14px;
  font-size: 18px;
}
@media (max-width: 991px) {
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .free-blue {
    font-size: 16px;
  }
}
@media (max-width: 991px) and (max-width: 768px) {
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .free-blue {
    margin-right: 10px;
  }
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .commandbutton {
  min-width: 140px;
  border-radius: 24px;
  font-size: 18px;
}
@media (max-width: 991px) {
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .commandbutton {
    min-width: auto;
    font-size: 16px;
  }
}
@media (max-width: 991px) and (max-width: 768px) {
  .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .commandbutton {
    font-size: 14px;
  }
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .recommend-com-buy-wrapper {
  display: inline-block;
  vertical-align: middle;
  margin-left: 20px;
  color: #676c73;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .recommend-com-buy-wrapper .iconfont {
  color: #9399a5;
  font-size: 14px;
  margin-right: 5px;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .recommend-com-buy-wrapper > a:hover {
  color: #0f6af3;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .middel-tag {
  margin-bottom: 20px;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .middel-tag .item-tag {
  font-size: 12px;
  color: #9399A5;
  background: #F7F7F7;
  border-radius: 4px;
  padding: 4px 6px;
  max-width: 100%;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .middel-tag .item-tag + .item-tag {
  margin-left: 6px;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .text {
  font-size: 14px;
  color: #676c73;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .progressive {
  padding-right: 22px;
  margin-right: 4px;
  font-size: 16px;
  position: relative;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .progressive.progressive:before {
  content: "";
  display: inline-block;
  position: absolute;
  right: 8px;
  top: 3px;
  width: 1px;
  height: 10px;
  background-color: #9399a5;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .pitch-number {
  margin-right: 10px;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .cousult-span {
  border-left: none;
  padding-right: 10px;
  padding-left: 16px;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .popover-toggle {
  padding-right: 8px;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .popover-toggle .icon-yiwen {
  vertical-align: text-top;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .cousult-after {
  position: relative;
  display: inline-block;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .cousult-after::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 10px;
  background-color: #9399a5;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .new-learning-user-wrapper {
  margin-top: 20px;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .new-learning-user-wrapper .learning-count {
  font-size: 16px;
  color: #676c73;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .buy-price {
  margin-top: 20px;
  font-weight: bold;
  font-size: 24px;
  color: #F53945;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .item--attr .buy-price span {
  font-size: 14px;
}

.intermediate-guidance {
  display: none;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 15px;
  padding-bottom: 15px;
}
@media (max-width: 766px) {
  .intermediate-guidance {
    display: block;
  }
}
.intermediate-guidance a {
  display: block;
  width: 100%;
  height: 9.6vw;
  background: #0F6AF3;
  border-radius: 4.8vw;
  line-height: 9.6vw;
  font-size: 4vw;
  text-align: center;
  font-weight: 500;
  color: #FFFFFF;
}

.detail-header-builder {
  margin-top: 30px;
}
@media (max-width: 767px) {
  .detail-header-builder {
    margin-top: 20px;
  }
}
.detail-header-builder img {
  width: 100%;
}
.detail-header-builder.HH-miniappQRCode {
  cursor: pointer;
}

.policy-compilation {
  background-color: #fff;
  margin-top: 30px;
  padding-top: 20px;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 4px;
}
.policy-compilation .policy-title {
  font-size: 18px;
  color: #3e454d;
  padding-bottom: 5px;
}
.policy-compilation .policy-list .list .li-list {
  padding-bottom: 16px;
}
.policy-compilation .policy-list .list .li-list .photo {
  display: inline-block;
  height: 100%;
}
.policy-compilation .policy-list .list .li-list .photo img {
  width: 12px;
  height: 14px;
}
.policy-compilation .policy-list .list .li-list .title-content {
  vertical-align: middle;
  display: inline-block;
  font-size: 14px;
  color: #676c73;
  margin-left: 10px;
  width: 90%;
}

.lesson--desc--body {
  display: none;
}
@media (max-width: 1199px) {
  .lesson--desc--body {
    display: block;
  }
}

.course-module-nav {
  position: relative;
  border-bottom: 1px #e5e5e5 solid;
}
.course-module-nav > li > a {
  font-size: 20px;
  color: #555;
  padding-left: 0;
  padding-right: 0;
  border-radius: 0;
  border-bottom: 3px transparent solid;
}
.course-module-nav > li > a > span {
  font-size: 14px;
  margin-left: 3px;
}
.course-module-nav > li .has-audition {
  position: absolute;
  top: 50%;
  left: 112%;
  width: 35px;
  height: 20px;
  background-color: #0f6af3;
  color: #fff;
  margin-top: -18px;
  font-size: 12px;
  line-height: 20px;
  text-align: center;
  border-radius: 9px 10px 10px 0px;
}
.course-module-nav > li .has-audition1 {
  top: 50%;
  left: 104%;
  margin-top: -14px;
  filter: alpha(opacity=100);
  opacity: 1;
}
.course-module-nav > li .has-audition1 .tooltip-arrow {
  border-right-color: #0f6af3;
}
.course-module-nav > li .has-audition1 .tooltip-inner {
  background-color: #0f6af3;
  white-space: nowrap;
}
.course-module-nav > li > a:hover, .course-module-nav > li > a:hover:hover, .course-module-nav > li.active > a, .course-module-nav > li.active > a:hover {
  color: #0f6af3;
  background: none;
  border-bottom-color: #0f6af3;
}
@media (min-width: 768px) {
  .course-module-nav {
    padding-top: 6px;
  }
  .course-module-nav > li + li {
    margin-left: 60px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .course-module-nav > li + li {
    margin-left: 40px;
  }
}
@media (max-width: 767px) {
  .course-module-nav {
    padding-top: 3px;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: -15px;
    margin-right: -15px;
    display: flex;
    justify-content: space-around;
  }
  .course-module-nav:before, .course-module-nav:after {
    content: none;
  }
  .course-module-nav > li + li {
    margin-left: 0;
  }
  .course-module-nav > li > a {
    font-size: 18px;
  }
  .course-module-nav > li .has-audition {
    left: 98%;
    margin-top: -26px;
    transform: scale(0.8);
  }
  .course-module-nav > li .has-audition1 {
    left: 82%;
    transform: scale(0.8);
  }
}
@media (max-width: 540px) {
  .course-module-nav > li > a {
    font-size: 16px;
  }
  .course-module-nav > li > a > span {
    font-size: 13px;
  }
}

.course-module-nav-extra.position {
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -10px;
}
.course-module-nav-extra.jinanchengjianposition {
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -10px;
}
@media (max-width: 1200px) {
  .course-module-nav-extra.jinanchengjianposition {
    display: none;
  }
}
.course-module-nav-extra .label {
  margin-left: 0;
  height: 20px;
  line-height: 20px;
  border-radius: 0;
  color: #ff7a45;
  font-size: 16px;
  font-weight: 400;
  padding: 0;
}
.course-module-nav-extra .label + .label {
  margin-left: 20px;
}
.course-module-nav-extra .label .iconfont {
  font-size: 16px;
  margin-right: 5px;
}
.course-module-nav-extra .label:hover {
  color: #ff7a45;
}
.course-module-nav-extra .label-audition-mode,
.course-module-nav-extra .label-audition-mode i, .course-module-nav-extra .label-audition-mode:hover,
.course-module-nav-extra .label-audition-mode:hover i {
  color: #9399a5;
  cursor: default;
}
.course-module-nav-extra .resource {
  display: none;
}
@media (max-width: 991px) {
  .course-module-nav-extra .resource {
    display: inline-block;
  }
}
.course-module-nav-extra.position {
  display: none;
}
@media (max-width: 1199px) {
  .course-module-nav-extra.position {
    display: block;
  }
  .course-module-nav-extra.position .making {
    display: none;
  }
}
@media (max-width: 1199px) and (max-width: 991px) {
  .course-module-nav-extra.position {
    display: none;
  }
}
.course-module-nav-extra.opencourse-position {
  display: block;
}
@media (max-width: 1199px) {
  .course-module-nav-extra.opencourse-position {
    display: block;
  }
}
@media (max-width: 1199px) and (max-width: 991px) {
  .course-module-nav-extra.opencourse-position {
    display: none;
  }
}

.introductory {
  display: none;
  padding-bottom: 20px;
  padding-top: 20px;
}
@media (max-width: 768px) {
  .introductory {
    display: block;
  }
}

/* 题库小程序二维码点开后的弹窗 - 是一个二维码 */
.miniappQRCodeConfirm .modal-dialog {
  width: 280px;
}
.miniappQRCodeConfirm .bootstrap-dialog-message {
  padding-top: 0;
}
.miniappQRCodeConfirm .\--title {
  display: none;
}
.miniappQRCodeConfirm .\--msg {
  padding: 0;
  padding-bottom: 20px;
}
.miniappQRCodeConfirm .pic {
  height: 240px;
  padding-top: 20px;
}
.miniappQRCodeConfirm .pic img {
  width: 200px;
  height: 200px;
}

.detail-body {
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 30px;
  /* 简介部分 */
  /* 目录部分 */
}
.detail-body .distinction {
  display: none;
  margin-top: 20px;
}
@media (max-width: 1199px) {
  .detail-body .distinction {
    display: block;
  }
}
.detail-body .distinction .teacher-m {
  padding: 28px 20px;
  border-radius: 16px;
  width: 90%;
  background-color: #f7f8fa;
}
.detail-body .distinction .teacher-m .img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  vertical-align: bottom;
  overflow: hidden;
  background-color: #dce0ee;
}
.detail-body .distinction .teacher-m .img img {
  width: 100%;
  margin-top: 14px;
}
.detail-body .distinction .teacher-m .offside {
  height: 80px;
  margin-left: 10px;
}
.detail-body .distinction .teacher-m .offside .name {
  margin-top: 12px;
}
.detail-body .distinction .teacher-m .offside .tag-m {
  margin-top: 16px;
  color: #9399a5;
}
.detail-body .distinction .teacher-m .arrow {
  margin-top: 30px;
}
.detail-body .distinction .teacher-m .arrow .icon-arrow-right-fill {
  font-size: 12px;
  color: #afb2bc;
}
@media (max-width: 600px) {
  .detail-body .distinction .teacher-m {
    padding: 18px 10px;
    border-radius: 8px;
  }
  .detail-body .distinction .teacher-m .img {
    width: 40px;
    height: 46px;
    border-radius: 50%;
  }
  .detail-body .distinction .teacher-m .img img {
    width: 100%;
    margin-top: 7px;
  }
  .detail-body .distinction .teacher-m .offside {
    height: 40px;
    margin-left: 6px;
  }
  .detail-body .distinction .teacher-m .offside .name {
    margin-top: 6px;
    font-size: 12px;
  }
  .detail-body .distinction .teacher-m .offside .tag-m {
    font-size: 12px;
    margin-top: 8px;
  }
  .detail-body .distinction .teacher-m .arrow {
    margin-top: 15px;
  }
}
.detail-body .detail-intro-container {
  overflow: hidden;
  padding-top: 20px;
}
.detail-body .detail-intro-container .intro-note {
  background-color: #f8fafe;
  padding: 20px;
}
.detail-body .detail-intro-container h4 {
  line-height: 1;
  margin-top: 0px;
}
.detail-body .detail-intro-container h4 + p {
  margin-top: 14px;
}
.detail-body .detail-intro-container p {
  margin-top: 23px;
  line-height: 28px;
  color: #676c73;
  margin-bottom: 0;
}
.detail-body .detail-intro-container p + h4 {
  margin-top: 23px;
}
.detail-body .detail-intro-container p + p {
  margin-top: 20px;
}
.detail-body .detail-intro-container img {
  max-width: 100%;
  display: block;
}
.detail-body .detail-attributes-container {
  padding-top: 5px;
}
.detail-body .detail-attributes-container + .detail-intro-container {
  padding-top: 25px;
}
.detail-body .detail-attributes-container .detail-attribute {
  padding-top: 25px;
}
.detail-body .detail-attributes-container .attribute-title {
  padding-bottom: 13px;
}
.detail-body .detail-attributes-container .title-icon,
.detail-body .detail-attributes-container .title {
  display: inline-block;
}
.detail-body .detail-attributes-container .title-icon {
  width: 28px;
  height: 28px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  margin-right: 8px;
  vertical-align: bottom;
}
.detail-body .detail-attributes-container .title-icon.title-icon-1 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAq1BMVEUAAAD+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub/ikj/h0L/hT7/jk//wqH/y7D/oW3/p3j/ya3/xKT+59v/v53/m2X/vZr/kVT/o3L/vZj/zbP/x6r/nmn/pHT/k1f+6+H+6d7/qXz+3s3+2cX+49X+0bn+1sD/uZP/s4r+yKv/r4P/rX//mGD+vJj+x6j+vZg5fGZdAAAAEXRSTlMA+T7o3MvEYvOLiUko60YnIdBXZVsAAAGASURBVEjHldbZdoIwEIDhAZS669i6UJCqqEVZBKS27/9kVaDBhJgm3zX/ISdwMgFC75mGhhyaYXZ1YL20UKj1Ao8mbfxXewKEPkQJQ7KukYZStBEUxh2U1BkXQRultYv9QQX3vWqhghaAjkp06KGSHpj4RODdBUgzwUBG5M3t2MFgUQqRYoCGFN8+FTxvUTnSHw+QtrUqyV/ALIoJYouw30uhMEgPRCoT+JvaqQoiUeAsa9auEKMowE0d5OXzvjhI9kQWneNzgCgOgr1b2RwLnIDmuaX93C4tQl8YYGh93Vhbm9hFTMC6rX1OsR1BEGar6zW3TpfkocieBpn7Sbjpioj4gXNYUzYkCLmBv5wxlh+VMzdIZg25KHBm04b1thTwAm/Kcdne/HjIC668IBH8Gukrx6UZaMIgR4ZWHzPfbxweMoz6IPPd5vPNFZnQRcJ3aEcfG3rKh7Hyca8+UNRHFgzkh+IACn3ZsduHSl/qHZ0+EAOZq8NA9XLC0rtS159f5Val43Go2QsAAAAASUVORK5CYII=);
}
.detail-body .detail-attributes-container .title-icon.title-icon-2 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAArlBMVEUAAADn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9OZHuRpRvSRMuyBixjVYwCtVvyni899wzUR901Gy45xqyT1nxzpewzFbwi6x45uv4ph1zknU7st60U530EttykC05J6s4JaP1XPl8+PS7cng8tzb8dbN7MLI6ruF0GjE6bWK0m7W78665qa45aV5zlK75qek3YyS1HnVNfH7AAAAEXRSTlMA+ek+3Ipi88PMykkoxUYnIXPyxY0AAAFTSURBVEjHrdbZcoIwFIDhkwCKgMtpa6u1i0pbFBFKq13e/8UqAUkqCSYzftf5M2dykQRqluNSghKEuo4Fpzo2trI7IBp5eJY3EqahqIHWcw0IaiEDYIZd1NQdssBDbR47HzRQnJWNBmwAC41Y4KARB1wUxbtPbOUCRVEafcfYhgJBQRJFUYptCAirw2wXHeTpNsbCNjwS5hSCGZex9fdcLAuy+dF+ggehEExkAebzUpRgYfPCyYN4tmBCLINXTh7gorSpgiUnDyarUloFU04ebFfzLNnsV7luEJfnn2Qz5ueNkwXc10PDmeCxoT1YjhsuHEyfGuRBui6NnxvkwfpWSR583CkpgmulCwXvN0pCQMwCAlQIrpTqgIJrFrjiVfmrETjGl7H5dW/+oEAPtfWgEOg/igEwvu6z60PF72rt70Mt6GnMH5h/Tv6znL7q+9MXvj9/ITukR+dRI78AAAAASUVORK5CYII=);
}
.detail-body .detail-attributes-container .title-icon.title-icon-3 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAA2FBMVEUAAADm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fuIsf1ppP9kof9tqP9gnf9xq/+Ruf2Otv2Frv10r/+MtP2Ks/1bmf/k9PtXlf93sv96tP9SkP/c7vt+t//B3P2+2fy71/zg8ftuov7T6Pyhxv2Zvv3P5PzG4Pyx0PyHuf9NjP+VvP3K4vze8PtDhP9+rv6kyv2awv3Z7ftln/9OjP+Vxf6OwP51qP652v2y1f2r0f2Uv/2oyfyMs/230/yfwvyBmpy3AAAAEXRSTlMA+ek+y8Ri89tIJ4nci4ohQOIH8zQAAAGiSURBVEjHldZpc4IwEAbgRcSzrd0enm1jFVEEAa9637b9//+oBUZFkiB5PsGQF0gysxs4k/NKQkIGKaE8yBCWymCkTAqCCkm8KVmAs8cExpA4/1dWwlikLHhyaYwpnQNXEmNLeuuDAty1yqCADICMQmTIo5A8KMhir1orGxkUYOwZ0dYt11oj9O6BRA3f9hsn/W04IgFe03etz6DWTscr1wF136iFNfZjXmA+rZVYatM5M0BKrzwlwgqoz3xjVkB/4dOZc7D7Rba+zVsl41D8CCsejNEsPIcL1VzUgxamijip03O4IE63edJ1vFdvmiovMPYGaJPlYDBYTjR06bgZcAParOM9syrdiuV9bzTVsPvFDbSHw55z2Vdim8NhOzJQdh0Nf7g2c+9uBHzmiOjtnn/dRqvHXdZOhdbBCzrwRosOvNMiA9oTLTKg/9IBA4OoImA4lWrA99HCIIlRZsjIrPrKjkWoMqMgw/8eVHs/BrOQPaCQvHAxFi33wg1FtGWJN0Xxtusn0rHen4WzXJyjQw6CUncY6S4FYfI9//hzL8PJH/iBqNadWddDAAAAAElFTkSuQmCC);
}
.detail-body .detail-attributes-container .title {
  font-size: 18px;
  line-height: 28px;
}
.detail-body .detail-attributes-container .attribute-content {
  line-height: 24px;
  color: #676c73;
}
.detail-body .detail-attributes-container .attribute-content + .attribute-content {
  margin-top: 6px;
}
@media (max-width: 767px) {
  .detail-body .detail-attributes-container {
    padding-top: 0;
  }
  .detail-body .detail-attributes-container + .detail-intro-container {
    padding-top: 20px;
  }
  .detail-body .detail-attributes-container .detail-attribute {
    padding-top: 20px;
  }
  .detail-body .detail-attributes-container .title-icon {
    width: 24px;
    height: 24px;
    margin-right: 5px;
  }
  .detail-body .detail-attributes-container .title {
    font-size: 16px;
    line-height: 24px;
  }
  .detail-body .detail-attributes-container .attribute-content {
    line-height: 20px;
    font-size: 12px;
  }
  .detail-body .detail-attributes-container .attribute-content + .attribute-content {
    margin-top: 4px;
  }
}
.detail-body .detail-list-intro {
  padding-top: 20px;
  padding-bottom: 20px;
  border-bottom: 15px solid #f7f8fa;
}
.detail-body .detail-list-intro-audition {
  margin-top: 20px;
  padding: 15px 20px;
  background-color: #eef4fe;
  border-radius: 8px;
  font-size: 16px;
  line-height: 1;
}
.detail-body .detail-list-intro-audition .inline-block > span {
  padding: 0 3px;
  font-size: 18px;
  color: #0f6af3;
}
.detail-body .detail-list-intro-audition .inline-block > span.nakada {
  font-size: 16px;
}
.detail-body .detail-list-intro-audition .inline-block > span.nakada a {
  color: #0f6af3;
  font-size: 16px;
}
.detail-body .detail-list-intro-audition .nakada-app {
  margin-top: 14px;
}
.detail-body .detail-list-intro-audition .tasklabel-toggle {
  color: #0f6af3;
}
.detail-body .detail-list-intro-audition .tasklabel-toggle .iconfont {
  display: inline-block;
  transition: ease-in 0.15s;
}
.detail-body .detail-list-intro-audition .tasklabel-toggle.open .iconfont {
  transform: rotate(180deg);
}
.detail-body .pre-assessment {
  color: #1f2329;
  font-size: 16px;
  line-height: 1;
  padding: 0 16px;
  padding-bottom: 20px;
  padding-top: 20px;
  border-radius: 8px;
  display: block;
  background-color: #f7f9fc;
}
.detail-body .pre-assessment .finish {
  color: #0f6af3;
  border: 1px solid #0f6af3;
  font-size: 12px;
  width: 52px;
  height: 20px;
  border-radius: 10px;
  text-align: center;
  line-height: 20px;
  margin-left: 16px;
}
.detail-body .pre-assessment img {
  width: 18px;
  margin-right: 10px;
  vertical-align: sub;
}
.detail-body .pre-assessment .learning-evaluation img {
  width: 18px;
  margin-right: 10px;
}
.detail-body .pre-assessment .right-next {
  margin-top: 3px;
}
.detail-body .pre-assessment.pre-assessment-lock {
  color: #9399a5;
}
.detail-body .pre-assessment.pre-assessment-lock .icon-lock-fill {
  color: #cfcfcf;
}
.detail-body .pre-assessment .right-next {
  font-size: 12px;
  color: #9399a5;
}
.detail-body .pre-assessment:hover {
  color: #0f6af3;
}
.detail-body .pre-assessment:hover .right-next {
  color: #0f6af3;
}
.detail-body .pre-assessment.pre-assessment-lock:hover {
  color: #9399a5;
}
.detail-body .pre-assessment.pre-assessment-lock:hover .right-next {
  color: #cfcfcf;
}
.detail-body .detail-list-container {
  padding-top: 20px;
}
.detail-body .detail-list-container.detail-catalogue {
  padding-top: 0px;
}
.detail-body .detail-list-panel {
  margin-top: 10px;
  margin-bottom: 0;
  border: none;
  border-radius: 0;
}
.detail-body .detail-list-panel .panel-heading {
  color: #1f2329;
  font-size: 16px;
  line-height: 1;
  padding: 0 16px;
  padding-bottom: 20px;
  padding-top: 20px;
  border-radius: 8px;
  background-color: #f7f9fc;
}
.detail-body .detail-list-panel .panel-heading + .panel-body {
  margin-top: 20px;
}
.detail-body .detail-list-panel .panel-heading .right-next {
  float: right;
  font-size: 12px;
  color: #9399a5;
}
.detail-body .detail-list-panel .J-chapter:hover .iconfont {
  color: #0f6af3;
}
.detail-body .detail-list-panel .panel-body {
  padding: 0;
}
.detail-body .detail-list-item {
  position: relative;
  padding: 20px 20px;
  line-height: 20px;
  /* 公开课属性 */
}
.detail-body .detail-list-item .exercises {
  width: 18px;
  position: absolute;
}
.detail-body .detail-list-item .exercises img {
  width: 100%;
  vertical-align: text-bottom;
}
.detail-body .detail-list-item .left {
  position: relative;
  padding-left: 30px;
  padding-right: 180px;
}
.detail-body .detail-list-item .left .progress--bottom {
  display: none;
}
.detail-body .detail-list-item .right {
  position: absolute;
  right: 6px;
  top: 16px;
}
.detail-body .detail-list-item .right .cercle-percent {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: transparent;
  border: 2px solid #ccc;
  margin: 0 auto;
  margin-right: 0px;
}
.detail-body .detail-list-item .right .circle {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 3px solid #0f6af3;
  overflow: hidden;
  position: relative;
  right: -112px;
}
.detail-body .detail-list-item .right .circle .inner-circle {
  background-color: #0f6af3;
  position: absolute;
  bottom: 0;
}
.detail-body .detail-list-item .right .accomplish {
  text-align: right;
  padding-right: 14px;
  margin-top: 6px;
}
.detail-body .detail-list-item .right .accomplish .icon-chenggong {
  font-size: 14px;
  color: #0f6af3;
}
.detail-body .detail-list-item .detail-list-title {
  display: inline;
  font-size: 16px;
}
.detail-body .detail-list-item .detail-list-title .new-studytime {
  color: #9399a5;
  font-size: 12px;
  margin-top: 4px;
}
.detail-body .detail-list-item .detail-list-title .iconfont {
  position: absolute;
  left: 0;
  top: 0;
  font-size: 20px;
  vertical-align: middle;
  color: #ccc;
}
.detail-body .detail-list-item .detail-list-title .folderpictures {
  position: absolute;
  left: 0;
  top: 2px;
  vertical-align: middle;
  width: 18px;
}
.detail-body .detail-list-item .detail-list-title a {
  color: #3e454d;
}
.detail-body .detail-list-item .detail-list-extra {
  display: inline;
}
.detail-body .detail-list-item .detail-list-label {
  overflow: hidden;
  border-radius: 10px;
  border: 1px #ff7a45 solid;
  color: #ff7a45;
  font-size: 12px;
  padding: 2px 8px;
  margin-left: 10px;
  font-weight: 400;
}
.detail-body .detail-list-item .detail-list-label.didpass {
  color: #2ec69e;
  border: 1px solid #2dc8a0;
}
.detail-body .detail-list-item .detail-list-label .iconfont {
  font-size: 12px;
  margin-right: 4px;
}
.detail-body .detail-list-item .detail-list-label.disabled {
  border-color: #ccc;
  color: #9399a5;
  cursor: default;
}
.detail-body .detail-list-item .new-detail-list-label {
  display: inline-block;
  font-size: 16px;
  color: #3e454d;
  margin-left: 8px;
  padding-left: 20px;
  width: calc(100% - 100px);
}
.detail-body .detail-list-item .detail-list-audition {
  min-height: 1px;
}
.detail-body .detail-list-item .detail-list-audition .label {
  margin-left: 0;
  color: #fff;
  cursor: pointer;
}
.detail-body .detail-list-item .detail-list-audition .label.no-audition {
  border-color: #ff7a45;
  background-color: #ff7a45;
}
.detail-body .detail-list-item .detail-list-audition .label.has-audition {
  border-color: #0f6af3;
  background-color: #0f6af3;
}
.detail-body .detail-list-item .detail-list-audition .label.overtime-audition {
  border-color: #ededed;
  background-color: #ededed;
  color: #9399a5;
  cursor: default;
}
.detail-body .detail-list-item .detail-list-audition + .progress--label {
  margin-left: 20px;
}
.detail-body .detail-list-item .item--attr {
  margin-top: 3px;
}
.detail-body .detail-list-item .item--attr > p.done {
  color: #9399a5;
}
.detail-body .detail-list-item .item--attr > p .count-down .text {
  font-size: 14px;
}
.detail-body .detail-list-item:hover {
  background-color: #eef4fe;
  border-radius: 8px;
}
.detail-body .detail-list-item:hover .detail-list-title .iconfont,
.detail-body .detail-list-item:hover .detail-list-title a {
  color: #0f6af3;
}
.detail-body .detail-list-item:hover .new-detail-list-label {
  color: #0f6af3;
}
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title .iconfont {
  color: #ccc;
}
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title,
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title a {
  cursor: default;
}
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title, .detail-body .detail-list-panel-offline .detail-list-item .detail-list-title:hover,
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title a,
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title a:hover {
  color: #9399a5;
}
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-label {
  border-color: #ccc;
  color: #9399a5;
  cursor: default;
}
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-label.detail-list-audition {
  border-color: #ccc;
  background: #fff;
}
.detail-body .detail-list-panel-offline .detail-list-item .progress--text {
  color: #9399a5;
}
.detail-body .detail-list-panel-offline .detail-list-item:hover {
  background-color: #fff;
}
.detail-body .detail-list-item-audition-btn .left {
  padding-right: 240px;
}
.detail-body .detail-list-item-no-audition .detail-list-label {
  border-color: #ccc;
  color: #9399a5;
  cursor: default;
}
@media (max-width: 991px) {
  .detail-body .detail-design .course-module-nav-extra .resource {
    display: none;
  }
  .detail-body .detail-design .course-module-nav-extra .making {
    display: none;
  }
}
@media (max-width: 767px) {
  .detail-body {
    margin-top: 20px;
    margin-left: -15px;
    margin-right: -15px;
    padding-left: 15px;
    padding-right: 15px;
    /* 目录部分 */
  }
  .detail-body .detail-intro-container .intro-note {
    padding: 15px;
  }
  .detail-body .detail-list-intro {
    border-bottom-width: 10px;
  }
  .detail-body .detail-list-intro-audition {
    margin-top: 0;
    margin-left: -15px;
    margin-right: -15px;
    padding-left: 15px;
    padding-right: 15px;
  }
  .detail-body .detail-list-course-extra .label,
.detail-body .detail-list-course-extra .label .iconfont {
    font-size: 18px;
  }
  .detail-body .detail-list-panel + .detail-list-panel {
    margin-top: 12px;
    padding-top: 18px;
  }
  .detail-body .detail-list-panel .panel-heading + .panel-body {
    margin-top: 18px;
  }
  .detail-body .detail-list-item {
    padding: 8px 10px;
  }
  .detail-body .detail-list-item._pb30 {
    padding-bottom: 30px;
  }
  .detail-body .detail-list-item .left {
    padding-left: 30px;
    padding-right: 0;
  }
  .detail-body .detail-list-item .right {
    right: 10px;
    top: 8px;
  }
  .detail-body .detail-list-item .detail-list-audition {
    width: auto;
  }
  .detail-body .detail-list-item .detail-list-audition .label {
    margin-right: 0;
  }
  .detail-body .detail-list-item .detail-list-file,
.detail-body .detail-list-item .progress--label {
    display: none;
  }
  .detail-body .detail-list-item .progress--bottom {
    display: block !important;
    margin-top: 10px;
  }
  .detail-body .detail-list-item .progress--bottom .progress--text {
    font-size: 14px;
  }
  .detail-body .detail-list-item-audition-btn .left {
    padding-right: 72px;
  }
}
@media (min-width: 992px) {
  .detail-body .detail-list-course-extra {
    display: none;
  }
}
@media (max-width: 992px) {
  .detail-body .material {
    display: none;
  }
}
@media (max-width: 767px) {
  .detail-body .development {
    display: none;
  }
}
@media (max-width: 540px) {
  .detail-body .detail-list-item {
    /* 公开课属性 */
  }
  .detail-body .detail-list-item .item--attr {
    margin-top: 3px;
  }
  .detail-body .detail-list-item .item--attr > p .iconfont {
    font-size: 14px;
    width: 20px;
  }
  .detail-body .detail-list-item .item--attr > p .text {
    font-size: 14px !important;
  }
  .detail-body .detail-list-item .item--attr > p .img-living {
    width: 14px;
    margin-top: -6px;
  }
  .detail-body .detail-list-item .item--attr > p .count-down {
    font-size: 14px !important;
  }
}
@media (min-width: 768px) {
  .detail-body {
    margin-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media (min-width: 992px) {
  .detail-body {
    margin-top: 30px;
    padding-left: 30px;
    padding-right: 30px;
  }
}

/* 课程章节页面 */
.lesson-body .recommend-com-buy-wrapper {
  color: #bfbfbf;
}
.lesson-body .recommend-com-buy-wrapper .iconfont {
  color: #9399a5;
  font-size: 14px;
  margin-right: 8px;
}
.lesson-body .recommend-com-buy-wrapper > a {
  color: #fff;
}
.lesson-body .recommend-com-buy-wrapper > a:hover {
  color: #0f6af3;
}
@media (max-width: 1000px) {
  .lesson-body .recommend-com-buy-wrapper {
    color: #676c73;
  }
  .lesson-body .recommend-com-buy-wrapper > a {
    color: #676c73;
  }
  .lesson-body .recommend-com-buy-wrapper > a:hover {
    color: #0f6af3;
  }
}

.lesson-title {
  padding-bottom: 18px;
}
.lesson-title .iconfont {
  color: #9399a5;
  font-size: 12px;
  padding-left: 10px;
  padding-right: 10px;
}
.lesson-title .chapter-title {
  color: #676c73;
}

.player-wrapper .title-top {
  padding-right: 60px;
  font-size: 16px;
  color: #fff;
}
.player-wrapper .title-top .price-buy .buy-price {
  font-weight: bold;
  font-size: 24px;
  color: #F53945;
  vertical-align: bottom;
}
.player-wrapper .title-top .price-buy .buy-price span {
  font-size: 14px;
}
.player-wrapper .title-top .price-buy .individual {
  padding: 6px 16px;
  background: #1D1F21;
  border-radius: 6px;
  color: #0F6AF3;
  font-size: 14px;
  border: 1px solid #0F6AF3;
  margin-left: 16px;
}
.player-wrapper .title-top .price-buy .enterprise {
  padding: 6px 16px;
  font-size: 14px;
  border-radius: 6px;
  color: #FFFFFF;
  border: 1px solid #0F6AF3;
  background-color: #0F6AF3;
  margin-left: 16px;
}
@media (max-width: 1000px) {
  .player-wrapper .title-top {
    padding-right: 0px;
  }
  .player-wrapper .title-top .price-buy .buy-price {
    font-size: 20px;
    vertical-align: bottom;
  }
  .player-wrapper .title-top .price-buy .buy-price span {
    font-size: 14px;
  }
  .player-wrapper .title-top .price-buy .individual {
    padding: 4px 10px;
    font-size: 14px;
    margin-left: 16px;
    background-color: #fff;
  }
  .player-wrapper .title-top .price-buy .enterprise {
    padding: 4px 10px;
    font-size: 14px;
    margin-left: 16px;
  }
}
@media (max-width: 1000px) and (max-width: 768px) {
  .player-wrapper .title-top .price-buy {
    display: none;
  }
}
.player-wrapper .arrow-deg {
  display: inline-block;
  color: #fff;
  transform: rotate(90deg);
  margin-right: 10px;
}
@media (max-width: 1000px) {
  .player-wrapper .title-top {
    font-size: 14px;
    padding-top: 14px;
    padding-bottom: 14px;
    color: #3e454d;
  }
  .player-wrapper .arrow-deg {
    display: inline-block;
    color: #3e454d;
    transform: rotate(90deg);
    margin-right: 10px;
  }
}

@media (min-width: 1000px) {
  .player-wrapper .player-left {
    width: 860px;
    float: left;
  }
  .player-wrapper .player-right {
    display: block;
    background-color: #fff;
    width: 340px;
    height: 483.75px;
    float: right;
    border-bottom: 1px solid #e5e5e5;
    padding: 12px 0;
    border-top-right-radius: 4px;
  }
  .player-wrapper .player-right-container {
    width: 100%;
    height: 100%;
    padding-left: 12px;
    padding-right: 12px;
    overflow-x: hidden;
    overflow-y: auto;
  }
  .player-wrapper .player-right-container.player-right-container::-webkit-scrollbar {
    display: none;
  }
  .player-wrapper .player-right-container-note .note-section-wrapper .section-title .title {
    color: #fff;
  }
  .player-wrapper .player-right-container-note .note-section-wrapper .section-title .ftitle {
    color: #fff;
  }
  .player-wrapper .player-right-container-note .note-section-wrapper .note-write-editor .note-write-editor-post-bar .left {
    color: #fff;
  }
  .player-wrapper .player-right-container-note .note-section-wrapper .empty-wrapper {
    background-color: transparent;
  }
  .player-wrapper .player-right-container-note .note-section-wrapper .empty-wrapper .empty-msg {
    color: #bfbfbf;
  }
  .player-wrapper .player-right-container-note .note-section-wrapper .user-name {
    color: #fff;
  }
  .player-wrapper .player-right-container-note .note-section-wrapper .mynote-item .item-body {
    color: #fff;
  }
  .player-wrapper .player-right-container-note .note-section-wrapper .mynote-item .item-footer .label-td .inline-block {
    color: #ccc;
  }
  .player-wrapper .player-right-container-note .note-section-wrapper .mynote-item .item-header .label-td .right {
    color: #ccc;
  }
  .player-wrapper .course-catalogue + .course-catalogue {
    margin-top: 15px;
  }
  .player-wrapper .catalogue-title {
    padding-left: 7px;
    padding-right: 7px;
  }
  .player-wrapper .catalogue-title .inner-title {
    color: #1a1a1a;
    padding-left: 6px;
    line-height: 1;
    border-left: 3px solid #0f6af3;
    overflow: hidden;
    white-space: nowrap;
  }
  .player-wrapper .catalogue-title + .catalogue-item {
    margin-top: 15px;
  }
  .player-wrapper .catalogue-item {
    padding: 7px;
    height: 30px;
    line-height: 16px;
    display: block;
    font-size: 12px;
  }
  .player-wrapper .catalogue-item .time {
    float: right;
    color: #888;
  }
  .player-wrapper .catalogue-item .title-wrapper {
    padding-right: 54px;
  }
  .player-wrapper .catalogue-item .title-wrapper .title {
    display: flex;
  }
  .player-wrapper .catalogue-item .title-wrapper .title .iconfont {
    vertical-align: bottom;
    display: inline-block;
    font-size: 14px;
    color: #ccc;
    margin-right: 5px;
  }
  .player-wrapper .catalogue-item .title-wrapper .title .text {
    overflow: hidden;
    white-space: nowrap;
  }
  .player-wrapper .catalogue-item .title-wrapper .title.has-lesson {
    color: #888;
  }
  .player-wrapper .catalogue-item .title-wrapper .label {
    margin-left: 8px;
    line-height: 16px;
    font-weight: 400;
    padding: 0 3px;
    color: #fff;
    background-color: #0f6af3;
    border-radius: 8px;
  }
  .player-wrapper .catalogue-item .title-wrapper .label .label-text {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 12px;
    transform: scale(0.8333333333);
  }
  .player-wrapper .catalogue-item:hover, .player-wrapper .catalogue-item.active {
    background-color: #f7f8fa;
    border-radius: 4px;
  }
  .player-wrapper .catalogue-item:hover .title-wrapper .title,
.player-wrapper .catalogue-item:hover .title-wrapper .title .iconfont, .player-wrapper .catalogue-item.active .title-wrapper .title,
.player-wrapper .catalogue-item.active .title-wrapper .title .iconfont {
    color: #0f6af3;
  }

  .new-player-wrapper {
    background-color: #1d1f21;
    padding: 24px;
    display: flex;
    flex-wrap: wrap;
    padding-right: 0px;
    width: 100%;
    padding-bottom: 12px;
  }
  .new-player-wrapper .title {
    width: 100%;
  }
  .new-player-wrapper .player-left {
    flex: 1;
    float: left;
  }
  .new-player-wrapper .player-left .new-lesson-desc {
    background-color: #1d1f21;
    padding: 0px;
  }
  .new-player-wrapper .player-left .new-lesson-desc .new-desc-row1 {
    padding-bottom: 0px;
  }
  .new-player-wrapper .player-left .new-lesson-desc .new-desc-row1 .full-screen {
    font-size: 14px;
    color: #bfbfbf;
  }
  .new-player-wrapper .player-left .new-lesson-desc .new-desc-row1 .full-screen:hover {
    color: #fff;
  }
  .new-player-wrapper .player-left .new-lesson-desc .new-learning-user-wrapper {
    padding-bottom: 0px;
    padding-top: 0px;
  }
  .new-player-wrapper .player-left .new-lesson-desc .new-learning-user-wrapper .learning-count {
    color: #bfbfbf;
    font-size: 14px;
  }
  .new-player-wrapper .player-right {
    display: block;
    background-color: #fff;
    width: 358px;
    height: 483.75px;
    float: left;
    border-bottom: 1px solid #e5e5e5;
    padding: 12px 0;
    border-top-right-radius: 4px;
  }
  .new-player-wrapper .new-listbox {
    margin-left: 24px;
    background-color: #27292c;
    border-bottom: none;
    overflow: hidden;
  }
  .new-player-wrapper .new-listbox .player-right-container {
    padding-left: 20px;
    padding-right: 20px;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .catalogue-title {
    width: 320px;
    border-radius: 4px;
    background-color: #212427;
    padding: 16px;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .catalogue-title .inner-title {
    border-left: none;
    padding-left: 0px;
    color: #fff;
    overflow: inherit;
    white-space: normal;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .catalogue-title .inner-title .autoWidth {
    max-width: calc(100% - 20px);
    line-height: 1.3;
    display: -webkit-inline-box;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .catalogue-title .inner-title .right-next {
    font-size: 12px;
    color: #9399a5;
    margin-top: 4px;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item {
    height: auto;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item .time {
    margin-top: -4px;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item .title-wrapper {
    padding-left: 12px;
    padding-right: 26px;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item .title-wrapper .new-detail-list-label {
    overflow: inherit;
    white-space: normal;
    font-size: 14px;
    color: #bfbfbf;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item .text {
    overflow: inherit;
    white-space: normal;
    font-size: 14px;
    color: #bfbfbf;
    height: 18px;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item:hover, .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item.active {
    background-color: transparent;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item:hover .title-wrapper .title,
.new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item:hover .title-wrapper .title .iconfont, .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item.active .title-wrapper .title,
.new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item.active .title-wrapper .title .iconfont {
    color: #0f6af3;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item:hover .title-wrapper .title .text, .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item.active .title-wrapper .title .text {
    color: #0f6af3;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item:hover .title-wrapper .title a, .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item.active .title-wrapper .title a {
    color: #0f6af3;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item .cercle-percent {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid #525456;
    margin: 0 auto;
    margin-right: 0px;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item .circle {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 3px solid #0f6af3;
    overflow: hidden;
    position: relative;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item .circle .inner-circle {
    background-color: #0f6af3;
    position: absolute;
    bottom: 0;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item .accomplish {
    text-align: right;
    padding-right: 0px;
    margin-top: 6px;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .new-catalogue-item .accomplish .icon-chenggong {
    font-size: 14px;
    color: #0f6af3;
  }
  .new-player-wrapper .new-listbox .new-course-catalogue .folded .folderpictures {
    width: 18px;
    height: 18px;
    margin-right: 8px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-title {
    color: #fff;
    margin: 10px 0 22px;
    display: flex;
    align-items: center;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-title img {
    margin-right: 8px;
    width: 25px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item {
    padding: 12px 18px;
    border-radius: 24px;
    color: #fff;
    margin-bottom: 24px;
    max-width: 300px;
    position: relative;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item__question {
    border-bottom-right-radius: 4px;
    background-color: #3d3f43;
    align-self: flex-end;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item__reply {
    border-top-left-radius: 4px;
    background: linear-gradient(to right, #513f80, #383d7a);
    align-self: flex-start;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item__reply .text {
    min-height: 44px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item__reply .text li + li {
    margin-top: 5px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item__reply .text li > p + ul {
    margin-top: -5px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item__reply .text ol {
    margin-bottom: 10px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item__reply .text > ul > li + li,
.new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item__reply .text > ol > li + li {
    margin-top: 10px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item__reply .loading-icon {
    height: 14px;
    position: relative;
    top: -2px;
    margin-left: 4px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item.has-cover .text {
    display: block;
    max-height: 220px;
    overflow: hidden;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item.has-cover .cover {
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    background: linear-gradient(0deg, #6349AB 0%, #434BA9 0%, rgba(70, 75, 169, 0) 100%);
    border-radius: 0px 0px 24px 24px;
    padding-top: 30px;
    text-align: center;
    color: #fff;
    cursor: pointer;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn {
    position: absolute;
    left: 0;
    bottom: -22px;
    font-size: 14px;
    width: 100%;
    min-width: 152px;
    padding-left: 6px;
    padding-right: 6px;
    white-space: nowrap;
    display: flex;
    justify-content: flex-end;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn.create-stop {
    justify-content: flex-start;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn.create-stop,
.new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn .feedback-btn {
    color: #9399a5;
    cursor: pointer;
    transition: 0.12s color ease-in-out;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn.create-stop:hover, .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn.create-stop.active,
.new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn .feedback-btn:hover,
.new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn .feedback-btn.active {
    color: #6960fe;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn .iconfont {
    font-size: inherit;
    margin-right: 4px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn .feedback-btn + .feedback-btn {
    margin-left: 20px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-content-wrap .chat-item .chat-item-operation-btn .laji {
    transform: rotate(180deg) scaleX(-1);
    display: inline-block;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-bottom-wrap {
    color: #767b85;
    font-size: 12px;
    margin-top: 20px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-bottom-wrap .fast-entry {
    display: flex;
    height: 22px;
    line-height: 22px;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-bottom-wrap .fast-entry .entry-item {
    padding: 0 8px;
    background-color: #3a3c3e;
    margin-right: 8px;
    border-radius: 22px;
    cursor: pointer;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-bottom-wrap .fast-entry .entry-item:hover {
    color: #fff;
    background: linear-gradient(to right, #8e5efa, #5460f8);
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-bottom-wrap .chat-input {
    border: 1px solid #3a3c3e;
    border-radius: 8px;
    padding: 12px 15px;
    background-color: #1d1f21;
    display: flex;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-bottom-wrap .chat-input textarea {
    flex: 1;
    border: none;
    background-color: transparent;
    resize: none;
    color: #fff;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-bottom-wrap .chat-input .submit-icon {
    width: 16px;
    cursor: pointer;
    align-self: flex-end;
    transition: 0.12s color ease-in-out;
  }
  .new-player-wrapper .new-listbox .course-aicaht-container .chat-bottom-wrap .chat-input .submit-icon:hover {
    color: #6960fe;
  }
}
.buttonpulling {
  float: left;
  width: 60px;
  position: relative;
}
@media (max-width: 1000px) {
  .buttonpulling {
    display: none;
  }
}
.buttonpulling .right-buttonpulling {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.buttonpulling .buttonpulling-content {
  text-align: center;
  padding: 20px 14px;
}
.buttonpulling .buttonpulling-content .icon-mulu {
  width: 22px;
  color: #767676;
}
.buttonpulling .buttonpulling-content .icon-fankui {
  color: #767676;
  width: 22px;
}
.buttonpulling .buttonpulling-content .word {
  font-size: 14px;
  color: #767676;
}
.buttonpulling .buttonpulling-content .aichat-icon {
  width: 25px;
}
.buttonpulling .buttonpulling-content .ai-chat-text {
  margin-top: 2px;
}
.buttonpulling .buttonpulling-content.active {
  background-color: #27292c;
}
.buttonpulling .buttonpulling-content.active .word {
  font-size: 14px;
  color: #fff;
}
.buttonpulling .buttonpulling-content.active .iconfont {
  color: #fff;
}
.buttonpulling .buttonpulling-content:hover {
  background-color: #27292c;
}

.dialog-knowledge-graph .modal-dialog {
  width: 80%;
}
.dialog-knowledge-graph .echarts-graph {
  width: 100%;
  height: 500px;
}

.current-video-test .bootstrap-dialog-header .bootstrap-dialog-close-button {
  float: right;
  cursor: pointer;
  color: #9399a5;
}
.current-video-test .bootstrap-dialog-header .bootstrap-dialog-close-button:hover {
  color: #0f6af3 !important;
}
.current-video-test .bootstrap-dialog-header .bootstrap-dialog-title {
  width: 450px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 500;
}
.current-video-test .loadingwrap {
  height: 440px;
  justify-content: center;
}
.current-video-test .modal-body {
  overflow-y: auto;
}
.current-video-test .modal-body .Equest_title {
  font-size: 16px;
  color: #3E454D;
  line-height: 20px;
}
.current-video-test .modal-body .Equest_title .Equest_index {
  font-size: 20;
}
.current-video-test .modal-body .Equest_title .Equest_type {
  display: inline-block;
  width: 40px;
  height: 20px;
  border-radius: 4px;
  text-align: center;
  font-size: 12px;
}
.current-video-test .modal-body .Equest_title .Equest_type.Equest_type_default {
  background-color: #eef4fe;
  color: #0f6af3;
}
.current-video-test .modal-body .Equest_title .Equest_type.Equest_type_mutile {
  background-color: #F0F9F7;
  color: #25AC8A;
}
.current-video-test .modal-body .Equest_title .Equest_type.Equest_type_check {
  background-color: #faeded;
  color: #ff5a5a;
}
.current-video-test .modal-body .Equest_options {
  padding-top: 25px;
}
.current-video-test .modal-body .Equest_options_item {
  cursor: pointer;
  margin-left: 23px;
  margin-bottom: 30px;
}
.current-video-test .modal-body .Equest_options_item_check {
  width: 30px;
  height: 30px;
  border: 1px solid #DCDFE6;
  border-radius: 4px;
  color: #3E454D;
  font-size: 16px;
  line-height: 30px;
  text-align: center;
}
.current-video-test .modal-body .Equest_options_item_check.check_round {
  border-radius: 50%;
}
.current-video-test .modal-body .Equest_options_item_title {
  display: inline-block;
  color: #444444;
  font-size: 16px;
  line-height: 33px;
}
.current-video-test .modal-body .Equest_options_item .Equest_image_wrap {
  padding-left: 46px;
}
.current-video-test .modal-body .Equest_options_item.active .Equest_options_item_check {
  border: 1px solid rgba(15, 106, 243, 0.8);
  background-color: #eef4fe;
  color: #0f6af3;
}
.current-video-test .modal-body .Equest_options_item.isRight .Equest_options_item_check {
  border: 1px solid rgba(37, 172, 138, 0.8);
  background-color: #F0F9F7;
  color: #25AC8A;
}
.current-video-test .modal-body .Equest_options_item.isErr .Equest_options_item_check {
  border: 1px solid rgba(255, 90, 90, 0.8);
  background-color: #faeded;
  color: #ff5a5a;
}
.current-video-test .modal-body .sureBtn {
  margin-left: 23px;
  padding: 5px 16px;
  min-width: 64px;
}
.current-video-test .modal-body .Equest_image_wrap {
  padding-top: 10px;
}
.current-video-test .modal-body .Equest_image_wrap .image_item {
  display: inline-block;
  width: 160px;
  height: 90px;
  background: #F4F4F4;
  border-radius: 4px;
  margin-right: 16px;
  overflow: hidden;
}
.current-video-test .modal-body .Equest_image_wrap .image_item:nth-child(3n) {
  margin-left: 0;
}
.current-video-test .modal-body .Equest_image_wrap .image_item img {
  width: 100%;
  height: 100%;
}
.current-video-test .modal-body .askWrap,
.current-video-test .modal-body .tolkeWrap {
  margin-left: 23px;
  font-size: 16px;
  padding-bottom: 20px;
  color: #3E454D;
}
.current-video-test .modal-body .askWrap .text-right,
.current-video-test .modal-body .tolkeWrap .text-right {
  color: #25AC8A;
}
.current-video-test .modal-body .askWrap .text-err,
.current-video-test .modal-body .tolkeWrap .text-err {
  color: #ff5a5a;
}
.current-video-test .modal-body .Rquest_title .Rquest_rate {
  padding: 40px 0 20px;
  font-weight: 500;
  font-size: 24px;
  color: #3e454d;
  text-align: center;
}
.current-video-test .modal-body .Rquest_title .Rquest_data {
  text-align: center;
  font-size: 16px;
}
.current-video-test .modal-body .Rquest_title .Rquest_data span {
  padding-right: 15px;
}
.current-video-test .modal-body .Rquest_title .Rquest_data span:nth-child(2) {
  padding-right: 0;
  padding-left: 15px;
  position: relative;
}
.current-video-test .modal-body .Rquest_title .Rquest_data span:nth-child(2)::before {
  content: "";
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 12px;
  background: #E9EAEB;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.current-video-test .modal-body .Rquest_bank {
  background: #F7F8FA;
  border-radius: 4px;
  font-size: 18px;
  margin: 0 20px;
  overflow: hidden;
}
.current-video-test .modal-body .Rquest_bank_item {
  color: #9399a5;
  margin: 40px;
}
.current-video-test .modal-body .Rquest_bank_item span:nth-child(2) {
  color: #676c73;
}
.current-video-test .modal-footer {
  padding-bottom: 24px;
}
.current-video-test .btnDisabled {
  opacity: 0.5;
}

.body-right_fixed-thumbs {
  display: none;
}
@media (max-width: 1199px) {
  .body-right_fixed-thumbs {
    display: block;
    position: fixed;
    right: 25px;
    top: 50vh;
    z-index: 10;
    transform: translateY(-50%);
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: 1px solid #0f6af3;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    overflow: hidden;
  }
  .body-right_fixed-thumbs.active .-mask {
    background-color: #0f6af3;
  }
  .body-right_fixed-thumbs.active .-content {
    color: #fff;
  }
  .body-right_fixed-thumbs .-mask,
.body-right_fixed-thumbs .-content {
    width: 100%;
    height: 100%;
  }
  .body-right_fixed-thumbs .-mask {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    background-color: #eff4fd;
  }
  .body-right_fixed-thumbs .-content {
    position: relative;
    z-index: 2;
    color: #0f6af3;
    text-align: center;
    line-height: 1.2;
    padding-top: 8px;
  }
  .body-right_fixed-thumbs .-content .iconfont {
    display: block;
    font-size: 20px;
  }
  .body-right_fixed-thumbs .-content span {
    display: block;
    font-size: 12px;
  }
}

.lesson_fixed-thumbs {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 10;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 1px solid #0f6af3;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  overflow: hidden;
}
.lesson_fixed-thumbs.active .-mask {
  background-color: #0f6af3;
}
.lesson_fixed-thumbs.active .-content {
  color: #fff;
}
.lesson_fixed-thumbs .-mask,
.lesson_fixed-thumbs .-content {
  width: 100%;
  height: 100%;
}
.lesson_fixed-thumbs .-mask {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: #eff4fd;
}
.lesson_fixed-thumbs .-content {
  position: relative;
  z-index: 2;
  color: #0f6af3;
  text-align: center;
  line-height: 1.2;
  padding-top: 8px;
}
.lesson_fixed-thumbs .-content .iconfont {
  display: block;
  font-size: 20px;
}
.lesson_fixed-thumbs .-content span {
  display: block;
  font-size: 12px;
}

@media (min-width: 1200px) {
  .player-wrapper .player-left .lesson-video .player-area {
    height: 483.75px;
    padding-bottom: 0;
  }
  .player-wrapper:hover .player-right .item-take-notes {
    display: block;
  }
  .player-wrapper:hover .player-right .player-mark-btn > .-btnText {
    display: block;
  }
}
@media (max-width: 1000px) {
  .player-wrapper .player-left {
    width: auto !important;
  }
}
.player-left.transition-width,
.player-right.transition-width {
  transition: width 0.3s;
}

.player-right {
  position: relative;
}
.player-right .player-right-fixed-btn {
  position: absolute;
  top: 50%;
  left: -70px;
  z-index: 5;
  transform: translateY(-50%);
}
.player-right .player-right-fixed-btn .item {
  position: relative;
  width: 48px;
  height: 48px;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.player-right .player-right-fixed-btn .item .-mask,
.player-right .player-right-fixed-btn .item .-content {
  width: 100%;
  height: 100%;
}
.player-right .player-right-fixed-btn .item + .item {
  margin-top: 12px;
}
.player-right .player-right-fixed-btn .item-take-notes {
  display: none;
}
.player-right .player-right-fixed-btn .-mask {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  border-radius: 4px;
  border: 1px solid #fff;
  background-color: #000;
  -webkit-opacity: 0.2;
  -moz-opacity: 0.2;
  -khtml-opacity: 0.2;
  opacity: 0.2;
  filter: alpha(opacity=20);
}
.player-right .player-right-fixed-btn .-content {
  position: relative;
  z-index: 2;
  color: #fff;
  text-align: center;
  line-height: 1.2;
  padding-top: 5px;
}
.player-right .player-right-fixed-btn .-content .iconfont {
  display: block;
  font-size: 20px;
}
.player-right .player-right-fixed-btn .-content span {
  display: block;
  font-size: 12px;
}
.player-right .player-mark-btn {
  position: absolute;
  bottom: 66px;
  left: -68px;
  z-index: 5;
}
.player-right .player-mark-btn .-mask {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  background-color: #000;
  -webkit-opacity: 0.2;
  -moz-opacity: 0.2;
  -khtml-opacity: 0.2;
  opacity: 0.2;
  filter: alpha(opacity=20);
  border-radius: 2px;
}
.player-right .player-mark-btn .-btnText {
  position: relative;
  z-index: 2;
  font-size: 12px;
  color: #fff;
  padding: 5px;
  cursor: pointer;
  display: none;
}
.player-right .note-write-wrapper {
  padding-left: 20px;
  padding-right: 20px;
}
.player-right .note-write-wrapper .horizontal-drag-btn {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 20px;
  height: 100%;
  overflow: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  display: flex;
  align-items: center;
  cursor: e-resize;
}
.player-right .note-write-wrapper .horizontal-drag-btn .iconfont {
  font-size: 24px;
  color: #9399a5;
  margin-left: -2px;
}
.player-right .note-write-wrapper .horizontal-drag-btn:hover {
  background-color: transparent;
}
.player-right .note-write-wrapper .note-section-transparent-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
  display: none;
}
.player-right .note-write-wrapper .note-section + .note-section {
  margin-top: 16px;
}
.player-right .note-write-wrapper .section-title {
  position: relative;
  line-height: 24px;
}
.player-right .note-write-wrapper .section-title .title {
  font-size: 16px;
  color: #1a1a1a;
  padding-left: 8px;
  border-left: 3px solid #0f6af3;
}
.player-right .note-write-wrapper .section-title .ftitle {
  font-size: 12px;
  color: #9399a5;
  margin-left: 6px;
}
.player-right .note-write-wrapper .section-title .right {
  position: absolute;
  top: 0;
  right: 0;
}
.player-right .note-write-wrapper .section-title .right .iconfont {
  font-size: 14px;
  color: #8888;
}
.player-right .note-write-wrapper .section-content {
  padding-top: 12px;
}
.player-right .mynote-list .empty-wrapper {
  padding-top: 20px;
  padding-bottom: 20px;
}
.player-right .mynote-list .empty-wrapper .empty-icon > img {
  max-width: 100px;
}
.player-right .mynote-list .empty-wrapper .empty-msg {
  padding-top: 20px;
}
.player-right .mynote-item + .mynote-item {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid #e5e5e5;
}
.player-right .mynote-item .item-header .label-td {
  line-height: 0;
}
.player-right .mynote-item .item-header .label-td.right {
  font-size: 12px;
  color: #888;
}
.player-right .mynote-item .item-header .label-td .inline-block {
  line-height: 24px;
}
.player-right .mynote-item .item-header .user-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  vertical-align: baseline;
  margin-right: 10px;
}
.player-right .mynote-item .item-header .user-name {
  font-size: 16px;
  max-width: 100px;
}
.player-right .mynote-item .item-header .note-hide {
  position: relative;
  margin-left: 16px;
}
.player-right .mynote-item .item-header .note-hide:before {
  position: absolute;
  top: 50%;
  left: -10px;
  margin-top: -2px;
  content: "";
  background-color: #888;
  padding: 2px;
  border-radius: 50px;
  font-size: 0;
  line-height: 0;
}
.player-right .mynote-item .item-body {
  margin-top: 15px;
  margin-bottom: 15px;
}
.player-right .mynote-item .item-body .note-content-container {
  position: relative;
  overflow: hidden;
}
.player-right .mynote-item .item-body .note-content-container.folded {
  max-height: 198px;
}
.player-right .mynote-item .item-body .note-content img {
  max-width: 72%;
}
.player-right .mynote-item .item-body .note-content ul,
.player-right .mynote-item .item-body .note-content ol,
.player-right .mynote-item .item-body .note-content li {
  list-style-position: outside;
  list-style-image: none;
}
.player-right .mynote-item .item-body .note-content ul,
.player-right .mynote-item .item-body .note-content ol {
  padding-left: 40px;
  margin-bottom: 10px;
}
.player-right .mynote-item .item-body .note-content ul li {
  list-style-type: disc;
}
.player-right .mynote-item .item-body .note-content ol li {
  list-style-type: decimal;
}
.player-right .mynote-item .item-body .note-content-mask {
  display: none;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 120px;
  line-height: 180px;
  color: #0f6af3;
  text-align: center;
  cursor: pointer;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.9) 90%, #FFFFFF 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType="0",startColorstr="#22FFFFFF", endColorstr="#ddFFFFFF");
}
.player-right .mynote-item .item-footer .label-td {
  line-height: 0;
}
.player-right .mynote-item .item-footer .label-td .inline-block {
  font-size: 12px;
  color: #888;
  line-height: 12px;
}
.player-right .mynote-item .item-footer .label-td .inline-block + .inline-block {
  margin-left: 20px;
}
.player-right .mynote-item .item-footer .label-td .inline-block .iconfont {
  font-size: 12px;
  margin-right: 5px;
}
.player-right .mynote-item .item-footer .label-td a.inline-block:hover {
  color: #0f6af3;
}

.note-write-editor {
  padding-bottom: 30px;
}
.note-write-editor .textarea-wrapper {
  padding: 8px 8px 26px;
  position: relative;
  border: 1px #ccc solid;
  border-radius: 4px;
}
.note-write-editor .textarea-wrapper,
.note-write-editor .textarea-wrapper .textarea {
  width: 100%;
  height: 100%;
}
.note-write-editor .textarea-wrapper .textarea {
  height: 54px;
  min-height: 20px;
  padding: 0;
  resize: vertical;
  border: none;
}
.note-write-editor .textarea-wrapper .content-number {
  line-height: 1;
  position: absolute;
  bottom: 6px;
}
.note-write-editor .textarea-wrapper .content-number {
  right: 10px;
  color: #9399a5;
}
.note-write-editor .editor-placeholder {
  height: 60px;
  border-radius: 2px;
  border: 1px solid #ccc;
  padding: 8px 11px;
  color: #9399a5;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: text;
}
.note-write-editor .note-write-editor-post-bar {
  margin-top: 10px;
}
.note-write-editor .note-write-editor-post-bar .left {
  padding-top: 6px;
}
.note-write-editor .note-write-editor-post-bar .left .inline-block {
  vertical-align: middle;
}
.note-write-editor .note-write-editor-post-bar .left .checkbox {
  margin-top: 2px;
  margin-bottom: 2px;
}
.note-write-editor .note-write-editor-post-bar .left .note-wtime {
  font-size: 12px;
  color: #888;
  line-height: 12px;
}
.note-write-editor .note-write-editor-post-bar .left .note-wtime .iconfont {
  font-size: 12px;
  margin-right: 5px;
}
.note-write-editor .note-write-editor-post-bar .left .note-wtime.refresh {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
}
.note-write-editor .note-write-editor-post-bar .left .note-wtime.refresh:hover {
  color: #0f6af3;
}
.note-write-editor .note-write-editor-post-bar .left .note-wtime .note-time .iconfont {
  color: #d7d7d7;
}
.note-write-editor .note-write-editor-post-bar .right .btn {
  padding: 5px 17px;
}
@media (max-width: 767px) {
  .note-write-editor .textarea-wrapper {
    padding: 6px 6px 22px;
  }
  .note-write-editor .textarea-wrapper .textarea {
    height: 44px;
    font-size: 12px;
  }
  .note-write-editor .textarea-wrapper .content-number {
    font-size: 12px;
    bottom: 4px;
  }
  .note-write-editor .textarea-wrapper .content-number {
    right: 6px;
  }
}

.note-source-click,
.note-time-click {
  display: inline-block;
  line-height: 24px;
  background-color: #f7f8fa;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 12px;
  color: #888;
}
.note-source-click .note-time .iconfont,
.note-time-click .note-time .iconfont {
  color: #d7d7d7;
}
.note-source-click:hover,
.note-time-click:hover {
  color: #0f6af3;
}
.note-source-click:hover .note-time .iconfont,
.note-time-click:hover .note-time .iconfont {
  color: #0f6af3;
}

.note-source-click .note-chapter {
  max-width: 420px;
  display: inline-block;
  vertical-align: bottom;
}
@media (max-width: 680px) {
  .note-source-click .note-chapter {
    max-width: 310px;
  }
}
@media (max-width: 580px) {
  .note-source-click .note-chapter {
    max-width: 210px;
  }
}
@media (max-width: 480px) {
  .note-source-click .note-chapter {
    max-width: 110px;
  }
}

.note-list-container-visibility {
  visibility: hidden;
  display: block !important;
  height: 0;
}

.note-list-container {
  padding-bottom: 20px;
}
.note-list-container .note-control-bar {
  margin-bottom: 30px;
}
.note-list-container .note-control-bar .left .btn {
  background-color: #f7f8fa;
  border: 1px solid #f7f8fa;
  padding: 5px 18px;
  border-radius: 15px;
  min-width: auto;
}
.note-list-container .note-control-bar .left .btn + .btn {
  margin-left: 20px;
}
.note-list-container .note-control-bar .left .btn.active {
  color: #0f6af3;
  border-color: #0f6af3;
  background-color: #e8f1ff;
}
@media (max-width: 767px) {
  .note-list-container .note-control-bar .left .btn {
    padding: 1px 8px;
    border-radius: 12px;
  }
}
.note-list-container .note-more {
  text-align: center;
  margin-top: 10px;
  line-height: 36px;
  cursor: pointer;
}
.note-list-container .note-more:hover {
  color: #0f6af3;
}
.note-list-container .note-item {
  padding-left: 60px;
}
@media (max-width: 991px) {
  .note-list-container .note-item .J-note-edit {
    display: none !important;
  }
}
.note-list-container .note-item + .note-item {
  margin-top: 30px;
  padding-top: 30px;
}
.note-list-container .note-item + .note-item .item-line {
  position: relative;
  top: -30px;
  width: 100%;
  height: 0;
  border-top: 1px solid #e5e5e5;
  overflow: hidden;
}
.note-list-container .note-item .item-header .label-td {
  position: relative;
  line-height: 0;
}
.note-list-container .note-item .item-header .left .inline-block {
  line-height: 24px;
}
.note-list-container .note-item .item-header .left .bottom {
  font-size: 12px;
  color: #888;
}
.note-list-container .note-item .item-header .left .user-avatar {
  position: absolute;
  top: 0;
  left: -60px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
}
.note-list-container .note-item .item-header .left .user-name {
  font-size: 16px;
}
.note-list-container .note-item .item-header .left .note-hide {
  position: relative;
  margin-left: 16px;
}
.note-list-container .note-item .item-header .left .note-hide:before {
  position: absolute;
  top: 50%;
  left: -10px;
  margin-top: -2px;
  content: "";
  background-color: #888;
  padding: 2px;
  border-radius: 50px;
  font-size: 0;
  line-height: 0;
}
.note-list-container .note-item .item-header .right {
  display: none;
}
.note-list-container .note-item .item-header .right .link-btn-dropdown-layer .layer-inner > a .iconfont {
  display: none;
}
.note-list-container .note-item .item-body {
  margin-top: 15px;
  margin-bottom: 15px;
}
.note-list-container .note-item .item-body .note-content-container {
  position: relative;
  overflow: hidden;
}
.note-list-container .note-item .item-body .note-content-container.folded {
  max-height: 198px;
}
.note-list-container .note-item .item-body .note-content img {
  max-width: 72%;
}
.note-list-container .note-item .item-body .note-content ul,
.note-list-container .note-item .item-body .note-content ol,
.note-list-container .note-item .item-body .note-content li {
  list-style-position: outside;
  list-style-image: none;
}
.note-list-container .note-item .item-body .note-content ul,
.note-list-container .note-item .item-body .note-content ol {
  padding-left: 40px;
  margin-bottom: 10px;
}
.note-list-container .note-item .item-body .note-content ul li {
  list-style-type: disc;
}
.note-list-container .note-item .item-body .note-content ol li {
  list-style-type: decimal;
}
.note-list-container .note-item .item-body .note-content-mask {
  display: none;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 120px;
  line-height: 180px;
  color: #0f6af3;
  text-align: center;
  cursor: pointer;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.9) 90%, #FFFFFF 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType="0",startColorstr="#22FFFFFF", endColorstr="#ddFFFFFF");
}
.note-list-container .note-item .item-footer .label-td {
  line-height: 0;
}
.note-list-container .note-item .item-footer .label-td .inline-block {
  font-size: 12px;
  color: #888;
  line-height: 12px;
}
.note-list-container .note-item .item-footer .label-td .inline-block + .inline-block {
  margin-left: 20px;
}
.note-list-container .note-item .item-footer .label-td .inline-block .iconfont {
  font-size: 12px;
  margin-right: 5px;
}
.note-list-container .note-item .item-footer .label-td a.inline-block:hover {
  color: #0f6af3;
}
.note-list-container .note-item .item-footer .left {
  white-space: nowrap;
}
.note-list-container .note-item .item-footer .right .note-thumbs {
  padding-left: 6px;
  padding-right: 6px;
  line-height: 14px;
  display: inline-block;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  color: #888;
  margin-right: -6px;
}
.note-list-container .note-item .item-footer .right .note-thumbs .iconfont {
  font-size: 14px;
  display: inline-block;
}
@media (max-width: 1199px) {
  .note-list-container .note-item {
    padding-left: 42px;
  }
  .note-list-container .note-item + .note-item {
    margin-top: 20px;
    padding-top: 20px;
  }
  .note-list-container .note-item + .note-item .item-line {
    top: -20px;
  }
  .note-list-container .note-item .item-header .left .user-avatar {
    left: -42px;
    width: 32px;
    height: 32px;
  }
  .note-list-container .note-item .item-header .right {
    display: block;
    margin-top: 6px;
  }
  .note-list-container .note-item .item-footer .right .note-modify {
    display: none;
  }
}
@media (max-width: 767px) {
  .note-list-container .note-item .item-header .left .inline-block {
    line-height: 18px;
  }
  .note-list-container .note-item .item-header .left .user-name {
    font-size: 13px;
  }
}

.lesson-video {
  position: relative;
  overflow: hidden;
}
.lesson-video .cover-video .cover-content {
  font-size: 36px;
  line-height: 1.4;
}
.lesson-video .cover-video .cover-audition .iconfont {
  font-size: 64px;
}
@media (max-width: 991px) {
  .lesson-video .cover-video .cover-content {
    font-size: 32px;
  }
  .lesson-video .cover-video .cover-audition .iconfont {
    font-size: 56px;
  }
}
@media (max-width: 767px) {
  .lesson-video .cover-video .cover-content {
    font-size: 28px;
  }
  .lesson-video .cover-video .cover-audition .iconfont {
    font-size: 49px;
  }
}
@media (max-width: 560px) {
  .lesson-video .cover-video .cover-content {
    font-size: 24px;
  }
  .lesson-video .cover-video .cover-audition .iconfont {
    font-size: 42px;
  }
}
@media (max-width: 375px) {
  .lesson-video .cover-video .cover-content {
    font-size: 20px;
  }
  .lesson-video .cover-video .cover-audition .iconfont {
    font-size: 35px;
  }
}
.lesson-video .cover-hint .cover-content {
  font-size: 32px;
}
.lesson-video .player-area {
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  position: relative;
}
.lesson-video .player-area .player-box {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.lesson-video .player-mini {
  position: fixed !important;
  z-index: 9000;
  width: 426px !important;
  height: 240px !important;
  cursor: move;
}
.lesson-video .player-mini .prism-controlbar {
  display: none !important;
}
.lesson-video .player-mini .prism-mask-custom {
  display: none !important;
}
.lesson-video .player-mini video {
  pointer-events: none;
}
.lesson-video .player-mini .prism-big-play-btn {
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.6);
  background-image: url(/assets/aliplayer/2.9.16/img/smallplay.png);
  background-position: center;
  background-size: 60%;
}
.lesson-video .player-mini .prism-big-play-btn.playing {
  background-image: url(/assets/aliplayer/2.9.16/img/smallpause.png);
}
.lesson-video .player-mini .prism-big-play-btn .outter {
  display: none !important;
}
.lesson-video .player-mini:hover .prism-big-play-btn {
  display: block !important;
}
.lesson-video .prism-player {
  width: 100%;
  height: 100%;
  position: relative;
  /* 文档播放 */
}
.lesson-video .prism-player:hover .doc-controlbar {
  visibility: visible;
}
.lesson-video .prism-player .course-cover-img,
.lesson-video .prism-player .course-cover-img img,
.lesson-video .prism-player > object {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
}
.lesson-video .prism-player .course-cover-img,
.lesson-video .prism-player > object {
  height: 100%;
}
.lesson-video .prism-player .course-cover-img img {
  margin: auto;
}
.lesson-video .prism-player .swiper-container {
  background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAyADIDASIAAhEBAxEB/8QAFwABAQEBAAAAAAAAAAAAAAAAAAECCP/EACQQAAICAQQCAQUAAAAAAAAAAAABMUERIVFxkWGB8AIScrHR/8QAFgEBAQEAAAAAAAAAAAAAAAAAAAEC/8QAFREBAQAAAAAAAAAAAAAAAAAAAAH/2gAMAwEAAhEDEQA/AOkG9ZcuxriXG4cuJJp4gDWXmXO5MvEvsaeJIooDTb81ZMvTV9h4zVE0yoAq+7E/V2CZ4AFbeXMslXBZbiXZOo3A1rm5Inppnof3cnyQK81mhnkOoqxfvcBj8gOuwAb1fLomf1sVy5lkq43AueJ2GfmBdyRe+wK6iqDfE7C1NWLsBnjoDXZ9gBb5ZFHoADTvkikAA5F+2AFrOFsADSP/2Q==) repeat;
  width: 100%;
  height: 100%;
  position: absolute !important;
  left: 0;
  top: 0;
  z-index: 1;
}
.lesson-video .prism-player .swiper-slide {
  overflow: hidden;
  padding: 10px 0;
  text-align: center;
  height: auto;
  /* line-height:100px; */
  /* Center slide text vertically */
}
.lesson-video .prism-player .swiper-slide > img {
  max-width: 100%;
}
.lesson-video .all-cover-mask {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 9991;
  background: #000;
  filter: alpha(opacity=50);
  opacity: 0.5;
}
.lesson-video .pop-up-problem {
  position: absolute;
  width: 21%;
  height: 21%;
  top: 80%;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  background-color: #fff;
  z-index: 9992;
  /* 单选框和复选框样式 */
  /* 主内容区 */
  /* 试题列表部分 */
  /* 试题列表部分 */
}
.lesson-video .pop-up-problem.pop_activeClass {
  -webkit-animation-duration: 0.1s;
          animation-duration: 0.1s;
  -webkit-animation-name: popupToTop;
          animation-name: popupToTop;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  transition: all 0.2s ease-in-out;
}
.lesson-video .pop-up-problem.app_activeClass {
  -webkit-animation-duration: 0.1s;
          animation-duration: 0.1s;
  -webkit-animation-name: app_popupToTop;
          animation-name: app_popupToTop;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  transition: all 0.2s ease-in-out;
}
.lesson-video .pop-up-problem::before, .lesson-video .pop-up-problem::after {
  display: none;
  content: " ";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -12px;
  width: 0px;
  border-style: solid;
  height: 0px;
  border-width: 12px;
  border-top-color: #fff;
  border-right-color: transparent;
  border-left-color: transparent;
  border-bottom-color: transparent;
}
.lesson-video .pop-up-problem .btn {
  position: absolute;
  width: 92px;
  height: 35px;
  left: 50%;
  margin-left: -46px;
  bottom: 6px;
  padding: 7px 7px;
  z-index: 2;
}
.lesson-video .pop-up-problem .btn.btn-continue {
  color: #000;
  background-color: #fff;
  padding: 7px 2px;
  border: 1px solid #ccc;
}
.lesson-video .pop-up-problem .question-wrapper {
  /* 禁用状态 */
  /* 选中状态 */
  /* 正确答案状态 */
  /* 错误答案状态 */
}
.lesson-video .pop-up-problem .question-wrapper .checkbox,
.lesson-video .pop-up-problem .question-wrapper .radio {
  padding-left: 0;
  margin-top: 0;
  margin-bottom: 0;
  line-height: normal;
  height: auto;
  position: relative;
  z-index: 1;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox i,
.lesson-video .pop-up-problem .question-wrapper .radio i {
  font-size: 18px;
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -10px;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox label,
.lesson-video .pop-up-problem .question-wrapper .radio label {
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 20px;
  padding-left: 40px;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox] + label:before,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio] + label:before,
.lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio] + label:after {
  width: 20px;
  height: 20px;
  top: 11px;
  margin-left: 10px;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox] + label:before,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio] + label:before {
  border-color: #9b9b9b;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio] + label:after {
  line-height: 20px;
  color: #3e454d;
  font-size: 12px;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox]:disabled + label,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio]:disabled + label {
  opacity: 1;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox]:disabled + label:before,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio]:disabled + label:before {
  background-color: #fff;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox]:checked + label,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio]:checked + label {
  background-color: #f5f7fa;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox]:checked + label:before,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio]:checked + label:before {
  border-color: #0f6af3;
  background-color: #0f6af3;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox]:checked + label:after,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio]:checked + label:after {
  color: #fff;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox.checkbox-correct input[type=checkbox] + label:before,
.lesson-video .pop-up-problem .question-wrapper .radio.radio-correct input[type=radio] + label:before {
  border-color: #2bc8a0;
  background-color: #2bc8a0;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox-correct, .lesson-video .pop-up-problem .question-wrapper .checkbox-correct:hover,
.lesson-video .pop-up-problem .question-wrapper .radio-correct,
.lesson-video .pop-up-problem .question-wrapper .radio-correct:hover {
  background-color: rgba(43, 200, 160, 0.1);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#192bc8a0,endColorstr=#192bc8a0);
}
.lesson-video .pop-up-problem .question-wrapper .checkbox-correct i, .lesson-video .pop-up-problem .question-wrapper .checkbox-correct:hover i,
.lesson-video .pop-up-problem .question-wrapper .radio-correct i,
.lesson-video .pop-up-problem .question-wrapper .radio-correct:hover i {
  color: #2bc8a0;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox.checkbox-correct input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .question-wrapper .radio.radio-correct input[type=radio] + label:after {
  color: #fff;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox.checkbox-error input[type=checkbox] + label:before,
.lesson-video .pop-up-problem .question-wrapper .radio.radio-error input[type=radio] + label:before {
  border-color: #ff5a5a;
  background-color: #ff5a5a;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox.checkbox-error input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .question-wrapper .radio.radio-error input[type=radio] + label:after {
  color: #fff;
}
.lesson-video .pop-up-problem .question-wrapper .checkbox-error,
.lesson-video .pop-up-problem .question-wrapper .radio-error {
  background-color: rgba(255, 90, 90, 0.1);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ff5a5a,endColorstr=#19ff5a5a);
}
.lesson-video .pop-up-problem .question-wrapper .checkbox-error i,
.lesson-video .pop-up-problem .question-wrapper .radio-error i {
  color: #ff5a5a;
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-1 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-1 input[type=radio] + label:after {
  content: "A";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-2 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-2 input[type=radio] + label:after {
  content: "B";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-3 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-3 input[type=radio] + label:after {
  content: "C";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-4 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-4 input[type=radio] + label:after {
  content: "D";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-5 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-5 input[type=radio] + label:after {
  content: "E";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-6 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-6 input[type=radio] + label:after {
  content: "F";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-7 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-7 input[type=radio] + label:after {
  content: "G";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-8 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-8 input[type=radio] + label:after {
  content: "H";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-9 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-9 input[type=radio] + label:after {
  content: "I";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-10 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-10 input[type=radio] + label:after {
  content: "J";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-11 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-11 input[type=radio] + label:after {
  content: "K";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-12 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-12 input[type=radio] + label:after {
  content: "L";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-13 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-13 input[type=radio] + label:after {
  content: "M";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-14 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-14 input[type=radio] + label:after {
  content: "N";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-15 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-15 input[type=radio] + label:after {
  content: "O";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-16 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-16 input[type=radio] + label:after {
  content: "P";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-17 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-17 input[type=radio] + label:after {
  content: "Q";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-18 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-18 input[type=radio] + label:after {
  content: "R";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-19 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-19 input[type=radio] + label:after {
  content: "S";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-20 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-20 input[type=radio] + label:after {
  content: "T";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-21 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-21 input[type=radio] + label:after {
  content: "U";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-22 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-22 input[type=radio] + label:after {
  content: "V";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-23 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-23 input[type=radio] + label:after {
  content: "W";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-24 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-24 input[type=radio] + label:after {
  content: "X";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-25 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-25 input[type=radio] + label:after {
  content: "Y";
}
.lesson-video .pop-up-problem .checkbox.checkbox-label-26 input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .radio.radio-label-26 input[type=radio] + label:after {
  content: "Z";
}
@media (max-width: 540px) {
  .lesson-video .pop-up-problem .question-wrapper {
    padding-bottom: 35px;
  }
  .lesson-video .pop-up-problem .question-wrapper .checkbox label,
.lesson-video .pop-up-problem .question-wrapper .radio label {
    padding-left: 34px;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio] + label:after {
    font-size: 12px;
  }
}
@media (max-width: 376px) {
  .lesson-video .pop-up-problem .question-wrapper .checkbox input[type=checkbox] + label:after,
.lesson-video .pop-up-problem .question-wrapper .radio input[type=radio] + label:after {
    font-size: 12px;
    width: 19px;
    height: 16px;
    line-height: 19px;
  }
}
.lesson-video .pop-up-problem .exam-wrapper {
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 3px;
  height: 88%;
  overflow-y: auto;
}
.lesson-video .pop-up-problem .exam-wrapper .myanswer {
  font-size: 16px;
  color: #3e454d;
  margin-top: 15px;
  margin-bottom: 15px;
}
.lesson-video .pop-up-problem .exam-wrapper .myanswer > span {
  color: #676c73;
}
.lesson-video .pop-up-problem .exam-wrapper .myanswer > span + span {
  margin-left: 30px;
}
.lesson-video .pop-up-problem .exam-wrapper .analysis {
  font-size: 16px;
  color: #3e454d;
  position: relative;
  padding-left: 50px;
}
.lesson-video .pop-up-problem .exam-wrapper .analysis > span {
  color: #676c73;
  position: absolute;
  left: 0;
  top: 0;
}
@media (max-width: 991px) {
  .lesson-video .pop-up-problem .exam-wrapper {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media (max-width: 767px) {
  .lesson-video .pop-up-problem .exam-wrapper {
    padding-left: 15px;
    padding-right: 25px;
    padding-top: 10px;
  }
  .lesson-video .pop-up-problem .exam-wrapper.exam-wrapper-mobile {
    padding-top: 16%;
  }
  .lesson-video .pop-up-problem .exam-wrapper .myanswer {
    font-size: 14px;
  }
  .lesson-video .pop-up-problem .exam-wrapper .analysis {
    font-size: 14px;
  }
}
@media (max-width: 414px) {
  .lesson-video .pop-up-problem .exam-wrapper .myanswer {
    font-size: 12px;
  }
  .lesson-video .pop-up-problem .exam-wrapper .analysis {
    font-size: 12px;
    padding-left: 40px;
  }
}
@media (max-width: 375px) {
  .lesson-video .pop-up-problem .exam-wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }
}
.lesson-video .pop-up-problem .question-wrapper {
  padding-top: 14px;
  padding-bottom: 16px;
  border-bottom: 1px #e5e5e5 solid;
}
.lesson-video .pop-up-problem .question-wrapper:last-child {
  border-bottom: none;
}
.lesson-video .pop-up-problem .question-wrapper .pic-list .pic-item {
  height: 0;
  margin-left: 1.7543859649%;
  background: #edf1f6;
  overflow: hidden;
  float: left;
  position: relative;
}
.lesson-video .pop-up-problem .question-wrapper .pic-list .pic-item .pic-wrapper {
  width: 100%;
  height: 100%;
  text-align: center;
}
.lesson-video .pop-up-problem .question-wrapper .pic-list .pic-item .pic-wrapper,
.lesson-video .pop-up-problem .question-wrapper .pic-list .pic-item .pic-wrapper > img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.lesson-video .pop-up-problem .question-wrapper .pic-list .pic-item .pic-wrapper > img {
  max-width: 100%;
  max-height: 100%;
  margin: auto;
}
.lesson-video .pop-up-problem .question-wrapper .question-title {
  font-size: 16px;
  overflow: hidden;
  padding-bottom: 10px;
}
.lesson-video .pop-up-problem .question-wrapper .question-title .question-index {
  font-weight: 700;
}
.lesson-video .pop-up-problem .question-wrapper .question-title .label-icon {
  margin-top: 3px;
  vertical-align: top;
}
.lesson-video .pop-up-problem .question-wrapper .question-title .score-set {
  display: inline-block;
  line-height: 22px;
  font-size: 14px;
  padding-left: 30px;
}
.lesson-video .pop-up-problem .question-wrapper .question-title .score-set .form-control {
  margin: 0 5px;
}
.lesson-video .pop-up-problem .question-wrapper .question-title .pic-list .pic-item {
  width: 16.8253968254%;
  padding-bottom: 9.4736842105%;
  margin-top: 1.7543859649%;
}
.lesson-video .pop-up-problem .question-wrapper .question-content {
  padding-left: 0px;
  padding-right: 0px;
}
.lesson-video .pop-up-problem .question-wrapper .question-content .pic-list,
.lesson-video .pop-up-problem .question-wrapper .question-answer .pic-list {
  overflow: hidden;
  margin-left: -20px;
  margin-top: -5px;
}
.lesson-video .pop-up-problem .question-wrapper .question-content .pic-list .pic-item,
.lesson-video .pop-up-problem .question-wrapper .question-answer .pic-list .pic-item {
  margin-top: 10px;
  width: 12.8947368421%;
  padding-bottom: 7.3684210526%;
}
.lesson-video .pop-up-problem .question-wrapper .question-option li {
  margin-top: 6px;
  border-radius: 4px;
}
.lesson-video .pop-up-problem .question-wrapper .question-option label {
  font-weight: normal;
  font-size: 16px;
}
.lesson-video .pop-up-problem .question-wrapper .question-textarea {
  margin-top: 5px;
  padding-left: 35px;
  padding-right: 45px;
}
.lesson-video .pop-up-problem .question-wrapper .textarea-box {
  border: 1px #ccc solid;
  border-radius: 4px;
}
.lesson-video .pop-up-problem .question-wrapper .textarea-box .textarea-head {
  font-size: 16px;
  padding: 0 20px;
  line-height: 45px;
  border-bottom: 1px #ececec solid;
}
.lesson-video .pop-up-problem .question-wrapper .textarea-box .textarea-head .upload-pic .iconfont {
  font-size: 24px;
  color: #9399a5;
  vertical-align: middle;
}
.lesson-video .pop-up-problem .question-wrapper .textarea-box .textarea-head .upload-pic.active .iconfont, .lesson-video .pop-up-problem .question-wrapper .textarea-box .textarea-head .upload-pic:hover .iconfont {
  color: #0f6af3;
}
.lesson-video .pop-up-problem .question-wrapper .textarea-box .textarea-body {
  height: 150px;
}
.lesson-video .pop-up-problem .question-wrapper .textarea-box .textarea-body > textarea {
  width: 100%;
  height: 100%;
  padding: 10px;
  border: none;
  resize: none;
}
.lesson-video .pop-up-problem .question-wrapper .question-answer {
  padding: 20px 35px 0;
}
.lesson-video .pop-up-problem .question-wrapper .question-answer .text {
  color: #555;
}
.lesson-video .pop-up-problem .question-wrapper .question-answer .key {
  font-size: 16px;
}
.lesson-video .pop-up-problem .question-wrapper .question-answer .key + .text {
  margin-left: 30px;
}
.lesson-video .pop-up-problem .question-wrapper .question-analysis {
  margin-top: 5px;
}
.lesson-video .pop-up-problem .question-wrapper .question-analysis .key {
  padding-top: 10px;
}
.lesson-video .pop-up-problem .question-wrapper .question-analysis .key a:hover {
  text-decoration: underline;
}
.lesson-video .pop-up-problem .question-wrapper .question-option.question-option-hover li:hover {
  border-radius: 4px;
  background-color: #f5f7fa;
}
@media (max-width: 991px) {
  .lesson-video .pop-up-problem {
    /* 试题列表部分 */
  }
  .lesson-video .pop-up-problem .question-wrapper .question-content {
    padding-left: 15px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-option li {
    margin-top: 5px;
  }
  .lesson-video .pop-up-problem .question-wrapper .textarea-box .textarea-head {
    display: none;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-textarea {
    padding-right: 15px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-answer {
    padding-left: 25px;
    padding-right: 25px;
  }
}
@media (max-width: 767px) {
  .lesson-video .pop-up-problem {
    /* 试题列表部分 */
  }
  .lesson-video .pop-up-problem .question-wrapper .question-title {
    font-size: 16px;
    padding-right: 10px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-title .label-icon {
    margin-top: 1px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-content {
    padding-left: 10px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-option label {
    font-size: 14px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-textarea {
    padding-right: 10px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-answer {
    padding-left: 20px;
    padding-right: 20px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-analysis {
    margin-top: 0;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-analysis .key {
    padding-top: 4px;
  }
}
@media (max-width: 457px) {
  .lesson-video .pop-up-problem {
    /* 试题列表部分 */
  }
  .lesson-video .pop-up-problem .question-wrapper {
    padding-top: 10px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-title {
    font-size: 14px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-option label {
    font-size: 13px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-option li {
    margin-top: 0px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-content {
    padding-left: 5px;
  }
}
@media (max-width: 375px) {
  .lesson-video .pop-up-problem {
    /* 试题列表部分 */
  }
  .lesson-video .pop-up-problem .question-wrapper .question-title {
    padding-bottom: 5px;
    font-size: 14px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-title .pic-list {
    padding-left: 10px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-content {
    padding-left: 0;
    padding-right: 20px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-textarea {
    padding-right: 0;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-answer {
    padding-left: 8px;
    padding-right: 8px;
  }
  .lesson-video .pop-up-problem .question-wrapper .question-answer .key + .text {
    margin-left: 20px;
  }
}
.lesson-video .analysis-feedback {
  padding-top: 10px;
  text-align: right;
}
.lesson-video .analysis-feedback > span {
  width: 82px;
  height: 30px;
  display: inline-block;
  line-height: 30px;
  border-radius: 25px;
  text-align: center;
  font-size: 14px;
}
.lesson-video .analysis-feedback > span + span {
  margin-left: 10px;
}
.lesson-video .analysis-feedback > span i {
  margin-right: 10px;
  font-size: 16px;
  vertical-align: bottom;
}
.lesson-video .analysis-feedback > span .icon-dianzan-2 {
  display: none;
}
.lesson-video .analysis-feedback > span:hover {
  color: #fff;
}
.lesson-video .analysis-feedback > span:hover .icon-dianzan-2 {
  display: inline-block;
}
.lesson-video .analysis-feedback > span:hover .icon-fuzhu_youyong {
  display: none;
}
.lesson-video .analysis-feedback .wrong {
  background-color: #fff8f2;
  color: #ff7a45;
}
.lesson-video .analysis-feedback .wrong i {
  display: inline-block;
  transform: rotateX(-180deg);
}
.lesson-video .analysis-feedback .wrong .icon-dianzan-2 {
  display: none;
}
.lesson-video .analysis-feedback .wrong:hover {
  background-color: #ff7a45;
}
.lesson-video .analysis-feedback .fight {
  background-color: #f4f7fe;
  color: #0f6af3;
}
.lesson-video .analysis-feedback .fight:hover {
  background-color: #0f6af3;
}
.lesson-video .analysis-feedback .fightactive,
.lesson-video .analysis-feedback .wtrongactive {
  color: #fff;
}
.lesson-video .analysis-feedback .fightactive .icon-dianzan-2,
.lesson-video .analysis-feedback .wtrongactive .icon-dianzan-2 {
  display: inline-block;
}
.lesson-video .analysis-feedback .fightactive .icon-fuzhu_youyong,
.lesson-video .analysis-feedback .wtrongactive .icon-fuzhu_youyong {
  display: none;
}
.lesson-video .analysis-feedback .fightactive {
  background-color: #0f6af3;
}
.lesson-video .analysis-feedback .wtrongactive {
  background-color: #ff7a45;
}
@media (max-width: 663px) {
  .lesson-video .pop-up-problem .btn {
    bottom: 2px;
    font-size: 12px;
    width: 65px;
  }
}
@media (max-width: 590px) {
  .lesson-video .pop-up-problem .btn-continue,
.lesson-video .pop-up-problem .btn {
    bottom: 1px;
    font-size: 12px;
    width: 65px;
    height: 28px;
    padding: 4px;
  }
  .lesson-video .pop-up-problem .btn-continue.btn-continue,
.lesson-video .pop-up-problem .btn.btn-continue {
    padding: 4px;
  }
}
@media (max-width: 447px) {
  .lesson-video .pop-up-problem .btn-continue,
.lesson-video .pop-up-problem .btn {
    bottom: 5px;
    height: 28px;
    padding: 4px;
  }
  .lesson-video .pop-up-problem .btn-continue.btn-continue,
.lesson-video .pop-up-problem .btn.btn-continue {
    padding: 4px;
  }
  .lesson-video .pop-up-problem::before, .lesson-video .pop-up-problem::after {
    display: none;
  }
}
@media (max-width: 434px) {
  .lesson-video .pop-up-problem .exam-wrapper {
    height: 82%;
  }
}

/* 文档控制 */
.doc-controlbar {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  visibility: hidden;
  overflow: hidden;
  background-color: #414141;
  height: 56px;
  line-height: 56px;
  color: #fff;
}
.doc-controlbar .doc-progress {
  width: auto;
  padding-left: 96px;
  margin-left: 20px;
}
.doc-controlbar .doc-progress .progress--text {
  color: #fff;
}
.doc-controlbar .doc-pagination {
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: -80px;
  width: 160px;
  height: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  text-align: center;
}
.doc-controlbar .doc-pagination > span {
  display: inline-block;
  cursor: pointer;
}
.doc-controlbar .doc-pagination .slide-num {
  padding-left: 18px;
  padding-right: 18px;
  line-height: 22px;
}
.doc-controlbar .functionality {
  margin-right: 20px;
}
.doc-controlbar .functionality .multiple {
  line-height: 1;
  padding: 5px 8px;
  margin-left: 20px;
  margin-right: 20px;
  border-radius: 12px;
}
.doc-controlbar .functionality .reduce {
  margin-right: 20px;
}
@media (max-width: 1220px) {
  .doc-controlbar .functionality {
    display: none;
  }
}
.doc-controlbar .doc-operation {
  padding-right: 20px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.doc-controlbar .doc-operation > span {
  display: inline-block;
  cursor: pointer;
}
.doc-controlbar .doc-operation > span + span {
  margin-left: 24px;
}
.doc-controlbar .doc-operation > span .iconfont {
  font-size: 18px;
}
.doc-controlbar.controlbar-type-doc {
  height: unset;
  min-height: 56px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.doc-controlbar.controlbar-type-doc .doc-pagination {
  position: unset;
  margin-left: unset;
}
@media (max-width: 1330px) and (min-width: 1220px) {
  .doc-controlbar.controlbar-type-doc .doc-progress {
    padding-left: 0;
  }
  .doc-controlbar.controlbar-type-doc .doc-progress .progress--bar {
    top: 11px;
  }
  .doc-controlbar.controlbar-type-doc .functionality .multiple {
    margin-left: 0;
  }
}
.doc-controlbar.controlbar-type-doc.two-row {
  display: block;
}
.doc-controlbar.controlbar-type-doc.two-row .doc-progress {
  margin-bottom: 40px;
}
.doc-controlbar.controlbar-type-doc.two-row .doc-pagination {
  position: absolute;
  left: unset;
  top: 40px;
  height: unset;
}
.doc-controlbar.controlbar-type-doc.two-row .right-control .functionality {
  margin-top: 40px;
}
.doc-controlbar.controlbar-type-doc.two-row .right-control .doc-operation {
  margin-top: 40px;
}

.lesson-desc {
  background-color: #fff;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
  border-radius: 0 0 4px 4px;
}
.lesson-desc [class*=col-] {
  padding-left: 0;
  padding-right: 0;
  line-height: 24px;
}
.lesson-desc .title .chapter-title {
  font-size: 18px;
}
.lesson-desc .lesson-data {
  text-align: right;
}
.lesson-desc .desc-row1,
.lesson-desc .desc-row2 {
  padding-top: 15px;
  padding-bottom: 15px;
}
.lesson-desc .desc-row1 + .desc-row2 {
  border-top: 1px #e5e5e5 solid;
}
.lesson-desc .coursemenu-fixed-content.bottom .coursemenu-fixed {
  position: fixed !important;
  bottom: 20px;
  right: 16px;
  z-index: 2;
}
.lesson-desc .coursemenu-fixed {
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 345px;
  height: 54px;
  line-height: 54px;
  background-color: #191919;
  border-radius: 4px;
  z-index: 3;
}
.lesson-desc .coursemenu-fixed .coursemenu-a {
  display: block;
  height: 100%;
  width: 100%;
  padding: 0 20px;
  color: #fff;
}
.lesson-desc .coursemenu-fixed .coursemenu-a img {
  width: 30px;
  height: 30px;
  margin-right: 8px;
}
.lesson-desc .coursemenu-fixed .coursemenu-a .progress-circle {
  vertical-align: middle;
  margin-right: 8px;
}
.lesson-desc .coursemenu-fixed .close-coursemenu {
  position: absolute;
  right: 20px;
  top: 0;
  display: block;
  line-height: 54px;
}
.lesson-desc .coursemenu-fixed .close-coursemenu i {
  font-size: 12px;
  color: #fff;
}
.lesson-desc.sphere {
  margin-top: 20px;
  background-image: url("/assets/images/course/sphere.jpg?v=0.0.2");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  border: 1px solid #fff;
  padding-top: 22px;
  padding-bottom: 22px;
  border-radius: 4px;
}
.lesson-desc.sphere .imgage {
  width: 22px;
  height: 22px;
}
@media (max-width: 767px) {
  .lesson-desc.sphere .imgage {
    width: 18px;
    height: 18px;
  }
}
.lesson-desc.sphere .imgage img {
  width: 100%;
  height: 100%;
  vertical-align: text-bottom;
}
.lesson-desc.sphere .hierarchy {
  font-size: 18px;
  color: #3e454d;
}
@media (max-width: 767px) {
  .lesson-desc.sphere .hierarchy {
    font-size: 16px;
  }
}
.lesson-desc.sphere .universal {
  font-size: 18px;
  color: #676c73;
}
@media (max-width: 767px) {
  .lesson-desc.sphere .universal {
    font-size: 16px;
  }
}
.lesson-desc.sphere .close {
  color: #676c73;
}
.lesson-desc.sphere .inline-block {
  margin-left: 10px;
}
.lesson-desc.sphere .search {
  margin-left: 20px;
}
.lesson-desc.sphere .search a {
  color: #0f6af3;
}

.lesson-down-content-wrap .lesson-intro {
  float: left;
  width: 100%;
  border-radius: 4px;
}
.lesson-down-content-wrap .lesson-intro.lesson-intro__width-856 {
  width: 856px;
}

.lesson-intro {
  margin-top: 20px;
  background-color: #fff;
  padding: 0 30px 30px;
  overflow: hidden;
}
.lesson-intro .intro-section .content {
  padding-top: 30px;
}
.lesson-intro .intro-section.summary .content {
  color: #676c73;
  line-height: 24px;
  font-size: 16px;
}
.lesson-intro .intro-section.active {
  display: block;
}
.lesson-intro .intro-section.coursefile {
  position: relative;
  /* 文档播放 */
}
.lesson-intro .intro-section.coursefile .content {
  padding-top: 0;
  margin-top: 30px;
}
.lesson-intro .intro-section.coursefile .swiper-wrapper {
  height: auto !important;
}
.lesson-intro .intro-section.coursefile .swiper-container {
  background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAyADIDASIAAhEBAxEB/8QAFwABAQEBAAAAAAAAAAAAAAAAAAECCP/EACQQAAICAQQCAQUAAAAAAAAAAAABMUERIVFxkWGB8AIScrHR/8QAFgEBAQEAAAAAAAAAAAAAAAAAAAEC/8QAFREBAQAAAAAAAAAAAAAAAAAAAAH/2gAMAwEAAhEDEQA/AOkG9ZcuxriXG4cuJJp4gDWXmXO5MvEvsaeJIooDTb81ZMvTV9h4zVE0yoAq+7E/V2CZ4AFbeXMslXBZbiXZOo3A1rm5Inppnof3cnyQK81mhnkOoqxfvcBj8gOuwAb1fLomf1sVy5lkq43AueJ2GfmBdyRe+wK6iqDfE7C1NWLsBnjoDXZ9gBb5ZFHoADTvkikAA5F+2AFrOFsADSP/2Q==) repeat;
  width: 100%;
  height: 100%;
}
.lesson-intro .intro-section.coursefile .swiper-slide {
  overflow: hidden;
  padding: 10px 0;
  text-align: center;
  height: auto;
}
.lesson-intro .intro-section.coursefile .swiper-slide > img {
  max-width: 100%;
  width: 100%;
}
.lesson-intro .intro-section.coursefile .doc-controlbar {
  z-index: 1;
}
.lesson-intro .intro-section.coursefile .hiddenpart {
  width: 100%;
  height: 35%;
  left: 0;
  bottom: 0;
  position: absolute;
  background-image: linear-gradient(#ffffff00, #ffffff);
  z-index: 2;
  text-align: center;
}
.lesson-intro .intro-section.coursefile .hiddenpart .btn {
  position: absolute;
  bottom: 60px;
  left: 50%;
  margin-left: -105px;
  border-radius: 4px;
  padding: 10px 30px;
}
.lesson-intro .intro-section.coursefile .hiddenpart .btn i {
  margin-left: 10px;
  font-size: 12px;
}
.lesson-intro .intro-section .detail-intro-container > img {
  max-width: 100%;
}

.lesson--recommend {
  margin-top: 20px;
  float: right;
  width: 320px;
  display: none;
}
.lesson--recommend.lesson--recommend__show {
  display: block;
}
.lesson--recommend .lesson--recommend--item {
  padding: 0 24px;
  background-color: #fff;
  margin-bottom: 24px;
  border-radius: 4px;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--title {
  height: 65px;
  line-height: 65px;
  color: #3e454d;
  font-size: 18px;
  overflow: hidden;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul {
  overflow: hidden;
  width: 100%;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li {
  height: 63px;
  margin-bottom: 24px;
  cursor: pointer;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic {
  float: left;
  width: 112px;
  height: 63px;
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic > img {
  width: 100%;
  height: 100%;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--pic .lesson--recommend--li--pic--icon {
  font-size: 12px;
  padding: 4px 6px;
  position: absolute;
  top: 5px;
  left: 5px;
  border-radius: 4px;
  transform: scale(0.7);
  transform-origin: left top;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.7);
  color: #fff;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text {
  float: right;
  width: 150px;
  height: 63px;
  position: relative;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text .lesson--recommend--li--text--title {
  color: #3e454d;
  font-size: 14px;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text .lesson--recommend--li--text--title .lesson--recommend--li--text--title--tag {
  float: left;
  padding: 3px 4px;
  color: #000;
  font-size: 12px;
  line-height: 1;
  border-radius: 2px;
  margin-right: 4px;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text .lesson--recommend--li--text--title .lesson--recommend--li--text--title--tag.lesson--recommend--li--text--title--tag__live {
  background: linear-gradient(#ff6700, #f33a0d);
  color: #fff;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text .lesson--recommend--li--text--title .lesson--recommend--li--text--title--tag.lesson--recommend--li--text--title--tag__await {
  background-color: #5897f7;
  color: #fff;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text .lesson--recommend--li--text--title .lesson--recommend--li--text--title--tag > .iconfont {
  font-size: 12px;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text .lesson--recommend--li--text--descr {
  color: #9399a5;
  font-size: 12px;
  white-space: nowrap;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text .lesson--recommend--li--text--descr > span {
  margin-right: 4px;
}
.lesson--recommend .lesson--recommend--item .lesson--recommend--ul .lesson--recommend--li .lesson--recommend--li--text .lesson--recommend--li--text--descr > .iconfont {
  font-size: 12px;
  margin-right: 2px;
}
.lesson--recommend .lesson--recommend--item .lesson--like--ul {
  min-height: 152px;
}
.lesson--recommend .lesson--recommend--relevant .lesson--recommend--relevant--swiper {
  height: 212px;
}
.lesson--recommend .lesson--recommend--like .lesson--recommend--title--refresh {
  line-height: 70px;
  font-size: 12px;
  color: #9399a5;
  float: right;
  cursor: pointer;
}
.lesson--recommend .lesson--recommend--like .lesson--recommend--title--refresh .iconfont {
  font-size: 12px;
}

@media (max-width: 1199px) {
  .lesson-down-content-wrap .lesson--recommend.lesson--recommend__show {
    display: none;
  }
  .lesson-down-content-wrap .lesson-intro.lesson-intro__width-856 {
    width: 100%;
  }
}
@media (max-width: 991px) {
  .lesson-intro {
    padding: 0 20px 30px;
  }
  .lesson-intro .intro-section.coursefile .hiddenpart .btn {
    bottom: 30px;
  }
}
@media (max-width: 769px) {
  .lesson-video {
    overflow: visible;
  }
}
@media (max-width: 767px) {
  .lesson-desc,
.lesson-intro {
    margin-left: -15px;
    margin-right: -15px;
  }

  .new-lesson-desc {
    margin-right: 0px;
  }

  .lesson-title {
    padding-bottom: 12px;
  }

  .lesson-desc {
    padding-left: 15px;
    padding-right: 15px;
  }
  .lesson-desc .title.no-question {
    width: 100%;
  }
  .lesson-desc .title .chapter-title {
    font-size: 16px;
  }
  .lesson-desc .lesson-data .label-file {
    display: none;
  }
  .lesson-desc .desc-row1,
.lesson-desc .desc-row2 {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .lesson-desc .desc-row1 .new-learning-count,
.lesson-desc .desc-row2 .new-learning-count {
    margin-left: 15px;
  }
  .lesson-desc .coursemenu-fixed {
    display: none;
  }

  .lesson-down-content-wrap {
    margin-left: -15px;
    margin-right: -15px;
  }
  .lesson-down-content-wrap .lesson-intro {
    margin-left: 0;
    margin-right: 0;
  }

  .lesson-intro {
    margin-top: 10px;
    padding: 5px 15px 15px;
  }
  .lesson-intro .intro-section.coursefile .hiddenpart .btn {
    width: 100%;
    left: 0;
    margin-left: 0;
    bottom: 10px;
    border-radius: 25px;
    font-size: 12px;
  }

  .hidden-1 {
    display: none;
  }

  .hidden-2 {
    display: inline-block;
  }
}
@media (max-width: 560px) {
  .doc-controlbar {
    height: 48px;
    line-height: 48px;
  }
  .doc-controlbar .doc-progress {
    width: 128px;
    margin-left: 15px;
    padding-left: 0;
  }
  .doc-controlbar .doc-progress .progress--bar {
    margin-top: -16px;
  }
  .doc-controlbar .doc-progress .progress--text {
    float: left !important;
    line-height: 60px;
  }
  .doc-controlbar .doc-pagination {
    margin-left: -80px;
    width: 160px;
  }
  .doc-controlbar .doc-pagination > span .iconfont {
    font-size: 14px;
  }
  .doc-controlbar .doc-pagination .slide-num {
    padding-left: 10px;
    padding-right: 10px;
    line-height: 18px;
  }
  .doc-controlbar .doc-pagination .slide-num .form-control {
    height: 18px;
    line-height: 16px;
  }
  .doc-controlbar .doc-operation {
    padding-right: 15px;
  }
  .doc-controlbar .doc-operation > span + span {
    margin-left: 15px;
  }
  .doc-controlbar .doc-operation > span .iconfont {
    font-size: 14px;
  }
  .doc-controlbar.controlbar-type-doc.two-row .doc-progress {
    width: auto;
    padding-left: 96px;
    margin-left: 20px;
    margin-bottom: 30px;
  }
  .doc-controlbar.controlbar-type-doc.two-row .doc-progress .progress--bar {
    margin-top: -3px;
  }
  .doc-controlbar.controlbar-type-doc.two-row .doc-progress .progress--text {
    line-height: unset;
  }
  .doc-controlbar.controlbar-type-doc.two-row .doc-pagination {
    top: 30px;
  }
  .doc-controlbar.controlbar-type-doc.two-row .right-control {
    position: absolute;
    right: 0;
  }
  .doc-controlbar.controlbar-type-doc.two-row .right-control .functionality {
    margin-top: 30px;
  }
  .doc-controlbar.controlbar-type-doc.two-row .right-control .doc-operation {
    margin-top: 30px;
  }

  .lesson-video {
    overflow: visible;
  }
  .lesson-video .pop-up-problem.pop_activeClass {
    top: -40% !important;
    height: 200% !important;
    max-height: 300% !important;
  }
}
@media (max-width: 375px) {
  .lesson-intro .intro-section.summary .content {
    padding: 10px 0;
  }
}
@-webkit-keyframes popupToTop {
  20% {
    width: 41%;
    height: 41%;
    top: 60%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.2;
  }
  50% {
    width: 50%;
    height: 70%;
    top: 50%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.4;
  }
  75% {
    width: 80%;
    height: 90%;
    top: 30%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.8;
  }
  100% {
    left: 1%;
    top: 2%;
    width: 98%;
    height: 96%;
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes popupToTop {
  20% {
    width: 41%;
    height: 41%;
    top: 60%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.2;
  }
  50% {
    width: 50%;
    height: 70%;
    top: 50%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.4;
  }
  75% {
    width: 80%;
    height: 90%;
    top: 30%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.8;
  }
  100% {
    left: 1%;
    top: 2%;
    width: 98%;
    height: 96%;
    transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes app_popupToTop {
  10% {
    width: 41%;
    height: 41%;
    top: 2%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.2;
  }
  20% {
    width: 50%;
    height: 70%;
    top: 0%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.4;
  }
  50% {
    width: 80%;
    height: 90%;
    top: -10%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.6;
  }
  75% {
    left: 1%;
    top: -20%;
    width: 98%;
    height: 96%;
    transform: translateX(0);
    opacity: 0.8;
  }
  100% {
    left: 1%;
    top: -40%;
    width: 98%;
    height: 200%;
    max-height: 200%;
    overflow-x: auto;
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes app_popupToTop {
  10% {
    width: 41%;
    height: 41%;
    top: 2%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.2;
  }
  20% {
    width: 50%;
    height: 70%;
    top: 0%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.4;
  }
  50% {
    width: 80%;
    height: 90%;
    top: -10%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.6;
  }
  75% {
    left: 1%;
    top: -20%;
    width: 98%;
    height: 96%;
    transform: translateX(0);
    opacity: 0.8;
  }
  100% {
    left: 1%;
    top: -40%;
    width: 98%;
    height: 200%;
    max-height: 200%;
    overflow-x: auto;
    transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    transform: scale3d(0.97, 0.97, 0.97);
  }
  to {
    opacity: 1;
    transform: scaleX(1);
  }
}
@keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    transform: scale3d(0.97, 0.97, 0.97);
  }
  to {
    opacity: 1;
    transform: scaleX(1);
  }
}
.yardsBody .course-item-grid .item {
  text-align: center;
  padding-bottom: 102.8070175439%;
}
.yardsBody .course-item-grid .item .yards-bottom,
.yardsBody .course-item-grid .item .yards-top {
  position: absolute;
  left: 0;
  right: 0;
  overflow: hidden;
  padding-left: 8.7719298246%;
  padding-right: 8.7719298246%;
  width: 100%;
}
.yardsBody .course-item-grid .item .yards-top {
  top: 0;
  height: 78.4982935154%;
}
.yardsBody .course-item-grid .item .yards-top .top-info {
  border-bottom: 1px solid #e5e5e5;
  width: 100%;
  height: 100%;
}
.yardsBody .course-item-grid .item .yards-top .top-info .yards-avator {
  width: 43.8596491228%;
  border-radius: 50%;
  margin-top: 10.5263157895%;
  margin-bottom: 10.5263157895%;
}
.yardsBody .course-item-grid .item .yards-top .top-info .yards-title {
  font-size: 18px;
}
.yardsBody .course-item-grid .item .yards-top .top-info .yards-desc {
  color: #676c73;
  font-size: 14px;
  margin-bottom: 0;
}
.yardsBody .course-item-grid .item .yards-bottom {
  bottom: 0;
  height: 21.1604095563%;
  padding-top: 7.8498293515%;
}
.yardsBody .course-item-grid .item .yards-bottom .msg {
  line-height: 1;
  margin-bottom: 0;
  color: #0f6af3;
}

@media (max-width: 475px) {
  .yardsBody .course-item-grid .item .yards-top .top-info .yards-title {
    font-size: 14px;
    margin-bottom: 5px;
  }
  .yardsBody .course-item-grid .item .yards-top .top-info .yards-desc {
    font-size: 12px;
  }
  .yardsBody .course-item-grid .item .yards-bottom .msg {
    font-size: 12px;
  }
}
.overtime-tips {
  width: 100%;
  display: none;
  background-color: #edf4fe;
}
.overtime-tips .container {
  position: relative;
  padding-top: 12px;
  padding-bottom: 12px;
}
.overtime-tips .container .icon-xiuxi {
  color: #0f6af3;
  margin-right: 10px;
}
.overtime-tips .container .remove-overtime-tips {
  position: absolute;
  right: 15px;
  top: 50%;
  margin-top: -10px;
  color: #9399a5;
}
.overtime-tips .container .remove-overtime-tips i {
  font-size: 12px;
}
@media (max-width: 470px) {
  .overtime-tips {
    font-size: 12px;
  }
  .overtime-tips .container .icon-xiuxi {
    margin-right: 5px;
  }
  .overtime-tips .container .remove-overtime-tips {
    margin-top: -8px;
  }
}

.courseware-body .detail-comment {
  margin-top: 30px;
}
.courseware-body .detail-comment .gross .gross-title {
  font-size: 18px;
  color: #1a1a1a;
  padding-left: 10px;
  line-height: 1;
  border-left: 3px solid #0f6af3;
}
.courseware-body .detail-comment .gross .gross-content {
  padding-left: 20px;
  margin-top: 20px;
}
.courseware-body .detail-comment .gross .gross-content.gross-header {
  margin-bottom: 14px;
  padding-top: 15px;
  padding-bottom: 15px;
}
.courseware-body .detail-comment .gross .gross-content.gross-header:hover {
  background-color: #f7f8fa;
}
.courseware-body .detail-comment .gross .gross-content .outer {
  display: block;
}
.courseware-body .detail-comment .gross .gross-content .outer .guests {
  width: 86%;
}
@media (max-width: 490px) {
  .courseware-body .detail-comment .gross .gross-content .outer .guests {
    width: 79%;
  }
}
.courseware-body .detail-comment .gross .gross-content .img {
  width: 20px;
  height: 18px;
  vertical-align: top;
}
.courseware-body .detail-comment .gross .gross-content .img img {
  width: 100%;
}
.courseware-body .detail-comment .gross .gross-content .name {
  font-size: 16px;
  color: #555;
  margin-left: 10px;
  width: 86%;
}
.courseware-body .detail-comment .gross .gross-content .outer:hover .name {
  color: #0f6af3;
}
.courseware-body .detail-comment .gross .gross-content .down {
  margin-right: 10px;
  color: #9399a5;
}
.courseware-body .detail-comment .gross .gross-content .outer:hover .down {
  color: #0f6af3;
}
.courseware-body .detail-comment .special {
  padding-top: 30px;
  border-top: 1px solid #e5e5e5;
}
.courseware-body .detail-comment .special .resource {
  padding-bottom: 30px;
}
.courseware-body .detail-comment .special .gross-content {
  margin-top: 0px;
  padding-top: 15px;
  padding-bottom: 15px;
}
.courseware-body .detail-comment .special .gross-content:hover {
  background-color: #f7f8fa;
}

.freeListening .modal-dialog .modal-body {
  border-bottom: 1px solid #e5e5e5;
}
.freeListening .modal-dialog .modal-body h4 {
  font-size: 18px;
  font-weight: bold;
}
.freeListening .modal-dialog .modal-body .cloud {
  margin-top: 20px;
}
.freeListening .modal-dialog .bootstrap-dialog-title {
  font-size: 18px;
  font-weight: bold;
}

.preiview_certificate .modal-content {
  background-color: #fff !important;
}
.preiview_certificate .modal-dialog {
  width: 800px !important;
  min-height: 600px;
  min-width: 145px !important;
}
.preiview_certificate .modal-body {
  padding: 15px;
  text-align: center;
}
.preiview_certificate .modal-body > img {
  max-width: 100%;
}
.preiview_certificate .bootstrap-dialog-message > img {
  max-width: 100%;
}
.preiview_certificate .bootstrap-dialog-message .icon-close-wrapper {
  bottom: -70px;
}

.back-header-content {
  margin-top: 0px;
}
.back-header-content .back-header-img {
  padding-top: 24px;
  position: relative;
}
@media (max-width: 767px) {
  .back-header-content .back-header-img {
    padding-top: 0px;
  }
}
.back-header-content .back-header-img .back-picture {
  filter: blur(100px);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #f7f9fa;
  background-repeat: no-repeat;
  background-size: 100%;
  z-index: -1;
  background-position: center center;
}
.back-header-content .back-header-img .back-picture .surname {
  width: 100%;
  height: 100%;
  background-color: #f7f9fa;
  opacity: 0.09;
}
.back-header-content .back-header-img .back-picture::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, #f7f8fa 100%);
}

.lesson-aichat-feedback-dialog .modal-dialog {
  width: 468px;
}
.lesson-aichat-feedback-dialog .feedback-title {
  font-size: 16px;
  font-weight: 500;
}
.lesson-aichat-feedback-dialog .feedback-multi-select {
  margin-top: 16px;
  display: flex;
}
.lesson-aichat-feedback-dialog .feedback-multi-select li {
  padding: 10px 20px;
  background-color: #f6f7fa;
  transition: color 0.12s ease-in-out;
  cursor: pointer;
  border: 1px solid transparent;
}
.lesson-aichat-feedback-dialog .feedback-multi-select li + li {
  margin-left: 12px;
}
.lesson-aichat-feedback-dialog .feedback-multi-select li:hover, .lesson-aichat-feedback-dialog .feedback-multi-select li.active {
  color: #0f6af3;
}
.lesson-aichat-feedback-dialog .feedback-multi-select li.active {
  border-color: #0f6af3;
}
.lesson-aichat-feedback-dialog .other-input-wrap {
  margin-top: 24px;
}
.lesson-aichat-feedback-dialog .other-input-wrap input {
  width: 428px;
}
.lesson-aichat-feedback-dialog .submit-btn {
  text-align: center;
  margin-top: 24px;
}
.lesson-aichat-feedback-dialog .submit-btn .btn {
  background: linear-gradient(90deg, #9363ff, #555cfd);
  color: #fff;
}

.bottom-price {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  background-color: #fff;
  width: 100%;
  z-index: 10;
  padding: 10px 15px;
}
.bottom-price .buy-price {
  font-weight: bold;
  font-size: 24px;
  color: #F53945;
  vertical-align: bottom;
}
.bottom-price .buy-price span {
  font-size: 14px;
}
.bottom-price .individual {
  padding: 6px 16px;
  background: #fff;
  border-radius: 6px;
  color: #0F6AF3;
  font-size: 14px;
  border: 1px solid #0F6AF3;
  margin-left: 16px;
}
.bottom-price .enterprise {
  padding: 6px 16px;
  font-size: 14px;
  border-radius: 6px;
  color: #FFFFFF;
  border: 1px solid #0F6AF3;
  background-color: #0F6AF3;
  margin-left: 16px;
}
@media (max-width: 768px) {
  .bottom-price {
    display: block;
  }
}