html,
    body {
      margin: 0;
      padding: 0;
    }
    * {
      box-sizing: border-box;
    }
    a {
      text-decoration: none;
    }
    .container {
      display: flex;
      flex-direction: column;
      padding: 20px 10px;
      width: 100%;
      margin-bottom: 60px;
    }

    .chart {
      margin-top: 24px;
    }

    .chart1 {
      height: 120px;
    }

    .chart2 {
      height: 200px;
    }

    .chart3 {
      display: flex;
    }

    .chart3-1,
    .chart3-2 {
      height: 140px;
      flex: 1;
    }
    .chart4 {
      height: 160px;
    }
    .footer{
      background:rgba(242, 243, 246, .9);
      max-width: 750px;
      width: 100%;
      height: 60px;
      position:fixed;
      bottom:0;
      z-index:999;
      display: none;
    }
    .item {
      flex: 1;
      text-align: center;
      line-height: 60px;
      font-size: 28px;
      color: #ddd;
    }
    .item.active {
      color: #1859ff;
    }