@import "../../res.less";

.renewmodule {
  width: 750px;
  height: 1624px;
  left: 0px;
  top: calc(100vh - 1624px);
  position: absolute;

  .bg {
    width: 750px;
    height: 821px;
    left: 0px;
    top: 803px;
    position: absolute;
    .sparkBg("renewModule/bg.png");
  }

  .headline {
    width: 351px;
    height: 81px;
    left: 79px;
    top: 854px;
    position: absolute;
    .sparkBg("renewModule/headline.png");
  }

  .use {
    width: 705px;
    height: 137px;
    left: 22px;
    top: 1443px;
    position: absolute;
    .sparkBg("renewModule/use.png");
  }

  .choice_credits {
    width: 688px;
    height: 201px;
    left: 34px;
    top: 1060px;
    position: absolute;

    .bg1 {
      width: 688px;
      height: 201px;
      left: 0px;
      top: 0px;
      position: absolute;
      .sparkBg("renewModule/bg1.png");
    }

    .bg2 {
      width: 688px;
      height: 201px;
      left: 0px;
      top: 0px;
      position: absolute;
      .sparkBg("renewModule/bg2.png");
    }

    .tip1 {
      width: 143px;
      height: 23px;
      left: 42px;
      top: 30px;
      position: absolute;
      font-size: 23px;
      line-height: 23px;
      color: rgba(255, 255, 255, 1);
    }

    .credits {
      width: 688px;
      height: 26px;
      // left: 229px;
      top: 132px;
      text-align: center;
      position: absolute;
      font-size: 23px;
      line-height: 23px;
      color: rgba(0, 0, 0, 1);
      .lineClamp1();
    }

    .consume_credits {
      width: 688px;
      height: 40px;
      // left: 126px;
      top: 88px;
      font-weight: bold;
      text-align: center;
      position: absolute;
      font-size: 37px;
      line-height: 37px;
      color: rgba(0, 0, 0, 1);
      .lineClamp1();

      .count1 {
        color: red;
      }
    }
  }

  .choice_qg {
    width: 688px;
    height: 201px;
    left: 34px;
    top: 1246px;
    position: absolute;

    .bg3 {
      width: 688px;
      height: 201px;
      left: 0px;
      top: 0px;
      position: absolute;
      .sparkBg("renewModule/bg1.png");
    }

    .bg4 {
      width: 688px;
      height: 201px;
      left: 0px;
      top: 0px;
      position: absolute;
      .sparkBg("renewModule/bg2.png");
    }

    .tip2 {
      width: 143px;
      height: 23px;
      left: 42px;
      top: 29px;
      position: absolute;
      font-size: 23px;
      line-height: 23px;
      color: rgba(255, 255, 255, 1);
    }

    .qg {
      width: 688px;
      height: 26px;
      // left: 232px;
      top: 131px;
      text-align: center;
      position: absolute;
      font-size: 23px;
      line-height: 23px;
      color: rgba(0, 0, 0, 1);
      .lineClamp1();
    }

    .consume_qg {
      width: 688px;
      height: 40px;
      // left: 126px;
      top: 87px;
      font-weight: bold;
      text-align: center;
      position: absolute;
      font-size: 37px;
      line-height: 37px;
      color: rgba(0, 0, 0, 1);
      .lineClamp1();

      .count2 {
        color: red;
      }
    }
  }

  .title2 {
    width: 750px;
    height: 27px;
    // left: 272px;
    top: 1025px;
    text-align: center;
    position: absolute;
    font-size: 27px;
    line-height: 27px;
    color: rgba(0, 0, 0, 1);

    .special {
      font-weight: bold;
    }
  }

  .title1 {
    width: 750px;
    height: 53px;
    // left: 192px;
    top: 960px;
    text-align: center;
    position: absolute;
    font-weight: bold;
    font-size: 56px;
    line-height: 53px;
    color: rgba(0, 0, 0, 1);
  }

  .close {
    left: 20px;
    top: 740px;
    width: 28px;
    height: 43px;
    position: absolute;
    .sparkBg("renewModule/返回.png");
  }
}