homeindex.wxss 5.9 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;
  top: 17rpx;
  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{
  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;
}
.ware_box{
 width:688rpx;
 height:400rpx;
 margin:32rpx auto;
 background:#F9FAFC;
}
.ware_top{
 overflow: hidden;
 display: flex;
 padding:32rpx 18rpx 0;
}
.ware_1{
 width:312rpx;
 height:208rpx;
 position: relative;
}
.ware_1 image{
 width:100%;
 height:100%;
}
.ware_1_time{
 position: absolute;
 bottom:0;
 width:208rpx;
 height:48rpx;
 color: white;
 text-align: center;
 line-height:48rpx;
 font-size:24rpx;
 background:#FAC8C8;
 font-family:PingFang SC;
}
.ware_text{
 margin-left:14rpx;
 width:100%;
}
.ware_2{
  display: flex;
  justify-content: space-between;
  align-content: center;
}
.ware_2Txt1{
 font-size:32rpx;
 font-family:PingFang SC;
 font-weight:600;
 line-height:44rpx;
 color:rgba(51,51,51,1);
}
.ware_2Txt2{
 font-size:22rpx;
 /* margin-left:98rpx; */
 font-family:PingFang SC;
 font-weight:400;
 line-height:32rpx;
 color:rgba(204,204,204,1);
}
.ware_3 progress{
 width:370rpx;
 color:#B5DE96;
 margin-top:24rpx;
}
.ware_4 text,.ware5_t2{
 font-size:22rpx;
 font-family:PingFang SC;
 font-weight:400;
 line-height:32rpx;
 color:rgba(204,204,204,1);
}
.ware_5{
 display: flex;
 display: -webkit-flex;
 justify-content: space-between;
}
.ware5_t1{
 font-size:30rpx;
 font-family:DIN 1451 Std Mittelschrift;
 font-weight:400;
 color:rgba(255,0,0,1);
}
.ware5_t3{
 font-size:22rpx;
 font-family:PingFang SC;
 font-weight:400;
 line-height:30rpx;
 color:rgba(51,51,51,1);
}
.ware5_t4{
 font-size:18rpx;
 font-family:PingFang SC;
 font-weight:400;
 color:rgba(153,153,153,1);
}
.ware_6{
 width:144rpx;
 height:48rpx;
 background:rgba(249,150,20,1);
 box-shadow:0px 2rpx 12rpx rgba(255,145,0,0.16);
 border-radius:24rpx;
}
.ware_6 view{
 font-size:26rpx;
 font-family:PingFang SC;
 font-weight:400;
 text-align: center;
 line-height:48rpx;
 color:rgba(255,255,255,1);
}
.ware_bot{
 width:670rpx;
 height:80rpx;
 margin: auto;
 display: flex;
 line-height:80rpx;
 margin-top:32rpx;
 background-color:#F1F7F1;
}
.ware_bot_tit{
 font-size:30rpx;
 font-weight:bold;
 margin-left:32rpx;
 color:rgba(110,172,61,1);
}
.ware_bot_tit:after{
 content:"";
 margin:0 38rpx;
 border-right:1px solid #B5DE96;
}
.ware_bot_txt{
 font-size:24rpx;
 font-family:PingFang SC;
 font-weight:400;
 color:rgba(153,153,153,1);
}
/* 规格 */
.spec{
 width:100%;
 padding:0 32rpx;
 line-height:80rpx;
 display: flex;
 height:80rpx;
 margin-top:8rpx;
 background:white;
}
.spec_txt{
 font-size:32rpx;
 font-family:PingFang SC;
 font-weight:400;
 color:rgba(51,51,51,1);
}
.spec_txt2{
  font-size:24rpx;
  font-family:PingFang SC;
  font-weight:400;
  margin-left:108rpx;
  color:rgba(153,153,153,1);
}
/* 商品详情 */
.ware_detail{
 width:100%;
 margin-top:8rpx;
 margin-bottom:96rpx;
 padding-bottom:66rpx;
 background: white;
}
.ware_detail_tit{
 width:688rpx;
 margin: auto;
 display: flex;
 padding:44rpx 0rpx 42rpx;
 justify-content:space-around;
 border-bottom:2rpx solid #F5F5F5;
}
.ware_detail .ware_active{
 color:#6EAC3D;
 font-weight:600;
}
.ware_active:after{
 content: "";
 width:16rpx;
 height: 6rpx;
 margin: auto;
 display: block;
 margin-top:6rpx;
 border-radius:8rpx;
 background:rgba(110,172,61,1);
}
.ware_detail_tit view{
 font-size:28rpx;
 font-family:PingFang SC;
 font-weight:400;
 color:rgba(153,153,153,1);
}
.ware_detailC{
 width:688rpx;
 margin:26rpx auto 0;
}

.ware_detailImg{
 width:688rpx;
 height:470rpx;
}
.ware_detailImg image{
 width:100%;
 height:100%;
}