﻿@charset "UTF-8";
*{ padding:0; margin:0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }
  *:before,*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }
 
  /* a{ color:#333; text-decoration:none;}*/
  ul,ol,li{ margin:0; padding:0; list-style-type:none;}
  html{overflow-x:hidden;overflow-y:auto;}
  body{margin: 0px auto; width: 100%;}
  .visible-xs,
  .visible-sm,
  .visible-md,
  .visible-lg {
    display: none !important;
  }
  .visible-xs-block,
  .visible-xs-inline,
  .visible-xs-inline-block,
  .visible-sm-block,
  .visible-sm-inline,
  .visible-sm-inline-block,
  .visible-md-block,
  .visible-md-inline,
  .visible-md-inline-block,
  .visible-lg-block,
  .visible-lg-inline,
  .visible-lg-inline-block {
    display: none !important;
  }
  @media (max-width: 767px) {
    .visible-xs {
      display: block !important;
    }
    table.visible-xs {
      display: table !important;
    }
    tr.visible-xs {
      display: table-row !important;
    }
    th.visible-xs,
    td.visible-xs {
      display: table-cell !important;
    }
  }
  @media (max-width: 767px) {
    .visible-xs-block {
      display: block !important;
    }
  }
  @media (max-width: 767px) {
    .visible-xs-inline {
      display: inline !important;
    }
  }
  @media (max-width: 767px) {
    .visible-xs-inline-block {
      display: inline-block !important;
    }
  }
  @media (min-width: 768px) and (max-width: 991px) {
    .visible-sm {
      display: block !important;
    }
    table.visible-sm {
      display: table !important;
    }
    tr.visible-sm {
      display: table-row !important;
    }
    th.visible-sm,
    td.visible-sm {
      display: table-cell !important;
    }
  }
  @media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-block {
      display: block !important;
    }
  }
  @media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline {
      display: inline !important;
    }
  }
  @media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline-block {
      display: inline-block !important;
    }
  }
  @media (min-width: 992px) and (max-width: 1319px) {
    .visible-md {
      display: block !important;
    }
    table.visible-md {
      display: table !important;
    }
    tr.visible-md {
      display: table-row !important;
    }
    th.visible-md,
    td.visible-md {
      display: table-cell !important;
    }
  }
  @media (min-width: 992px) and (max-width: 1319px) {
    .visible-md-block {
      display: block !important;
    }
  }
  @media (min-width: 992px) and (max-width: 1319px) {
    .visible-md-inline {
      display: inline !important;
    }
  }
  @media (min-width: 992px) and (max-width: 1319px) {
    .visible-md-inline-block {
      display: inline-block !important;
    }
  }
  @media (min-width: 1320px) {
    .visible-lg {
      display: block !important;
    }
    table.visible-lg {
      display: table !important;
    }
    tr.visible-lg {
      display: table-row !important;
    }
    th.visible-lg,
    td.visible-lg {
      display: table-cell !important;
    }
  }
  @media (min-width: 1320px) {
    .visible-lg-block {
      display: block !important;
    }
  }
  @media (min-width: 1320px) {
    .visible-lg-inline {
      display: inline !important;
    }
  }
  @media (min-width: 1320px) {
    .visible-lg-inline-block {
      display: inline-block !important;
    }
  }
  @media (max-width: 767px) {
    .hidden-xs {
      display: none !important;
    }
  }
  @media (min-width: 768px) and (max-width: 991px) {
    .hidden-sm {
      display: none !important;
    }
  }
  @media (min-width: 992px) and (max-width: 1319px) {
    .hidden-md {
      display: none !important;
    }
  }
  @media (min-width: 1320px) {
    .hidden-lg {
      display: none !important;
    }
  }
  .visible-print {
    display: none !important;
  }
  @media print {
    .visible-print {
      display: block !important;
    }
    table.visible-print {
      display: table !important;
    }
    tr.visible-print {
      display: table-row !important;
    }
    th.visible-print,
    td.visible-print {
      display: table-cell !important;
    }
  }
  .visible-print-block {
    display: none !important;
  }
  @media print {
    .visible-print-block {
      display: block !important;
    }
  }
  .visible-print-inline {
    display: none !important;
  }
  @media print {
    .visible-print-inline {
      display: inline !important;
    }
  }
  .visible-print-inline-block {
    display: none !important;
  }
  @media print {
    .visible-print-inline-block {
      display: inline-block !important;
    }
  }
  @media print {
    .hidden-print {
      display: none !important;
    }
  }
     
  .pf_down{display: none;}
  @media (max-width: 1024px){
  .pf_down{display: block;}
  }



  @font-face {
    font-family: myFirstFont;
    src: url('../font/Mark-Heavy.ttf'),
         url('../font/Mark-Light.ttf'),
         url('../font/msyh.ttc'),
         url('../font/msyhbd_0.ttc'),
         url('../font/msyhl_0.ttc'); 
    font-weight: normal;
    font-style: normal;
  }
  @keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
  }
  
  @keyframes rotate1 {
    from {
        transform: rotate(360deg);
    }
    to {
        transform: rotate(0deg);
    }
  }

body{background: #000;}
.padd{padding: 0 100px;}
.sbanner{height: 100vh;width: 100vw;background: #CD363F;
transition: all .5s ease;position: relative;float: left;position: fixed;
right: -100vw;z-index: 99;}

.sbanner.on{right: 0;}


.sbanner .sbmb{position: absolute;height: 40px;width: 40px;
  margin-top: 11px;top: 38px;right: 100px;cursor: pointer;z-index:25;}
.sbanner .menu{height: 4px;width: 40px;position: relative;
  background: #fff;transition: all .5s ease;}

  .sbanner .menu::before{
    content: "";
    position: absolute;
    height: 4px;
    width: 40px;
    background: #fff;
    bottom: -11px;
    left: 0;
    transition: all .5s ease;
  }
  .sbanner .menu::after{
    content: "";
    position: absolute;
    height: 4px;
    width: 40px;
    background: #fff;
    top: -11px;
    left: 0;
    transition: all .5s ease;
  }
  .sbanner .menu.on::after{
    top: 0;
    transform: rotate(-45deg);
    background: #fff !important;
  }
  .sbanner .menu.on::before{
    bottom: 0;
    transform: rotate(45deg);
    background: #fff !important;
  }
  .sbanner .menu.on{background: transparent;}
  .kg{display: none;}
  @media (max-width: 1024px){
    .kg{display: block;}
    .sbanner .sbmb{margin-top: 5px;right: 12.5px;top: 20px;
    height: 20px;width: 20px;}

     .sbanner .menu{height: 2px;width: 20px;}
     .sbanner .menu::after{content: "";position: absolute;height: 2px;width: 20px;top:-5px;}
     .sbanner .menu::before{content: "";position: absolute;height: 2px;width: 20px;bottom:-5px;}
  }

  .sbanner .sbtext{font-size: 188px;color: #000000;text-align: center;position: relative;
    top: 47%;transform: translate(-25px,-50%);font-family:'myFirstFont';z-index: 20;
    max-width: 1920px;margin: 0 auto;}
  @media (max-width: 1920px){
    .sbanner .sbtext{top: 45%;}
  }

.sbanner .sbtext i{font-family:'myFirstFont';
display:inline-block;transition: all .5s ease;}


@media (max-width: 1600px){
  .sbanner .sbtext{font-size: 140px;}
}
@media (max-width: 1024px){
  .padd{padding: 0 12.5px;}
  .sbanner .sbtext{font-size: 75px;text-align: right;padding-right: 30px;top: 50%;transform: translate(0px,-50%);}
  .sbanner .sbtext i img{width: 80%;}
  .sbtext i div{width: 80%;right: 0;}
}


.downnav{width: 100%;float: left;padding-top:150px;padding-bottom: 100px;}
.downnav .navt{font-size: 48px;color: #ffffff;line-height: 52px;}
.downnav .downl{width: calc(100% - 240px);float: left;margin-top: 40px;}

.downnav .downl textarea{width: 100%;height: 150px;color: #d4d4d4;background: transparent;
border: 1px solid #BBBBBB;font-size: 24px;line-height: 32px;padding: 20px 15px;
border-radius: 0px !important;}



.downnav .downl textarea::-webkit-input-placeholder{font-size: 24px;color: #d4d4d4;}
.downnav .downl .input{display: flex;justify-content: space-between;margin-top:24px;}
.downnav .downl .input input{width: calc(25% - 18px);line-height: 65px;color: #d4d4d4;
padding-left: 16px;font-size: 24px;border: 1px solid #BBBBBB;background: transparent;
border-radius: 0px !important}

.downnav .downl .input input[type="button"]{text-align: center;padding-left: 0;
background: #626262;border:1px solid #626262;color: #fff;}
.downnav .downl .input input::-webkit-input-placeholder{font-size: 24px;color: #d4d4d4;}
.downnav .downr{width: 240px;float: right;padding-left: 35px;margin-top: 40px;}
.downnav .downr img{width: 100%;vertical-align: bottom;}
.downnav .downr h4{text-align: justify;margin-top: 14px;line-height: 22px;
text-justify: distribute-all-lines;font-size: 20px;color: #fff;
text-align-last: justify;}
  .downnav .downr h4 span{display:inline-block;
    width:100%;
    height: 0;
    margin: 0;}
.downnav .banq{width: 100%;display: flex;margin-top: 60px;float: left;justify-content: space-between;}
.downnav .banq .logo{margin-right:25px;}
.downnav .banq .logo img{width: 100%;}
.downnav .banq .banqt{font-size: 21px;color: #fff;text-align: center;line-height: 36px;}
.downnav .banq .banqt br{display: none;}

@media (max-width: 1600px){
  .downnav .banq .banqt{font-size: 16px;}

  .downnav{width: 100%;float: left;padding-top:100px;padding-bottom: 100px;}
  .downnav .navt{font-size: 40px;line-height: 45px;}
  .downnav .downl{width: calc(100% - 240px);float: left;margin-top: 40px;}
  .downnav .downl textarea{height: 130px;font-size: 20px;line-height: 28px;padding: 15px}
  .downnav .downl textarea::-webkit-input-placeholder{font-size: 20px;}
  .downnav .downl .input{margin-top:20px;}
  .downnav .downl .input input{width: calc(25% - 10px);line-height: 55px;padding-left: 12px;font-size: 20px}
  .downnav .downl .input input::-webkit-input-placeholder{font-size: 20px;}
}
@media (max-width: 1400px){
  .downnav .downr{width: 200px;padding-left: 25px;}
  .downnav .downl{width: calc(100% - 215px);float: left;margin-top: 40px;}
  .downnav .banq .banqt{font-size: 18px;color: #fff;text-align: center;line-height: 30px;}
}
@media (max-width: 1400px){
  .downnav .banq .banqt br{display: block;}
}
@media (max-width: 1024px){
  .downnav{padding-top: 25px;padding-bottom: 30px;}
  .downnav .banq .logo img{width: 95px;}
  .downnav .navt{font-size: 18px;line-height: 24px;font-weight: bold;}
  .downnav .downl{width: calc(100% - 90px);margin-top: 10px;}
  .downnav .downl textarea{height: 48px;font-size: 12px;line-height: 18px;padding:4px  8px}
  .downnav .downl .input input{line-height: 23px;width: calc(50% - 2px);
  font-size: 12px;margin-bottom:5px;padding-left:8px}
  .downnav .downl .input{flex-wrap: wrap;}
  .downnav .downl .input input::-webkit-input-placeholder{font-size: 12px;}
  .downnav .downl textarea::-webkit-input-placeholder{font-size: 12px;}
  .downnav .downl .input{margin-top: 5px;}
  .downnav .downr{width: 90px;padding-left: 10px;margin-top: 10px;}
  .downnav .downr h4{font-size: 12px;margin-top: 5px;white-space: nowrap;}
  .downnav .banq{margin-top: 20px;}
  .downnav .banq{flex-direction: column;}
  .downnav .banq .banqt{font-size: 12px;line-height: 20px;text-align: left;
  margin-top: 10px;white-space: nowrap;}

  
}


.picl{width: 100%;float: left;}
/* .picl ul{display: flex;justify-content: space-between;width: 100%;} */
.picl ul li{height: 100%;margin: 0 20px;position:relative}
.picl ul li.slick-current a::after{content: "";height: 100%;width: 100%;transition: all .5s ease;
position: absolute;top: 0;left: 0;background: rgba(0,0,0,0.4);opacity: 0;}
.picl ul li.slick-current:hover a::after{opacity: 1;}




/* 
.picl ul li:nth-child(1){width: 27.6%;}
.picl ul li:nth-child(3){width: 29%;}
.picl ul li:nth-child(2){width: 39%;} */


.picl ul li img{width: 100%;object-fit: cover;height: 580px;}
.picl ul li.slick-current img{height: 660px;vertical-align: bottom;}
@media (max-width: 1920px){
  .picl ul li img{width: 100%;object-fit: cover;height: 482px;}
  
.picl ul li.slick-current img{height: 520px;vertical-align: bottom;}
}


.picl .slick-track{display: flex;align-items: center;}
.picl ul li a{position: relative;float: left;width: 100%;}
.picl ul li .text{position: absolute;left: 50%;top: 50%;transform:translate(-50%,-50%);
color: #fff;font-size:45px;line-height: 58px;text-align: center;
white-space: nowrap;z-index: 3;opacity: 0;
transition: all .5s ease;}
.picl ul li.slick-current:hover .text{opacity: 1;}




.logol{width: 100%;float: left;padding-top:150px;padding-bottom: 150px;}
.logol .logot{display: flex;justify-content: space-between;align-items: flex-end;margin-bottom: 100px;}
.logott{font-size: 86px;color: #fff;font-family:'myFirstFont';line-height: 88px;float: left;}
.logol .lul{float: right;}
.logol .lul .ll{float: right;display: flex;align-items: flex-end;margin-left: 180px;}
.logol .lul .ll:last-child{margin-left: 0;}
.logol .lul .lleft{font-size: 24px;color: #fff;line-height: 32px;}
.logol .lul .lright{font-size: 90px;color: #fff;line-height: 70px;font-family:'myFirstFont';}
.logol .lul .plus{font-size: 90px;color: #fff;line-height: 70px;font-family:'myFirstFont';}




.logod{width: 100%;float: left;}
.logod ul{width: calc(100% + 30px);margin: -17.5px -15px;float: left;}
.logod ul li{width:16.66%;padding:17.5px 15px;float: left;}
.logod ul li a{width: 100%;height: 90px;border: 1px solid rgba(255,255,255,0.5);
display: flex;align-items: center;justify-content: center;}
.logod ul li .pic{width: 100%;overflow: hidden;height: 100%;
display: flex;align-items: center;justify-content: center;}
.logod ul li .pic img{max-width: 80%;}

.logod ul li img{max-width: 100%;transition: all .5s ease;}
.logod ul li:hover .pic img{transform: scale(1.1);}
@media (max-width: 1600px){
.logott{font-size: 60px;line-height: 70px;}
  .logol .lul .ll{margin-left:100px;}
  .logol .lul .lleft{font-size: 20px;line-height: 26px;}
  .logol .lul .lright{font-size: 60px;line-height: 50px;}
  .logol .lul .plus{font-size: 60px;line-height: 50px;}
  .logol .logot{margin-bottom: 80px;}
  .picl ul li .text{font-size:36px;line-height: 45px;}
  .picl ul li img{width: 100%;object-fit: cover;height: 400px;}/**/
  .picl ul li.slick-current img{height: 440px;}
}
@media (max-width: 1400px){
.logott{line-height: 60px;}
  .logol .lul .ll{margin-left:70px;}
  .logol .lul .lright{font-size: 50px;line-height: 50px;}
  .logol .lul .plus{font-size: 50px;line-height: 50px;}

  .logod ul{width: calc(100% + 20px);margin: -10px;}
  .logod ul li{width: 25%;padding: 10px;}
  .logol{padding-top: 100px;padding-bottom: 100px;}
  .picl ul li .text{font-size:30px;line-height: 40px;}
  .picl ul li img{height: 350px}/*;*/
  .picl ul li.slick-current img{height: 380px;}
}
@media (max-width: 1024px){
  .logol{padding-top: 35px;padding-bottom: 30px;}
  .logol .logot{flex-direction: column;align-items: flex-start;margin-bottom:15px;}
 .logott{font-size: 30px;display: flex;line-height: 30px;}

 .logott>div{margin-left: 12px;}
.logol .lul{margin-top: -5px;}
  .logol .logott br{display: none;}
  .logol .lul .lleft{font-size: 12px;line-height: 14px;}
  .logol .lul .lright{font-size: 25px;line-height: 20px;}
  .logol .lul .plus{font-size: 25px;line-height: 20px;}

  .logol .lul .ll{float: left;margin-left: 0;margin-right:0px;}
  .logol .lul{display: flex;justify-content: space-between;width: 100%;flex-direction: row-reverse;}
  .logod ul{width: calc(100% + 12px);margin: -7px -6px;}
  .logod ul li{width: 33.3%;padding: 7px 6px;}
  .logod ul li a{height: 38px;}
  .logod ul li img{max-width: 60%;max-height: 60%;}
  .picl ul li .text{font-size:14px;line-height: 16px;}
  .picl ul{align-items: center;}
  /* .picl ul li:nth-child(2) img{transform: scale(1.1);}
  .picl ul li:nth-child(2){margin: 0 15px;} */
  .picl ul li{margin: 0 5px;}
  .picl ul li img{height: 135px}/*;*/
  .picl ul li.slick-current img{height: 155px;}
  .picl .slick-track{display: flex;align-items: center;}

  
  .picl ul li.slick-current .text{opacity: 1;}
  .picl ul li.slick-current::after{opacity: 1;}
}

.tcont{width: 100%;float: left;padding-top: 140px;padding-bottom: 140px;
display: flex;justify-content: space-between;align-items: flex-start;}
.tcont .lt{font-size: 48px;line-height: 70px;color:#fff;padding-bottom:20px;
font-family:'myFirstFont';border-bottom:5px solid #FFFFFF;white-space: nowrap;
font-weight: bold;letter-spacing: 3px;}
.tcont .lr{font-size: 24px;line-height: 46px;color:#fff;letter-spacing:2px;width: 62.5%;
font-weight: lighter;}

.circont{width: 100%;float: left;display: flex;justify-content: space-between;align-items: flex-start;}
.circont .lt{font-size: 48px;line-height: 70px;color:#fff;padding-bottom:20px;
font-family:'myFirstFont';border-bottom:5px solid #FFFFFF;white-space: nowrap;
margin-right: 170px;font-weight: bold;letter-spacing: 3px;}
.circont .cirl{display: flex;flex-direction: column; align-items: center;}


.circont .cirt1{height: 287px;width: 287px;background: url(../img/circle1.png) center no-repeat;background-size: contain;
color: #fff;font-size: 80px;display: flex;align-items: center;
justify-content: center;position: relative;}
.circont .cirt1 .wcircle{position: absolute;height: 287px;
width: 287px;border-radius: 50%;top: 0;left: 0;
}

.circont .cirt1 .wcircle::after{content: "";height: 12px;width: 12px;background: #fff;
border-radius: 50%;position: absolute;right: 100px;
left:50%;top: -6px;transform: translate(-50%,0);}


.circont .cirtt{color: #fff;font-size: 34px;margin:15px 0;}
.circont .cirt2{height: 287px;width: 287px;border-radius: 50%;position: relative;
border: 1px solid #fff;color: #fff;font-size: 80px;display: flex;align-items: center;justify-content: center;}
.circont .cirt2 .wcircle{position: absolute;height: 287px;
width: 287px;border-radius: 50%;top: 0;left: 0;}

.circont .cirt2 .wcircle::after{content: "";height: 12px;width: 12px;background: #fff;
border-radius: 50%;position: absolute;left: 50%;
top: -6px;transform: translate(-50%,0);}


.circont .cirr{margin-left:100px;}
.circont .cirr .rtit{font-size: 32px;color: #fff;padding-bottom:20px;border-bottom: 1px solid #fff;}
.circont .cirr .rtit.t2{margin-top:80px;}
.circont .cirr .rli .rt1{font-size: 24px;color: #fff;font-weight: bold;margin-right:10px;margin-top: 20px;}
.circont .cirr .rli .rt2{font-size: 24px;color: #fff;margin-top: 20px;font-weight: lighter;}

.circont .cirr .rli{display: flex;}
.circont .circlecont{display: flex;width: 62.5%;}
.cirr .more{width: 154px;height: 54px;border-radius: 27px;
  text-align: center;line-height:54px;transition: all .5s ease;
color: #fff;font-size:18px;background: #2D2D2D;margin-top: 70px;display: block;}
.cirr .more:hover{background: #CD363F;}

@media (max-width: 1600px){


  .tcont .lt{font-size: 36px;line-height: 50px;}
  .tcont .lr{font-size: 18px;line-height: 34px;letter-spacing: 1px;}
  .circont .lt{font-size: 36px;line-height: 50px;}
  .circont .cirr .rtit{font-size: 26px;}
  .circont .cirr .rli .rt1{font-size: 20px;margin-top: 14px;}
  .circont .cirr .rli .rt2{font-size: 20px;margin-top: 14px;}
  .circont .cirt1{height: 230px;width: 230px;font-size: 60px;}
  .circont .cirt1 .wcircle{height: 230px;width: 230px}
  .circont .cirt1 .wcircle::after{height: 10px;width: 10px;right: 80px;}
  .circont .cirt2{height: 230px;width: 230px;font-size: 60px;}
  .circont .cirt2 .wcircle{height: 230px;width: 230px;}
  .circont .cirt2 .wcircle::after{height: 10px;width: 10px;left: 80px;}
  .cirr .more{width: 120px;height: 36px;border-radius: 18px;line-height:36px;
  font-size:16px;margin-top:40px;}
  .circont .cirr{margin-left:60px;}
}
@media (max-width: 1600px){
  .circont .cirr .rtit.t2{margin-top: 150px;}
}
@media (max-width: 1400px){
  .circont .cirr{margin-left:40px;}
}
@media (max-width: 1200px){
  .circont .cirr{margin-left:30px;}
  .circont .cirr .rli .rt1{font-size: 17px;margin-top: 14px;}
  .circont .cirr .rli .rt2{font-size: 17px;margin-top: 14px;}
}


@media (max-width: 1024px){
  .tcont{padding-top: 25px;padding-bottom: 35px;}
  .tcont .lt{font-size: 18px;line-height: 25px;padding-bottom: 5px;border-bottom: 2px solid #FFFFFF;}
  .tcont{flex-direction: column;}
  .tcont .lr{width: 100%;font-size: 12px;line-height: 22.5px;
    margin-top: 12px;letter-spacing: 1px;font-weight: inherit;}
  .circont .lt{font-size: 18px;line-height: 25px;padding-bottom: 5px;border-bottom: 2px solid #FFFFFF;}
  .circont .circlecont{width: 100%;margin-top: 18px;}
  .circont{flex-direction: column;margin-top: 0px;}
  .circont .cirt1{height: 112px;width: 112px;font-size: 20px;}
  .circont .cirt1 .wcircle{height: 112px;width: 112px}
  .circont .cirt1 .wcircle::after{height: 5px;width: 5px;right: 70px;top: -2.5px;}
  .circont .cirt2{height: 112px;width: 112px;font-size: 20px;}
  .circont .cirt2 .wcircle{height: 112px;width: 112px;}
  .circont .cirt2 .wcircle::after{height: 5px;width: 5px;left: 70px;top: -2.5px;}
  .circont .cirtt{margin: 15px 0;font-weight: 100;}
  .circont .cirr{margin-left:16px;width: calc(67% - 46px);float: right;}
  .circont .cirr .rtit{font-size: 12px;padding-bottom: 10px;}
  .circont .cirr .rli .rt1{font-size: 12px;margin-top: 7px;}
  .circont .cirr .rli .rt2{font-size: 12px;margin-top: 7px;
    letter-spacing: 1px;font-weight: inherit;}
  .circont .cirl{padding-left: 30px;width: calc(33% + 30px);float: left;}
  .circont .cirr .rtit.t2{margin-top: 40px;}
  .circont .circlecont{display: block;}
  .cirr .more{width: 70px;height: 20px;border-radius: 10px;line-height:20px;font-size:12px;margin-top:10px;}
  #sub1{width: 100%;height: 115px;}
  #sub2{width: 100%;height: 115px;}
}

.topnav{position: fixed;width: 100%;align-items: flex-start;
display: flex;justify-content: space-between;top:50px;z-index: 90;
transition: all .5s ease;height: 90px;top: 0;align-items: center;}
.topnav.bgb{background: #000;}
.topnav.bgb.fbg{background: #fff !important;}
.topnav.work{background: transparent;}
.topnav.work.fbg{background: #000;}


/* .topnav.bgb2{background: #fff;} */
.topnav .menu{height: 4px;width: 40px;background: #fff;transition: all .5s ease;
position: relative;margin-top: 11px;cursor: pointer;z-index: 6;}
.topnav .button{position: relative;}
/* .topnav .button.act:after{background: #272727;height: 45px;transition: all 50s ease;
content: "";width:60px;top: -10px;left: -10px;position: absolute} */

.topnav .menu::after{content: "";position: absolute;height: 4px;
width: 40px;background: #fff;top:-11px;left: 0;transition: all .5s ease;}
.topnav .menu::before{content: "";position: absolute;height: 4px;
width: 40px;background: #fff;bottom:-11px;left: 0;transition: all .5s ease;}
.topnav .button{cursor: pointer;height: 28px;
    width: 40px;}

.topnav .menu.on{background: transparent !important;}
.topnav .menu.on::after{top: 0;transform: rotate(-45deg);background: #fff !important;}
.topnav .menu.on::before{bottom: 0;transform: rotate(45deg);background: #fff !important;}
.topnav .menu.nmenu{background: #000000;}
.topnav .menu.nmenu::after{background: #000 !important;}
.topnav .menu.nmenu::before{background: #000 !important;}
.topnav .menu.nmenu2{background: #000;}
.topnav .menu.nmenu2::after{background: #000 !important;}
.topnav .menu.nmenu2::before{background: #000 !important;}
.topnav .pic2{display: none;}
.topnav.bgb2 .pic2{display:block;}
.topnav.bgb2 .pic1{display:none;}




.lnav{position: fixed;top: 0;right: 0;width: 650px;padding-top: 80px;padding-left: 80px;
background: #272727;height:100vh;z-index: 80;right: -650px;
transition: all .5s ease;display: none !important;}

.lnav.on{right: 0;}
.lnav ul{display: flex;flex-direction: column;}
.lnav ul li a{font-size: 90px;color: #fff;font-family:'myFirstFont';}
.lnav ul li a:hover{color: #CD363F;}
@media (max-width: 1600px){
  .lnav{width: 500px;padding-top:40px;padding-left: 40px;right: -500px;}
  .lnav ul li a{font-size: 60px;}
}
@media (max-width: 1024px){
  .topnav{top: 0px;height: 65px;}
  
  .topnav .menu{height: 2px;width: 25px;margin-top: 7.5px;}
  .topnav .menu::after{content: "";position: absolute;height: 2px;width: 25px;top:-7.5px;}
  .topnav .menu::before{content: "";position: absolute;height: 2px;width: 25px;bottom:-7.5px;}
  .topnav .logo img{height: 19px;}
  .lnav{width: 100vw;padding-top: 80px;padding-left: 25px;}
  .lnav ul li a{font-size: 40px;}
  .sbanner a{font-size: 40px;color: #fff !important;margin:5px 0px;
  font-family:'myFirstFont';line-height: 60px;}
  .sbanner li{height: 60px;}
  .topnav .button{width: 25px;height: 18px;}
}
.workcont{float: left;width: 100%;margin-top: 150px;}
.workcont .worktop{display: flex;align-items: flex-end;}
.workcont .worktit{font-size: 60px;color: #fff;font-family:'myFirstFont';margin-right:110px;line-height: 60px;}
.workcont .workul{display: flex;}
.workcont .workul a{font-size: 18px;color:#909090;font-family:'myFirstFont';padding-right: 50px;
display: block;position: relative;}
.workcont .workul a.on{color: #fff;}
.workcont .workul a.on::after{content: "";height: 12px;width: 12px;
border-top: 3px solid #878787;border-right: 3px solid #878787;right: 20px;
position: absolute;top: 50%;transform: translate(0,-50%)rotate(-45deg);margin-top: 3px;}
.workdown{margin-top: 55px;float: left;width: 100%;}
.workdown ul{width: calc(100% + 38px);margin: 0 -19px;float: left;
display: flex;flex-wrap: wrap;}
.workdown ul li{width: 33.3%;float: left;padding: 20px 19px;}
.workdown ul li .pic{position: relative;width: 100%;overflow: hidden;}
.workdown ul li .pic img{width: 100%;transition: all .5s ease;}
.workdown ul li:hover .pic img{transform: scale(1.1);}
.workdown ul li a{position: relative;width: 100%;float: left;
display: flex;min-height: 100%;}
.workdown ul li .text{position: absolute;
  left: 50%;top: 50%;transform: translate(-50%,-50%);
  color: #fff;font-size: 45px;
  line-height: 58px;transition: all .5s ease;
  text-align: center;opacity: 0;
  white-space: nowrap;}
.workdown ul li:hover .text{opacity: 1;z-index: 1;}
.workdown ul li a::after{content: "";
height: 100%;width: 100%;position: absolute;
top: 0;left: 0;background: rgba(0,0,0,0.5);
opacity: 0;transition: all .5s ease;}
.workdown ul li:hover a::after{opacity: 1;}
.workdown ul li .txt{height: inherit;width:100%;background: #fff;
display: flex;align-items: center;justify-content: center;position: relative;
font-size: 87px;font-family: 'myFirstFont';color: #000000;}
.workdown ul li .txt::after{content: "";height: 100%;width: 100%;transition: all .5s ease;
background: rgba(0,0,0,0.5);position: absolute;top: 0;left:0}
.workdown ul li:hover .txt::after{opacity: 0;}

@media (max-width: 1600px){
  .workdown ul li .text{font-size: 38px;line-height: 44px;}
  .workdown ul li .txt{font-size: 70px;}
}
@media (max-width: 1400px){
  .workdown ul li .text{font-size: 30px;line-height: 40px;}
  .workdown ul li .txt{font-size: 50px;}
}

@media (max-width: 1024px){
  .workcont{margin-top: 60px;}
  .workcont .worktit{font-size: 30px;line-height: 30px;margin-right:30px;}
  .workcont .workul a{font-size: 12px;padding-right: 24px;}
  .workcont .workul a.on::after{height: 8px;width: 8px;right: 10px;border-top: 1px solid #878787;border-right: 1px solid #878787;}
  .workdown{margin-top: 12px;}
  .workdown ul{width: calc(100% + 7px);margin: 0 -3.5px;}
  .workdown ul li{padding: 3.5px;width: 50%;}
  .workdown ul li .text{font-size: 12px;line-height: 16px;}
  .workdown ul li .txt{font-size: 15px;}
  .workdown ul li:hover .text{opacity: 0;}
  .workdown ul li:hover a::after{opacity: 0;}
  .defaultCanvas{height: 350px;}
}

.abbanner{background: #BB4F33;height: 100vh;width: 100%;
float: left;}
.abbanner .abcont{position: relative;top: 50%;transform: translate(0,-50%);
float: left;
  width: 100%;}
.abbanner .left{font-size: 60px;color: #fff;font-family:  'myFirstFont';float: left;width: 30%;line-height: 60px;}
.abbanner .right{width: 70%;float: right;}
.abbanner .right .t1{font-size: 28px;color: #fff;font-weight: bold;padding-top: 50px;position: relative;}
.abbanner .right .t1::after{content: "";width: 125px;height: 12px;
background: #fff;top: 0;left: 0;position: absolute;}
.abbanner .right .t2{font-size: 24px;color: #fff;line-height: 48px;
margin: 20px 0 100px 0;letter-spacing: 2px;font-weight:lighter;text-align: justify;}

.abbanner .right .t3{font-size: 100px;color: #fff;line-height: 114px;font-family: 'myFirstFont';}

@media (max-width: 1600px){
  .abbanner .left{font-size: 55px;line-height: 55px;}
  .abbanner .right .t1{font-size: 24px;padding-top: 40px;}
  .abbanner .right .t2{font-size: 20px;line-height: 40px;margin: 15px 0 60px 0;}
  .abbanner .right .t3{font-size: 70px;line-height: 85px;}
}
@media (max-width: 1400px){
  /* .abbanner{padding-top: 150px;} */
  .abbanner .left{font-size: 40px;line-height: 40px;}
  .abbanner .right .t1{padding-top: 28px;}
  .abbanner .right .t2{margin: 15px 0 40px 0;}
  .abbanner .right .t3{font-size: 50px;line-height: 65px;}
  .abbanner .right .t1::after{width: 100px;height: 8px;}
}
@media (max-width: 1024px){
  /* .abbanner{padding-top: 150px;} */
  .abbanner .left{font-size: 30px;line-height: 40px;width: auto;
  border-bottom:5px solid #fff;}
  .abbanner .right{width: 100%;}
  .abbanner .right .t1::after{display: none;}
  .abbanner .right .t1{padding-top: 45px;font-size: 14px;line-height: 24px;}
  .abbanner .right .t2{margin: 15px 0 60px 0;font-size: 12px;
  line-height: 24px;font-weight: inherit;}
  .abbanner .right .t3{font-size: 30px;line-height: 40px;}
  .abbanner .right .t1::after{width: 100px;height: 8px;}
  .abbanner .abcont{padding-top: 150px;
  top: 0;transform: translate(0);}
}




.think{float: left;width: 100%;padding-bottom: 150px;}
.think .thdown{float: left;width: 100%;margin-top: 100px;}
.think .thdown .svgal{width: 49%;float: left;}
.think .thdown .textr{width: 51%;float: right;padding-left: 30px;}


.think .thdown .textr .tit{font-size: 41px;color: #ffffff;margin-top: 40px;}
.think .thdown .textr .st{font-size: 42px;color: #ffffff;margin:70px 0 40px 0;}
.think .thdown .textr .info{font-size: 24px;color: #ffffff;line-height: 48px;letter-spacing: 1px;}

.team .teamul{margin-top: 100px;float: left;width: 100%;}
.team .teamul ul{width: calc(100% + 30px);margin: -15px;float: left;
display: flex;flex-wrap: wrap;}
.team .teamul ul li{padding: 15px;width: 33.3%;float: left;position: relative;}
.team .teamul ul li:hover a::after{content: "";height: 100%;width: 100%;
top: 0;left: 0;background: rgba(0,0,0,0.2);position: absolute;}

.team .teamul ul li a{width: 100%;float: left;display: block;position: relative;}
.team .teamul ul li .pic{width: 100%;}
.team .teamul ul li .pic img{width: 100%;}

.team .teamul ul li .text{position: absolute;bottom: 20px;z-index: 2;
width: calc(100% - 50px);left: 25px;transition: all .5s ease;opacity: 0;}
.team .teamul ul li:hover .text{opacity: 1;}

.team .teamul ul li .text .etit{font-size: 44px;color: #fff;font-family:'myFirstFont';}
.team .teamul ul li .text .est{font-size: 24px;color: #fff;margin:5px 0 12px 0;}
.team .teamul ul li .text .zif{font-size: 24px;color: #fff;line-height: 30px;}
@media (max-width: 1600px){
  .think .thdown .textr .tit{font-size: 30px;color: #ffffff;margin-top: 30px;}
  .think .thdown .textr .st{font-size: 36px;margin:50px 0 30px 0;}
  .think .thdown .textr .info{font-size: 20px;line-height: 40px;letter-spacing: 1px;}
  .team .teamul ul li .text .etit{font-size: 34px;}
  .team .teamul ul li .text .est{font-size: 20px;}
  .team .teamul ul li .text .zif{font-size: 20px;line-height: 28px;}
  .team .teamul ul li .text{width: calc(100% - 20px);left: 10px}
}
@media (max-width: 1400px){
  .think .thdown .textr .tit{font-size: 30px;color: #ffffff;margin-top: 30px;}
  .think .thdown .textr .st{font-size: 36px;margin:50px 0 30px 0;}
  .think .thdown .textr .info{font-size: 20px;line-height: 40px;letter-spacing: 1px;}

  .team .teamul ul li .text .etit{font-size: 28px;}
  .team .teamul ul li .text .est{font-size: 16px;}
  .team .teamul ul li .text .zif{font-size: 16px;line-height: 24px;}
}

@media (max-width: 1024px){
  .think .thdown{margin-top: 20px;}
  .think .thdown .svgal{width: 100%;}
  .think .thdown .textr{width: 100%;padding-left: 0;}
  .think .thdown .textr .tit{font-size: 12px;}
  .think .thdown .textr .st{font-size: 14px;font-weight: bold;margin: 8px 0 15px 0;}
  .think .thdown .textr .info{font-size: 12px;line-height: 22px;}
  .think{padding-bottom: 20px;}
  .team .logott br{display: none;}

  .team .teamul ul{width: calc(100% + 10px);margin:-5px;}
  .team .teamul ul li{width: 50%;padding:5px;float: left;}
  .team .teamul{margin-top: 8px;}
  .team .teamul ul li .text{bottom:5px;left: 7px;width:calc(100% - 15px);}

  .team .teamul ul li .text .etit{font-size: 17px;}
  .team .teamul ul li .text .est{font-size: 12px;margin: 3px 0 5px 0;}
  .team .teamul ul li .text .zif{font-size: 12px;line-height: 16px;}
  .step::after{display: none;}
}


@keyframes move2
{
  0% {transform: translate(0px,0);}
  50%{transform: translate(20px,0)}
  100% {transform: translate(0px,0);}
}
@-webkit-keyframes move2 /* Safari 与 Chrome */
{
  0% {transform: translate(0px,0);}
  50%{transform: translate(20px,0)}
  100% {transform: translate(0px,0);}
}
.news{float: left;width: 100%;padding-top: 150px;}
.news ul{margin-top:100px;float: left;width: 100%;}
.news ul li{margin-bottom: 50px;}
.news ul li:last-child{margin-bottom: 0;}
.news ul li .pic{width: 55%;float: left;}
.news ul li .text{width: 45%;float: right;padding: 120px 90px 0 80px;}
.news ul li .pic img{width: 100%;vertical-align: bottom;}
.news ul li a{display: flex;background: #DFF0F1;}
.news ul li h4{color: #000000;font-size: 48px;font-weight: bold;}
.news ul li h6{color: #666666;font-size: 16px;line-height: 43px;margin: 50px 0 180px 0;}
.news ul li .more{font-size: 20px;color: #000;display: flex;
align-items: center;font-weight: 100;transition: all .5s ease;}
.news ul li .more img{animation: move2 1.5s ease infinite;}
.news ul li .more img{margin-left: 10px;}
.newshow{width: 840px;margin: 0 auto;padding-top: 220px;padding-bottom: 60px;}
.newshow h1{font-size: 48px;color: #000000;line-height: 50px;}
.newshow .time{font-size: 16px;color: #666666;line-height: 18px;margin-top: 7px;}
.newshow .content{font-size: 16px;line-height: 43px;color: #666666;margin-top: 50px;text-align: justify;}
.newshow .content img{width: 100%;vertical-align: bottom;}
@media (max-width: 1600px){
  .news ul li .text{padding: 80px 50px 0 50px;}
  .news ul li h4{font-size: 40px;}
  .news ul li h6{line-height: 36px;margin: 40px 0 120px 0;}
  .news ul li .more{font-size: 18px;}
}
@media (max-width: 1400px){
  .news ul li .text{padding: 60px 40px 0 40px;}
  .news ul li h4{font-size: 34px;}
  .news ul li h6{line-height: 30px;margin: 30px 0 80px 0;}
  .news ul li .more{font-size: 16px;}
  .news ul li:hover .more{transform: translate(10px,0);}
  .newshow h1{font-size: 40px;line-height: 48px;}
  .newshow .content{font-size: 14px;line-height: 36px;}
}
@media (max-width: 1300px){
  .news ul li h6{line-height: 30px;margin: 30px 0 30px 0;}
}
@media (max-width: 1200px){
  .news ul li h6{line-height: 30px;margin: 30px 0 20px 0;}
}
@media (max-width: 1024px){
  .newshow{width: 100%;padding: 70px 15px 30px 15px;}
  .newshow h1{font-size: 30px;}
  .newshow .content{font-size: 14px;line-height: 28px;margin-top: 30px;}

  .news{padding-top: 35px;}
  .news ul{margin-top: 5px;}
  .news ul li a{flex-direction: column;background: transparent;position: relative;}
  .news ul li .pic{width: 100%;}
  .news ul li .text{width: 100%;padding: 0 10px;
  background:rgba(0,0,0,0.4);bottom: 0;left: 0;
  width: 100%;position: absolute;}
  .news ul li .pic img{height: 160px;object-fit: cover;object-position: bottom;}
  .news ul li h4{font-size: 12px;line-height: 24px;color: #fff;}
  .news ul li h6{display: none;}
  .news ul li .more{display: none;}
  .news ul li{margin-bottom: 10px;}
}






.joinc{float: left;width: 100%;padding-top: 150px;}
.joinc .joinbg{background: #fff;float: left;width: 100%;
padding:90px  220px 145px 84px;}
.joinc .joinbg .jtit{width: 100%;font-size: 56px;font-weight: bold;color:#000000;
padding-bottom: 30px;border-bottom: 13px solid #000;margin-bottom: 20px;}
.joinc .joinbg .jwidth{width: 65%;float: right;}
.joinc .joinbg .jwidth h4{font-size: 36px;color:#000000;line-height: 40px;
margin-bottom:25px;font-weight: bold;margin-top: 70px;}

.joinc .joinbg .jwidth .inf{padding-left:30px;position: relative;
font-size:24px;color:#000000;line-height: 40px;font-weight: lighter;}
.joinc .joinbg .jwidth .inf::after{content: "";height: 11px;width: 11px;border-radius: 50%;
position: absolute;left: 1px;background: #000000;top: 14px;}

.joinc .joinbg .jwidth .jianl{display: flex;align-items: center;padding-bottom: 30px;
border-bottom: 2px solid #000000;margin-top:60px;}
.joinc .joinbg .jwidth .jianl h6{font-size: 24px;color: #000;
  margin-left:15px;font-weight: lighter;}


@keyframes move
{
    0% {transform: translate(0,-20px);}
    50% {transform: translate(0,-0px)}
    100% {transform: translate(0,-20px)}
}
@-webkit-keyframes move /* Safari 与 Chrome */
{
    0% {transform: translate(0,-20px);}
    50% {transform: translate(0,-0px)}
    100% {transform: translate(0,-20px)}
}


@keyframes move1
{
  0% {transform: translate(0,-10px);}
  50% {transform: translate(0,-0px)}
  100% {transform: translate(0,-10px)}
}
@-webkit-keyframes move1 /* Safari 与 Chrome */
{
    0% {transform: translate(0,-10px);}
    50% {transform: translate(0,-0px)}
    100% {transform: translate(0,-10px)}
}
.form{float: left;width: 100%;padding: 0 !important;
display: flex;justify-content: flex-end;position: relative;}
.form .bgp{width: 100%;}
.form .bgp img{width: 100%;height: 100%;object-fit: cover;
  object-position: top left;}

  .form .dingw{left: 33.5%;}
  .form .dingw{position: absolute;top: 10%;
    top: 15%;animation: move 1.5s ease infinite;}
  @media (max-width: 1920px){
    .form .dingw{left: 33.3%;}
  }
.form .biaod{width: 340px;margin-top: 240px;position: absolute;
right: 265px;}

.form .ftit{font-size: 60px;font-family:'myFirstFont';color:#fff;margin-bottom:50px;}
.form .fli h4{color: #fff;font-size: 18px;opacity: 0.5;margin-top: 18px;}
.form .fli h6{color: #fff;font-size: 16px;line-height: 30px;padding-bottom: 15px;
border-bottom: 1px solid #FFFFFF;margin-top: 4px;}
.form .fli a{height: 40px;width: 135px;border: 1px solid #fff;
line-height: 40px;text-align: center;border-radius: 10px;float: right;
color: #fff;font-size:17px;margin-top: 30px;display: none;}
.form .fli a:hover{background: #000;border: 1px solid #000;}


@media (max-width: 1600px){
  .form .biaod{margin-top: 160px;right: 230px;}
  .form{padding: 0 230px;}
  .joinc{padding-top: 100px;}
  .joinc .joinbg{padding:70px 150px 125px 60px;}
  .form .dingw img{width: 24px;}
  .joinc .joinbg .jwidth h4{font-size: 30px;}
  .joinc .joinbg .jwidth .inf{font-size: 20px;padding-left: 20px;}
  .joinc .joinbg .jwidth .jianl h6{font-size: 20px;}
}
@media (max-width: 1540px){
 
}

/* @media (max-width: 1580px){
  .form .dingw{left: 515px;}
} */
@media (max-width: 1400px){
  .form .biaod{margin-top: 100px;right: 100px;}
  .form{padding: 0 100px;}
  .form .dingw img{width: 18px;}
  .joinc .joinbg .jtit{font-size: 40px;padding-bottom: 25px;border-bottom: 8px solid #000;}
  .joinc .joinbg .jwidth .inf{font-size: 18px;padding-left: 20px;}
  .joinc .joinbg .jwidth h4{font-size: 28px;line-height: 34px;margin-bottom: 18px;}
  .joinc .joinbg .jwidth .inf::after{height: 7px;width: 7px;}

}

@media (max-width: 1024px){
  .form .ftit{font-size: 30px;}
  .form{background: url(../img/pic36.jpg) center no-repeat;background-size: cover;position: relative;}
  .joinc{padding-top:30px}
  .joinc .joinbg{padding: 18px 20px 20px 17px;}
  .joinc .joinbg .jtit{font-size: 18px;padding-bottom: 6px;
    border-bottom: 3px solid #000;margin-bottom: 0;}
  .joinc .joinbg .jwidth{width: calc(100% - 20px);}
  .joinc .joinbg .jwidth h4{margin-top: 18px;font-size: 16px;margin-bottom: 0;}
  .joinc .joinbg .jwidth .inf{font-size: 12px;line-height: 18px;text-align: justify;
  font-weight: inherit;}
  .joinc .joinbg .jwidth .inf{padding-left: 12px;}
  .joinc .joinbg .jwidth .inf::after{height: 5px;width: 5px;top: 7px;}
  .joinc .joinbg .jwidth .jianl h6{font-size: 12px;margin-left: 5px;font-weight:inherit}

  .joinc .joinbg .jwidth .jianl img{height: 17px;width: 17px;}
  .joinc .joinbg .jwidth .jianl{margin-top: 15px;padding-bottom: 20px;}
  .form{padding: 0 0px;width: 100%;}
  .form .biaod{width: 100%;padding: 0 13px;position: absolute;
  right: 0;bottom: 70px;height: 80%;display: flex;flex-direction: column;
justify-content: space-between;}
  .form .fli h4{font-size: 12px;
    margin-top: 0px;
    padding-bottom: 0px;margin-right: 10px;
    line-height: 18px;}
  .form .fli h6{
    font-size: 12px;
      padding-bottom: 0px;
      line-height: 18px;
      margin-top: 0;
      border-bottom: 0;
  }
  .form .fli h6 br{display: none;}
  .form .fli a{width: 100px;height: 20px;margin-top: 10px;display: none;
  font-size: 12px;line-height: 18px;border-radius: 6px;}
  .form .dingw{top: 21%;left: 39.5%;animation: move1 1.5s ease infinite;}
  .form .dingw img{width: 12px;}
  .form .biaod .fli>div {display: flex;
    width: 100%;height: 30px;
      align-items: center;
    border-bottom: 1px solid #fff;}
}



.workb{width:100%;float: left;position: relative;}
.workb img{width: 100%;vertical-align: bottom;}
.workb .ktxt{font-size: 62px;color: #000000;line-height: 78px;
position: absolute;padding-top: 30px;left: 20%;top:33.3%;}
/* .workb .ktxt::after{position: absolute;content: "";
height: 4px;width: 118px;background: #000;top: 0;left: 0;} */
@media (max-width: 1600px){
  .workb .ktxt{font-size: 50px;line-height: 68px;
   padding-top: 26px;left: 16%;top:30%;}
  /* .workb .ktxt::after{position: absolute;content: "";
  height: 4px;width: 100px;background: #000;top: 0;left: 0;} */
}
@media (max-width: 1400px){
  .workb .ktxt{font-size: 40px;line-height: 55px;padding-top: 20px;}
  .workb .ktxt::after{width: 80px;}
}
@media (max-width: 1024px){
  .workb .ktxt{left: 13px;font-size: 18px;line-height: 23px;padding-top: 15px;top:45%;}
  .workb .ktxt::after{width: 37px;height:1px}
}


.products{float: left;width: 100%;padding-top:100px;background: #000;}
.products .prol{width: 33%;float: left;}
.products h4{font-size: 40px;font-family:'myFirstFont';color: #fff;opacity: 0.8;}
.products h6{font-size: 20px;line-height: 42px;color: #fff;opacity: 0.5;margin-top: 20px;font-weight:400;}

.products .pror{width: 67%;position: relative;float: right;}
.products .pror video{height: 100%;width: 100%;object-fit: cover;position: absolute;top: 0;left: 0;}
.products .pror img{width: 100%;vertical-align:bottom;}

.products .pror .play{height:120px;width: 120px;border:4px solid #fff;
border-radius: 50%;position: absolute;top: 50%;left: 50%;
display: flex;align-items: center;justify-content: center;
transform: translate(-50%,-50%);z-index: 2;cursor: pointer;}
.products .pror .play img{max-width: 40%;}
.products .propic{margin: 100px 0 0 0;float: left;width: 100%;}
.products .propic img{width: 100%;}

@media (max-width: 1600px){
  .products .pror .play{height:100px;width: 100px;}
  .products .propic{margin: 80px 0 0 0;}
}
@media (max-width: 1400px){
  .products .pror .play{height:70px;width: 70px}
  .products h4{font-size: 32px;}
  .products h6{font-size: 16px;line-height: 30px;}
  .products .propic{margin: 70px 0 0 0;}
}
@media (max-width: 1024px){
  .products .prol{width: 100%;}
  .products .pror{width: 100%;margin-top: 20px;margin-right: 0px;}
  .products{padding-top: 25px;}
  .products h6{font-size: 12px;line-height: 22.5px;opacity: 1;font-weight: inherit;}
  .products h4{opacity: 1;}
  .products .pror .play{height: 32px;width: 32px;border: 2px solid #fff;}
  .products .propic{margin: 25px 0 0 0;}
  .products .pror img{margin-left: 0px;}
  .products .pror .play img{margin-left: 4px;}
}



.serviceb{float: left;width: 100%;height: 100vh;background:#344484;position: relative;}
.serviceb .stit{color: #fff;font-size:60px;
  font-family:'myFirstFont';position: absolute;
left:100px;top: 170px;z-index: 1;}
.serviceb .spic{position: absolute;left: 50%;top: 50%;
transform: translate(-50%,-50%);}

.serviceb .spic{height: 100%;width: 100%;object-fit: cover;}

.textc{float: left;width: 100%;padding-top: 100px;padding-bottom: 100px;
display: flex;justify-content: space-between;}
.textc .textl{width: 43%;}
.textc .textl h4{color:#fff;font-size: 55px;font-family:'myFirstFont';line-height: 56px;}
.textc .textl h6{color:#fff;font-size: 30px;font-weight:lighter;
line-height: 48px;opacity: 0.5;margin-top: 55px;}
@media (max-width: 1600px){
  .serviceb .stit{font-size: 50px;top: 140px;}
  .textc{padding-bottom: 50px}
}
@media (max-width: 1400px){
  .serviceb .stit{font-size: 40px;top: 130px;}
  .textc .textl h4{font-size: 40px;line-height: 50px;}
  .textc .textl h6{font-size: 24px;line-height: 40px;margin-top: 40px;}
  .textc{padding-top: 80px;padding-bottom: 30px}
}
@media (max-width: 1024px){
  .serviceb .stit{display: none;}
  .serviceb .spic{width: calc(100% - 24px);margin-top: 0;height: auto;top: 50%;}
  .textc .textl h6{margin-top: 8px;font-weight: inherit;}
  .textc .textl:last-child{margin-top:15px;}
  #yliuc{height: 175px;}
}
#serq{width: 100%;}
#serd{width: 100%;}

.dataNums{position: relative;top: 50%;display: inline-block;
vertical-align:  top;height: 80px;margin-top: -35px;overflow: hidden;
text-align: center;}
.dataNums .dataOne{display: inline-block;margin: 0px;vertical-align:  top;
width:  54px;height: 80px;text-align: center;font-family:'myFirstFont';}
.dataNums .dataBoc{position: relative;width: 100%;height: 100%;float: left;}
.dataNums .dataBoc .tt{position: absolute;top: 0;left: 0;width: 100%;height: 100%;float: left;}
.dataNums .tt span{float: left;width: 100%;height: 100%;font-weight: 700;font-family:'myFirstFont';}
@media (max-width: 1600px){
  .dataNums{height: 60px;margin-top: -20px;}
  .dataNums .dataOne{height: 60px;width: 40px;}
}
@media (max-width: 1400px){
  .dataNums .dataOne{height: 60px;width: 30px;}
  .dataNums{margin-top: -15px;}
}
    body {
      width: 100%;
      overflow: hidden;
      /* overflow-y: auto; */
      max-width: 100%;
    }
@media (max-width: 1024px){

  .dataNums{display: flex;}
  .dataNums .dataOne{width: 15px;}
  .dataNums{margin-top: -14px;}
}
.sbtext i{position:relative;}
.sbtext i div{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
@media (max-width: 1024px) {
.sbanner.hidden-xs .sbtext #demoCanvas1 {
 
    right: 0px;
    left: auto !important;
    transform: translate(0px, -50%) !important;
}
.sbanner.hidden-xs .sbtext #demoCanvas3 {
  right: 0px;
  left: auto !important;
  transform: translate(0px, -50%) !important;
}
.sbanner.hidden-xs .sbtext #demoCanvas4 {
  right: 0px;
  left: auto !important;
  transform: translate(0px, -50%) !important;
}

.sbanner.hidden-xs .sbtext #demoCanvas5 {
  right: 0px;
  left: auto !important;
  transform: translate(0px, -50%) !important;
}
.sbanner.hidden-xs .sbtext #demoCanvas3 {
  right: 0px;
  left: auto !important;
  transform: translate(0px, -50%) !important;
}
}

.sbanner .sbtext>i{position: relative;transition: all .5s ease;display: inline-block;}
.sbanner .sbtext>i a{display:inline-block;}

.sbanner .sbtext>i:nth-child(1){transform: translate(50px,70px);}
.sbanner .sbtext>i:nth-child(2){transform: translate(0px,70px);}
.sbanner .sbtext>i:nth-child(4){transform: translate(-50px,0px);}
.sbanner .sbtext>i:nth-child(5){transform: translate(80px,-70px);}


.sbanner .sbtext>i:nth-child(7){transform:translate(60px,-50px);}
.liuc{width: 100%;float: left;}
@media (max-width: 1600px){
  .sbanner .sbtext{zoom: 0.7;}
}
@media (max-width: 1400px) {
  .sbanner .sbtext {zoom: 0.5;}
}
@media (max-width: 768px){
  .sbanner .sbtext{zoom: 0.6;margin-left: -100px;}
}
@media (max-width: 1024px){
  .sbanner .sbtext>i{transform: translate(0) !important;}
  .sbanner .sbtext>i:nth-child(4){transform: translate(-80px,0px) !important;}
  .sbanner .sbtext{zoom: 1;}
  #serq{height: 155px;}
  #serd{height: 155px;}
  .liuc{margin: 30px 0;}
  .liuc{width: calc(100% + 20px);margin-left: -10px;}
  .sbanner .sbtext{zoom: 0.6;margin-left: 0px;}
  .sbanner{right:-130vw}
}


#wliuc{height: 500px;}

/* .svga1>div{margin-top: -47px;margin-left: -8px;}
.svga2>div{margin-top: -45px;}
.svga3>div{margin-top: -16px;margin-left: -68px;}
.svga4>div{margin-top: -16px;}
.svga5>div{margin-left: 78px;margin-top: -5px;}
@media (max-width: 1600px){
  .sbtext i div{transform:translate(-50%,-50%)scale(0.73) !important}
  .svga3>div{margin-top: -11px;margin-left: -52px;}
  .svga5>div{margin-left: 54px;margin-top: -5px;}
  .svga4>div{margin-top: -14px;}
  .svga1>div{margin-top: -36px;margin-left: -8px;}
  .svga2>div{margin-top: -33px;}
} */
.ndivb{height: 100vh;width: 100vw;background: #000;float: left;width: 100%;}
.ndivb video{height: 100vh;width: 100vw;object-fit: cover;}
.ndivb .mp4{display: none;}

.picl .slick-list{width: calc(100% + 40px);margin: 0 -20px;}



#demoCanvas1{display: none;}
#demoCanvas2{display: none;}
#demoCanvas3{display: none;}
#demoCanvas4{display: none;}
#demoCanvas5{display: none;}

#demoCanvas6{display: none;}
#demoCanvas7{display: none;}
#demoCanvas8{display: none;}
#demoCanvas9{display: none;}
#demoCanvas10{display: none;}

.picu>div>div{position: absolute;top: 50%;left: 50%;
transform: translate(-50%,-50%);}
.achieve{float: left;width: 100%;padding-top: 145px;}
.achieve .actit{color: #fff;font-size: 48px;width: auto;font-weight: bold;
padding-bottom: 15px;border-bottom: 4px solid #fff;display: inline-block;}
.achieve .abl{width: 36%;float: left;}
.achieve .abr{width: 64%;float: right;padding-left: 60px;}
.achieve .abr .rtit{font-size: 40px;color: #fff;font-weight: bold;
padding-bottom: 16px;width: 75%;border-bottom:1px solid #fff;margin-top: 100px;}

.achieve .abr .t1{font-size: 18px;color:#fff;margin:20px 0 16px 0;font-weight: bold;}
.achieve .abr .t2{font-size: 18px;color:#fff;margin:0px 0 28px 0;font-weight:lighter;}
.achieve .abl{display: flex;flex-direction: column;align-items: center;margin-top: 100px;}
.achieve .abl .cirtt{color: #fff;font-size: 34px;margin:15px 0;}
@media (max-width: 1800px){
  .achieve .abr .rtit{width: 90%;}
}

@media (max-width: 1600px){
  .achieve .abr .t2{font-size: 17px;}
  .achieve .abr .rtit{width: 100%;}
}
@media (max-width: 1400px){
  .achieve .abr .rtit{font-size: 34px;padding-bottom: 12px;margin-top: 130px;}
  .achieve .abr .t1{font-size: 16px;margin:15px 0 10px 0;}
  .achieve .abr .t2{font-size: 15px;margin:0px 0 20px 0;}
  .achieve .abl{margin-top: 80px;}
  .achieve .abl .cirtt{font-size: 26px;margin:0px 0;}
  .achieve .abl{width: 30%;}
  .achieve .abr{width: 70%;padding-left: 50px;}
}
@media (max-width: 1300px) {
  .achieve .abr .rtit{margin-top: 120px;}
}
@media (max-width: 1200px) {
  .achieve .abr .rtit{margin-top: 110px;}
}

/* @media (max-width: 1024px){
    .sbanner.hidden-xs{display: none !important;}
    .sbanner.visible-xs{display: block !important}
} */
    
@media (max-width: 1024px){
  .ndivb video{display: none;}
  .achieve{padding-top: 26px;}
  .achieve .actit{font-size: 18px;padding-bottom:10px;border-bottom: 3px solid #fff;}
  .achieve .abr .rtit{margin-top: 25px;font-size: 12px;padding-bottom: 5px;}
  .achieve .abr .t1{font-size: 12px;margin:6px 0 3px 0;}
  .achieve .abr .t2{font-size: 12px;margin:4px 0 4px 0;font-weight: inherit;}
  .achieve .abl{margin-top: 30px;width: 150px;}
  .achieve .abr{width:100%;padding-left:0px;}
  .achieve .abl .cirtt{margin: 60px 0;}
  .achieve .abl{width:100%;flex-direction: row;}
  #serq{width:calc(50% - 10px);height:172px}
  #serd{width:calc(50% - 10px);height:172px}
 
    .sbanner.hidden-xs .sbtext{
    display: flex;
      flex-wrap: wrap;
      justify-content: center;}
}

         @media (max-width: 900px){
  .sbanner.hidden-xs .sbtext {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
    }
         }
@media (max-width: 600px) {

       
}
.step{margin-top: 200px;float: left;width: 100%;position: relative;}
.step::after{content: "";height:100%;width: 100%;position: absolute;
left: 0;top: 0%;background: #000;}
.step.on::after{left: 100%;transition:all 2s ease;}


.step .box{position: absolute;opacity: 0;transform: translate(0,10px);
transition: all .5s ease;}
.step .box.on{opacity: 1;transform: translate(0);}
.step .box .circle{height: 20px;width: 20px;border-radius: 50%;
background: #fff;margin: 0 auto;}
.step .box .con1t{font-size:22px;color: #ffffff;text-align: center;
margin-top: 38px;white-space: nowrap;}
.step .box .con2t{width: 180px;height: 130px;border: 1px solid #fff;
margin-bottom: 85px;position: relative;
display: flex;align-items: center;flex-direction: column;justify-content: center;}
.step .box .con2t::after{content: "";height: 85px;width: 1px;
background: #fff;position: absolute;bottom: -85px;
left: 50%;transform: translate(-50%,0);}
.step .box .con2t h4{font-size:20px;color: #fff;font-weight: bold;margin-bottom: 12px;}
.step .box .con2t h6{font-size:20px;color: #fff;}
.step .cpic{opacity: 0;transition: all .5s ease;transition-delay: 0.2s;}
.step .cpic img{width: 100%;}
.step .cpic.on{opacity: 1;}
.step .box{transition-delay: 0s;}
.step.on .box1{left: 2.5%;bottom: -73.5px;transition-delay: 1.4s;}
.step.on .box2{left: 14%;bottom: -73.5px;transition-delay: 1.6s;}
.step.on .box3{left: 28%;bottom: -73.5px;transition-delay: 1.8s;}
.step.on .box4{left: 41%;bottom: -73.5px;transition-delay: 2s;}
.step.on .box5{left: 54%;bottom: -73.5px;transition-delay: 2.2s;}
.step.on .box6{left: 68%;bottom: -73.5px;transition-delay: 2.4s;}
.step.on .box7{left: 83%;bottom: -54px;transition-delay: 2.6s;}
.step.on .box8{left: 94%;top: -100px;transition-delay: 2.8s;}
.sbook{width: 100%;float: left;margin-top:230px;}

@media (max-width: 1600px){
  .step .box .con2t{width: 140px;height: 100px;}
  .step .box .con2t h4{font-size:14px;margin-bottom:8px;}
  .step .box .con2t h6{font-size:14px;}
  .sbook{margin-top:-140px;height: 590px;margin-bottom: 100px;}
}
@media (max-width: 1400px){
   .step .box7{bottom: -56px;}
   .sbook{margin-top:-200px;}
}
@media (max-width: 1400px){
  .step .box .con2t{width: 120px;height: 80px;}
  .step .box .con1t{font-size: 16px;}
  .step .box .circle{height: 12px;width: 12px;}
  .step .box .con2t{margin-bottom: 60px;}
  .step .box .con2t::after{height: 60px;bottom: -60px;}
.step .box1{bottom: -63.5px;}
.step .box2{bottom: -63.5px;}
.step .box3{bottom: -63.5px;}
.step .box4{bottom: -63.5px;}
.step .box5{bottom: -63.5px;}
.step .box6{bottom: -63.5px}
.step .box7{bottom: -50px;}
.sbook{height: 530px}
}
@media (max-width: 1024px){
  .sbook{height: 170px;}
  .think .logott br{display: none;}
  .think .logott .kg{margin: 0 5px;}
  .team .logott .kg{margin: 0 5px;}
  .logol .logott .kg{margin: 0 5px;}

  .step .box .con2t{width: 90px;height: 36px;}
  .step .box .con2t h4{font-size:12px;margin-bottom:2px;}
  .step .box .con2t h6{font-size:12px;}
  .step .box .con2t::after{height: 15px;}
  .step .box .con1t{font-size: 12px;margin-top: 3px;}
  .step .box .circle{height: 5px;width: 5px;}
  .step .box .con2t{margin-bottom: 15px;}

  .step .box1{top: -2.5px;left: 0;bottom: auto;}
  .step .box2{top: -53.5px;left: 20%;bottom: auto;}
  .step .box3{top: -53.5px;left: 47.5%;bottom: auto;}
  .step .box4{top: -53.5px;right: 0%;bottom: auto;left: auto;}
  .step .box5{top: 27px;right: 0%;bottom: auto;left: auto;display: flex;flex-direction: column-reverse;}
  .step .box5 .con1t,.step .box6 .con1t,.step .box7 .con1t{margin-bottom: 3px;}
  .step .box5 .con2t::after,.step .box6 .con2t::after,.step .box7 .con2t::after{top: -15px;}
  .step .box5 .con2t,.step .box6 .con2t,.step .box7 .con2t{margin-top: 15px;}

  .step .box6{top: 27px;left: 47.5%;display: flex;flex-direction: column-reverse;justify-content: flex-end;}
  .step .box7{top: 27px;left: 20%;bottom: auto;
   display: flex;flex-direction: column-reverse;justify-content: flex-end;}
  .step .box8{top: 27px;left: 0;
  display: flex;flex-direction: column-reverse;justify-content: flex-end;}
  .step .box{width: 90px;}
  .step .box .con2t::after{bottom: -15px;}
  .step{margin-top: 80px;}
  .sbook{margin: 0px 0 25px 0;}
  .textc{padding-top:0px;padding-bottom: 0px;flex-direction: column;}
  .textc .textl{width: 100%;}
  .textc .textl h4{font-size: 12px;line-height: 14px;}
  .textc .textl h4 br{display: none;}
  .textc .textl h6{font-size: 12px;line-height: 14px;}
  #sesy{height: 171px;}
 

}
#sesy{width: 100%;float: left;}
.picu>div{position: relative;}
.picu .wsvg1{height: 115px;}
.picu .wsvg1 img{height: 115px;}
#demoCanvas6{height: 115px;width: 100%;margin-left: 38px;}
#demoCanvas66{height: 115px;width: 100%;margin-left: 38px;}

.picu .wsvg2{height: 92px;}
.picu .wsvg2 img{height: 92px;}
#demoCanvas7{height: 92px;width: 100%;margin-left: 50px;}
#demoCanvas77{height: 92px;width: 100%;margin-left: 50px;}
.picu .wsvg3{height: 89px;}
.picu .wsvg3 img{height: 89px;}
#demoCanvas8{height: 89px;width: 100%;margin-left: 28px;}

.picu .wsvg4{height: 106px;}
.picu .wsvg4 img{height: 106px;}
#demoCanvas9{height: 106px;width: 100%;margin-left: 18px;}

.picu .wsvg5{height: 91px;}
.picu .wsvg5 img{height: 91px;}
#demoCanvas10{height: 91px;width: 100%;margin-left: 18px;}
#demoCanvas101{height: 91px;width: 100%;margin-left: 18px;}
@media (max-width: 1024px){
  /* #demoCanvas6{width: 67%;} */
  #demoCanvas7{width: 47%;margin-right: -20px;}
  #demoCanvas8{width: 67%;margin-right: -53px;}
  #demoCanvas9{width: 67%;margin-left: 250px;}
  #demoCanvas10{width: 67%;margin-right: -40px;}
  #demoCanvas6{margin-right:-70px;}



  #demoCanvas66{width: 67%;}
  #demoCanvas77{width: 47%;margin-right: -20px;}
  #demoCanvas8{width: 67%;margin-right: -53px;}
  #demoCanvas9{width: 67%;margin-left: 250px;}
  #demoCanvas101{width: 67%;margin-right: -40px;}
  #demoCanvas6{margin-right:-70px;}
  #demoCanvas66{margin-right:-70px;}

  .ndivb .mp4{display: block !important;position: relative;
  z-index: 200}
.ndivb{position: relative;
  z-index: 80}
    .sbanner a{position: relative;}
    #demoCanvas6{position: absolute;width: auto; right: -50px;top:0}

#demoCanvas8{position: absolute;right:-90px;width: auto;}
    #demoCanvas10{position: absolute;right:-115px;width: auto;}
     #demoCanvas7{position: absolute;right:-100px;width: auto;}
            #demoCanvas9 {
              position: absolute;
              right: -155px;
              width: auto;
            }
}
.picu{display: flex;flex-direction: column;transform: translate(-60px, 0px)scale(1.2);
transition: all .5s ease;}


video::-webkit-media-controls-timeline {
  display: none;
}



.jiazai{ float:left; width:100%; margin-top:20px;  text-align:center;}				
.jiazai a{  color:#fff; font-size:14px; line-height:42px;}
@media (max-width: 1024px) {
  .picu {
      display: flex;
      flex-direction: column;
      transform: translate(-150px, 0px)scale(1.2);
      transition: all .5s ease;
    }
    .jiazai{margin-top:10px; }	
    .jiazai a{font-size:12px; line-height:30px;}
}
@media (max-width: 500px) {
.picu {
    display: flex;
    flex-direction: column;
    transform: translate(-60px, 0px)scale(1.2);
    transition: all .5s ease;
  }
}
.loadingbg{height:100vh;width: 100vw;background: #000;bottom: -100vh;
  position: fixed;z-index: 99;}
   @keyframes myfirst
{
  0% {bottom: -100vh;}
  40% {bottom: 0;}
  60%{bottom: 0;}
  100%{bottom: 100vh;}
}

    @-webkit-keyframes revealText {
      from {
        opacity: 0;
        transform: translate(0%, 100%) matrix(1, 0, 0, 1, 0, 0);
      }
  
      to {
        opacity: 1;
        transform: translate(0%, 0%) matrix(1, 0, 0, 1, 0, 0);
      }
    }
  
    @keyframes revealText {
      from {
        opacity: 0;
        transform: translate(0%, 100%) matrix(1, 0, 0, 1, 0, 0);
      }
  
      to {
        opacity: 1;
        transform: translate(0%, 0%) matrix(1, 0, 0, 1, 0, 0);
      }
    }
  
    .logott>div>div {
      font-family: 'myFirstFont';
    }


    @media (max-height: 450px){
      .sbanner.visible-xs{display: block !important;}
      .sbanner .sbtext{zoom: 0.5;}
    }
