.common-banner video{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.about-nav{
    margin-top: 0.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.about-nav-a{
    width: 1.64rem;
    height: 0.37rem;
    border-radius: 0.08rem;
    border: 0.01rem solid #fff;
    margin: 0 0.1rem;
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.about-nav-a:hover{
    background: #fff;
    color: #333;
}
.about-nav .active{
    background: #fff;
    color: #333;
}
.product-nav .about-nav-a{
    border-color: #000;
    color: #333;
}
.product-nav .about-nav-a:hover{
    background: #000;
    color: #fff;
}
.product-nav .active{
    background: #000;
    color: #fff;
}

.product-wrap{
    width: 100%;
    min-height: 10.8rem;
    position: relative;
    overflow: hidden;
    z-index: 2;
}
.product-caption .common-title-en{
    color: rgba(255, 255, 255, .1);
}
.product-caption .common-title-cn{
    color: #fff;
}
.product-bg{
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.product-box{
    margin: 0 auto;
    overflow: hidden;
}
/*.product-list{display: none;}*/
.product-list:first-of-type{display: block;}
.product-title{
    padding: 1rem 0;
}
.product-title-cn{
    font-size: 0.6rem;
    font-family: MicrosoftYaHei;
    color: #FFFFFF;
}
.product-title-en{
    font-size: 0.4rem;
font-family: MicrosoftYaHei;
color: #FFFFFF;
margin-top: 0.5rem;
}

.product-banner{
    width: calc(100% - 4rem);
    display: flex;
    align-items: center;
}
.product-banner-next{
    width: 0.42rem;
    height: 0.75rem;
    flex-shrink: 0;
    margin-left: 1.16rem;
    cursor: pointer;
}
.product-banner-next img{
    width: 100%;
    height: 100%;
}
.product-banner-img{
    width: 100%;
    height: 2.1rem;
    object-fit: cover;
}
.product-banner-icon{
    width: 0.71rem;
    height: 0.71rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0;
    transition: all .365s;
    z-index: 2;
}
.productSwiper .swiper-slide{
    position: relative;
}
.productSwiper .swiper-slide::after{
    content: '';
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5000);
    position: absolute;
    top: -100%;
    left: 0%;
    transition: all .365s;
}
.productSwiper .swiper-slide:hover::after{
    top: 0;
}
.productSwiper .swiper-slide:hover .product-banner-icon{
    opacity: 1;
}

.product-bt{
    width: 3.28rem;
    height: 0.74rem;
    border: 0.01rem solid #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.2rem;
    font-family: MicrosoftYaHei;
    color: #FFFFFF;
    transition: all .365s;
    margin-top: 0.6rem;
}
.product-bt:hover{
    background: #fff;
    color: #333;
}

/* 产品分类 */
.productList-wrap{
    margin: 0 auto;
}
.productList-list{
    display: none;
    flex-wrap: wrap;
    margin-top: 0.2rem;
}
.productList-list:first-of-type{
    display: flex;
}
.productList-item{
    width: 3.84rem;
    margin-right: 0.21rem;
    margin-top: 0.4rem;
}
.productList-item:nth-child(4n){
    margin-right: 0;
}
.productList-img{
    width: 100%;
    height: 2.49rem;
}
.productList-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.productList-title{
    display: flex;
    align-items: center;
    padding: 0.24rem 0;
    justify-content: space-between;
}
.productList-text{
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
    color: #333333;
}
.productList-bt{
    flex-shrink: 0;
    margin-left: 0.15rem;
    width: 1.11rem;
    height: 0.29rem;
    border: 0.01rem solid #000000;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.14rem;
    font-family: MicrosoftYaHei;
    color: #333333;
}

/* 产品详情 */
.producrDetail-bg{
    background: #F2F2F2;
    overflow: hidden;
}
.producrDetail-banner{
    width: 100%;
    margin: 0.6rem auto;
}
.producrDetailSwiper{
    width: 100%;
    position: relative;
    margin-bottom: 0.6rem;
}
.producrDetailSwiper .swiper-slide{
    display: flex;
}
.producrDetail-banner-img{
    width: 10.54rem;
    height: 7rem;
    flex-shrink: 0;
    position: relative;
}
.producrDetail-banner-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.producrDetail-banner-bt-wrap{
    width: 100%;
    height: 0.8rem;
    position: absolute;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, .7);
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 0 0.4rem;
}
.producrDetail-banner-bt{
    width: 1.56rem;
    height: 0.44rem;
    background: #FFFFFF;
    border-radius: 0.05rem;
    margin-left: 0.3rem;
    font-size: 0.2rem;
    font-family: MicrosoftYaHei;
    color: #333333;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.producrDetail-banner-content{
    flex: 1;
    height: 7rem;
    overflow-y: auto;
    background: #fff;
    padding: 0.4rem 0.3rem 0.4rem 0.4rem;
}
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
.producrDetail-banner-content::-webkit-scrollbar
{
	width: 10px;
	height: 10px;
	background-color: #F5F5F5;
}
/*定义滚动条轨道 内阴影+圆角*/
.producrDetail-banner-content::-webkit-scrollbar-track
{
	/* -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); */
	border-radius: 10px;
	background-color: rgba(0,0,0,0.3);
}

.producrDetail-banner-p{
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
    color: #333333;
    line-height: 0.21rem;
    margin-bottom: 0.3rem;
}
.producrDetail-banner-text{
    margin-bottom: 0.2rem;
    font-size: 0.2rem;
    font-family: MicrosoftYaHei;
    color: #333333;
}
.producrDetail-banner-nature-box{
    display: flex;
    flex-wrap: wrap;
}
.producrDetail-banner-nature{
    margin-right: 0.2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 0.3rem;
}
.producrDetail-banner-nature img{
    height: 0.6rem;
    width: auto;
}
.producrDetail-banner-nature p{
    font-size: 0.14rem;
    font-family: MicrosoftYaHei;
    color: #333333;
    text-align: center;
    margin-top: 0.08rem;
}

.producrDetail-banner-color-box{
    display: flex;
    flex-wrap: wrap;
}
.producrDetail-banner-color{
    margin-right: 0.3rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 0.3rem;
}
.producrDetail-banner-color img{
    width: 1.03rem;
    height: 0.32rem;
    object-fit: cover;
}
.producrDetail-banner-color span{
    display: block;
    width: 1.03rem;
    height: 0.32rem;;
}
.producrDetail-banner-color p{
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
    color: #333333;
    text-align: center;
    margin-top: 0.1rem;
}
.producrDetail-banner-cut-wrap{
    display: flex;
    justify-content: center;
}
.producrDetail-banner-cut{
    width: 0.51rem;
    height: 0.51rem;
    border-radius: 0.05rem;
    background: rgba(255, 255, 255, .5);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0.46rem;
    cursor: pointer;
    transition: all .365s;
}
.producrDetail-banner-cut img{
    width: 0.4rem;
}
.producrDetail-banner-cut:hover{
    background: #fff;
}
.producrDetail-wrap{
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
}
.producrDetail-left{
    width: 2.41rem;
    flex-shrink: 0;
}
.producrDetail-right{
    flex: 1;
    margin-left: 0.3rem;
    background: #fff;
    padding: 0.6rem 0.4rem;
}
.producrDetail-content-text{
    font-size: 0.2rem;
    font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
    font-weight: bold;
    color: #595757;
}
.producrDetail-content-img{
    width: 100%;
    margin: 0.4rem 0;
}
.producrDetail-content-img img{
    width: 100%;
}

.producrDetail-box{
    width: 100%;
    margin-bottom: 0.2rem;
    background: #fff;
}
.producrDetail-title{
    display: flex;
    align-items: center;
    height: 0.62rem;
    background: #000000;
    padding: 0 0.15rem;
}
.producrDetail-title img{
    width: 0.2rem;
    height: 0.2rem;
}
.producrDetail-title p{
    font-size: 0.2rem;
    font-family: MicrosoftYaHei;
    color: #FFFFFF;
    margin-left: 0.15rem;
}
.producrDetail-nav-list{
    overflow: hidden;
}
.producrDetail-nav-item{
    display: flex;
    align-items: center;
    padding:0 0.1rem 0 0.2rem;
    margin: 0.2rem 0;
    cursor: pointer;
}
.producrDetail-nav-item img{
    width: 0.08rem;
    flex-shrink: 0;
    opacity: 0;
}
.producrDetail-nav-item p{
    margin-left: 0.2rem;
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
    color: #333333;
}
.producrDetail-nav-list .active img{
    opacity: 1;
}

.producrDetail-list{
    padding: 0.2rem 0.25rem;
}
.producrDetail-item{
    width: 100%;
    margin-bottom: 0.2rem;
}
.producrDetail-item-img{
    width: 100%;
}
.producrDetail-item-img img{
    width: 100%;
    height: 1.26rem;
    object-fit: cover;
}
.producrDetail-item p{
    text-align: center;
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
    color: #333333;
    margin-top: 0.1rem;
}

.producrDetail-code{
    padding: 0.2rem;
        display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.producrDetail-code img{
    width: 1.19rem;
}
.producrDetail-code p{
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
    color: #333333;
    margin-top: 0.1rem;
}


/* 弹窗 */

.popup-wrap{
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, .7);
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    z-index: 99;
}
.popup-box{
    width: 9rem;
    background: #FFFFFF;
    border-radius: 0.05rem;
    overflow: hidden;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    transform: translate(-50%,-50%);
    padding: 1.5rem 0.5rem;
}
.popup-close{
    width: 0.42rem;
    height: 0.42rem;
    cursor: pointer;
    position: absolute;
    top: 0.14rem;
    right: 0.26rem;
}
.popup-title{
    margin-bottom: 0.3rem;
    text-align: center;
}
.popup-text{
    font-size: 0.3rem;
    font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
    font-weight: bold;
    color: #333333;
}
.popup-p{
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
    color: #333333;
    margin-top: 0.3rem;
}
.popup-form{
    width: 6.82rem;
    margin: 0 auto;
}
.popup-input{
    width: 6.82rem;
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.2rem;
}
.popup-input input{
    width: 3.31rem;
    height: 0.46rem;
    border: 1px solid #c9c9c9;
    padding: 0 0.15rem;
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
}
.popup-textarea{
    width: 100%;
    height: 0.78rem;
    border: 1px solid #c9c9c9;
    padding: 0.1rem 0.15rem;
}
.popup-textarea textarea{
    width: 100%;
    height: 100%;
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
}







.popup-bt-box{
    display: flex;
    justify-content: center;
    margin: 0.24rem 0 0.39rem 0;
}
.popup-bt{
    width: 1.96rem;
    height: 0.51rem;
    background: #000000;
    font-size: 0.16rem;
    font-family: MicrosoftYaHei;
    color: #FFFFFF;
    line-height: 0.51rem;
    text-align: center;
    margin: 0 0.23rem;
    cursor: pointer;
}
.popup-bt1{
    background: #C30000;
}




















/* --------------------------------------- */
/* 媒体查询 产品中心 */
@media all and (max-width: 1024px) {
  /* 顶部开始 */
  .common-banner {
    height: auto !important;
  }
  .common-banner video {
    vertical-align: bottom;
  }

  .common-title-en {
    font-size: 0.5rem !important;
  }
  .common-title-cn {
    font-size: 0.4rem !important;
  }

  .common-title {
    margin-top: 30px !important;
  }

  .about-nav {
    margin: 30px 0;
  }

  .about-nav-a {
    width: 75px;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
  }


  /* --------------------------------------- */
  /* 产品中心 开始*/
  /* --------------------------------------- */


  
  /* 标题 */
  .product-title {
    padding: 0 0.3rem;
  }

  .product-title-cn {
    font-size: 16px;
  }
  .product-title-en {
    font-size: 12px;
    margin-top: 15px;
  }

  .product-banner {
    margin-top: 15px;
    width: 100%;
  }

  .product-bt {
    width: 100px;
    height: 35px;
    margin: 15px auto;
    font-size: 14px;
  }

  .product-list {
    margin-bottom: 30px;
  }

  .product-banner-next {
    margin-right: .2rem;
    margin-left: .5rem;
  }
  .product-banner-next img {
    width: 14px;
    height: auto;
  }

  /* --------------------------------------- */
  /* 产品中心 结束*/
  /* --------------------------------------- */




  /* --------------------------------------- */
  /* 产品列表 开始*/
  /* --------------------------------------- */
  .productList-list {
    padding: 0 15px;
    justify-content: space-between;
  }
  .productList-item {
    margin:  8px 0;
    width: 48%;
  }

  .productList-title {
    flex-direction: column;
  }
  .productList-text {
    font-size: 13px;
  }
  .productList-bt {
    margin-top: 10px;
    width: 80px;
    height: 30px;
    font-size: 12px;
  }
  
  .producrDetail-banner-bt {
      font-size: 14px;
  }
  
  .producrDetail-content-text {
      font-size: 14px;
  }


  /* --------------------------------------- */
  /* 产品列表 结束*/
  /* --------------------------------------- */


  /* --------------------------------------- */
  /* 产品详情 开始*/
  /* --------------------------------------- */
  .producrDetail-banner {
    margin: 0 auto;
    margin-bottom: 15px;
  }
  .producrDetailSwiper {
    margin-bottom: 15px;
  }
.producrDetail-banner-img {
    width: 100%;
}
.producrDetail-banner-bt-wrap {
    justify-content: center;
}

.producrDetail-banner-bt {
    margin: 0 10px;
    width: 75px;
    height: 30px;
}
.producrDetail-wrap {
    flex-direction: column-reverse;
    margin-bottom: 30px;
    margin-bottom: 0;
}

.producrDetail-right {
    margin: 0;
    width: 100%;
}

.producrDetail-box {
    /*display: none;*/
}

.producrDetail-left {
    width: 100%;
    flex-direction: column;
}
.producrDetail-left .producrDetail-box:nth-child(1) { 
    display: none;
}

.producrDetail-title{
    padding: 5px 15px;
}
.producrDetail-title img {
    width: 20px;
    height: 20px;
}
.producrDetail-title p {
    font-size: 16px;
    font-size: 14px;
}

.producrDetail-list {
    display: flex;
    flex-direction: column;
}

.producrDetail-item {
    margin-bottom: 20px;
}
.producrDetail-item-img img {
    height: 3.5rem;
}

.producrDetail-item p {
    font-size:14px;
    margin-top: 10px;
}
.producrDetail-code {
    padding: 20px;
}


.producrDetail-code img {
    width: 130px;
    height: 130px;
}

.producrDetail-code p {
    margin-top: 20px;
    font-size: 14px;
}


.popup-box {
    width: 90vw;
    padding: 20px;
    border-radius: 10px;
}

.popup-p {
    font-size: 12px;
    line-height: 1.6;
}
.popup-form {
    width: 100%;
}

.popup-input {
    flex-direction: column;
    width: 100%;
    margin-bottom: 0;
}
.popup-input input {
    width: 100%;
    height: 30px;
    margin-bottom: 15px;
    font-size: 14px;
}
.popup-textarea {
    height: auto;
}
.popup-textarea textarea {
        font-size: 14px;
        min-height: 70px;
}

.popup-bt-box {
    margin-bottom: 0;
}
.popup-bt {
    font-size: 14px;
}
  /* --------------------------------------- */
  /* 产品详情 结束*/
  /* --------------------------------------- */






  
    /* 分页 */
    .paging-a {
        min-width: 20px;
        height: 20px !important;
      }
    
      .paging-bt {
        width: 20px !important;
        height: 20px !important;
      }
      .paging-bt img {
        width: 15px !important;
        height: 15px !important;
      }
    
      /* 分页 */
}