page {
  background: #f2f3f7;
}

/* 搜索框 */
.index .search-box {
  background: #fc1b35;
  padding: 20rpx 30rpx;
}
.index .search-box .search {
  height: 60rpx;
  background: #fff;
  border-radius: 60rpx;
  display: flex;
  align-items: center;
}

.index .search-box .search .icon {
  width: 24rpx;
  height: 24rpx;
  font-size: 0;
  margin-left: 20rpx;
}

.index .search-box .search .text {
  color: #999;
  margin-left: 10rpx;
}

/* banner */
.index .banner {
  position: relative;
  height: 280rpx;
  background: #fff;
}

.index .banner .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 190rpx;
}

.index .banner .img {
  width: 100%;
  height: 280rpx;
}

.index .banner .img .item {
  padding: 0 30rpx;
  box-sizing: border-box;
  font-size: 0;
}

.index .banner .img .item image {
  border-radius: 10rpx;
}

/* 导航 */
.index .nav-box {
  padding: 34rpx 30rpx 4rpx;
  background: #fff;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.index .nav-box .item {
  width: 25%;
  text-align: center;
  margin-bottom: 26rpx;
}

.index .nav-box .item .icon {
  margin: auto;
  width: 60rpx;
  height: 60rpx;
  font-size: 0;
}

.index .nav-box .item .text {
  margin-top: 14rpx;
}

/* 长广告 */
.index .long-adv {
  padding: 0 30rpx;
  height: 170rpx;
  background: linear-gradient(to bottom, #fff, #f2f3f7);
}

.index .long-adv .adv-box {
  border-radius: 10rpx;
  width: 100%;
  height: 170rpx;
  overflow: hidden;
}

/* 秒杀专区 */
.index .flash-sale {
  margin: 24rpx 30rpx 0;
  border-radius: 10rpx;
  overflow: hidden;
}

.index .flash-sale .tit {
  display: flex;
  align-items: center;
  background: #fff;
  padding: 20rpx;
}

.index .flash-sale .tit .text {
  font-size: 28rpx;
  font-weight: 600;
}

.index .flash-sale .tit .time {
  flex: 1;
  display: flex;
  align-items: center;
  margin-left: 16rpx;
}

.index .flash-sale .tit .time .num {
  width: 32rpx;
  height: 32rpx;
  line-height: 32rpx;
  font-size: 20rpx;
  font-weight: 600;
  font-family: PingFangSC-Medium, tahoma;
  text-align: center;
  background: #fc1b35;
  color: #fff;
  border-radius: 8rpx;
}

.index .flash-sale .tit .time .colon {
  height: 36rpx;
  line-height: 36rpx;
  color: #999;
  margin: 0 6rpx;
}

.index .flash-sale .tit .more {
  color: #999;
}

.index .flash-sale .tit .more.text-arrow::after {
  border-top: 2rpx solid #999;
  border-right: 2rpx solid #999;
}

.index .flash-sale .goods {
  display: flex;
  justify-content: space-between;
  padding: 0 20rpx 20rpx;
  background: #fff;
}

.index .flash-sale .goods .item {
  flex: 1;
}

.index .flash-sale .goods .item .img {
  width: 210rpx;
  height: 210rpx;
  font-size: 0;
  margin: auto;
  border-radius: 10rpx;
  overflow: hidden;
}

.index .flash-sale .goods .item .price {
  margin-top: 10rpx;
  height: 32rpx;
  justify-content: center;
  color: #333;
}

.index .flash-sale .goods .item .price .big {
  font-size: 24rpx;
}

/* 多功能区 */
.index .multi {
  padding: 0 30rpx;
  display: flex;
  flex-wrap: wrap;
}

.index .multi .item {
  flex: 1;
  margin-top: 12rpx;
  margin-left: 12rpx;
  padding: 20rpx;
  background: #fff;
  box-sizing: border-box;
  border-radius: 10rpx;
}

.index .multi .item:first-child {
  margin-left: 0;
}

.index .multi .item .tit {
  padding-bottom: 20rpx;
}

.index .multi .item .tit .text {
  font-size: 28rpx;
  font-weight: 600;
}

.index .multi .item .tit .des {
  margin-top: 10rpx;
  color: #999;
  line-height: 1;
}

.index .multi .item .pic {
  width: 180rpx;
  height: 180rpx;
  font-size: 0;
  margin: auto;
  border-radius: 10rpx;
  overflow: hidden;
}

/* 好物助手 */
.index .card-goods {
  margin: 12rpx 30rpx 30rpx;
  padding: 20rpx;
  background: #fff;
  border-radius: 10rpx;
  display: flex;
}

.index .card-goods .text-box .text {
  font-size: 32rpx;
  font-weight: 600;
  color: #fc1b35;
}

.index .card-goods .text-box .big {
  font-size: 28rpx;
  font-weight: 600;
  margin-top: 20rpx;
}

.index .card-goods .text-box .more.text-arrow {
  color: #999;
  margin-top: 6rpx;
  padding-right: 20rpx;
}

.index .card-goods .text-box .more::before {
  position: absolute;
  top: 50%;
  right: -6rpx;
  display: block;
  width: 18rpx;
  height: 18rpx;
  border-radius: 50%;
  content: " ";
  font-size: 0;
  border: 2rpx solid #aaa;
  transform: translateY(-50%);
}

.index .card-goods .text-box .more.text-arrow::after {
  width: 6rpx;
  height: 6rpx;
  top: 46%;
  border-top: 2rpx solid #999;
  border-right: 2rpx solid #999;
}

.index .card-goods .goods {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.index .card-goods .goods .item {
  margin-left: 20rpx;
  width: 140rpx;
  height: 140rpx;
  font-size: 0;
  border-radius: 10rpx;
  overflow: hidden;
}

/* 推荐 */
.index .recommend {
  margin-top: 40rpx;
  padding: 0 30rpx;
}

.index .recommend .category {
  white-space: nowrap;
}

.index .recommend .category .category-item {
  display: inline-block;
  font-size: 26rpx;
  font-weight: 600;
  width: 20%;
  height: 56rpx;
  line-height: 56rpx;
  white-space: nowrap;
  text-align: center;
}

.index .recommend .category .category-item.active {
  color: #fff;
  background: #fc1b35;
  border-radius: 60rpx;
}
