cyber-narrator-cn-ui/src/assets/css/components/views/charts/chartEchartAppRelateDomain.scss

.cn-panel2 {
  position: relative;
  .chart-list {
    .vue-grid-layout > .vue-grid-item {
      .cn-chart {
        .app-detail__related-domain {
          display: flex;
          flex-direction: row;
          height: 100%;
          width: 100%;
          .related-domain__list {
            display: flex;
            flex-direction: column;
            flex: 0 0 25%;
            overflow: auto;
            padding-bottom: 20px;
            border-bottom: 1px solid $--right-box-border-color;

            .related-domain__list-title {
              padding: 13px 30px 0;
              height: 40px;
              color: #6B717B;
            }

            .related-domain__list-body {
              display: flex;
              flex-direction: column;
              height: calc(100% - 40px);
              overflow: hidden auto;
            }

            .related-domain__list-row {
              padding: 5px 30px;
              color: #3976CB;

              i {
                color: #B8C1D1;
              }
            }
          }

          .related-domain__chart {
            display: flex;
            flex-direction: row;
            flex: 1;

            & > div {
              flex: 0 0 50%;
              display: flex;
              flex-direction: column;

              .related-domain__chart-title {
                padding-left: 20px;
                line-height: 50px;
                flex: 0 0 50px;
              }

              .chart-drawing {
                flex: 1;
              }
            }
          }
        }
      }
    }
  }
}
.cn-panel2 .chart-list > .vue-grid-layout > .vue-grid-item > .panel-chart .chart-header {
  border-bottom: 1px solid $--right-box-border-color;
}
.cn-panel2 .chart-list > .vue-grid-layout > .vue-grid-item > .panel-chart .chart-header.is-group-collapse {
  border-bottom: none;
}