/* 关联story#1733需求，因为活动后台没有对图片做规格限制，所以此做法针对活动前台页面图片样式做特殊处理 */



.info-index-img {
  display: block;
  object-fit: contain;
  background: #FFFFFF;
  height: 410px;
  margin: 0 auto;
}


@media only screen and (max-width: 1668px) {
  .info-index-img {
    height: 356px;
  }
}

@media only screen and (max-width: 1536px) {
  .info-index-img {
    height: 322px;
  }
}

@media only screen and (max-width: 1476px) {
  .info-index-img {
    height: 311px;
  }
}

@media only screen and (max-width: 1321px) {
  .info-index-img {
    height: 280px;
  }
}

@media only screen and (max-width: 1237px) {
  .info-index-img {
    height: 262px;
  }
}

@media only screen and (max-width: 1227px) {
  .info-index-img {
    height: 258px;
  }
}

@media only screen and (max-width: 1200px) {
  .info-index-img {
    height: 241px;
  }
}

@media only screen and (max-width: 1080px) {
  .info-index-img {
    height: 227px;
  }
}

@media only screen and (max-width: 1024px) {
  .info-index-img {
    height: 193px;
  }
}

/* 首页-我们的服务 */
.content-module {
  background: #fff;
}

.must-join {
  /* padding: 50px 60px; */
  padding: 50px 6.7%;
}

.max-content {
  max-width: 1920px;
  margin: 0 auto;
  width: auto;
}

.title-line {
  width: 40px;
  margin: 14px auto 0;
}

.must-join>h6 {
  color: #111;
  padding-bottom: 0;
}

.flow-hidden {
  overflow: hidden;
}

.course-info {
  background: #FFFFFF;
  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: 100%;
}

.course-content {
  margin-left: 120px;
}

.course-info .course-desc {
  width: 640px;
  letter-spacing: 2px;
  color: #444444;
}

.btn-hover {
  padding: 0;
  width: 280px;
  height: 44px;
  font-size: 14px;
  line-height: 44px;
}

.bachelor {
  background-image: url('../../img/common/course-bg-index.png');
}


@media (min-width: 1024px) {
  .must-join {
    background: #fff;
    text-align: center;
  }
  .swiper-title>h1 {
    font-size: 38px;
  }
  .must-join>h1 {
    font-size: 30px;
    color: #222222;
    letter-spacing: 4px;
  }
  .title-line {
    width: 64px;
  }
  .must-join>h6 {
    margin-top: 30px;
    font-size: 22px;
    color: rgba(0, 0, 0, 0.85);
    padding: 0 8.85% 20px;
    line-height: 40px;
    font-weight: 500;
  }
  .degree-course {
    margin-top: 30px;
    text-align: left;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .large-img {
    transition: .75s;
    width: 100%;
    height: 100%;
  }
  .bachelor {
    background-image: url('../../img/common/course-bg-index.png');
  }
  .course-content {
    margin: 13.04% 0 12px 13.335%;
  }
  .course-info .line {
    width: 75px;
    height: 1px;
    background: #CDCDCD;
    margin: 16px 0;
  }
  .course-info .course-desc {
    font-size: 18px;
    font-weight: normal;
  }
  .btn-hover {
    background-image: url('../../img/common/more-hover-bg.png');
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 0 100%;
    transition: background-size .3s;
  }
  .btn-hover:hover {
    background-size: 102% 102%;
    color: #fff;
  }
  .to-learn {
    width: 29.16%;
    margin-top: 40px;
    color: #156BBC;
    line-height: 20px;
    padding: 12px 0;
    border: 1px solid #156BBC;
    text-align: center;
  }
  .course-info h2 {
    font-size: 24px;
    color: #222222;
    letter-spacing: 2px;
  }
}

@media (min-width: 1440px) {
  .swiper-title>h1 {
    font-size: 57px;
  }
}

@media (min-width: 1920px) {
  .swiper-title>h1 {
    font-size: 76px;
  }
}

@media only screen and (max-width: 1680px) {
  .course-info .course-desc {
      width: 480px;
      font-size: 16px;
  }

  .course-info h2 {
      font-size: 20px;
  }

  .activity-desc .line {
      margin: 16px 0;
  }

  .must-join {
      padding: 40px;
  }

  .must-join>h6 {
      font-size: 18px;
      line-height: 31px;
      margin-top: 24px;
  }

  .btn-hover {
      padding: 0;
      width: 206px;
      height: 32px;
      font-size: 12px;
      line-height: 32px;
  }
}

@media only screen and (max-width: 1440px) {
  .swiper-title>h1 {
      font-size: 58px;
  }

  .swiper-title>h3 {
      font-size: 30px;
  }

  .degree-course {
      margin: 24px auto;
  }

  .course-content {
      margin-left: 100px;
  }

  .course-info h2 {
      font-size: 20px;
  }

  .must-join {
      padding: 40px;
  }

  .must-join>h6 {
      font-size: 18px;
      line-height: 31px;
      margin-top: 24px;
  }

}

@media only screen and (max-width: 1280px) {
  .course-info .course-desc {
      width: 430px;
      font-size: 14px;
  }

  .degree-course {
      margin: 20px auto;
  }

  .course-content {
      margin-left: 90px;
  }

  .course-info h2 {
      font-size: 18px;
  }

  .must-join {
      padding: 40px 30px;
  }

  .must-join>h6 {
      font-size: 14px;
      line-height: 28px;
  }

  .activity-desc .line {
      margin: 12px 0;
  }
}

@media only screen and (max-width: 1024px) {
  .must-join {
      padding: 40px 16px;
  }

  .must-join>h1 {
    font-size: 22px;
    color: #222222;
    letter-spacing: 4px;
    text-align: center;
  }

  .to-learn {
    width: 90%;
    margin: 20px auto 0;
    color: #156BBC;
    line-height: 20px;
    padding: 12px 0;
    border: 1px solid #156BBC;
    text-align: center;
  }

  .btn-hover {
      padding: 0;
      width: 280px;
      height: 44px;
      font-size: 16px;
      line-height: 44px;
  }

  .course-info .course-desc {
      width: 100%;
      font-size: 14px;
      font-weight: normal;
      line-height: 26px;
  }

  .course-content {
      padding: 20px 14px 32px;
      margin: 0;
      color: #222222;
      letter-spacing: 2px;
  }

  .mobile-activity-desc {
      padding: 20px 16px;
  }

  .mobile-activity-desc h2 {
      font-weight: normal;
  }

  .must-join>h6 {
      font-size: 18px;
  }

  .course-info h2 {
      font-weight: normal;
      font-size: 18px;
      font-weight: bold;
  }

  .course-info .line {
    width: 75px;
    height: 1px;
    background: #CDCDCD;
    margin: 16px 0;
  }
}