/***********************
--list.css/列表样式
 **********************/
.main-nav {
	line-height:.3rem;
	margin-top:.15rem;
	margin-bottom:.2rem;
	font-size:.13rem
}
.main-nav .result {
	margin-left:.05rem;
	line-height:.25rem;
	vertical-align:middle
}
.main-nav>a,.main-nav .filter-tags>a {
	position:relative;
	display:inline-block;
	vertical-align:middle;
	margin-left:.3rem;
	line-height:.25rem;
	font-size:.13rem
}
.main-nav>a:before,.main-nav .filter-tags>a:before {
	content:'>';
	position:absolute;
	top:.04rem;
	left:-.25rem;
	display:block;
	text-align:center;
	width:.2rem;
	line-height:.17rem;
	color:#627381;
	font-size:.12rem;
	font-family:monospace
}
.main-nav>a.else,.main-nav>a.back,.main-nav .filter-tags>a.else,.main-nav .filter-tags>a.back {
	margin-left:0;
	line-height:normal
}
.main-nav>a.else:before,.main-nav>a.back:before,.main-nav .filter-tags>a.else:before,.main-nav .filter-tags>a.back:before {
	content:'';
	width:0
}
.main-nav>a.back,.main-nav .filter-tags>a.back {
	float:right;
	height:.3rem;
	line-height:.28rem;
	padding:0 .25rem;
	font-size:.12rem;
	color:#708aa3;
	background:#202c3a;
	border:solid 1px #2a394c;
	border-radius:.14rem
}
.main-nav .filter-tags>a:not(:first-child) {
	margin-left:.1rem
}
.main-nav .filter-tags>a:not(:first-child):before {
	content:''
}
.main-nav .search-keyword,.main-nav .filter-keyword {
	padding:0 .05rem;
	background:#529fc9;
	color:#cffaff;
	font-size:.13rem;
	border-radius:.02rem
}
.main-nav .search-keyword span,.main-nav .filter-keyword span {
	vertical-align:middle;
	color:#fff
}
.main-nav .search-keyword i,.main-nav .filter-keyword i {
	margin-left:.05rem;
	vertical-align:middle
}
.sec-nav {
	position:relative;
	margin-top:.2rem;
	font-size:0;
	white-space:nowrap;
	overflow-y:hidden;
	overflow-x:auto;
	border-radius: .15rem .15rem 0 0;
}
.sec-nav:after {
	position: absolute;
    top: 100%;
    right: 0rem;
    left: 0rem;
    height: 1px;
    background-color: #eee;
    content: "";
    z-index: 2;
}
.sec-nav>li {
	position:relative;
	display:inline-block;
	height:100%;
	min-width:.8rem;
	vertical-align:top;
	text-align:center;
	font-size:.12rem;
	cursor:pointer;
	background-color: rgba(10, 17, 61, .6);
}
.sec-nav>li a {
	display:block;
	width:100%;
	height:100%
}
.sec-nav>li p {
	color:#67c1f5;
}
.sec-nav>li i {
	display:inline-block;
	margin-top:.04rem;
	width:.38rem;
	height:.38rem;
	opacity:.5
}
.sec-nav>li:first-child {
	border-top-left-radius:.06rem
}
.sec-nav>li:last-child {
	border:0;
	border-top-right-radius:.06rem
}
.sec-nav>li ul {
	position:absolute;
	display:none;
	top:100%;
	left:auto;
	right:0;
	width:3rem;
	padding:.1rem .15rem;
	margin-top:0px;
	background:#34343e;
	border-top: 3px solid #f4604b;
	white-space:normal;
	text-align:left;
	z-index:5;
}
.sec-nav>li ul li {
	display:inline-block;
	width:1.2rem;
	height:.35rem;
	line-height:.36rem;
	margin:0 .06rem .05rem;
	text-align:center;
	color:#8f98a0;
}
.sec-nav>li ul li:nth-of-type(1),.sec-nav>li ul li:nth-of-type(2) {
	border:0
}
.sec-nav>li ul li.on {
	color:#67c1f5
}
.sec-nav>li:nth-of-type(1) ul,.sec-nav>li:nth-of-type(2) ul {
	left:0;
	right:auto
}
.sec-nav>li:hover {
	color: #feffff;
    background-color: #549ecb;
}

.sec-nav>li:hover ul {
	display:block
}
.sec-nav>li.on {
	background:#549ecb
}
.sec-nav>li.on p {
	color:#fff
}
.sec-nav>li.on i {
	opacity:1
}
.sec-nav>li.others {
	position:static
}
.filter-nav {
	padding:.08rem;
	background-color: rgba(10, 17, 61, .6);
	border-radius: 0 0 .15rem .15rem; 
	border-top:1px solid rgba(103, 193, 245, .6);

}
.filter-nav>li {
	display:inline-block;
	margin:.02rem .04rem;
	vertical-align:middle
}
.filter-nav>li.dropmenu {
	max-width:.9rem;
	height:.32rem;
	color:#a3d6f3
}
.filter-nav>li.dropmenu .drop-title input,.filter-nav>li.dropmenu .drop-title input::-webkit-input-placeholder {
	color:#67c1f5;
}
.filter-nav>li.dropmenu .drop-title .edge {
	display:inline-block;
	width:0;
	height:0;
	border:.05rem solid transparent;
	overflow:hidden;
	margin-top:-.025rem;
	border-top-color:#67c1f5;
}
.filter-nav>li.dropmenu .drop-menu dd {
	line-height:.32rem
}
.filter-nav>li.dropmenu.active .drop-title .edge {
	margin-top:-.075rem
}
.filter-nav>li.dropmenu .drop-title {
	border-radius: .16rem;
    background-color: rgba(0,0,0,.6);
}
.filter-nav>li.check-box {
	display:inline-block;
	height:.36rem;
	line-height:.36rem;
	margin-left:.02rem;
	margin-right:.1rem;
	font-size:.12rem;
	color:#a3d6f3;
	vertical-align:middle
}
.filter-nav>li.check-box span,.filter-nav>li.check-box label {
	vertical-align:middle;
	line-height:normal;
	cursor:pointer
}
.filter-nav>li.search {
	position:relative;
	width:2rem;
	line-height:.3rem;
	border:solid 1px #2d3b4c;
	background:#17212d;
	white-space:nowrap
}
.filter-nav>li.search input {
	width:100%;
	padding:.05rem .1rem;
	color:#fff
}
.filter-nav>li.search button {
	height:100%;
	position:absolute;
	right:0;
	top:0;
	padding:0 .05rem;
	background:#2d3b4c;
	line-height:1
}
.filter-nav>li.search button i {
	margin:0 .05rem
}
.filter-nav>li.explain {
	line-height:.32rem
}
.filter-nav>li.explain>span {
	color:#67c1f5
}
@media only screen and (min-width:768px) {
	.nav .sec-nav {
	overflow:visible !important
}
.nav .sec-nav li.others {
	position:relative
}
.filter-nav span {
	margin-left:.1rem
}
}.section-tit {
	padding:.2rem 0;
	color:#fff;
	font-size:.18rem
}
.list {

}
.list .nav .sec-nav>li {
	width:10%
}
.pubg .nav .sec-nav>li {
	width:10%
}
.h1z1 .nav .sec-nav>li {
	width:10%
}
.nav .main-nav .appid {
	max-width:1.2rem;
	height:.3rem;
	color:#d2f86c
}
.nav .main-nav .appid .drop-title input,.nav .main-nav .appid .drop-title input::-webkit-input-placeholder {
	color:#d2f86c
}
.nav .main-nav .appid .drop-title .edge {
	display:inline-block;
	width:0;
	height:0;
	border:.05rem solid transparent;
	overflow:hidden;
	margin-top:-.025rem;
	border-top-color:#d2f86c
}
.nav .main-nav .appid .drop-menu dd {
	line-height:.3rem
}
.nav .main-nav .appid.active .drop-title .edge {
	margin-top:-.075rem
}
.nav .main-nav .appid .drop-title {
	background-color:#5c7e10
}
.nav .main-nav .appid .drop-menu {
	background-color:#21252f;
	color:#c5c3c2
}
.nav .main-nav .appid .drop-menu dd i {
	margin-right:.05rem
}
.nav .sec-nav p {
	height:.26rem;
	line-height:normal
}
.nav .dota2-mainfilter {
	padding:0 .1rem;
	background:rgba(25,36,50,.9);
	border-bottom:solid 1px #549ecb;
	font-size:0;
	white-space:nowrap
}
.nav .dota2-mainfilter>li {
	display:inline-block;
	vertical-align:top;
	cursor:default
}
.nav .dota2-mainfilter>li h4 {
	height:.2rem;
	margin:.13rem 0;
	font-size:.12rem;
	white-space:nowrap
}
.nav .dota2-mainfilter>li h4 span {
	font-size:.14rem;
	vertical-align:middle
}
.nav .dota2-mainfilter>li h4 i:first-child {
	margin-right:.05rem
}
.nav .dota2-mainfilter>li h4 i:last-child {
	margin-top:.1rem;
	opacity:.2
}
.nav .dota2-mainfilter>li .content {
	position:relative
}
.nav .dota2-mainfilter>li .content .heros-list,.nav .dota2-mainfilter>li .content .cate-list {
	position:static;
	top:0;
	z-index:1;
	font-size:0
}
.nav .dota2-mainfilter>li .content .heros-list li,.nav .dota2-mainfilter>li .content .cate-list li {
	font-size:.12rem
}
.nav .dota2-mainfilter>li .content .heros-list li a,.nav .dota2-mainfilter>li .content .heros-list li img,.nav .dota2-mainfilter>li .content .cate-list li a,.nav .dota2-mainfilter>li .content .cate-list li img {
	display:block;
	width:100%;
	height:100%
}
.nav .dota2-mainfilter>li .content .heros-list {
	display:none;
	width:3.8rem;
	max-width:300%;
	padding:.03rem;
	background:#2d3b4c;
	white-space:normal
}
.nav .dota2-mainfilter>li .content .heros-list li {
	display:inline-block;
	width:calc(20% - .02rem);
	margin:.01rem
}
.nav .dota2-mainfilter>li .content .heros-list li a {
	opacity:.5;
	border:solid 1px transparent
}
.nav .dota2-mainfilter>li .content .heros-list li a:hover,.nav .dota2-mainfilter>li .content .heros-list li a.on {
	opacity:1;
	border-color:#549ecb
}
.nav .dota2-mainfilter>li .content .cate-list {
	left:0;
	display:block;
	width:100%;
	white-space:normal;
	overflow:hidden
}
.nav .dota2-mainfilter>li .content .cate-list li {
	display:inline-block;
	width:calc((100% - .24rem)/4);
	margin-right:.08rem;
	margin-bottom:.05rem
}
.nav .dota2-mainfilter>li .content .cate-list li:nth-child(4n) {
	margin-right:0
}
.nav .dota2-mainfilter>li .content .cate-list li a {
	padding:.08rem 0;
	border-radius:.02rem;
	text-align:center;
	background:#2d3b4c;
	color:rgba(255,255,255,.5);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis
}
.nav .dota2-mainfilter>li .content .cate-list li a:hover,.nav .dota2-mainfilter>li .content .cate-list li a.on {
	color:#fff;
	background:#549ecb
}
.nav .dota2-mainfilter>li:nth-of-type(1) .content .heros-list {
	left:0
}
.nav .dota2-mainfilter>li:nth-of-type(2) {
	margin:0 .2rem
}
.nav .dota2-mainfilter>li:nth-of-type(2) .content .heros-list {
	left:50%;
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	transform:translateX(-50%)
}
.nav .dota2-mainfilter>li:nth-of-type(3) .content .heros-list {
	right:0
}
.nav .dota2-mainfilter>li.heros {
	width:calc((100% - .4rem)/3)
}
.nav .dota2-mainfilter>li.heros .content {
	background:no-repeat left top / cover
}
.nav .dota2-mainfilter>li.types {
	position:relative;
	display:none;
	width:calc(42.78% - .2rem);
	margin-left:.4rem
}
.nav .dota2-mainfilter>li.types:before {
	content:'';
	position:absolute;
	left:-.18rem;
	top:.46rem;
	display:block;
	height:.73rem;
	border-left:dashed .01rem rgba(255,255,255,.1);
	pointer-events:none
}
.nav .dota2-mainfilter>li.types h4,.nav .dota2-mainfilter>li.types .cate-list {
	padding:0 .05rem
}
.nav .dota2-mainfilter>li:hover h4 i:last-child {
	opacity:1
}
.nav .dota2-mainfilter>li:hover .content ul {
	position:absolute;
	display:block
}
.nav .dota2-mainfilter>li:hover .content ul.heros-list {
	border:solid 1px #111a25
}
.nav .dota2-mainfilter>li:hover .content ul.cate-list {
	background:#192432
}
@media only screen and (min-width:768px) {
	.nav .dota2-mainfilter>li.heros {
	width:calc(19.06% - .2rem)
}
.nav .dota2-mainfilter>li.types {
	display:inline-block
}
.nav .dota2-mainfilter>li .content {
	height:.73rem;
	margin-bottom:.24rem;
	overflow:hidden
}
.nav .dota2-mainfilter>li:hover .content {
	overflow:visible
}
.nav .dota2-mainfilter>li:hover .content ul {
	left:0 !important;
	right:auto !important;
	-webkit-transform:none !important;
	-moz-transform:none !important;
	-ms-transform:none !important;
	-o-transform:none !important;
	transform:none !important
}
}.filter-nav {
	position:relative;
	margin-bottom:.2rem
}
.filter-nav.special {
	border-radius:0;
	background:none;
	border-bottom:solid 1px rgba(255,255,255,.1)
}
.filter-nav.special .tab-head {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	margin:0
}
.filter-nav.special .tab-head a {
	display:inline-block;
	margin:0 .3rem;
	padding:0 .2rem;
	line-height:.52rem;
	font-size:.14rem;
	color:#7b92a4;
	border-bottom:solid 1px transparent
}
.filter-nav.special .tab-head a:first-child {
	border-top-left-radius:.06rem;
	border-bottom-left-radius:.06rem
}
.filter-nav.special .tab-head a:hover {
	color:#67c1f5
}
.filter-nav.special .tab-head a.on {
	color:#67c1f5;
	border-radius:0;
	border-bottom-color:#67c1f5
}
.items-list {
	text-align:left;
	overflow: hidden;
}
.items-list li {
	margin-bottom:2%;
}
@media only screen and (min-width:768px) {
	.items-list {
		overflow: visible;
	}	
	.items-list li {
	margin-bottom:4%
	}
}
@media only screen and (min-width:980px) {
	.items-list {
		overflow: visible;
	}	
	.items-list li {
	margin-bottom:4%;
	}
}

@media only screen and (min-width:1200px) {
	.items-list {
	width:100%;
	overflow: visible;
}
.items-list li {
	width:2.24rem;
	margin-bottom:.2rem
}
.items-list li .items-item {
	/*height: 2.74rem;*/
	min-height:auto;
}

.container .main-content {
	width:100%;
}
.container .related {
	width:2.24rem
}
.container .related>div .list-content {
	background:#FFF;
}
.container .related>div .list-content li .items-img {
	width:.6rem;
	height:.6rem;
	line-height:.58rem;
	margin-right:.05rem;
	background: #182330;
    border-color: rgba(250,250,250,.05);
    border-radius: .02rem;
}
.container .related>div .list-content li .sell-info .tit {
	font-size:.12rem;
	white-space:normal;
	word-break:break-all
}
}

.items-info {
  background-color: rgba(255, 255, 255, 1);
  border-radius: 5px;
  display: flex;
  display: -webkit-flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  padding: 0.3rem;
}
.items-img {
  width: 50%;
  padding: 0;
}

.photos {
  width: 100%;

}
.photos-thumb { 
  float: right; 
  width: 23%;
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  padding: 0 .1rem 0 .3rem;
}
.photos,  .photos-thumb {
  zoom: 1;
}
.photos-thumb {
  list-style-type: none;
}
.photos-thumb li {
  float: left;
  border: 2px solid #f2f2f2;
  padding: 2px;
  margin-bottom: 8px;
  position: relative;
  transition: border-color .2s ease-out;
}
.photos-thumb .current {
  border: 2px solid #f23d6a;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -o-border-radius: 2px;
  cursor: auto;
}

.photos-arrow {
  width: 0;
  height: 0;
  line-height: 0;
  font-size: 0;
  border: 6px dashed transparent;
  border-right: 6px solid #f23d6a;
  position: absolute;
  left: -16px;
  filter: alpha(opacity=0);
  opacity: 0;
  bottom: 35%;
  background: 0 0;
}
.current .photos-arrow {
  filter: alpha(opacity=100);
  opacity: 1;
}
.photos-thumb img {
  display: block;
  width: 100%;
  cursor: url(../images/bigmax.png), url(../images/zoom_in.cur), auto;
}
.photo-viewer, .photo-viewer img,  .photos-thumb .current img {
  cursor: url(../images/bigmin.png), url(../images/zoom_out.cur), auto;
}

.photo-viewer {
  width: 77% !important;
  height: 100% !important;
  position: relative;
  height: auto;
  border: 1px solid #ccc;
  background: #fff;
  padding: 2px;
  overflow: hidden;
  display: none;
  transition: all 0.2s ease-in;
}
.img-nonstop {
  position: absolute;
  padding-top: 48%;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  z-index: 2;
  display: none;
  text-align: center;
  overflow: hidden;
}
.photo-viewer:hover .img-nonstop {
  display: block;
  background-color: rgba(0, 0, 0, .5);
}
.img-nonstop .non-stop {
  padding: 15px 50px;
  font-size: 16px;
  color: rgba(255, 255, 255, 1);
  background-color: rgba(250, 68, 68, .8);
  /* background-image: linear-gradient(to right, rgba(255, 94, 82, 1), rgba(250, 68, 68, .8)); */
  /* background-image: linear-gradient(to right, rgba(241, 198, 122, 1), rgba(228, 178, 98, .65)); */
  /* background-color: rgba(241, 198, 122, 1); */
  /* background-color: rgba(251, 94, 94, 1); */
  border-radius: 50px;
}
.img-nonstop .non-stop:hover {
  background-color: rgba(250, 68, 68, 1);
    -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
.photo-viewer img {
  width: 100%;
}
.photo-viewer-navleft,  .photo-viewer-navright {
  top: 0;
  bottom: 0;
  position: absolute;
  width: 30%;
  background: url(../images/s.gif); /*解决IE 下背景透明的空白元素无法触发 click 和 hover 事件*/
}
.photo-viewer-navleft {
  left: 0;
}
.photo-viewer-navright {
  right: 0;
}
.photo-viewer-navleft i,  .photo-viewer-navright i{
  top: 50%;
  margin-top:-24px;
  position: absolute;
  width: 48px;
  height: 48px;
  display: none;
}
.photo-viewer-navleft i{
  left: 0;
  background-image: url(../images/arrow-l.png);
}
.photo-viewer-navright i{
  right: 0;
  background-image: url(../images/arrow-r.png);
}
.items-text {
  width: 50%;
  padding: 0px 0px .4rem .15rem;
}
.items-title {
  margin: 0px;
  color: #111;
}
.items-title h2{
  margin: 0;
  line-height: 30px;
  font-size: 24px;
}
.items-title .tag {
  margin-left: 10px;
  display: inline;
  vertical-align: middle;
  padding: 2px 8px;
  border-radius: 15px;
  font-size: 16px;
  color: #fb5e5e;
  border: 1px solid #fb5e5e;
}
.items-des {
  padding: 20px 0px;
  line-height: 26px;
  min-height: 40px;
  color: #111;
  opacity: .8;
  font-size: .14rem;
}
.items-price {
  border-top: 1px solid #f1f1f1;
  border-bottom: 1px solid #f1f1f1;
  padding: 20px 0;
  margin-bottom: 65px;
  
}
.items-price .price{
  font-size: 30px;
  font-family: Georgia, "Times New Roman", Times, serif;
  color: #fb5e5e;
}
.price em {
  font-size: 18px;
  font-family: Arial, Helvetica, sans-serif;
  font-style: normal;
}
.items-price .buy-help {
  float: right;
}
.buy-help a {
  font-size: 16px;
  color: rgba(239, 62, 152, .7);
}
.buy-help a:hover, .buy-help a:focus, .buy-help a:active {
  color: rgba(255, 0, 0, .8);
}
.buy-help a i{
  vertical-align: top;
  font-size: 20px;
}
.items-link {
  text-align: center; 
}
.items-link .non-stop {
  padding: 15px 50px;
  font-size: 16px;
  color: rgba(255, 255, 255, 1);
  background-color: rgba(250, 68, 68, .8);
  /*background-image: linear-gradient(to right, rgba(255, 94, 82, 1), rgba(250, 68, 68, .8));*/
  /*background-image: linear-gradient(to right, rgba(241, 198, 122, 1), rgba(228, 178, 98, .65));*/
  /*background-color: rgba(241, 198, 122, 1);*/
  /*background-color: rgba(251, 94, 94, 1);*/
  border-radius: 50px;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
.items-link .non-stop:hover {
  background-color: rgba(250, 68, 68, 1);
  /*background-color: rgba(250, 68, 68, 1);*/
}
.items-link .likes {
  display: inline-block;
  position: relative;
  margin-left: 10px;
  padding: 10px 30px;
  font-size: 16px;
  color: rgba(194, 194, 194, 1);
  background-color: transparent;
  border-radius: 50px; 
  border: 2px solid rgba(236, 236, 236, 1);
  width: 200px;
}
.likes i{
  vertical-align: top;
  font-size: 20px;
  margin-top: -1px;
}
.likes:hover {
  color: rgba(255, 255, 255, 1);
  background-color: rgba(250, 68, 68, 1);
  border: 2px solid rgba(250, 68, 68, 1);
}
.likes .heart {
  display: inline;
  left: 14px;
  top: -8px;
}
.items-share {
  
}
/*猜你喜欢*/
.box {
    display: flex;
    display: -webkit-flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    justify-content: space-between;
     
}
.like-wrap {
  margin:30px auto 0 auto;
}
.content-slide ul li {
  width: 23.5%;
}
.content-slide ul li:hover {
  box-shadow: none;
}
.content-slide .listpage {
  padding: .2rem;
}
.listpage li img {
	width: 100%;
	border-radius: .1rem .1rem 0 0;
}
.tabs {
  height: 50px;
  background-color: rgba(255, 255, 255, 1);
  width: 100%;
  text-align: center;
  border-radius: .15rem .15rem 0 0;
}

.tabs .part {
  display: block;
  float: left;
  width: 33.333333%;
  text-align: center;
  height: 50px;
}


.tabs a {
  width: 100%;
  display: block;
  height: 50px;
  line-height: 50px;
  color: #5f6368;
  text-align: center;
  margin: 0 auto;
  font-size: 16px;
  text-decoration: none;
}
.tabs span.active {
  background-image: linear-gradient(to right, rgba(255, 94, 82, 1), rgba(250, 68, 68, .8));
  /*background-image: linear-gradient(to right, rgba(241, 198, 122, 1), rgba(228, 178, 98, .65));*/
  /*background-color: #f1c67a;*/
  /*background-color: rgba(250, 68, 68, 1);*/
  border-radius: 5px 5px 0px 0px;
}

.tabs span.active a {
  color: #fff;
}

.swiper-container {
  width: 100%;
  border-top: 0;
}

.like-wrap .swiper-slide {
  width: 100%;
  background: rgba(255, 255, 255, 1);
  color: #ccc;
  border-radius: 0px 0px 5px 5px;
}
/*_____items                       
---------------------------------*/
.page-likes {
  overflow: hidden;
}

.listpage {  
  list-style: none;
  border-radius: 0px 0px 5px 5px;
}

.listpage li {
  width: 25%;
  float: left;
  position: relative;
  margin-bottom: 15px;
  border-radius: 0px;
  background-color: #FFF;
  overflow: hidden;
}
.listpage li:hover {
  /*box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);*/

}
.listpage li img {
  position: relative;
  opacity: .8;
  width: 100%;
  display: block;
  border-radius: .06rem;
  box-sizing: border-box;
  overflow: hidden;
}

.listpage li:hover img {
  transform: scale(1.2);
  opacity: 1;
  overflow: hidden;
}

.listpage a {
  display: block;
  border-radius: .15rem;
  overflow: hidden;
}

.listpage h2 {
  width: 100%;
  bottom: -10px;
  padding: 5px 15px;
  color: #000;
  font-size: .16rem;
  font-weight: normal;
  text-align: left;
  height: .4rem;
  line-height: .35rem;
  overflow: hidden;
  background-color: #FFF;
  z-index: 2;
}

.listpage .post-like {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  font-size: 12px;
  background-color: rgba(0,0,0,.5);
  border-radius: 40px;
  text-align: center;
  vertical-align: middle;
  padding: 10px 11px;
  color: #fff;
  z-index: 2;
  opacity: 0;
}
.listpage li:hover .post-like{
  opacity: 1;
  -webkit-transition:all 0.3s ease-in-out;
  -moz-transition:all 0.3s ease-in-out;
  transition:all 0.3s ease-in-out;
}
.listpage .post-like:hover {
  background-color: rgba(250, 68, 68, 1);
}
.listpage .post-like i {
  font-size: 28px;
  color: rgba(255, 255, 255, .8);

}
.listpage .post-like:hover i{
  color: rgba(255, 255, 255, 1);
}

.listpage .post-like.actived {
  color: #fff;
  background-color: rgba(255,94,82,.8);
}
.listpage .items-pro {
    position: absolute;
    width: 100%;
    overflow: hidden;
    top: 0rem;
    left: 0rem;
    text-align: left;
    width: .5rem;
    height: .3rem;
    text-align: center;
    font-size: .15rem;
    font-weight: 700;
    line-height: .3rem;
    border-top-left-radius: .06rem;
    border-bottom-right-radius: .1rem;
    background-image: linear-gradient(90deg, rgba(255, 94, 82, 1) 0,rgba(250, 68, 68, .8) 45%, rgba(250, 68, 68, .7));
    color: #FFF;
  
}

.listpage .info-box {
  padding:15px 5px;
}
.info-box .price-box {
  padding: 3px 10px 1px;
}
.rmb{
  font-size: 14px;
  color: rgba(254, 54, 54, 1);
  margin-right: 3px;
  font-family: Arial, Helvetica, sans-serif;
}
.price {
    font-size: 16px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    /*color: #ed008c;*/
    color: #fd3636;
}
.price .m-num {
    color: rgba(254, 54, 54, 1);
    font-size: 26px;
    font-weight: bold;
    font-family: Georgia, "Times New Roman", Times, serif;
}
.style {
    color: rgba(239, 62, 152, .6);
    font-size: 14px;
    float: right;
    padding: 3px 10px 1px;
}
.listpage .items-tag {
    float: right;
    display: inline-table;
    font-size: 12px;
    color: rgba(200, 200, 200, 1);
    padding: 3px 10px 1px;
    display: flex;
    display: -webkit-flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
}

.listpage .items-tag span {
  margin-left: 5px;
  display: inherit;
}
.items-tag i {
  font-size: 20px;
}
.items-tag .tags {  
  background-color: rgba(238, 238, 238, .5);
  border-radius: 16px; 
  padding:2px 8px;
  color: rgba(0, 0, 0, .6);
}
@media (max-width: 670px) {

.items-img, .items-text {
  width: 100%;
  }
.items-text {
  padding: 0px 30px 40px 30px;
  }
.content-slide .listpage li {
  width: 50% !important;
  }
}
@media (max-width: 720px) {
.items-img, .items-text {
    width: 100%;
  }
.items-text {
  padding: 0px 30px 40px 30px;
  }
.content-slide .listpage li {
  width: 50% !important;
  }
}
/*收藏*/
.listpage .post-keep {
    position: absolute;
    top: .12rem;
    right: .12rem;
    background: rgba(0,0,0,.6);
    width: .5rem;
    height: .5rem;
    line-height: .5rem;
    border-radius: .5rem;
    text-align: center;
    vertical-align: middle;
  padding: 10px 11px;
  color: #fff;
  z-index: 2;
  opacity: 0;
}
.listpage li:hover .post-keep{
  opacity: 1;
  -webkit-transition:all 0.3s ease-in-out;
  -moz-transition:all 0.3s ease-in-out;
  transition:all 0.3s ease-in-out;
}
.listpage .post-keep:hover {
  background-image: linear-gradient(90deg, rgba(255, 94, 82, 1) 0,rgba(250, 68, 68, .8) 45%, rgba(250, 68, 68, .7));
}
.listpage .post-keep i {
  font-size: 28px;
  color: rgba(255, 255, 255, .8);

}
.listpage .post-keep:hover i{
  color: rgba(255, 255, 255, 1);
}

.listpage .post-keep.actived {
  color: #fff;
  background-color: rgba(255,94,82,.8);
}
.keeping {
  position: absolute;
  top: 0;
  left: 0;
  width: 50px;
  height: 50px;
  border-radius: 50px;
  line-height: 50px;
  padding: 11px;
  border: none;
  outline: none;
  background-color: transparent;
}
.keeping img {
  opacity: .7 !important;
  width: 100% !important;
  border: none !important;
}
.listpage .post-keep:hover img{
  opacity: 1 !important;
}

/*分类导航*/
.nav{
	/*border-radius: .06rem .06rem 0 0;*/
	border-radius: .15rem;
	background-color: rgba(10, 17, 61, .6);	
	padding: .12rem 0;
	margin-bottom: .2rem;
}
.classfiy-nav {
	position:relative;	font-size:0;
	white-space:nowrap;
	overflow-y:hidden;
	overflow-x:auto;
	padding: .08rem;
}
.classfiy-nav:after {
	position: absolute;
    top: 100%;
    right: 0rem;
    left: 0rem;
    height: 1px;
    background-color: #eee;
    content: "";
    z-index: 2;
}
.classfiy-nav>li {
	position:relative;
	display:inline-block;
	text-align:left;
	font-size:.12rem;
	cursor:pointer;
	padding: .12rem;
	margin: 0rem;
    vertical-align: middle;
	border-radius: .24rem;
    /*background-color: rgba(10, 17, 61, 1);*/

}
.classfiy-nav>li .typename {
	padding-right: .10rem;
	border-right:1px solid #67c1f5;
	vertical-align: middle;
	font-size: .14rem;
	font-weight: bold;
	color: #67c145;
}
.classfiy-nav>li .typename i {
	display:inline-block;
	margin-right: .06rem;
	margin-top: -.04rem;
	width: .24rem;
	height: .24rem;
	background-size: contain;
}
.classfiy-nav>li.classfiy-item a {
	padding-left: .08rem;
	color:#67c1f5;
}
.classfiy-nav>li.classfiy-item a:hover {
	color: rgba(103,193,245,.6);
}

.classfiy-nav>li.classfiy-item:nth-child(6) a i{
	width: .22rem;
	height: .22rem;
}
.classfiy-nav>li a {
	display:inline-block;
}
.classfiy-nav>li p {
	color:#67c1f5;
}


.classfiy-nav>li ul {
	position:absolute;
	display:none;
	top:100%;
	left:auto;
	right:0;
	width:3rem;
	padding:.1rem .15rem;
	margin-top:0px;
	background:#34343e;
	border-top: 3px solid #f4604b;
	white-space:normal;
	text-align:left;
	z-index:5;
}
.classfiy-nav>li ul li {
	display:inline-block;
	width:1.2rem;
	height:.35rem;
	line-height:.36rem;
	margin:0 .06rem .05rem;
	text-align:center;
	color:#8f98a0;
}
.classfiy-nav>li ul li:nth-of-type(1),.classfiy-nav>li ul li:nth-of-type(2) {
	border:0
}
.classfiy-navli ul li.on {
	color:#67c1f5
}
.classfiy-nav>li:nth-of-type(1) ul,.classfiy-nav>li:nth-of-type(2) ul {
	left:0;
	right:auto
}
.classfiy-nav>li:hover {

}

.classfiy-nav>li:hover ul {
	display:block
}
.classfiy-nav>li.on {
	background:#549ecb
}
.classfiy-nav>li.on p {
	color:#fff
}
.classfiy-nav>li.on i {
	opacity:1
}
.classfiy-nav>li.others {
	position:static
}

.nav .sec-nav .classfiy-item {
	width: 25%;
	padding: 0 12px;
	border-radius: .24rem;
    background-color: #f8f8f8;
}
.nav .sec-nav li.classfiy-item .typename, .nav .sec-nav li.classfiy-item .typename a {
	display: inline-block;
}