body {
    max-width: 640px;
    min-width: 320px;
    margin: 0 auto;
    font: normal 14px/1.5 Tahoma, "Lucida Grande", Verdana, "Microsoft Yahei", STXihei, hei;
    color: #333;
    overflow-x: hidden;
    -webkit-tap-highlight-color: transparent;
    padding-bottom: 25px;
}
html {
    font-size: 14px;
}
div,li {
    box-sizing: border-box;
}
ul,li,p{
    list-style: none;
    margin: 0;
    padding: 0;
}
a,a:hover{
    color:#333;
    text-decoration:none;
}
.clearfix:after{/*清除元素浮动*/
    clear: both;/*清除两侧浮动*/
    content: "";/*添加内容为空*/
    display: block;/*转换元素类型为块元素*/
    height: 0;/*强制设置高度为0*/
    overflow: hidden;/*溢出隐藏属性*/
    visibility: hidden;/*设置元素的属性为隐藏*/
}

.single-line{/*单行文本溢出显示省略号*/
    overflow: hidden;/*超出限定的宽高就隐藏内容*/
    white-space: nowrap;/*设置文字在一行显示不换行*/
    text-overflow: ellipsis;/*溢出时显示省略号代表文本*/
}

.multi-line{/*多行文本溢出显示省略号*/
    /*溢出隐藏属性*/
    overflow: hidden;
    /*溢出时显示省略号代表文本*/
    text-overflow: ellipsis;
    /*和text-overflow结合使用，将对象作为弹性伸缩盒子模型显示*/
    display: -webkit-box;
    /*和text-overflow结合使用，设置或检索伸缩盒子对象的子元素排列方式*/
    -webkit-box-orient: vertical;
    /*超过3行隐藏，不规范的属性与上面三个属性结合使用*/
    -webkit-line-clamp:3;
    /*项目垂直顺序排列*/
    flex-direction: column;
}
.logo{
    display: flex;
    width: 100%;
    padding: 0.5rem 0.5rem 0.2rem 0.5rem;
    justify-content:space-between;
    border-top: 5px solid #d50b1c;
    border-bottom: 1px solid #eee;
}
.logo img{
    width: 80%;    
    height: 100%;/*解决图片纵向拉伸问题1*/
    flex-shrink: 0;/*解决图片纵向拉伸问题2*/
}
.menu{
    width: 100%;
    background-color: #d50b1c;
}
.menu ul{
    display: flex;
}
.menu ul li{
    flex: 1;
    text-align: center;
    border-right: 1px solid #fff;

}
.menu ul li a{
    display: block;
    color: #ffffff;
    font-size: 1.2rem;
    padding: 0.8rem 0;
}
.banner{
    width: 100%;
    height: auto;
}
.banner img{
    width: 100%;
}
.goods{
    margin: 0 10px;
}
.title-index{
    display: flex;
    padding: 1rem 0 0 0;
}
.title-index span{
    flex: 1;
}
.title-index span:nth-child(1){
    background: url(../images/title-bg-left.png) no-repeat right center;
}
.title-index span:nth-child(2){
    font-size: 1.8rem;
    font-weight: bold;
    text-align: center;
    color: #d50b1c;
}
.title-index span:nth-child(3){
    background: url(../images/title-bg-right.png) no-repeat left center;
}
.goods-list{
	display: flex;
	flex-wrap: wrap;
	flex-flow: row wrap;
	align-content: flex-start;
}
.goods-list li{
    flex: 50%;
    margin-bottom: 0.5rem;

}
.goods-list li:nth-child(2n){
    border-left: 10px solid #fff;
}
.goods-list li:nth-child(2n-1){
    border-right: 10px solid #fff;
}
.goods-list li img{
    width: 100%;
    display: block;
}
.goods-list li a:nth-last-child(1){
    display: block;
    text-align: center;
    padding: 0.5rem 0;
}
.btn-more{
    display: block;
    color: #fff;
    text-align: center;
    font-size: 1.2rem;
    padding: 0.5rem 0;
    background-color: #d50b1c;
    border-radius: 15px;
}
.btn-more:hover{
    color: #fff;
}
.news{
    margin: 0 10px;
}
.news-hot{
    display: flex;
    flex-direction: column;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}
.news-hot img{
    width: 100%;
}
.news-hot a{
    font-size: 1.2rem;
    padding: 0.5rem 0;
    font-weight: bold;
}
.news-list li{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
    margin-bottom: 10px;
    overflow: hidden;
}
.news-thumb{
    flex: 30%;
}
.news-thumb img{
    width: 100%;
    display: block;
}
.news-cn{
    flex: 70%;
    border-left: 10px solid #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.news-cn a{
    font-size: 1.2rem;
}
.news-cn span{
    color: #999;
}
/* 详细页面样式 */
.path{
    color: #b2b2b2;
    padding: 5px 0;
    border-bottom: 1px dotted #eee;
    margin: 10px;
}
.path a{
    margin-right: 10px;
    color: #b2b2b2;
}
.detailed{
    display: flex;
    flex-direction: column;
    margin:0 10px;
}
.detailed-title{
    font-size: 1.5rem;
    font-weight: bold;
}
.detailed-info{
    margin: 0.2rem 0 1rem 0;
}
.detailed-info span{
    margin-right: 10px;
    color: #b2b2b2;
}
.detailed-info span:nth-child(1){
    padding:3px 5px 1px 5px;
    background-color: #eee;
}
.detailed-info span:nth-child(2){
    color:#596c8d;
}
.detailed-con{
    font-size: 1.2rem;
	overflow:hidden;
}
.detailed-con p{
    display: block;
    margin-before: 0px !important;
    margin-after: 0px !important;
    -webkit-margin-before: 0px !important;
    -webkit-margin-after: 0px !important;
    -webkit-margin-start: 0px !important;
    -webkit-margin-end: 0px !important;
	content:"";
}
.detailed-con img{
	max-width:100%;
}
.detailed-page{
    display: flex;
    flex-direction: column;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    padding: 5px 0;
    margin: 1rem 0;
}
.detailed-page span:nth-child(1){
    margin-bottom: 5px;
}
.detailed-hot{
    
}