weilaiGo/pages/coupon/coupon.wxss

page{
  height: 100%;
}
.box{
  height: 100%;
  background: #F4F4F4;
  width: 100%;
}
.box .top{
  width:100%;
  height:88rpx;
  background:rgba(255,255,255,1);
  display: flex;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
}
.box .top view{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 50%;
  font-size:32rpx;
  font-family:PingFang SC;
  font-weight:500;
  color:#A09E9E;
}
.box .top .active{
  color: #FA790F;
}
.box .top .active text:nth-of-type(2){
  width:38rpx;
  height:4rpx;
  background:rgba(250,125,14,1);
  border-radius:2rpx;
  position: absolute;
  bottom: 0rpx;
}
.box .null{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 73%;
  justify-content: center;
}
.box .null text{
  font-size:32rpx;
  font-family:PingFang SC;
  font-weight:500;
  color:rgba(139,139,139,1);
  padding-top: 74rpx;
}
.box .coupon_1{
  padding-top: 154rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.box .coupon_1 .view{
  width: 690rpx;
  height: 296rpx;
  background-size: 100% 100%;
  position: relative;
}
.box .coupon_1 .view1{
  background-image: url('http://resource.weilaigo.l4j.cn/coupon_mjq.png');
}
.box .coupon_1 .view2{
  background-image: url('http://resource.weilaigo.l4j.cn/cash_coupon.png');
}
.box .coupon_1 .view3{
  background-image: url('http://resource.weilaigo.l4j.cn/discount_coupon.png');
}
.box .coupon_1 .time{
  font-size:24rpx;
  font-family:PingFang SC;
  font-weight:400;
  position: absolute;
  top: 121.5rpx;
  left: 100rpx;
}
.box .coupon_1 .view1 .time{
  color: #28B9FE;
}
.box .coupon_1 .view2 .time{
  color: #FF8378;
}
.box .coupon_1 .view3 .time{
  color: #9784F3;
}
.box .coupon_1 .discount{
  font-size:40rpx;
  font-family:PingFang SC;
  font-weight:800;
  color:rgba(255,255,255,1);
  position: absolute;
  top: 112rpx;
  right: 96rpx;
}
.box .coupon_1 .money{
  display: flex;
  align-items: center;
  position: absolute;
  top: 112rpx;
  left: 490rpx;
  font-family:PingFang SC;
  color:rgba(255,255,255,1);
}
.box .coupon_1 .text{
  font-size:26rpx;
  font-family:PingFang SC;
  position: absolute;
  top: 66rpx;
  left: 244rpx;
  color: white;
  font-weight: 400;
}
.box .coupon_2{
  padding-top: 154rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.box .coupon_2 .view{
  width: 690rpx;
  height: 296rpx;
  background-size: 100% 100%;
  position: relative;
}
.box .coupon_2 .view1{
  background-image: url('http://resource.weilaigo.l4j.cn/invalid_mjq.png');
}
.box .coupon_2 .view2{
  background-image: url('http://resource.weilaigo.l4j.cn/invalid_xjq.png');
}
.box .coupon_2 .view3{
  background-image: url('http://resource.weilaigo.l4j.cn/invalid.png');
}
.box .coupon_2 .text{
  font-size:26rpx;
  font-family:PingFang SC;
  position: absolute;
  top: 66rpx;
  left: 244rpx;
  color: white;
  font-weight: 400;
}
.box .coupon_2 .time{
  font-size:24rpx; 
  font-family:PingFang SC;
  font-weight:400;
  position: absolute;
  top: 124.5rpx;
  left: 100rpx;
  color: #CDCCCE;
}
.box .coupon_2 .discount{
  font-size:40rpx;
  font-family:PingFang SC;
  font-weight:800;
  color:rgba(255,255,255,1);
  position: absolute;
  top: 112rpx;
  left: 542rpx;
}
.box .coupon_2 .money{
  display: flex;
  align-items: center;
  position: absolute;
  top: 112rpx;
  left: 490rpx;
  font-family:PingFang SC;
  color:rgba(255,255,255,1);
}