@charset "utf-8";
/* CSS Document */
body{font-family:"Arial", Microsoft JhengHei, sans-serif}
*{ box-sizing:border-box}
ul{margin:0;padding-left:0}
.left_zone{width:260px; float:left}
.right_zone{ float:left; background:#fff;width:calc(100% - 260px);}

#company_logo { background:rgba(0,0,0,0.38); text-align:center;padding:50px 0 30px 0;margin-bottom:30px}
#main_menu{padding:0 30px;margin-bottom:120px}
#main_menu>li{ border:1px solid rgba(255,255,255,0);padding:10px 20px; text-transform:uppercase;margin-bottom:10px}
#main_menu>li:hover{ border:1px solid rgba(255,255,255,0.38)}
.line_menu>ul>li.active>ul{ display:block;visibility:visible}
.dropdown-backdrop{ display:none}
#mainnav .dropdown-menu>li>a{color:#fff;padding:5px ; white-space:normal}
#mainnav .dropdown-menu{ position:static; float:none; border-radius:0; background:rgba(255,255,255,0.3);padding:0;margin:0;min-width:inherit}
#mainnav .dropdown-menu>.active>a, #mainnav .dropdown-menu>.active>a:hover, #mainnav .dropdown-menu>.active>a:focus{ background:rgba(255,255,255,0.5)}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus{border-radius:0; background:rgba(255,255,255,0.5)}
.left_zone a{ cursor: pointer}
#language_area{margin-bottom:100px}
.lang{margin:0 30px;border:1px solid rgba(255,255,255,0.38); font-family:"Arial", Microsoft JhengHei, sans-serif;padding:7px }
.lang li{width:49%; text-align:center}
.lang>li+li{ border-left:1px solid rgba(255,255,255,0.38)}

.lang>li>a{padding:0;color:rgba(255,255,255,1.00)}
.lang>li>a:hover { color:rgba(180,167,255,1.00)}
.contact_in{ text-align:center}

.contact_in ul li{padding:25px}
.contact_in a{ display:block}
.in_pro{ border-bottom:1px solid #1d2088;margin-bottom:60px}
.contact_in .tooltip{ font-size:13px; font-family:"Arial", Microsoft JhengHei, sans-serif}
.in_pro ul li{width:25%; float:left;padding-left:30px}
.in_pro ul li:last-child{padding-right:20px}
.in_pro .pic{width:40%; float:left;margin-bottom:20px}
.in_pro .pic img{width:100%;max-width:100%;}
.in_pro .info{width:60%;padding-left:10px; float:left}
.in_pro h2{margin:0; font-size:16px; font-family: "Arial", Microsoft JhengHei, sans-serif; color:#46437f; text-transform:uppercase ; font-weight:bold;height:60px; letter-spacing:0}
.in_pro p{margin:0; font-style:oblique ;font-size:15px; font-family: "Arial", Microsoft JhengHei, sans-serif;color:#79787c; line-height:120%}
.in_ab {margin-bottom:50px}
.in_ab .ab_content {width:calc(35% - 33px);; float:left;padding-left:33px;margin-right:33px; position:relative}
.in_ab .ab_content  img{right:60px; position:absolute;top:1px}
.in_ab .ab_content h1{font-size:33px;height:40px;color:#080861; font-family:"Calibri-Light", Microsoft JhengHei, sans-serif}
.in_ab .ab_content  p{font-family:"Candara", Microsoft JhengHei, sans-serif; font-size:15px;color:#5e5d62; line-height:130%; letter-spacing:.05em}
.in_ab .inab_pic {width:65%; float:left}
.in_ab .inab_pic div{ float:left;margin-right:20px;height:190px; overflow:hidden; text-align:center}
.in_ab .inab_pic div img{width:auto;max-width:none;height:190px;margin:0 auto}
.in_ab .inab_pic div.abapic1{width:19%}
.in_ab .inab_pic div.abapic2{width:25%}
.in_ab .inab_pic div.abapic3{width:28%}
.in_ab .inab_pic div.abapic4{width:18%}

.in_btn{ text-align:right;margin-right:10px;height:35px}

.in_btn a{ border:1px solid rgba(29,32,136,1.00);padding:6px 20px; color:#1f0896; font-size:14px}
.in_btn a:hover{color:rgba(80,0,249,1.00); border:1px solid rgba(58,24,172,1.00)}
#footer{ background:#c6c9cd; border-top:1px solid #1d2088;padding:30px 0 30px 30px;font-family: "Arial", Microsoft JhengHei, sans-serif; font-size:14px}
.ft_left{width:78%; float:left;color:#1e1685}
.ft_left a{color:#1e1685}
.ft_right{width:22%; float:left}
.us_info td{padding-right:15px; vertical-align:middle}
.us_info td img{ border:1px solid #7d7d7d;padding:2px}
.us_info td:first-child img{ border:0;margin-right:20px}
#footlink ul li { float:left;margin-right:5px}
#footlink ul li a{color:#727378; font-size:12px}
#footlink ul li a:hover{color:rgba(0,0,0,1.00)}

/*banner*/
.banner_zone{width:100%;position:relative}
.cycle-slideshow{margin-bottom:12px}
.banner {width:100%;height:730px; background-size:cover}
.banner1{ background:url(../images/banner1.jpg) no-repeat} 
.banner2{ background:url(../images/banner2.jpg) no-repeat;} 
.banner3{ background:url(../images/banner3.jpg) no-repeat;} 
.banner4{ background:url(../images/banner4.jpg) right top no-repeat;} 
.banner5{ background:url(../images/banner5.jpg) no-repeat;} 
.banner6{ background:url(../images/banner6.jpg) no-repeat; } 

.banner {  position:relative}
.banner .pic img{width:100%}

.banner_text{ position:absolute; z-index:150;width:100%;height:calc(100% - 30px)}
.text_zone{ position:absolute; z-index:150;width:100%;height:100%}
.cycle-pager{ background:#cfd0d0;padding:4px 0 13px 3px}
.banner_btn{ background:#979797;height:10px;width:16.3%;margin:0 0.15% ; float:left; cursor:pointer}
.banner_btn:hover{ background:rgba(133,133,133,1.00)}
.cycle-pager-active , .cycle-pager-active:hover{ background:rgba(48,4,160,1.00)}
.banner h3 , .banner h4{margin:0}
.slogin1{width:650px; position:absolute; left:5%}
.slogin2{width:800px; position:absolute;right:5%; bottom:8%}
.line_tit{ background:url(../images/line.png) left -10px no-repeat}
.slogin1 h3{ font-family:"Calibri-Light", Microsoft JhengHei, sans-serif; font-size:40px;color:#1313a9; text-transform:uppercase;padding-top:60px;margin:0;margin-left:120px}
.slogin1 h4{  font-size:65px; font-weight:bold;color:#6a6a6c; text-transform:uppercase;margin:0;margin-left:88px; font-family:"Arial", Microsoft JhengHei, sans-serif}
.slogin2 img{max-width:90%}
.slogin1 p{margin-left:92px;width:350px; font-family:"Candara", Arial,Microsoft JhengHei, sans-serif; font-size:13px;color:#5e5d62;margin-bottom:25px}
.slogin1 a{padding:10px 30px;color:#1f0896; border:1px solid #1d2088; font-size:13px; font-family:Candara;margin-left:92px}
.slogin1 a:hover{color:rgba(80,0,249,1.00); border:1px solid rgba(58,24,172,1.00)}
.oem{ position:absolute;right:140px;top:-40px}
#cominfo ul li{ display:inline-table; vertical-align:middle}
.us_info li img{padding:1px; border:1px solid rgba(125,125,125,1.00);margin:0 5px}
.us_info li.ft_logo img{ border:0;margin-left:0}
.inside_banner{ position:relative}
.ban_top{ position:relative; z-index:150}
.ban_top div{ position:absolute}
.top_slogn1{ top:55px; left:30%}
.top_iso{top:40px; left:51%}
.top_pic1{ right:20%;top:32px}
.top_pic2{ right:1%;top:32px}
#sidebar .title{ font-family:"Calibri-Light", Arial,Microsoft JhengHei, sans-serif;padding-left:46px;width:30%;color:#080861; font-size:34px}
.title_zone{margin-bottom:10px}
.title_zone .tree{width:53%; text-align:right}
.indside-slideshow , .ban{width:100%}
.ban_top img{max-width:100%}
.ban{height:162px; border-bottom:1px solid #1d2088}
.ban1{ background:url(../images/inside_banner1.jpg) no-repeat}
.ban2{ background:url(../images/inside_banner2.jpg) no-repeat}
.title_zone{ border-bottom:1px solid #1d2088}
.title_zone div{ float:left}
.breadcrumb{margin-bottom:0; font-size:13px;padding:20px 0 0 0; background:none}
.breadcrumb a{color:#727378}
.container_product2 .line_menu, .container_product3 .line_menu, .container_product_show .line_menu {padding:0 35px;height:100px }
.container_msg2  .line_menu{padding:0 35px;height:auto }
.line_menu>ul{ position:relative}
.line_menu>.nav>li{ position:static; font-size:25px}
.line_menu>ul>li{ float:left;}
.line_menu>ul>li>ul{width:auto; position:absolute; left:0}
.line_menu>ul>li>ul>li{ float:left;padding:0 15px; font-size:20px;margin:0 10px 10px;height:35px}
.line_menu>ul>li>ul>li.active{ border-bottom:1px solid #7d7d7d;padding-bottom:6px}
.line_menu>.nav>li>a{color:rgba(167,167,167,1.00);padding:8px 15px;margin:0 18px 10px; border-radius:5px 5px 0 0}
.line_menu>ul>li>ul>li>a{color:rgba(8,8,97,1.00); font-size:18px}
.line_menu>.nav>li.active>a{ color:#1e1458;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d4cef6+0,ffffff+57 */
background: #d4cef6; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover,  #d4cef6 0%, #ffffff 57%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  #d4cef6 0%,#ffffff 57%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  #d4cef6 0%,#ffffff 57%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4cef6', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
.line_menu>.nav>li>a:hover{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d4cef6+0,ffffff+57 */
background: #d4cef6; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover,  #d4cef6 0%, #ffffff 57%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  #d4cef6 0%,#ffffff 57%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  #d4cef6 0%,#ffffff 57%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4cef6', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
.nav>li>a:hover, .nav>li>a:focus{ background:none}
.line_menu>ul>li>ul>li.active>a{ border-bottom:5px solid #1e1458;padding-bottom:4px}
.line_menu>ul>li>ul>li:hover{ border-bottom:1px solid #7d7d7d;padding-bottom:6px}
.line_menu>ul>li>ul>li:hover>a{border-bottom:5px solid #1e1458;padding-bottom:4px}

#roottreecid_2{ clear:both;overflow: auto;
  zoom: 1;}
/*without_pro_menu*/


.container_msg2 .line_menu>ul>li{ float:left; font-size:20px;margin:0 10px 10px;height:42px}
.container_msg2 .line_menu>ul>li.active{ border-bottom:1px solid #7d7d7d;padding-bottom:6px}

.container_msg2 .line_menu>ul>li>a{color:rgba(8,8,97,1.00); font-size:18px}
.container_msg2 .line_menu>ul>li.active>a{ border-bottom:5px solid #1e1458;padding-bottom:4px; background:none}
.container_msg2  .line_menu>.nav>li>a:hover{ background:none}
.container_msg2 .line_menu>ul>li:hover{ border-bottom:1px solid #7d7d7d;padding-bottom:6px}
.container_msg2 .line_menu>ul>li:hover>a{border-bottom:5px solid #1e1458;padding-bottom:4px}



#result{ display:none}
#logo_m{ display:none}
#gotop {
position: fixed;
    right: 20px;
    bottom: 50px;    
    padding: 5px 10px;    
    font-size: 20px;
    background:rgba(31,57,103,0.8);
    color: white;
    cursor: pointer; z-index:1000; 
}


/*pro*/
.pro_left{width:100%}
.pro_right{width:100%; }
.pro_3m{width:30%; float:left}
.pro_7m{width:70%; float:left}
.pro_title{ text-align:right;color:#080861; font-family:"calibril", Arial,Microsoft JhengHei, sans-serif;padding:190px 15px 0 0;  }
.pro_title span{line-height:200%; border-bottom:1px solid #080861;font-size: 150%;font-weight: bold;}

.probigpic_bg{ /*background:url(../images/pro_bg.png) no-repeat;*/margin-bottom:30px}
.page-header { margin-top: 0;}
.description_text{ font-size:15px; line-height:150%}
.showsmall{/*padding:0 30px;*/width:100%;}
.pro_showtit{ border-bottom:1px solid #1d2088;padding:0 8px 7px}
.pro_showtit h1{margin:0;padding-bottom: 5px;  border-bottom:9px solid rgba(125,125,125,0.8); display:inline; font-size:22px; font-family:"calibril", Arial,Microsoft JhengHei, sans-serif; font-weight:bold}
.content_zone{width:80%;margin-left:60px}
.pro_left .pro-name , .prodesc{ display:none}
#incateall ,.mobile_gallery{ display:none}
.thumbnail{ border-radius:0}
.prolist_box{padding:0 10px}
.cate-name{margin-bottom:10px}
.thumbnail{ position:relative}
.hoverprolist{width:100%;height:100%; position:absolute; top:0;left:0;background:rgba(30,19,88,0); cursor:pointer;  transition: 0.5s all; 
    -webkit-transition: 0.5s all; 
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;}
.hoverprolist a{color:rgba(255,255,255,0); font-size:20px; position:absolute;top:40%; left:0;width:100%}
.prolist_box:hover .hoverprolist{ background:rgba(30,19,88,0.9); text-align:center}
.prolist_box:hover  .hoverprolist a{color:rgba(255,255,255,1.0)}
.prolist_box:hover .cate-name a{ color:#fff}
.pshow_title{display: none;}
.prochar{font-size: 14px; margin-top: 30px;}
.pro-info{float:left;padding:2% 1%;width:24%;}
.conten_menu{min-height:860px}
.product-content { margin-bottom: 10px; }
.product-content th{background:#d1481b; font:12px Verdana, Arial, Helvetica, sans-serif; color:#FFFFFF; text-align:right; width:110px; padding:1px 6px; border: #fff 1px solid; }
.product-content td{background:#f1c8ba; font:11px Verdana, Arial, Helvetica, sans-serif; color:#2b2b2b; padding: 1px 6px; border: #fff 1px solid;}
.product-content td.color01{background:#e8a38d}
.product-content td.color02{background:#f1f0ef}
.product-content td.color03{background:#e4e1df}
	
/*about*/
.container_msg2 .page-header {margin-bottom:0}
.about_1{ position:relative;width:82%; box-sizing:border-box}
.about_1::before{ content: '';
  position: absolute;
  top: 0;
  left: 18px;
  height: 100%;
  width: 4px;
  background: #d7e4ed;}
.about_1 ul{ position:relative}
.about_1 ul li{ position:relative;margin-top:30px}
.about_1 ul li:nth-child(odd){width:50%; float:right;}

.about_1 ul li:nth-child(even){width:50%; float:left; text-align:right}
.about_1 ul li:first-child{padding-top:60px;margin-top:0}
.about_1 ul li:nth-of-type(2){  background:url(../images/about/company_bg.jpg) no-repeat; background-size:cover;padding-top:170px;margin-top:0}
.about_1 a{ font-size:25px;color:#1e1458;font-family:"Candara", Arial,Microsoft JhengHei, sans-serif; text-align:center; line-height:80px}
a.btn_right{ background:url(../images/about/btn_right.png) no-repeat;width:96px;height:86px; display:block;left:-45px; z-index:300; position:absolute}
a.btn_left{ background:url(../images/about/btn_left.png) no-repeat;width:96px;height:86px; display:block; float:right;z-index:300; position:absolute;right:-45px}
.container_msg2 .txtNormal{ overflow:inherit}
.about_1 .info{ background:url(../images/about/dot.jpg) left bottom repeat-x;padding:0 0 70px 0;margin-bottom:50px;color:#46437f}
.about_1 ul li:nth-child(odd) .info{margin-left:70px}
.about_1 ul li:nth-child(even) .info{margin-right:60px;margin-left:40px}
.about_1 ul li:hover{ cursor:pointer}
.about_1 ul li:nth-child(odd):hover a.btn_right{background:url(../images/about/btn_right_a.png) no-repeat;}
.about_1 ul li:nth-child(even):hover a.btn_left {background:url(../images/about/btn_left_a.png) no-repeat;}

.about_1 ul li:hover .info{ /*font-weight:bold ;*/color:#3745b5; /*font-style:italic*/}
.about_1 ul li:last-child{ background:url(../images/about/companybg2.png) left no-repeat; background-size:cover;}
.about_1 ul li:last-child .info{ background:none}
.about_1 ul li.bk4{margin-top:50px}
.about_1 ul li.bk7{margin-top:0}
.about_1 ul li.bk9{margin-top:70px}
.about_1 ul li.bk10{margin-top:60px}
.about_1 ul li.bk11 {
    margin-top: 80px;
}
.about_1 ul li.bk9 .info {
    padding-top: 25px;
}

.about_1 ul li.bk8 .info{padding-top:25px}
.about_1 ul li b{ font-size:20px; font-style:italic}
.about_1 ul li b img{margin-left:10px}

#cd-timeline::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 0;
  left: 18px;
  height: calc(100% - 80px);
  width: 7px;
  background: #1e1358; z-index:200
}
#cd-timeline::before {
    left: 50%;
    margin-left: -3px;
	margin-top:40px
  }
.cd-container::after {
  /* clearfix */
  content: '';
  display: table;
  clear: both;
}

/*about3*/
.about_3{width:80%;margin-left:60px;padding-top:70px}
.about_3 ul li{ float:left}
.about_3 ul li:first-child{width:40%;}
.about_3 ul li:last-child{width:56%;margin-left:10px}
.about_3 ul li:first-child div{padding:0 30px 0 10px}
/*.external{padding-bottom:55px}*/
.external img{width:155px}
.external a{padding:6px; border:1px solid #fff; display:block; float:left;margin:0 7px 10px 7px}
.external a:hover , .about_3 .cycle-pager-active{ border:1px solid #ea0a34}
.about_3 .cycle-pager-active, .about_3 .cycle-pager-active:hover{ background: #fff}
.about_3 .cycle-slideshow{margin-bottom:30px}
.about_3 h2{ font-size:19px; font-family:"Calibri Bold", Arial,Microsoft JhengHei, sans-serif;margin:0 0 20px 0}
.about_3  p{color:#1f214a; font-size:18px; font-family:"Calibri-Light", Arial,Microsoft JhengHei, sans-serif; line-height:140%}
.about_3 ul li:first-child .ab_zone1{padding-top:50px;margin-bottom:100px}
.mobile{ display:none}
/*0106*/
.about_3.environmental .ab_zone1>ul>li {
    list-style: inside;
}
.about_3.environmental ul li:first-child, .about_3.environmental .ab_zone1>ul>li {
    float: none;
	width: 100%;
}
.about_3.environmental ul li:last-child {
    margin-left: 0;
}
h3.about_titletext {
    font-weight: 600;
    font-size: 22px;
	color: #1e1458;
}
.about_3.environmental ul li:first-child .ab_zone1 {
    padding-top: 0;
}

.ecatalog li { float: left; margin-right: 20px; width: calc(33.33% - 20px); margin-bottom: 20px;}

/*contact*/
.container_contact #sidebar { display: none; }

/**/

@media (max-width:1440px) {
.line_tit{ background:url(../images/line.png) -55px 0px no-repeat;}
.slogin1{width:500px;left:1%}
.slogin1 h3{font-size:25px;padding-top:30px}
.slogin1 h4{font-size:50px}	
.slogin2{width:560px}	
.oem{right:90px;top:-30px}
.slogin2 .oem img{max-width:70%}
.slogin1 p{width:300px; line-height:130%;margin-bottom:15px}
.slogin1 a{padding:8px 20px}
.in_pro h2{ line-height:150%}
.in_pro ul li{width:50%;padding:10px 15px}
.in_pro .info{padding-left:15px;width:75%}
.in_pro .pic{width:25%}
.in_pro{margin-bottom:40px}
.in_ab .ab_content{padding-left:15px;margin-right:8px;width:calc(36% - 8px)}
.in_btn a{padding:5px 10px; font-size:14px}

.in_ab .inab_pic div{margin-right:8px}
.in_ab .inab_pic{width:64%}
.in_ab .inab_pic div img{height:185px}
.in_ab .ab_content h1{height:auto;margin:5px 0 20px 0}
.in_ab .ab_content p{ line-height:100%;margin-bottom:5px}
.in_ab .ab_content img{right:20px}
.in_ab .inab_pic div.abapic1{width:20%}
.in_ab .inab_pic div.abapic4{width:19%}
.banner{height:570px; background-size:120%}
.banner1{ background-position:-10px 0} 
.banner2{background-position:-80px 0 } 
.banner3{background-position:-145px 0} 
.banner4{background-position:-180px 0} 
.banner5{background-position:-80px 0} 
.banner6{background-position:-120px 0 } 

.ft_left{width:100%; margin-bottom:10px}
.ft_left a{font-size:13px;}
.ft_right{width:100%; }
#footer{padding:30px 15px}
.us_info td{padding-right:10px}
#footlink ul li{ display:inline-table; float:none}
.add{font-size:13px}
.in_ab{margin-bottom:40px}
.content_zone{width:auto;max-width:100%;margin:0 50px}
.showsmall li{height:90px}
.showsmall li img{margin:0 8px;padding:10px;width:150px}
.top_pic2 img{height:78px}
.top_pic1 { display:none}
.top_iso{left:59%}
.title_zone .tree{width:70%;padding-right:15px}
.ft_logo img{height:38px}
.us_info li img{margin:0 }
.about_1{width:90%}
.about_1 .info{padding:0 0 50px 0}
.about_1 ul li.bk4{margin-top:30px}
.about_1 ul li.bk6{margin-top:10px}
.about_1 ul li.bk8{margin-top:10px}
.about_1 ul li.bk9{margin-top:30px}
.about_3{width:85%;margin-left:60px;padding-top:70px}

.external img{width:125px}
.about_3 ul li:last-child{width:60%;margin-left:0}
.about_3 ul li:first-child .ab_zone1{padding-top:50px;margin-bottom:60px}

}


@media (max-width:1367px) {
.banner {height:500px}	
.in_ab .inab_pic div.abapic4{width:21%}
.content_zone{margin:0 40px}
.probigpic_bg{margin-bottom:20px}
.showsmall{padding:0 25px}
.top_iso{left:60%}
#main_menu{margin-bottom:100px}
.about_3{width:auto;max-width:100%;margin:0 40px}
.about_3 ul li:first-child div{padding-left:15px}
}

@media (max-width:1280px) {

.left_zone{width:230px}
.right_zone{ float:left; background:#fff;width:calc(100% - 230px);}
	
.slogin2{right:2%}
.banner1{ background:url(../images/banner1a.jpg) 0 0 no-repeat;} 
.banner2{ background:url(../images/banner2a.jpg) 0 0   no-repeat;} 
.banner3{ background:url(../images/banner3a.jpg) 0 0 no-repeat;} 
.banner4{ background:url(../images/banner4a.jpg) 0 0 no-repeat;} 
.banner5{ background:url(../images/banner5a.jpg) 0 0 no-repeat;} 
.banner6{ background:url(../images/banner6a.jpg) 0 0 no-repeat; } 

.banner{height:500px; }
.oem{right:30px}
.slogin2{width:510px}
.slogin2 img{max-width:100%}
#footer{padding:15px}
#cominfo ul li.ft_logo{ display:block;margin-bottom:10px}
.add{ letter-spacing:0em}
.in_pro .pic{width:30%}
.in_pro .info{width:70%}
.top_pic2{ display:none}
.top_iso{ right:5%;top:45px; left:auto}
.top_slogn1{ left:40%}
/*.pro_3m{width:40%}*/
.pro_7m{width:100%}
.showsmall li img{width:160px}
.pro_title{padding-top:120px}
.contact_in ul li{padding:15px}
.about_1 .info{margin-bottom:30px}
.about_1 ul li.bk9{margin-top:70px}
.about_1 ul li.bk11{margin-top:0px}
.about_1 ul li:last-child .info{padding-top:20px}
#cd-timeline::before { height: calc(100% - 70px);}
 
.about_3 ul li:first-child div {padding-right:50px} 
.about_3 .cycle-slideshow{margin-bottom:20px} 
.external a { padding: 5px;margin: 0 5px 10px 5px;} 
.external img{width:122px}
.about_3  p{ font-size:16px}
}

@media (max-width:1024px) {

.left_zone{width:200px}
.right_zone{ float:left; background:#fff;width:calc(100% - 200px);}	
#main_menu {padding:0 20px;margin-bottom:80px}
.lang{margin:0 20px}
#language_area{margin-bottom:80px}
.line_tit{ background-position:-65px 0}

.banner1{ background:url(../images/banner1b.jpg) 0 0 no-repeat;} 
.banner2{ background:url(../images/banner2b.jpg) 0 0   no-repeat;} 
.banner3{ background:url(../images/banner3b.jpg) 0 0 no-repeat;} 
.banner4{ background:url(../images/banner4b.jpg) 0 0 no-repeat;} 
.banner5{ background:url(../images/banner5b.jpg) 0 0 no-repeat;} 
.banner6{ background:url(../images/banner6b.jpg) 0 0 no-repeat; } 
.banner {height:540px; background-size:cover}
.slogin1 h4{ font-size:45px}

.slogin1 p{height:50px;width:280px;  overflow:hidden; text-overflow:ellipsis;}
.in_pro h2{ font-size:15px; line-height:130%;height:55px; letter-spacing:0}
.in_pro .pic{width:35%}
.in_pro .info{width:65%}
.in_ab {width:90%;margin:0 auto 40px }
.in_ab .ab_content , .in_ab .inab_pic{width:100%}
.in_ab .ab_content{padding:0;margin:0 0 30px}
.ab_content{margin-bottom:15px}
.in_ab .inab_pic div{height:120px}
.in_ab .inab_pic div.abapic4{margin-right:0;width:22%}
.in_ab .ab_content p{ line-height:130%; font-size:14px}
#cominfo ul li.ft_logo{ text-align:center}
#cominfo{ text-align:center;width:60%;margin:0 auto}
#cominfo ul li{margin-bottom:10px}
#cominfo ul li.addicon{ display:none}
.ft_right{ text-align:center}
#sidebar .title{padding-left:20px}
.line_menu{padding:0 10px}
.content_zone{margin:0 20px}
.line_menu>ul>li>ul>li{padding:0 10px}
.line_menu>.nav>li.active>a , .line_menu>.nav>li>a{padding:5px}
.pro_3m{ display:none}
.pro_7m{width:100%}
.pro_left{padding:15px}
.pro_left .pro-name , .prodesc{ display:block}
.pro_left .pro-name {color:#080861; font-size:22px;margin:0 0 10px 0}
.pro_left .pro-name span{line-height: 200%; border-bottom: 1px solid #080861;}
.showsmall{padding:0 30px}
.top_iso{right:2%}
.top_slogn1{left:36%}
.ban{height:150px; background-size:cover}

.about_1{width:97%}
.about_1 ul li.bk4{margin-top:50px}
.about_1 ul li.bk9{margin-top:50px}
.about_1 ul li.bk10{margin-top:80px}
.about_1 ul li.bk11{margin-top:80px}
.container_msg2 .line_menu>ul>li{height:40px}
.about_3{margin:0 20px;padding-top:50px}
.about_3 ul li:first-child div{padding-right:20px}
.about_3 ul li:first-child .ab_zone1{padding-top:10px}
.external img{width:95px}
.normail_ab2 ul li{float:none}
.normail_ab2 ul li:first-child , .normail_ab2 ul li:last-child{width:100%; }
.about_2 ul li:first-child .ab_zone1{padding:0}
.about_2{margin:0 35px}
.about_2 .external img{width:125px}
}

@media (max-width:800px) {
.banner {height:374px; background-size:cover}	
.cycle-slideshow{margin-bottom:5px}
.slogin1{width:450px}
.slogin2{width:350px}
.slogin2 .oem{ text-align:right}
.slogin2 .oem img{width:55%}
.slogin1 h3{padding-top:25px;margin-left:90px}
.slogin1 h4{ font-size:38px;margin-left:70px}
.line_tit{ background-position:-80px 0}
.slogin1 p{margin-left:72px;width:220px}
.slogin1 a{margin-left:72px}
.in_pro ul li{width:25%;padding:0 5px}
.in_pro .pic , .in_pro .info{width:100%; float:none}
.in_pro{padding:0 10px}
.in_pro .pic{margin-bottom:10px}
.in_pro .info{padding:0}
.in_pro h2{ font-size:14px;height:80px;margin-bottom:10px}
.in_pro p{margin-bottom:30px}
.in_ab .inab_pic div{height:100px}
.in_ab .inab_pic div.abapic4{width:21%}
#cominfo{width:100%}
.in_ab{width:95%}
.in_pro ul li:last-child{padding:0 5px}
.content_zone{margin:0 15px}
.line_menu{margin-bottom:15px;height:90px}

.mobile_gallery{ display:block}
.pc_gallery{ display:none}

#sidebar .title{ font-size:25px; font-weight:bold}
.line_menu>.nav>li{ font-size:20px}
.line_menu>.nav>li>a{margin:0 15px 10px}
.top_slogn1{ display:none}
.line_menu>ul>li>ul>li>a{ font-size:16px}
.about_1 ul li:nth-child(odd) .info{margin-left:55px}
.container_msg2  .line_menu{padding:0 10px}
.mobile{ display:block}
.normail_ab3{ display:none}

.about_3 .cycle-pager{ background:#fff; text-align:center;padding:0; line-height:150%}
.external a ,.external a:hover, .about_3 .cycle-pager-active{  border:0;padding:0;marign:0 5px; }
.about_3 .cycle-pager span{ font-size:40px; color:rgba(24,91,139,0.3)}

.about_3 span.cycle-pager-active{color:rgba(24,91,139,1.00)}
.about_3{margin:0 30px}
.about_3  p{margin-bottom:50px; font-size:18px}

.about_2 .cycle_zone{ display:none}
.about_3 ul li:first-child .ab_zone1{margin-bottom:30px}
	.ecatalog li {width: calc(50% - 10px); text-align: center;  margin: 10px 0; float: none; display: inline-block;}
}
@media (max-width:767px){
.left_zone{ display:none}
.right_zone{width:100%}
#logo_m{ display:block}
.mob_menu i{ color:#fff; font-size:25px}

.mob_logo{width:236px;}
.mob_menu{right:0;top:0; position:absolute}
.mob_menu i{padding:10px}
.banner{height:400px}
.in_pro h2{ height:70px}
.line_menu{ display:none}
.pro_showtit{margin-top:10px}
.conten_menu{padding:0 15px}
.top_iso{right:10%}
#sidebar .title{padding-left:0}
#sidebar .title{width:20%}
.title_zone .tree{width:80%}
.pro_showtit h1{ font-size:18px;padding-bottom:6px;}

#left_menu>.nav-list>li:first-child, #left_menu>.nav-list>li:nth-of-type(2){ display:none}
#left_menu{ background:#fff}
#left_menu li{ border-bottom:0}
#left_menu a, .sb-submenu a{color:#fff;}
#left_menu a{padding-left:40px; font-weight:normal}
.sb-submenu{ background:rgba(219,219,219,1.00)}
#left_menu {box-shadow: inset 2px -1px 6px rgb(0,0,0); background:rgba(49,13,114,1.00)}
#left_menu>.nav-list>li.active{ background:rgba(32,12,59,0.5)}
#left_menu .sb-submenu-active a{color:rgba(42,15,107,1.00)}
#left_menu .sb-submenu-active a::before{content: "\f101"; font-family: FontAwesome; font-size:15px;margin-right:5px}
#left_menu .sb-submenu-active li.active>a{ background:#fff}
#logo_b{ display:none}
.about_1{width:100%}
.about_1 ul li:nth-child(even) .info{margin-left:0}
.container_msg2 .conten_menu{min-height:inherit}
}



@media (max-width:580px){
.banner {height:368px;}	
.in_pro{padding:0 15px 15px;margin-bottom:30px}
.in_pro ul li{width:100%; float:none; clear:both;margin-bottom:15px}
.in_ab{padding:0 18px;width:100%}
.in_pro .pic , .in_pro .info{ float:left} 
.in_pro .pic{width:30%}
.in_pro .info{width:70%;padding-left:15px}
.in_pro .info h2{height:auto;margin-bottom:10px; font-size:16px}


#cd-timeline::before {
    left: 30px;
    margin-left: -3px;
	margin-top:40px
  }



.about_1 ul li:nth-child(odd){width:90%; float:none;}

.about_1 ul li:nth-child(even){width:90%; float:none; text-align:left}
.about_1 ul li:first-child{padding-top:60px;margin-top:0}
.about_1 ul li:nth-of-type(2){  background:url(../images/about/company_bg.jpg) no-repeat; background-size:cover;padding-top:170px;margin-top:0}

a.btn_right{left:-45px; }
a.btn_left{ background:url(../images/about/btn_right.png) no-repeat;width:96px;height:86px; display:block;left:-45px; z-index:300; position:absolute}
.about_1 .info{ }
.about_1 ul li:nth-child(odd) .info{margin-left:70px}
.about_1 ul li:nth-child(even) .info{margin-right:0px;margin-left:70px}

.about_1 ul li:nth-child(odd):hover a.btn_right{background:url(../images/about/btn_right_a.png) no-repeat;}
.about_1 ul li:nth-child(even):hover a.btn_left {background:url(../images/about/btn_right_a.png) no-repeat;}
.about_1 ul{margin-left:30px}
.ab_bg_down{ background:url(../images/about/company_bg.jpg) no-repeat;}
.about_1 ul li:nth-of-type(2){ background:none}
.about_1 ul li:nth-of-type(2){padding-top:0}
}

@media (max-width:550px){

.banner1{ background:url(../images/banner1c.jpg) 0 0 no-repeat;} 
.banner2{ background:url(../images/banner2c.jpg) 0 0   no-repeat;} 
.banner3{ background:url(../images/banner3c.jpg) 0 0 no-repeat;} 
.banner4{ background:url(../images/banner4c.jpg) 0 0 no-repeat;} 
.banner5{ background:url(../images/banner5c.jpg) 0 0 no-repeat;} 
.banner6{ background:url(../images/banner6c.jpg) 0 0 no-repeat; } 
.banner {height:400px;}	
.top_iso{right:3%}
	.ecatalog li {width: calc(100% - 10px); margin: 10px 0;}
}

@media (max-width:480px){
.banner{height:350px; background-position:bottom center}	
.banner6{ background-position:bottom right } 
.slogin2{bottom:3%}	
.slogin1{ left:0}
.slogin1 h3{padding-top:15px; font-size:16px}
.slogin1 h4{ font-size:35px}
.line_tit{ background-position:-80px -30px}
.slogin1 p{width:180px;margin-bottom:5px}
.slogin1 a{ font-size:12px;padding:5px 10px;}
.slogin2{width:300px}
.slogin2 .oem img{width:50%}
#footer{padding:15px 5px}
#cominfo ul li{margin-bottom:5px}
.in_ab .inab_pic div{height:90px;margin:0}
.in_ab .inab_pic div img{height:90px}
.in_ab .inab_pic div+div{padding:0 5px}
.in_ab .inab_pic div.abapic1{width:20%;}
.in_ab .inab_pic div.abapic2{width:30%;}
.in_ab .inab_pic div.abapic3{width:30%}
.in_ab .inab_pic div.abapic4{width:20%}
.in_ab .ab_content{margin-bottom:15px}
.slogin1 h3{margin-left:70px}
.slogin1 h4 , .slogin1 p  , .slogin1 a{margin-left:60px}
.pro_left .pro-name{ font-size:20px}
.mob_logo{width:200px}
.pro-info { width: 100%;}
#sidebar .title{width:30%}
.title_zone .tree{width:70%;padding-right:0}
.ban{height:120px}
.top_iso{top:30px}
.top_iso img{height:55px}
}
@media (max-width:425px){
.banner {height:310px; background-size:contain}	
.in_ab .inab_pic div{height:80px;margin:0}
.in_ab .inab_pic div img{height:80px}
#cominfo ul li{ display:inherit;margin-bottom:3px}
#cominfo ul li:nth-child(odd){margin-bottom:10px}
#cominfo ul li.addicon{ display:block}
.ft_left a{ font-size:13px}	
#footer{ font-size:13px;padding:15px 30px}
.slogin1{width:100%}
.in_pro .info h2{ font-size:15px;margin-bottom:5px}
.content_zone{margin:0}
.title_zone{ position:relative}
#sidebar .title{width:100%;padding-top:30px}
.title_zone .tree{width:100%;padding-right:0; position:absolute; left:0;top:0px}
.breadcrumb{padding-top:0}
.about_1 ul li:nth-child(odd) .info , .about_1 ul li:nth-child(even) .info{width:85%;margin-left:55px}
.about_3{margin:0 10px}
}
@media (max-width:375px){
.banner{height:273px; background-size:cover}
.line_tit{ background-position:-90px -30px}
.slogin2{width:280px}
.in_pro .info{padding-left:5px}
.in_pro{padding:0 10px}
.slogin1 h4{ font-size:30px;}
.slogin1 h4 , .slogin1 p  , .slogin1 a{margin-left:50px}
.slogin1 p{width:180px;height:35px}
.in_pro .info h2{ font-size:14px}
.top_iso{ display:none}
}
@media (max-width:320px){
.slogin2{width:260px}
.slogin2 .oem img{width:40%}
.oem{top:-20px}
.slogin1 h4{ font-size:28px;}
.slogin1 p{width:160px;height:35px}
.banner_btn{width:16%;margin:0 0.3%}
.about_1 ul li:nth-child(odd){width:95%}
.about_1 ul li:last-child{ background:none}
.about_3{margin:0 15px}
.about_3 h2{ font-size:20px;margin-bottom:20px}
.about_3  p{ font-size:16px;margin-bottom:25px}
}