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

.rulepop {
  width: 550px;
  height: 1000px;
  left: 0px;
  top: 0px;
  position: absolute;

  .beiJing {
    width: 550px;
    height: 1000px;
    left: 0px;
    top: 0px;
    position: absolute;
    .sparkBg("rulePop/背景.png");

    &.two {
      .sparkBg("rulePop/背景2.png");
    }
  }

  .close_btn {
    width: 54px;
    height: 54px;
    left: 50%;
    transform: translateX(-50%);
    top: 1050px;
    position: absolute;
    .sparkBg("rulePop/close_btn.png");
    opacity: 0.4;
  }

  .btn {
    width: 312px;
    height: 99px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: left top;

    &.anNiu {
      left: 117px;
      top: 868px;
      position: absolute;
    }

    &.anNiu1 {
      left: 117px;
      top: 458px;
      position: absolute;
    }

    &.anNiu2 {
      left: 117px;
      top: 869px;
      position: absolute;
    }
  }

  .txt {
    font-size: 28px;
    color: #904000;
    word-break: break-all;
    overflow-y: auto;

    /* 修改整个滚动条的宽度和颜色 */
    &::-webkit-scrollbar {
      // display: none;
      width: 9px;
      border-radius: 10px;
    }

    /* 修改滚动条轨道的颜色 */
    &::-webkit-scrollbar-track {
      background: #fae5bb;
      border-radius: 10px;
    }

    /* 修改滑块（可拖动的部分）的颜色 */
    &::-webkit-scrollbar-thumb {
      background: #fcae77;
      border-radius: 10px;
    }
  }

  .ruleInfo {
    width: 465px;
    height: 625px;
    left: 47px;
    top: 184px;
    position: absolute;
    padding: 0 6px;
    box-sizing: border-box;
  }

  .ruleInfo1,
  .ruleInfo2 {
    width: 455px;
    padding: 0 6px;
    box-sizing: border-box;
    left: 48px;
  }

  .ruleInfo1 {
    height: 282px;
    top: 169px;
    position: absolute;
  }

  .ruleInfo2 {
    height: 268px;
    top: 595px;
    position: absolute;
  }
}

.ruleInfo table {
  width: 100%;
  border-collapse: collapse;
  margin: 12px 0;
  border: none;
}

.ruleInfo table th,
.ruleInfo table td {
  position: relative;
  border: none;
  padding: 8px;
  font-size: 14px;
  line-height: 1.5;
  color: #333;
}

.ruleInfo th {
  font-weight: bold;
}

/* 表格内链接样式 */
.ruleInfo table a {
  color: #1677ff;
  text-decoration: none;
}

.ruleInfo table a:hover {
  color: #4096ff;
  text-decoration: underline;
}

/* 备用方案：用伪元素绘制边框 */
.ruleInfo td::after,
.ruleInfo th::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 200%;
  height: 200%;
  border: 1px solid #000;
  transform: scale(0.5);
  transform-origin: 0 0;
  pointer-events: none;
  box-sizing: border-box;
}
