@charset "utf-8";
/* CSS Document */

html, body {position: relative; height: 100%;}
body {background: #eee; color:#000;margin: 0;padding: 0;}

html, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, q, small, strong, sub, sup, tt, var,
ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;outline: 0;vertical-align: baseline;text-align:left;}
 h1, h2, h3, h4, h5, h6{ font-family:"微软雅黑"}
dl, dt, dd { position:static; display:block;}
ul, ol, li{ list-style-type: none;}
a { color: #333;}
a:link {text-decoration: none;}
a:visited { text-decoration: none;}
a:hover { text-decoration: none; }
a:active { text-decoration: none; color: #000;}
/* HTML5 */
article, aside, dialog, figure, footer, header, hgroup, nav, section, menu { display:block; }
.swiper-container{width: 100%;height: 100%;}
.swiper-slide {}
.caroufredsel_wrapper {width:100% !important; height:100% !important; overflow:hidden;}

header{ width:100%; height:120px; background:rgba(0,0,0,0.75); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#CF000000,endColorstr=#CF000000); text-align:center; position:absolute; z-index:10;}
.header{ width:1100px; height:120px; margin:auto; position:relative;}
	.header .logo{ position:absolute; z-index:11; top:50px; left:0; width:280px; height:50px;  background:url(../images/logo.png) no-repeat; text-indent:-9999em;}
	nav{ position:absolute; width:780px; height:50px; z-index:12; right:10px; top:60px}
    	nav .icon-menu{ display:none;}
		nav ul { float:left; padding:0 15px}
			nav ul li{ margin:0 auto; float:left; width:auto;}
			nav ul li a{ padding:15px 15px 5px; height:25px; display:block; margin:0 0 2px 5px; font-size:0.9em; color:#999;}
			nav li ul {left: -999em; width: 160px; position: absolute; z-index:9; margin:0 ; padding:0; }
				nav li ul li{ padding:0px; margin:0; height:36px;  background:rgba(255,255,255,0.8); color:#000; width:160px; }
					nav li ul li a{ color:#000; font-size:0.8em; padding:11px 10px 13px; height:12px; margin:1px 0 1px 0; background: none; border-bottom:1px dotted #333;  }
					nav ul li ul li a:hover{ background:#666; color:#FFF; border:none;}
	nav ul li:hover ul {left:auto;}
	nav ul li.sfhover ul {left:auto;}
	nav ul li a:hover{ color:#E00;}
	nav ul li a.active{ color:#FFF;}
@media only screen and (max-width: 1000px){
header{ width:100%; position:relative; background:#000; height:80px;}
.header{ width:100%; height:80px}
	.header .logo{ top:20px; left:15px; width:240px; height:40px; background:url(../images/logo-m.png) no-repeat; position:absolute; z-index:1;}
nav{ width:36%; height:60px; position:absolute; z-index:6; right:0; top:5px}
nav:hover{ background:rgba(0,0,0,0.3);}
	nav a.icon-menu{ display: block;}
	nav span.icon-menu{ display:block; width:30px; height:40px; text-indent:-999em;}
	nav ul{ padding:0; margin:70px auto 0; width:100%; visibility:visible; display:none;border-top:1px #D11074 solid; position:absolute; z-index:51; background:rgba(255,255,255,0.75);}
	nav:hover ul{ display:block;}
	nav ul li{ width:100%; padding:0; border:none;}
	nav ul li a{ display:block; margin:0; padding:10px 20px; color: #333; font-size:1em; background:none; width:100%; text-align:right; border-bottom:1px dotted #D11074; height:16px; background:none;}
	nav ul li { overflow:hidden;}
	nav li ul {width: 100%; position:static; background: none; margin-top:0; padding:0; border:none; display:block;}
	nav li ul li a{ color:#333; font-size:0.9em; margin:0; background: none; text-indent:3em; padding:10px 50px;}
	nav a {display:block; width:60px; height:70px; margin:0; float:right; background: url(../images/bg-navmenu.png) no-repeat 10px 15px;}
}
.banner{width:100%; height:600px; background:#111; background-size:100% auto; position:relative;}
.banner1{ background:url(../images/banner01-1.jpg) no-repeat center center; }
.banner2{ background:url(../images/banner01-2.jpg) no-repeat center center; }
.banner3{ background:url(../images/banner01-3.jpg) no-repeat center center; }
.banner4{ background:url(../images/banner01-4.jpg) no-repeat center center; }
.banner5{ background:url(../images/banner01-5.jpg) no-repeat center center; }
.banner6{ background:url(../images/banner01-6.jpg) no-repeat center center;}
.swiper-container{ width:100%; height:600px; background:#000;}
	.swiper-wrapper{width:100%; height:600px;}
    	.swiper-slide{width:100%; height:600px;}
	.swiper-slide .slide{ height:600px; width:100%;background-size:100% auto;}
	.banner  h2, .swiper-slide .slide h2{ position:absolute; z-index:2; width:460px; font-size:2em; line-height:2em; height:80px; top:50%; left:50%; margin:-60px -230px; color:#FFF; text-align:center; font-family:"微软雅黑"}
	.banner p, .swiper-slide .slide p{ position:absolute; z-index:2; width:400px; font-size:1.5em; line-height:1.5em; height:60px; top:50%; left:50%; margin:20px -200px; color:#FFF; text-align:center; display:block;font-family:"微软雅黑"}
	.swiper-slide .slide1{ background:url(../images/banner01.jpg) no-repeat center center; }
	.swiper-slide .slide2{ background:url(../images/banner02.jpg) no-repeat center center;}
	.swiper-slide .slide3{ background:url(../images/banner03.jpg) no-repeat center center;}
@media only screen and (max-width: 1920px){
	.banner, .swiper-slide .slide{ background-size:auto 100%;}
	}
@media only screen and (max-width: 1100px){
	.banner, .swiper-container, .swiper-wrapper, .swiper-slide{width:100%; height:400px;}
	}
@media only screen and (max-width: 640px){
	.banner, .swiper-container, .swiper-wrapper, .swiper-slide{width:100%; height:280px;}
	.banner p, .swiper-slide .slide p{ width:300px; margin:20px -150px; }
	}
section{text-align:center;}
.service{ background:#000; display:none;}
	.content{width:1100px; margin:auto; padding:20px 0 30px;}
	.content-top{ margin:0 0 20px; text-align:center;}
		.content-top h1{color:#C00; width:auto; font-size:1.3em; padding:20px 10px 10px; margin:auto; text-align:center; }
            .content-top h1 span{ width:auto; color:#FFF; line-height:1.1em; font-size:1.1em;}
		.content-top h2{ color:#C00; width:auto; font-size:1.1em; padding:20px 10px 10px; margin:auto; text-align:center; }
		    .content-top h2 span{ width:auto; color:#FFF; line-height:1.1em; font-size:1.1em;}
		.content-top .bun{color:#FFF; text-align:center; line-height:1em; padding:10px 10px 10px; width:80px; border-top:1px solid #CCC; margin:auto; font-size:0.95em;}
		.content-top .bun a{color:#CCC}
    .content .title{ padding:10px 0; margin: 0 0 20px; border-bottom:solid 1px #CCC; text-align:center;}
	    .content .title h1{ padding:0 0 10px; line-height:2em; font-size:1.8em; text-align:center; font-weight:normal;}
	    .content .title span{ font-size:0.8em; color:#666; line-height:1.6em; vertical-align:middle; display:inline;}
    .container{width:1100px; margin:auto; padding:30px 40px 50px; text-align:center;}
	    .container p{ line-height:1.8em; font-size:0.9em; color:#000; padding:15px 0; margin:0;}
	    .container img{ text-align:center;margin:auto; padding:10px 0;}
	        .container p img{ text-align:center; display:block; padding:10px 0; margin:auto}
	    .container div{ line-height:1.8em; font-size:0.9em; color:#000; padding:15px 0; margin:0;}
	        .container div img{ text-align:center; display:block; padding:5px ; margin:auto}
@media only screen and (max-width: 1180px){
	.content{ width:100%; text-align:center; overflow:hidden;}
    .service{ display:block;}
		.service ul{width:100%; margin:0 auto;}
		.service ul li{width:33.33%; margin:0; height:46px; background:none; float:left;}
		.service ul li h3{ margin:1px; background:#333; color:#EEE; padding:10px 5px; text-align:center;}
		.service ul li h3 a{ color:#EEE;}
    .container{width:100%; text-align:center; padding:20px 0;}
	    .container p{ padding:15px 10px; margin:0;}
	    .container img{ display:block; margin:auto; width:96%}
	        .container p img{ width:96%}
	        .container div img{  width:96%;}
	}
.news{ background:url(../images/bg-news.jpg) no-repeat #EEE center center; background-size:100% auto; width:100%; overflow:hidden;}
	.news .content-top{ margin:0 0 20px; text-align:center;}
		.news .content-top .bun{ border-top:#333 solid 1px; }
		.news .content-top .bun a{ color:#333;}
	.news ul{ margin:0 -20px; width:1140px; overflow:hidden;}
		.news ul li{ float:left; width:260px; background:rgba(255,255,255,0.75);filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#CFFFFFFF,endColorstr=#CFFFFFFF); margin:0 0 0 20px}
			.news ul li .photo{ padding:5px;}
			.news ul li .photo img{ width:100%; height:100%; display:block;}
			.news ul li h3{ background:none; margin:0; padding:10px 10px 5px; text-align:left; color:#333; font-size:1em; line-height:1em; height:1.1em; overflow:hidden;}
			.news ul li p { background:none; margin:0 0 20px; padding:5px 10px; text-align:left; color:#333; font-size:0.85em; line-height:1.7em; height:36px; overflow:hidden;}
@media only screen and (max-width: 1920px){
.news{ background-size:auto 100%}
}
@media only screen and (max-width: 1100px){
	.news ul{ margin:0; width:100%; padding:0 0 20px}
		.news ul li{ float:left; width:24%; margin:0 0 0 5px;}
	}
@media only screen and (max-width: 640px){
	.news ul{ padding:0 0 20px}
	.news ul li{ float:left; width:48%; margin:10px 5px;}
	}
@media only screen and (max-width: 500px){
	.news ul{ padding:0 0 20px}
	.news ul li{ float:left; width:48%; margin:7px 1px;}
	}
@media only screen and (max-width: 480px){
	.news ul{ padding:0 0 20px; width:96%; margin:auto}
	.news ul li{ float:none; width:auto; height:auto; margin:5px 0; overflow:hidden; padding:0}
	.news ul li .photo{ width:120px; height:120px; float:left; overflow:hidden; position:relative; margin:5px; padding:0;}
		.news ul li .photo img{ position:absolute; top:0; left:50%; height:120px; width:208px; margin:0 -104px;}
	.news ul li h3{padding:15px 10px 10px 15px;}
	.news ul li p{padding:5px 10px 10px 15px; height:48px;}
	}
.cases{ background: #1E1E1E;  width:100%; overflow:hidden;}
	.cases .content-top{ margin:0 0 20px; text-align:center;}
		.cases .content-top h1{ color:#F00;}
		.cases .content-top h2{ color:#F00; background:none;}
		.cases .content-top h1 h2 span{color:#EEE;}
	.cases ul{ margin:0 -22px 15px; width:1144px; overflow:hidden;}
		.cases ul li{ float:left; width:352px; margin:0 0 22px 22px; background:#FFF; padding:0 0 5px; box-shadow: 0 0 3px #666;}
		.cases ul li:hover{box-shadow: 0 0 10px #666;}
			.cases ul li .photo{ padding:5px;}
			.cases ul li .photo img{ width:100%; display:block;}
			.cases ul li h3{ margin:0; padding:10px 10px; text-align:left; color:#333; font-size:0.9em; line-height:1em; height:0.9em; overflow:hidden;}
			.cases ul li p {}
@media only screen and (max-width: 1100px){
	.content{ padding:0; width:100%}
	.cases .content-top{ width:100%; margin:0 0 5px; overflow:hidden; height:40px; background:rgba(0,0,0,0.75); progid:DXImageTransform.Microsoft.gradient(startColorstr=#CF000000,endColorstr=#CF000000);}
	.cases .content-top h2{ float:left; padding:15px 20px 10px; margin:0; line-height:1em; width:auto; vertical-align:bottom;}
	.cases .content-top .bun{ float:right;color:#FFF; text-align:center; line-height:1em; padding:13px 10px 7px; width:80px; height:17px; border-top:none; margin:3px 3px 0;background:rgba(51,51,51,0.75); progid:DXImageTransform.Microsoft.gradient(startColorstr=#CF333333,endColorstr=#CF333333); font-size:0.85em;} 
		.cases ul{ width:100%; margin:0;}
		.cases ul li{ width:33.3%; background:none; margin:0 0 10px; box-shadow:none;}
		.cases ul li .photo{ padding:5px; background:#FFF; margin:5px 5px 0;}
		.cases ul li .photo img{ width:100%; height:auto;}
		.cases ul li h3{ padding:5px 5px 10px; background:#FFF; margin:0 5px 5px;}
}
@media only screen and (max-width: 960px){
		.cases ul{ padding:0 0 10px}
		.cases ul li{ width:50%; background:none; margin:0 0 5px;}
}
.prod{ background:#000;  width:100%; overflow:hidden;}
	.prod .content-top{ margin:0 0 20px; text-align:center;}
		.prod .content-top h1{  background:url(../images/bg-title02.gif) no-repeat  center 30px no-repeat; }
		.prod .content-top h2{  background:url(../images/bg-title02.gif) no-repeat  center 30px no-repeat; }
		.prod .content-top h1 h2 span{color:#EEE;}
		.prod .content-top .bun{color:#FFF; text-align:center; line-height:1em; padding:10px 10px 10px; width:80px; margin:auto; font-size:0.95em;}
		.prod .content-top .bun a{color:#CCC;}
	.prod ul{ margin:0 -20px 15px; width:1140px; overflow:hidden;}
		.prod ul li{ float:left; width:260px; margin:0 0 20px 20px; position:relative; overflow:hidden;}
			.prod ul li .photo{}
			.prod ul li .photo img{ width:100%; display:block;}
			.prod ul li  h3{ background:rgba(0,0,0,0.75); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CF000000,endColorstr=#CF000000); height:260px; width:260px; overflow:hidden; bottom:-230px; z-index:1; position:absolute; font-weight:normal;transition:bottom 0.5s; -moz-transition:bottom 0.5s; /* Firefox 4 */-webkit-transition:bottom 0.5s; /* Safari and Chrome */-o-transition:bottom 0.5s; /* Opera */}
				.prod ul li h3 a {display:block;color:#EEE; font-size:0.85em; line-height:1em; height:0.85em; overflow:hidden; padding:7px 10px; text-align:center; transition:padding 0.5s; -moz-transition:padding 0.5s; /* Firefox 4 */-webkit-transition:padding 0.5s; /* Safari and Chrome */-o-transition:padding 0.5s; /* Opera */}
				.prod ul li:hover h3{bottom:0;}
				.prod ul li:hover h3 a{ padding:110px 10px 7px}
			.prod ul li p {}
@media only screen and (max-width: 1100px){
		.prod ul{ width:100%; margin:0;}
		.prod ul li{ width:33.3%; background:none; margin:0 0 10px; box-shadow:none;}
		.prod ul li .photo{ padding:5px; background:#FFF; margin:5px 5px 0;}
		.prod ul li .photo img{ width:100%; height:auto;}
		.prod ul li h3{ bottom:0; height:30px; width:100%; top:auto;}
		.prod ul li:hover h3{bottom:0; height:30px; width:100%;}
				.prod ul li:hover h3 a{ padding:7px 10px 7px;}
}
@media only screen and (max-width: 680px){
		.prod ul{ padding:0 0 10px}
		.prod ul li{ width:50%; background:none; margin:0 0 5px;}
}
.newslist{ background:#1e1e1e; width:100%; overflow:hidden; padding:0 0 20px;}
	.newslist .content-top{ margin:0 0 20px; text-align:center;}
    .newslist .content-top h1{ color:#F00;}
	.newslist ul{ margin:auto; width:1100px; overflow:hidden;}
		.newslist ul li{ background:rgba(255,255,255,0.75);filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#CFFFFFFF,endColorstr=#CFFFFFFF); margin:0 0 15px; overflow:hidden;}
			.newslist ul li .photo{ margin:10px; width:260px; height:150px; float:left;}
			.newslist ul li .photo img{ width:100%; display:block;}
			.newslist ul li h2{ background:none; margin:0 0 15px; padding:10px 10px 5px; text-align:left; color:#333; font-size:1.5em; line-height:1.5em; height:1.5em; overflow:hidden;}
			.newslist ul li p { background:none; margin:0 0 10px; padding:5px 10px; text-align:left; color:#333; font-size:0.85em; line-height:1.7em; overflow:hidden;}
            .newslist ul li a{ display:block; height:27px; width:125px; border:1px solid #D7000F; text-align:center; line-height:27px; vertical-align:middle; font-size:0.8em; color:#D7000F; margin:0 10px 5px; float:left;}
            .newslist ul li a:hover{ border:1px solid #D7000F; background:#D7000F;color:#FFF;}
@media only screen and (max-width:1100px) {
    .newslist {width:100% }
    .newslist {width:100% }
        .newslist ul { width:100%}
        .newslist ul li{ margin:5px;}
        .newslist ul li .photo {width:25%; min-width:150px; height:auto; }
        .newslist ul li h2{ background:none; margin:0 0 7px; padding:10px 5px 5px; text-align:left; color:#333; font-size:1.1em; line-height:1.1em; height:1.1em;}
			.newslist ul li p { background:none; margin:0 0 5px; padding:5px; text-align:left; color:#333; font-size:0.85em; line-height:1.5em;  overflow:hidden; height:1em;}
            .newslist ul li a{ display:block; height:27px; width:125px; border:1px solid #D7000F; text-align:center; line-height:27px; vertical-align:middle; font-size:0.8em; color:#D7000F; margin:0 10px; float:left;}
}
.pagination { text-align: center; padding: 20px 0 5px 0;font-size: 0.8em;}
	.pagination a { margin: 0 5px 0 0; padding: 3px 6px; color:#EEE;}
	.pagination a.number { border: 1px solid #ddd;}
	.pagination a.current { background: #900; border: 1px solid #666;!important; color: #FFF !important;}
	.pagination a.current:hover { text-decoration: underline;}
footer{ padding:25px 15px; text-align:center; background:#000}
	footer #social{ margin:15px 0 15px; text-align:center;}
	footer #copyright{ padding:0 15px ; font-size:0.9em; line-height:1.8em; text-align:center; color:#CCC;}
	footer #copyright a{ color:#EEE;}