/*page-vol*/
#tools{}

#tools-page h1{margin-bottom: 25px;}
#tools-page .w1500{overflow: hidden;}

#tools-count{}
#tools-count .left{width: 490px;float: left;}
#tools-count{padding-bottom: 80px;}
#tools-count .top-title{position: relative;margin-bottom: 30px;overflow: hidden;}
#tools-count .top-title b{font-size: 22px;float: left;}
#tools-count .count-input span{line-height: 40px;font-size: 18px;color: #666;display: inline-block;}
#tools-count .count-input span:nth-child(1){margin-right: 20px;}
#tools-count .count-input input[type="radio"]{line-height: 40px;}

#tools-count .count-form li{display: none;}
#tools-count .count-form li.active{display: block;}

#tools-count .count-form li .input-box,
#tools-count .count-form li .select-box{display: flex;margin-top: 25px;}
#tools-count .count-form li label{width: 165px;font-size: 14px;color: #666;line-height: 35px;}
#tools-count .count-form li input{width: calc(100% - 165px);border: 1px solid #aaa;background-color: transparent;
    outline: 0;padding:0 10px;padding-right: 0;font-size: 18px;line-height: 40px;height: 40px;}
#tools-count .count-form li select{width: calc(100% - 165px);border: 1px solid #aaa;background-color: transparent;
    outline: 0;padding:0 10px;font-size: 18px;line-height: 40px;height: 40px;}



#tools-count .right{width: calc(100% - 600px);float: right;}
#tools-count .right .top-title p{float: right;font-size: 14px;line-height: 20px;color: #666;margin-top: 5px;}
    
#tools-count .right .count-num{background-color: #fff;padding: 60px 0;display: flex;margin-bottom: 20px;}
#tools-count .right .count-num li{flex:1;text-align: center;padding:0 10px}
#tools-count .right .count-num li p{font-size: 18px;line-height: 20px;}
#tools-count .right .count-num li b{font-size: 96px;font-weight: normal;margin-top: 10px;display: block;}
#tools-count .right a{display:inline-block;padding:10px 15px;color:#fff;font-size:16px;background-color:#cfa872;}
#tools-count .right a:hover{background-color: #fff;color:#cfa872;}


@media(max-width:1500px){
    .show-textarea h1{font-size: 40px;line-height: 40px;}
    .show-textarea span, .show-textarea p, .show-textarea a, .show-textarea font{font-size: 13px;line-height: 21px;}

    #tools-count .right .count-num li p{font-size: 16px;}
    #tools-count .right .count-num li b{font-size: 70px;}
}


@media(max-width:1280px){
    #tools-count .right .count-num li p{font-size: 15px;}
    #tools-count .right .count-num li b{font-size: 55px;}
}

@media(max-width:1100px){
    
    .show-textarea h1{font-size: 32px;line-height: 35px;}

    #tools-count{padding-bottom: 35px;}
    #tools-count .left{width: 100%;margin-bottom: 20px;}
    #tools-count .right{width: 100%;}

}


@media(max-width:768px){
    .show-textarea h1{font-size: 24px;line-height: 30px;}
    .show-textarea span, .show-textarea p, .show-textarea a, .show-textarea font{font-size: 13px;line-height: 21px;}

    #tools-count .count-input span{font-size: 14px;}
    #tools-count .count-form li label{width: 130px;font-size: 14px;line-height: 35px;}
    #tools-count .count-form li input{width: calc(100% - 130px);font-size: 14px;height: 35px;line-height: 32px;}
    #tools-count .count-form li select{width: calc(100% - 130px);font-size: 14px;height: 35px;line-height: 32px;}

    #tools-count .top-title{margin-bottom: 20px;}
    #tools-count .right .count-num{padding:20px 0;display: block;}
    #tools-count .right .count-num li{margin-top:15px;}
    #tools-count .right .count-num li:nth-child(1){margin-top: 0;}
    #tools-count .right .count-num li p{font-size: 13px;}
    #tools-count .right .count-num li b{font-size: 30px;}


}






/*tuya-app*/
#tuya-page{padding:150px 0 250px}
#tuya-page h1{margin-bottom: 60px;}
#tuya-page p{color: #666;}
#tuya-page .con-box{width: 50%;}
#tuya-page .url-box{margin-top: 80px;width: 50%;}
#tuya-page a{display: inline-block;margin-right: 25px;padding:15px 35px;
border-radius: 40px;border:1px solid #555;color: #222;}
#tuya-page a:hover{background-color: #cfa872;color: #fff;border-color: #cfa872;}


@media(max-width:1500px){
    
}


@media(max-width:1280px){
}

@media(max-width:1100px){
    #tuya-page{padding:30px 0;}
    #tuya-page h1{margin-bottom: 20px;}
    #tuya-page .url-box{margin-top: 20px;}
    #tuya-app{background-color:rgba(41, 99, 103,0.5); }
    
    #tuya-page a{margin-bottom: 20px;}
}


@media(max-width:768px){
    #tuya-page .con-box{width: 100%;}
    #tuya-page .url-box{width: 100%;}

}







/*#catelogs-page*/
#catelogs-page{padding:60px 0 100px}
#catelogs-page h1{float: left;}
#catelogs-page form{display: block;float: right;position: relative;margin-top: 10px;}
#catelogs-page form input{width: 315px;height: 40px;border: 0;background-color: #ececec;padding-left:20px;padding-right: 40px;}
#catelogs-page button{position: absolute;right:15px;top:10px;z-index: 3;border: 0;}
#catelogs-page .w1500>p{margin:40px 0 90px}

#catelogs-page .catelogs-box{overflow: hidden;margin-top: ;}
#catelogs-page .catelogs-box a{display: block;float: left;width: 21.5%;margin-right: 4.6%;margin-bottom: 4.5%;}
#catelogs-page .catelogs-box a:nth-child(4n){margin-right: 0;}
#catelogs-page .catelogs-box a img{width: 100%;}
#catelogs-page .catelogs-box a .con{padding:20px;background-color: #fff;}
#catelogs-page .catelogs-box a b{display: block;font-size: 20px;height: 35px;overflow: hidden;}
#catelogs-page .catelogs-box a .des{font-size: 13.5px;line-height: 20px;height:35px;overflow: hidden;;margin:10px 0;color: #555;}
#catelogs-page .catelogs-box .timehits span{font-size: 13px;display: inline-block;margin-right: 15px;color: #666;}
#catelogs-page .catelogs-box .timehits span img{display: inline-block;width: auto;margin-right: 5px;}


@media(max-width:1500px){
    
}




@media(max-width:1100px){
    #catelogs-page{padding:35px 0;}
    #catelogs-page form{width: 100%;}
    #catelogs-page form input{width: 100%;}
    #catelogs-page .w1500>p{margin:20px 0}

    
#catelogs-page .catelogs-box a{width: 32%;margin-right: 2%;margin-bottom: 2%;}
#catelogs-page .catelogs-box a:nth-child(4n){margin-right: 2%;}
#catelogs-page .catelogs-box a:nth-child(3n){margin-right: 0;}


#catelogs-page .catelogs-box a .con{padding:20px 10px;}
#catelogs-page .catelogs-box a b{display: block;font-size: 15px;}
}


@media(max-width:768px){

    #catelogs-page .catelogs-box a{width: 49%;}
    #catelogs-page .catelogs-box a:nth-child(3n){margin-right: 2%;}
    #catelogs-page .catelogs-box a:nth-child(2n){margin-right: 0;}

    #catelogs-page .catelogs-box .timehits span{margin-bottom: 5px;}
}




/*#photo-page*/
.library {padding:30px 0 60px;}
.library h1{float: left;}
.library form{display: block;float: right;position: relative;top: -1px;z-index: 3;}
.library form .select-box{display: inline-block;margin-right: 10px;height: 40px;width: 205px;position: relative;z-index: 1;}
.library form .select-box>a{display: block;height: 40px;line-height: 40px;padding:0 10px;border: 1px solid #aaa;}
.library form .select-box>i {position: absolute;right:10px;top:10px;font-size: 20px;}
.library form .select-box ul{position: absolute;top:40px;left:0;transition: all 0.7s ease;-webkit-transition: all 0.7s ease;
width: 100%;border: 1px solid #aaa;border-top: 0;transform: translateY(-40px);opacity: 0;display: none;background-color: #fff;}
.library form .select-box.active{z-index: 3;}
.library form .select-box.active ul{display: block;animation: toTans 0.7s ease forwards;}
.library form .select-box ul li a{padding:10px;display: block;}
.library form .select-box ul li a:hover{background-color: #cba571;color: #fff;}


.library form .input-box{width: 225px;position: relative;display: inline-block;z-index: 1;}
.library form .input-box input{height: 40px;border: 0;padding: 0 20px;padding-right: 45px;background-color: #ececec;width: 100%;position: relative;z-index: 3;}
.library form .input-box button{position: absolute;right:20px;top:10px;border: 0;z-index: 2;}

.library .w1500>p{color:#999999;font-size: 14px;line-height: 25px;width: 50%;margin:25px 0 50px;}



#photo-page .photo-box{overflow: hidden;}
#photo-page .photo-box .list{float: left;width: 32%;margin-right: 2%;margin-bottom: 2%;position: relative;}
#photo-page .photo-box .list:nth-child(3n){margin-right: 0;}
#photo-page .photo-box .list img{width: 100%;}
#photo-page .photo-box .list a{position: absolute;bottom:20px;right:20px;width:35px;height:35px;
background-color: #cba571;background-image: url(../images/downbtnb.png);opacity: 0;background-repeat: no-repeat;background-position: center;}
#photo-page .photo-box .list:hover a{opacity: 1;}

@keyframes toTans{
    from{transform: translateY(-40px);opacity: 0;}
    to{transform: translateY(0px);opacity: 1;}
}

@media(max-width:1500px){
    
}




@media(max-width:1100px){
    #photo-page{padding:35px 0;}
    #photo-page form{width: 100%;margin-top: 15px;}
    #photo-page .w1500>p{margin:20px 0;width: 100%;}
    .library form .select-box{margin-bottom: 20px;width: 100%;}
    #photo-page form .input-box{width: 100%;}
    
    #photo-page .photo-box .list{width: 32%;margin-right: 2%;margin-bottom: 2%;}
    #photo-page .photo-box .list:nth-child(4n){margin-right: 2%;}
    #photo-page .photo-box .list:nth-child(3n){margin-right: 0;}

    
    .library .w1500>p{width: 100%;margin:0px 0 20px}
}


@media(max-width:768px){

    #photo-page .photo-box .list{width: 49%;}
    #photo-page .photo-box .list:nth-child(3n){margin-right: 2%;}
    #photo-page .photo-box .list:nth-child(2n){margin-right: 0;}
}







/*#video-page*/

#video-page .video-box{overflow: hidden;margin-top: ;}
#video-page .video-box a{display: block;float: left;width: 32.65%;margin-right: 1%;margin-bottom: 2%;}
#video-page .video-box a:nth-child(3n){margin-right: 0;}
#video-page .video-box a img{width: 100%;}
#video-page .video-box a .con{padding:20px;background-color: #fff;}
#video-page .video-box a b{display: block;font-size: 20px;}
#video-page .video-box a .des{font-size: 13.5px;line-height: 20px;margin:10px 0;color: #555;}
#video-page .video-box .timehits span{font-size: 12px;display: inline-block;margin-right: 15px;color: #888;}
#video-page .video-box .timehits span img{display: inline-block;width: auto;margin-right: 5px;}



@media(max-width:1500px){
    
}




@media(max-width:1100px){
    #video-page{padding:35px 0;}
    #video-page form{width: 100%;margin-top: 15px;}
    #video-page .w1500>p{margin:20px 0;width: 100%;}
    .library form .select-box{margin-bottom: 20px;width: 100%;}
    #video-page form .input-box{width: 100%;}
    #video-page .video-box a b{line-height: 20px;font-size: 16px;}
    
    #video-page .video-box a{width: 32%;margin-right: 2%;margin-bottom: 2%;}
    #video-page .video-box a:nth-child(4n){margin-right: 2%;}
    #video-page .video-box a:nth-child(3n){margin-right: 0;}
}


@media(max-width:768px){

    #video-page .video-box a{width: 49%;}
    #video-page .video-box a:nth-child(3n){margin-right: 2%;}
    #video-page .video-box a:nth-child(2n){margin-right: 0;}
}







/*#compliance*/
#page_banner .banner-icon{position: absolute;bottom:0;right: 0;transform: translateY(50%);width: 1420px;}
#com-page{padding:60px 0}
#com-page .banner-icon img{width: 100%;}
#com-page .w1500>.des>p{font-size: 18px;line-height: 27px;color: #666;margin:45px 0;}
#com-page .w1500 ul{display: flex;gap: 15px;}
#com-page .w1500 ul li{flex: 1;}
#com-page .w1500 ul li img{width: 100%;}

#cert-page{padding:60px 0}
#cert-page h1{margin-bottom: 50px;}
#cert-page .img {border: 10px solid #d3d3d3;}
#cert-page .img img{width: 100%;}
#cert-page p{font-size: 20px;line-height: 24px;color: #222;margin-top: 20px;text-align: center;}


@media(max-width:1660px){
    #page_banner .banner-icon{width: 1000px;}
}

@media(max-width:1500px){
    
}




@media(max-width:1280px){
    #page_banner .banner-icon{width: 800px;}
}


@media(max-width:1100px){
    #page_banner .banner-icon{width: 100%;transform: translateY(0%);}

    #com-page{padding:35px 0;}
    #com-page .w1500>.des>p{font-size: 14px;line-height: 22px;margin:20px 0;}
    #com-page .w1500 ul{display: flex;gap: 2%;flex-wrap: wrap;}
    #com-page .w1500 ul li{flex: unset;width: 49%;margin-bottom: 2%;}

    #cert-page{padding:10px 0 35px;}
    #cert-page h1{margin-bottom: 20px;}
    
}


@media(max-width:768px){

}



/*#demo-page*/

#demo-page{padding:60px 0;}
#demo-page h1{margin-bottom: 30px;}
#demo-page .con{float: left;width: 540px;padding-right: 35px;}
#demo-page .con .demo-tit{font-size: 26px;line-height: 30px;font-weight: bold;margin:30px 0 15px;}
#demo-page .con p{font-size: 18px;line-height: 27px;color: #666666;}
#demo-page .con strong{font-size: 18px;line-height: 27px;color: #666666;}
#demo-page .con ul li{font-size: 16px;line-height: 28px;list-style:inside;color: #666666;}

#demo-page .img{float: right;width: calc(100% - 540px);padding: 40px;}
#demo-page .img img{width: 100%;}


#demo-feature{padding:80px 0;}
#demo-feature .demo-tit{font-size: 26px;line-height: 30px;font-weight: bold;margin:0px 0 15px;}
#demo-feature ul li{font-size: 16px;line-height: 28px;list-style:inside;color: #666666;}


@media(max-width:1500px){

}

@media(max-width:1100px){
    #demo-page{padding:35px 0}
    #demo-page h1{margin-bottom: 20px;}
    #demo-page .con{width: 100%;margin-bottom: 20px;padding-right: 0;}
    #demo-page .img{width: 100%;padding:0}

    #demo-page .con p {font-size: 14px;line-height: 22px;}

    #demo-page .con .demo-tit{font-size: 20px;line-height: 24px;margin:20px 0 15px;}
    #demo-page .con strong {font-size: 14px;line-height: 24px;}
    #demo-page .con ul li {font-size: 14px;line-height: 24px;}

    #demo-feature{padding:0 0 30px;}

    #demo-feature .demo-tit{font-size: 22px;}
    #demo-feature ul li{font-size: 14px;line-height: 24px;}
}