@charset "utf-8";
/* CSS Reset */
* {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	outline: none;
	font-size-adjust: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	outline: none;
}
*:focus {
	outline: none;
}

*,*:after,*:before {	-webkit-box-sizing: border-box;	-moz-box-sizing: border-box;	box-sizing: border-box;	padding: 0;	margin: 0;}

body {
	margin: 0;
	padding: 0;
	line-height: 18px;
	font-size:12px;
	font-family: "microsoft yahei","Arial Narrow",HELVETICA;
	color: #333;
	overflow-x: hidden;
}

::selection {
	background-color: none;
}

p {
	line-height: 20px;
	margin-bottom: 1em;
}
p > a {
	display: inline;
	text-decoration: none;
}
p > a:hover {
	text-decoration: underline;
}
p > span {
	display: inline;
}
span > a {
	display: inline;
}
a > span {
	display: inline;
}
a {
	text-decoration: none;
	color: #333;
}
a:hover {
	text-decoration: none;
	color: #333;
}



.clear{clear:both; overflow:hidden; height:0px;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix{display: inline-table;}
/* Hides from IE-mac \*/
* html .clearfix{height:1%;}
/* ie7 hack*/
*+html .clearfix {min-height: 1% ;} 
.clearfix{display: block;}

.page_width {width: 100%; margin: 0 auto;}
.floatl {float: left;}
.floatr {float: right;}
.mobileOnly, .padOnly, webOnly, .hideMobile, .hidePad, .hideWeb {display: none;}
.imgLeft {float: left; margin: 0 10px 10px 0;}
/* header */
.header{ background:#000; font-size: 1.4em; line-height: 37px; color: #fff; text-align: center;}
.header div { overflow: visible!important; z-index: 99999; width:100%; }
.logo { text-overflow:ellipsis; margin: 0; white-space: nowrap; overflow:hidden; height:37px; width:85%; padding-right:20px; }
.logo span{ text-align:center; height:40px; line-height:40px; display:inline-block; width:100%; overflow:hidden; }
.header span{ white-space:nowrap; text-overflow:ellipsis; }

.mainbg{ margin-bottom:52px;}
.page_width ul li{ float:left;}
/* navigation */
.navigation {display: none;}
#nav{ position: absolute; backgrund-repeat:no-repeat; display:inline-block; top: 0; right: 0; z-index: 99999; color: #fff; font-size: 16px; padding: 10px; height: 37px; width: 40px; }
#sidePanel #nav {
	position: absolute;
	backgrund-repeat:no-repeat;
	display:inline-block;
	top: 0;
	right: 0;
	z-index: 99999 ;
	color: #fff;
	font-size: 16px;
	background: #ebf5f2;
	padding: 10px;
	height: 37px;
	width: 40px;
}
#nav .hamburger, #sidePanel .hamburger {
	display: inline-block;
	float: right;
	position: relative;
	width: 20px;
	height: 15px;
	background: #f7f7f7;
	border: 0px solid #28956c;
	border-bottom-width: 0;
	margin-top: 2px;
}
#nav .hamburger:before, #nav .hamburger:after {
	content: '';
	position: absolute;
	top: 20%;
	left: 0;
	width: 100%;
	height: 20%;
	background: #000;
	transition: all ease .2s;
	-webkit-transform: translateZ(0);
}

#nav .hamburger:after {
top: 60%;
}
#sidePanel .hamburger {}
#sidePanel .hamburger:before {
top: 40%;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
background: #2e63a7;
}
#sidePanel .hamburger:after {
top: 40%;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
background: #2e63a7;
}
.navigation li{
	list-style:none;
}

ul.menu {background:#000;  width:35%; position:absolute; z-index:999; right:0; border-radius:5px;opacity: 0.8; margin-top:5px;  }
ul.menu li {display: inline-block; width:100%; column-count:3; padding: 10px 0; text-align: center;}
ul.menu li a {color: #fff; text-decoration: none; font-size: 14px;  white-space: nowrap; width:100%; text-align: center;}

.prodType ul {padding: 0; margin-top: 5px; background: #0DAD67;}
.prodType li {background: #0DAD67; list-style: none;}
.prodType li a {padding: 0; text-decoration: none; font-size: 14px; text-align: center; text-shadow:1px 1px 0px rgba(255, 255, 255, 0.3); display: inline-block; width: 100%; line-height: 1.6;}

/*menu*/
/* top search */
.topsearch.search { background: transparent; width: 280px;}
.topsearch.search input { width: 80%;}

.menubg { background-color: #397FBB; background-image: linear-gradient(#397FBB, #2E63A7); height: 47px; }
/*menu*/
.menubg .page_width{ width:100%; margin:0 auto}
.menubg .page_width ul li{ width: 9.5%; height:47px; line-height:47px; text-align:center; _overflow:hidden; list-style: none; display: inline-block; *display: inline;}
.menubg .page_width ul li a{ display: inline-block; color:#fff; font-size:16px; padding: 0; width: 100%; *width: 9.5%; text-align: center;}
.menubg .page_width ul li:hover,.menubg .page_width ul li.sel, .menubg .page_width ul li a:hover,.menubg .page_width ul li a.sel{background:#28956c; color: #fff!important;}

/* banner */
.bxslider-wrapper{ width:100%; height:200px;}
.bxslider-wrapper img {max-width: 100%; display: block; margin: 0 auto; height:200px;}

/* breadcrumb */
.breadcrumb {background: #a70802; color: #fff; font-size: 14px; padding: 5px 10px; display: block; margin: 0 0 10px;}
.breadcrumb a {color: #fff; display: inline-block;}

/* content */
.main {z-index: 10; padding-bottom: 0px;}
.main.page_width {padding-top: 1em; padding-bottom:10px;}
.main img {max-width: 100%; max-height:300px;}
.leftContent {width: 73%;}
.rightContent {width: 25%;}
.bottomLeft {width: 42%; margin-bottom: 10px;}
.bottomRight {width: 55%; margin-bottom: 10px;}

.green { color: #71cdae!important;}
.greenBg { }
.lightbg {}
h2 { font-size: 14px; margin: 5px 0 8px 0; line-height: 20px;}
h4 { font-weight: bold; margin-bottom: 5px; font-size: 14px;}
.date { background: #ddd; text-align: center; padding: 4px 0; margin-bottom: 10px;}
p.indent, .newsdetail p { text-indent: 2em;}
.newsdetail ul li { margin-left: 3em;}
.containerBox:after { display: block; content: ;}
.back { float: right; line-height: 15px; margin-bottom: 10px;}
.more, .btn { background: #30b882; border: 0px solid #ddd; border-radius: 6px; text-align: center; padding: 5px 15px; margin-bottom: 1em; display: inline-block; color: #fff;}
.more a, .btn:hover { color: #fff;}
.aboutCompany h2 { height:40px; line-height:40px; background:#f5f5f5; text-align:center; }


/* products */
.products { margin: 0;}
.line {height: 40px; line-height:40px; font-weight: normal; z-index: 10; overflow: visible;background: -webkit-gradient(linear,0 0,0 100%,from(#333),to(#000)); }
.line span { color:#fff; float:left; font-size:16px; padding-left:10px;}
.products .line a{overflow: visible; float: right; margin-right: 10px; background:url(../images/navmore.png) no-repeat center; background-size:12px; color: #fff; padding: 0 5px; text-indent:-999em;}
.products .more { margin-right: 5px; background: #c3d8ea;}
.products .more a { color: #1f845e;}
ul.productList { margin: 5px 0 5px; padding: 0;  width: 100%;}
ul.productList li { border-top:0px; border: 5px solid #fff; margin: 0; width: 33.33333%; display: inline-block; float: left; text-align: center;}
ul.productList li .box { border: 0px solid rgba(255, 255, 255, 0.7); display: block; min-width: 140px; height: 160px; overflow: hidden; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.4);}
ul.productList li .prodImg { text-align: center; height: 105px; background: #fff;}
ul.productList li .prodImg img { max-width: 120px; max-height: 85px; margin: 10px auto 8px; height: 85px;}
ul.productList li .txt { min-height: 44px; padding: 5px 0;}
ul.productList li .title a { font-size: 14px; line-height: 21px; font-weight: bold; color: #333; height:20px; white-space: nowrap; text-overflow: ellipsis; display: inline-block; width: 95%; overflow: hidden;}
ul.productList li .tags { color: #333; white-space: nowrap; text-overflow: ellipsis; display: inline-block; width: 95%; overflow: hidden; line-height: 1.15;}

/* container */
.containerTab { height: 40px; font-weight: normal; z-index: 10; overflow: visible;background: -webkit-gradient(linear,0 0,0 100%,from(#333),to(#000)); line-height:40px;}
.containerTab a { overflow: visible; float: right; width:20px; margin-right: 10px; background:url(../images/navmore.png) no-repeat center; background-size:12px; color: #fff; padding: 0 5px;text-indent:-999em;}
.containerTab .containerTitle { display: inline-block; color: #fff; font-size: 16px; z-index: 20; padding: 0 10px; height: 40px; line-height: 40px; float: left;}

.containerBox { padding: 0; margin-bottom: 10px; border: 0px solid #ddd; border-top: none;}
.containerBox p{ line-height:25px; text-indent:2em; padding:10px 5px;}
.featured img { float: left; margin: 0 10px 10px 0;}
.featured div.title { font-size: 14px; color: #63c8a6; padding-bottom: 5px;}
.featured a { color: #63c8a6;}

.containerCity {padding: 10px; margin-bottom: 10px; border: 1px solid #ddd; border-top: none;}
.containerCity a{ float:left; margin-right:20px;}

/* news */
.news ul { padding: 0;}
.news ul li {float: left; display: block; border-bottom: 1px dashed #DCDCDC; width: 100%; box-sizing: border-box;-moz-box-sizing:border-box; margin-bottom: 0; padding: 0; }
.news ul li a { margin-left: 0; display:block; height: 50px; line-height:50px; padding: 0 10px; vertical-align: middle; width:75%; overflow:hidden;}
.news ul li a:hover { color:#333;}
.news ul li span.date { float: left; background: none; margin: 0; background: #F5F5F5; width: 75px; height: 50px; line-height: 50px; display: inline-block; border-right: 1px dashed #DCDCDC;}

.newsdetail { padding: 10px 0; background: #fff;}
.newsdetail h1, .newsdetail .meta { text-align: center; margin: 10px 0;}
.newsdetail .meta { font-size: 12px;}
.newsdetail h1 { font-size: 16px;}
.newsdetail .newsContent { border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 10px; margin-bottom: 15px;}
.newsdetail img { max-width: 90%; max-height:300px; margin-bottom: 10px;}
.newsdetail .newsBtm { text-align: right; padding-right: 10px;}
.newsdetail .newsBtm span { color: #a3a5a4; margin-right: 4px; font-size: 14px;}
.relatednews { padding: 10px; margin-bottom: 20px;}

/* feedback */
.feedback{ margin-top:20px;}
.feedback ul li{ clear: both; list-style: none; float: left; width: 100%; margin-bottom: 5px;}
.feedback p { text-indent: 0; margin: 0px;}
.feedback label { width: 15%; text-align: right; margin-right: 2%; float: left; line-height: 25px; font-size: 14px;}
.feedback input { float: left; border:1px solid #397FBB; line-height:26px; height:32px; width:80%; padding:0 1%; font-size:12px;}
.feedback textarea{ width:80%; height:100px; padding:1%; resize:none; background:#fff; border:1px solid #397FBB; float: left; margin: 0;}
.feedback ul li.last{margin:10px 0 20px 17%;}
.feedback ul li.last input{ background: #397FBB; border-radius: 6px; text-align: center; padding: 5px 20px; margin-bottom: 1em; display: inline-block; cursor:pointer; width: auto; color: #fff; line-height: 16px; border:none;}

/* contact */
ul.contactInfo { float: left; width: 100%; margin: 0; padding:5px 0;}
.contactInfo li {list-style: none; padding: 3px 5px!important; display: block; text-shadow:1px 1px 0px rgba(255, 255, 255, 0.3); clear: both; float: left; width: 100%; box-sizing: border-box;}
.contactInfo li a {}

.contactInfo label { float: left; text-align: right; min-width: 38px;}
.contactInfo span { width: auto; float: left; width: 85%;}

.detailInfo li { list-style: none; background: none!important; padding: 0!important; display: block; clear: both;}
.detailInfo label { float: left; text-align: right; min-width: 38px; }
.detailInfo span { width: auto; float: left; width: 80%; margin-left:2%; }

/*pagination*/
.pager { text-align:center; margin:10px auto;}
.pager a{ border:1px solid #2E63A7; display:inline-block; background:#F5F5F5; padding:3px 6px; margin-right:5px; font-size:0.875em;}
.pager a.sele, .pager a:hover { background: #2E63A7; color: #fff;}

/*search*/
.search{position:relative; padding: 0 0 0 10px; background: #fff; overflow: visible; margin-right: -10px; display: inline-block; width: 100%; box-sizing: border-box;}
.search input{ padding:2px 4px;height:28px; line-height:24px; border:1px solid #2E63A7; width:83%; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; display: inline-block; float: left; margin: 10px 0;}
.search a{display:inline-block; font-size: 14px; text-align: center; line-height: 28px; margin: 10px 0; height: 28px; float: left;}
.search a:hover { opacity: .9; color: #63c8a6;}
.search a.search_btn { color: #fff; background: #2E63A7; width: 15%; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; }
.search a.category { background: #2E63A7; width: 23%; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; color: #fff; margin: 10px 0 10px 2%; font-size: 12px; }

/*category*/
.categorys {}
.categorysList { right:0; top:45px; float: right; background-color: #d5d5d5; background-image: linear-gradient(#f1f1f1, #d5d5d5); text-align: left; width: 100%; box-sizing: border-box; padding: 10px; box-shadow: 1px 1px 1px rgba(0,0,0,0.1); overflow: visible!important;}
.categorysList em { position: absolute; right: 10%; top: -6px; width: 0; height: 0; border-left: 3px solid transparent; border-right: 3px solid transparent; border-bottom: 6px solid #26a274; }
.categorysList li { list-style: none; background: none; text-align: center; float: left; width: 33%; height: 50px; line-height: 50px;}
.categorysList li a { height:30px; line-height:30px; width: 96%; text-align: center; float: none; display: inline-block; }

/*footer*/
.footerbg {background:#28956c; border-top: 3px solid #59c59c; text-align: center;overflow:hidden; padding: 10px 0;bottom:0px;position:;}
.footer{line-height:25px; text-align:center; width:100%; z-index:999; color: #fff;}

/* bottomNav */
.btmNav { background-color: #397FBB; background-image: linear-gradient(#397FBB, #2E63A7); text-align:center; height: 52px; width: 100%; position: fixed; bottom:0; z-index:999; margin-top:50px; }
.btmNav ul li { width:23.5%; text-align: center; display: inline-block; border-left:1px solid #fff;}
.btmNav ul li a { font-size: 14px; color: #fff; display: block; text-align: center; padding-top: 27px; line-height: 28px; }
.btmNav ul li:fist-child a { border-left: none;}
.btmNav ul li:last-child a { border-right: none;}
.btmNav ul li.ico1 { background: url(../images/systemc_qmenu.png) no-repeat 50% 0px; border:0px !important;}
.btmNav ul li.ico2 { background: url(../images/single.png) no-repeat 50% 0px;}
.btmNav ul li.ico3 { background: url(../images/products.png) no-repeat 50% 0px;}
.btmNav ul li.ico4 { background: url(../images/systemc_phone.png) no-repeat 50% 0px;}
.btmNav ul li.ico5 { background: url(../images/systemc_contact.png) no-repeat 50% 0px;}
.kzdjchenge{ color:#fff !important; }

/*pimg*/
.productdetail{ padding:10px;}
.pimg{ width:100%; text-align:center;}
.pimg .img { width: 64%; padding: 2% 0; border: 1px solid #ddd; margin: 10px auto; } 
.pimg img{max-width:100%;max-height:100%; vertical-align:middle; margin: 0 auto;}
.pimg .list ul {margin:0 auto; padding:0; display: table;}
.pimg .list ul li {list-style: none; display: inline-block; margin: 0 2px 10px; width: 66px; height: 66px; text-align: center; border: 1px solid #ddd; }
.pimg .list ul li.sel, .pimg .list ul li:hover {border: 1px solid #63c8a6;}
.pimg .list ul li img {max-width: 66px; max-height:64px; vertical-align: middle;}
.pinfo{}
.productdesc {padding: 10px 10px 0;}
.productdesc p {text-indent: 2em; padding-bottom: 10px;}
.relatedproduct {padding: 0 10px;}
.relatedproduct ul {margin-bottom: 1em; display: block;}
.containerBox ul li, .news li, .relatednews li, .relatedproduct ul li {list-style: none; background: url(../images/dot.png) no-repeat 0 11px; padding: 5px 10px; line-height: 15px;}
.relatedproduct ul li:last-child {padding-bottom: 0;}

#ProductAccordion .icon-thinarrowleft {left: -35px; text-indent: 0; font-size: 35px;}
#ProductAccordion .icon-thinarrowright {right: -20px;text-indent: 0; font-size: 35px;}

.tishi{ text-align:center; color:#999; font-size:14px;}

/* Product Accordion */
.Accordion { border: 0; overflow: hidden; padding: 0; margin: 0; outline: 0; min-height: 420px; }
.AccordionPanel { margin: 0; padding: 0px; }
.AccordionPanelTab { margin: 0px; padding: 0; cursor: pointer; -moz-user-select: none; -khtml-user-select: none; position: relative; z-index: 10; background: #F5F5F5; height: 40px; line-height: 40px; border-top: 1px solid #ccc; border-bottom:1px solid #ccc; text-align:center; }
.AccordionPanelTab.tab1 { background: rgba(57, 127, 187, 0.2);}
.AccordionPanelTab.tab2 { background: rgba(57, 127, 187, 0.4);}
.AccordionPanelTab.tab3 { background: rgba(57, 127, 187, 0.6);}

.AccordionPanelTab div { font-size: 14px; text-shadow:1px 1px 0px rgba(255, 255, 255, 0.3);}
.AccordionPanelTab span { background: rgba(255, 255, 255, 0.2); width: 60px; height: 40px; color: #fff; font-size: 20px; box-sizing: border-box; float: left; margin-right: 10px; text-shadow:1px 1px 0px rgba(0, 0, 0, 0.1); text-align:center; line-height:40px;}
.AccordionPanelTab em { float: right; font-family: 'icomoon';	speak: none; font-style: normal; font-weight: normal; font-variant: normal;text-transform: none; line-height: 1; font-size:16px; color: #fff; text-shadow: none; margin-top: 22px; margin-right: 10px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.AccordionPanelOpen em:before { content: "\f107"; }
.AccordionPanelClosed em:before { content: "\f105";}

.AccordionPanelContent { margin: 0; padding: 10px; height: auto; position: relative; z-index: 20; background: #fff; }
.AccordionPanelContent .bx-wrapper { width: 80%; margin: 5px auto 15px auto;}
.AccordionPanelContent h2 { margin-left: 9px; padding-left: 4px; padding: 4px; }

ul.labelSpan {float: left; width: 100%; margin: 0 0 10px;}
.labelSpan li {list-style: none; display: block; clear: both; float: left; width: 100%; padding: 2px 0;}
.labelSpan label {float: left; text-align: right; min-width: 66px;}
.labelSpan span {width: auto; float: left; width: 75%;}

.enshrine{ padding:5px; }
.enshrine li{ list-style-type:none; width:33%; float:left; text-align:left;}

.sel{ color:#2e63a7 !important;}

.AccordionPanelOpen .AccordionPanelTab {
}

.AccordionPanelTabHover {
}
.AccordionPanelOpen .AccordionPanelTabHover {
	outline: 0;
}
	
.AccordionFocused .AccordionPanelTab {
}

.AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
}
.Accordion p {line-height: 1.8em; margin-bottom: 1em;}
.Accordion p:last-child {margin-bottom: 0;}
.AccordionPanelTab h2 {border-bottom: 1px dashed #ccc; padding-left: 0; margin-left: 40px; margin-bottom: 4px; position: relative; line-height: 28px;}
.Accordion h3 {line-height: 1.8em;}
h2 em {width: 35px; height:35px; margin-left: -40px; position: relative; float: left;}
h2.p1 em {background: url(../images/zp1.jpg) no-repeat 0 0;}
h2.p2 em {background: url(../images/zp2.jpg) no-repeat 0 0;}
h2.p3 em {background: url(../images/zp3.jpg) no-repeat 0 0;}
h2.p4 em {background: url(../images/zp4.jpg) no-repeat 0 0;}
h2.p5 em {background: url(../images/zp5.jpg) no-repeat 0 0;}
h2.p6 em {background: url(../images/zp6.jpg) no-repeat 0 0;}
h2.p7 em {background: url(../images/zp7.jpg) no-repeat 0 0;}
h2.p8 em {background: url(../images/zp8.jpg) no-repeat 0 0;}
h2.p9 em {background: url(../images/zp9.jpg) no-repeat 0 0;}
h2.p10 em {background: url(../images/zp10.jpg) no-repeat 0 0;}