html{min-height: 100%; overflow-y:scroll;}
body{background: #f5f5f5; min-height: 100%; }
.container{min-height: 100%;
background: #F5F6F8;}
.container .swiper{
  /* height: 11rem;  */
  overflow: hidden; margin-top: 5.325rem;}
.container .swiper .swiper-container{max-width:640px ;position: relative; overflow: hidden; height: 100%;}
.container .swiper .swiper-container .swiper-slide a{width: 100%; height: 100%; display: block;}
.container .swiper .swiper-container .swiper-slide img{width: 100%; height: 100%;}
.swiper-pagination .swiper-pagination-bullet{width:0.5rem;height:0.5rem;border-radius:50%;background-color:rgba(255,255,255,0.5);margin:0 0.25rem; opacity: 1;}
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width: 1.25rem; border-radius: 5px; background: rgba(255,255,255,0.8);}
.course-wrap{
  width: 90.7%;
  background: #FFF; 
  /* padding-bottom: .9375rem; */
  margin: 0.625rem auto;
  border-radius: 0.5rem;
}
/* .courseType{padding-top: .9375rem; display: flex; display: -webkit-box; display: -ms-flexbox;-webkit-box-orient:horizontal; -webkit-box-direction:normal; -ms-flex-flow:row nowrap; flex-flow:row nowrap;}
.courseType li{flex:1; -ms-flex:1;-webkit-box-flex:1; width: 3.875rem;} */
.courseType li img{
  width:2.5rem; 
  height: 2.5rem; 
  display: block; margin: 0 auto; vertical-align: middle;}
.courseType li .projectName{text-align: center; 
  font-size: 0.75rem; 
  color: #4a4a4a; margin-top: .3125rem;}
.course-box{margin-top: 0.625rem;  
  /* background: #FFF;  */
  padding-bottom: 0.9375rem;}
.commonTitle{padding: 0.9375rem; padding-bottom: 0;} 
.commonTitle-left{float: left;}
.commonTitle-left .commonTitle-name{font-size: 1rem; color: #333;}
.commonTitle-left .shuxian{display:inline-block;width:0.1875rem;height:1.1875rem;background-color:#20bc22;vertical-align:middle;margin-right:5px;margin-right:.3125rem;margin-top:-3px;margin-top:-.1875rem}
.microCourse-show{
  margin-right: 0;
  display: flex;
  overflow-x: auto;
}
.microCourse-show::-webkit-scrollbar {
  width: 0 !important;
}
.microCourse-show {
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
}
.professionCourses-show li{
  width: 90.7%;
  padding:.9375rem;
background: #FFF;
box-sizing: border-box;
margin: 0 auto;
margin-top: 0.625rem;
border-radius: 0.5rem;
}
.professionCourses-show li a{display: flex; flex-flow:row nowrap; height: 100%;-webkit-box-direction:normal; -webkit-box-orient:horizontal; -ms-flex-flow:row nowrap; -moz-box-direction:normal;}
.professionCourses-show li a > div{flex:1;-webkit-box-flex:1;-ms-flex:1;}
.professionCourses-show li a .professionCourses-show-left{margin-right: .75rem; flex: 0 0 40%; position: relative;}
.livestatus{position: absolute; left: 0; top: 0; background: rgba(0,0,0,.3); font-size: 0.875rem; color: #FFF; padding: 0.1875rem;}
.dot{font-size: 0.625rem; color: #eb6100;}

.professionCourses-show li a .professionCourses-show-left img{width: 100%; }
.professionCourses-show li a .professionCourses-show-right{overflow: hidden; }
.professionCourses-show li a .professionCourses-show-right .course-Name{font-size: .9375rem; white-space: nowrap; overflow:hidden;text-overflow:ellipsis; color: #333;}
.multi-no-wrap{display: -webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; }
.professionCourses-show li a .professionCourses-show-right .courseDescription{ color: #666; font-size: .75rem; height: 1.5rem; -webkit-line-clamp:2; line-height: 1.5rem; display: flex; overflow: hidden;}
.courseDescription > div{flex:1;-webkit-box-flex:1;-ms-flex:1; }
.status{color: #eb6100; font-size: 0.875rem; height: 1.75rem; -webkit-line-clamp:2; line-height: 1.75rem; word-break:break-all; word-wrap:break-word; overflow: hidden; margin-top: 0.1875rem; display: flex;}
.status span{overflow: hidden; height: 1.75rem;  flex:1;}
.status .icon-shijian{flex:0 0 15px; font-size: 0.75rem; }
.status .icon-shipinzhibo{flex:0 0 15px;font-size: 0.75rem;}
.status .timelong{color: #666;}
.statuslong .icon-shijian{color: #666;}
.status .play-living{ flex:0 0 20px; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; }
.status .play-living:before {
          content: "";
          background: url(../images/icon-play-active2.gif);
          width: 13px;
          display: inline-block;
          font-size: 0;
          text-indent: -9999em;
          vertical-align: -1px;
          height: 13px;
          margin-right: 4px;
        }
.status .play-living:before {
  background: url(../images/icon-play-active2.png) no-repeat;
  background: url(../images/icon-play2.gif) \9;
  vertical-align: -2px;
  margin-right: 1px;
}
@media screen and (min-width: 0px) {
 .status .play-living:before {
    background: url(../images/icon-play-active2.png) no-repeat;
    -webkit-animation: living 0.52s steps(1, start) infinite;
            animation: living 0.52s steps(1, start) infinite;
  }
}
@keyframes living {
  0% {
    background-position: 0 0;
  }
  25% {
    background-position: -13px 0;
  }
  50% {
    background-position: -26px 0;
  }
  75% {
    background-position: -39px 0;
  }
}
@-webkit-keyframes living {
  0% {
    background-position: 0 0;
  }
  25% {
    background-position: -13px 0;
  }
  50% {
    background-position: -26px 0;
  }
  75% {
    background-position: -39px 0;
  }
}
.professionCourses-show li a .professionCourses-show-right .countAndMoney {float: right; font-size: .75rem; color: #666;}
.professionCourses-show li a .professionCourses-show-right .countAndMoney .money{float: left; font-size: .75rem; color: #eb6100;}
.sum-people .icon-yonghu{font-size: 0.8125rem; display: inline-block;}

.recommend-list{padding-left: 0.9375rem;  
  /* background-color: #FFF;  */
  margin-top: 0.625rem;}
.recommend-list .commonTitle,.bookdeatil .commonTitle{padding-top: 0.9375rem; padding-bottom: 0.9375rem; padding-left: 0;}
.course-list{border-top: 1px solid #f4f4f4; padding-bottom: 1.25rem;}      
.list-title{height: 50px;line-height: 50px;font-size: 1.0rem;color: #1c1c1c;font-weight: 400;}
.microCourse-show{margin-right: 0;}
.microCourse-show a,.bookdeatil a{width: 50%;float: left;overflow: hidden;}
.microCourse-show a li,.bookdeatil a li{margin-bottom: .625rem;margin-right: .625rem;}       
.microCourse-show .commonImg{width: 100%; height: auto; overflow: hidden;}
.microCourse-show .commonImg img{width:100%; display:block; margin:0 auto;  height:5.84375rem;}
.courseName{width: 100%;font-size: 0.875rem;color: #666;padding:.625rem 0; line-height: 1.25rem;white-space:nowrap; overflow: hidden;text-overflow:ellipsis;}
.money{font-size: .8125rem; color: #eb6100;}
.old-money{font-size: .75rem; color: #bfbfbf}         
.moreCourse{width: 5.625rem; height: 1.875rem; line-height: 1.875rem; border: 1px solid #20bc22; border-radius: 50px; color: #20bc22; font-size: .875rem; text-align: center; margin: 0 auto;}
.bookdeatil{padding-left: .625rem;padding-bottom: 1.25rem; background: #f4f4f4;}
.bookdeatil .commonImg{width: 100%;height: 10.5625rem;overflow: hidden;background: #FFF;padding-top: 1.5625rem;}
.bookdeatil .commonImg img{width:60%; display:block; margin:0 auto;} 
.bookdeatil .courseName{white-space:nowrap; overflow: hidden;text-overflow:ellipsis; }
.course-fenlei{display: flex; -webkit-box-flex:1;-ms-flex:1; background: #FFF; padding: 0.625rem 0; border-top: 1px solid #eee; }
.course-fenlei > a{flex:1;}
.course-fenlei .icon-yin{width: 1.25rem;height: 1.25rem; margin: 0 auto; display: block; text-align: center; font-size: 1.25rem;}
.course-fenlei .icon-text{text-align: center; font-size: 0.75rem; color: #999; padding-top: 0.3125rem;}
.footer{margin-top: .625rem; padding:.9375rem .3125rem;}
.footer p{font-size: .75rem; color: #333; text-align: center; line-height: 1.25rem;}

div.slide-mask {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 51px;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  display: none;
}
aside.slide-wrapper {
  position: absolute;
  z-index: 4;
  left: 0;
  top: 51px;
  width: 85%;
  height: 100%;
  background: #FFF;
  -webkit-transform: translate3d(-100%, 0, 0);
  -moz-transform: translate3d(-100%, 0, 0);
  -ms-transform: translate3d(-100%, 0, 0);
  -o-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.mint-tab-container{ height: 100%; overflow: hidden;}
.mint-tab-container-wrap{padding: 0 .9375rem; height: 100%; overflow-y:scroll; display: flex;}
.mint-tab-container-item{width: 100%;flex-shrink:0;}
.courseLists{height: 100%;}
.jiuyeTitle{font-size: 1rem; color: #20bc22;  display: block; text-align: center; height: 3.0625rem; line-height: 3.0625rem; }
.classify-ul{display: flex;  flex-wrap: wrap;align-content: flex-start;}
.classify-ul li{flex:0 0 20%; color: #666; height: 1.625rem; text-align: center; line-height: 1.625rem; margin: 0 0.5rem 0.5rem 0; font-size: 0.75rem; border: 1px solid #eee; text-overflow:ellipsis; white-space:nowrap; overflow: hidden; }
.classify-ul li > a{color: #666;}
.fenlei-title{font-size: 0.875rem; color: #666; padding: 0.3125rem 0; display: block; line-height: 1.875rem;}
aside.slide-wrapper.moved {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.swiper-slide{
  /* width: 18rem; */
  width: 21.5625rem;
  /* height: 7.1875rem; */
}
.swiper-slide img{
  border-radius: 1rem;
}
.swiper-slide-shadow-left,.swiper-slide-shadow-right{
  border-radius: 1rem;
}

.courseType{
  padding-top: 0.625rem; 
  display:box;
  display:-webkit-box;
  display:-webkit-flex;
  display:-moz-box;
  display:-ms-flexbox;
  display:flex;
  flex-wrap: wrap;
  /* -ms-flex-flow:row wrap;
  flex-flow:row wrap; */
}
.courseType li{
  width: 20%;
  padding-bottom: 0.725rem;
}

/* 新版研线课堂新增 */
.fixed_banner{
  width: 90.7%;
  margin: 0 auto;
}
.fixed_banner img{
  width: 100%;
}

.recent_live {
  width: 15.625rem;
  height: 6.5625rem;
  background: #FFFFFF;
  border-radius: 0.5rem;
  padding: 0.78125rem 0.9375rem;
  display: flex;
  flex-direction: column;
  margin-right: 0.625rem;
  flex-grow: 0;
  flex-shrink: 0;
  position: relative;
  float: left;
}
.recent_live:last-child {
  margin-right: 0;
}
.recent_live .recent_name {
  width: 100%;
  font-size: 0.93rem;
  color: #151515;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-bottom: 0.2rem;
}
.recent_live .course_name {
  width: 100%;
  font-size: 0.75rem;
  color: #999999;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-bottom: 0.5rem;
}
.recent_live .recent_bot {
  flex: 1;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.recent_live .recent_bot .recent_msg {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.recent_live .recent_bot .recent_msg .img {
  width:0.625rem;
  height: 0.625rem;
  margin-right: 0.3125rem;
}
.recent_live .recent_bot .recent_time {
  display: flex;
  align-items: center;
  color: #F96158;
  font-size: 0.75rem;
}
.recent_live .recent_bot .recent_status {
  width: 4.8125rem;
  height: 1.375rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  color: #FFFFFF;
  border-radius: 0.6875rem;
}
.recent_live .recent_bot .sign {
  background: linear-gradient(90deg, #F98715 0%, #FEA54B 100%);
}
.recent_live .recent_bot .living {
  background: linear-gradient(90deg, #F3453B 0%, #FC736B 100%);
}
.recent_live .recent_bot .lived {
  color: #999999;
}
.recent_live .recent_bot .playback {
  background: linear-gradient(90deg, #00CA79 0%, #00E4A7 100%);
}
.recent_live .recent_teachers {
  position: absolute;
  right: 0.9375rem;
  bottom: 0.9375rem;
  width: 2.4375rem;
}
.recent_live .recent_teachers .img {
  width: 2.4375rem;
}