@font-face {
  font-family: "iconfont";
  src: url("../fonts/iconfont.eot");
  src: url("../fonts/iconfont.eot?#iefix") format("embedded-opentype"),
       url("../fonts/iconfont.woff") format("woff"),
       url("../fonts/iconfont.ttf") format("truetype"),
       url("../fonts/iconfont.svg#iconfont") format("svg");
  font-weight: normal;
  font-style: normal;
}


.iconfont {
  font-family:"iconfont" !important;
  font-size:16px;
  font-style:normal;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;}
.icon-inquiry:before{content:"\e626";}
.icon-youtube:before {content:"\e61d";}
.icon-tiktok:before {content:"\ecdc";}
.icon-cart:before {content:"\e613";}
.icon-view:before {content:"\e860";}
.icon-video:before {content:"\e73c";}
.icon-skype:before {content:"\e882";}
.icon-message1:before {content:"\e626";}
.icon-home:before {content:"\e618";}
.icon-whatsapp:before {content:"\e97b";}
.icon-mail:before {content:"\e70b";}
.icon-map2:before {content:"\e813";}
.icon-fax:before {content:"\e6e5";}
.icon-map:before {content:"\e758";}




.iconfont{font-family:iconfont!important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.icon-qq:before{content:"\e882"}
.icon-tiktok:before{content:"\ecdc"}
.icon-shopping3:before{content:"\e73c"}
.icon-gouwuche:before{content:"\e613"}
.icon-shejiguifan:before{content:"\e601"}
.icon-shopping2:before{content:"\e600"}
.icon-videofill:before{content:"\e7c7"}
.icon-cart:before{content:"\e88c"}
.icon-fax:before{content:"\e620"}
.icon-factory:before{content:"\e8ce"}
.icon-erji:before{content:"\e6bf"}
.icon-jiangbei1:before{content:"\e669"}
.icon-shijian:before{content:"\e652"}
.icon-renqun:before{content:"\e6c9"}
.icon-caidanlan-chanpin:before{content:"\e64c"}
.icon-yungongchang:before{content:"\e607"}
.icon-wechat:before{content:"\e883"}


.icon-email2:before{content:"\e638"}
.icon-arrow-r:before{content:"\e64d"}
.icon-phone:before{content:"\e63d"}
.icon-facebook:before{content:"\e63a"}
.icon-close:before{content:"\e650"}
.icon-twitter:before{content:"\e726"}
.icon-linkedin:before{content:"\e696"}
.icon-arrow-l:before{content:"\e606"}
.icon-gp:before{content:"\e65d"}
.icon-email:before{content:"\e65e"}
.icon-address:before{content:"\e644"}
.icon-whatsapp:before{content:"\e933"}
.icon-inquiry:before{content:"\e6db"}

.icon-arrow-long-r:before{content:"\e92e"}
.icon-youtube2:before{content:"\e7b2"}

.icon-shouji:before{content:"\e692"}
.icon-arrow-b:before{content:"\e60c"}
.icon-arrow-t:before{content:"\e60d"}
.icon-tel:before{content:"\e661"}
.icon-pinterest:before{content:"\e685"}
.icon-search:before{content:"\e610"}
.icon-below-right:before{content:"\e627"}
.icon-below-bottom:before{content:"\e628"}
.icon-address2:before{content:"\e612"}
.icon-home2:before{content:"\e60e"}
.icon-send:before{content:"\e678"}
.icon-date:before{content:"\e6c5"}
.icon-eyes:before{content:"\e603"}
.icon-download:before{content:"\e6ba"}


.icon-phone2:before {content:"\e86e";}
.icon-pinterest:before {content:"\e697";}
.icon-instagram:before {content:"\e87f";}
.icon-facebook:before {content:"\e634";}
.icon-linkedin:before {content:"\e978";}
.icon-twitter:before {content:"\e9b2";}
.icon-angle-up:before {content:"\e60a";}
.icon-cc-arrow-left:before {content:"\e609";}
.icon-cc-arrow-right:before {content:"\e60c";}
.icon-earth:before {content:"\e781";}
.icon-mail_fill:before {content:"\e70a";}
.icon-search:before {content:"\e607";}
.icon-phone:before {content:"\e787";}
.icon-map-filling:before {content:"\e68c";}




header{z-index:999;position:fixed;top:0;left:0;right:0;width:100%;background:#FFF;box-shadow:0 1px 6px 0 rgba(0,0,0,.1);height: 80px}
header>.l-wrap{height:100px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;transition:height .3s ease}
header.is-fix>.l-wrap,header.is-fix .head-logo{height:80px}


header.is-fix .head-nav>ul>li>a{height:80px;line-height:80px}
header.is-fix .head-nav>ul>li>a:after{bottom:20px}
.head-nav{margin-right:3%}

.head-nav>ul>li{margin:0 18px}

.head-nav>ul>li>a:after{content:"";position:absolute;display:block;bottom:24px;width:0;height:2px;background:#3a3a3a;transition:all .3s ease}
.head-nav>ul>li>a.inmenu_1{color:#3a3a3a}
.head-nav>ul>li>a.inmenu_1:after{width:100%}
.head-nav>ul>li:hover>a{color:#3a3a3a}
.head-nav>ul>li:hover>a:after{width:100%}
.head-nav .submenu{position:absolute;background:#FFF;top:100%;left:0;z-index:2}
.head-nav .submenu>li>a:hover{color:#3a3a3a}
.head-nav .nav2{left:0;right:0;transform-origin:top;transition:opacity .3s ease,transform .3s ease}
.head-nav .nav2>li{display:inline-block}
.head-nav .nav-btn{display:inline-block;position:relative;cursor:pointer;width:30px;height:30px}
.head-nav .nav-btn span{display:block;position:absolute;border-radius:999px;background:#222;width:30px;height:3px}
.head-nav .nav-btn span:nth-child(1){top:4px}
.head-nav .nav-btn span:nth-child(2){top:14px}
.head-nav .nav-btn span:nth-child(3){top:24px}
.head-nav.is-active .nav-btn span:nth-child(1){transform:rotate(45deg);top:14px}
.head-nav.is-active .nav-btn span:nth-child(2){opacity:0}
.head-nav.is-active .nav-btn span:nth-child(3){transform:rotate(-45deg);top:14px}
.head-logo{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;max-width:300px;height:100px;padding:10px 0;box-sizing:border-box;margin-right: auto}
.head-logo>img{max-width:100%;max-height:100%}
.head-search{position:relative;margin-left:0px;}
.head-search>input{width:160px;height:30px;font-size:14px;border:1px solid #e9e9e9;padding-left:14px;padding-right:28px;box-sizing:border-box;border-radius:999px;overflow:hidden}
.head-search>i{position:absolute;cursor:pointer;right:12px;top:0px;font-size:14px;font-weight:bold;color:#999}


#liproducts .nav2{padding:30px 10%;margin:0 -13px;display:-ms-flexbox !important;display:flex !important;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;transform:rotateX(90deg);box-shadow:0px 10px 15px 0px rgba(0,0,0,.05);opacity:0}
#liproducts .nav2>li{width:16.6667%;margin-bottom:10px;padding:0 13px;box-sizing:border-box}
#liproducts .nav2 .item-info{position:relative;border:1px solid #eee;transition:border .2s ease,box-shadow .2s ease}
#liproducts .nav2 .item-info:after{content:"";display:block;padding-top:75%}
#liproducts .nav2 .item-info:hover{border-color:#3a3a3a;box-shadow:0px 10px 15px 0px rgba(0,0,0,.05)}
#liproducts .nav2 .item-con{position:absolute;top:0;left:0;width:100%;height:100%}
#liproducts .nav2 .item-con img{max-width:100%;max-height:100%}
#liproducts .nav2>li a{box-sizing:border-box;text-align:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#liproducts:hover .nav2{opacity:1;transform:rotateX(0)}
.head-nav ul li:not(#liproducts){position:relative}

.head-nav ul li:not(#liproducts):hover .submenu{opacity:1;transform:rotateX(0)}
.head-nav>ul.nav0>li{position:relative}
.head-nav>ul.nav0>li:hover .nav0{opacity:1;transform:rotateX(0)}
.head-nav>ul.nav0 ul{opacity:0;transform-origin:top;transform:rotateX(90deg);transition:opacity .3s ease,transform .3s ease}

header.is-fix .head-nav>ul>li>a{line-height:50px;height:50px}
.head-nav>ul{display:block;max-height:0;overflow:hidden;z-index:9;background-color:#FFF;position:absolute;top:100%;left:0;width:40%}

.head-nav>ul>li ul{display:none}
.head-nav>ul>li>a{line-height:50px;height:50px}
.head-nav>ul>li>a:after{display:none}
.head-nav .nav-btn{display:inline-block}
.head-nav.is-active>ul{max-height:calc(100vh - 60px);overflow-y:auto;opacity:1}
.head-nav ul li:not(#liproducts) .submenu{display:none}

.head-nav>ul>li>a{font-size:24px;font-weight: bold;color: #222}
.head-nav .submenu>li>a{font-size:14px}
.head-nav>ul>li{margin:0 12px}

.head-search{margin-left:0;margin:4vw;background-color:#FFF;}
.head-search>input{width:100%;height:10vw;border-radius:5px}
.head-search>i{top:3vw}
header>.l-wrap{height:80px}

.head-logo{height:80px;max-width:80%;padding:6px 0;font-size: 30px;font-weight: bold;}
.head-nav .nav-btn{width:20px;height:20px}
.head-nav .nav-btn span{width:20px;right:0}
.head-nav .nav-btn span:nth-child(1){top:3px}
.head-nav .nav-btn span:nth-child(2){top:10px;width:18px}
.head-nav .nav-btn span:nth-child(3){top:17px;width:16px}
.head-nav .submenu{background:transparent;position:relative;display:block}
.head-nav .submenu>li>a{font-size:16px;padding-left:4.5vw}
.head-nav>ul>li{box-sizing:border-box;position:relative;padding:0;margin:0}
.head-nav>ul>li .arrow{width:25px;height:25px;cursor:pointer;display:inline-block;position:absolute;top:12px;right:4vw;transition:.2s ease-in-out;text-align:left;transform:rotate(0)}
.head-nav>ul>li .arrow:after,.head-nav>ul>li .arrow:before{content:"";transition:.2s ease-in-out;background-color:transparent;width:1.8px;height:18px;display:inline-block;position:absolute;border-bottom:10px solid #222;top:7px;right:11px}
.head-nav>ul>li .arrow:after{transform:rotate(135deg)}
.head-nav>ul>li .arrow:before{transform:rotate(-135deg)}
.head-nav>ul>li .arrow.is-active{transform:rotate(-90deg)}
.head-nav>ul>li>a{padding:0 4vw}
.head-nav>ul{border-top:1px solid #eee;background:rgba(255,255,255,.98);position:fixed;display:block;top:80px;bottom:0;opacity:0;overflow-y:auto;max-height:0;overflow:hidden;padding-bottom:calc(20px + constant(safe-area-inset-bottom));padding-bottom:calc(20px + env(safe-area-inset-bottom))}
.head-nav.is-active .nav-btn span{width:20px}
.head-nav.is-active .nav-btn span:nth-child(3),.head-nav.is-active .nav-btn span:nth-child(1){top:10px}
#liproducts .nav2 .item-con{display:none}
.head-nav .nav2>li{display:block}

#xyz *{box-sizing:border-box}
#xyz{position:relative;z-index:99999;width:120px;height:32px;line-height:32px;margin-left:10px;top:0;}
 header.is-fix #xyz{top: 0px}
.xyz12{width:100%;position:absolute;height:100%}
.xyz12 ul{border:1px #dbdbdb solid;background:#FFF}
.xyz12 ul>li{display:none}.xyz12 ul>li:nth-of-type(1){display:block}
.xyz12 li{float:none;margin-left:0;width:100%;position:relative;height:30px;z-index:1;text-align:left;padding:0 8px}
.xyz12 li a{color:#333;font-size:12px;padding:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:block;}
.xyz12 li.selected{border-top:0}.xyz12 li.selected a{color:#2f9cd0}
.xyz12 span{position:absolute;right:6px;top:0;display:block;width:32px;height:32px;cursor:pointer;z-index:100}
.xyz12 span:after{position:absolute;content:" ";top:10px;right:10px;width:7px;height:7px;border:2px solid #707070;border-top:none;border-left:none;transform:rotate(45deg);cursor:pointer}
.xyz12 span.dp:after{top:13px;transform:rotate(-135deg)}
.xyz12 li img{vertical-align:middle;margin:0 7px 0 0}
.xyz12 li:hover{background:#f2f2f2}

.search-box{width:100%;height:0;justify-content:center;align-items:center;display:flex;position:absolute;top:100%;left:0;background:#FFF;transition:all .3s ease-in-out;overflow:hidden;opacity:0}
.search-box-act{height:90px;opacity:1}
.search-box #txtSearch{height:38px;border-bottom:1px solid #E5E5E5;width:75%;background:#FFF;max-width:600px;}
.search-box #txtSearch::placeholder{color:#111}
.search-box #btnSearch{background-color:#111;text-align:center;width:38px;height:38px;line-height:38px;margin-left:20px;}
.search-box #btnSearch i{color:#FFF}
.head-search-btn{font-size:22px;cursor:pointer;margin-left:20px;padding:4px;color:#111}

@media screen and (max-width:1200px)and (min-width:1000px){

#xyz{width:100%;margin:10px 0;height:auto}
#xyz .xyz12{position:relative}
#xyz .up{display:none}
#xyz .xyz12 ul{border:0;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
#xyz .xyz12 ul>li{display:block !important;width:33.3333%}
#xyz .xyz12 li a{font-size:14px}


}
@media screen and (max-width:769px){
.head-logo  span{display: none;}
.foot-item1 p, .foot-item3, .head-search-btn {
    display: none;
}
#xyz{width:100%;margin:10px 0;height:auto}
#xyz .xyz12{position:relative}
#xyz .up{display:none}
#xyz .xyz12 ul{border:0;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
#xyz .xyz12 ul>li{display:block !important;width:33.3333%}
#xyz .xyz12 li a{font-size:14px}
}





@media (max-width:769px) {
.head-nav>ul>li>a{font-size:14px;font-weight: normal;}
  .head-nav>ul>li{width:100%;border-bottom:1px solid #eee}
  .search-box{display: none;}
.search-box{height:auto;position:static;opacity:1;padding:0 .26rem;margin:.3rem 0}
.search-box #btnSearch{background-color:#FFF;height:.7rem;margin-left:0;width:.4rem;line-height:.7rem}
.search-box #btnSearch i{color:#7aca35;font-size:.3rem}
.search-box #txtSearch{width:calc(100% - .4rem);border:none;max-width:100%;height:.7rem;font-size:.2rem}
.head-nav>ul {width: 100%}}@media (min-width:1000px) and (max-width:1100px) {
.head-nav>ul>li {margin:0 10px;}}#feedbackForm .inquiry-form .feed-verification{width:100%;display:flex;margin-top:30px}
#feedbackForm .inquiry-form .feed-verification input{margin:0;flex:1;max-width:300px}
#feedbackForm .inquiry-form .feed-verification img{width:90px;height:100%!important;cursor:pointer}
@media(max-width:768px){
#feedbackForm .inquiry-form .feed-verification{margin-top:4vw}
}@media(max-width:1024px){
.mobcate-main .l-wrap{flex-wrap:wrap}
.mobcate-main .common-content{width:100%}
.mobcate-main .sidebar{display:block;width:100%;margin:0;flex-basis:100%}
.mobcate-main .sidebar .sidebar-item:nth-of-type(n+2){display:none}
.mobcate-main .sidebar .sidebar-item{position:relative}
.mobcate-main .sidebar .sidebar-cate{position:absolute;top:110%;left:0;right:0;padding:0 10px;z-index:20;display:none;background-color:#fff;box-shadow:rgb(0 0 0 / 20%) 0 2px 16px}
.mobcate-main .sidebar .sidebar-title{margin:0;padding:10px 0;cursor:pointer;background:url(/images/cate-btn.png) right center/24px no-repeat}
}