body {
  overflow-x: hidden; }

.home .banner {
  width: 100%;
  position: relative;
  overflow: hidden; }
  .home .banner img {
    width: 100%;
    display: block;
    object-fit: cover;
    max-height: 100vh; }
  .home .banner .text {
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    text-align: center;
    transform: translateY(-50%);
    font-size: 3.2vw;
    color: white;
    font-weight: 600;
    text-transform: uppercase;
    font-style: italic; }
.home .sec1 {
  padding: 4.9479166667vw 0 1.875vw; }
  .home .sec1 h1 {
    color: #454545;
    text-align: center;
    font-size: 2.0833333333vw;
    font-style: normal;
    font-weight: 600;
    line-height: 1.15;
    /* 115% */
    text-transform: uppercase;
    margin-bottom: 1.5104166667vw; }
  .home .sec1 .text p {
    width: 37.5vw;
    color: #454545;
    text-align: center;
    font-size: 0.8333333333vw;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    /* 146.25% */
    margin: 0 auto 2.7291666667vw; }
  .home .sec1 a {
    display: block;
    padding: 0.5208333333vw 2.0833333333vw;
    color: #FFF;
    text-align: center;
    font-size: 0.8333333333vw;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    /* 146.25% */
    text-transform: uppercase;
    background-color: #C8161E;
    transform: skewX(-5deg);
    border-radius: 5px;
    transition: all 600ms;
    margin: 0 auto 3.3333333333vw;
    width: fit-content; position: absolute;
    bottom: calc(-5.7291666667vw - 0px);
    left: 0;
    right: 0;}
    .home .sec1 a p {
      transform: skewX(5deg);
      width: fit-content; }
    .home .sec1 a:hover {
      background-color: rgba(210, 9, 43, 0.8); }
  .home .sec1 .img {
    width: 100%;
    margin-bottom: 5.7291666667vw; margin-top:2vw;}
    .home .sec1 .img img {
      display: block;
      max-width: 60%; margin:0 auto;}
  .home .sec1 .flex {
    display: none;
    align-items: center;
    justify-content: center; }
    .home .sec1 .flex .item {
      display: flex;
      align-items: flex-end;
      line-height: 1;
      margin-right: 2.6041666667vw; }
      .home .sec1 .flex.on {display:flex;}
      .home .sec1 .flex .item h5 {
        color: #000;
        text-align: center;
        font-size: 2.6041666667vw;
        font-weight: 700;
        margin: 0 0.46875vw 0 0;
        text-transform: uppercase;
        font-style: italic; }
      .home .sec1 .flex .item p {
        color: #454545;
        text-align: center;
        font-size: 0.8333333333vw;
        font-style: normal;
        font-weight: 400;
        line-height: 2;
        width: fit-content; }
    .home .sec1 .flex:nth-last-child(1) {
      margin-right: 0; }

.sec2 .proImg {
  position: relative;
  width: 100%;
  background-image: url(../images/pro3.jpg);
  background-repeat: no-repeat;
  background-attachment: fixed;
  height: 431px;
  background-size: cover;
  background-position: center; }
  .sec2 .proImg img {
    display: block;
    width: 100%; }
  .sec2 .proImg h2 {
    color: #FFF;
    font-size: 2.65625vw;
    font-style: normal;
    font-weight: 600;
    line-height: 1.3;
    /* 127.059% */
    text-transform: uppercase;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 18.75vw;
    margin: 0; }
.sec2 .flex {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 28.6458333333vw; }
  .sec2 .flex .img {
    width: 44.2708333333vw;
    display: flex;
    justify-content: center;
    margin-right: 9.8958333333vw; }
    .sec2 .flex .img img {
      display: block;
      max-width: 100%; }
  .sec2 .flex .content {
    width: 33.3333333333vw; }
    .sec2 .flex .content p {
      width: 19.7916666667vw;
      color: #454545;
      font-size: 0.8333333333vw;
      font-weight: 400;
      line-height: 1.5;
      /* 146.25% */ }

.sec3 {
  width: 100vw;
  overflow: hidden;
  padding: 1.0416666667vw 0; }
  .sec3 .zi_swiper {
    width: 120vw; }
    .sec3 .zi_swiper .swiper-wrapper {
      transition-timing-function: linear !important; }
      .sec3 .zi_swiper .swiper-wrapper .swiper-slide {
        font-size: 8.5416666667vw;
        font-style: normal;
        font-weight: 400;
        color: #FFFFFF;
        text-transform: uppercase;
        text-stroke: 1px #000000;
        -webkit-text-stroke: 1px #000000; }

.sec4 .joke {
  width: 85.4166666667vw;
  margin: 1.5625vw auto 0;
  padding-bottom: 8.75vw; }
  .sec4 .joke h2 {
    color: #000;
    font-size: 3.3333333333vw;
    font-style: normal;
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
    margin-bottom: 2.3958333333vw; }
  .sec4 .joke .main {
    position: relative; }
    .sec4 .joke .main .swiper {
      width: 100%;
      overflow: hidden; }
      .sec4 .joke .main .swiper .swiper-slide {
        display: block;
        background: #F1F2F2;
        height: 17.4479166667vw;
        border-radius: 0.78125vw;
        overflow: hidden;
        transition: 0.4s; }
        .sec4 .joke .main .swiper .swiper-slide .img {
          width: 16.1979166667vw;
          height: 11.7708333333vw;
          display: flex;
          align-items: center;
          justify-content: center;
          margin: 2.6041666667vw auto 0.5208333333vw; }
          .sec4 .joke .main .swiper .swiper-slide .img img {
            display: block;
            max-width: 100%;
            max-height: 100%; }
        .sec4 .joke .main .swiper .swiper-slide p {
          color: #060101;
          text-align: center;
          font-size: 1.1458333333vw;
          font-weight: 400;
          text-transform: uppercase;
          transition: 0.4s; }
        .sec4 .joke .main .swiper .swiper-slide:hover {
          box-shadow: 0px 0px 20px 0px rgba(46, 49, 68, 0.2); }
          .sec4 .joke .main .swiper .swiper-slide:hover p {
            color: #C40B13; }
    .sec4 .joke .main .btns {
      width: 92.7083333333vw;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      pointer-events: none;
      display: flex;
      align-items: center;
      justify-content: space-between; }
      .sec4 .joke .main .btns svg {
        width: 1.4583333333vw;
        pointer-events: auto;
        cursor: pointer; }
      .sec4 .joke .main .btns svg:nth-child(1) {
        transform: rotate(180deg); }

@media screen and (max-width: 1510px) {
  .home .sec1 {
    padding: 3.125vw 0 1.875vw; }
    .home .sec1 .text p {
      margin: 0 auto 1.125vw; }
  .home .sec3 .zi_swiper .swiper-wrapper .swiper-slide {
    font-size: 7.8125vw;
    white-space: nowrap; } }
@media screen and (max-width: 1024px) {
  .home {
    padding-top: 60px; }
    .home .sec1 {
      width: 90%;
      margin: auto;
      padding: 3.125vw 0 1.875vw; }
      .home .sec1 h1 {
        font-size: 24px; }
      .home .sec1 a {
        font-size: 12px;
        padding: 5px 10px; }
        .home .sec1 a p {
          font-size: 12px; }
      .home .sec1 .text p {
        font-size: 12px;
        margin: 0 auto 3.125vw; }
      .home .sec1 .flex .item h5 {
        font-size: 18px; }
      .home .sec1 .flex .item p {
        font-size: 12px;
        line-height: 1;
        position: relative;
        top: -2px; }
    .home .sec2 .proImg h2 {
      font-size: 24px; }
    .home .sec2 .flex .content p {
      font-size: 12px; }
    .home .sec4 .joke h2 {
      font-size: 24px; }
    .home .sec4 .joke .main .swiper .swiper-slide p {
      font-size: 12px; } }
@media screen and (max-width: 768px) {
  .home .sec1 h1 {
    margin-bottom: 20px; }
  .home .sec1 .text p {
    width: 100%;
    margin: 0 auto 30px; }
  .home .sec1 .flex {
    flex-wrap: wrap; }
    .home .sec1 .flex .item {
      width: 100%;
      margin: 0 0 20px;
      justify-content: center; }
  .home .sec2 h2 {
    left: 5vw; }
  .home .sec2 .proImg {
    height: 300px; }
    .home .sec2 .proImg img {
      height: 100%;
      object-fit: cover; }
  .home .sec2 .flex {
    width: 90%;
    margin: auto;
    flex-direction: column;
    padding: 30px 0 60px 0; }
    .home .sec2 .flex .img {
      width: 100%;
      margin: 0 0 30px; /*height:90vw; */}
      .home .sec2 .flex .img img {
        width: 100%; }
    .home .sec2 .flex .content {
      width: 100%; }
      .home .sec2 .flex .content p {
        width: 100%; }
  .home .sec4 {
    padding: 30px 0 0; }
    .home .sec4 .joke h2 {
      margin-bottom: 30px; }
    .home .sec4 .joke .main .swiper .swiper-slide {
      height: fit-content;
      padding: 40px 0; }
      .home .sec4 .joke .main .swiper .swiper-slide .img {
        width: 90%;
        height: unset; }
    .home .sec4 .joke .main .btns {
      position: unset;
      transform: unset;
      width: auto; }
      .home .sec4 .joke .main .btns svg {
        width: 16px; } }

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