store/packageA/mycomponent/coupon_item/coupon_item.wxss

/* packageA/mycomponent/coupon_item/coupon_item.wxss */
@import "/mycss/stylesheet.wxss";
@import "/mycss/iconfont.wxss";

view,
text,
icon {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.coupon_voucher {
  width: 704rpx;
  margin: 0 auto;
  margin-bottom: 40rpx;
  margin-top: 24rpx;
  display: flex;
  flex-direction: column;
  filter: drop-shadow(0rpx 5rpx 18rpx rgba(81, 81, 81, 0.52));
  transform: translateX(0rpx);
}

.coupon_voucher .coupon_voucher_wrapper {
  display: flex;
}

.coupon_voucher .coupon_voucher_left {
  width: 245rpx;
  height: 215rpx;
  margin-left: 20rpx;
  position: relative;
}

.coupon_voucher .coupon_voucher_left .bg_icon {
  width: 265rpx;
  height: 215rpx;
  position: absolute;
  top: 0;
  left: -20rpx;
}

.coupon_voucher .coupon_voucher_left .wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 245rpx;
  height: 215rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 15rpx;
  justify-content: center;
}

.coupon_voucher .coupon_voucher_left .wrapper .discount {
  letter-spacing: 1rpx;
  color: #fff;
  font-size: 52rpx;
  padding: 0 10rpx;
  border-bottom: 2rpx dashed #f5f5f5;
}

.coupon_voucher .coupon_voucher_left .wrapper .discount_none {
  letter-spacing: 1rpx;
  color: #fff;
  font-size: 39rpx;
  padding: 0 10rpx;
  border-bottom: 2rpx dashed #f5f5f5;
}

.coupon_voucher .coupon_voucher_left .wrapper .limit {
  letter-spacing: 1rpx;
  color: #fff;
  font-size: 22rpx;
  margin-top: 5rpx;
}

.coupon_voucher .coupon_voucher_left .wrapper .btn {
  width: 148rpx;
  height: 42rpx;
  background-color: #fff;
  border-radius: 14rpx;
  letter-spacing: 3rpx;
  color: #fba560;
  font-size: 25rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 15rpx;
}

.coupon_voucher .coupon_voucher_right {
  width: 446rpx;
  height: 215rpx;
  padding: 18rpx 18rpx 22rpx 22rpx;
  position: relative;
  overflow: hidden;
  background-color: #fff;
}

.coupon_voucher .coupon_voucher_right .status {
  background-color: rgb(66, 163, 84);
  font-style: normal;
  position: absolute;
  top: 18rpx;
  right: -28rpx;
  width: 120rpx;
  display: block;
  height: 32rpx;
  font-size: 20rpx;
  text-align: center;
  color: #fff;
  transform: rotate(45deg);
}

.coupon_voucher .coupon_voucher_right .status.black {
  color: #fff;
  height: 42rpx;
  line-height: 42rpx;
  font-size: 24rpx;
  width: 150rpx;
  right: -35rpx;
  background-color: rgb(206, 206, 206);
}

.coupon_voucher .coupon_voucher_right .c1 {
  display: flex;
  align-items: center;
}

.coupon_voucher .coupon_voucher_right .c1 .label {
  background-color: #fbbd5c;
  border-radius: 7rpx;
  color: #fff;
  font-size: 26rpx;
  padding: 7rpx 18rpx 7rpx 14rpx;
}

.coupon_voucher .coupon_voucher_right .c1 .title {
  height: 40rpx;
  border-radius: 7rpx;
  border: solid 2rpx #ff5d5d;
  padding: 0 10rpx;
  margin-left: 20rpx;
  color: #ff5d5d;
  font-size: 26rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}

.coupon_voucher .coupon_voucher_right .c2 {
  margin-top: 21rpx;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  font-size: 28rpx;
  letter-spacing: 1rpx;
  font-weight: 600;

  /* overflow: hidden;
	text-overflow:ellipsis;
	white-space: nowrap; */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.coupon_voucher_right .time {
  font-size: 19rpx;
  color: #9c9c9c;
}

/* .coupon_voucher
.coupon_voucher .coupon_voucher_right .c2 .btn {
	width: 106rpx;
	height: 38rpx;
	background-color: #ffffff;
	border-radius: 14rpx;
	border: solid 1rpx #ff8383;
	font-size: 25rpx;
	letter-spacing: 4rpx;
	color: #ff8383;
	display: flex;
	align-items: center;
	justify-content: center;
} */

.coupon_voucher .coupon_voucher_right .hr {
  margin-top: 18rpx;
  width: 408rpx;
  height: 0rpx;
  border-bottom: dashed 3rpx #9c9c9c;
}

.coupon_voucher .coupon_voucher_right .c3 {
  margin-top: 15rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.coupon_voucher .coupon_voucher_right .c3 .text {
  font-size: 24rpx;
  letter-spacing: 5rpx;
  color: #9c9c9c;
}

.coupon_voucher .coupon_voucher_right .c3 .downIcon {
  width: 30rpx;
  height: 30rpx;
  background-color: #9c9c9c;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.5s;
  transform-origin: center;
}

.coupon_voucher .coupon_voucher_right .c3 .downIcon.open {
  transform: rotate(180deg);
}

.coupon_voucher .coupon_voucher_right .c3 .downIcon .iconfont {
  display: flex;
  font-size: 24rpx;
  color: #fff;
  align-items: center;
  justify-content: center;
  transform: translateX(1.4rpx) translateY(3.6rpx);
}

.coupon_voucher_btm {
  margin-left: 20rpx;
  display: block;
  position: relative;
  box-sizing: border-box;
  padding: 16rpx 20rpx;
  background-color: #fff;
  border-bottom-left-radius: 6rpx;
  border-bottom-right-radius: 6rpx;
}

.van-swipe-cell__right {
  width: 65px;
  height: 100%;
  font-size: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  background-color: #ee0a24;
}

.usercontent {
  display: flex;

  /* align-items: center; */
  padding: 10rpx 6rpx 10rpx 6rpx;
  flex-direction: column;
}

.usercontent .left {
  font-size: 28rpx;
  text-align: center;
  height: 40rpx;
  line-height: 40rpx;
  padding-left: 20rpx;
  padding-right: 20rpx;
  color: #999;
}

.usercontent .right {
  /* flex: 1; */

  /* margin-left: 10rpx; */
  margin: 30rpx 40rpx;
  border: 1rpx solid #999;
  border-radius: 10rpx;
  padding: 10rpx;
}

.usercontent .right input {
  width: 100%;
  height: 40rpx;
  line-height: 40rpx;
}