homeindex.wxss 6.7 KB
/* pages/homeindex/homeindex.wxss */
.search{
  padding: 16rpx 32rpx;
  height: 64rpx;
  background: #6EAC3D;
  display: flex;
  justify-content: center;
  align-content: space-between;
}
.search_inp{
  box-sizing: border-box;
  width: 608rpx;
  height: 64rpx;
  border-radius: 32rpx;
  display:flex;
  align-items: center;
  padding-left: 76rpx;
  padding-right: 32rpx;
  background:#fff;
  border: 0;
  outline: none;
  font-size: 26rpx;
  position: relative;
}
.search_inp input{
  width: 100%;
}
.search_inp image{
  position: absolute;
  left: 32rpx;
  width: 32rpx;
  height: 32rpx;
}
.search_txt{
  height: 64rpx;
  font-size: 30rpx;
  color: #fff;
  line-height: 64rpx;
  padding-left: 16rpx;
}
.banner{
  width: 688rpx;
  height: 336rpx;
  margin: 0 auto;
  margin-top: 48rpx;
  position: relative;
  border-radius: 8rpx;
}
.swiper{
  height: 100%;
  position: absolute;
  z-index: 99;
}
.swiper-item{
  width: 688rpx;
  margin: 0 auto;
  height: 336rpx;
  border-radius: 8rpx;
}
.swiper-item image{
  height: auto;
}
.banner_Mask{
  width:656rpx;
  height: 336rpx;
  background:rgba(181,222,150,1);
  box-shadow:0rpx 6rpx 40rpx rgba(93,255,0,0.44);
  opacity:0.3;
  position: absolute;
  bottom: 16rpx;
  z-index: -1;
  left: 16rpx;
  border-radius: 8rpx;
}
.commodity{
  width: 688rpx;
  /* margin: 0 auto; */
  padding: 64rpx 32rpx;
  display: flex;
  justify-content:space-around;
  align-items: center;
  font-size: 24rpx;
  color: #333333;
  border-bottom: 8px solid rgba(249,250,252,1);
}
.commodity view{
}
.introduce_list {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 36rpx 32rpx 48rpx 32rpx;
}
.introduce_list .introduce_item{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.introduce_list .introduce_item:first-child image{
  width: 32rpx;
  height: 36rpx;
}
.introduce_list .introduce_item:nth-child(2) image{
  width: 36rpx;
  height: 31rpx;
}
.introduce_list .introduce_item:nth-child(3) image{
  width: 32rpx;
  height: 29rpx;
}
.introduce_list .introduce_item text{
  font-size: 28rpx;
  display: flex;
  align-items: center;
  margin-left: 16rpx;
}
.introduce image{
  width: 668rpx;
  height: 208rpx;
  display: block;
  margin: 0 auto;
}
.commodity image{
  display: flex;
  width: 112rpx;
  height: 112rpx;
  margin: 0 auto;
}
.commodity text{
  display: flex;
  margin-top: 14rpx;
  text-align: center;
  justify-content: center;
  align-items: center;
}

.container{
  width: 750rpx;
  display: flex;
  align-items: center;
  flex-flow: column;
}
.mid{
  margin-top: 16rpx;
  display: flex;
  flex-flow: column;
}
.mid_item{
  margin-top: 16rpx;
  width:688rpx;
  /* height:400rpx; */
  background:rgba(249,250,252,1);
  opacity:1;
  border-radius:8rpx;
  display: flex;
  align-items: center;
  flex-flow: column;
  box-sizing: border-box;
  padding: 52rpx 16rpx 48rpx; 
}
.mid_item_top{
  display: flex;
  width: 100%;
}
.mid_item_top_left{
  width:208rpx;
  height:208rpx;
  /* background:rgba(250,250,250,1); */
  opacity:1;
  display: flex;
  flex-flow: column;
}
.top_left_pic{
  width: 208rpx;
  height: 160rpx;
  display: flex;
}
.top_left_pic image{
  width: 100%;
  height: 100%;
}
.top_left_text{ 
  width: 202rpx;
  height:48rpx;
  background:rgba(251,4,4,1);
  opacity:0.2;
  text-align: center;
  font-size:24rpx;
  font-family:PingFang SC;
  font-weight:400;
  line-height:48rpx;
  color:rgba(255,255,255,1);

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mid_item_top_right{
  width: 100%;
  margin-left: 14rpx;
}
.right_top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 20rpx;
}
.right_top_lef{
  width: 270rpx;
  font-size:32rpx;
  font-family:PingFang SC;
  font-weight:600;
  color:rgba(51,51,51,1);
  opacity:1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.right_top_rig{
  font-size:22rpx;
  font-family:PingFang SC;
  font-weight:400;
  line-height:32rpx;
  color:rgba(204,204,204,1);
  opacity:1;
}
.right_mid{
  margin-top: 16rpx;
  display: flex;
  align-items: center;
}
.right_mid_lef{
  width:288rpx;
  height:16rpx;
  background:rgba(236,236,236,1);
  opacity:1;
  border-radius:8rpx;
}
.right_mid_lef_color{
  width:206rpx;
  height:16rpx;
  background:rgba(181,222,150,1);
  opacity:1;
  border-radius:8rpx;
}
.right_mid_rig{
  margin-left: 16rpx;
  font-size:24rpx;
  font-family:PingFang SC;
  font-weight:400;
  line-height:34rpx;
  color:rgba(181,222,150,1);
  opacity:1;
}
.right_text{
  margin-top: 14rpx;
  font-size:22rpx;
  font-family:PingFang SC;
  font-weight:400;
  color:rgba(204,204,204,1);
  opacity:1;
}
.right_bottom{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.RBM{
  font-size: 22rpx;
  color: #ff0000;
}
.number{
  font-size: 30rpx;
  color: #ff0000;
}
.text{
 
  font-size:22rpx;
  font-family:PingFang SC;
  font-weight:400;
  line-height:32rpx;
  color:rgba(204,204,204,1);
  opacity:1;
}
.right_bottom_mid{
  width: 122rpx;
}
.right_bottom_mid_t{
  
  font-size:22rpx;
  font-family:PingFang SC;
  font-weight:400;
  color:rgba(51,51,51,1);
  opacity:1;

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;

}
.right_bottom_mid_b{
  font-size:18rpx;
  font-family:PingFang SC;
  font-weight:400;
  color:rgba(153,153,153,1);
  opacity:1;

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.right_bottom_rig{
  width:144rpx;
  height:48rpx;
  line-height: 48rpx;
  background:rgba(249,150,20,1);
  box-shadow:0rpx 2rpx 12rpx rgba(255,145,0,0.16);
  opacity:1;
  border-radius:24rpx;

  text-align: center;
  font-size:26rpx;
  font-family:PingFang SC;
  font-weight:400;
  color:rgba(255,255,255,1);
}
.mid_item_bottom{
  margin-top: 32rpx;
  width:640rpx;
  height:80rpx;
  background:rgba(181,222,150,0.1);
  border-radius:16rpx;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  padding: 0 32rpx;
}
.mid_item_bottom_left{
  font-size:30rpx;
  font-family:汉真广标;
  font-weight:400;
  color:rgba(110,172,61,1);
  opacity:1;
  
}
.mid_line{
  margin: 0 36rpx;
  width:2rpx;
  height:60rpx;
  background:rgba(181,222,150,1);
  opacity:1;
  border-radius:4rpx;
}
.mid_item_bottom_bot{
  font-size:24rpx;
  font-family:PingFang SC;
  font-weight:400;
  color:rgba(153,153,153,1);
  opacity:1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.text_color{
  width:202rpx;
  height:48rpx;
  line-height: 48rpx;
  text-align: center;
  background:rgba(204,204,204,0.7);
  font-size:24rpx;
  font-family:PingFang SC;
  font-weight:400;
  color:rgba(255,255,255,1);
  opacity:1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.right_bottom_lef{
  width: 140rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}