/* list */
.list li {
	border-bottom: 1px solid #eee;
	padding: .25rem 0;
}
.list .img {
	float: left;
	border-radius: .04rem;
	margin-right: .32rem;
	overflow: hidden;
}
.list .img img {
	border-radius: .04rem;
}
.list .detail {
	float: left;
	padding: 0
}
.list h1 {
	line-height: .38rem;
	font-size: .2rem;
	font-weight: bold;
	color: #000;
}
.list li h1:hover,
.list a li:hover h1 {
	text-decoration: underline;
	color: #C71608;
}
.list p {
	margin-top: .24rem;
	line-height: .24rem;
	font-size: .14rem;
	color: #999;
}
.list .tag {
	margin-top: .08rem;
}
.list .tag .item {
	height: .2rem;
	border: 1px solid #A58C4F;
	padding: 0 .06rem;
	margin-right: .12rem;
	line-height: .22rem;
	font-size: .13rem;
	color: #A58C4F;
}

@media screen and (max-width: 750px) {
	.list {
		margin: 0 .2rem;
	}
	.list li {
		padding: .3rem 0;
	}
	.list .img {
		float: left;
		border-radius: .04rem;
		margin-right: .32rem;
		overflow: hidden;
	}
	.list .img img {
		border-radius: .04rem;
	}
	.list .detail {
		float: left;
	}
	.list h1 {
		overflow: initial;
		line-height: .48rem;
		font-size: .32rem;
		white-space: initial;
	}
	.list p {
		display: none;
	}
	.list .tag {
		margin-top: .2rem;
	}
	.list .tag .item {
		height: .4rem;
		margin-right: .2rem;
		line-height: .46rem;
		font-size: .26rem;
		white-space: nowrap;
	}
}
/* end list */

/* detail */
.detail {
	width: 11rem;
	padding-bottom: .8rem;
	margin: 0 auto;
}
.detail .title {
    border-bottom: 1px solid #ddd;
    margin: .5rem 0;
}
.detail .title h1 {
    line-height: .44rem;
    font-size: .28rem;
	text-align: center;
}
.detail .title p {
	float: left;
    margin-top: .1rem;
	line-height: .54rem;
    font-size: .13rem;
    color: #ACA696;
}
.detail .title p:nth-child(2) {
	float: right;
}

.detail-tag .item {
	height: .3rem;
	border: 1px solid #E0DDD5;
	padding: 0 .15rem;
	margin-right: .12rem;
	line-height: .3rem;
	font-size: .13rem;
	color: #666;
	background: #FAF9F7;
}
.detail-tag .item:hover {
	border-color: #C71608;
	color: #fff;
	background: #C71608;
}

.detail-recommend {
	margin-top: .26rem;
}
.detail-recommend dt {
	line-height: .58rem;
	font-size: .2rem;
	font-weight: bold;
}
.detail-recommend li {
	float: left;
	width: 2.65rem;
	margin-left: .13rem;
	background-size: cover;
	background-position: center;
}
@media screen and (min-width: 751px) {
	.detail-recommend a:nth-child(4n+1) li {
		margin-left: 0;
	}
}
.detail-recommend li .img {
	height: 1.5rem;
	background-size: cover;
	background-position: center;
}
.detail-recommend li .name {
	border: 1px solid #ddd;
	padding: .05rem .1rem .1rem;
}
.detail-recommend li p {
	height: .48rem;
	line-height: .24rem;
	font-size: .15rem;
	color: #444;
}
.detail-recommend li:hover p {
	text-decoration: underline;
	color: #000;
}

@media screen and (max-width: 750px) {
	.detail {
		width: auto;
		margin: 0 .2rem;
	}
	.detail .title {
		margin: .7rem 0 .4rem;
	}
	.detail .title h1 {
		line-height: .6rem;
		font-size: .4rem;
	}
	.detail .title p {
		margin-top: .6rem;
		line-height: .64rem;
		font-size: .24rem;
	}

	.detail-tag .item {
		height: .5rem;
		margin-right: .2rem;
		line-height: .56rem;
		font-size: .26rem;
	}

	.detail-recommend dt {
		line-height: .8rem;
		font-size: .36rem;
	}
	.detail-recommend ul {
		float: left;
		white-space: nowrap;
	}
	.detail-recommend li {
		display: inline-block;
		float: none;
		width: 3rem;
		margin-left: .2rem;
	}
	.detail-recommend a:nth-child(1) li {
		margin-left: 0;
	}
	.detail-recommend li .img {
		height: 1.69rem;
		font-size: 0;
	}
	.detail-recommend li .name {
		padding: .1rem .2rem;
	}
	.detail-recommend li p {
		height: .88rem;
		line-height: .44rem;
		font-size: .28rem;
	}
}
/* end detail */