/* line 1, ../sass/class-intro.scss */
.class-title-wrapper {
  padding: 22px 0 10px 0;
}
/* line 4, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .title {
  position: relative;
  font-size: 2rem;
  color: #00a1be;
  padding-left: 15px;
  line-height: 40px;
  font-weight: bold;
  letter-spacing: 1px;
  margin-bottom: 2px;
}
/* line 14, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .title a {
  font-size: 1.0625rem;
  color: #777;
  text-decoration: none;
  font-weight: normal;
  border: 1px solid #777;
  padding: 0px 15px;
  vertical-align: top;
  margin-left: 5px;
  white-space: nowrap;
}
/* line 26, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .title:before {
  content: "";
  display: block;
  border-left: 5px solid #00a1be;
  height: 24px;
  position: absolute;
  left: 0;
  top: 8px;
}
/* line 36, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .detail-block {
  font-size: 0;
}
/* line 38, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .detail-block .teacher-name-and-post-date {
  display: inline-block;
  width: calc( 100% - 200px);
  color: #777;
  font-size: 1.25rem;
  padding-left: 15px;
}
/* line 44, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .detail-block .teacher-name-and-post-date small {
  margin-left: 5px;
  font-size: 70%;
}
/* line 50, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .detail-block .share-link-and-quick-scroll {
  display: inline-block;
  width: 200px;
  vertical-align: top;
  text-align: right;
}
/* line 55, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .detail-block .share-link-and-quick-scroll a {
  padding: 0 4px;
}
/* line 58, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .detail-block .share-link-and-quick-scroll .c {
  width: 38px;
}
/* line 61, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .detail-block .share-link-and-quick-scroll .q {
  width: 38px;
}
/* line 64, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .detail-block .share-link-and-quick-scroll .h {
  width: 30px;
}
/* line 67, ../sass/class-intro.scss */
.class-title-wrapper .class-title-block .detail-block .share-link-and-quick-scroll .s {
  width: 24px;
}

/* line 76, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block {
  font-size: 0;
}
/* line 78, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-video-file-block {
  display: inline-block;
  position: relative;
  height: 550px;
  width: calc( 100% - 350px );
  overflow: hidden;
}
/* line 85, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-video-file-block .cover_play_link {
  width: 100%;
  height: 100%;
  display: block;
  /*background-color: rgba(0, 0, 0, 0.6);*/
  background-image: url(../images/classintro_button_2.png);
  background-repeat: no-repeat;
  background-position: center;
}
/* line 94, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-video-file-block .cover_play_link:focus {
  width: calc( 100% - 6px );
  height: calc( 100% - 6px );
  margin-top: 3px;
  margin-left: 3px;
}
/* line 102, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block {
  display: inline-block;
  background-color: #000;
  height: 550px;
  width: 350px;
  overflow: auto;
}
/* line 109, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item {
  font-size: 0;
  padding: 15px 0;
  border-bottom: 1px solid #fff;
  position: relative;
}
/* line 114, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item a {
  text-decoration: none;
}
/* line 117, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item table {
  width: 100%;
}
/* line 120, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item .class-unit-lock {
  width: 49px;
  text-align: center;
  padding-left: 15px;
}
/* line 124, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item .class-unit-lock div {
  background-image: url("../images/course_list_lock.png");
  background-size: 100% auto;
  background-repeat: no-repeat;
  display: inline-block;
  width: 16px;
  height: 22px;
}
/* line 134, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item .class-unit-lock.no-lock div {
  background-image: none;
}
/* line 139, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item .class-unit-min-height {
  width: 1px;
}
/* line 141, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item .class-unit-min-height div {
  min-height: 60px;
}
/* line 145, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item .class-unit-title {
  width: calc( 100% - 150px );
  font-size: 1.125rem;
  color: #fff;
}
/* line 150, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item .class-unit-time {
  width: 100px;
  font-size: 1.125rem;
  color: #fff;
  text-align: right;
  padding-right: 20px;
}
/* line 160, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item.active .class-unit-lock div {
  position: absolute;
  height: 100%;
  width: auto;
  border-left: 7px solid #f39800;
  left: 0;
  top: 0;
  background-image: none;
}
/* line 172, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-class-unit-list-block .list-item:last-child {
  border-bottom: 0;
}
/* line 178, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block {
  display: inline-block;
  background-color: #fff;
  height: 550px;
  width: 350px;
  vertical-align: top;
}
/* line 185, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-title-area {
  background-color: #00a1be;
  color: #fff;
  font-size: 1.125rem;
  padding: 10px 15px;
  font-weight: bold;
  letter-spacing: 2px;
  height: 47px;
}
/* line 196, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-content-area {
  height: calc( 550px - 112px );
  overflow: auto;
  border-right: 1px solid #ddd;
  padding: 10px 0;
}
/* line 202, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-content-area .msg-item {
  padding: 10px 15px;
  display: flex;
}
/* line 205, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-content-area .msg-item .avatar {
  width: 45px;
  height: 45px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-radius: 100%;
  margin-right: 10px;
}
/* line 215, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-content-area .msg-item .msg {
  width: calc( 100% - 55px );
  font-size: 0.9375rem;
}
/* line 218, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-content-area .msg-item .msg .name {
  color: #00a1be;
  font-weight: bold;
}
/* line 222, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-content-area .msg-item .msg .time {
  color: #898989;
  font-weight: bold;
  margin-right: 3px;
}
/* line 227, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-content-area .msg-item .msg .des {
  color: #595757;
  font-weight: bold;
}
/* line 235, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-input-area {
  padding: 10px 15px;
  background-color: #eee;
  display: flex;
  height: 65px;
}
/* line 240, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-input-area .avatar {
  width: 45px;
  height: 45px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-radius: 100%;
  margin-right: 10px;
}
/* line 250, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-input-area .input-area {
  position: relative;
  width: calc( 100% - 55px );
}
/* line 253, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-input-area .input-area input {
  font-size: 0.875rem;
  width: 100%;
  border-radius: 5px;
  border: 0;
  padding: 7px 10px;
  margin-top: 5px;
}
/* line 262, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-input-area .input-area button {
  background-color: #fff;
  border: 0;
  position: absolute;
  right: 2px;
  top: 16px;
}
/* line 269, ../sass/class-intro.scss */
.class-video-wrapper .class-video-block .class-live-chat-block .chat-input-area .input-area button img {
  width: 16px;
}
@media (max-width: 991px) {
  /* line 278, ../sass/class-intro.scss */
  .class-video-wrapper .class-video-block .class-video-file-block {
    width: 100%;
    height: 375px;
  }
  /* line 282, ../sass/class-intro.scss */
  .class-video-wrapper .class-video-block .class-class-unit-list-block {
    width: 100%;
    /*display: none;*/
    height: auto;
    max-height: 550px;
  }
  /* line 289, ../sass/class-intro.scss */
  .class-video-wrapper .class-video-block .class-live-chat-block {
    width: 100%;
  }
}

/* line 297, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block {
  position: relative;
  font-size: 0;
  padding: 10px 0px;
  display: table;
  width: 100%;
}
/* line 303, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block > div {
  display: inline-block;
  display: table-cell;
  color: #00a1be;
  font-size: 3.5rem;
}
/* line 310, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-time > div, .class-little-introduction-wrapper .class-little-introduction-block .class-classmate > div, .class-little-introduction-wrapper .class-little-introduction-block .class-score > div {
  display: inline-block;
  margin-left: 2px;
}
/* line 313, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-time > div small, .class-little-introduction-wrapper .class-little-introduction-block .class-classmate > div small, .class-little-introduction-wrapper .class-little-introduction-block .class-score > div small {
  font-size: 1rem;
  color: #999;
  display: block;
  margin-top: 2px;
}
/* line 321, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-time {
  /*width: 132px;*/
}
/* line 324, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-classmate {
  /*width: 181px;*/
}
/* line 327, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score {
  /*width: 260px;*/
}
/* line 329, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div {
  display: inline-block;
  margin-left: 2px;
}
/* line 333, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating {
  background: transparent url(../images/class_star_big.png) no-repeat 0 0px;
  display: block;
  width: 124px;
  height: 21px;
  vertical-align: middle;
  margin-right: 3px;
  margin-bottom: -1px;
  background-size: 100% auto;
}
/* line 344, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-0 {
  background-position: 0 -210px;
}
/* line 348, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-1 {
  background-position: 0 -189px;
}
/* line 352, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-2 {
  background-position: 0 -168px;
}
/* line 356, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-3 {
  background-position: 0 -147px;
}
/* line 360, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-4 {
  background-position: 0 -126px;
}
/* line 364, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-5 {
  background-position: 0 -105px;
}
/* line 368, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-6 {
  background-position: 0 -84px;
}
/* line 372, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-7 {
  background-position: 0 -63px;
}
/* line 376, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-8 {
  background-position: 0 -42px;
}
/* line 380, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-9 {
  background-position: 0 -21px;
}
/* line 384, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating.rate-10 {
  background-position: 0 0px;
}
/* line 389, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-price {
  /*width: calc( 100% - 975px );*/
  font-weight: bold;
  text-align: right;
  padding-right: 20px;
}
/* line 394, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-price .title {
  display: inline-block;
  font-size: 1.375rem;
  width: 55px;
  line-height: 23px;
  border-right: 1px solid #00a1be;
  margin-right: 6px;
  padding-right: 6px;
}
/* line 403, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-price .price {
  display: inline-block;
}
/* line 407, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-price .free-tag {
  display: inline-block;
}
/* line 409, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-price .free-tag img {
  width: 150px;
  display: inline-block;
  vertical-align: bottom;
  margin-bottom: 17px;
}
/* line 417, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-price .dateline {
  display: inline-block;
  background-image: url(../images/classintro_free_datebar.png);
  background-repeat: no-repeat;
  font-size: 0.875rem;
  padding: 0 20px 0 35px;
  color: #fff;
  vertical-align: bottom;
  margin-bottom: 17px;
}
/* line 428, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-payment {
  /*width: 402px;*/
  width: 201px;
  font-size: 0;
  vertical-align: top;
  padding: 17px 0;
  height: 84px;
}
/* line 435, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-payment a {
  font-size: 1.5rem;
  background-color: #999;
  color: #fff;
  display: inline-block;
  padding: 2px 5px;
  text-align: center;
  min-width: 191px;
  text-decoration: none;
  font-weight: bold;
  margin: 0 5px;
  line-height: 44px;
}
/* line 447, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-payment a img {
  width: 28px;
  vertical-align: middle;
}
/* line 451, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-payment a span {
  vertical-align: middle;
}
/* line 455, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-payment a.add-shopping-car {
  background-color: #00b0c3;
}
/* line 459, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-payment a.direct-purchase {
  background-color: #e83828;
}
/* line 463, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-payment a.choose-class {
  background-color: #00b0c3;
}
/* line 467, ../sass/class-intro.scss */
.class-little-introduction-wrapper .class-little-introduction-block .class-payment a.start-class {
  background-color: #0098cf;
}
@media (max-width: 1440px) {
  /* line 476, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block {
    display: block;
  }
  /* line 478, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block > div {
    display: inline-block;
  }
  /* line 482, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block .class-time {
    margin-right: 15px;
  }
  /* line 485, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block .class-classmate {
    /*width: 181px;*/
    margin-right: 15px;
  }
  /* line 489, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block .class-score {
    /*width: calc( 100% - 313px );*/
    margin-right: 15px;
  }
  /* line 493, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block .class-price {
    /*width: auto;*/
    margin-right: 15px;
  }
}

@media (max-width: 768px) {
  /* line 502, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block > div {
    font-size: 2.5rem;
  }

  /* line 506, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block .class-time > div small, .class-little-introduction-wrapper .class-little-introduction-block .class-classmate > div small, .class-little-introduction-wrapper .class-little-introduction-block .class-score > div small {
    font-size: 0.75rem;
  }

  	/*
  	.class-little-introduction-wrapper .class-little-introduction-block .class-time {
  		width: 100px;
  		white-space:nowrap;
  	}
  
  	.class-little-introduction-wrapper .class-little-introduction-block .class-classmate {
  		width: 115px;
  		white-space:nowrap;
  	}
  
  	.class-little-introduction-wrapper .class-little-introduction-block .class-score {
  		width: calc( 100% - 215px );
  		white-space:nowrap;
  	}
  	*/
  /* line 526, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block .class-score > div .rating {
    zoom: 0.75;
  }

  /* line 530, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block .class-price {
    /*width: 100%;*/
    text-align: left;
  }

  /* line 535, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block .class-price .title {
    font-size: 1rem;
    width: 40px;
    line-height: 16px;
  }

  /* line 541, ../sass/class-intro.scss */
  .class-little-introduction-wrapper .class-little-introduction-block .class-payment {
    padding: 0;
    margin-top: 5px;
    height: auto;
  }
}
/* line 549, ../sass/class-intro.scss */
.class-notice-wrapper {
  padding: 25px 0;
  margin-bottom: 50px;
}
/* line 552, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block {
  background-color: #00a0e9;
}
/* line 554, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block {
  font-size: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  border-bottom: 5px solid #00a0e9;
}
/* line 561, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-img {
  display: inline-block;
  width: 235px;
  vertical-align: top;
  background-color: #00a0e9;
}
/* line 566, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-img img {
  width: 235px;
  background-color: #efefef;
}
/* line 571, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content {
  width: calc( 100% - 235px );
  display: inline-block;
  background-color: #efefef;
  font-size: 0;
  vertical-align: top;
  padding: 20px 20px 5px 20px;
}
/* line 578, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .date {
  display: inline-block;
  font-size: 1rem;
  color: #777;
  border: 1px solid #777;
  border-radius: 100%;
  width: 75px;
  height: 75px;
  text-align: center;
  font-weight: bold;
  margin: 0 30px 0 20px;
}
/* line 590, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .date .day {
  font-size: 2.25rem;
  line-height: 40px;
  margin-top: 7px;
}
/* line 595, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .date .month {
  font-size: 1.25rem;
  line-height: 20px;
  margin-top: -3px;
}
/* line 601, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .content {
  display: inline-block;
  font-size: 1rem;
  vertical-align: top;
  width: calc( 100% - 203px );
}
/* line 606, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .content .title {
  font-size: 1.375rem;
  font-weight: bold;
  margin-top: 3px;
  margin-bottom: 3px;
}
/* line 612, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .content .desc {
  color: #666;
}
/* line 616, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .open-link {
  display: inline-block;
  font-size: 1rem;
  vertical-align: bottom;
  margin-bottom: -6px;
}
/* line 621, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .open-link a {
  color: #00a2dc;
  text-decoration: none;
  font-weight: bold;
  display: none;
}
/* line 626, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .open-link a img {
  width: 10px;
}
/* line 631, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .last-notice-block .notice-content .open-link a.active {
  display: block;
}
/* line 638, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block {
  /*display: none;*/
  height: 0;
  background-color: #00a0e9;
  padding: 0 0px 0 235px;
  position: relative;
  overflow: hidden;
}
/* line 646, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item {
  width: 100%;
  font-size: 0;
  padding: 0px 20px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
/* line 655, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item .date-block:before {
  content: "";
  display: block;
  height: calc( 50% - 75px);
  border-right: 2px solid #fff;
  width: 60px;
  min-height: 15px;
}
/* line 664, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item .date-block:after {
  content: "";
  display: block;
  height: calc( 100% - 75px);
  border-right: 2px solid #fff;
  width: 60px;
  min-height: 15px;
}
/* line 673, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item .date {
  display: inline-block;
  font-size: 1rem;
  border: 1px solid #fff;
  background-color: #fff;
  border-radius: 100%;
  width: 75px;
  height: 75px;
  text-align: center;
  font-weight: bold;
  margin: 0 30px 0 20px;
}
/* line 685, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item .date .day {
  font-size: 2.25rem;
  line-height: 40px;
  margin-top: 7px;
  color: #00a0e9;
}
/* line 691, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item .date .month {
  font-size: 1.25rem;
  line-height: 20px;
  margin-top: -3px;
  color: #00a0e9;
}
/* line 698, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item .content-block {
  width: calc( 100% - 203px );
}
/* line 701, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item .content {
  display: inline-block;
  font-size: 1rem;
  vertical-align: top;
  width: 100%;
  color: #fff;
  padding-top: 15px;
  padding-bottom: 25px;
  border-bottom: 1px solid #fff;
}
/* line 711, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item .content .title {
  font-size: 1.375rem;
  font-weight: bold;
  margin-top: 3px;
  margin-bottom: 3px;
}
/* line 717, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item .content .desc {
  color: #fff;
}
/* line 725, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item:first-child .date-block:before {
  content: none;
}
/* line 729, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item:first-child .content {
  padding-top: 0;
}
/* line 735, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item:last-child .date-block:after {
  content: none;
}
/* line 739, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block .notice-list-content-item:last-child .content {
  border-bottom: 0;
}
/* line 745, ../sass/class-intro.scss */
.class-notice-wrapper .class-notice-block .notice-list-content-block.active {
  /*display: block;*/
  height: auto;
  padding: 25px 0px 15px 235px;
}

@media (max-width: 991px) {
  /* line 757, ../sass/class-intro.scss */
  .class-notice-wrapper .class-notice-block .last-notice-block .notice-img {
    background-color: #fff;
    border-bottom: 5px solid #00a0e9;
    width: 100%;
  }
  /* line 762, ../sass/class-intro.scss */
  .class-notice-wrapper .class-notice-block .last-notice-block .notice-img img {
    background-color: #fff;
    width: 155px;
  }
  /* line 767, ../sass/class-intro.scss */
  .class-notice-wrapper .class-notice-block .last-notice-block .notice-content {
    width: 100%;
    padding: 20px 20px 20px 20px;
  }
  /* line 772, ../sass/class-intro.scss */
  .class-notice-wrapper .class-notice-block .last-notice-block .notice-content .open-link {
    margin-bottom: -15px;
  }
  /* line 776, ../sass/class-intro.scss */
  .class-notice-wrapper .class-notice-block .notice-list-content-block.active {
    padding: 25px 0px 15px 0px;
  }
}
/* line 784, ../sass/class-intro.scss */
.class-quick-menu-wrapper .class-quick-menu-block {
  padding: 3px 0;
}
/* line 786, ../sass/class-intro.scss */
.class-quick-menu-wrapper .class-quick-menu-block ul {
  font-size: 0;
}
/* line 788, ../sass/class-intro.scss */
.class-quick-menu-wrapper .class-quick-menu-block ul li a {
  display: block;
  color: #777;
  text-decoration: none;
  padding: 0 25px;
  border-right: 1px solid #ccc;
  line-height: 25px;
  font-size: 1.375rem;
  position: relative;
  font-weight: bold;
}
/* line 799, ../sass/class-intro.scss */
.class-quick-menu-wrapper .class-quick-menu-block ul li a.active {
  color: #00a2bd;
  font-weight: bold;
}
/* line 803, ../sass/class-intro.scss */
.class-quick-menu-wrapper .class-quick-menu-block ul li a.active:after {
  content: "";
  display: block;
  width: 100%;
  height: 9px;
  position: absolute;
  left: 0;
  bottom: -12px;
  background-image: url(../images/bk-header-sub-menu/member_meun_angle.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

/* line 819, ../sass/class-intro.scss */
.class-teacher-intro-wrapper {
  background-color: #efefef;
  margin-bottom: 20px;
}
/* line 822, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block {
  padding: 50px 0;
  text-align: center;
}
/* line 825, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .avatar {
  position: relative;
  width: 220px;
  height: 220px;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-radius: 100%;
  margin-bottom: 5px;
}
/* line 837, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-name {
  font-size: 1.375rem;
  font-weight: bold;
  color: #000;
  margin-bottom: 10px;
}
/* line 843, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star {
  margin-bottom: 30px;
}
/* line 845, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating {
  background: transparent url(../images/class_star_big.png) no-repeat 0 0px;
  display: block;
  width: 124px;
  height: 21px;
  vertical-align: middle;
  background-size: 100% auto;
  margin: 0 auto;
}
/* line 855, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-0 {
  background-position: 0 -210px;
}
/* line 859, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-1 {
  background-position: 0 -189px;
}
/* line 863, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-2 {
  background-position: 0 -168px;
}
/* line 867, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-3 {
  background-position: 0 -147px;
}
/* line 871, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-4 {
  background-position: 0 -126px;
}
/* line 875, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-5 {
  background-position: 0 -105px;
}
/* line 879, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-6 {
  background-position: 0 -84px;
}
/* line 883, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-7 {
  background-position: 0 -63px;
}
/* line 887, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-8 {
  background-position: 0 -42px;
}
/* line 891, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-9 {
  background-position: 0 -21px;
}
/* line 895, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-star .rating.rate-10 {
  background-position: 0 0px;
}
/* line 900, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-desc {
  font-size: 1.25rem;
  color: #666;
  margin-bottom: 35px;
}
/* line 906, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-other-class-title {
  position: relative;
  margin-bottom: 40px;
}
/* line 909, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-other-class-title .title {
  font-size: 1.5rem;
  font-weight: bold;
  color: #666;
  display: inline-block;
  padding: 0 15px;
  z-index: 2;
  background: #efefef;
}
/* line 919, ../sass/class-intro.scss */
.class-teacher-intro-wrapper .class-teacher-intro-block .teacher-other-class-title:after {
  content: "";
  display: block;
  border-bottom: 1px solid #ccc;
  width: 100%;
  z-index: 1;
  margin-top: -18px;
}

/* line 932, ../sass/class-intro.scss */
.class-intro-wrapper .class-intro-block {
  padding: 50px 0;
}
/* line 934, ../sass/class-intro.scss */
.class-intro-wrapper .class-intro-block .title {
  border-bottom: 1px solid #00a1be;
  margin-bottom: 20px;
}
/* line 937, ../sass/class-intro.scss */
.class-intro-wrapper .class-intro-block .title span {
  color: #00a1be;
  font-size: 1.5rem;
  font-weight: bold;
  border-bottom: 3px solid #00a1be;
  padding-right: 40px;
}
/* line 945, ../sass/class-intro.scss */
.class-intro-wrapper .class-intro-block .desc {
  font-size: 1.25rem;
  color: #666;
}
/* line 949, ../sass/class-intro.scss */
.class-intro-wrapper .class-intro-block .desc a {
  color: #3f91c8;
  text-decoration: underline;
}
/* line 954, ../sass/class-intro.scss */
.class-intro-wrapper .class-intro-block .desc a:hover {
  color: #3f91c8;
  text-decoration: underline;
}

/* line 963, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
/* line 968, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline {
  display: inline-block;
  width: calc( 50% - 5px );
  margin-right: 5px;
}
/* line 972, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .title {
  background-color: #00a1be;
  color: #fff;
  text-align: center;
  font-size: 1.5rem;
  font-weight: bold;
  padding: 2px;
}
/* line 980, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block {
  background-color: #f7f8f8;
  height: calc( 100% - 40px );
  padding: 35px 80px;
  counter-reset: slides-num;
}
/* line 985, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item {
  counter-increment: slides-num;
  position: relative;
  border: 1px solid #00aec9;
  background-color: #fff;
  padding: 5px;
  font-size: 1.25rem;
  color: #666;
  text-align: center;
  border-radius: 22px;
  margin-bottom: 40px;
}
/* line 996, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:before {
  content: counter(slides-num);
  display: block;
  width: 49px;
  height: 49px;
  line-height: 49px;
  border-radius: 100%;
  background-color: #008bbe;
  position: absolute;
  color: #fff;
  left: -21px;
  top: -4px;
  font-size: 1.25rem;
  font-weight: bold;
}
/* line 1011, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:after {
  content: "";
  display: block;
  background-image: url(../images/course-outline/Course_list_4.png);
  background-repeat: no-repeat;
  width: 15px;
  height: 15px;
  position: absolute;
  left: -5px;
  bottom: -30px;
  background-size: 100% auto;
}
/* line 1026, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:nth-child(1):before {
  background-color: #00aec9;
}
/* line 1029, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:nth-child(1):after {
  background-image: url(../images/course-outline/Course_list_1.png);
}
/* line 1035, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:nth-child(2):before {
  background-color: #00a9c4;
}
/* line 1038, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:nth-child(2):after {
  background-image: url(../images/course-outline/Course_list_2.png);
}
/* line 1044, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:nth-child(3):before {
  background-color: #00a1be;
}
/* line 1047, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:nth-child(3):after {
  background-image: url(../images/course-outline/Course_list_3.png);
}
/* line 1053, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:nth-child(4):before {
  background-color: #0097be;
}
/* line 1058, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:last-child {
  margin-bottom: 0;
}
/* line 1060, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .course-outline .content-block .item:last-child:after {
  content: normal;
  height: 0;
  width: 0;
}
/* line 1068, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .class-can-learn {
  display: inline-block;
  width: calc( 50% - 5px );
  margin-left: 5px;
}
/* line 1072, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .class-can-learn .title {
  background-color: #00a1be;
  color: #fff;
  text-align: center;
  font-size: 1.5rem;
  font-weight: bold;
  padding: 2px;
}
/* line 1080, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .class-can-learn .content-block {
  background-color: #f7f8f8;
  height: calc( 100% - 40px );
  padding: 30px 80px;
}
/* line 1084, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .class-can-learn .content-block .item {
  font-size: 1.25rem;
  color: #666;
  padding-left: 40px;
  position: relative;
  margin-bottom: 10px;
}
/* line 1090, ../sass/class-intro.scss */
.class-course-outline-wrapper .class-course-outline-block .class-can-learn .content-block .item:before {
  content: "";
  display: block;
  background-image: url(../images/classintro_button_5.png);
  width: 24px;
  height: 21px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  position: absolute;
  left: 0;
  top: 6px;
}
@media (max-width: 991px) {
  /* line 1108, ../sass/class-intro.scss */
  .class-course-outline-wrapper .class-course-outline-block .course-outline {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }
  /* line 1113, ../sass/class-intro.scss */
  .class-course-outline-wrapper .class-course-outline-block .class-can-learn {
    width: 100%;
    margin-left: 0;
  }
}

/* line 1121, ../sass/class-intro.scss */
.class-discuss-wrapper {
  background-color: #efefef;
}
/* line 1123, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block {
  padding: 50px 0;
}
/* line 1126, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title {
  font-size: 0;
}
/* line 1128, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title .number_of_people {
  color: #006a97;
  font-size: 1.5rem;
  padding-left: 30px;
  display: inline-block;
  width: calc( 100% - 450px );
}
/* line 1134, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title .number_of_people img {
  width: 45px;
  vertical-align: top;
}
/* line 1139, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title .search {
  display: inline-block;
  vertical-align: top;
  width: 450px;
  text-align: right;
}
/* line 1144, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title .search .input-block {
  display: inline-block;
  vertical-align: top;
  position: relative;
}
/* line 1148, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title .search .input-block input[type="text"] {
  height: 32px;
  font-size: 14px;
  padding: 0px 30px 0px 10px;
  width: 300px;
  border: 1px solid #00acbe;
}
/* line 1156, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title .search .input-block button {
  position: absolute;
  right: 0px;
  top: 0px;
  background: rgba(255, 255, 255, 0);
  border: 0;
  font-size: 0;
  height: 32px;
  width: 32px;
}
/* line 1166, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title .search .input-block button img {
  width: 14px;
}
/* line 1172, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title .search .input-select {
  display: inline-block;
  vertical-align: top;
  font-size: 14px;
  text-align: right;
  margin-left: 5px;
  text-align: left;
}
/* line 1180, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .title .search .input-select .type2-select-selected {
  min-width: 104px;
}
/* line 1187, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item {
  border-top: 3px solid #00a1be;
  background-color: #fff;
  padding: 30px 55px;
  border-radius: 0 0 5px 5px;
  box-shadow: 2px 2px 6px #666666;
  margin-top: 10px;
  margin-bottom: 20px;
}
/* line 1195, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .main-message {
  margin-bottom: 15px;
}
/* line 1198, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .user-intro {
  position: relative;
  font-size: 0;
  margin-bottom: 10px;
}
/* line 1202, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .user-intro .avatar {
  height: 90px;
  width: 90px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 100%;
  display: inline-block;
  margin-right: 10px;
}
/* line 1212, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .user-intro .words-info {
  display: inline-block;
  width: calc( 100% - 220px );
}
/* line 1215, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .user-intro .words-info .name {
  font-size: 1.125rem;
}
/* line 1218, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .user-intro .words-info .datetime {
  font-size: 0.9375rem;
  color: #666;
}
/* line 1223, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .user-intro .tag-block {
  display: inline-block;
  width: 120px;
}
/* line 1227, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .user-intro .tag {
  display: inline-block;
  background-color: #00acf3;
  color: #fff;
  padding: 0px 5px;
  font-weight: bold;
  position: relative;
  font-size: 0.9375rem;
  line-height: 24px;
}
/* line 1237, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .user-intro .tag:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 12px 0 12px 10px;
  border-color: transparent transparent transparent #00aaf3;
  position: absolute;
  right: -10px;
  top: 0;
}
/* line 1253, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .sub-message {
  padding: 15px 0 15px 100px;
}
/* line 1256, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .sub-message .avatar {
  height: 70px;
  width: 70px;
}
/* line 1261, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .sub-message .words-info {
  display: inline-block;
  width: calc( 100% - 80px );
}
/* line 1264, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .sub-message .words-info .name {
  font-size: 0.9375rem;
}
/* line 1267, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .sub-message .words-info .datetime {
  font-size: 0.75rem;
}
/* line 1275, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .message {
  color: #595757;
  margin-bottom: 5px;
}
/* line 1281, ../sass/class-intro.scss */
.class-discuss-wrapper .class-discuss-block .discuss-item .send-message-block input[type="text"] {
  width: 100%;
  padding: 3px 15px;
  background-color: #f7f8f8;
  border: 1px solid #dcdddd;
}

@media (max-width: 991px) {
  /* line 1293, ../sass/class-intro.scss */
  .class-discuss-wrapper .class-discuss-block .title .number_of_people {
    width: 100%;
    padding-left: 0;
    margin-bottom: 5px;
  }

  /* line 1298, ../sass/class-intro.scss */
  .class-discuss-wrapper .class-discuss-block .title .search {
    width: 100%;
    text-align: left;
  }

  /* line 1302, ../sass/class-intro.scss */
  .class-discuss-wrapper .class-discuss-block .discuss-item .sub-message {
    padding-left: 0;
  }
}