.main-app {
  width: 100%;
  height: 100%;
  position: static;

  .main-wrapper {
    height: 100%;
    width: 100%;

    .main-header {
      height: 60px;
      line-height: 60px;
      background: #017BCE;
      padding: 0 20px;

      .p {
        font-size: 24px;
        color: #ffffff;
        float: left;
      }

      .div {
        float: right;
        color: #FFFFFF;

        img {
          width: 24px;
          height: 24px;
          vertical-align: middle;
          margin: -3px 8px 0;
        }
      }
    }

    .main-body {
      position: inherit;
      height: calc(100% - 60px);
      background: #E0E2E4;

      .main-nav {
        height: 100%;
        width: 230px;
        float: left;
        transition: width .3s linear;
        overflow: hidden;
        background-color: #ffffff;
        box-shadow: 2px 0px 6px 0px rgba(0, 21, 41, 0.12);

        .el-menu {
          border-right: none;

          .el-submenu__title {
            height: 40px;
            line-height: 40px;
            color: #000000;
            font-size: 16px;

            .fa {
              color: #1E70FE;
              margin-right: 8px;
            }

            .el-submenu__icon-arrow {
              font-weight: bold;
              font-size: 16px;
              margin-top: -8px;
              right: 16px;
            }
          }

          .el-menu-item {
            height: 40px;
            line-height: 40px;
            font-size: 14px;
            color: #000000;
          }

          &.el-menu--inline {
            background-color: #F3F6F8;
          }
        }

        .el-menu-item {
          color: #000000;

          &.is-active {
            background-color: #D6D6D6;
            color: #000000 !important;
          }

          &:hover {
            background: #D6D6D6;
          }
        }
      }

      .main-content {
        height: 100%;
        overflow: auto;

        .main-page {
          padding: 20px;
          height: 100%;
          box-sizing: border-box;
          display: flex;
          flex-direction: column;

          .main-page-header {
            background: #FFFFFF;
            margin-bottom: 20px;
            padding: 20px 32px 6px;

            .title {
              font-size: 20px;
              color: rgba(0, 0, 0, 0.87);
              line-height: 20px;
              margin-bottom: 33px;
            }

            .btns {
              float: right;
            }
          }

          .main-page-body {
            background-color: #FFFFFF;
            overflow: auto;
            flex: 1;
          }
        }

        // .btn_type1 {
        //   background: #2875CA;

        //   &:hover {
        //     background: #1f4977;
        //   }
        // }

        // .btn_type2 {
        //   border-color: #B2B2B2;
        // }
      }
    }
  }
}



.main-table {

  .el-table {

    th,
    td {
      padding: 0;
    }

    th {
      .cell {
        font-weight: normal;
        color: #646464;
        background: #F6F1D9;
        line-height: 40px;
        height: 40px;
      }
    }

    td {
      .cell {
        color: #333333;
        line-height: 30px;
        height: 30px;
      }
    }
  }


  .main-table-pagination {
    text-align: right;
    margin-top: 16px;

    .el-pagination {}
  }
}

.el-form-item--small.el-form-item {
  margin-bottom: 20px;
}

.el-checkbox__label {
  padding-left: 5px;
}

.el-input__inner {
  padding: 0 5px;
}

.el-radio__inner::after {
  background: #40a2de;
  width: 8px;
  height: 8px;
}

.el-radio__label {
  padding-left: 5px;
}

.el-form-item__label {
  padding-right: 10px;
}

.el-tooltip__popper.is-dark {
  opacity: 0.7;
}

.noData {
  margin: 0 auto;
  background: url("../images/CoverPage.png") no-repeat center;
  height: 350px;
}