.chart-demo {
  display: flex;
  width: 100%;
  flex-flow: row;
  margin-top: 24px;
  padding: 0 16px;
}

.demo-left {
  width: 400px;
  height: calc(100vh - 100px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.demo-center {
  width: 400px;
  height: calc(100vh - 100px);
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  margin-left: 24px;
  margin-right: 24px;
  justify-content: space-between;
}

.demo-right {
  width: 400px;
  height: calc(100vh - 100px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.demo-card-item {
  flex: 1;
  margin-bottom: 10px;
  background-color: #fff;

  .item-title {
    width: 100%;
    border-bottom: 1px solid rgb(240, 240, 240);
    height: 36px;
    font-size: 18px;
    line-height: 36px;

    p {
      margin-left: 10px;
    }
  }

  .item-container {
    width: 100%;
    height: 80%;
  }
}