.index-banner{
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	z-index: 1;
	background-color: #e3e3e3;
}
.carousel-inner .item img{
	margin: 0 auto;
}
.carousel-box{
	width: 10000px;
	height: auto;
	overflow: hidden;
	position: relative;
	z-index: 1;
}
.carousel-box .item{
	float: left;
	overflow: hidden;
	text-align: center;
}
.carousel-box .item a{
	display: block;
}
.carousel-box .item img{
	max-width: 100%;
	max-height: 700px;
	text-align: center;
}
.index-banner .banner-wrap{
	position: relative;
}
.index-banner .banner-wrap .guid-btn{
	display: block;
	position: absolute;
	top: 45%;
	width: 50px;
	height: 60px;
	background-color: black;
	opacity: 0.4;
	z-index: 2;
	background-repeat: no-repeat;
}
.index-banner .banner-wrap .prev{
	left: 0px;
	background-image: url(../../images/prev-big.png);
	background-position: center center;
}
.index-banner .banner-wrap .next{
	background-image: url(../../images/next-big.png);
	background-position: center center;
	right: 0px;
}
.product-box{
	margin:30px auto 30px;
	float: none;
	height: auto;
/*	overflow: hidden;*/
}
.product-box .product-box-head{
	height: auto;
	padding: 0 15px;
}
.product-box .product-box-head h4{
	line-height: 30px;
}
.row .tit-big{	
	font: 22px "微软雅黑";
	color: #333;
}
.row .tit-sub{	
	font-size: 14px;
	color: #afafaf;
}
.product-box .product-item-list{
	height: auto;
	margin-top: 20px;
	padding: 0 15px;
	text-decoration: none;
}
.product-box .product-item-list .icon-wrap-img{
	height: 295px;
	width: 100%;
	text-align: center;
	overflow: hidden;
	
}
.product-box .product-item-list .icon-wrap-img .oa{
	height: 146px;
	width: 200px;
	margin: 30px auto 20px;
	background: url(../../images/haofeng/images/icon/oa.png);
}
.product-box .product-item-list .icon-wrap-img .others{
	height: 146px;
	width: 200px;
	margin: 30px auto 20px;
	background: url(../../images/haofeng/images/icon/others.png);
}
.product-box .product-item-list .icon-wrap-img .print{
	height: 146px;
	width: 200px;
	margin: 30px auto 20px;
	background: url(../../images/haofeng/images/icon/print.png);
}
.product-box .product-item-list .icon-wrap-img .retailers{
	height: 146px;
	width: 200px;
	margin: 30px auto 20px;
	background: url(../../images/haofeng/images/icon/retailers.png);
}
.product-box .product-item-list .icon-wrap-setion{
	width: 100%;
	height: 40px;
	font-size: 18px;
	line-height: 40px;
	text-align: center;
	color: #333;
}
.product-box .product-item-list .icon-wrap-setion span{
	display: block;
	width: 100%;
	height: 40px;
	position: relative;
}
.product-box .product-item-list:hover .icon-wrap-setion span{
	color: #0092cf;
}
.product-box .product-item-list .icon-wrap-setion span::after{
	content: "";
	width: 0%;
	height: 1px;
	background-color: #0092cf;
	position: absolute;
	left: 50%;
	bottom: 0px;
}
/*.product-box .product-item-list:hover .icon-wrap-setion span:after{
	animation: link-move 0.8s ease forwards; 
}*/
.product-box .product-item-list .describe{
	text-align: center;
	color: #a4a4a4;
}
@keyframes link-move{
	0%{
		left: 50%;
		width: 0%;
	}
	100%{
		left: 0px;
		width: 100%;
	}
}

.product-box .product-item-list:hover .tu{
	background-color: #fff;
	transform: scale(1.1);
	transition: 0.4s linear;
	position: relative;
	z-index: 9999;
}
#canvas{
	position: absolute;
	height: 600px;
	width: 100%;
	z-index: -1;
}
#canvas-box{
	width: 100%;
	height: 100%;
}
.cases{
	margin: 30px auto;
	position: relative;
	z-index: 2;
	float: none;
}
.cases .cases-head{
	text-align: center;
	color: #fff;
	float: none;
}
.cases .ss-cases{
	padding:0 15px;
	height: auto;
	float: none;
}
.cases .ss-cases a{
	text-decoration: none;
	position: relative;
	top: 10px;
	color: #333333;
	float: right;
}
.cases .cases-head a{
	display: block;
	margin: 0 auto;
	height: 30px;
	width: 120px;
	color: #333;
	line-height: 30px;
	text-decoration: none;
}
.cases .cases-box{
	float: none;
	margin: 30px auto;
	position: relative;
	z-index: 2;
}
.cases .cases-box .over-box{
	overflow: hidden;
	height: auto;
	margin:30px auto 0;
}
.row .cases-wrap{
	background-color: #f6f7fc;
}
.cases .cases-box .cases-wrap-over{
	height: auto;
	overflow: hidden;
	position: relative;
}
.cases .cases-box .cases-wrap-over .cases-list{
	height: auto;
	float: left;
	padding: 0 15px;
}
.cases .cases-box .cases-wrap-over .cases-list-img{
	height: 170px;
	width: 100%;
	text-align: center;
	overflow: hidden;
	background-color: #f2f2f2;
}
.cases .cases-box .cases-wrap-over .cases-list-img img{
	width: 100%;
	height: 100%;
	vertical-align: middle;
}
.cases .cases-box .cases-wrap-over .cases-bg{
	background-color: #fff;
	height: auto;
	overflow: hidden;
	border: 1px solid #ccc;
}
.cases .cases-box .cases-wrap-over .cases-list-setion{
	background-color: #e7e7e7;
}

.cases .cases-box .cases-wrap-over .cases-list-setion p{
	width: 100%;
	padding: 10px 6px 0;
}
.cases .cases-box .cases-wrap-over .cases-list-setion label{
	line-height: 30px;
	margin-bottom: 0px;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	color: #333;
}
.cases .cases-box .cases-wrap-over .cases-list-setion span{
	font-size: 12px;
	line-height: 20px;
	
}
.cases .cases-box .cases-wrap-over .cases-list-link{
	padding: 10px 0;
	text-align: center;
}
.cases .cases-box .cases-wrap-over .cases-list-link .setion-link{
	font-size: 12px;
	display: block;
	margin: 0 auto;
	height: 30px;
	border: 1px solid #333;
	width: 110px;
	color: #333;
	line-height: 28px;
	text-decoration: none;
}

.common{
	float: none;
	margin: 30px auto;
	height: auto;
	overflow: hidden;
}
.common .common-head{
	text-align: center;
}
.common .common-head h4{
	line-height: 40px;
	height: 40px;
}
.common .common-head span{
	font-size: 12px;
	line-height: 20px;
}
.common .loop-box{
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	border: 1px solid #ccc;
	margin-top: 30px;
}
.common .loop-int{
	margin-top: 30px;
	padding: 0 0 0 12px;
}
.common .loop-int p{
	text-indent: 2em;
}
.common .loop-more{
	text-align: right;
}
.common .loop-more a{
	color: #666;
	text-decoration: none;
}
.common .loop-box .prev,
.common .loop-box .next{
	position: absolute;
	display: block;
	width: 28px;
	height: 39px;
	background-image: url(../../images/pc.png);
	background-repeat: no-repeat;
	top: 140px;
	z-index: 200;
}
.common .loop-box .prev{
	left: 0px;
	background-position:-72px -60px;
}
.common .loop-box .next{
	right: 0px;
	background-position: -72px -18px;
}
.common .loop-box .loop-wrap{
	height: auto;
	overflow: hidden;
/*	width: 10000px;*/
	position: relative;
	z-index: 2;
}
.common .loop-box .loop-wrap .loop-list{

	display: block;
	overflow: hidden;
	float: left;
	position: relative;
	z-index: 2;
}
.common .loop-box .loop-wrap .loop-list .img_wrap{
	width: 100%;
	text-align: center;
	padding: 4px;
}
.common .loop-box .loop-wrap .loop-list .img_wrap img{
	max-width: 100%;
	vertical-align: middle;
}
.common .loop-wrap .loop-bg{
	height: 30px;
	line-height: 30px;
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 100%;
	background-image: url(../../../statics/images/bg_black.png);
	background-repeat: repeat;
	text-align: center;
	color: #fff;
	font-size: 12px;
	z-index: 99;
}
.common .news-list{
	height: auto;
	overflow: hidden;
	padding: 0 15px;
}
.common .news-cont{
	margin-top: 30px;
}
.common .news-item{
	height: auto;
	overflow: hidden;
	border-bottom: 1px dotted #ccc;
	padding-bottom: 5px;
}
.common .news-item-top{
	margin-bottom: 5px;
}
.common .news-item-bot{
	margin-bottom: 30px;
}
.common .news-item .news-title .host-cont{
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
.common .news-item .news-title .host-cont label{
	color: #ee5f00;
	margin: 0px 6px 0 0;
}
.common .news-item .news-title a{
	color: #333;
}
.common .news-item .news-title a .host-arrow{
	display: inline-block;
	width: 8px;
	height: 11px;
	margin-right: 10px;
	background: url(../../images/haofeng/images/icon/arrow_right.png) no-repeat;
}
.common .news-item .news-title .sub-cont{
	line-height: 20px;
	font-size: 12px;
}
.common .news-item .news-date{
	text-align: right;
}
.common .news-item .news-date span{
	color: #666;
}



@media only screen and (max-width:992px){
	.product-box .product-item-list .icon-wrap{
		height: 200px;
		overflow: hidden;
		background-color: #f3f3f3;
	}
	.product-box .product-item-list .icon-wrap-setion{
		line-height: 30px;
		height: 30px;
		font-size: 12px;
	}
	.product-box .product-item-list{
		width: 50%;
	}
	.cases .cases-box{
/*		background-color: #12beaa;*/
	}
	.cases .cases-box .cases-wrap-over .cases-list{
		width: 50%;
		font-size-adjust: 10px;
		font-size: 10px;
	}
	.common .loop-box{
		display: none;
	}
	.common .news-list{
		width: 100%;
		float: none;
		margin: 0 auto;
	}
	.common .news-item{
		font-size: 10px;
		font-size-adjust: 10px;
	}
}
@media only screen and (max-width:768px){
	.product-box .product-item-list .icon-wrap .icon-guid{
		display: block;
		width: 78px;
		height: 62px;
		margin: 0 auto;
	}
	.nav .nav-wrap .search-box{
		display: none;
	}
	.index-banner{
		height: 200px;
	}
	.carousel-box{
		height: 220px;
	}
	.index-banner .banner-wrap .guid-btn{
		top: 30%;
	}
	.carousel-box .item img{
		max-width: 100%;
	}
	.cases-wrap{
		background-color: #0092cf;
		height: auto;
		overflow: hidden;
	}
	.cases .cases-box .cases-wrap-over .cases-list{
		width: 50%;
		margin-top: 20px;
	}
	.cases .cases-box .cases-wrap-over .cases-bg{
		width: 260px;
		margin: 0 auto;
		background-color: #fff;
		height: auto;
		overflow: hidden;
		border: 1px solid #ccc;
	}
}

@media only screen and (max-width:590px){
	.index-banner{
		display: none;
	}
	.product-item-list{
		width: 100%;
	}
	.product-box .product-item-list{
		width:100%;
	}
	.cases .cases-box .cases-wrap-over .cases-list{
		width: 100%;
	}
}