@charset "utf-8";
/*header*/
#top{background: #EEEEEE;color:#606060;font-size:13px;line-height:30px}
#top .container{max-width:1100px}
#top .topR a{color:#606060}
#header{padding:30px 0 5px;background:#fff}
#header .header-box{max-width:1270px}
#header .header-box .logo a img{display:block;max-width:100%}
#header .nav-btn{display:none}
#header .tel div{display:flex;align-items:end;font-size:20px}
#header .tel img{display:block;margin-right:10px}
#header .tel p{line-height:1.2;font-size: 34px;color: #036EEE;width: 100%;font-family: fantasy;}
#header .tel span{font-size:32px;font-weight:bold;color:#DB2808}
#nav{position:relative;z-index: 9;background: url(../images/nav-bg.png) repeat center;}
.nav{max-width: 1100px;}
#nav .nav>li{position:relative;text-align:center;width: 14.2%;max-width: 120px;}
#nav .nav>li>a{display:block;padding: 0 15px;line-height: 49px;font-size:16px;position:relative;color: #fff;}
#nav .nav>li>a:hover,#nav .nav>li:first-child>a{background: #DB2808;color: #fff;}
#nav .iconfont1{font-size:18px;color:#fff;transform:rotate(180deg);display:inline-block;align-items:center;margin-left:10px;transition:0.5s all}
#nav .iconfont2{display:none}
#nav .nav ul{position:absolute;width:100%;background:rgba(9,10,54,0.8);padding:5px 0;display:none}
#nav .nav ul li{padding:5px 10px}
#nav .nav ul li a{display:block;line-height:3;color:#fff}
#nav .nav ul li a:hover{background:#00CCAB}
@media (max-width:768px){
	body{padding: 50px 0 50px;}
	#top{display: none;}
	#header{position:fixed;z-index: 2;width:100%;top:0;box-sizing:border-box;padding: 0;box-shadow: 0 0 5px #ccc;}
	#header .header-box{height: 50px;}
	#header .header-box .logo a{display:block;}
	#header .header-box .logo{max-width: 85%;}
	#header .nav-btn{width:25px;height:16px;position:relative;cursor:pointer;display:block}
	#header .nav-btn .line{display:block;width:100%;height:2px;border-radius:2px;background-color:#0151E6;position:absolute;left:50%;margin-left:-15px;transition:0.5s all}
	#header .nav-btn .line1{-webkit-transform-origin:4px 0;-ms-transform-origin:4px 0;transform-origin:4px 0}
	#header .nav-btn .line2{top:7px}
	#header .nav-btn .line3{bottom:0px;-webkit-transform-origin:1px center;-ms-transform-origin:1px center;transform-origin:1px center}
	#header .nav-btn.active .line1{transform:rotate(45deg)}
	#header .nav-btn.active .line2{display:none}
	#header .nav-btn.active .line3{transform:rotate(-45deg)}
	#header .tel{display: none;}
	#nav{display:none;position:fixed;top: 50px;background:rgba(55,55,55,.95);width:100%;left:0;height: calc(100% - 50px);}
	#nav .nav{padding:10px;display:none;height:unset;width:100%;box-sizing:border-box}
	#nav .nav>li{text-align:left;transform:translate(30px,0);opacity:1;transition:0.8s all ease;width: 100%;max-width: unset;}
	#nav.active .nav li{transform:translate(0,0);margin-right: 0;}
	#nav .nav>li>a{color:#fff;line-height: 36px;padding: 0 0 0 15px;position: relative;}
	#nav .nav>li>a:hover, #nav .nav>li:first-child>a{background: unset;}
	#nav .iconfont1{display:none}
	#nav .iconfont2{position:absolute;left:unset;margin-left:0;right:0;top:0;margin-top:0;z-index:2;width:36px;text-align:center;display:block;color:#fff;transform:rotate(0deg);transition:0.5s all}
	#nav .iconfont2.active{transform:rotate(90deg)}
	#nav .nav ul{position:unset;background:unset;padding:0 0 0 20px}
	#nav .nav ul li a{line-height:2}
}
/*banner*/
#banner ul li img{display: block;width: 100%;}
#banner .swiper-pagination-bullet{background: #fff;width: 50px;height: 4px;border-radius: unset;opacity: 1;}
#banner .swiper-pagination-bullet-active{background: #0151E6;}
@media (max-width:768px){
	#banner .bannerBtn{display: none;}
}
/*search*/
#search{background:#EEEEEE;padding:15px 0}
#search .searchL span{color:#0052E6;font-size:18px;font-weight:bold}
#search .searchR input{border:0;outline:0;padding:0 5px;line-height:32px;width:300px}
#search .searchR span{background: #0151E6;color: #fff;padding: 0px 10px;line-height: 32px;cursor: pointer;}
@media (max-width:768px){
	#search{padding: 0px 0 10px;}
	#search .searchR{width: 100%;}
	#search .searchR input{flex: 1;}
}

#left{width:240px;color:#fff}
.category-btn{display:none}
#left .category-close-btn{display:none}
#left .left-tit{background-image:linear-gradient(#015EC6,#0055B2,#00469C);text-align:center;line-height:1.5;padding:25px 0;border-bottom:3px solid #3A88DD}
#left .left-tit .en{color:#7598D2;font-size:30px}
#left .left-tit .cn{font-size:28px}
#left .category{background:#EFEFEF;padding:0 10px;overflow:hidden}
#left .category a{display: flex;justify-content: space-between;align-items: center;line-height:30px;background:#2972D8;margin:30px 0;padding:0 10px 0 15px;color:#fff;}
#left .category a span{width:20px;height:20px;background:#fff;border-radius:50%;position: relative;transition: 0.3s all;}
#left .category a span:after{display:block;content:'';position:absolute;width:0;height:0;border:5px solid transparent;border-left:7px solid #2972D8;right: 1px;top: 5px;}
#left .category a:hover{background: #D7292A;}
#left .category a:hover span{transform: rotate(90deg);}
#left .category a:hover span:after{border-left:7px solid #D7292A;}
#left .left-phone-box{background-image:linear-gradient(#015EC6,#0055B2,#00469C);line-height:1.5;padding:25px 15px;border-bottom:3px solid #3A88DD}
#left .left-phone-box .left-t{color:#9EB5DE;font-size:20px}
#left .left-phone-box .left-phone{font-size:32px;font-family:fantasy}
#right{width: calc(100% - 300px);}
#right .right-title{border-bottom:1px solid #C9C9C9;margin-bottom:30px}
#right .right-title span{font-size:22px;display:block;width:128px;border-bottom:3px solid #0151E4;margin-bottom:-2px;text-align:center;line-height:3}
@media (max-width:1200px){
	#left .category a{font-size: 18px;}
	#right{width: calc(100% - 260px);}
}
@media (max-width:1024px){
	#left .category a{font-size: 16px;}
}
@media (max-width:768px){
	#right .right-title span{
    font-size: 20px;
    line-height: 2.2;
    width: 100px;
}
	#in-product .container{display: block;}
	.category-btn{display:block;color:#fff;background-color:#0151E6;border-color:#0151E6;margin: 10px 0;text-align:center;border-radius:5px}
	#left{width:100%;height:100%;position:fixed;top:0;left:100%;transition:left .3s;z-index:9999}
	#left.active{left:0}
	#left .category-close-btn{width:10%;height:100%;float:left;padding:0;background:#bfbfbf;display:block}
	#left .category-close-btn i{width:100%;height:40px;display:block;text-align:center;line-height:40px;margin-top:120px;background:#686868;color:#fff}
	#left .category{overflow-y:auto;width:90%;height:100%;float:left;box-sizing:border-box;background:#fff;display:block;margin:0}
	#left .category li{border-bottom:solid 1px #ddd;padding:5px 10px;line-height:1}
	#left .category li a{padding:10px 0;height:unset;line-height:unset;color:#707070;margin: 0;background: transparent;}
	#left .category li span,#left .category li span:after{display:none}
	#left .left-tit{display: none;}
	#left .left-phone-box{display: none}
	#right{width: 100%;}
}

/*footer*/
#footer{background: #005CDB;color:#fff;padding: 20px 0 20px;}
#footer a{color:#fff}
#footer .container{}
#footer .foot-nav{border-bottom: 1px solid;}
#footer .foot-nav li{margin-right: 30px;}
#footer .foot-nav li a{color:#F4F0F1;font-size: 18px;}
#footer .foot-contact{margin-top: 10px;}
#footer .foot-contact li{}
#footer .foot-contact li b{}
#footer .foot-contact li a{}
#footer .foot-qa{margin-left:30px}
#footer .foot-qa img{display:block;max-width: 150px;}
#footer .foot-qa p{text-align:center}
@media (max-width:768px){
	#footer{padding: 10px 0;}
	#footer .container{align-items:center;flex-direction: column-reverse;}
	#footer .foot-nav li a{font-size: 14px;}
    #footer .foot-nav{justify-content: left;}
	#footer .foot-contact{}
	#footer .foot-qa{margin-top:10px;display: none;}
}
.foot{display:none;}
@media (max-width:768px){
	.foot{position: fixed;bottom: 0;width: 100%;z-index: 9;display: flex;background: #000;box-shadow: 0 0 2px #eee;}
	.foot li{width: 25%;text-align: center;line-height: 20px;padding: 4.5px 0;}
	.foot li i{color: #fff;}
	.foot li span{display: block;color: #fff;}
}