/* 8.19-25 开学礼：统一 act- 前缀 */

.act-page{background-color:var(--color-primary);}
.act-page input,
.act-page button{background:transparent;border:none;padding:0;margin:0;outline:none;}
.act-page img{max-width:100%;display:block;-webkit-user-drag:none;}

.act-img{position:relative;}
.act-btn-img{
  padding:0;
  margin:0;
  background-color:transparent;
  transition:transform 300ms;
  cursor:pointer;
  display:block;
}
.act-btn-img:hover{transform:scale(1.08);}
.act-btn-img img{width:auto;height:auto;max-width:none;display:block;}

.act-banner{
  height:1082px;
  min-width:var(--container-width);
  margin:0 auto;
  position:relative;
  background-position:center top;
  background-repeat:no-repeat;
  background-size:1920px 1082px;
}

.act-main{
  background-color:var(--color-primary);
  background-position:center top;
  background-repeat:no-repeat;
  background-size:1920px auto;
  padding-bottom:1.2rem;
  margin-top:-1px;
  min-width:var(--container-width);
  display:flow-root;
  position:relative;
  z-index:1;
}

.act-mod{
  display:block;
  position:relative;
  width:var(--container-width);
  margin:var(--row-space) auto 0;
}
.act-mod > .act-wrap{
  max-width:var(--container-width);
  margin:0 auto;
  position:relative;
}
.act-mod .act-img > img:not(.act-lion){width:100%;height:auto;display:block;}

/* 模块1：开学礼包，上移叠入 banner 底部波浪 */
.act-mod-1{
  position:relative;
  /* top:-96px; */
  margin-top:0;
  /* margin-bottom:-96px; */
  z-index:2;
}
.act-mod-1 .act-rule{
  position:absolute;
  top:25.8%;
  left:1.6%;
  z-index:3;
}
.act-mod-1 .act-claim{
  position:absolute;
  top:60%;
  right:3.6%;
  width:305px;
  height:98px;
  transform:translateY(-50%);
  z-index:3;
}
.act-mod-1 .act-claim img{
  display:block;
  width:305px;
  height:98px;
  max-width:none;
}
.act-mod-1 .act-claim:hover{transform:translateY(-50%) scale(1.06);}

/* 模块2：转盘 */
.act-mod-lottery{margin-top:12px;z-index:2;}
.act-wheel{
  position:absolute;
  left:50%;
  top:22%;
  transform:translateX(-50%);
  z-index:2;
}
.act-page .lottery-target{width:auto;height:auto;max-width:none;display:block;}
.lottery-button{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-63%);
  z-index:3;
}
.lottery-button:hover{transform:translate(-50%,-63%) scale(1.08);}
.act-page .act-lion{
  position:absolute;
  right:6.2%;
  top:59%;
  width:auto;
  max-width:none;
  z-index:4;
  pointer-events:none;
}
.act-lottery-actions{
  position:absolute;
  left:50%;
  top:85%;
  transform:translateX(-50%);
  display:flex;
  justify-content:center;
  align-items:center;
  gap:20px;
  z-index:5;
}

/* 移动端：750 设计稿，切图像素 / 100 = rem；banner、bg 仍通栏 */
@media (max-width:750px){
  html,body{
    width:100%;
    overflow-x:hidden;
  }
  .act-page{
    width:100%;
    overflow-x:hidden;
  }
  .act-banner{
    width:100%;
    min-width:0;
    height:9.36rem;
    background-size:100% 9.36rem;
    z-index:0;
  }
  .act-main{
    width:100%;
    min-width:0;
    box-sizing:border-box;
    background-size:100% auto;
    padding:0 .26rem .8rem;
    overflow:visible;
    z-index:2;
  }
  .act-mod{
    width:100%;
    max-width:6.98rem;
    margin-left:0;
    margin-right:0;
    box-sizing:border-box;
  }
  .act-mod > .act-wrap{
    width:100%;
    max-width:100%;
  }
  .act-mod .act-img{
    width:100%;
    overflow:visible;
  }
  .act-mod .act-img > img:not(.act-lion){
    display:block;
    width:100%;
    height:auto;
    max-width:100%;
  }
  .act-btn-img:hover,
  .lottery-button:hover,
  .act-mod-1 .act-claim:hover{transform:none;}

  /* 1-m.png 697x302；上移叠在 banner 底部波浪上，且盖住波浪 */
  .act-mod-1{
    top:0;
    margin:-.2rem 0 .2rem;
    z-index:2;
  }
  .act-mod-1 .act-img > img{
    width:6.97rem;
    height:3.02rem;
    max-width:100%;
  }
  .act-mod-1 .act-rule{
    top:.32rem;
    left:.12rem;
    width:1.05rem;
  }
  .act-mod-1 .act-rule img{
    width:1.05rem;
    height:.39rem;
    max-width:none;
  }
  .act-mod-1 .act-claim{
    top:1.45rem;
    right:.2rem;
    width:2.41rem;
    height:.77rem;
    transform:none;
  }
  .act-mod-1 .act-claim img{
    display:block;
    width:2.41rem;
    height:.77rem;
    max-width:none;
  }

  /* 2-m.png 698x814 */
  .act-mod-lottery{margin:.16rem 0 0;}
  .act-mod-lottery .act-img > img:not(.act-lion){
    width:6.98rem;
    height:8.14rem;
    max-width:100%;
  }
  .act-wheel{
    top:1.8rem;
    left:50%;
    width:4.47rem;
    transform:translateX(-50%);
  }
  .act-page .lottery-target{
    width:4.47rem;
    height:4.47rem;
    max-width:none;
  }
  .lottery-button{
    width:1.35rem;
    transform:translate(-50%,-63%);
  }
  .lottery-button img{
    width:1.35rem;
    height:1.82rem;
    max-width:none;
  }
  .act-page .act-lion{
    right:.5rem;
    top:4.4rem;
    width:1.49rem;
    height:1.8rem;
    max-width:none;
  }
  .act-lottery-actions{
    top:6.4rem;
    left:50%;
    width:auto;
    gap:.18rem;
    transform:translateX(-50%);
  }
  .act-lottery-actions .act-btn-img{width:2.75rem;}
  .act-lottery-actions .act-btn-img img{
    width:2.75rem;
    height:.89rem;
    max-width:none;
  }
}