@charset "utf-8";
.container{height:auto;padding-bottom: 10px;}
/**************************
		Slider
***************************/
.mt12{height:12px;clear:both}
#slides{position:relative;z-index:2;margin:0 auto;border:6px #846604 solid;border-radius:5px}
#slides,#slides .slides-container,#slides .banner{width:1218px;height:411px;}
#slides .banner{background-position:center;display:block}
#slides .pagination{z-index:999;position:absolute;bottom:10px;left:50%;margin-left:-28px}
#slides .pagination li{width:16px;height:16px;display:inline-block;margin:0 3px;background:url(../images/slider_btn.png) top center no-repeat}
#slides .pagination li a{width:16px;height:0;display:block;padding-top:16px;overflow:hidden}
#slides .pagination li.current{background-position:bottom center}

/**************************
		  Products
***************************/
.home-wrap{width:1170px;height:1070px;margin:0 auto;padding:16px 30px 0;border-bottom-left-radius:10px;border-bottom-right-radius:10px;position:relative;top:-5px;background:#f5f5f5 url(../images/home_wrap_bg.png) bottom repeat-x}
.products .title-bar{height:39px;border:1px #cdcdcd solid;border-top-left-radius:10px;border-top-right-radius:10px;background:#efefef url(../images/products_titlebar_bg.png) bottom repeat-x}
.products .title-bar h2{font-weight:bold;float:left;font-size:15px;margin:11px 0 0 11px}
.products .title-bar .more{display:block;width:70px;line-height:23px;float:right;border:1px #cdcdcd solid;font-weight:700;text-align:center;margin:8px 15px 0 0}
.products .contents{height:143px;background:#f5f4f5 url(../images/product_contents_bg.png) bottom repeat-x;border:1px #cdcdcd solid;border-top:0;border-bottom-left-radius:10px;border-bottom-right-radius:10px;overflow:hidden}
.products .contents ul li{float:left;width:160px;height:143px;text-align:center;background:url(../images/products_line.png) right center no-repeat}
.products .contents ul li a{display:block}
.products .contents ul li img{width:130px;height:110px;margin-top:5px}
.products .contents ul li span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin:0 10px}

/**************************
		  Success Case
***************************/
.cases{border:1px #cdcdcd solid;height:246px;margin-top:11px;background-color:#f5f5f5;border-radius:10px;overflow:hidden}
.cases .title-bar{height:39px}
.cases .title-bar h2{font-weight:700;float:left;font-size:15px;margin:11px 0 0 11px}
.cases .title-bar .more{line-height:23px;float:right;font-weight:700;text-align:center;margin:8px 15px 0 0}
.cases .contents li{width:16.66%;float:left;}
.cases .contents li img{width:173px;height:129px;border:1px #a38312 solid}
.cases .contents li span{display:block;overflow:hidden;height:38px;font-size:13px;padding:5px 10px 0}
.cases .contents li .time{
	font-size: 11px;
	line-height: 13px;
	color: #999;
	padding-left: 24px;
	background-position: 10px center;
	background-repeat: no-repeat;
	background-image: url('../images/time.png');
}

/**************************
		  layout-a
***************************/
.layout-a{overflow:auto}
.layout-a .horizontal{float:left;width:25%}
.layout-a .horizontal .box{border:1px #cdcdcd solid;width:282px;height:200px;margin-top:11px;background-color:#f5f5f5;border-radius:10px}
.layout-a .video{float:left}
.layout-a .video img{border-radius:5px;width:263px;height:157px}
.layout-a .best,.layout-a .our{margin:0 auto}
.layout-a .best,.layout-a .our img{border-radius:5px;width:263px;height:157px}
.layout-a .best,.layout-a .service img{border-radius:5px;width:263px;height:157px}
.layout-a .service{float:right}
.layout-a .title-bar{height:25px;font-weight:700;font-size:15px;padding:11px 11px 0}
.layout-a .contents{margin:0 9px 0}
.layout-a .best .slider,.layout-a .best a{display:block;width:263px;height:157px}
.layout-a .best .slider,.layout-a .best a img{border-radius:5px;width:263px;height:157px}
.layout-a .pagination{display:none}
.layout-a .pagination{display:none}

/**************************
		  News
***************************/
.news{float:left;margin-top:11px;width:580px}
.news .title-bar{height:36px;border:1px #cdcdcd solid;border-top-left-radius:10px;border-top-right-radius:10px;background:#efefef url(../images/news_title_bar_bg.png) bottom repeat-x}
.news .title-bar h2{font-weight:700;float:left;font-size:15px;margin:10px 0 0 11px}
.news .title-bar .more{line-height:23px;float:right;font-weight:700;text-align:center;margin:8px 15px 0 0}
.news .contents{height:353px;border:1px #cdcdcd solid;border-top:0;background-color:#fff;border-bottom-left-radius:10px;border-bottom-right-radius:10px}
.news .contents ul{width: 275px;float: right;margin-right: 7px;padding-top: 4px;}
.news .contents ul li{height:24px;line-height:24px;background:url(../images/line_3.png) bottom repeat-x}
.news .contents ul li a{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

.news .contents .picList{
	width: 262px;
	float: left;
	margin-left: 10px;
	padding: 11px 0;
}
.news .contents .picList .item{
	display: flex;
	align-items: center;
	margin-bottom: 14px;
}
.news .contents .picList .item:last-child{
	margin-bottom: 0;
}
.news .contents .picList .item .pic{
	width: 136px;
	height: 100px;
	border: 1px solid #a38312;
	position: relative;
	box-sizing: border-box;
}
.news .contents .picList .item .pic img{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
}
.news .contents .picList .item .con{
	flex: 1;
	margin-left: 6px;
}
.news .contents .picList .item .con .t{
	font-size: 13px;
	line-height: 18px;
	color: #000;
	height: 54px;
	overflow: hidden;
}
.news .contents .picList .item .con .time{
	font-size: 11px;
    line-height: 13px;
    color: #999;
    padding-left: 13px;
    background-position: left center;
    background-repeat: no-repeat;
    background-image: url('../images/time.png');
}


.layout-b{float:right;width:579px}

/**************************
        Client visit
***************************/
.client-visit{border:1px #cdcdcd solid;margin-top:11px;background-color:#f5f5f5;border-radius:10px;overflow:hidden;padding-bottom: 11px;}
.client-visit .title-bar{height: 36px;
    border-bottom: 1px #cdcdcd solid;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: #efefef url(../images/news_title_bar_bg.png) bottom repeat-x;}
.client-visit .title-bar h2{font-weight:700;float:left;font-size:15px;margin:11px 0 0 11px}
.client-visit .title-bar .more{line-height:23px;float:right;font-weight:700;text-align:center;margin:8px 15px 0 0}
.client-visit .contents ul{
	padding: 11px 0 0 11px;
	zoom: 1;
}
.client-visit .contents ul:after{
	display: block;
    height: 0;
    clear: both;
    /* visibility: hidden; */
    overflow: hidden;
    content: ".";
}
.client-visit .contents li{width:33.3%;float:left;}
.client-visit .contents li:last-child{
	display: none;
}
.client-visit .contents li img{width:173px;height:129px;border:1px #a38312 solid}
.client-visit .contents li span{display:block;font-size:13px;padding:2px 10px 0 0}
.client-visit .contents li .time{
	font-size: 11px;
    line-height: 13px;
    color: #999;
    padding-left: 15px;
    background-position: left center;
    background-repeat: no-repeat;
    background-image: url('../images/time.png');
}
.client-visit .contents .item {
	padding: 0 11px;
	margin-top: 10px;
}
.client-visit .contents .item a{
	width: 50%;
	display: block;
	float: left;
	background: url('../images/line_3.png') bottom repeat-x;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 12px;
    line-height: 24px;
    padding-right: 15px;
    box-sizing: border-box;
}

/**************************
		 Brands
***************************/
.brands{border:1px #cdcdcd solid;height:53px;margin-top:7px;background-color:#f5f5f5;border-radius:10px;overflow:hidden}
.brands ul{padding:0 10px}
.brands li{width:10%;height:53px;float:left;background-position:center;background-repeat:no-repeat;}
.brands .b-01{background-image:url(../images/brand_01.jpg)}
.brands .b-02{background-image:url(../images/brand_02.jpg)}
.brands .b-03{background-image:url(../images/brand_03.jpg)}
.brands .b-04{background-image:url(../images/brand_04.jpg)}
.brands .b-05{background-image:url(../images/brand_05.jpg)}
.brands .b-06{background-image:url(../images/brand_06.jpg)}
.brands .b-07{background-image:url(../images/brand_07.jpg)}
.brands .b-08{background-image:url(../images/brand_08.jpg)}
.brands .b-09{background-image:url(../images/brand_09.jpg)}
.brands .b-10{background-image:url(../images/brand_10.jpg)}

/**************************
        friend link
***************************/
.friend-link{width:1230px;height:106px;margin:8px auto 0;background-color:#e7e6e6;border-radius:10px}
.friend-link ul{padding:8px 10px 0}
.friend-link li{width:11.111%;float:left}
.friend-link li a{display:block;width:119px;height:39px;border:2px #fabe00 solid;margin:0 auto 4px}
.friend-link li a:hover{border-color:#f08e10}

@media only screen and (max-width:960px) {
	.layout-a .best .slider, .layout-a .best a{
		width: 100%;
		/* width: 163px; */
		height: 100%;
		/* height: 98px; */
	}
	#slides, #slides .slides-container, #slides .banner{width: 100vw;box-sizing: border-box; height: 3.2rem;background-size: cover !important;overflow: hidden;background-repeat: no-repeat !important;}
	#slides{border: 0;}
	.mt12{height: 0;}
	.container{height: auto;padding-bottom: 10px;}
	#slides .pagination{left: 0;margin: 0;text-align: center;bottom: 6px;right: 0;}
	.home-wrap{width: auto;height: auto;top: 0;padding: 8px;overflow: hidden;background: transparent;}
	.cases{height: auto;}
	.cases .contents ul{padding:0 10px;display: flex;display: -webkit-flex;flex-wrap: wrap;-webkit-flex-wrap:wrap;justify-content: space-between;-webkit-justify-content: space-between}
	.cases .contents ul li{width: 32%;margin-bottom: 2%;}
	.layout-a,.client-visit .contents ul{display: flex;display: -webkit-flex;flex-wrap: wrap;-webkit-flex-wrap:wrap;justify-content: space-between;-webkit-justify-content: space-between}
	.layout-a .horizontal{width: 49%;}
	.layout-a .video,.layout-a .service{float: none;}
	.layout-a .horizontal .box{width: auto;height: auto;padding-bottom: 9px;margin-top: 9px;}
	.layout-a .horizontal img{width: 100% !important;height: 100% !important;display: block;}
	/* .layout-a .horizontal img{width: 100% !important;height: auto !important;display: block;} */
	.news{float: none;width: auto;}
	.layout-b{float: none;width: auto;}
	.client-visit .contents li{width: 24%;margin-bottom: 2%;}
	.client-visit .contents li img{max-width: 100%;object-fit: cover;}
	.client-visit{height: auto;}
	.brands{height: auto;}
	.friend-link{width: auto;height: auto;padding-bottom: 10px;margin:0 10px 0 10px;}
	.friend-link ul{display: flex;display: -webkit-flex;flex-wrap: wrap;-webkit-flex-wrap:wrap;}
	.friend-link ul li{width: 31.3%;margin: 1%;}
	.friend-link li a{width: auto;height: auto;margin: 0;border-width: 1px;}
	.friend-link li a img{display: block;width: 100%;}
	.cases .contents li img,.client-visit .contents li img{width: 100%;height: auto;}

	.news .contents .picList{
		width: 100%;
		float: none;
		margin-left: 0px;
	}
	.news .contents .picList .item{
		margin-bottom: 10px;
	}
	.news .contents ul{
		width: 100%;
		float: none;
	}
	.news .contents{
		height: auto;
		padding: 0 10px 15px;
	}
	.news .contents .picList .item:nth-child(2){
		margin-bottom: 0;
	}
	.news .contents .picList .item:nth-child(3){
		display: none;
	}
	.news .contents ul li{
		display: none;
	}
	.news .contents ul li:nth-child(-n+5){
		display: block;
	}
	.client-visit .contents .item{
		display: none;
	}


}
@media only screen and (max-width:640px) {
	.cases .contents ul li{width: 48.5%;}
	.cases .contents ul li:nth-child(4n + 1){
		display: none;
	}
	/*.layout-a .horizontal{width: 100%;float: none;}*/
	.client-visit .contents li{width: 48.5%;}
	.brands li{width: 20%;}
	.brands li:last-child{
		display: none;
	}
	.client-visit .contents .item a{
		width: 100%;
	}
	.client-visit .contents li:last-child{
		display: block;
	}
	.client-visit .contents ul{
		padding: 10px 10px 0;
	}
	.client-visit .contents li{
		float: none;
	}
	.client-visit .contents ul:after{
		display: none;
	}
}