﻿.topbar{ width: 100%; height: 42px; background: #f5f5f5; }



.topbar-left{}
.topbar-left img{ margin-right: 5px;}
.topbar-left span a{ padding: 0 3px; text-decoration: underline;}
.topbar-left em:before{ content: "|"; padding: 0 10px; }



.topbar-share{}
.topbar-share a{ font-size: 1.2rem; margin-left: 25px; color: #111111;}
.topbar-share a:hover{color: #0c0427;}

header{ width: 100%; background: #FFFFFF;}

.header-all{ padding: 25px 0;}

.logo{ width: 124px; height: 82px;}
.logo img{ width: 124px; height: 82px;}
.logo h1{ display: none;} 

.header-right{ width: calc(100% - 222px);}



.hsearch{ width: 70%; height: 44px; background: #FFFFFF; border: 1px solid #393939;  border-radius:28px; padding: 7px; position:relative;}
.hsearch input{ width:calc(100% - 30px); height: 30px; line-height: 30px; border: none; background:none; padding: 0 25px;}
.hsearch button{ border: none; border-radius:50%; width: 30px;  height: 30px; line-height: 30px; color:#FFFFFF; background: #1070C3;  font-size:1rem;}
.hsearch button:hover{ background: #050102;}

.hbom{}
.hbom a{ display: inline-block; height: 44px; line-height: 44px; padding: 0 20px; color:#FFFFFF; background: #EFBD35;border-radius: 10px;}

.hcart{}
.hcart a{ display: block; width: 44px; height: 44px; margin-left: 10px; position: relative;}
.hcart a em{ display: inline-block; width: 22px; height: 22px; line-height: 22px; text-align: center; border-radius:50%; background: red; color: #FFFFFF; font-size: 0.8rem; position: absolute; z-index: 333; right: -10px; top: -10px;}

.nav-box.current{ position:fixed; left:0; top:0; z-index:999;}
.nav-box{ width: 100%; height: 60px; background: #13141d; line-height: 60px;}
.nav-box li a{ color: #FFFFFF; font-size: 1rem;}
.nav-box li a:hover{ text-decoration: underline;}


.web-language-box{ display:none; background:rgba(0,0,0,.5); width:100%; height:100%; position:fixed; left:0; top:0; z-index:999;}
.web-language-box .flex{width:100%; height:100%;  }
.web-language-box .flex a{ display: inline-block; border-radius:6px; height: 42px; line-height: 42px; overflow: hidden; text-align: center; color: #FFFFFF; margin-bottom: 10px;  background:#ffbf43; width: 120px;}
#web-language-close{ width: 60px; font-size: 1.5rem;}



.search-window{ display:none; position:absolute;background: #fff;border-radius: 0 0 4px 4px;border-top: none;box-shadow: 0 4px 4px -2px #999;padding: 20px;top: 40px;left: 0;width: 100%;z-index: 999;}
.search-window a{margin-right:10px;line-height:24px;color: #999!important;}
.search-window ul.search-rst{
    padding-left: 0;
}
.search-window ul.search-rst li{margin-bottom: 8px; font-size:0.8rem;}
.search-window ul.search-rst li a p{color:#000;margin-bottom: 0px;}
.search-window ul.search-rst li a:hover p{color:#d64851;}
.search-window ul.search-rst li a p.mfg{ color:#999 }
.search-window b{font-size:0.9rem; line-height:32px; display:block;}


header .topmenu{ display: none;}



@media (max-width: 768px) {

.topbar{ display: none;}

header.container{background: #FFFFFF; width: 100%; padding: 15px 3%;}
header .header-right{ display: none;}
.header-all{ padding: 15px 0;}
header .topmenu{ display: block; }
header .topmenu a{ border: 1px solid #1070C3;  color: #1070C3; border-radius: 3px; padding: 8px; font-size: 20px; }

.logo{ width: auto; height: auto;}

.navright li.navlangue{ display: block;}
.logo img{ width:120px; height: auto;}



.web-language-box .flex a{ display: block; width: 48%; float: left; margin: 1%; }
.web-language-box .flex div{ width: 100%; justify-content: space-between;}
#web-language-close{ width: 60px; font-size: 1.5rem;}



.nav-main{height: 0; overflow: hidden; position: absolute; left: 0; top: 80px; z-index: 999;}

.nav-box{ width: 100%; height: auto; background: #1070C3; line-height: 42px;}
.nav-box li{ width: 100%;}
.nav-box li a{ color: #FFFFFF; font-size: 1rem;}
.nav-box li a:hover{ text-decoration: underline;}


#mainnav {
    display: none;
    transition: max-height 0.3s ease;
}

/* 当添加 active 类时显示 */
#mainnav.active {
    display: block;
}

#mainnav1 {
    display: none;
    transition: max-height 0.3s ease;
}

/* 当添加 active 类时显示 */
#mainnav1.active {
    display: block;
}


}