.main {
  width: 100%;
  .table-header {
    display: flex;
    height: 100px;
    color: #00ffff;
    border: 1px solid #00ffff;
    border-right: none;
    .fiexd-column {
      height: 98px;
      line-height: 98px;
    }
    .generate-column {
      display: flex;
      flex: 1;
      .table-cell {
        flex: 1;
      }
    }
  }

  .table-cell {
    height: 100%;
    font-size: 20px;
    text-align: center;
    border-right: 1px solid #00ffff;
  }
  .column-name {
    height: 50px;
    line-height: 50px;
    border-bottom: 1px solid #00ffff;
  }

  .real-num,
  .plan-num {
    flex: 1;
    line-height: 48px;
  }
  .real-num {
    border-right: 1px solid #00ffff;
  }

  .table-body {
    overflow: hidden;
    font-size: 20px;
    text-align: center;
    .row-container {
      display: flex;
      height: 50px;
      border-bottom: 1px solid #00ffff;
      border-left: 1px solid #00ffff;

      .generate-column {
        display: flex;
        flex: 1;
      }
      .table-b-cell {
        display: flex;
        flex: 1;
        height: 50px;
        line-height: 48px;
        text-align: center;
        border-right: 1px solid #00ffff;
        .item-cell {
          flex: 1;
          &:first-child {
            border-right: 1px solid #00ffff;
          }
        }
      }
      .flex-column {
        .table-b-cell {
          display: block;
        }
      }
    }
  }

  .table-footer {
    .row-container {
      display: flex;
      height: 50px;
      border-bottom: 1px solid #00ffff;
      border-left: 1px solid #00ffff;
    }
  }
}
