img {
  max-width: 100%;
  max-height: 100%;
  object-fit: cover; }

.common_bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0; }

.common_title {
  text-align: center; }
  .common_title .p1 {
    color: #000;
    font-style: normal;
    font-weight: bold;
    line-height: 2.0833333333vw;
    /* 100% */ }
  .common_title .line {
    width: 5.9895833333vw;
    height: 1px;
    background: #000000;
    margin: 1.4583333333vw auto 2.0833333333vw; }
  .common_title .text {
    color: #666;
    font-style: normal;
    font-weight: 400;
    line-height: 180%;
    /* 32.4px */ }

.common_back {
  display: flex;
  width: 8.3333333333vw;
  height: 2.9166666667vw;
  border-radius: 1.6666666667vw;
  border: 1px solid #0F927B;
  background: #FFF;
  justify-content: center;
  align-items: center;
  transition: .6s ease; }
  .common_back:hover {
    background: #0F927B; }
    .common_back:hover p {
      color: #fff; }
    .common_back:hover svg path:nth-child(1) {
      fill: #fff; }
  .common_back p {
    text-transform: capitalize;
    transition: .6s ease; }
  .common_back svg {
    margin-left: 1.3020833333vw; }
    .common_back svg path {
      transition: all 600ms; }

.section1 {
  overflow: hidden;
  padding: 5.2083333333vw 0 8.3854166667vw 0; }
  .section1 .content {
    margin: 2.8645833333vw 0 0 0; }
    .section1 .content .coSwiper {
      width: 145vw;
      position: relative;
      left: 50%;
      transform: translateX(-50%); }
      .section1 .content .coSwiper .swiper-slide.swiper-slide-active .item .l .svg {
        opacity: .7; }
      .section1 .content .coSwiper .swiper-slide .item {
        height: 25vw;
        display: flex; }
        .section1 .content .coSwiper .swiper-slide .item .l {
          width: 18.2291666667vw;
          padding: 5.2083333333vw 2.0833333333vw;
          position: relative;
          z-index: 1;
          background: #F7F7F7; }
          .section1 .content .coSwiper .swiper-slide .item .l .svg {
            width: 26.9791666667vw;
            max-width: unset;
            max-height: unset;
            position: absolute;
            bottom: 0;
            left: 0;
            z-index: -1;
            opacity: 0;
            transition: .6s ease; }
          .section1 .content .coSwiper .swiper-slide .item .l .year {
            color: #000;
            font-style: normal;
            font-weight: 600;
            line-height: normal; }
          .section1 .content .coSwiper .swiper-slide .item .l .line {
            width: 3.125vw;
            height: 0.1041666667vw;
            background: #0F927B;
            margin: 0.625vw 0 3.125vw 0; }
          .section1 .content .coSwiper .swiper-slide .item .l .p1 {
            color: #000;
            font-style: normal;
            font-weight: 400;
            line-height: normal; }
        .section1 .content .coSwiper .swiper-slide .item .img {
          width: 30.1041666667vw;
          flex: 1;
          height: 100%;
          position: relative;
          z-index: 2;
          overflow: hidden; }
          .section1 .content .coSwiper .swiper-slide .item .img:hover img {
            transform: scale(1.05); }
          .section1 .content .coSwiper .swiper-slide .item .img img {
            width: 100%;
            height: 100%;
            transition: .6s ease; }
  .section1 .yearSwiper {
    padding: 0 4.1666666667vw;
    margin: 9.375vw 0 0 0;
    position: relative; }
    .section1 .yearSwiper:after {
      content: '';
      position: absolute;
      width: 100vw;
      left: 50%;
      transform: translateX(-50%);
      top: 0.8854166667vw;
      height: 1px;
      border-bottom: 1px dashed rgba(0, 0, 0, 0.2); }
    .section1 .yearSwiper .swiper {
      width: 100%; }
      .section1 .yearSwiper .swiper .swiper-slide {
        text-align: center;
        cursor: pointer;
        position: relative;
        left: -6.25vw; }
        .section1 .yearSwiper .swiper .swiper-slide.swiper-slide-active .circle {
          background: #0F927B; }
        .section1 .yearSwiper .swiper .swiper-slide .circle {
          width: 1.875vw;
          height: 1.875vw;
          background: #D9D9D9;
          border-radius: 50%;
          margin: 0 auto 1.0416666667vw;
          transition: .6s ease; }
        .section1 .yearSwiper .swiper .swiper-slide p {
          color: #000;
          font-style: normal;
          font-weight: 600;
          line-height: normal; }

.section2 {
  padding: 4.1666666667vw;
  background: #F7F7F7; }
  .section2 .content {
    margin: 3.125vw 0 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between; }
    .section2 .content .img {
      width: 57.7083333333vw;
      height: 32.2916666667vw;
      overflow: hidden; }
      .section2 .content .img:hover img {
        transform: scale(1.05); }
      .section2 .content .img img {
        width: 100%;
        height: 100%;
        transition: 1s; }
    .section2 .content .r {
      width: 29.7916666667vw; }
      .section2 .content .r .time {
        color: #000;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        margin: 0 0 1.0416666667vw; }
      .section2 .content .r .p1 {
        color: #333;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        margin: 0 0 2.0833333333vw; }
      .section2 .content .r .p2 {
        color: #000;
        font-style: normal;
        font-weight: 400;
        line-height: 180%;
        /* 28.8px */
        margin: 0 0 9.375vw; }
  .section2 .content2 {
    margin: 2.0833333333vw 0 0 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.0833333333vw; }
    .section2 .content2 .item {
      width: 100%;
      background: #fff;
      padding: 1.0416666667vw;
      display: block;
      transition: .6s ease; }
      .section2 .content2 .item:hover {
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); }
        .section2 .content2 .item:hover img {
          transform: scale(1.05); }
      .section2 .content2 .item .img {
        width: 100%;
        height: 16.1458333333vw;
        overflow: hidden; }
        .section2 .content2 .item .img img {
          width: 100%;
          height: 100%;
          transition: .6s ease; }
      .section2 .content2 .item .text {
        margin: 1.6666666667vw 0 0; }
        .section2 .content2 .item .text .time {
          color: #666;
          font-style: normal;
          font-weight: 400;
          line-height: normal; }
        .section2 .content2 .item .text .p1 {
          overflow: hidden;
          color: #000;
          text-overflow: ellipsis;
          font-style: normal;
          font-weight: 600;
          line-height: normal;
          margin: 0.4166666667vw 0 0.8333333333vw; }
        .section2 .content2 .item .text .p2 {
          overflow: hidden;
          color: #000;
          text-overflow: ellipsis;
          font-style: normal;
          font-weight: 400;
          line-height: 23.506px;
          /* 168.75% */
          margin: 0 0 2.0833333333vw; }
  .section2 .pager {
    margin: 2.0833333333vw 0 0 0;
    display: flex;
    justify-content: center;
    align-items: center; }
    .section2 .pager a {
      margin: 0 0.3125vw; }
      .section2 .pager a svg {
        width: 1.25vw;
        display: block;
        height: auto; }
    .section2 .pager .nums {
      display: flex; }
      .section2 .pager .nums a {
        padding: 0 0.625vw;
        position: relative; }
        .section2 .pager .nums a::after {
          content: '';
          display: block;
          position: absolute;
          width: 0;
          height: 0.1041666667vw;
          left: 0;
          background: #0F927B; }
        .section2 .pager .nums a.on::after {
          width: 100%; }

@media screen and (max-width: 1024px) {
  .common_title .p1 {
    line-height: unset; }
  .common_title .text br {
    display: none; }
  .common_title .line {
    width: 70px;
    margin: 15px auto 25px; }

  .common_back {
    width: 140px;
    height: 45px;
    border-radius: 32px; }
    .common_back svg {
      margin-left: 12px;
      width: 10px; }

  .section1 {
    padding: 50px 5%; }
    .section1 .content {
      margin: 50px 0 0 0; }
      .section1 .content .coSwiper {
        width: 100%;
        left: 0;
        transform: none; }
        .section1 .content .coSwiper .swiper-slide .item {
          flex-direction: column-reverse;
          height: auto;
          transform: scale(1) !important; }
          .section1 .content .coSwiper .swiper-slide .item .img {
            width: 100%;
            height: 280px; }
          .section1 .content .coSwiper .swiper-slide .item .l {
            width: 100%;
            height: auto;
            padding: 30px 15px; }
            .section1 .content .coSwiper .swiper-slide .item .l .line {
              margin: 10px 0 20px;
              width: 35px;
              height: 2px; }
            .section1 .content .coSwiper .swiper-slide .item .l .svg {
              display: none; }
    .section1 .yearSwiper {
      padding: 0;
      margin: 30px 0 0 0; }
      .section1 .yearSwiper:after {
        top: 5px; }
      .section1 .yearSwiper .swiper .swiper-slide {
        left: 0; }
        .section1 .yearSwiper .swiper .swiper-slide .circle {
          width: 12px;
          height: 12px;
          margin: 0 auto 12px; }

  .section2 {
    padding: 50px 5%; }
    .section2 .content {
      flex-direction: column; }
      .section2 .content .img {
        width: 100%;
        height: auto; }
      .section2 .content .r {
        margin: 25px 0 0 0;
        width: 100%; }
        .section2 .content .r .time {
          margin: 0 0 10px; }
        .section2 .content .r .p1 {
          margin: 0 0 15px; }
        .section2 .content .r .p2 {
          margin: 0 0 20px; }
    .section2 .content2 {
      grid-template-columns: repeat(1, 1fr);
      gap: 25px 0;
      margin: 25px 0 0 0; }
      .section2 .content2 .item {
        padding: 10px; }
        .section2 .content2 .item .img {
          height: auto; }
        .section2 .content2 .item .text {
          margin: 15px 0 0 0; }
          .section2 .content2 .item .text .time {
            margin: 0 0 10px; }
          .section2 .content2 .item .text .p1 {
            margin: 0 0 15px; }
          .section2 .content2 .item .text .p2 {
            margin: 0 0 15px; }
    .section2 .pager {
      margin: 20px 0 50px 0; }
      .section2 .pager a {
        margin: 0 6px; }
        .section2 .pager a svg {
          width: 24px; } }

/*# sourceMappingURL=course.css.map */
