*{
    font-weight: 400;
    /* font-family: "Microsoft YaHei" ! important; */
    /* font-family: 微软雅黑; */
    /* font-family:"Microsoft YaHei",Arial,Helvetica,sans-serif,"宋体"; */
    font-family:"Microsoft YaHei",微软雅黑,"Microsoft JhengHei",华文细黑,STHeiti,MingLiu
  }
  a,a:hover,a:active,a:visited,a:link{ 
    text-decoration:none;
    color: #dadada;
  }
  .min-width{
    min-width:1360px;
  }
  .max-width{
    max-width: 1740px
  }
  .wrap{
    padding: 0 40px;
  }
  .row{
    margin: 0 auto;
  }

  /* 头部 */
  .header{
    background: url('../../img/head_bj01.jpg');
    background-size: cover;
    height:796px;
  }
    /* 导航栏 */
  .nav{
    height: 65px;
    line-height: 65px;
    padding: 0 50px;
    border-bottom: 1px solid #dadada; 
    width: 100%;
    position: fixed;
    width: 100%;
    top: 0;
    transition: background-color  0.6s linear;
    min-width:1000px;
    z-index: 999
  }
  .navigator{
    height: 65px;
    float: right;
    margin: 0 0 0 50px;
    color: #dadada;
    font-size: 21px;
    cursor: pointer;
    width: 98px;
    text-align: center;
  }
  .navigator a{
    display: block;
    height: 65px;
    line-height: 65px;
  }
  .navigator:hover{
    color: #ffffff;
    font-size: 22px;
    border-bottom: 4px solid #ffffff;
    font-weight: 500;
  }
  .navigator:hover a{
    color: #ffffff;
  }
  .navFixed{
    background: rgba(0, 0, 0, 0.80);
    position: fixed;
    top: 0;
    z-index: 999;
    border: 0;
    /* box-shadow: 0 1px 1px #ffffff; */
    min-width:1000px;
  }
  .navActive{
    color: #ffffff;
    font-size: 22px;
    border-bottom: 4px solid #ffffff;
    font-weight: 500;
  }
  .navActive a{
    color: #ffffff;
  }


    /* 头部标题 */
  .title{
    color: #ffffff
  }
  .title h1{
    font-size: 80px;
    margin: 140px 0 35px 0;
  }
  .title h3{
    font-size: 36px;
    margin-bottom: 35px;
  }
  .title img{
    margin-bottom:30px
  }
  .title .learn-more{
    width: 230px;
    height: 56px;
    background-color:#e33563;
    line-height: 56px;
    font-size: 22px;
    border-radius:30px;
    text-align: center;
  }

  /* about take */
  .about{
    background-color:#f9f9f9;
  }
  .about h1 {    
    font-size: 58px;
    color: #4d5a6f;
    position: relative; 
    margin: 70px 0 20px 0;
    letter-spacing:6px;
  }
  h1 span:before,h1 span:after {
    content: '';                
    position: absolute;        
    top: 52%;
    background: #4d5a6f;       
    width: 100px;
    height: 3px;
  }
  h1 span:before{
    margin-left: -140px;
  }
  h1 span:after {
    margin-left: 40px;
  }
  .about h3{
    font-size: 26px;
    color: #7d8eaa;
  }
  .about .description{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 100px 0;
    height: 630px;
  }
  .about .description .img img{
    margin-bottom: 50px;
  }
  .about .description h4{
    color: #7d8eaa;
    font-size: 23px;
    line-height: 2em;
  }

  /* product */
  .product{
    /* height: 1320px; */
    background-color: #ffffff;
  }
  .product h1{
    font-size: 58px;
    color: #4d5a6f;
    position: relative; 
    margin: 70px 0 20px 0;
    letter-spacing:12px;
  }
  .product h3{
    font-size: 26px;
    color: #7d8eaa;
  }
  .box{
    padding: 18px 18px;
  }
  .product .bg{
    width: 100%;
    height: 100%;
  }
  .boxImg{
    position: relative;
  }
  .showInfo{
    color:#ffffff;
    overflow: hidden; 
    position: absolute;
    bottom: 0px;
    height: 100px;
    /* height: 100%; */
    width: 100%;
    transition:height 0.2s linear;
    text-align: center;
    padding: 0 50px;
  }
  .showInfo .line{
    width: 40px;
    border-bottom: 3px solid #ffffff;
    margin: 20px auto;
  }
  .showInfo h2{
    font-size: 30px;
    margin: 0px 0 7% 0;
  }
  .showInfo p{
    font-size: 20px;
    text-align: left;
    margin: 0;
    letter-spacing:1px;
  }
  .download{
    width: 220px;
    height: 60px;
    margin: 6% auto;
    cursor: pointer;
    display: block;
  }
  .download p{
    font-size: 18px;
    margin: 6px 0 0 0;
    height: 20px;
    line-height: 20px;    
    text-align: center;
    font-weight: 500;
  }
  .box:hover .showInfo{
    height: 100%;
    background: #e3356378;
    padding: 12% 50px;
  }

  /* cooperation */
  .cooperation{
    background: url('../../img/f03_bj.jpg');
    background-size: cover;
    /* height: 630px; */
    /* padding-bottom: 60px; */
  }
  .cooperation h1{
    font-size: 58px;
    color: #4d5a6f;
    position: relative; 
    margin: 70px 0 20px 0;
    letter-spacing:6px;
  }
  .cooperation h3{
    font-size: 26px;
    color: #7d8eaa;
  }
  .brands{
    width: 100%;
    /* height: 360px; */
    background: rgba(255, 255, 255, 0.3);
    text-align: center;
    padding: 50px 0 30px 0;
    margin-bottom: 60px;
  }
  .grid{
    display: flex;
    flex-wrap:wrap;
    justify-content: space-around;
    align-content:center;
    /* height: 360px; */
    transition:height 0.2s linear;
  }
  .brand{
    width:17%;
    height: 70px;
    margin: 30px 0;
  }
  .brand img{
    width: 100%
  }
  .more{
    color: #4d5a6f;
    font-size: 22px;
    font-weight: 300;
    height: 60px;
    line-height: 85px;
  }
  .more span:hover{
    font-weight: 500;
    cursor: pointer;
  }
  .isHide{
    display: none;
  }

  /* contact us */
  .contact{
    height: 630px;
    background:#7d8eaa;
    box-shadow: 0 -1px 1px #687da0;
  }
  .contact h1{
    font-size: 58px;
    color: #ffffff;
    position: relative; 
    margin: 70px 0 40px 0;
    letter-spacing:6px;
  }
  .contact h1 span:before,.contact h1 span:after {
    background: #ffffff;       
  }
  .contact .infos{
    width: 100%;
    display: flex;
    justify-content: space-between;
    height: 44px;
    line-height: 44px;
    margin: 40px 0px;
    color: #ffffff;
    font-size: 19px;
  }
  .infos img{
    vertical-align: top;
  }

  /* bottom */
  .bottom{
    background:#292d36;
    height: 630px;
  }
  .form{
    color: #ffffff;
    font-size: 23px;
  }
  .form input{
    margin: 8px 0;
    border-radius: 0;
    background: #565960;
    color: #ffffff;
    border: 0;
    height: 48px;
    line-height: 48px;
    font-size: 18px;
    font-weight: 300 !important;
  }
  .form input ::-webkit-input-placeholder{
    font-size: 18px;
    line-height: 48px;
    font-weight: 300 !important;
  }
  .form textarea{
    font-size: 18px;
    font-weight: 300 !important;
  }
  .form textarea ::-webkit-input-placeholder{
    font-size: 18px;
    line-height: 48px;
    font-weight: 300 !important;
  }
  .form button{
    margin: 8px 0 ;
    background: #e33563;
    height: 50px;
    line-height: 0px;
    color: #ffffff;
    text-align: center;
    border-radius: 0;
    border: 0;
    font-size: 21px;
    font-weight: 500;
    cursor: pointer;
  }
  .swiper-container {
    width: 100%;
    height: 354px;
  }
  .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
  }

  /* footer */
  footer{
    color: #767e91;
    font-size: 14px;
    background: #191a1e;
    text-align: center;
    height:50px;
    line-height: 50px;
    font-weight: 500;
  }