.leftBox {
  height: vh(526);
  box-sizing: border-box;
  padding: vh(20) vw(20);
  background-image: url('@/assets/svg/Operation/LeftTop/Box.svg');
  background-size: 107%;
  background-position: center;
  background-repeat: no-repeat;

  .echartsContainer {
    width: vw(230);
    height: vh(230);
    margin: vh(20) auto;
  }

  .bottomBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: vw(496);
    height: vh(172);
    padding: vh(24) vw(30) 0;
    margin: vh(50) auto 0;
    background: linear-gradient(180deg, #F2F3FA 0%, #EAE9FE 100%);
    box-sizing: border-box;
    border: 2px solid #EDE9F4;

    .top {
      >div {
        div {
          font-size: vw(16);
          color: #302D32;
          margin-left: vw(8);
        }
      }

      p {
        font-size: vw(28);
        color: #605C68;

        span {
          font-size: vw(44);
          color: #5D49AF;
          vertical-align: baseline;
        }
      }
    }

    .bottom {
      >div {
        width: vw(276);
        height: vh(48);
        padding: 0 vw(24);
        background: linear-gradient(272deg, rgba(93, 73, 175, 0.045) 2%, rgba(93, 73, 175, 0.066) 99%);
        border: 1px solid;
        border-image: linear-gradient(160deg, rgba(158, 136, 246, 0.4) -10%, rgba(93, 73, 175, 0) 41%) 1.5;
        display: flex;
        align-items: center;
        justify-content: space-between;

        .left {
          display: flex;
          align-items: center;

          span {
            font-size: vw(16);
            color: #571273;
            margin-left: vw(4);
          }
        }

        .right {
          font-size: vw(12);
          color: #571273;

          span {
            font-weight: 500;
            font-size: vw(26);
            color: #5D49AF;
            vertical-align: baseline;
          }
        }

        &:first-child {
          margin-bottom: vh(24);
        }
      }
    }
  }
}
