SOURCE

<div class="mod">
    <div class="box">
      <div class="bd">
        <img
          class="item"
          src="https://ai-sample.oss-cn-hangzhou.aliyuncs.com/test/927ec450293c11eb86c61fd063ca5fc6.png"
        />
      </div>
      <span class="main">全场新款满500减20</span>
      <img
        class="submain"
        src="https://ai-sample.oss-cn-hangzhou.aliyuncs.com/test/92e54e50293c11eb9b0109c42a545fbf.png"
      />
      <span class="row">英伦风时尚男款外套</span>
      <div class="row_2">
        <span class="originPrice">¥666666.00</span>
        <div class="outer">
          <span class="text">专柜价：</span>
          <img
            class="logo"
            src="https://ai-sample.oss-cn-hangzhou.aliyuncs.com/test/92beda90293c11eb949c21f837ded3b0.png"
          />
        </div>
        <span class="rmb">¥</span> <span class="money">666666.00</span>
      </div>
      <div class="ft">
        <div class="block">
          <div class="wrap"><span class="word">券</span></div>
          <img
            class="verticalLine"
            src="https://ai-sample.oss-cn-hangzhou.aliyuncs.com/test/93058080293c11eb82f0efd24eee2e43.png"
          />
          <div class="priceWrap"><span class="price">¥1000</span></div>
        </div>
        <div class="tagWrap"><span class="tag">立即购买</span></div>
      </div>
    </div>
  </div>

.mod {
  display: flex;
  align-items: center;
  flex-direction: row;
  width: 46.67vw;
  height: 81.33vw;
}

.box {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin-left: 0.13vw;
  background-color: #ffffff;
  width: 46.4vw;
  height: 81.33vw;
  overflow: hidden;
}

.bd {
  display: flex;
  position: relative;
  align-items: center;
  flex-direction: row;
  justify-content: center;
  background-color: #eeeeee;
  width: 46.4vw;
  height: 46.4vw;
  overflow: hidden;
}

.item {
  width: 46.4vw;
  height: 46.4vw;
}

.main {
  position: relative;
  margin-top: 1.47vw;
  margin-left: 2vw;
  max-width: 42.8vw;
  height: 4.4vw;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 4.4vw;
  white-space: nowrap;
  color: #ff0036;
  font-size: 3.2vw;
  font-weight: 400;
  align-self: baseline;
}

.submain {
  position: relative;
  margin-top: 1.33vw;
  width: 46.4vw;
  height: 0.27vw;
}

.row {
  position: relative;
  margin-top: 1.2vw;
  margin-left: 2vw;
  max-width: 42.8vw;
  height: 4.93vw;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 4.93vw;
  white-space: nowrap;
  color: #333333;
  font-size: 3.47vw;
  font-weight: 400;
  align-self: baseline;
}

.row_2 {
  display: flex;
  position: relative;
  align-items: flex-end;
  flex-direction: row;
  margin-top: 0.13vw;
  margin-left: 2vw;
  width: 35.07vw;
  height: 9.87vw;
}

.originPrice {
  position: absolute;
  top: 0.53vw;
  right: 10.27vw;
  text-decoration: line-through;
  line-height: 3.73vw;
  white-space: nowrap;
  color: #999999;
  font-size: 2.67vw;
  font-weight: 400;
}

.outer {
  display: flex;
  position: relative;
  align-items: flex-start;
  flex-direction: column;
  margin-right: 1.33vw;
  margin-bottom: 2vw;
  height: 7.87vw;
}

.text {
  position: relative;
  line-height: 3.73vw;
  white-space: nowrap;
  color: #999999;
  font-size: 2.67vw;
  font-weight: 400;
}

.logo {
  position: relative;
  margin-top: 0.93vw;
  margin-left: 0.13vw;
  width: 12vw;
  height: 3.2vw;
}

.rmb {
  position: relative;
  margin-right: 1.07vw;
  line-height: 5.6vw;
  white-space: nowrap;
  color: #ff0036;
  font-size: 2.67vw;
  font-weight: 400;
  align-self: baseline;
}

.money {
  position: relative;
  margin-bottom: 0.93vw;
  line-height: 5.6vw;
  white-space: nowrap;
  color: #ff0036;
  font-size: 4vw;
  font-weight: 600;
  align-self: baseline;
}

.ft {
  display: flex;
  position: relative;
  align-items: center;
  align-self: center;
  flex-direction: row;
  margin-top: 0.13vw;
  width: 42.13vw;
  height: 8vw;
}

.block {
  display: flex;
  align-items: center;
  flex-direction: row;
  margin-right: 1.33vw;
  border-width: 1px;
  border-style: solid;
  border-radius: 0.53vw;
  border-color: #ff0036;
  background-color: rgba(255, 0, 54, 0.1);
  width: 20.4vw;
  height: 8vw;
}

.wrap {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: center;
  width: 7.07vw;
  height: 4.4vw;
}

.word {
  max-width: 5.47vw;
  height: 4.4vw;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 4.4vw;
  white-space: nowrap;
  color: #ff0036;
  font-size: 3.2vw;
  font-weight: 400;
}

.verticalLine {
  margin-right: 0.13vw;
  width: 0.13vw;
  height: 7.33vw;
}

.priceWrap {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: center;
  width: 13.07vw;
  height: 4.4vw;
}

.price {
  max-width: 11.47vw;
  height: 4.4vw;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 4.4vw;
  white-space: nowrap;
  color: #ff0036;
  font-size: 3.2vw;
  font-weight: 400;
}

.tagWrap {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: center;
  border-radius: 0.53vw;
  background-color: #ff0036;
  width: 20.4vw;
  height: 8vw;
}

.tag {
  max-width: 18.8vw;
  height: 4.4vw;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 4.4vw;
  white-space: nowrap;
  color: #ffffff;
  font-size: 3.2vw;
  font-weight: 400;
}