/*去除按钮按下时的边框*/

.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
    outline: none;
    box-shadow:none;          
}

p,h1,h2,h3,h4,h5,h6 {
	margin:0;
	padding: 0;

}


.pages{
	overflow: hidden;
	margin:2em 0;
}
.pages ul{float: right;}
.pages ul li{
    float: left;   
    margin:3px;
}
.pages ul li a{
    display: block;
    padding: 5px 12px;
    border:1px #ddd solid;
    text-align: center;    
    border-radius:3px;
    font-size: 14px;
    color:#999;
}
.pages ul li span{
	display: block;
    padding: 5px 12px;
    border:1px #ddd solid;
    text-align: center;    
    border-radius:3px;
    font-size: 14px;
    color:#aaa;
}
.pages ul li.active a,
.pages ul li a:hover{
    color:#fff;
    background: #b2000e;
    border:1px #b2000e solid;
}


*{padding: 0;margin:0;box-sizing: border-box;}
.l{width: 1200px;margin:0 auto;}
.c{clear: both;}
img{border:none;}
a{text-decoration: none;color:#333;}
a:hover{
	color:#b2000e;
	text-decoration: none;
}
ul{list-style-type: none;}
body{
	min-width: 1200px;
	font-size: 14px;
	font-family: "Microsoft YaHei",Arial,sans-serif;    
    line-height:1.42857143;
    color: #333;  

}

header{
	background: #fff;
	height: 150px;
	border-bottom: 1px solid #eee;
}
header .logo{
	width: 344px;
	height: 150px;
	float: left;
}
header .nav{
	width: 810px;
	height: 150px;
	float: right;
	text-align: right;
	
}

header .nav .main{
	display: inline-block;

}

header .main>li{
	padding: 0 30px;
	line-height: 150px;
	float: left;
	position: relative;
	

}

header .main>li>a{
	font-size:18px;
	font-weight:bold;
}


header .nav .sub{
	display:none;
	position:absolute;
	left:0;
	top:100px;	
	background:#fff;
	z-index: 999;	
	border:1px solid #eee;
	border-radius: 3px;	
	box-shadow: 1px 1px 5px 2px rgba(100,100,100,.1);

}

header .nav .sub li{
	width:180px;
	text-align: center;	
	line-height: 1.2em;
	padding: 10px 20px;
	border-bottom: 1px dotted #eee;
}

header .nav .sub li:last-child{
	border-bottom:none;
}



.banner{
	height: 738px;
	position: relative;
	z-index: 1;

}

.about{
	
}

.about .about-title{
	width: 44px;
	height: 204px;
	line-height:44px;
	border:1px solid #cc9900;
	background-image: url(../image/tea.png);
	background-repeat: no-repeat;
	background-position:center 10px;
	font-size:26px;
	writing-mode:vertical-lr;
	padding-top: 50px;
	float: left;
	margin-right: 40px;
	letter-spacing: 4px;
	border-radius: 3px;	

}

.about .desc{

	float: left;
	width: 420px;
}

.about .desc p{
	line-height: 1.5em;
}

.about .desc h3{
	line-height: 2.5em;
}

.about .video{
	float:right;	
	

}



.man{
	

}
.man .man-title{
	padding-left:1em;
	width:204px;
	height:44px;
	line-height:44px;
	border:1px solid #cc9900;
	background-image: url(../image/man.png);
	background-repeat: no-repeat;
	background-position:10px center;
	font-size:26px;	
	text-align: center;
	letter-spacing: 4px;
	border-radius: 3px;		
}
.man h2{
	font-size: 24px;
	line-height: 2.5em;
	margin-bottom: 40px;
}
.man ul{

}

.man li{
	
	margin-bottom:50px;
	overflow: hidden;
}
.man li:last-child{
	
}

.man li .img{
	float: left;
	width: 120px;
	height: 150px;
	border:1px solid #666;
	padding: 2px;
	overflow: hidden;
	border-radius:5px;


}

.man li .img img{
	border-radius:5px;
	width: 114px;
	height: 144px;
}

.man li .desc{
	float: right;
	width: 968px;
}
.man li .desc h3{
	text-align: center;
	line-height:2.5em;
}
.man li .desc p{
	line-height: 2.1em
}


.product{
	
}
.product .product-title{
	padding-left:1em;
	width:204px;
	height:44px;
	line-height:44px;
	border:1px solid #cc9900;
	background-image: url(../image/product.png);
	background-repeat: no-repeat;
	background-position:10px center;
	font-size:26px;	
	text-align: center;
	letter-spacing: 4px;
	border-radius: 3px;	
}
.product h2{
	font-size: 24px;
	line-height: 2.5em;
	margin-bottom: 40px;
}

.product ul.pro{
	
	overflow: hidden;
}

.product ul.pro li{
	float: left;
	width: 280px;	
	margin:10px;
}
.product ul.pro li i{
	display: block;
	width: 280px;
	height: 280px;
	border:1px solid #ddd;
	padding:2px;	
	border-radius: 5px;
	margin-bottom: 10px;
	overflow: hidden;
}
.product ul.pro li .img{
	display: block;
	width: 274px;
	height: 274px;	
	border-radius: 5px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	overflow: hidden;
	

}

.product ul.pro li i:hover{
	border:1px solid #b2000e;
}

.product ul.pro li i img{
	display: none;
}

.product ul.pro li p{
	
	height:40px;
	line-height:20px;
	text-align: center;	
	font-weight: bold;
	overflow: hidden;
	text-overflow: -o-ellipsis-lastline;
	   
	    text-overflow: ellipsis;
	    display: -webkit-box;
	    -webkit-line-clamp: 2;
	    -webkit-box-orient: vertical;
}


.news{
	overflow: hidden;	

}
.news .news-title{
	padding-left:1em;
	width:204px;
	height:44px;
	line-height:44px;
	border:1px solid #cc9900;
	background-image: url(../image/news.png);
	background-repeat: no-repeat;
	background-position:10px center;
	font-size:26px;	
	text-align: center;
	letter-spacing: 4px;
	border-radius: 3px;	
}
.news h2{
	font-size: 24px;
	line-height: 2.5em;
	
}

.news ul{
	float: left;
	width:520px;
	margin:15px 40px;
	overflow: hidden;
}

.news ul h3{
	padding: 1em;
	border-bottom: 1px solid #b2000e;
	margin-bottom:15px;
}

.news ul h3 em{
	float: right;
	font-style: none;
	font-style: normal;
	font-size: 12px;
	color:#999;
	font-style: normal;
}

.news ul h3 span{
	color:#b2000e;
}

.news ul li{
	line-height: 2em;
	border-bottom: 1px dashed #eee;
}

.news ul li span{
	float: right;
	color:#999;
	font-size: 12px;
	display: inline-block;
	padding-left: 20px;

}

.news ul li a{

	display: block;
	text-overflow:ellipsis;    
    white-space: nowrap;
    overflow: hidden;
}
.news ul li a em{
	color:#999;
	font-style: normal;
}


.footer{
	padding:5em 0;
	background: #ebebeb;
	overflow: hidden;
}

.footer .subnav{
	float: left;
	width: 600px;
}

.footer .subnav ul{
	float: left;
	margin:0 20px;
}

.footer .subnav ul h3{
	font-size:16px;
	line-height: 3em;
}
.footer .subnav ul li{
	line-height:1.5em;
}
.footer .subnav ul li a{
	color:#999;
}

.footer .qrcode{
	float: right;
	width: 600px;
	text-align: right;
}

.footer .qrcode ul{
	display: inline-block;
}

.footer .qrcode li{
	float: left;
	margin:0 20px;
}

.footer .qrcode li .img{

	width: 140px;
	height: 140px;
	background: #666;
	border:5px solid #fff;

}

.footer .qrcode li .img img{
	width: 100%;
}

.footer .qrcode li p{
	padding: 1em 0;
	text-align: center;
}

.footer .copyright{
	padding-top: 3em;
}

.footer .copyright p{
	line-height: 2em;
	text-align: center;
	font-size: 12px;
	color:#999;
}

.bg1{
	position: absolute;
	left:0;
	right: 0;	
	width: 100%;	
	height:897px;
	background-image: url(../image/about-bg.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	z-index: -1;

}
.bg2{
	position: absolute;
	left:0;
	right: 0;	
	width: 100%;	
	height: 943px;
	background-image: url(../image/bg2.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	z-index: -1;

}
.bg3{
	position: absolute;
	left:0;
	right: 0;	
	width: 100%;	
	height: 775px;
	background-image: url(../image/bg3.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	z-index: -1;

}


.crumbs-box{

	
}

.crumbs-box .crumbs{	
	margin:30px 0;
	text-align: right;		
}

.crumbs-box .crumbs a{	
	color:#777;
}
.crumbs-box .crumbs a:after{
	content:'>';
	color:#ccc;
	display: inline-block;
	margin:0 .5em;
}

.crumbs-box .crumbs a:last-child:after{
	display: none;
}
.crumbs-box .crumbs span{
	color:#999;
}

.crumbs-box .crumbs .icon{
	width: 16px;
	height: 16px;
	vertical-align: middle;
}


.columns{
	margin-bottom:50px;
}

.columns .l{

	display: flex;	
	flex-wrap: wrap;
	justify-content:flex-end;

}

.columns .l a{


	display: inline-block;
	padding: 5px 20px;
	border:1px solid #b2000e;
	margin:10px;
	border-radius: 3px;
	font-weight: bold;
}

.columns .l a.on,
.columns .l a:hover{
	color:#fff;
	background: #b2000e;
}


.news-list{

}

.news-list .news li a{
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin:20px 0;
	padding-bottom: 20px;
	border-bottom: 1px dashed #eee;
}

.news-list .news li .thumb{
	width: 210px;
	height: 140px;	
	border-radius: 3px;
	overflow: hidden;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	border:1px solid #eee; 
}

.news-list .news li .thumb img{	
	display: none;
}

.news-list .news li .txt{

	width:900px;
}

.news-list .news li .txt h5{

	font-size: 20px;

	overflow: hidden;
	white-space: nowrap;
 	text-overflow: ellipsis;
 	padding: 10px 0;
 	letter-spacing:.1em;
}

.news-list .news li .txt p{
	color:#777;
	font-size: 16px;
	line-height:1.5em;
}

.news-list .news li span{
	display: block;
	text-align:right;
	color:#aaa;
}

.article{

}
.article h2{
	letter-spacing: .1em;
	line-height: 1.5em;
	margin-bottom:30px;
	text-align: center;
}

.article .date{
	font-size: 12px;
	color:#999;
	text-align: right;
	margin-bottom: 50px;

}

.article .content{
	line-height: 1.8em !important;
}

.article .content img{

	max-width: 100% !important;
	padding:20px 0;	
}

.article .link{

	display: flex;
	justify-content: space-between;
	
}

.article .link span{
	display: block;
	max-width:40%;
	display: flex;

}
.article .link span a{
	color:#666;
	flex: 1;
}
.article .link span i{
	width:4em;
	display: inline-block;
	font-style: normal;
	font-weight: bold;
	color:#666;
}
.article .link a:hover{
	color:#b2000e;
}

.pub-products h3{
	color:#b2000e;
	margin-bottom:20px;
	font-size: 20px;
	padding-bottom:10px;
	border-bottom: 1px solid #eee;
}
.pub-products h3 span{
	display: inline-block;
	margin-left: 10px;
	font-size: 18px;
	color:#999;
}

.pub-products h3 i{
	font-size: 16px;
	color:#999;
}

.product-box{

	display: flex;
	justify-content:space-around;
	align-items: center;
}

.product-box .info{

	width: 600px;
} 

.product-box .info li{
	display: flex;

}

.product-box .info li span{
	flex-shrink: 0;
	width: 8em;
	color:#888;
}