@charset "utf-8";
	
/*格式化样式*/

html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu{margin: 0;
	padding: 0;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;font-weight:normal;}
html,body,fieldset,img,iframe,abbr{border:0;}
i,cite,em,var,address,dfn{font-style:normal;}
[hidefocus],summary{outline:0;}
li{list-style:none;}
ol, ul {list-style: none outside none;}
sup,sub{font-size:83%;}
pre,code,kbd,samp{font-family:inherit;}
q:before,q:after{content:none;}
textarea{overflow:auto;resize:none;}
label,summary{cursor:default;}
a,button{cursor:pointer;}
h1,h2,h3,h4,h5,h6,em,strong,b{font-weight:bold;}
del,ins,u,s,a,a:hover{text-decoration:none;}
a:hover{color:#f60;}
body,textarea,input,button,select,keygen,legend{color: #333;outline: 0; font-family:Microsoft YaHei; font-size: 12px;}
body{background-color:#fff; margin:0;padding:0; font-family: Arial, 'Microsoft YaHei', sans-serif; font-size:12px; overflow-x:hidden;}
.clear{float:none;}
#button, .btn-success, .item-on-hover, :active, :focus, :hover, :link, :visited {
    -webkit-transition: all .3s linear;
    -moz-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear;
}

img{vertical-align: bottom; width:auto;}

.wrapper{min-width:1200px; width:auto; overflow:hidden;}
.fl{float:left;}
.fr{float:right;}
/*头部导航*/
.topAera{ padding:.5em 0;border-bottom: 1px solid #EFEFEF;background: #fff;color: #A1A1A1;}
.top{width:1003px; margin:0 auto; position:relative;}
.top a{color:#515151;}
.top a:hover{color:#f60; text-decoration:underline;}
.top .collection{position:absolute; top:0px; right:30px;}
.logo{width:1003px; margin:0 auto;}
.navbox{border-top: 1px solid #EFEFEF; height:45px; width:100%;}
.nav{width:1003px; margin:0 auto; line-height:45px;}
.nav li{line-height:45px; text-align:center; float:left; width:100px; position:relative;}
.nav li a{font-size:14px; color:#333; display:block;}
.nav li:hover a{ background-image:url(../images/nav_active.png); background-repeat:repeat-x; color:#fff;}
.nav li .active{ background:url(../images/nav_active.png) repeat-x; color:#fff;}
.nav li ul{display:none; background:#b1afaf;position:absolute; top:45px; left:0; z-index: 1000;}
.nav li ul li{float:none; line-height:28px;}
.nav li ul li a{display:block; background:#b1afaf;}
.nav li ul li a:hover{background:#333; color:#fff;}

.part1{background:url(../images/bg1.jpg) repeat-x ; width:100%; height:350px;}
.servicebox{width:1003px; margin:0 auto; padding:30px 0 20px;}
.servicebox .title{text-align:center;}
.servicebox .title h3{ font-size:24px; color:#333; line-height:30px; padding:8px 0 12px;}
.servicebox .title p{color:#838383; font-size:18px; line-height:24px;}
.service{overflow:hidden; text-align:center; padding-top:36px;}
.service li{width:25%; float:left;}
.service li .pic{text-align:center; padding-bottom:20px;}
.service li p{font-size:14px; color:#555555; line-height:24px;}

.part2{height:auto; overflow:hidden;}
.casebox{width:1003px; margin:0 auto; padding:15px 0;}

.part3{background:#d7dae1; width:100%;}
.aboutus{width:1003px; margin:0 auto; padding:24px 0 30px;}
.home_title{ font-size:22px; color:#636363;}
.home_title span{ color:#e60012; font-size:20px; background:url(../images/line.png) no-repeat left center; padding-left:12px;}
.about{position:relative; padding:30px 400px 30px 0;}
.about .pic1{position:absolute; top:0px; right:0px;}
.think{position:relative; padding:50px 110px 40px 320px;}
.think .pic2{position:absolute; top:0px; left:0px;}
.team{position:relative; padding:50px 400px 30px 0;}
.team .pic3{position:absolute; top:0px; right:30px;}
.aboutus .title{color:#e60012; font-size:18px; line-height:28px;}
.aboutus .title img{vertical-align:inherit; padding-right:24px;}
.aboutus p{ line-height:24px; padding-top:12px; padding-bottom:30px;}

.newsbox{ width:1003px; margin:0 auto; padding:0px 0 40px; overflow:hidden;}
.news{width:470px;}
.home_title{position:relative;}
.home_title .more{position:absolute; top:7px; right:0; font-size:12px; color:#636363; width:48px; height:22px; text-align:center; display:block; line-height:22px; background:#dadde4;}
.news ul{ padding-top:16px;}
.news ul li{ color:#636363; font-size:12px; line-height:24px; overflow:hidden;}
.news ul li .date{float:right;}
.news ul li a span{padding-right:3px;}
.news ul li a:hover{color:#e60012;}

.footerArea{ background:#242424; padding:24px 0 20px;}
.footer{overflow:hidden; width:1003px; margin:0 auto;}
.footer .line{border:1px solid #353535; height:175px; float:left; margin-top:20px;}
.contact{ width:350px; float:left; padding-left:12px; }
.contact .title{padding-bottom:24px;}
.contact .title h3{ font-size:16px; color:#666; padding-bottom:6px;}
.contact .title h3 span{ color:#6bb918; font-size:24px; padding-right:5px;}
.contact .qq{ padding-bottom:8px;}
.contact .qq img{margin-right:18px;}
.contact p{ font-size:12px; color:#666; line-height:20px;}
.footer .tel{ width:330px; float:left; padding-left:36px; line-height:30px; padding-top:30px;}
.footer .ewm{float:left; padding:35px 0 0 75px; }
.copyright{text-align:center; background:#101010; color:#666; padding:15px 0px; line-height:20px;}
/**/
.main{width:1200px; margin:0 auto; padding:10px 0px 30px; overflow:hidden;}
.main .left{ width:210px; float:left;}
.main .left h3{ background:#e60012; color:#fff;padding: 0px 15px;height: 45px;border-top-left-radius: 5px; border-top-right-radius: 5px; line-height:45px; font-size:16px; font-weight:normal;}
.leftnav{padding-bottom:15px;}
.leftnav dl{background: #f5f5f5 !important;}
.leftnav dl dt{border-bottom: 1px solid #FFFFFF;padding:4px 0px 5px 35px;line-height:30px;}
.leftnav dl dt a{color:#333;font-size:14px;}
.leftnav dl dt a:hover{color:#e60012;}
.leftnav dl dt .active{color:#e60012;}
.main .left .editor{font-size:12px; line-height:24px; padding:10px;background: #f5f5f5 !important;}
.main .right{ width:965px; float:right;}
.main .right img{transition: all 0.65s ease-in-out;-webkit-transform: all 0.65s ease-in-out;-moz-transform: all 0.65s ease-in-out;-ms-transform: all 0.65s ease-in-out;-o-transform: all 0.65s ease-in-out;transform: all 0.65s ease-in-out;}
.main .right h3.title{border-bottom: 1px solid #ddd; background: #f8f8f8; height: 40px; line-height: 40px; position: relative; font-weight:normal;}
.main .right h3.title span{position: absolute; left: 0px; top: -1px; font-size: 16px; font-weight: bold; border-bottom: 2px solid #ff6633; padding: 0px 10px;}
.main .right h3.title .position{float: right; font-weight: normal; position: relative; top: 3px; right: 15px; color: #2f2f2f; font-size: 12px;}
.main .right h3.title .position a{color:#2f2f2f;}
.main .right h3.title .position a:hover{color:#e60012;}
.main .right .newslist{padding: 15px 90px;}


/*新闻列表页*/
.newslist dl{padding:15px 0 25px; overflow:hidden;}
.newslist dl:hover img{-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-o-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1);}
.newslist dl dd{width:210px; float:left; margin-right:15px; overflow:hidden;}
.newslist dl dt{padding-left:225px;}
.newslist dl dt h3{font-weight:normal; padding-bottom:10px; overflow:hidden; line-height:30px;}
.newslist dl dt h3 a{font-size:16px; color:#333; display:block; padding-top:10px;}
.newslist dl dt h3 .date{float:left; border-right:1px solid #2f2f2f; padding-right:8px; margin-right:15px;}
.newslist dl dt h3 .date p{font-size:24px; line-height:20px; text-align:center; font-weight:bold; color:#595959;}
.newslist dl dt h3 .date span{line-height:18px; color:#777474;}
.newslist dl dt p{font-size:12px; color:#6f6e6e; line-height:20px;}
.newslist dl dt p a{color:#333;}
.newslist dl a:hover{color:#e60012;}
/*分页*/
.page{text-align:center; padding:15px;}
.page a{border:1px solid #e60012; padding:2px 6px; margin:0px 3px; background:#e60012; color:#fff;}
.page a:hover{color:#e60012; background:#fff;}
.page span{border:1px solid #e60012; padding:2px 6px;color:#e60012;}
/*详情页*/
.main .right .show .title h3{font-size: 20px; text-align: center;padding: 5px 0px; margin: 10px 0px; color: #333;}
.met_hits{ padding-bottom:10px; text-align:center; border-bottom: 1px dotted #ccc; }
.met_hits .hit{position:relative; display: inline-block; margin-left:-120px;}
.met_hits .hit .metjiathis{position:absolute; right:-155px; top:-6px;}
.met_page {color:#666}
.met_page a{color:#333;}
.met_page a:hover{color:#4b2223; text-decoration:underline;}
.main .right .content{line-height:2; padding:15px 0px; color:#666; font-size:14px;}  
.main .right .content2{line-height:2; padding:15px 5px; color:#666; font-size:14px;}  
/*产品列表*/
.productlist{padding:15px 20px; overflow:hidden;}
.productlist li{width: 217px; margin:0px 7px;float:left; text-align:center;}
.productlist li .txt{padding: 5px 0px 12px; font-weight: normal; line-height: 1.5; font-size:14px; text-align:center;}
.productlist li .txt a{color:#333;}
.productlist li a{display:block; overflow:hidden;}
.productlist li:hover img{-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-o-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1);}
.productlist li:hover .txt a{color:#e60012;}
/*表单样式*/					
.inputbox{margin:15px;overflow:hidden;zoom:1;}
.inputbox p{padding:.5em 0}
.inputbox .ibl{float:left;width:15%;text-align:right;display:block;padding-top:.4em}
.inputbox .ibr{margin:0 0 0 15%;display:block;padding-left:.3em}
/*提交，重置按钮*/
.btn-submit{width:80px;height:35px;border:0;background:#c90c0a;cursor:pointer;color:#fff;font-size:14px;font-weihgt:bold}
.reset{width:80px;height:35px;border:0;background:#f3b349;cursor:pointer;color:#fff;font-size:14px;font-weihgt:bold}
.input{border:1px solid #e8e8e8;padding:.6em .4em;font-size:12px;color:#666;background:url(../images/input_bg.jpg) repeat-x;}
.input:focus{box-shadow:0 0 2px 0 #02A8E5;}

/*案例动画*/
.portfolio-items{width:1003px; margin:0 auto; padding:30px 0px; overflow:hidden;} 
.portfolio-items .col-sm-3{width:236px; padding:0px 5px 16px; float:left; height:160px;}
.view {  
  cursor: default;
  height: 100%;
  overflow: hidden;
  position: relative;
  text-align: center;
  width:100%;
}

.efffect h4 {  
	opacity: 0;
	transform: scale(0);
	transition: all 0.5s linear 0s;
}

.efffect h3 {
	opacity: 0;
	transform: scale(0);
	-webkit-transition: all 0.5s linear 0s;
	-moz-transition: all 0.5s linear 0s;
	-ms-transition: all 0.5s linear 0s;
	-o-transition: all 0.5s linear 0s;
	transition: all 0.5s linear 0s;
}

.efffect img {
	transform: scaleY(1);
	-moz-transform: scaleY(1);
	-webkit-transform: scaleY(1);
	-o-transform: scaleY(1);
	-ms-transform: scaleY(1);  
	transition: all 0.7s ease-in-out 0s;
	-moz-transition: all 0.7s ease-in-out 0s;
	-webkit-transition: all 0.7s ease-in-out 0s;
	-o-transition: all 0.7s ease-in-out 0s;
}

.view img {
	display: block;
	position: relative;
	height:161px;
	width:234px;
	
}

.efffect .mask {
	background-color: #F6F6F6;
    border:4px solid #333333;
	-webkit-transition: all 0.5s linear 0s;
	-moz-transition: all 0.5s linear 0s;
	-ms-transition: all 0.5s linear 0s;
	-o-transition: all 0.5s linear 0s;
	transition: all 0.5s linear 0s;
	opacity: 0
}

.view .mask, .view .content {
	height:96%;
	left: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	width:96%;
}

.mask h3 {
	color: #43484E;
	font-family: cabin;
	font-size: 22px;
	font-weight: 700;
	margin-top: 30px;
	text-transform: uppercase;
	transition: height 500ms ease 0s;
}

.mask h4 {
	color:#000;
	font-family: roboto;
	font-size: 14px;
	font-weight: 200;
	padding: 0 35px 5px;
}

.mask i {
	border: 2px solid #333;
	border-radius: 50%;
	color: #333;
	font-size: 17px;
	margin-left: 8px;
	padding: 8px;
}

.mask i:hover{
	background-color:#fc7700;
	color:#fff;  
}

.efffect .mask {
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   cursor: zoom-in;
}
.efffect h4 {   
   background: transparent;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.efffect h3 {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   font-size:22px;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
}
.mask a i {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform:rotate(-180deg);
   -moz-transform:rotate(-180deg);
   -o-transform:rotate(-180deg);
   -ms-transform:rotate(-180deg);
   transform:rotate(-180deg);
   -webkit-transition:all 0.5s linear 0.7s;
   -moz-transition: all 0.5s linear 0.7s;
   -o-transition:all 0.5s linear 0.7s;
   -ms-transition:all 0.5s linear 0.7s;
   transition:all 0.5s linear 0.7s;
}
.efffect:hover img {
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.efffect:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.efffect:hover h4,.efffect:hover h3,.efffect:hover a i {
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}

.online-qq{position:fixed;top:55%;left:10px;z-index:200}
.online-qq .qq_content{background:#fff;margin:0;padding:0;}
.online-qq .qq_content dt{background:url(../images/title_bg3.jpg) no-repeat;color:#fff;font-size:14px;font-weight:bold;padding:6px 15px;border:1px solid #ddd;border-bottom:0;}

.online-qq .qq_content .qq{padding:10px 10px 5px;margin:0;border:1px solid #ddd;border-top:0}
.online-qq .qq_content .qq p{background:url(../images/online_qq.png) repeat-x 0 -33px;margin:0 0 5px}
.online-qq .qq_content .qq a{border:1px solid #ddd;display:block;background:url(../images/online_qq.png) no-repeat 10px -72px;height:23px;line-height:23px;padding:0 18px 0 30px}
.online-qq .qq_content .tel{background:#f9f9f9;padding:10px;margin:0;text-align:center;font-size:14px;font-weight:bold;color:#333;border:1px solid #ddd;border-top:0}
.online-qq .qq_content .tel strong{font-size:12px;color:#f60}
.online-qq .foot{border:1px solid #ddd;background:#f1f1f1;height:2px;overflow:hidden;margin:0 5px;border-top:0;display:none}