body {
  background-color: #f5f7fa
}

.swiper-pager span {
  width: 8px;
  height: 8px;
  background-color: #d8d8d8;
  margin: 0 3px;
  border: 0;
  transition: .2s width
}

.swiper-pager span.swiper-active-switch,
.swiper-pager span:hover {
  width: 16px;
  border-radius: 8px;
  background-color: #fff
}

.course-list-section {
  background-color: #f5f7fa;
  padding-bottom: 0
}

.course-list-section .container {
  margin-top: 20px
}

.course-list-section .container:first-of-type {
  margin-top: 40px
}

.course-list-section .container:last-of-type {
  padding-bottom: 0px
}

.course-list .course-item {
  margin-bottom: 20px
}

.text-line {
  position: relative;
  /* padding: 50px 0; */
  text-align: center;
}

.text-line h5 {
  /* margin: 0; */
  position: relative;
  margin-bottom: 20px;
  font-size: 32px;
  z-index: 1;
  color: #313131;
  zoom: 1
}

.text-line h5>.vip_title_left,
.text-line h5>.vip_title_right {
  width: 104px;
  height: 20px;
}

.text-line h5:after {
  content: '';
  display: block;
  clear: both
}

.text-line h5>div {
  float: left
}

.text-line h5 .course-icon {
  width: 28px;
  height: 28px;
  margin-top: 2px
}

.container:nth-of-type(1) .text-line h5 .course-icon {
  background: url('/static-dist/app/img/180919/index/yingyujingsai_icon.png') no-repeat center;
  background-image: -webkit-image-set(url('/static-dist/app/img/180919/index/yingyujingsai_icon.png') 1x, url('/static-dist/app/img/180919/index/yingyujingsai_icon@2x.png') 2x)
}

.container:nth-of-type(2) .text-line h5 .course-icon {
  background: url('/static-dist/app/img/180919/index/siliuji_icon.png') no-repeat center;
  background-image: -webkit-image-set(url('/static-dist/app/img/180919/index/siliuji_icon.png') 1x, url('/static-dist/app/img/180919/index/siliuji_icon@2x.png') 2x)
}

.container:nth-of-type(3) .text-line h5 .course-icon {
  background: url('/static-dist/app/img/180919/index/kaoyanyingyu_icon.png') no-repeat center;
  background-image: -webkit-image-set(url('/static-dist/app/img/180919/index/kaoyanyingyu_icon.png') 1x, url('/static-dist/app/img/180919/index/kaoyanyingyu_icon@2x.png') 2x)
}

.container:nth-of-type(4) .text-line h5 .course-icon {
  background: url('/static-dist/app/img/180919/index/zhuansi_icon.png') no-repeat center;
  background-image: -webkit-image-set(url('/static-dist/app/img/180919/index/zhuansi_icon.png') 1x, url('/static-dist/app/img/180919/index/zhuansi_icon@2x.png') 2x)
}

.container:nth-of-type(5) .text-line h5 .course-icon {
  background: url('/static-dist/app/img/180919/index/yasituofu_icon.png') no-repeat center;
  background-image: -webkit-image-set(url('/static-dist/app/img/180919/index/yasituofu_icon.png') 1x, url('/static-dist/app/img/180919/index/yasituofu_icon@2x.png') 2x);
  margin-top: 0
}

.text-line h5>.course-title {
  padding: 0;
  margin: 0 0 0 0px;
  font-size: 26px;
  color: #31363F
}

.text-line h5>.course-number {
  margin: 8px 0 0 10px;
  font-size: 16px;
  color: #6d6d6d;
  letter-spacing: 0
}

.container:nth-of-type(1) .text-line h5>.course-number span {
  color: #00c54d
}

.container:nth-of-type(2) .text-line h5>.course-number span {
  color: #05d5da
}

.container:nth-of-type(3) .text-line h5>.course-number span {
  color: #34a3f9
}

.container:nth-of-type(4) .text-line h5>.course-number span {
  color: #9c54dc
}

.container:nth-of-type(5) .text-line h5>.course-number span {
  color: #ff5656
}

.text-line h5>.course-more {
  float: right;
  font-size: 14px;
  letter-spacing: 0;
  margin-top: 7px;
  margin-right: 20px;
  line-height: 18px;
  position: relative;
  cursor: pointer
}

.text-line h5>.course-more a {
  color: #888
}

.text-line h5>.course-more:hover a {
  color: #3f4a54
}

.text-line h5>.course-more:after {
  content: '';
  position: absolute;
  top: -2px;
  right: -18px;
  width: 20px;
  height: 22px;
  background: url('/static-dist/app/img/180919/index/gengduo_icon@2x_1.png') repeat-x center;
  background-image: -webkit-image-set(url('/static-dist/app/img/180919/index/gengduo_icon@2x_1.png') 1x, url('/static-dist/app/img/180919/index/gengduo_icon@2x_1.png') 1x);
  background-size: 100% 100%;
}

.vip-info-title {
  display: flex;
}

.course-list .course-item {
  border-radius: 8px
}

.course-list .course-item .course-img .img-responsive {
  padding: 0
}

.course-list .course-item .title {
  height: 44px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical
}

.course-list .course-item .metas {
  padding: 10px 10px 14px 10px
}

.course-list .course-item .metas .course-tags {
  float: left;
  line-height: 20px;
  height: 20px;
  font-size: 0
}

.course-list .course-item .metas .course-tag {
  padding: 0 2px;
  /*background-color:#e4f3ff;*/
  border-radius: 2px;
  font-size: 12px;
  color: #616161;
  line-height: 18px;
  height: 18px;
  margin-right: 6px;
  border: 1px solid #d1d1d1;
  /*max-width:52px;*/
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block
}

.course-list .course-item .metas .course-price-widget {
  font-size: 14px;
  height: 20px;
  line-height: 20px;
}

.course-list .course-item .metas .free {
  color: #22bfa7
}

.course-list .course-item .metas .price {
  color: #e83d2c
}

.es-footer-link {
  background-color: #3d464d;
  position: relative;
  text-align: center;
  padding: 18px 0
}

.es-footer-link:before {
  height: 4px;
  background-image: linear-gradient(-180deg, #7b8892 0, #455059 100%);
  position: absolute;
  width: 100%;
  top: -4px;
  left: 0
}

.es-footer-link:after {
  ;
  height: 4px;
  position: absolute;
  width: 100%;
  bottom: -4px;
  left: 0;
  background: url('/static-dist/app/img/180919/index/caisejianbian_pic.png') repeat-x center;
  background-image: -webkit-image-set(url('/static-dist/app/img/180919/index/caisejianbian_pic.png') 1x, url('/static-dist/app/img/180919/index/caisejianbian_pic@2x.png') 2x)
}

.es-footer-link .link-box li {
  padding: 0 10px;
  font-size: 14px;
  display: inline-block;
  line-height: 14px;
  border-right: 1px solid #d8d8d8
}

.es-footer-link .link-box li a {
  color: rgba(255, 255, 255, 0.80)
}

.es-footer-link .link-box li:nth-child(3) {
  border: 0
}

.es-footer-link .link-box li:nth-child(4) {
  border: 0;
  color: #9da0a3
}

.es-footer-link .copyright {
  font-size: 13px;
  color: #909EAB;
  border-top: 1px solid #DBDBDB;
  padding: 30px 0;
}

.es-footer-link .copyright a {
  color: #909EAB;
}

.ba_logo {
  width: 20px;
  height: 20px;
  vertical-align: sub;
  margin: 0 5px 0 8px;
}

@media(min-width:992px) {
  .es-header .container {
    height: 100%
  }

  .container>.navbar-header {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 10px
  }

  .es-header .navbar-header .navbar-brand {
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 10px;
    height: 49px;
    line-height: 49px
  }

  .es-header .navbar-header .navbar-brand img {
    width: 166px;
    height: 49px;
    margin-top: -1px;
  }

  .es-header {
    padding: 0;
    height: 130px;
    background-color: #fff
  }

  .es-header .navbar-collapse {
    padding: 0;
    margin-left: 250px
  }

  .es-header .nav.navbar-nav>li>a {
    padding: 29px 15px;
    font-size: 16px;
    color: #3f4a54;
    transition: .2s color;
    line-height: 22px
  }

  .es-header .nav.navbar-nav>li>a:hover {
    color: #34a3f9 !important
  }

  .es-header .nav.navbar-nav>li.active>a {
    color: #34a3f9 !important;
    position: relative
  }

  .es-header .nav.navbar-nav>li.active>a:after {
    content: '';
    width: 28px;
    height: 6px;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    background: url('/static-dist/app/img/180919/index/xiahuaxian_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/180919/index/xiahuaxian_icon.png') 1x, url('/static-dist/app/img/180919/index/xiahuaxian_icon@2x.png') 2x)
  }

  .es-header .navbar-user {
    right: 0;
    top: 50%;
    transform: translateY(-50%)
  }

  .es-header .nav.user-nav .visitor-li {
    font-size: 14px;
    width: 52px;
    height: 30px;
    line-height: 30px;
    text-align: center
  }

  .es-header .nav.user-nav .visitor-li.visitor-register-li {
    border-radius: 4px 0 0 4px;
    border: 1px solid #f0f0f0;
    border-right: 0
  }

  .es-header .nav.user-nav .visitor-li.visitor-register-li a {
    color: #9b9b9b
  }

  .es-header .nav.user-nav .visitor-li.visitor-login-li {
    border-radius: 0 4px 4px 0;
    background-color: #34a3f9;
    border: 1px solid #34a3f9;
    margin: 0
  }

  .es-header .nav.user-nav .visitor-li.visitor-login-li a {
    color: #fff
  }

  .es-header .nav.user-nav .visitor-li>a {
    padding: 0;
    display: block;
    width: 100%;
    height: 100%;
    line-height: 30px
  }
}

@media(max-width:991px) {
  .es-header .navbar-collapse {
    padding: 0;
    margin-left: 130px
  }

  .es-header .navbar-header .navbar-brand {
    height: auto;
    padding: 8px 0
  }

  .es-header .navbar-header .navbar-brand img {
    width: 120px;
    height: auto;
    margin-top: 1px
  }
}

@media(min-width:768px) and (max-width:991px) {
  .es-header .navbar-user {
    right: 0;
    top: 50%;
    transform: translateY(-50%)
  }

  .es-header .nav.user-nav .visitor-li {
    font-size: 14px;
    width: 45px;
    height: 26px;
    line-height: 26px;
    text-align: center
  }

  .es-header .nav.user-nav .visitor-li.visitor-register-li {
    border-radius: 4px 0 0 4px;
    border: 1px solid #f0f0f0;
    border-right: 0
  }

  .es-header .nav.user-nav .visitor-li.visitor-register-li a {
    color: #9b9b9b
  }

  .es-header .nav.user-nav .visitor-li.visitor-login-li {
    border-radius: 0 4px 4px 0;
    background-color: #34a3f9;
    border: 1px solid #34a3f9;
    margin: 0
  }

  .es-header .nav.user-nav .visitor-li.visitor-login-li a {
    color: #fff
  }

  .es-header .nav.user-nav .visitor-li>a {
    padding: 0;
    display: block;
    width: 100%;
    height: 100%;
    line-height: 26px
  }
}

.es-header .nav.navbar-nav>li>a,
.text-line h5>.course-title,
.container .text-line h5>.course-number,
.course-list .course-item .title {
  /*font-weight:bold*/
}

@media(max-width:767px) {
  .course-list .course-item .metas .course-tags {
    display: none
  }

  .text-line h5 {
    margin: 0;
  }

  .homepage .course-list-section .container:first-of-type {
    margin-top: 0px !important;
  }
}