@charset "utf-8";

[v-cloak] {
  display: none !important;
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  scroll-behavior: smooth;
}

body {
  background: linear-gradient(180deg, #eef8af 0%, #f4ffe4 15.86%, #e5fff0 100%);
}

#springActivity {
  position: relative;
}

#springActivity .top-banner {
  width: 100%;
  height: 600px;
}

#springActivity .top-banner img {
  width: 100%;
  height: 100%;
}

#springActivity .welfare-one {
  width: 100%;
  padding-top: 50px;
  background: linear-gradient(to bottom, #f4ffe4, #e5fff0);
}

#springActivity .welfare-two {
  width: 100%;
  padding-top: 80px;
  background: #e5fff0;
}

#springActivity .welfare-tre {
  width: 100%;
  padding-top: 80px;
  background: #e5fff0;
}

#springActivity .center-info {
  width: 1200px;
  margin: 0 auto;
}

#springActivity .one-bgi {
  height: 1157px;
  background: url("/static/v2/img/activeArea/spring-one.webp") no-repeat 100%/100%;
}

#springActivity .two-bgi {
  height: 958px;
  background: url("/static/v2/img/activeArea/spring-two.webp") no-repeat 100%/100%;
}

#springActivity .tre-bgi {
  height: 780px;
  background: url("/static/v2/img/activeArea/spring-tre.webp") no-repeat 100%/100%;
}

#springActivity .center-info .info-content {
  width: 100%;
  padding: 193px 50px 40px;
}

#springActivity .center-info .info-content .content-tips {
  margin-bottom: 20px;
  padding: 20px;
  font-family: Source Han Sans CN, Source Han Sans CN;
  font-weight: 600;
  font-size: 16px;
  color: #16603e;
  background: linear-gradient(180deg, #ffffff 0%, #f3f6e1 100%);
  border-radius: 20px 20px 20px 20px;
}

#springActivity .center-info .info-content .content-tips span {
  color: #ff5d37;
}

#springActivity .center-info .info-content .coupon-data {
  margin-bottom: 20px;
  padding: 50px 40px 40px;
  background: linear-gradient(180deg, #ffffff 0%, #f3f6e1 100%);
  border-radius: 20px 20px 20px 20px;
}

#springActivity .center-info .info-content a {
  display: block;
}

#springActivity .welfare-one .center-info .info-content .coupon-info {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 30px;
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item {
  position: relative;
  width: 320px;
  height: 210px;
  padding: 0 30px;
  /* background: url("/static/v2/img/activeArea/coupon-bgi.png") no-repeat 100%/100%; */
}

#springActivity .welfare-one .center-info .info-content .coupon-info .bgi1 {
  background: url("/static/v2/img/activeArea/coupon-bgi1.png") no-repeat 100%/100%;
}

#springActivity .welfare-one .center-info .info-content .coupon-info .bgi2 {
  background: url("/static/v2/img/activeArea/coupon-bgi2.png") no-repeat 100%/100%;
}

#springActivity .welfare-one .center-info .info-content .coupon-info .bgi3 {
  background: url("/static/v2/img/activeArea/coupon-bgi3.png") no-repeat 100%/100%;
}
#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-tip {
  position: absolute;
  top: 1px;
  right: 1px;
  width: 44px;
  height: 29px;
  font-family: Alimama ShuHeiTi, Alimama ShuHeiTi;
  font-weight: 700;
  font-size: 20px;
  color: #ff5d37;
  text-align: center;
  line-height: 29px;
  background: #ffe0d9;
  border-radius: 0 7px 0 7px;
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item
  .name {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 30px;
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item
  .name
  .txt {
  font-family: Alimama ShuHeiTi, Alimama ShuHeiTi;
  font-weight: 700;
  font-size: 100px;
  color: #fe270b;
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item
  .name
  .discount {
  width: 38px;
  height: 38px;
  margin-top: 25px;
  margin-left: 8px;
  font-family: Source Han Sans, Source Han Sans;
  font-weight: 600;
  font-size: 24px;
  color: #ffffff;
  text-align: center;
  line-height: 38px;
  background-color: #fe270b;
  border-radius: 50%;
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item
  .get-coupon {
  position: absolute;
  left: 50%;
  bottom: 15px;
  transform: translateX(-50%);
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item
  .get-coupon
  .coupon-btns {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 154px;
  height: 29px;
  margin: 0 auto;
  font-family: DIN, DIN;
  font-weight: 700;
  font-size: 18px;
  color: #ffffff;
  background: #ff5d37;
  border-radius: 19px 19px 19px 19px;
  cursor: pointer;
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item
  .get-coupon
  .coupon-btns:hover {
  color: #ff5d37;
  background: #ffebde;
  border-radius: 19px 19px 19px 19px;
  border: 1px solid #ff5d37;
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item
  .get-coupon
  .coupon-btns
  a:hover {
  color: #ff5d37;
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item
  .get-coupon
  .coupon-btns
  img {
  width: 16px;
  height: 16px;
  margin-left: 8px;
}

#springActivity
  .welfare-one
  .center-info
  .info-content
  .coupon-info
  .coupon-item
  .type {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 15px;
  width: 100%;
  display: flex;
  justify-content: center;
  font-family: Source Han Sans, Source Han Sans;
  font-weight: 350;
  font-size: 18px;
  color: #ce1f08;
}

#springActivity .center-info .info-content .get-btn {
  width: 580px;
  height: 60px;
  margin: 0 auto;
  font-family: Source Han Sans, Source Han Sans;
  font-weight: 600;
  font-size: 20px;
  color: #ffffff;
  text-align: center;
  line-height: 60px;
  background: linear-gradient(137deg, #ff3b27 0%, #fdb166 100%);
  border-radius: 30px 30px 30px 30px;
  cursor: pointer;
}

#springActivity .center-info .info-content .get-btn:hover {
  z-index: 2;
  -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
  -webkit-transform: translate3d(0, -2px, 0);
  transform: translate3d(0, -2px 0);
}

#springActivity .center-info .info-content .common {
  padding: 49px 20px 40px;
  background: linear-gradient(180deg, #ffffff 0%, #f3f6e1 100%);
  border-radius: 20px 20px 20px 20px;
}

#springActivity .center-info .info-content .common .common-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 22px;
}

#springActivity .center-info .info-content .common .common-top .common-title {
  font-family: Source Han Sans CN, Source Han Sans CN;
  font-weight: 700;
  font-size: 28px;
  color: #3d3d3d;
}

#springActivity .center-info .info-content .common .common-top .all-project {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 200px;
  height: 42px;
  font-family: Source Han Sans, Source Han Sans;
  font-weight: 600;
  font-size: 18px;
  color: #fff;
  background: linear-gradient(137deg, #ff3b27 0%, #fdb166 100%);
  border-radius: 0px 40px 40px 0px;
  cursor: pointer;
}

#springActivity
  .center-info
  .info-content
  .common
  .common-top
  .all-project:hover {
  color: #eef1ec;
}

#springActivity
  .center-info
  .info-content
  .common
  .common-top
  .all-project
  img {
  width: 12px;
  height: 16px;
  margin-left: 6px;
}

#springActivity .center-info .info-content .common .welfare-project {
  width: 1060px;
  height: 236px;
  background: url("/static/v2/img/activeArea/discount-bgi.webp") no-repeat 100%/100%;
}

#springActivity .center-info .info-content .common .project-two {
  height: 289px;
  margin-bottom: 20px;
  background: url("/static/v2/img/activeArea/welfare-project-two.png") no-repeat
    100%/100%;
}

#springActivity .welfare-precautions .center {
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
}

#springActivity .center-info .info-content .prize-data {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* margin-bottom: 40px; */
}

#springActivity .center-info .info-content .prize-data .prize-list {
  display: flex;
  flex-wrap: wrap;
}

#springActivity .center-info .info-content .prize-data .prize-list .prize-item {
  width: 165px;
  margin-right: 60px;
  margin-bottom: 24px;
  text-align: center;
}

#springActivity
  .center-info
  .info-content
  .prize-data
  .prize-list
  .prize-item:nth-child(4n) {
  margin-right: 0;
}

#springActivity
  .center-info
  .info-content
  .prize-data
  .prize-list
  .prize-item
  img {
  width: 150px;
  height: 150px;
  margin-bottom: 16px;
}

#springActivity
  .center-info
  .info-content
  .prize-data
  .prize-list
  .prize-item
  span {
  font-family: Source Han Sans CN, Source Han Sans CN;
  font-weight: 600;
  font-size: 16px;
  color: #333333;
}

#springActivity .center-info .info-content .prize-data .draw-qrcode {
  text-align: center;
}

#springActivity .center-info .info-content .prize-data .draw-qrcode img {
  width: 190px;
  height: 190px;
  margin-bottom: 13px;
}

#springActivity .center-info .info-content .prize-data .draw-qrcode span {
  font-family: Source Han Sans CN, Source Han Sans CN;
  font-weight: 600;
  font-size: 24px;
  color: #333333;
}

#springActivity .welfare-precautions {
  width: 100%;
  padding: 100px 0;
  background: #e5fff0;
}

#springActivity .welfare-precautions .mattersNeedAttention {
  width: 165px;
  height: 49px;
  margin: 0 auto;
  margin-bottom: 37px;
}

/* 给整个注意事项外层容器 */
.rule-list {
  /* height: 300px; */
  padding: 20px;
  background: linear-gradient(180deg, #eaffdd 0%, #f3f6e1 100%);
  border-radius: 20px 20px 20px 20px;
  list-style-position: inside; /* 序号放在内容区域内 */
}

/* 每条规则 */
.rule-list li {
  display: flex;
  font-family: Source Han Sans, Source Han Sans;
  font-weight: 350;
  font-size: 16px;
  color: #000000;
  align-items: baseline; /* 文字基线对齐，更美观 */
  text-align: justify;
  line-height: 32px;
  margin-bottom: 10px;
}

/* 序号 1. 2. 3. 4. */
.rule-list li::before {
  content: counter(list-item) ". ";
  counter-increment: list-item;
  min-width: 24px; /* 固定序号宽度 */
  flex-shrink: 0;
  margin-right: 4px;
}

#springActivity .mask-layer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  /* 半透明黑色 */
  z-index: 9999;
  /* 确保在最上层 */
  display: flex;
  justify-content: center;
  align-items: center;
}

/* 遮罩层内容容器：阻止点击事件冒泡到遮罩层 */
#springActivity .mask-content {
  width: 1180px;
  height: 736px;
  padding: 20px;
  padding-top: 60px;
  background: url("/static/v2/img/activeArea/popup-bgi.webp") no-repeat 100%/100%;
}

#springActivity .mask-content .table-title {
  display: flex;
  height: 56px;
  background: #83c34c;
  border-radius: 10px 10px 0px 0px;
  border: 1px solid #ffffff;
}

#springActivity .mask-content .table-title p {
  font-family: Source Han Sans, Source Han Sans;
  font-weight: 600;
  font-size: 14px;
  color: #fff;
  text-align: center;
  line-height: 56px;
}

#springActivity .mask-content .table-title .width-discount {
  width: 200px;
}

#springActivity .mask-content .table-title .width-name {
  width: 296px;
}

#springActivity .mask-content .table-title .width-money {
  width: 170px;
}

#springActivity .mask-content .roll-view {
  width: 100%;
  height: 600px;
  overflow: hidden;
  overflow-y: auto;
}

#springActivity .mask-content .roll-view .roll-content {
  width: 100%;
  height: 1020px;
  background: url("/static/v2/img/activeArea/all-project-img.png") no-repeat
    100%/100%;
}
