@charset "utf-8";

/* body {
  background: #EEE;
} */

/* 首页导航 */


.nav-home-outer {
  height: 1.6rem;
}

.nav-home {
  width: 100%;
  height: 1.067rem;
  line-height: 1.067rem;
  overflow-y: hidden;
  overflow-x: auto;
  /* padding: .587rem 0; */
  padding-top: .533rem;

}

.nav-home-ul {
  display: flex;
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
  padding: 0 .093rem;
}

.nav-home-li {
  margin: 0 .32rem;
  height: 1.067rem;
  font-size: .427rem;
  font-weight: 600;
  color: #333;
  display: flex;
  align-items: center;
  flex-direction: row;
  position: relative;
}

.nav-home-li img {
  width: auto;
  height: 0.853rem;
}

.nav-home-li a {
  color: #333;
}

.nav-home-li.hover {
  color: #E33E41;
}

.nav-home-li.hover::after {
  content: '';
  position: absolute;
  bottom: .067rem;
  left: 12.5%;
  width: 75%;
  height: .053rem;
  background: #E33E41;
  border-radius: .053rem;
}

.nav-home-pf {
  position: fixed;
  top: 1.173rem;
  width: 100%;
  z-index: 2000;
  overflow-x: scroll;
  overflow-y: hidden;
  margin: 0;
  background: #FFF;
  padding: .067rem 0;
  /* animation: showHeight .5s 1; */
}

@keyframes showHeight {
  0% {
    height: 0;
  }

  100% {
    height: 1.067rem;
  }
}

/* 商品列表集合 */
.spell-list {
  width: 100%;
  display: -webkit-flex;
  display: flex;
  position: relative;
  box-sizing: border-box;
  place-content: flex-start space-between;
  overflow: hidden;
  flex-wrap: wrap;
  padding: .373rem .32rem 0;
}

/* 常用商品块 */

.spell-block {
  width: 48.2%;
  height: 7.933rem;
  border-radius: .16rem;
  background: #FFF;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  margin-bottom: .213rem;
  position: relative;
  overflow: hidden;
}

.spell-block-pic {
  width: 4.57rem;
  height: 4.57rem;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.spell-block-pic img {
  border-radius: .16rem .16rem 0 0;
}

.spell-block-info {
  padding: .16rem .267rem;
}

.spell-block-info-title {
  color: #333;
  font-size: .4rem;
  height: 1.173rem;
  line-height: .587rem;
  overflow: hidden;
  /* text-overflow: ellipsis; */
  display: -webkit-box;
  /* -webkit-line-clamp: 2; */
  -webkit-box-orient: vertical;
}

.spell-block-info-tag {
  padding-top: .213rem;
  height: .533rem;
  overflow: hidden;
}

.spell-block-info-buy {
  padding-top: .293rem
}

.price-box {
  display: flex;
  align-items: baseline;
  white-space: nowrap;
}

.price-box .price-tt {
  font-size: .373rem;
}

.price-box .font-price {
  font-size: .427rem;
}

/* 图片背景块 */
.sb-mu-info {
  position: absolute;
  left: .267rem;
  bottom: .267rem;
  width: 4.04rem;
}

.btn-draw-gift {
  width: 1.707rem;
  height: .533rem;
  line-height: .533rem;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 1);
  font-size: .32rem;
  font-weight: 500;
  color: #FFF;
  text-align: center;
  display: inline-block;
}

.sb-mu-info-title {
  /* padding: .213rem 0 .32rem; */
  color: #FFF;
  font-size: .427rem;
  line-height: 1.5;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.list-info-shop {
  display: flex;
  place-content: flex-start space-between;
  align-items: center;
}

.list-info-shop-pic {
  display: flex;
  height: .64rem;
  line-height: .64rem;
}

.list-info-shop-pic img {
  width: .64rem;
  height: .64rem;
  margin-right: .107rem;
  border-radius: 50%;
}

.list-info-shop-pic .is-tit {
  font-size: .32rem;
  color: #FFF;
  width: 2.333rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
}

/* 买家秀块 */
.module-show .spell-block-pic {
  height: 5.213rem;
}

.module-show .spell-block-pic img.img-lazyload {
  height: 100%;
}

.module-show .spell-block-info {
  margin-top: .053rem
}

.module-show .list-info-shop {
  margin-top: .427rem
}

.module-show .list-info-shop .is-tit {
  color: #777
}



/* 颜色背景商品块 */
/* 橙色:cengse  红色:hongse 蓝色:lanse 棕色:zongse 紫色:zise */
.cengse .spell-block-info,
.hongse .spell-block-info,
.lanse .spell-block-info,
.zongse .spell-block-info,
.zise .spell-block-info {
  text-align: center;
}

.cengse .spell-block-color-tt,
.hongse .spell-block-color-tt,
.lanse .spell-block-color-tt,
.zongse .spell-block-color-tt,
.zise .spell-block-color-tt {
  height: .693rem;
  font-size: .48rem;
  font-weight: 600;
  line-height: .693rem;
  margin-top: .267rem;
  overflow: hidden;
}

.cengse .spell-block-color-tit,
.hongse .spell-block-color-tit,
.lanse .spell-block-color-tit,
.zongse .spell-block-color-tit,
.zise .spell-block-color-tit {
  height: .533rem;
  font-size: .373rem;
  font-weight: 400;
  color: #333;
  line-height: .547rem;
  margin: .107rem 0 .427rem;
  overflow: hidden;
}


/* 棕色 #FFDDB0  zongse */
.zongse {
  background: #FFDDB0;
}

.zongse .spell-block-color-tt {
  color: #BD4F00;
}

.zongse .btn-see-136-48 {
  background: #BD4F00;
}

/* 橙色 #FFDED1 cengse*/
.cengse {
  background: #FFDED1;
}

.cengse .spell-block-color-tt {
  color: #F25300;
}

.cengse .btn-see-136-48 {
  background: #F25300;
}

/* 红色 #FFD7D7 hongse */
.hongse {
  background: #FFD7D7;
}

.hongse .spell-block-color-tt {
  color: #EA1010;
}

.hongse .btn-see-136-48 {
  background: #EA1010;
}

/* 蓝色 #D0E9F8 lanse */
.lanse {
  background: #D0E9F8;
}

.lanse .spell-block-color-tt {
  color: #007FCF;
}

.lanse .btn-see-136-48 {
  background: #007FCF;
}

/* 紫色 #E0E4FF zise */
.zise {
  background: #E0E4FF;
}

.zise .spell-block-color-tt {
  color: #4057DB;
}

.zise .btn-see-136-48 {
  background: #4057DB;
}

.font-del {
  font-weight: normal;
  color: #999;
  text-decoration: line-through;
  font-size: .373rem;
  margin-left: 0;
}
