@charset "utf-8";
/* Scss Document */
@import url("https://www.cavenetomi.com/__xh__/gix.tsinghua.edu.cn/dfiles/18198/assets/css/base.jpg.css");
/* Scss Document */
@import url("https://www.cavenetomi.com/__xh__/gix.tsinghua.edu.cn/dfiles/18198/assets/font/stylesheet.jpg.css");
@import url("https://www.cavenetomi.com/__xh__/gix.tsinghua.edu.cn/dfiles/18198/assets/font/font.jpg.css");
.content .topimgslider .wrapper {
  position: relative;
  background: #5d1f98 no-repeat center center;
  background-size: cover;}
.content .topimgslider .rect {
  position: absolute;}
.content .topimgslider .img {
  display: block;}
  .content .topimgslider .img img {
    width: 100%;}
.content .topimgslider .mainWrap {
  position: relative;
  height: calc(100vh - 128px - 150px);
  min-height: 350px;}
  @media screen and (max-width: 1000px) {
    .content .topimgslider .mainWrap {
      height: calc(100vw * 0.469);
      min-height: auto;} }
.content .topimgslider .txt {
  position: absolute;
  bottom: 90px;
  left: 0;
  width: 50%;}
  @media screen and (max-width: 1600px) {
    .content .topimgslider .txt {
      left: 90px;
      width: 45%;} }
  @media screen and (max-width: 1000px) {
    .content .topimgslider .txt {
      width: 100%;
      top: 0;
      right: 0;
      bottom: 30px;
      left: 0;} }
  .content .topimgslider .txt h2 {
    font-size: 44px;
    font-weight: bold;
    line-height: 1.2em;
    color: #fff;
    z-index: 1;
    text-shadow: 2px 2px 0 #000;}
    @media screen and (max-width: 1600px) {
      .content .topimgslider .txt h2 {
        font-size: 38px;} }
    @media screen and (max-width: 1280px) {
      .content .topimgslider .txt h2 {
        font-size: 30px;} }
    @media screen and (max-width: 1000px) {
      .content .topimgslider .txt h2 {
        font-size: 20px;
        position: absolute;
        bottom: 0;
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: center;} }
    @media screen and (max-width: 400px) {
      .content .topimgslider .txt h2 {
        font-size: 18px;} }
  .content .topimgslider .txt p {
    font-size: 16px;
    color: #fff;
    line-height: 1.5em;
    padding: 1em 0 2em 0;
    text-shadow: 1px 1px 0 #000;}
    @media screen and (max-width: 1280px) {
      .content .topimgslider .txt p {
        font-size: 14px;} }
    @media screen and (max-width: 1000px) {
      .content .topimgslider .txt p {
        display: none;} }
  .content .topimgslider .txt .more {
    font-size: 16px;
    color: #fff;
    background: rgba(255, 255, 255, 0.2);
    display: inline-block;
    padding: 15px 30px;
    transition: all .2s ease-out;}
    @media screen and (max-width: 1280px) {
      .content .topimgslider .txt .more {
        font-size: 12px;
        padding: 10px 30px;} }
    @media screen and (max-width: 1000px) {
      .content .topimgslider .txt .more {
        display: none;} }
  .content .topimgslider .txt:hover .more {
    background: #ffc000;
    color: #000;}
.content .topimgslider .pgdot {
  text-align: center;
  position: absolute;
  z-index: 10;
  bottom: 60px;}
  .content .topimgslider .pgdot .swiper-pagination-bullet {
    background: #fff;
    opacity: 0.5;}
  .content .topimgslider .pgdot .swiper-pagination-bullet-active {
    background: #fff;
    opacity: 1;}
@media screen and (max-width: 1000px) {
  .content .topimgslider .sliderpager {
    display: none;} }
.content .topimgslider .sliderpager .prev, .content .topimgslider .sliderpager .next {
  position: absolute;
  left: 30px;
  top: 50%;
  cursor: pointer;
  z-index: 1;
  height: 68px;
  width: 68px;
  background: rgba(255, 255, 255, 0.3);
  color: #5d1f98;
  font-size: 30px;
  margin-top: -34px;
  line-height: 68px;
  text-align: center;
  border-radius: 50%;}
  .content .topimgslider .sliderpager .prev:hover, .content .topimgslider .sliderpager .next:hover {
    background: rgba(255, 255, 255, 0.6);}
.content .topimgslider .sliderpager .next {
  left: auto;
  right: 30px;}
  @media screen and (max-width: 1600px) {
    .content .topimgslider .sliderpager .next {
      right: 400px;} }
  @media screen and (max-width: 1400px) {
    .content .topimgslider .sliderpager .next {
      right: 350px;} }
.content .topimgslider .rect_1 {
  position: absolute;
  bottom: 0;
  height: 25px;
  background: #ffc000;
  width: 50%;
  transform: skewX(-47deg);
  z-index: 1;
  padding-left: 100px;
  margin-left: -100px;}
  @media screen and (max-width: 1000px) {
    .content .topimgslider .rect_1 {
      width: 90%;
      height: 10px;} }
.content .topimgslider .rect_2 {
  position: absolute;
  right: 0;
  bottom: 0;
  height: 400px;
  background: #ffc000;
  width: 400px;
  transform: skewX(-47deg);
  z-index: 1;
  margin-right: -330px;
  opacity: 0.3;}
  @media screen and (max-width: 1000px) {
    .content .topimgslider .rect_2 {
      display: none;} }
.content .section_1 {
  height: 150px;
  background: #efefef url("https://www.cavenetomi.com/__xh__/gix.tsinghua.edu.cn/dfiles/18198/assets/images/sect_1.jpg") no-repeat center center;}
  @media screen and (max-width: 1000px) {
    .content .section_1 {
      height: auto;
      background-position: 56% 0;
      background-size: 2800px auto;} }
  .content .section_1 .mainWrap {
    display: table;
    height: 100%;}
    @media screen and (max-width: 1000px) {
      .content .section_1 .mainWrap {
        display: block;
        margin: 0;} }
  .content .section_1 .logotxt {
    width: 150px;
    display: table-cell;
    height: 100%;
    vertical-align: middle;
    padding-right: 60px;}
    .content .section_1 .logotxt img {
      width: 100%;}
    @media screen and (max-width: 1000px) {
      .content .section_1 .logotxt {
        display: none;} }
  .content .section_1 .intro {
    display: table-cell;
    height: 100%;
    vertical-align: middle;
    font-size: 16px;
    color: #5d1f98;
    padding-right: 400px;}
    @media screen and (max-width: 1280px) {
      .content .section_1 .intro {
        padding-right: 350px;
        font-size: 14px;} }
    @media screen and (max-width: 1000px) {
      .content .section_1 .intro {
        display: block;
        padding: 25px;} }
  .content .section_1 .bgwrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;}
    @media screen and (max-width: 1000px) {
      .content .section_1 .bgwrapper {
        display: none;} }
    .content .section_1 .bgwrapper img {
      width: 300px;
      opacity: 0.60;
      position: absolute;
      top: -88px;
      left: -50px;}
  .content .section_1 .joinus {
    position: absolute;
    right: 0;
    width: 300px;
    background: url("https://www.cavenetomi.com/__xh__/gix.tsinghua.edu.cn/dfiles/18198/assets/images/joinus.jpg") no-repeat top center;
    color: #fff;
    bottom: -30px;
    z-index: 1;}
    @media screen and (max-width: 1000px) {
      .content .section_1 .joinus {
        position: relative;
        width: 100%;
        background-size: cover;
        bottom: 0;
        margin-top: 40px;} }
    .content .section_1 .joinus img {
      width: 100px;
      position: absolute;
      left: 50%;
      top: 0;
      margin-left: -50px;
      margin-top: -43px;}
    .content .section_1 .joinus .title {
      font-size: 74px;
      line-height: 1.2em;
      text-align: center;
      font-weight: 100;}
      .content .section_1 .joinus .title span {
        font-size: 24px;
        display: block;
        line-height: 1.2em;}
    .content .section_1 .joinus .apply {
      color: #EEDCB5;
      text-align: center;}
    .content .section_1 .joinus .wrapper {
      padding: 50px 60px 40px 60px;}
    .content .section_1 .joinus p {
      font-size: 12px;
      line-height: 1.75em;
      padding: 20px 0 20px 0;
      opacity: 0.8;}
    .content .section_1 .joinus a {
      font-size: 14px;
      display: block;
      text-align: center;
      color: #fff;
      padding: 5px 0;
      border: 1px solid rgba(255, 255, 255, 0.6);
      border-radius: 20px;
      transition: all 0.2s ease-out;
      margin: 5px 0;}
      .content .section_1 .joinus a:hover {
        background: #fff;
        color: #5d1f98;}
    .content .section_1 .joinus .rectwrapper {
      position: absolute;
      z-index: -1;
      height: 100%;
      width: 100%;
      overflow: hidden;}
      @media screen and (max-width: 1000px) {
        .content .section_1 .joinus .rectwrapper {
          display: none;} }
      .content .section_1 .joinus .rectwrapper .rect_1 {
        position: absolute;
        background: #80009c;
        width: 100%;
        height: 300px;
        left: 0;
        bottom: 0;
        transform: skewX(-47deg);
        opacity: .65;
        z-index: 0;
        transform-origin: left bottom;}
      .content .section_1 .joinus .rectwrapper .rect_2 {
        position: absolute;
        background: #8400bd;
        width: 100%;
        height: 300px;
        right: 0;
        bottom: 0;
        transform: skewX(47deg);
        opacity: .65;
        z-index: 0;
        transform-origin: right bottom;}
.content .section_2 {
  padding: 80px 0 60px 0;}
  @media screen and (max-width: 1000px) {
    .content .section_2 {
      padding-top: 60px;} }
  .content .section_2 .col_1 {
    display: table-cell;
    padding-right: 95px;}
    @media screen and (max-width: 1280px) {
      .content .section_2 .col_1 {
        padding-right: 50px;} }
    @media screen and (max-width: 1000px) {
      .content .section_2 .col_1 {
        display: block;
        padding: 0;} }
    .content .section_2 .col_1 h2 {
      font-size: 36px;
      font-weight: bold;
      color: #5d1f98;
      line-height: 1em;
      padding-bottom: 80px;}
      .content .section_2 .col_1 h2 a {
        font-size: 12px;
        color: #999;
        float: right;}
      @media screen and (max-width: 1000px) {
        .content .section_2 .col_1 h2 {
          font-size: 28px;} }
  .content .section_2 .col_2 {
    width: 300px;
    display: table-cell;}
    @media screen and (max-width: 1000px) {
      .content .section_2 .col_2 {
        display: block;
        width: auto;} }
    .content .section_2 .col_2 h2 {
      font-size: 28px;
      font-weight: bold;
      color: #666666;
      line-height: 1em;
      padding-bottom: 40px;}
      .content .section_2 .col_2 h2 a {
        font-size: 12px;
        color: #999;
        float: right;}
      @media screen and (max-width: 1000px) {
        .content .section_2 .col_2 h2 {
          color: #5d1f98;} }
  .content .section_2 .imgnewslist ul {
    margin-left: -60px;}
    @media screen and (max-width: 1280px) {
      .content .section_2 .imgnewslist ul {
        margin-left: -40px;} }
  .content .section_2 .imgnewslist li {
    position: relative;
    width: 33.33%;
    float: left;}
    @media screen and (max-width: 700px) {
      .content .section_2 .imgnewslist li {
        width: 100%;} }
    .content .section_2 .imgnewslist li img {
      width: 100%;}
    .content .section_2 .imgnewslist li .imgwrapper {
      position: relative;}
    .content .section_2 .imgnewslist li div.img {
      position: relative;
      overflow: hidden;}
    .content .section_2 .imgnewslist li .time {
      position: absolute;
      left: -15px;
      bottom: 20px;
      font-size: 12px;
      color: #fff;
      background: #5d1f98;
      text-align: center;
      font-weight: 300;
      line-height: 1em;
      padding: 12px 20px 12px 20px;
      z-index: 1;
      text-transform: uppercase;
      overflow: hidden;}
      .content .section_2 .imgnewslist li .time b {
        font-size: 24px;
        font-weight: 300;
        line-height: 1em;
        padding-left: 5px;}
      .content .section_2 .imgnewslist li .time i {
        position: absolute;
        background: #ffc000;
        width: 50px;
        height: 50px;
        right: -34px;
        bottom: 0;
        transform: skewX(-47deg);
        z-index: 0;
        transform-origin: left bottom;}
    .content .section_2 .imgnewslist li a {
      display: block;
      margin-left: 60px;
      line-height: 1.75em;
      margin-bottom: 60px;
      position: relative;}
      @media screen and (max-width: 1280px) {
        .content .section_2 .imgnewslist li a {
          margin-left: 40px;} }
      .content .section_2 .imgnewslist li a h3 {
        font-size: 18px;
        color: #5d1f98;
        padding: 20px 0 10px 0;
        line-height: 1.5em;}
      .content .section_2 .imgnewslist li a p {
        color: #666;
        font-size: 13px;
        text-indent: 0;
        padding: 0;}
      .content .section_2 .imgnewslist li a:hover img {
        transform: scale(1.05);
        -ms-transform: scale(1.05);}
  .content .section_2 .newslist li {
    padding-bottom: 25px;
    margin-bottom: 25px;
    border-bottom: 1px solid #ddd;}
    .content .section_2 .newslist li a {
      display: table;}
    .content .section_2 .newslist li .time {
      color: #5d1f98;
      text-align: center;
      font-weight: 300;
      line-height: 1em;
      z-index: 1;
      text-transform: uppercase;
      display: table-cell;
      width: 38px;
      text-align: center;
      vertical-align: middle;}
      .content .section_2 .newslist li .time b {
        font-size: 24px;
        font-weight: 300;
        line-height: 1em;
        display: block;
        padding-top: 3px;}
    .content .section_2 .newslist li h3 {
      display: table-cell;
      font-size: 15px;
      padding-left: 15px;
      line-height: 1.5em;
      vertical-align: middle;}
.content .section_3 {
  padding: 130px 0;}
  @media screen and (max-width: 700px) {
    .content .section_3 {
      padding: 80px 0;} }
  .content .section_3 .bgwrapper {
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    top: 0;
    overflow: hidden;}
    .content .section_3 .bgwrapper .bg {
      position: absolute;
      background: #f0f0f0;
      width: 100%;
      top: 30px;
      bottom: 30px;}
    .content .section_3 .bgwrapper .bgimg {
      position: absolute;
      background: #edc13a;
      width: 50%;
      right: 0;
      height: 100%;
      transform: skewX(47deg);
      transform-origin: left top;
      overflow: hidden;
      padding-left: 200px;}
      .content .section_3 .bgwrapper .bgimg .img {
        background: #edc13a url("https://www.cavenetomi.com/__xh__/gix.tsinghua.edu.cn/dfiles/18198/assets/images/sect_3.jpg") no-repeat left center;
        background-size: cover;
        height: 100%;
        width: 100%;
        transform: skewX(-47deg);
        transform-origin: left top;}
    .content .section_3 .bgwrapper .rect {
      background: #5d1f98;
      transform: skewX(47deg);
      width: 150px;
      height: 150px;
      position: absolute;
      right: -25px;
      top: 0;
      transform-origin: left top;
      border-left: 25px solid #fff;}
  .content .section_3 .txtintro {
    width: 290px;
    display: table-cell;
    padding-right: 90px;}
    @media screen and (max-width: 700px) {
      .content .section_3 .txtintro {
        width: auto;
        display: block;
        padding: 0;
        padding-bottom: 40px;} }
    .content .section_3 .txtintro h2 {
      font-size: 36px;
      font-weight: bold;
      color: #5d1f98;
      line-height: 1em;
      padding-bottom: 20px;}
      @media screen and (max-width: 1000px) {
        .content .section_3 .txtintro h2 {
          font-size: 28px;} }
    .content .section_3 .txtintro p {
      font-size: 18px;
      line-height: 1.75em;
      padding-bottom: 60px;}
      @media screen and (max-width: 1000px) {
        .content .section_3 .txtintro p {
          font-size: 16px;
          padding-bottom: 10px;} }
    .content .section_3 .txtintro a {
      color: #888;
      border-bottom: 1px solid #888;
      font-size: 14px;}
      .content .section_3 .txtintro a:hover {
        border: 0;}
  .content .section_3 .newslist {
    width: 670px;
    display: table-cell;}
    @media screen and (max-width: 700px) {
      .content .section_3 .newslist {
        width: auto;
        display: block;
        padding: 0;} }
    .content .section_3 .newslist li {
      margin-bottom: 4px;
      background: #fff;
      margin-left: 8%;
      transition: all 0.3s ease-out;
      width: 92%;}
      @media screen and (max-width: 700px) {
        .content .section_3 .newslist li {
          margin-left: 0;
          width: 100%;} }
      .content .section_3 .newslist li .time {
        color: #5d1f98;
        text-align: center;
        font-weight: 300;
        line-height: 1em;
        z-index: 1;
        text-transform: uppercase;
        display: table-cell;
        width: 70px;
        vertical-align: middle;
        background: #dedede;}
        .content .section_3 .newslist li .time b {
          font-size: 24px;
          font-weight: 300;
          line-height: 1em;
          display: block;
          padding-top: 3px;}
      .content .section_3 .newslist li a {
        display: table;
        width: 100%;
        table-layout: fixed;}
      .content .section_3 .newslist li h3 {
        display: table-cell;
        font-size: 16px;
        line-height: 1.5em;
        padding: 28px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;}
      .content .section_3 .newslist li:first-child {
        margin-left: 0;}
      .content .section_3 .newslist li:hover {
        margin-left: 0;}
.content .section_4 {
  padding: 70px 0 200px 0;}
  @media screen and (max-width: 700px) {
    .content .section_4 {
      padding: 50px 0 180px 0;} }
  .content .section_4 .txtintro {
    width: 290px;
    display: table-cell;
    padding-right: 0px;
    float: left;
    padding-top: 80px;}
    @media screen and (max-width: 700px) {
      .content .section_4 .txtintro {
        width: auto;
        display: block;
        float: none;
        padding: 0;
        padding-bottom: 40px;} }
    .content .section_4 .txtintro h2 {
      font-size: 36px;
      font-weight: bold;
      color: #5d1f98;
      line-height: 1em;
      padding-bottom: 20px;}
      @media screen and (max-width: 1000px) {
        .content .section_4 .txtintro h2 {
          font-size: 28px;} }
    .content .section_4 .txtintro p {
      font-size: 18px;
      line-height: 1.75em;
      padding-bottom: 60px;}
      @media screen and (max-width: 1000px) {
        .content .section_4 .txtintro p {
          font-size: 16px;
          padding-bottom: 10px;} }
    .content .section_4 .txtintro a {
      color: #888;
      border-bottom: 1px solid #888;
      font-size: 14px;}
      .content .section_4 .txtintro a:hover {
        border: 0;}
  .content .section_4 .peoplelist {
    width: 50%;
    float: right;}
    @media screen and (max-width: 700px) {
      .content .section_4 .peoplelist {
        width: auto;
        float: none;
        margin: 0 25px;} }
    .content .section_4 .peoplelist .peoplewrapper {
      margin-left: -250px;
      position: relative;
      padding-top: 90px;}
      @media screen and (max-width: 1280px) {
        .content .section_4 .peoplelist .peoplewrapper {
          margin-left: -150px;} }
      @media screen and (max-width: 1000px) {
        .content .section_4 .peoplelist .peoplewrapper {
          margin-left: 0;} }
      @media screen and (max-width: 700px) {
        .content .section_4 .peoplelist .peoplewrapper {
          padding: 0;} }
      .content .section_4 .peoplelist .peoplewrapper .img {
        width: 320px;
        position: relative;
        overflow: hidden;}
        @media screen and (max-width: 700px) {
          .content .section_4 .peoplelist .peoplewrapper .img {
            width: 100%;} }
        .content .section_4 .peoplelist .peoplewrapper .img img {
          width: 100%;}
        .content .section_4 .peoplelist .peoplewrapper .img i {
          position: absolute;
          background: #ffc000;
          width: 50px;
          height: 50px;
          left: -65px;
          top: 0;
          transform: skewX(-47deg);
          transform-origin: right bottom;}
      .content .section_4 .peoplelist .peoplewrapper .nm {
        font-size: 26px;
        line-height: 1em;
        padding-top: 30px;
        color: #000;
        width: 130px;
        float: left;}
        @media screen and (max-width: 700px) {
          .content .section_4 .peoplelist .peoplewrapper .nm {
            width: 100%;
            float: none;
            text-align: center;} }
        .content .section_4 .peoplelist .peoplewrapper .nm span {
          font-size: 14px;
          color: #999;
          display: block;
          padding-top: 5px;}
      .content .section_4 .peoplelist .peoplewrapper .wrapper {
        width: 475px;}
        @media screen and (max-width: 700px) {
          .content .section_4 .peoplelist .peoplewrapper .wrapper {
            width: 100%;} }
      .content .section_4 .peoplelist .peoplewrapper .speak {
        float: left;
        width: 320px;
        top: -30px;
        position: relative;
        background: #fff;}
        @media screen and (max-width: 700px) {
          .content .section_4 .peoplelist .peoplewrapper .speak {
            width: 100%;
            float: none;
            top: 0;} }
        .content .section_4 .peoplelist .peoplewrapper .speak .speakwrapper {
          padding: 40px 45px;
          font-size: 14px;
          line-height: 1.75em;
          color: #666;}
        .content .section_4 .peoplelist .peoplewrapper .speak:after {
          content: "”";
          font-size: 110px;
          position: absolute;
          right: 16px;
          bottom: 0;
          color: #ffc000;
          font-family: arial,Helvetica;
          font-weight: bold;
          font-style: italic;}
        .content .section_4 .peoplelist .peoplewrapper .speak:before {
          content: "“";
          font-size: 110px;
          position: absolute;
          left: -25px;
          top: 11px;
          color: #ffc000;
          font-family: arial,Helvetica;
          font-weight: bold;
          font-style: italic;}
          @media screen and (max-width: 700px) {
            .content .section_4 .peoplelist .peoplewrapper .speak:before {
              top: 30px;
              left: -13px;} }
    @media screen and (max-width: 700px) {
      .content .section_4 .peoplelist .sliderpager {
        display: none;} }
    .content .section_4 .peoplelist .sliderpager .prev, .content .section_4 .peoplelist .sliderpager .next {
      position: absolute;
      top: 0px;
      right: 80px;
      cursor: pointer;
      z-index: 1;
      height: 68px;
      width: 68px;
      color: #5d1f98;
      font-size: 50px;
      line-height: 68px;
      text-align: center;
      border-radius: 50%;}
      .content .section_4 .peoplelist .sliderpager .prev:hover, .content .section_4 .peoplelist .sliderpager .next:hover {
        opacity: 0.7;}
      .content .section_4 .peoplelist .sliderpager .prev.swiper-button-disabled, .content .section_4 .peoplelist .sliderpager .next.swiper-button-disabled {
        color: #999;}
    .content .section_4 .peoplelist .sliderpager .next {
      right: 10px;}
    .content .section_4 .peoplelist .pgdot {
      text-align: center;}
      .content .section_4 .peoplelist .pgdot .swiper-pagination-bullet-active {
        background: #5d1f98;}
.content .section_5 {
  background: #542185 url("https://www.cavenetomi.com/__xh__/gix.tsinghua.edu.cn/dfiles/18198/assets/images/vdobg.jpg") no-repeat -100px center;
  padding-bottom: 110px;
  position: relative;}
  @media screen and (max-width: 1280px) {
    .content .section_5 {
      padding-bottom: 60px;} }
  @media screen and (max-width: 700px) {
    .content .section_5 {
      background-size: cover;
      padding-bottom: 0px;} }
  .content .section_5 .bgwrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;}
  .content .section_5 .rect_1 {
    position: absolute;
    background: #6c1d99;
    width: 50%;
    height: 100%;
    right: 0;
    top: 0;
    transform: skewX(-47deg);
    margin-right: -500px;
    opacity: .65;
    z-index: 0;}
  .content .section_5 .rect_2 {
    position: absolute;
    background: #8400bd;
    width: 50%;
    height: 100%;
    right: 0;
    top: 0;
    transform: skewX(47deg);
    margin-right: -500px;
    opacity: .67;
    z-index: 0;}
  .content .section_5 .vdolist {
    position: relative;
    top: -100px;}
    .content .section_5 .vdolist li {
      float: left;
      width: 35%;}
      @media screen and (max-width: 700px) {
        .content .section_5 .vdolist li {
          width: 100%;} }
      .content .section_5 .vdolist li img {
        width: 100%;}
      .content .section_5 .vdolist li .img {
        position: relative;
        margin-bottom: 20px;}
        .content .section_5 .vdolist li .img i {
          position: absolute;
          bottom: 25px;
          left: 20px;
          font-size: 60px;
          opacity: 0.85;
          text-shadow: 0 0 20px rgba(0, 0, 0, 0.4);}
      .content .section_5 .vdolist li a {
        color: #fff;
        font-size: 18px;
        margin-left: 85px;
        display: block;}
        @media screen and (max-width: 1280px) {
          .content .section_5 .vdolist li a {
            margin-left: 30px;} }
        @media screen and (max-width: 700px) {
          .content .section_5 .vdolist li a {
            margin-left: 0;
            margin-bottom: 30px;
            font-size: 16px;} }
        .content .section_5 .vdolist li a:hover .img i {
          opacity: 1;}
      .content .section_5 .vdolist li.big {
        width: 65%;}
        @media screen and (max-width: 700px) {
          .content .section_5 .vdolist li.big {
            width: 100%;} }
        .content .section_5 .vdolist li.big .img {
          margin-bottom: 25px;}
          .content .section_5 .vdolist li.big .img i {
            left: 50%;
            top: 50%;
            font-size: 88px;
            margin-left: -64px;
            margin-top: -44px;}
        .content .section_5 .vdolist li.big a {
          margin-left: 140px;
          font-size: 24px;}
          @media screen and (max-width: 1280px) {
            .content .section_5 .vdolist li.big a {
              margin-left: 0px;} }
          @media screen and (max-width: 700px) {
            .content .section_5 .vdolist li.big a {
              font-size: 16px;} }
    .content .section_5 .vdolist .more {
      color: #ffc000;
      border-bottom: 1px solid #ffc000;
      font-size: 14px;
      float: right;
      margin-top: 100px;}
      @media screen and (max-width: 700px) {
        .content .section_5 .vdolist .more {
          margin-top: 20px;} }