body, html{background: #000;}

@media (min-width:992px){
	.container{width:970px}
}
@media (min-width:1200px){
	.container{width:970px}
}

#closeButton{cursor: pointer;}

.white{color: #fff !important;}

a:hover{text-decoration: none; opacity: 1;}

ul,li{list-style: none; margin: 0px; padding: 0px;}

.clearfix:after { content: '\20'; display: block; height: 0; clear: both; }
.clearfix { *zoom: 1; }
.clear{clear:both;}

.mt20{margin-top: 20px;}

.col-20{width: 20%; float: left;}
.col-25{width: 25%; float: left;}

.col-25 .productDes{margin-bottom: 10px;}

video{display: block; width: 100%;}

img.full{display: block; width: 100%;}
.topMenu{height: 100px; border-bottom: 1px solid #2d2b2c;}
.topMenu ul{height: 60px; margin-top: 20px; margin-bottom: 20px;}
.topMenu ul li{height: 60px; border-right: 1px solid #0e96c0; position: relative; z-index: 10;}
.topMenu ul li:last-child{border: none;}
.topMenu ul li a{display: inline-block; padding: 30px 30px 0px; height: 30px; line-height: 30px; color: #0e96c0;}
.topMenu ul li a:hover{text-decoration: none; color: #fff;}

.topMenu ul li a.active{color: #fff;}

.st-globalNav_category li a{border-right: 1px solid #6483ef; padding: 0px 15px 0px 10px;}
.st-globalNav_category li:last-child a{border-right: 0px;}
.st-globalNav_category li:hover a{color: #89a2f9;}

ul.submenu{height: auto; margin: 0px; padding: 60px 0px 0px; position: absolute; width: 240px; top: 0px; left: 50%; margin-left: -100px; z-index: 10; display: none;}
ul.submenu .submenuContent{background: #000; padding-bottom: 20px;}
ul.submenu li{height: auto; border: 0px;}
ul.submenu li a{display: block; height: auto;}
ul.submenu li a img{display: block;}
ul.submenu li a img.hover{display: none;}
ul.submenu li a:hover{opacity: 1;}
ul.submenu li a:hover img{display: none;}
ul.submenu li a:hover img.hover{display: block;}

/* .st-globalNav ul li:hover ul.submenu{ display: block; } */

.mobileTopMenu{display: none; height: auto;}
.mobileTopMenu ul{height: auto; margin: 0px; display: block;}
.mobileTopMenu ul li{display: block; width: 100%; height: auto; border-right: 0px; border-bottom: 1px solid #0e96c0; text-align: center;}
.mobileTopMenu ul li a{display: block; padding: 20px 0px; height: 60px; line-height: 20px; text-align: center;}
.mobileTopMenu ul li .submenu a{width: 50%; float: left; display: block; height: auto; padding: 5px 0px;}

.wrap{padding-bottom: 80px;}

.indexButton01{display: block; background: #000; border: 1px solid #79eb33; color: #fff; text-align: center; font-size: 18px; line-height: 60px; height: 60px; margin-top: 10px;}
.indexButton01 span{font-size: 28px;}
.indexButton01:hover{background: #79eb33; text-decoration: none; color: #fff; opacity: 1;}
.indexButton02{display: block; background: #000; border: 1px solid #ff78b3; color: #fff; text-align: center; font-size: 18px; line-height: 60px; height: 60px; margin-top: 10px;}
.indexButton02 span{font-size: 28px;}
.indexButton02:hover{background: #ff78b3; text-decoration: none; color: #fff; opacity: 1;}

.a3_content_60{padding: 0px 60px;}
.title_line01{border-bottom: 2px solid #67c9f6; padding-bottom: 20px; margin-bottom: 20px;}
.title_line02{border-bottom: 2px solid #fdaa78; padding-bottom: 20px; margin-bottom: 20px;}
.title_line03{border-bottom: 2px solid #8ad293; padding-bottom: 20px; margin-bottom: 20px;}
.title_line04{border-bottom: 2px solid #858a8d; padding-bottom: 20px; margin-bottom: 20px;}
.a3_new_list{background: #000; padding: 0px 60px;}
.a3_new_list .a3_new_block{float: left; width: 50%; margin-bottom: 20px;}
.a3_new_list .a3_new_block_full{float: none; width: 100%; margin-bottom: 20px;}
.a3_new_list .a3_new_block .block,
.a3_new_list .a3_new_block_full .block{ border: 2px solid #afafaf;}
.a3_new_list .a3_new_block:nth-child(odd) .block{margin-right: 10px; margin-left: 0px;}
.a3_new_list .a3_new_block:nth-child(even) .block{margin-right: 0px; margin-left: 10px;}

.buttonList a{display: block; width: 33.333333%; border-width: 0px 2px; border-style: solid; border-color: #fff; float: left; height: 30px; line-height: 30px; text-align: center; color: #fff; background: url(../images/m_bg.jpg) top left repeat-x;}
.buttonList a.active, .buttonList a:hover{ background: #323232; color: #fff;}
.buttonList a span{padding-left: 40px; background: url(../images/m_active_icon.png) center left no-repeat;}
.buttonList a.active span{padding-left: 40px; background: url(../images/m_icon.png) center left no-repeat;}
.buttonList a:first-child{border-left: 0px solid #fff;}
.buttonList a:last-child{border-right: 0px solid #fff;}

.buttonList2 a{display: block; width: 50%; border-width: 0px 2px; border-style: solid; border-color: #000; float: left; height: 30px; line-height: 30px; text-align: center; color: #fff; background: url(../images/m_bg.jpg) top left repeat-x;}
.buttonList2 a.active, .buttonList2 a:hover{ background: #323232; color: #fff;}
.buttonList2 a span{padding-left: 40px; background: url(../images/m_active_icon.png) center left no-repeat;}
.buttonList2 a.active span{padding-left: 40px; background: url(../images/m_icon.png) center left no-repeat;}
.buttonList2 a:first-child{border-left: 0px solid #000;}
.buttonList2 a:last-child{border-right: 0px solid #000;}

.pageTitle{display: block; width: 100%; height: 30px; line-height: 30px; text-align: center; color: #fff; background: url(../images/m_bg.jpg) top left repeat-x;}


.productList{background: url(../images/productListBg.jpg) top right; background-size: cover;}
.productList a{display: block; width: 65%; margin: 80px auto 40px; border: 1px solid #666; position: relative;}
.productList a p{text-align: center; margin-bottom: 0px;}
.productList a p.productImg{position: absolute; top: -70px; z-index: 1;}
.productList a p.productImg .hover{display: none;}
.productList a:hover p.productImg .act{display: none;}
.productList a:hover p.productImg .hover{display: block;}

.productList a p.productTitle{margin-top: 40px; position: relative; z-index: 2; color: #07a5ec; font-weight: bold; font-style: bold; font-size: 16px;}
.productList a p.productDes{color: #07a5ec; font-size: 12px;}
.productList a p.smallDes{color: #707070; font-size: 10px; line-height: 16px; margin-bottom: 20px; margin-top: 10px;}

.videoList .videoBlock{float: left; width: 50%; padding: 5px; background: #fff;}

.blockList{background: #e8fff5; padding: 20px 60px;}
.blockList .blockListDetail{padding-bottom: 40px; padding-top: 40px; border-bottom: 2px dashed #1f948f; width: 50%; float: left;}
.blockList .blockListDetail:nth-child(odd){padding-right: 40px; border-right: 2px dashed #1f948f;}
.blockList .blockListDetail:nth-child(even){padding-left: 40px; border-left: 2px solid #e8fff5;}
.blockList .blockListDetail p{margin: 20px 0px 0px; font-size: 16px; line-height: 30px; height: 120px;}
.blockList .blockListDetail ul{margin: 20px 0px 0px; font-size: 16px; line-height: 30px; height: 120px;}
.blockList .blockListDetail ul li{list-style-type: disc; list-style-position: inside;}

.blockList2 .blockListDetail p{margin: 20px 0px 0px; font-size: 16px; line-height: 30px; height: 120px; color: #666666;}
.blockList2 .blockListDetail p small{font-size: 12px;}
.blockList2 .blockListDetail .title{margin-bottom: 10px;}

.yellow_bg{background: #FFFFD9;}
.blue_bg{background: #8fbfff;}
.blue2_bg{background: #e7faff}
.blue3_bg{background: #cab9ff}

.content{position: relative;}
.caseWrap{width: 85%; margin: 0px auto; padding: 20px 0px; position: relative;}

.content{margin-top: 40px;}
.text-block{padding: 20px; border-radius: 5px; position: relative; margin-top: 20px;}
.left-text-block{width: 48%; float: left;}
.left-text-block .j{width: 0px; height: 0px; border: 20px solid transparent; border-left: 100px solid #fff; position: absolute; right: -100px; bottom: 20px;}
.left-text-block .tj{width: 0px; height: 0px; border: 20px solid transparent; border-left: 100px solid #fff; position: absolute; right: -100px; top: 20px;}
.right-img-block{float: right; width: 40%;}

.right-text-block{width: 48%; float: right;}
.right-text-block .j{width: 0px; height: 0px; border: 20px solid transparent; border-right: 100px solid #fff; position: absolute; left: -100px; bottom: 20px;}
.right-text-block .tj{width: 0px; height: 0px; border: 20px solid transparent; border-right: 100px solid #fff; position: absolute; left: -100px; top: 20px;}
.left-img-block{float: left; width: 40%;}

.caseWrap .case_img01{position: absolute; width: 45%; top: 20px; right: 0px;}
.caseWrap .case_img02{width: 45%;}

/* .caseWrap .case_img03{width: 50%; right: 0px; top: 8%; position: absolute; z-index: 5;}
.caseWrap .case_img04{width: 55%; margin-top: 5%; position: relative; z-index: 2;}
.caseWrap .case_img04 .text-content{width: 75%; position: absolute; top: 5%; left: 5%;}

.caseWrap .case_img06{width: 65%; margin-top: 5%; position: relative; z-index: 2; float: right;}
.caseWrap .case_img06 .text-content{width: 70%; position: absolute; top: 5%; right: 5%;}
.caseWrap .case_img05{width: 35%; left: 0px; top: 8%; position: absolute; z-index: 3;}

.caseWrap .case_img08{width: 50%; margin-top: 5%; margin-bottom: 5%; position: relative; z-index: 2;}
.caseWrap .case_img08 .text-content{width: 75%; position: absolute; top: 5%; left: 5%;}
.caseWrap .case_img07{width: 35%; right: 5%; top: 8%; position: absolute; z-index: 3;}

.caseWrap .case_img09{width: 45%; right: 0px; top: 8%; position: absolute;}
.caseWrap .case_img10{width: 50%; right: 0%; top: 13%; position: absolute; z-index: 3;}

.caseWrap .case_img11{width: 43%; left: 0px; top: 8%; position: absolute; z-index: 3;} */


.back{font-size: 18px; color: #fff; font-weight: bold; font-style: bold;}
.text-content p{color: #8FBFFF; font-size: 12px;}
.text-content p.title{font-size: 26px; margin-bottom: 5px;  text-align: left;}
.text-content p.text-left{text-align: left;}
.text-content p.subTitle{font-size: 16px; margin-bottom: 5px;}

.font2 p, .font2 p.title, .font2 .p.subTitle{color: #fe98aa;}

.machanicsList{padding: 60px 0px;}
.machanicsBlock{width: 90%; margin: 0px auto;}

.caseList{padding: 20px 20px; position: relative;}
.caseLink01{width: 42.4605%; position: absolute; left: 49.7812%; top:32.7939%; text-align: left;}
.caseLink02{width: 42.4605%; position: absolute; left: 7%; bottom:24.7939%; text-align: left;}
.caseLink03{width: 30%; position: absolute; right: 0%; bottom:4%; text-align: center;}

.caseList p{margin-bottom: 2px;}
.caseList a{color: #FFFFD9; padding-right: 20px; background: url(../images/jian.png) center right no-repeat; font-size: 16px;}

.caseBlock{width: 50%; float: left;}
.caseBlock .caseBlockContent{margin: 5px; border: 2px solid #12b4e5; display: block;}
.caseBlock .caseBlockContent:hover{border: 2px solid #fff;}
.caseBlock .caseBlockContent .caseBlockImg, .caseBlock .caseBlockContent .caseBlockDes{margin-bottom: 0px;}

.technologyBlockList{}
.technologyBlock{width: 50%; float: left;}
.technologyBlock .technologyBlockContent{margin: 5px; border: 2px solid #afafaf; display: block;}
.technologyBlock .technologyBlockContent .technologyBlockImg, .technologyBlock .technologyBlockContent .technologyBlockImg_o{margin-bottom: 0px;}

.technologyBlock .technologyBlockContent:hover .technologyBlockImg{display: none;}
.technologyBlock .technologyBlockContent .technologyBlockImg_o{display: none;}
.technologyBlock .technologyBlockContent:hover .technologyBlockImg_o{display: block;}

.blogBlockList{padding: 10px; background: #525252;}
.blogBlockList .blogBlock{width: 33.333333%; float: left;}
.blogBlockList .blogBlock02{width: 66.6666%; float: left;}
.blogBlockList .blogBlock .blogBlockContent{margin: 5px; display: block;}
.blogBlockImg_o{display: none;}
.blogBlockList .blogBlock .blogBlockContent:hover .blogBlockImg{display: none;}
.blogBlockList .blogBlock .blogBlockContent:hover .blogBlockImg_o{display: block;}

.communityDetail{padding: 10px; background: #000;}

footer{padding: 40px 0px; text-align: center;}
footer ul li a{color: #646464; padding: 0px 20px; display: inline-block; border-right: 1px solid #646464;}
footer ul li{padding: 0px !important;}
footer ul li:last-child a{border: none;}
footer ul li a:hover{color: #999; opacity: 1;}

.qa01{width: 54%; float: left;}
.qa02{width: 46%; float: left;}

img.gif{display: none;}

.subnewTitle{line-height: 2.5;}

@media screen and (max-width: 768px) {
	body, html{background: #000;}
	
	.col-20{width: 50%; float: left;}
	.col-25{width: 50%; float: left;}

	.a3_content_60{padding: 0px 10px;}
	.a3_new_list{background: #000; padding: 0px 10px;}

	.topMenu{display: none;}
	.mobileTopMenu{display: block;}

	.blockList{background: #e8fff5; padding: 20px 20px;}
	.blockList .blockListDetail{padding-bottom: 40px; padding-top: 40px; border-bottom: 2px dashed #1f948f; width: 100%; float: none;}
	.blockList .blockListDetail:nth-child(odd){padding-right: 0px; border-right: 0px dashed #1f948f;}
	.blockList .blockListDetail:nth-child(even){padding-left: 0px; border-left: 0px solid #e8fff5;}
	.blockList .blockListDetail p{height: auto !important;}

	.caseBlock{width: 100%; float: none;}

	.caseWrap div{position: static !important; width: 100% !important; margin: 20px 0px !important; float: none !important;}
	.text-block img{display: none !important;}
	.text-content p{}
	.text-content p.text-left{text-align: center;}

	.blogBlockList .blogBlock02{width: 100%;}

	.blogBlockList .blogBlock{width: 50%;}


	.content{margin-top: 40px;}
	.text-block{padding: 20px; border-radius: 5px; position: relative; margin-top: 20px;}
	.left-text-block{width: 100%; float: none;}
	.left-text-block .j{display: none;}
	.left-text-block .tj{display: none;}
	.right-img-block{float: none; width: 100%;}

	.right-text-block{width: 100%; float: none;}
	.right-text-block .j{display: none;}
	.right-text-block .tj{display: none;}
	.left-img-block{float: none; width: 1000%;}


	.qa01{width: 100%; float: none;}
	.qa02{width: 100%; float: none;}

	.buttonList2 a{display: block; width: 100%; border-width: 0px 2px; border-style: solid; border-color: #000; float: none; height: auto; line-height: 30px; text-align: center; color: #fff; background: url(../images/m_bg.jpg) top left repeat-x;}

	.productList a{width: 80%; padding: 0px 10px; margin: 40px auto 20px;}
	.productList a p.productImg{top: -50px;}
	.productList a p.productTitle{margin-top: 40px;}

	footer{ width: 80%; margin: 0px auto;}
	footer ul li{margin-bottom: 10px;}
	footer ul li a{ border: 0px;}

}
