@charset "utf-8";



.content{
   margin-top: 140px;
}

.title{ padding: 0; width: 100%; overflow: hidden; border-bottom: 1px solid #f1f1f1;}
.title .left-box{ display: block; padding-top: 10px; color: #888;}
.title a{display: inline-block; color: #666; margin-bottom: 10px; font-size: 12px;}
.title a img{width: 40px; display: inline-block; vertical-align: middle; margin-right: .05rem;}
.title a span{display: inline-block; vertical-align: middle;}
.title a:hover{color: #D3B264;}
.title a.on{color: #D3B264;}



.main{ overflow: hidden; margin: 20px 0; position: relative; min-height: 100vh;}
.side{width: 250px; position: absolute; top: 10px; background-color: #fff; padding: 18px 0;transition: all 0.4s ease-in-out;}
.side.on{position: fixed; top: 80px;}
.side h2{font-size: 18px;}
.side .link{overflow: hidden; margin: 20px 0;}
.side .link a{display: block; box-sizing: border-box; margin: 2% 0; font-size: 14px; height: 30px; line-height: 30px; }
.side .link a.on,
.side .link a:hover{color: #D3B264; }
.side .link2 a{float: none; width: 96%;}

.list-box{margin: 20px -1% 0;}
.list-box.float-right{padding-left: 280px;}
.list-box .list{display: block;	position: relative;	width: 23%;	margin: 0 1%;float: left;top: 0;background: #fff;transition: all 0.4s ease-in-out;margin-bottom: 2%;}
.list-box .list .pic{overflow: hidden; }
.list-box .list .pic img{width: 100%; display: block; transition: all 0.4s ease-in-out; background-size: cover; background-position: center; border: 1px solid #fff;}
.list-box .list:hover{ box-shadow: 0 2px 25px rgba(0,0,0,0.1);}
.list-box .list:hover .pic img{transform: scale(1.05);}
.list-box .list .con{ position: relative; padding: 10px 10px 20px;}
.list-box .list .con h2{font-size: 14px; line-height: 1.4em; margin-bottom: 10px; font-weight: normal; color: #000; text-align: center; transition: all 0.5s ease-in-out; }
.list-box .list:hover .con h2{color: #D3B264;}
.list-box .list .con span{ display: block; font-size: 12px; color: #888; text-align: center;}
.list-box .list .con .price{font-size: 15px; line-height: 1.4em;font-weight:bold; margin: 10px 0; color: #000; text-align: center; transition: all 0.5s ease-in-out; }
.list-box .list .tag{position: absolute; opacity: .8; top: .1rem; right: .1rem; }
.list-box .list .tag span{ opacity: .8; display: inline-block; background-color: #f5f5f5; height: 26px; line-height: 24px; border-radius: 20px; text-align: center; padding: 0 10px; border: 1px solid #eee; color: #000; font-size: 12px; font-weight: bold; margin-left: 5px;}
.list-box .list .tag span.eco{color: rgb(68, 154, 15)}



@media screen and (max-width: 1500px) {

	.title{margin: 50px .5rem 0; padding: 0; width: 100%; overflow: hidden;}	
	.main{ overflow: hidden; margin: 20px .5rem;}
}