/* packageI/newMedia/newMediaExchange/newMediaExchange.wxss */

view,
text {
  box-sizing: border-box;
}

.wrapper {
  padding: 28rpx 30rpx;
}

.surplus {
  font-size: 28rpx;
  color: #333;
}

.exchange {
  width: 100%;
  height: 450rpx;
  margin-top: 30rpx;
  padding: 41rpx 62rpx 25rpx;
  background-color: #fff;
  box-shadow:
    0rpx 2rpx 8rpx 0rpx
    rgba(7, 11, 33, 0.11);
  border-radius: 10rpx;
}

.exchange .explain {
  display: flex;
  align-items: center;
  font-size: 27rpx;
  color: #333;
}

.exchange .explain .num {
  margin-left: 21rpx;
  font-size: 20rpx;
  color: #f15353;
}

.exchange .input {
  margin-top: 60rpx;
  padding-bottom: 30rpx;
  border-bottom: 1rpx solid rgba(245, 245, 245);
}

.exchange .input input {
  font-size: 51rpx;
  color: #333;
}

.exchange .desc {
  color: #888;
  margin-top: 19rpx;
  font-size: 23rpx;
}

.exchange .payPrice {
  margin-top: 10rpx;
  font-size: 22rpx;
  color: #f14e4e;
}

.exchange .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 78rpx;
  margin-top: 38rpx;
  font-size: 31rpx;
  color: #fff;
  background-image:
    linear-gradient(
      #f15353,
      #f15353
    ),
    linear-gradient(
      #4d1717,
      #4d1717
    );
  background-blend-mode:
    normal,
    normal;
  border-radius: 12rpx;
}