payProject/pages/activePage2/activePage2.wxss

/* 头部 */
.top {
  width: 750rpx;
  /* height: 1052rpx; */
}

.top .top-bgc {
  width: 750rpx;
  height: 844rpx;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.center-bgc{
  width: 750rpx;
  height: 1440rpx;
  position: absolute;
  margin-top: 844rpx;
  z-index: -99;
}
.bottom-bgc{
  width: 750rpx;
  height: 940rpx;
  position: absolute;
  margin-top: 2262rpx;
}
.top-position{
  position: absolute;
  margin-left: 30rpx;
}
.coupon {
  width: 690rpx;
  height: 268rpx;
  margin: 0 auto;
  margin-top: 704rpx;
}

.coupon swiper-item {
  width: 690rpx;
  height: 218rpx;
  background: url('https://we-spa.oss-cn-shenzhen.aliyuncs.com/wxapp/20220901/%E5%BD%A2%E7%8A%B6%E7%BB%93%E5%90%88%202%402x.png') no-repeat;
  background-size: 100% 218rpx;
  display: flex;
}

.item-left {
  width: 256rpx;
  height: 218rpx;
}

.item-left .price {
  height: 141.7rpx;
  width: 256rpx;
  padding-top: 20rpx;
  box-sizing: border-box;
  display: flex;
  line-height: 150rpx;
  justify-content: center;
}

.item-left .price text {
  font-size: 36rpx;
  color: white;
  margin-top: 16rpx;
}

.item-left .priceFree {
  height: 65%;
  width: 100%;
  font-size: 36rpx;
  color: white;
  margin-left: 40rpx;
  margin-top: 10rpx;
  padding-top: 20rpx;
  box-sizing: border-box;
}

.item-left .priceFree text {
  color: white;
  font-size: 90rpx;
}

.item-left .price view {
  /* width: 190rpx;
  height: 100rpx; */
  width: max-content;
  color: white;
  font-size: 90rpx;
  /* line-height: 160rpx; */
}

.item-left .type {
  font-size: 28rpx;
  color: white;
  text-align: center;
  margin-top: 5rpx;
}

.item-right {
  flex: 1;
  height: 190rpx;
}

.item-right .title {
  height: 140rpx;
  width: 100%;
  font-size: 36rpx;
  color: white;
  padding-top: 40rpx;
  padding-left: 30rpx;
  box-sizing: border-box;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}

.item-right .title2 {
  width: 100%;
  font-size: 36rpx;
  color: white;
  padding-top: 40rpx;
  padding-left: 30rpx;
  box-sizing: border-box;
}

.title-detail {
  font-size: 20rpx;
  color: white;
  width: 366rpx;
  margin-left: 30rpx;
  margin-top: 4rpx;
}

.full_price {
  color: white;
}

.item-right .btn {
  font-size: 20rpx;
  color: white;
  width: 100rpx;
  height: 30rpx;
  background-color: #FF5459;
  border-radius: 22rpx;
  text-align: center;
  margin-left: 300rpx;
  margin-top: 20rpx;
}

/* 项目活动 */
.projectAct {
  width: 350rpx;
  height: 78rpx;
  margin-top: 950rpx;
}

.projectAct image {
  width: 100%;
  height: 100%;
  margin-left: 168rpx;
}
.recharge{
  margin-top: 40rpx;
  width: 690rpx;
  height: 300rpx;
  background-color: #d8d8d8;
  border-radius: 20rpx;
}
.recharge image{
  width: 100%;
  height: 100%;
}
.discount {
  width: 670rpx;
  height: 300rpx;
}

.discount image {
  width: 690rpx;
  height: 300rpx;
  margin-top: 40rpx;
  border-radius: 20rpx;
}

/* 中间 */
.center {
  width: 750rpx;
  min-height: 650rpx;
  background-size: 100% 100%;
}

/* 项目分类 */
.classify {
  width: 100%;
  height: 140rpx;
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.classify image {
  width: 100rpx;
  height: 100rpx;
}

/* 项目分类商品 */
.classifyProject {
  width: 100%;
  height: 514rpx;
  margin-top: 38rpx;
  display: flex;
}

.classifyProject .classifyProject-item {
  height: 100%;
  width: 330rpx;
  border-radius: 24rpx;
  background-color: white;
  margin-left: 30rpx;
}

.classifyProject-item-top {
  width: 100%;
  height: 330rpx;
}

.classifyProject-item-top image {
  width: 100%;
  height: 100%;
  border-radius: 24rpx 24rpx 0 0;
}

.classifyProject-item-bottom {
  height: 184rpx;
  width: 100%;
  padding: 0 18rpx;
  box-sizing: border-box;
  padding-top: 8rpx;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.classifyProject-title {
  font-size: 28rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.classifyProject-price {
  width: 100%;
  height: 110rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.classifyProject-price .price {
  font-size: 20rpx;
  color: #FF3007;
}

.classifyProject-price .price text {
  font-size: 36rpx;
  color: #FF3007;
}

.classifyProject-price image {
  width: 48rpx;
  height: 48rpx;
  margin-top: 10rpx;
  box-sizing: border-box;
}

/* 次卡活动 */
.cardAct {
  width: 750rpx;
  height: 94rpx;
  display: flex;
  justify-content: center;
  /* margin-top: 20rpx; */
}

.cardAct .cardAct-image {
  width: 212rpx;
  height: 94rpx;
  margin: 0 auto;
}

/* 次卡轮播图 */
.cardImage {
  width: 100%;
  height: 570rpx;
  margin-top: 20rpx;
}

.cardImage-item {
  width: 420rpx;
  height: 530rpx;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}

.cardImage-item .imageSmall {
  width: 368rpx;
  height: 462.8rpx;
  margin: 0 auto;
  border-radius: 20rpx;
}

.cardImage-item .imageBig {
  width: 420rpx;
  /* border: 1rpx solid white; */
  height: 540rpx;
  margin: 0 auto;
  border-radius: 20rpx;
}

.cardImage-item button {
  position: absolute;
  transform: translate(-50%);
  bottom: 2rpx;
  left: 50%;
  width: 262rpx;
  height: 60rpx;
  background-color: #FA7D22;
  color: white;
  border-radius: 40px;
  line-height: 60rpx;
  font-size: 28rpx;
}

/* 底部 */
.bottom {
  width: 750rpx;
  min-height: 1206rpx;
  /* background: url('https://we-spa.oss-cn-shenzhen.aliyuncs.com/wxapp/20220901/%E7%BC%96%E7%BB%84%2012%402x%282%29.png') no-repeat; */
  background-size: 100% 100%;
}

/* 商品活动 */
.commodity {
  width: 100%;
  height: 94rpx;
  margin-top: 20rpx;
}

.commodity image {
  width: 212rpx;
  height: 94rpx;
  margin: 0 auto;
  display: block;
}

/* 商品活动轮播图 */
.commodity-swiper {
  width: 690rpx;
  height: 300rpx;
  margin: 0 auto;
  margin-top: 20rpx;
  /* border: 1px solid #FFFFFF; */
  border-radius: 20px;
  box-sizing: border-box;
}

.commodity-swiper swiper {
  width: 100%;
  height: 100%;
}
/* .commodity-swiper swiper-item{
  display: flex;
  justify-content: center;
  align-items: center;
} */
.commodity-swiper swiper-item image {
  width: 100%;
  height: 100%;
  border-radius: 20px;
}
/* .commodity-swiper swiper-item image {
  width: 97%;
  height: 98%;
  border-radius: 20px;
} */

/* 商品活动商品轮播图 */
.classifyProject swiper {
  width: 100%;
  height: 100%;
}

.classifyProject swiper-item {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-around;
}
/* 拼团专区 */
.joinGroup{
  height: 1174rpx;
}
.joinGroup .joinGroup-top{
  width: 212rpx;
  height: 94rpx;
  margin-left: 266rpx;
  margin-top: 738rpx;
}
.joinGroup .joinGroup-bottom{
  width: 726rpx;
  height: 336rpx;
  margin-left: 12rpx;
  position: relative;
  bottom: 10rpx;
  /* margin-top: 10rpx; */
}