.content,.main-content {
    box-sizing: border-box;
    display: flex;
    align-items: start;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    /* padding: 20px 186px; */
}
.content{
    flex-direction: column;
}


.current-nav{
    display: flex;
    align-items: center;
    width: 100%;
    height: 40px;
    margin: 0px auto 30px;
    font-size: 13px ;
    border-bottom: 1px solid #ddd;

}

.current-nav div:nth-of-type(1) {
    display: flex;
    align-items: center;
}

.nat-t{

    font-size: 13px ;
}

.current-nav div:nth-of-type(1) span:nth-of-type(1) {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/home.png);
}

.current-nav div:nth-of-type(2):hover,
.current-nav div:nth-of-type(3):hover {
    color: #2ca4e4;
    cursor: pointer;
}

.select-text {
    font-size:13px;
    color: #2ca4e4;
}


@media (max-width: 768px){
    .content{
        box-sizing: border-box;
        padding: 20px 20px;
    }
    .content .content-aside{
        width:100%;
        margin-bottom: 20px;
    }
    .main-content{
        flex-direction: column;
    }
    .content-area{
        box-sizing: border-box;
        overflow-x: scroll;
    }
}
@media (min-width:769px) {
    .content{
        padding: 20px 12%;
    }
    .copy{
        font-size:15px;
    }
}

.content-aside {
    width: 210px;
    flex-shrink: 0;
    box-shadow: 3px 3px 9px #eee;
    background: #fefefe;
}

.aside-header {
    display: flex;
    align-items: center;
    width: 100%;
    height: 50px;
    padding: 0px 10px;
    background: #56b6e8;
    color: #fff;
}

.aside-header span:nth-of-type(1) {
    font-size: 18px;
    font-weight: bold;
}

.aside-header span:nth-of-type(2) {
    margin-left: 8px;
    font-size: 13px;
    color: #efefef;
}

.aside-list {
    padding-bottom: 60px;
    border-bottom: 1px solid #ccc;
}

.aside-list li div{
    position: relative;
    display: flex;
    align-items: center;
    height: 50px;
    font-size: 15px;
    padding: 0px 10px;
}
.aside-list li div span{
    position: absolute;
    display: flex;
    align-items: center;
    width:16px;
    height:16px;
    top:0px;
    bottom:0px;
    right:20px;
    margin:auto 0px;
    background-image: url(../new-images/round-keyboard_arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.aside-list li:hover,.aside-list div:hover  {
    color: #56b6e8 !important;
    cursor: pointer;
}
.aside-list div:hover span{
    position: absolute;
    display: flex;
    align-items: center;
    width:16px;
    height:16px;
    top:0px;
    bottom:0px;
    right:20px;
    margin:auto 0px;
    background-image: url(../new-images/arrows_right.png);
    background-size: contain;
    background-repeat: no-repeat;
}
.aside-list li div .active-span{
    position: absolute;
    display: flex;
    align-items: center;
    width:16px;
    height:16px;
    top:0px;
    bottom:0px;
    right:20px;
    margin:auto 0px;
    background-image: url(../new-images/arrows_right.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.aside-list li:nth-of-type(1) div {
    color: #56b6e8;
}
.aside-list li>ul{
    display: none;
}

.aside-list li>ul li{
    position: relative;
    height:40px;
    line-height: 40px;
    padding-left:30px;
    font-size:14px;
}
.aside-list li>ul li span{
    display: block;
    position: absolute;
    width:5px;
    height:5px;
    top:0px;
    bottom:0px;
    left:20px;
    margin:auto 0px;
    border-radius: 999px;
    background:#000;
}

.aside-list  .active-color{
    color: #56b6e8 !important;
}

/* .aside-list li:last-of-type{
  
} */
.aside-contact {
    width: 100%;
    padding: 20px 10px 10px;
}

.contact-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.contact-header-left {
    width: 86px;
    height: 86px;
    background-image: url(../new-images/erweima.png);
    background-repeat: no-repeat;
    background-size: contain;
}

.contact-header-right {
    height: 86px;
    margin-left: 5px;
}

.contact-header-right div:nth-of-type(1) {
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: bold;
}

.contact-header-right div:nth-of-type(1)::before {
    display: inline-block;
    width: 6px;
    height: 6px;
    content: '';
    border-radius: 9999px;
    background: #161616;
    margin-right: 5px;
}

.contact-header-right div:nth-of-type(2) {
    font-size: 13px;
    color: #aaa;
    margin: 5px 0px 0px 10px;
}

.contact-body div {
    display: flex;
    align-items: start;
}

.contact-body div>span:nth-of-type(1) {
    display: inline-block;
    width: 36px;
    text-align-last: justify;
    font-weight: bold;
}

.contact-body div>span:nth-of-type(2) {
    display: inline-block;
    width: calc(100% - 63px);
    text-wrap: wrap;
}

.contact-body div:nth-of-type(3)>span:nth-of-type(2) {
    text-decoration: underline;
}

.content-area {
    box-sizing: border-box;
    flex: 1;
    display: flex;
    flex-direction: column;
    margin-left: 30px;
}

.area-header {
    position: relative;
    display: flex;
    align-items: center;
    font-size: 18px;
    width: 100%;
    height: 50px;
    color: #007ed6;
    border-bottom: 1px solid #ccc;
}

.area-header span:nth-of-type(1) {
    position: absolute;
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(../new-images/arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.area-header span:nth-of-type(2) {
    display: flex;
    align-items: center;
    padding-left: 20px;
    height: 100%;
    border-bottom: 1px solid #007ed6
}

.area-body {
    margin-top: 10px;
    width: 100%;
}

.area-body-part {
    margin-bottom: 20px;
}

.area-body-title {
    display: flex;
    align-items: center;
    height: 30px;
    font-size: 16px;
    color: #007ed6;

}

.area-body-title span:nth-of-type(1) {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-left: 5px;
    font-weight: bold;
    background-image: url(../new-images/arrow-single.png);
    background-repeat: no-repeat;
    background-size: contain;
}

.area-body-article {
    display: flex;
}
.area-body-article0{
    display: flex;
    box-sizing: border-box;
}
.area-body-art,.area-body-art1{
    display: flex;
    justify-content: center;
}

.article-text,
.article-text1 {
    box-sizing: border-box;
    width: 100%;
    line-height: 30px;
    text-indent: 2em;
    font-size: 14px;
}
.article-text1 div{
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    width: 70%;
    line-height: 30px;
    font-size: 14px;
}

.article-text1 {
    margin-left: 10px;
}

.humidity .article-text,
.humidity .article-text1 {
    box-sizing: border-box;
    width: 100%;
    line-height: 30px;
    text-indent: 2em;
    font-size: 14px;
}
.humidity .article-text1 div{
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    line-height: 30px;
    font-size: 14px;
}


.article-text div {
    font-size: 14px;
}

.article-image1,
.article-image2,
.article-image3,
.article-image4,
.article-image5,
.article-image6,
.article-image7,.article-image22{
    width: 300px;
    margin-left: 30px;
    background-size: contain;
    background-repeat: no-repeat;

}

.article-image1 {
    background-image: url(../new-images/img1.png);
}

.article-image2 {
    background-image: url(../new-images/img2.png);
}

.article-image3 {
    background-image: url(../new-images/img3.png);
}

.article-image4 {
    background-image: url(../new-images/img4.png);
}

.article-image5 {
    background-image: url(../new-images/img10.png);
}

.article-image6 {
    background-image: url(../new-images/img11.png);
}

.article-image7 {
    background-image: url(../new-images/img12.png);
}

.article-image8 {
    width: 460px;
    margin-left: 60px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img13.png);
}

.article-image9 {
    width: 160px;
    margin-left: 30px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img19.png);
}
.article-image10 {
    width: 360px;
    margin-left: 30px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img21.png);
}
.article-image11 {
    width: 360px;
    margin-left: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img22.png);
}
.article-image12 {
    width: 360px;
    margin-left: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img23.png);
}
.article-image13 {
    width: 360px;
    margin-left: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img29.png);
}
.article-image14 {
    width: 160px;
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img35.png);
}
.article-image15 {
    width: 160px;
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img37.png);
}
.article-image16 {
    width: 130px;
    height:130px;
    margin-left: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img38.png);
}
.article-image17 {
    width: 120px;
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img39.png);
}
.article-image18 {
    width: 120px;
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img41.png);
}
.article-image19 {
    width: 120px;
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img42.png);
}
.article-image20 {
    width:  160px;
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img78.png);
}
.article-image21 {
    width:  160px;
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img79.png);
}
.article-image20 {
    width:  160px;
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img78.png);
}
/* .article-image22{
    background-image: url(../new-images/img81.png);
} */


.area-body-article5 {
    box-sizing: border-box;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;
    height: 400px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img5.png);
}

.area-body-article6 {
    box-sizing: border-box;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;
    height: 400px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img14.png);
}


.area-body-article7 {
    box-sizing: border-box;
    margin: 10px auto 5px;
    width: 60%;
    height: 300px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img20.png);
}
.area-body-article8 {
    box-sizing: border-box;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;
    height: 400px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img24.png);
}
.area-body-article9 {
    box-sizing: border-box;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;
    height: 400px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img30.png);
}
.area-body-article10 {
    box-sizing: border-box;
    margin: 10px auto 5px;
    width: 50%;
    height: 160px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img36.png);
}
.area-body-article11 {
    box-sizing: border-box;
    margin: 10px auto 5px;
    width: 50%;
    height: 160px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img40.png);
}

.area-body-article12 {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    margin-left: 10px;
    margin-top: 10px;
    width: 90%;

}
.area-body-art1 .area-body-article12 {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    margin-left: 10px;
    margin-top: 10px;
    width: 50%;

}

.area-body-article12 img{
    display: block;
    width:100%;
}

.area-body-article13 {
    box-sizing: border-box;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;
    height: 260px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img95.png);
}
.area-body-article14 {
    box-sizing: border-box;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;
    height: 460px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img96.png);
}
.area-body-article16 {
    box-sizing: border-box;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;
    height: 260px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img107.png);
}

.area-body-article18{
    box-sizing: border-box;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;
    height: 460px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../new-images/img109.png);
}
.area-body-table {
    box-sizing: border-box;
    width: 100%;
    margin-top: 10px;
    padding: 0px 20px;
}

.area-table {
    width: 100%;
}

.area-table tr {
    height: 30px;
}

.area-table tr:nth-of-type(2n-1) {
    background: #e4f2fb;
}

.area-table tr:nth-of-type(1) {
    background: #55c1f0;
}

.area-table tr th,
.area-table tr td {
    text-align: center;
}

.article-card0{
    flex:1;
    box-sizing: border-box;
    margin-right:20px;
}
.article-card0:last-of-type{
    margin-right: 0px;
}
.article-card-img0{
    display: flex;
    justify-content: center;
    align-items: center;
}
.article-card-img0 img{
    display: flex;
    width:100%;
}

.article-card {
    flex: 1;
    margin: 0px 10px;
}

.article-card-img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 186px;
}

.article-card-img img {
    display: flex;
    width: 100%;
}

.article-card-img1 {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 186px;
}
.article-card-img2 {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 130px;
    margin-top:20px;
}
.article-card-img3 {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 90px;
    margin-top:20px;
}

.article-card-img1 img {
    display: flex;
    height: 100%;
}
.article-card-img2 img {
    display: flex;
    height: 100%;
}
.article-card-img3 img {
    display: flex;
    height: 100%;
}

.article-card-text {
    margin-top: 20px;
    height: 30px;
    font-size: 14px;
    text-align: center;
}


.back-top {
    position: fixed;
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    right: 30px;
    bottom: 50px;
    width: 46px;
    height: 46px;
    border-radius: 999px;
    box-shadow: 0px 0px 6px #007dd6;
}

.back-top div:nth-of-type(1) {
    width: 16px;
    height: 16px;
    background-image: url(../new-images/cc-arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.back-top div:nth-of-type(2) {
    height: 20px;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #007dd6;
    margin-top: 5px;
}

.pressure,
.humidity,
.gas,
.other,
.back-top {
    display: none;
}
.pressure,
.humidity,
.gas,
.other,
.back-top{
    box-sizing: border-box;
}

.humid,.humid1,.humid2,.humid3{
    width:100%;
}


.plat,.NT,.pre,.hum1,.hum2,.hum3,.gs,.hal{
    position: relative;
    display: none;
}

.underload{
    box-sizing: border-box;
    margin-top:40px;
    padding-right:10px;
    display: flex;
    width:100%;
    justify-content: end;
}
.underload a{
    font-size:15px;
    text-decoration: underline;
    color: #fff !important;;
}
.underload div{
    padding:10px 20px;
    border:1px solid #eee;
    background:linear-gradient(90deg,rgba(0, 0, 255, 0.938),rgba(0, 0, 255, 0.938))
}
.des-text{
    font-size: 15px;
    margin:20px 0px;
}


.area-table1 {
    width: 100%;
}

.area-table1 tr {
    height: 30px;
}

.area-table1 tr:nth-of-type(1) {
    background: #55c1f0;
}

.area-table1 tr th,
.area-table1 tr td {
    text-align: center;
}
.area-table2 {
    width: 100%;
}

.area-table2 tr {
    height: 30px;
}
.area-table2 tr th,
.area-table2 tr td {
    text-align: center;
}

.des-image{
    display: flex;
    width:100%;
    margin-bottom:20px;
}
.des-image-area{
    flex:1;
    flex-shrink: 0;
    box-sizing: border-box;
    padding:0px 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.des-image-top{
    width:100%;
    height:200px;
}
.des-image-top img{
    display: block;
    height:100%;
}
.des-image-top1{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width:100%;
}
.des-image-top1 img{
    display: block;
    width:60%;
}

.des-image-bottom{
    margin-top:10px;
    width:100%;
    text-align: center;
    font-size:15px;
}
.des-text1{
    font-size: 15px;
    margin:20px 0px 10px;
}
.article-content div{
    font-size:14px;
    text-indent: 2em;
    line-height: 30px;
}
.article-content .c-img ,.article-content .c-img1{
    width:100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.article-content .c-img img{
    width:20%;
    margin:0px auto;
}
.article-content .c-img1 img{
    width:50%;
}
.article-text-list{
    display: flex;
    flex-direction: column;
    width:100%;
    margin-left:20px;
}
.article-text-list li{
    position: relative;
    width:100%;
    list-style: none;
    text-align: left;
    font-size:14px;
}
.article-text-list li::before{
    position: absolute;
    display: block;
    content:'';
    top:0px;
    left:10px;
    bottom:0px;
    margin:auto;
    width:6px;
    height:6px;
    border-radius: 9999px;
    background:#000;
}
.table-header{
    width:100%;
    text-align: center;
    font-size:14px;
    color:#000;
}
.show-up{
    display: none;
    position: relative;
    margin-bottom:70px;
}


.s-p{
    position: absolute;
    bottom:-60px;
    display: flex;
    width:100%;
    justify-content: center;
    align-items: end;
    height: 76px;
    background: linear-gradient(0deg,#00000007,#00000003,transparent);
    z-index: 333;
}
.s-p div{
    display: flex;
    justify-content: center;
    align-items: center;
    width:46px;
    height:30px;
    border-radius:6px 6px 0px 0px;
    box-shadow: 0px -3px 12px #fff;
    background:#eeeeee4a;
    cursor: pointer;
}
.s-p div img{
    display: block;
    width:20px;
    transform: rotateZ(-90deg);
}
.show-down{
    position: absolute;
    bottom:-30px;
    display: flex;
    width:100%;
    justify-content: center;
    align-items: end;
    height: 76px;
    background: linear-gradient(0deg,#00000007,#00000003,transparent);
    z-index: 333;
}
.show-down div{
    display: flex;
    justify-content: center;
    align-items: center;
    width:46px;
    height:30px;
    border-radius:6px 6px 0px 0px;
    box-shadow: 0px -3px 12px #fff;
    background:#eeeeee4a;
    cursor: pointer;
}
.show-down div img{
    display: block;
    width:20px;
    transform: rotateZ(90deg);
}