@media(min-width:800px){
    html{
        zoom: 75%;
    }
}

@media(min-width:1024px){
    html{
        zoom: 90%;
    }
}

@media(min-width:1260px){
    html{
        zoom: 95%;
    }
}

@media(min-width:1280px){
    html{
        zoom: 100%;
    }
}

@media(min-width:1440px){
    html{
        zoom: 110%;
    }
}

@media(min-width:1680px){
    html{
        zoom: 125%;
    }
}

@media(min-width:1920px){
    html{
        zoom: 150%;
    }
}

@media(min-width:2560px){
    html{
        zoom: 200%;
    }
}

:root{
    --content-width:1200px;
    --my-fontsize:14px;
    --my-title-fontsize:20px
}

.cls-top-bg {
    background-image: url("../images/top-background.jpg");
    width: var(--content-width);
    height: 70px;
  }

.cls-link-bg{
    background-image: url("../images/link-background.jpg");
    /* width: 100%; */
    width: var(--content-width);
    height: 50px;
}

.cls-link-bg a{
    color: white;
    font-size: var(--my-fontsize);
}
.cls-link-bg a:hover{
    color:white;
    text-decoration: none;
}

.cls-bottom-background{
    background-image: url("../images/bottom-background.jpg");
    /* width: 100%; */
    width: var(--content-width);
    height: 150px;
}

.cls-bottom-background a{
    color: white;
    font-size: var(--my-fontsize);
}


.cls-top-td{
    color: white;
    width: 100%;
    display: flex;
    float: left;
    height: 80px;
    align-items: center;
}

.cls-top-td a{
    margin-left: 20px;
    text-decoration: none;
    height:80px;
    
    color: white;
    font-size:calc(1 + var(--my-fontsize));
}
.cls-top-td a:hover{
    text-decoration: none;
    color: white;
}

.cls-top-td-drop{
    position: relative;
    display: flex;
    height: 40px;
    align-items: center;
}
.cls-top-td-drop2{
    position: relative;
    display: flex;
    height: 40px;
    align-items: center;
}
.cls-top-td-dropmask{
    position: absolute;
    top: 55px;
    left: -412px;
    height: 150px;
    width:  var(--content-width);
    background-color: #33b3887b;
    display: none;
    z-index: 5;
}

.cls-top-td-dropmask2{
    position: absolute;
    top: 55px;
    left: -496px;
    height: 150px;
    width:  var(--content-width);
    background-color: #33b3887b;
    display: none;
    z-index: 5;
}

.cls-top-td-select{
    display: none;
    background-color: white;
    width: 62px;
    height: 2px;
    position: absolute;
    top: 54px;
    left: 20px;
    z-index: 6;
}

.cls-top-td-dropcontent{
    display: none;
    position: absolute;
    min-width: 100%;
    top: 30px;
    z-index: 100;
}

.cls-top-td-dropcontent a{
    color: white;
}
.cls-top-td-dropcontent div{
    height: 30px;
}




.cls-top-td-drop:hover  .cls-top-td-dropcontent{
    display: block;
}
.cls-top-td-drop:hover  .cls-top-td-dropmask{
    display: block;
}

.cls-top-td-drop:hover  .cls-top-td-select{
    display: block;
}

.cls-top-td-drop2:hover  .cls-top-td-dropcontent{
    display: block;
}
.cls-top-td-drop2:hover  .cls-top-td-dropmask2{
    display: block;
}

.cls-top-td-drop2:hover  .cls-top-td-select{
    display: block;
}




.cls-top-td-dropcontent a:hover{
    background-color: transparent;
}


.cls-link-td{
    color: white;
    margin-left: 120px;
}

.cls-link-td a{
    text-decoration: none;
    color: white;
}

.cls-div-input{
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 15px;
    height: 25px;
    width: 200px;
}

.bannerImg{
    height: 300px;
    object-fit: cover;
    width: 100%;
}

.btn {
    background-color: #1baa7ac5;
    border: none;
    color: white;
    padding: 5px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 3px;
  }
  
  /* 鼠标悬停时背景变暗 */
  .btn:hover {
    background-color: #33b388b7;
  }

  .btnGray{
    background-color: #fcfcfcbe;
    border: none;
    color: black;
    padding: 5px;
    font-size: 16px;
    font-family: '微软雅黑';
    cursor: pointer;
    border-radius: 3px;
    border-color: #fcfcfc83 ;
  }

  .btnGray:hover{
    background-color: #fcfcfc99;
  }

  .cG{
    color: #5cb08d;
  }

  .cGB{
    background-color: #5cb08d;
  }

  /* 自定义段落字体 */
  .cP{
    font-size: var(--my-fontsize);
    line-height: 2;
    letter-spacing: 1px;
  }

.divDash{
    background-color: white;
    border-style:dashed;
    border-width: 1px;
    border-radius: 5px;
    border-color:#33b389 ;
    width: 100%;
    height: 60px;
    display: flex;
    align-content: center;
    align-items: center;
}




.cbTable{
    width: var(--content-width);
    margin-left: calc((100% - var(--content-width)) / 2);
    margin-right: calc((100% - var(--content-width)) / 2);
    background-color: white;
}

.customBtn{
    color:white;
    background: transparent;
    border: 1px solid white;
    
    border-radius: 15px;
    text-decoration: none;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    font-size: var(--my-fontsize);
}

.bodyBackground{
    background: url(/images/产品/产品介绍_13.jpg) repeat;
}