/* 메인 컨테이너: 전체 화면 크기로 설정 */
.figma-design-main {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    border: .1rem solid #000000;
}

    /* 오버랩 요소: 뷰포트에 맞게 설정 */
    .figma-design-main .overlap{
       width: 100%;
       height: calc(100vh - 14rem); /* 상단바 높이 제외 */
       display: flex;
       margin-top: 13.6rem;
    }
    .figma-design-main .overlap-group {
        width: 77%;
        height: 100%; /* 상단바 높이 제외 */
        display: flex;
    }
    /* 오버랩 요소: 뷰포트에 맞게 설정 */
    .figma-design-main .overlap_DETAIL {
      position:relative;
      width: 100%;
      height: 100%;
    }
    .figma-design-main .overlap-group_DETAIL {
        position: absolute;
        width: 100%;
        height: calc(100vh - 13.6rem); /* 상단바 높이 제외 */
        top: 13.6rem;
        left: 0;
    }
    /* 왼쪽 사이드 바 */
    .figma-design-main .main-background {
        /* position: absolute; */
        width: 20%;
        height: 100%;
        background-color: #0c1f32;
        border-right: .0rem solid #ffffff;
        overflow-x: auto;
    }
.figma-design-main .main-background span {font-size:1.4rem}
    /* 메인 리스트 영역 */
    .figma-design-main .main-list-background {
        /* position: absolute; */
        height: calc(100% - rem);
        background-color: #1e2d3c;
        border: .0rem solid #ffffff;
        /* flex: 1; */
        width: 80%;
        overflow-y: auto;
    }
.figma-design-main .preview_wrap {
  width: 25%;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  min-width: 30rem;
}
    /* 미리보기 영역 */
    .figma-design-main .preview-image {
        /* position: absolute; */
        width: 100%; /* 우측 영역 비율 */
        height: 39%;
        /* top: 1.1rem; */
        /* left: 149.1rem; */
        background-color: #000000;
        overflow: hidden;
        /* flex: 1; */
    }

.figma-design-main .list-table-variable {
  position: absolute;
  width: 118.3rem;
  height: 3.5rem;
  top: 0;
  left: 31.2rem;
}

.figma-design-main .navbar {
  position: relative;
  width: 117.1rem;
  height: 3.5rem;
  background-color: #0c1f32;
  border-right-width: .1rem;
  border-right-style: solid;
  border-color: #ffffff;
}

.figma-design-main .text-wrapper {
  position: absolute;
  height: 2.2rem;
  top: .5rem;
  left: 21.2rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .div {
  left: 52.5rem;
  position: absolute;
  height: 2.2rem;
  top: .5rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-2 {
  position: absolute;
  height: 2.2rem;
  top: .5rem;
  left: 64.9rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-3 {
  position: absolute;
  height: 2.2rem;
  top: .5rem;
  left: 83.3rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-4 {
  left: 98.5rem;
  position: absolute;
  height: 2.2rem;
  top: .5rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-5 {
  left: 107.2rem;
  position: absolute;
  height: 2.2rem;
  top: .5rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}
/*
.figma-design-main .preview-image {
  position: absolute;
  width: 43rem;
  height: 36.5rem;
  top: 0;
  left: 148.6rem;
}
*/
.figma-design-main .overlap-2 {
  position: relative;
  width: 43.6rem;
  height: 36.8rem;
  left: -.3rem;
  background-color: #000000;
}

.figma-design-main .text-wrapper-6 {
  position: absolute;
  height: 2.2rem;
  top: .7rem;
  left: .9rem;
  font-family: "Inter", Helvetica;
  font-weight: 600;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .raw-spectrum {
  position: absolute;
  width: 37.3rem;
  height: 14.1rem;
  top: 5.4rem;
  left: 4rem;
}

.figma-design-main .vector {
  position: absolute;
  width: 33rem;
  height: 12.4rem;
  top: -.2rem;
  left: 1.3rem;
}

.figma-design-main .overlap-3 {
  position: absolute;
  width: 35.7rem;
  height: 1.7rem;
  top: 12.4rem;
  left: 0;
}

.figma-design-main .overlap-group-2 {
  position: absolute;
  width: 34.5rem;
  height: 1.7rem;
  top: 0;
  left: 0;
}

.figma-design-main .img {
  position: absolute;
  width: 33.4rem;
  height: .1rem;
  top: 0;
  left: 1rem;
}

.figma-design-main .vector-2 {
  position: absolute;
  width: .1rem;
  height: .6rem;
  top: 0;
  left: 1.1rem;
}

.figma-design-main .vector-3 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 2rem;
}

.figma-design-main .vector-4 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 3rem;
}

.figma-design-main .vector-5 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 3.9rem;
}

.figma-design-main .vector-6 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 4.9rem;
}

.figma-design-main .vector-7 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 5.8rem;
}

.figma-design-main .vector-8 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 6.8rem;
}

.figma-design-main .vector-9 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 7.7rem;
}

.figma-design-main .vector-10 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 8.7rem;
}

.figma-design-main .vector-11 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 9.6rem;
}

.figma-design-main .vector-12 {
  position: absolute;
  width: .1rem;
  height: .6rem;
  top: 0;
  left: 10.6rem;
}

.figma-design-main .vector-13 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 11.6rem;
}

.figma-design-main .vector-14 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 12.5rem;
}

.figma-design-main .vector-15 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 13.5rem;
}

.figma-design-main .vector-16 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 14.4rem;
}

.figma-design-main .vector-17 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 15.4rem;
}

.figma-design-main .vector-18 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 16.3rem;
}

.figma-design-main .vector-19 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 17.3rem;
}

.figma-design-main .vector-20 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 18.2rem;
}

.figma-design-main .vector-21 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 19.2rem;
}

.figma-design-main .vector-22 {
  position: absolute;
  width: .1rem;
  height: .6rem;
  top: 0;
  left: 20.1rem;
}

.figma-design-main .vector-23 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 21.1rem;
}

.figma-design-main .vector-24 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 22rem;
}

.figma-design-main .vector-25 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 23rem;
}

.figma-design-main .vector-26 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 23.9rem;
}

.figma-design-main .vector-27 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 24.9rem;
}

.figma-design-main .vector-28 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 25.8rem;
}

.figma-design-main .vector-29 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 26.8rem;
}

.figma-design-main .vector-30 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 27.7rem;
}

.figma-design-main .vector-31 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 28.7rem;
}

.figma-design-main .vector-32 {
  position: absolute;
  width: .1rem;
  height: .6rem;
  top: 0;
  left: 29.6rem;
}

.figma-design-main .vector-33 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 30.6rem;
}

.figma-design-main .vector-34 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 31.5rem;
}

.figma-design-main .vector-35 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 32.5rem;
}

.figma-design-main .vector-36 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 33.4rem;
}

.figma-design-main .vector-37 {
  position: absolute;
  width: .1rem;
  height: .3rem;
  top: 0;
  left: 34.4rem;
}

.figma-design-main .text-wrapper-7 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 0;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #d3d4d5;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-8 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 9.5rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #d3d4d5;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-9 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 19rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #d3d4d5;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-10 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 28.4rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #d3d4d5;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-11 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 33.2rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #d3d4d5;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-12 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 23.7rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #d3d4d5;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-13 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 14.2rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #d3d4d5;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-14 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 4.7rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #d3d4d5;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .ai-predicted {
  position: absolute;
  width: 35.7rem;
  height: 11.4rem;
  top: 21.5rem;
  left: 4rem;
}

.figma-design-main .overlap-4 {
  position: absolute;
  width: 33.1rem;
  height: 9.3rem;
  top: 0;
  left: 1.4rem;
}

.figma-design-main .vector-38 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 9.2rem;
  left: 33rem;
}

.figma-design-main .vector-39 {
  position: absolute;
  width: 7.5rem;
  height: .2rem;
  top: 9rem;
  left: 25.6rem;
}

.figma-design-main .vector-40 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 9rem;
  left: 25.5rem;
}

.figma-design-main .vector-41 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 9rem;
  left: 25.4rem;
}

.figma-design-main .vector-42 {
  position: absolute;
  width: .6rem;
  height: .3rem;
  top: 9rem;
  left: 24.9rem;
}

.figma-design-main .vector-43 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 9rem;
  left: 24.8rem;
}

.figma-design-main .vector-44 {
  position: absolute;
  width: .7rem;
  height: .2rem;
  top: 9rem;
  left: 24.1rem;
}

.figma-design-main .vector-45 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 9rem;
  left: 24.1rem;
}

.figma-design-main .vector-46 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 9rem;
  left: 24rem;
}

.figma-design-main .vector-47 {
  position: absolute;
  width: .6rem;
  height: .3rem;
  top: 9rem;
  left: 23.4rem;
}

.figma-design-main .vector-48 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 9rem;
  left: 23.4rem;
}

.figma-design-main .vector-49 {
  position: absolute;
  width: 3.5rem;
  height: .6rem;
  top: 8.6rem;
  left: 19.9rem;
}

.figma-design-main .vector-50 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.6rem;
  left: 19.8rem;
}

.figma-design-main .vector-51 {
  position: absolute;
  width: .3rem;
  height: .2rem;
  top: 8.6rem;
  left: 19.6rem;
}

.figma-design-main .vector-52 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.7rem;
  left: 19.5rem;
}

.figma-design-main .vector-53 {
  position: absolute;
  width: .8rem;
  height: 8.7rem;
  top: 0;
  left: 18.7rem;
}

.figma-design-main .vector-54 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 0;
  left: 18.7rem;
}

.figma-design-main .vector-55 {
  position: absolute;
  width: .9rem;
  height: 7.8rem;
  top: 0;
  left: 17.9rem;
}

.figma-design-main .vector-56 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.8rem;
  left: 17.8rem;
}

.figma-design-main .vector-57 {
  position: absolute;
  width: .2rem;
  height: .1rem;
  top: 7.8rem;
  left: 17.8rem;
}

.figma-design-main .vector-58 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.8rem;
  left: 17.7rem;
}

.figma-design-main .vector-59 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.8rem;
  left: 17.6rem;
}

.figma-design-main .vector-60 {
  position: absolute;
  width: .3rem;
  height: .4rem;
  top: 7.8rem;
  left: 17.4rem;
}

.figma-design-main .vector-61 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.1rem;
  left: 17.4rem;
}

.figma-design-main .vector-62 {
  position: absolute;
  width: .3rem;
  height: .3rem;
  top: 7.9rem;
  left: 17.1rem;
}

.figma-design-main .vector-63 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.9rem;
  left: 17rem;
}

.figma-design-main .vector-64 {
  position: absolute;
  width: .6rem;
  height: .4rem;
  top: 8rem;
  left: 16.5rem;
}

.figma-design-main .vector-65 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.2rem;
  left: 16.4rem;
}

.figma-design-main .vector-66 {
  position: absolute;
  width: .4rem;
  height: 1rem;
  top: 7.3rem;
  left: 16.1rem;
}

.figma-design-main .vector-67 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.3rem;
  left: 16.1rem;
}

.figma-design-main .vector-68 {
  position: absolute;
  width: .3rem;
  height: 1rem;
  top: 7.3rem;
  left: 15.8rem;
}

.figma-design-main .vector-69 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.2rem;
  left: 15.8rem;
}

.figma-design-main .vector-70 {
  position: absolute;
  width: .4rem;
  height: 1.4rem;
  top: 7rem;
  left: 15.5rem;
}

.figma-design-main .vector-71 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 6.9rem;
  left: 15.5rem;
}

.figma-design-main .vector-72 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 6.9rem;
  left: 15.4rem;
}

.figma-design-main .vector-73 {
  position: absolute;
  width: .4rem;
  height: 1.5rem;
  top: 7rem;
  left: 15.1rem;
}

.figma-design-main .vector-74 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.4rem;
  left: 15rem;
}

.figma-design-main .vector-75 {
  position: absolute;
  width: .5rem;
  height: .7rem;
  top: 7.7rem;
  left: 14.6rem;
}

.figma-design-main .vector-76 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.7rem;
  left: 14.6rem;
}

.figma-design-main .vector-77 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.7rem;
  left: 14.5rem;
}

.figma-design-main .vector-78 {
  position: absolute;
  width: .2rem;
  height: .3rem;
  top: 7.8rem;
  left: 14.4rem;
}

.figma-design-main .vector-79 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.9rem;
  left: 14.3rem;
}

.figma-design-main .vector-80 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.9rem;
  left: 14.2rem;
}

.figma-design-main .vector-81 {
  position: absolute;
  width: .6rem;
  height: 1rem;
  top: 8rem;
  left: 13.6rem;
}

.figma-design-main .vector-82 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.9rem;
  left: 13.6rem;
}

.figma-design-main .vector-83 {
  position: absolute;
  width: .5rem;
  height: 1rem;
  top: 7.9rem;
  left: 13.2rem;
}

.figma-design-main .vector-84 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.9rem;
  left: 13.1rem;
}

.figma-design-main .vector-85 {
  position: absolute;
  width: .3rem;
  height: .8rem;
  top: 7.9rem;
  left: 12.9rem;
}

.figma-design-main .vector-86 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.6rem;
  left: 12.9rem;
}

.figma-design-main .vector-87 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.6rem;
  left: 12.8rem;
}

.figma-design-main .vector-88 {
  position: absolute;
  width: .2rem;
  height: .4rem;
  top: 8.3rem;
  left: 12.7rem;
}

.figma-design-main .vector-89 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.3rem;
  left: 12.7rem;
}

.figma-design-main .vector-90 {
  position: absolute;
  width: .9rem;
  height: .7rem;
  top: 8.3rem;
  left: 11.9rem;
}

.figma-design-main .vector-91 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.4rem;
  left: 11.8rem;
}

.figma-design-main .vector-92 {
  position: absolute;
  width: .3rem;
  height: .5rem;
  top: 8.5rem;
  left: 11.7rem;
}

.figma-design-main .vector-93 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.9rem;
  left: 11.6rem;
}

.figma-design-main .vector-94 {
  position: absolute;
  width: .2rem;
  height: .5rem;
  top: 8.4rem;
  left: 11.5rem;
}

.figma-design-main .vector-95 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.4rem;
  left: 11.4rem;
}

.figma-design-main .vector-96 {
  position: absolute;
  width: 1.4rem;
  height: .6rem;
  top: 8.5rem;
  left: 10.1rem;
}

.figma-design-main .vector-97 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.6rem;
  left: 10.1rem;
}

.figma-design-main .vector-98 {
  position: absolute;
  width: .3rem;
  height: .2rem;
  top: 8.6rem;
  left: 9.8rem;
}

.figma-design-main .vector-99 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.7rem;
  left: 9.8rem;
}

.figma-design-main .vector-100 {
  position: absolute;
  width: .7rem;
  height: 5.8rem;
  top: 2.9rem;
  left: 9.1rem;
}

.figma-design-main .vector-101 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 2.9rem;
  left: 9.1rem;
}

.figma-design-main .vector-102 {
  position: absolute;
  width: 1.8rem;
  height: 5.8rem;
  top: 2.9rem;
  left: 7.4rem;
}

.figma-design-main .vector-103 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 6rem;
  left: 7.4rem;
}

.figma-design-main .vector-104 {
  position: absolute;
  width: .4rem;
  height: 1.8rem;
  top: 6.1rem;
  left: 7.1rem;
}

.figma-design-main .vector-105 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.8rem;
  left: 7rem;
}

.figma-design-main .vector-106 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.8rem;
  left: 6.9rem;
}

.figma-design-main .vector-107 {
  position: absolute;
  width: .5rem;
  height: .8rem;
  top: 7.8rem;
  left: 6.5rem;
}

.figma-design-main .vector-108 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.5rem;
  left: 6.4rem;
}

.figma-design-main .vector-109 {
  position: absolute;
  width: .3rem;
  height: .4rem;
  top: 8.1rem;
  left: 6.2rem;
}

.figma-design-main .vector-110 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.1rem;
  left: 6.2rem;
}

.figma-design-main .vector-111 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.1rem;
  left: 6.1rem;
}

.figma-design-main .vector-112 {
  position: absolute;
  width: .2rem;
  height: .2rem;
  top: 8.1rem;
  left: 6rem;
}

.figma-design-main .vector-113 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.3rem;
  left: 6rem;
}

.figma-design-main .vector-114 {
  position: absolute;
  width: .3rem;
  height: .1rem;
  top: 8.3rem;
  left: 5.8rem;
}

.figma-design-main .vector-115 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.4rem;
  left: 5.7rem;
}

.figma-design-main .vector-116 {
  position: absolute;
  width: .3rem;
  height: .4rem;
  top: 8rem;
  left: 5.4rem;
}

.figma-design-main .vector-117 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8rem;
  left: 5.4rem;
}

.figma-design-main .vector-118 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8rem;
  left: 5.3rem;
}

.figma-design-main .vector-119 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.1rem;
  left: 5.2rem;
}

.figma-design-main .vector-120 {
  position: absolute;
  width: .5rem;
  height: .1rem;
  top: 8rem;
  left: 4.8rem;
}

.figma-design-main .vector-121 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8rem;
  left: 4.7rem;
}

.figma-design-main .vector-122 {
  position: absolute;
  width: .5rem;
  height: 1.8rem;
  top: 6.3rem;
  left: 4.2rem;
}

.figma-design-main .vector-123 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 6.3rem;
  left: 4.2rem;
}

.figma-design-main .vector-124 {
  position: absolute;
  width: .5rem;
  height: 2rem;
  top: 6.4rem;
  left: 3.8rem;
}

.figma-design-main .vector-125 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.3rem;
  left: 3.8rem;
}

.figma-design-main .vector-126 {
  position: absolute;
  width: .3rem;
  height: 1rem;
  top: 7.4rem;
  left: 3.5rem;
}

.figma-design-main .vector-127 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.3rem;
  left: 3.5rem;
}

.figma-design-main .vector-128 {
  position: absolute;
  width: .3rem;
  height: .8rem;
  top: 7.4rem;
  left: 3.2rem;
}

.figma-design-main .vector-129 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.1rem;
  left: 3.2rem;
}

.figma-design-main .vector-130 {
  position: absolute;
  width: .3rem;
  height: .4rem;
  top: 7.7rem;
  left: 2.9rem;
}

.figma-design-main .vector-131 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.7rem;
  left: 2.9rem;
}

.figma-design-main .vector-132 {
  position: absolute;
  width: .2rem;
  height: .3rem;
  top: 7.7rem;
  left: 2.7rem;
}

.figma-design-main .vector-133 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8rem;
  left: 2.6rem;
}

.figma-design-main .vector-134 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.9rem;
  left: 2.6rem;
}

.figma-design-main .vector-135 {
  position: absolute;
  width: .3rem;
  height: .7rem;
  top: 7.3rem;
  left: 2.4rem;
}

.figma-design-main .vector-136 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.3rem;
  left: 2.4rem;
}

.figma-design-main .vector-137 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.3rem;
  left: 2.3rem;
}

.figma-design-main .vector-138 {
  position: absolute;
  width: .3rem;
  height: .6rem;
  top: 7.3rem;
  left: 2rem;
}

.figma-design-main .vector-139 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.9rem;
  left: 2rem;
}

.figma-design-main .vector-140 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 7.8rem;
  left: 1.9rem;
}

.figma-design-main .vector-141 {
  position: absolute;
  width: .2rem;
  height: .2rem;
  top: 7.9rem;
  left: 1.7rem;
}

.figma-design-main .vector-142 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8rem;
  left: 1.7rem;
}

.figma-design-main .vector-143 {
  position: absolute;
  width: .3rem;
  height: .2rem;
  top: 8rem;
  left: 1.4rem;
}

.figma-design-main .vector-144 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.1rem;
  left: 1.4rem;
}

.figma-design-main .vector-145 {
  position: absolute;
  width: .6rem;
  height: 3.4rem;
  top: 4.8rem;
  left: .8rem;
}

.figma-design-main .vector-146 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 4.8rem;
  left: .8rem;
}

.figma-design-main .vector-147 {
  position: absolute;
  width: .8rem;
  height: 3.7rem;
  top: 4.8rem;
  left: .1rem;
}

.figma-design-main .vector-148 {
  position: absolute;
  width: .1rem;
  height: .1rem;
  top: 8.4rem;
  left: 0;
}

.figma-design-main .ppm-bar {
  position: absolute;
  width: 37.3rem;
  height: 1.8rem;
  top: 9.6rem;
  left: 0;
}

.figma-design-main .overlap-5 {
  position: relative;
  width: 35.7rem;
  height: 1.8rem;
}

.figma-design-main .overlap-group-3 {
  position: absolute;
  width: 34.5rem;
  height: 1.8rem;
  top: 0;
  left: 0;
}

.figma-design-main .text-wrapper-15 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 0;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-16 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 9.5rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-17 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 19rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-18 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 28.4rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-19 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 33.2rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-20 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 23.7rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-21 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 14.2rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .text-wrapper-22 {
  position: absolute;
  width: 2.5rem;
  top: .6rem;
  left: 4.7rem;
  font-family: "IBM Plex Sans", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8..3rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .selected-bar {
  position: absolute;
  width: 117.1rem;
  height: 2.8rem;
  top: 19.6rem;
  left: 31.2rem;
  background-color: #919191;
  border: .1rem solid;
  border-color: #5c6369;
}

.figma-design-main .file-icons-groups {
  position: absolute;
  width: 1.7rem;
  height: 42.2rem;
  top: 5.4rem;
  left: 35.4rem;
}

.figma-design-main .folder-icon {
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  top: 0;
  left: 0;
}

.figma-design-main .folder-icon-2 {
  top: 3.7rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  left: 0;
}

.figma-design-main .folder-icon-3 {
  top: 7.4rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  left: 0;
}

.figma-design-main .folder-icon-4 {
  top: 11.1rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  left: 0;
}

.figma-design-main .file-icon {
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  top: 14.8rem;
  left: 0;
}

.figma-design-main .file-icon-2 {
  top: 18.5rem;
  left: .1rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .file-icon-3 {
  top: 22.2rem;
  left: .1rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .vector-149 {
  position: absolute;
  width: 1.3rem;
  height: 1.3rem;
  top: 26rem;
  left: .2rem;
}

.figma-design-main .faile-file-icon {
  position: absolute;
  width: 1.3rem;
  height: 1.3rem;
  top: 29.8rem;
  left: .2rem;
}

.figma-design-main .file-icon-4 {
  top: 33.3rem;
  left: 0;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .file-icon-5 {
  top: 37rem;
  left: 0;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .success-icon {
  position: absolute;
  width: 1.3rem;
  height: 1.3rem;
  top: 40.8rem;
  left: .2rem;
}

.figma-design-main .checkbox-group {
  position: absolute;
  width: 1.4rem;
  height: 42rem;
  top: 5.6rem;
  left: 32.8rem;
}

.figma-design-main .check-box-icon {
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  top: 0;
  left: 0;
}

.figma-design-main .check-box-icon-2 {
  top: 3.7rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .check-box-icon-3 {
  top: 7.4rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .check-box-icon-4 {
  top: 11.1rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .checked-box-icon {
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  top: 14.8rem;
  left: 0;
}

.figma-design-main .checked-box-icon-2 {
  top: 18.4rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .checked-box-icon-3 {
  top: 22.2rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .check-box-icon-5 {
  top: 25.9rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .check-box-icon-6 {
  top: 29.6rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .check-box-icon-7 {
  top: 33.3rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .check-box-icon-8 {
  top: 37rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .check-box-icon-9 {
  top: 40.7rem;
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  left: 0;
}

.figma-design-main .filename-group {
  position: absolute;
  width: 44.9rem;
  height: 42.9rem;
  top: 5.1rem;
  left: 37.6rem;
}

.figma-design-main .text-wrapper-23 {
  top: 0;
  position: absolute;
  height: 2.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-24 {
  top: 3.7rem;
  position: absolute;
  height: 2.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-25 {
  top: 7.4rem;
  position: absolute;
  height: 2.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-26 {
  top: 11.1rem;
  position: absolute;
  height: 2.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-27 {
  position: absolute;
  width: 42.5rem;
  height: 2.2rem;
  top: 14.8rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-28 {
  top: 18.5rem;
  position: absolute;
  width: 42.5rem;
  height: 2.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-29 {
  top: 22.2rem;
  position: absolute;
  width: 42.5rem;
  height: 2.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-30 {
  position: absolute;
  width: 42.5rem;
  height: 2.2rem;
  top: 25.9rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-31 {
  position: absolute;
  width: 42.5rem;
  height: 2.2rem;
  top: 29.6rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-32 {
  position: absolute;
  width: 42.5rem;
  height: 2.2rem;
  top: 33.3rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-33 {
  position: absolute;
  width: 42.5rem;
  height: 2.2rem;
  top: 37rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-34 {
  position: absolute;
  width: 42.5rem;
  height: 2.2rem;
  top: 40.7rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .status-group {
  position: absolute;
  width: 6.3rem;
  height: 42.9rem;
  top: 5.1rem;
  left: 83.8rem;
}

.figma-design-main .status {
  position: absolute;
  width: 1.9rem;
  height: 1.9rem;
  top: 15rem;
  left: 1.8rem;
}

.figma-design-main .status-2 {
  width: 1.9rem;
  height: 1.9rem;
  top: 18.8rem;
  position: absolute;
  left: 1.8rem;
}

.figma-design-main .status-3 {
  width: 1.9rem;
  height: 1.9rem;
  top: 22.4rem;
  position: absolute;
  left: 1.8rem;
}

.figma-design-main .status-4 {
  width: 1.9rem;
  height: 1.9rem;
  top: 26rem;
  position: absolute;
  left: 1.8rem;
}

.figma-design-main .status-5 {
  width: 1.9rem;
  height: 1.9rem;
  top: 30rem;
  position: absolute;
  left: 1.8rem;
}

.figma-design-main .status-6 {
  width: 1.8rem;
  height: 1.8rem;
  top: 33.7rem;
  position: absolute;
  left: 1.8rem;
}

.figma-design-main .status-7 {
  width: 1.9rem;
  height: 1.9rem;
  top: 37.4rem;
  position: absolute;
  left: 1.8rem;
}

.figma-design-main .progressing {
  position: absolute;
  width: 1.9rem;
  height: 1.9rem;
  top: 41rem;
  left: 1.8rem;
}

.figma-design-main .text-wrapper-35 {
  position: absolute;
  width: 5.5rem;
  height: 2.2rem;
  top: 0;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-36 {
  top: 3.7rem;
  position: absolute;
  width: 5.5rem;
  height: 2.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-37 {
  top: 7.4rem;
  position: absolute;
  width: 5.5rem;
  height: 2.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-38 {
  top: 11.1rem;
  position: absolute;
  width: 5.5rem;
  height: 2.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .scan-date-group {
  position: absolute;
  width: 19.6rem;
  height: 28.1rem;
  top: 19.9rem;
  left: 92.2rem;
}

.figma-design-main .time {
  position: absolute;
  height: 2.2rem;
  top: 0;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .time-2 {
  position: absolute;
  height: 2.2rem;
  top: 3.7rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .time-3 {
  position: absolute;
  height: 2.2rem;
  top: 7.4rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .time-4 {
  position: absolute;
  height: 2.2rem;
  top: 11.1rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .time-5 {
  position: absolute;
  height: 2.2rem;
  top: 14.8rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .time-6 {
  position: absolute;
  height: 2.2rem;
  top: 18.5rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .time-7 {
  position: absolute;
  height: 2.2rem;
  top: 22.2rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .time-8 {
  position: absolute;
  height: 2.2rem;
  top: 25.9rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .patient-id-group {
  position: absolute;
  width: 10.8rem;
  height: 28.1rem;
  top: 19.9rem;
  left: 114.1rem;
}

.figma-design-main .patient {
  position: absolute;
  height: 2.2rem;
  top: -.3rem;
  left: .2rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .patient-2 {
  position: absolute;
  height: 2.2rem;
  top: 3.4rem;
  left: .1rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .patient-3 {
  position: absolute;
  height: 2.2rem;
  top: 7.1rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .patient-4 {
  position: absolute;
  height: 2.2rem;
  top: 10.8rem;
  left: .2rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .patient-5 {
  position: absolute;
  height: 2.2rem;
  top: 14.5rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .patient-6 {
  position: absolute;
  height: 2.2rem;
  top: 18.2rem;
  left: .2rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .patient-7 {
  position: absolute;
  height: 2.2rem;
  top: 21.9rem;
  left: .1rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .patient-8 {
  position: absolute;
  height: 2.2rem;
  top: 25.6rem;
  left: .2rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .tag-icon {
  position: absolute;
  width: 5.4rem;
  height: 28.9rem;
  top: 19.5rem;
  left: 128.7rem;
}

.figma-design-main .acc-tag {
  position: absolute;
  width: 5.4rem;
  height: 3rem;
  top: 0;
  left: 0;
}

.figma-design-main .overlap-group-4 {
  position: relative;
  height: 3rem;
  top: -.1rem;
}

.figma-design-main .rectangle {
  position: absolute;
  width: 4.4rem;
  height: 1.8rem;
  top: .7rem;
  left: .5rem;
  background-color: #e2844f;
  border-radius: .5rem;
}

.figma-design-main .text-wrapper-39 {
  position: absolute;
  width: 5.4rem;
  height: 3rem;
  top: 0;
  left: 0;
  font-family: "Roboto", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 1.4rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .dlpfc-tag {
  position: absolute;
  width: 5.4rem;
  height: 3rem;
  top: 3.7rem;
  left: 0;
}

.figma-design-main .rectangle-2 {
  width: 5.4rem;
  height: 1.8rem;
  top: .7rem;
  left: 0;
  background-color: #634fe2;
  position: absolute;
  border-radius: .5rem;
}

.figma-design-main .overlap-wrapper {
  width: 5.4rem;
  height: 3rem;
  top: 7.4rem;
  position: absolute;
  left: 0;
}

.figma-design-main .pcc-tag {
  position: absolute;
  width: 5.4rem;
  height: 3rem;
  top: 11.1rem;
  left: 0;
}

.figma-design-main .rectangle-3 {
  width: 4.4rem;
  height: 1.8rem;
  top: .7rem;
  left: .5rem;
  background-color: #4f8ae2;
  position: absolute;
  border-radius: .5rem;
}

.figma-design-main .overlap-group-wrapper {
  top: 14.8rem;
  position: absolute;
  width: 5.4rem;
  height: 3rem;
  left: 0;
}

.figma-design-main .div-wrapper {
  top: 18.5rem;
  position: absolute;
  width: 5.4rem;
  height: 3rem;
  left: 0;
}

.figma-design-main .dlpfc-tag-2 {
  top: 22.2rem;
  position: absolute;
  width: 5.4rem;
  height: 3rem;
  left: 0;
}

.figma-design-main .rectangle-4 {
  width: 5.4rem;
  height: 1.8rem;
  top: .7rem;
  left: 0;
  background-color: #644fe2;
  position: absolute;
  border-radius: .5rem;
}

.figma-design-main .dlpfc-tag-3 {
  top: 25.9rem;
  position: absolute;
  width: 5.4rem;
  height: 3rem;
  left: 0;
}

.figma-design-main .result-icon {
  position: absolute;
  width: 1.8rem;
  height: 27.7rem;
  top: 20rem;
  left: 140.4rem;
}

.figma-design-main .result-icon-2 {
  top: 0;
  position: absolute;
  width: 1.8rem;
  height: 1.8rem;
  left: 0;
}

.figma-design-main .result-icon-3 {
  top: 3.7rem;
  position: absolute;
  width: 1.8rem;
  height: 1.8rem;
  left: 0;
}

.figma-design-main .result-icon-4 {
  top: 7.4rem;
  position: absolute;
  width: 1.8rem;
  height: 1.8rem;
  left: 0;
}

.figma-design-main .result-icon-5 {
  top: 11.1rem;
  position: absolute;
  width: 1.8rem;
  height: 1.8rem;
  left: 0;
}

.figma-design-main .result-icon-6 {
  top: 14.8rem;
  position: absolute;
  width: 1.8rem;
  height: 1.8rem;
  left: 0;
}

.figma-design-main .result-icon-7 {
  top: 18.5rem;
  position: absolute;
  width: 1.8rem;
  height: 1.8rem;
  left: 0;
}

.figma-design-main .result-icon-8 {
  top: 22.2rem;
  position: absolute;
  width: 1.8rem;
  height: 1.8rem;
  left: 0;
}

.figma-design-main .result-icon-9 {
  top: 25.9rem;
  position: absolute;
  width: 1.8rem;
  height: 1.8rem;
  left: 0;
}

.figma-design-main .folder-list {
  position: absolute;
  width: 31.3rem;
  height: 34.1rem;
  top: .1rem;
  left: 2.3rem;
}

.figma-design-main .overlap-6 {
  position: absolute;
  width: 25.7rem;
  height: 2.5rem;
  top: 5.6rem;
  left: 3.2rem;
  background-color: #919191;
}

.figma-design-main .iconamoon-folder {
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  top: .5rem;
  left: .5rem;
}

.figma-design-main .text-wrapper-40 {
  position: absolute;
  height: 2.2rem;
  top: .2rem;
  left: 2.6rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-2 {
  top: 3.2rem;
  left: 1rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-41 {
  top: 2.9rem;
  left: 3.1rem;
  position: absolute;
  height: 2.2rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-3 {
  top: 20.6rem;
  left: 3.7rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-42 {
  height: 2.2rem;
  top: 20.3rem;
  left: 5.8rem;
  color: #ffffff;
  font-size: 1.8rem;
  position: absolute;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-4 {
  top: 23.5rem;
  left: 3.7rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-43 {
  height: 2.2rem;
  top: 23.2rem;
  left: 5.8rem;
  color: #ffffff;
  font-size: 1.8rem;
  position: absolute;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-5 {
  top: 9rem;
  left: 4.7rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-44 {
  position: absolute;
  height: 2.2rem;
  top: 8.7rem;
  left: 6.8rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-6 {
  top: 11.9rem;
  left: 4.7rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-45 {
  position: absolute;
  height: 2.2rem;
  top: 11.6rem;
  left: 6.8rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-7 {
  top: 14.8rem;
  left: 4.7rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-46 {
  position: absolute;
  height: 2.2rem;
  top: 14.5rem;
  left: 6.8rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-8 {
  top: 17.7rem;
  left: 4.7rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-47 {
  position: absolute;
  height: 2.2rem;
  top: 17.4rem;
  left: 6.8rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-9 {
  top: 26.4rem;
  left: 3.2rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-48 {
  top: 26.1rem;
  left: 5.3rem;
  position: absolute;
  height: 2.2rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-10 {
  top: 29.3rem;
  left: 3.3rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-49 {
  position: absolute;
  height: 2.2rem;
  top: 29rem;
  left: 5.4rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .iconamoon-folder-11 {
  top: 32.2rem;
  left: 3.3rem;
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
}

.figma-design-main .text-wrapper-50 {
  position: absolute;
  height: 2.2rem;
  top: 31.9rem;
  left: 5.4rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .material-symbols {
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  top: .3rem;
  left: 0;
}

.figma-design-main .text-wrapper-51 {
  position: absolute;
  height: 2.2rem;
  top: 0;
  left: 2.1rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

    .figma-design-main .overlap-7 {
        position: relative;
        width: 100%;
        background-color: #1e2d3c;
        flex: 1;
    }

    .figma-design-main .download-button {
        position: absolute;
        width: 100%;
        height: 5.4rem;
        bottom: 0;
        left: 0;
        border-top-width: .1rem;
        border-top-style: solid;
        border-color: #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 2.4rem;
    }

.figma-design-main .generate-button {
  width: 13.2rem;
  height: 3.2rem;
}

    .figma-design-main .overlap-group-5 {
        position: relative;
        width: 13rem;
        height: 3.2rem;
        background-color: #636363;
        border-radius: .5rem;
        cursor: pointer;
    }

.figma-design-main .mdi-file-send {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  top: .8rem;
  left: 1.4rem;
}

.figma-design-main .text-wrapper-52 {
  position: absolute;
  height: 1.4rem;
  top: .8rem;
  left: 3.3rem;
  font-family: "Noto Sans", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 1rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .download-button-2 {
  width: 13.2rem;
  height: 3.2rem;
}

.figma-design-main .overlap-8 {
  position: relative;
  width: 13rem;
  height: 3.2rem;
  background-color: #1d695b;
  border-radius: .5rem;
}

.figma-design-main .download-icon {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  top: .8rem;
  left: 1.2rem;
}

.figma-design-main .text-wrapper-53 {
  position: absolute;
  height: 1.4rem;
  top: .8rem;
  left: 3.2rem;
  font-family: "Noto Sans", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 1rem;
  letter-spacing: 0;
  line-height: normal;
}

    .figma-design-main .data-information {
        position: absolute;
        width: 100%;
        height: calc(100% - 5.4rem);
        top: 0;
        left: 0;
        background: #1E2D3C;
    }

.figma-design-main .file-info-frame {
  display: flex;
  flex-direction: column;
  width: 7.6rem;
  align-items: flex-start;
  gap: .8rem;
  position: absolute;
  top: 34.7rem;
  left: 1.6rem;
}

.figma-design-main .text-wrapper-54 {
  position: relative;
  width: fit-content;
  margin-top: -1.0rem;
  margin-right: -2.0rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .text-wrapper-55 {
  position: relative;
  width: fit-content;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .info-data {
  position: absolute;
  width: 8.9rem;
  height: 13rem;
  top: 34.7rem;
  left: 16.1rem;
}

.figma-design-main .id {
  position: absolute;
  height: 1.9rem;
  top: 0;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .age {
  position: absolute;
  width: 8.1rem;
  height: 1.9rem;
  top: 2.7rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .sex {
  position: absolute;
  width: 8.1rem;
  height: 1.9rem;
  top: 5.4rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .device {
  position: absolute;
  height: 1.9rem;
  top: 8.1rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .acc-tag-2 {
  width: 5rem;
  height: 2.2rem;
  top: 10.8rem;
  position: absolute;
  left: 0;
}

.figma-design-main .overlap-group-6 {
  position: relative;
  height: 2.2rem;
  top: -.1rem;
}

.figma-design-main .rectangle-5 {
  width: 4.1rem;
  height: 1.3rem;
  top: .5rem;
  left: .5rem;
  background-color: #e2844f;
  position: absolute;
  border-radius: .5rem;
}

.figma-design-main .text-wrapper-56 {
  width: 5rem;
  height: 2.2rem;
  font-size: 1rem;
  position: absolute;
  top: 0;
  left: 0;
  font-family: "Roboto", Helvetica;
  font-weight: 700;
  color: #ffffff;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .text-wrapper-57 {
  position: absolute;
  width: 13.7rem;
  height: 2.2rem;
  top: 31.6rem;
  left: 1.6rem;
  font-family: "Inter", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .metlit-analytics {
  position: absolute;
  width: 40.4rem;
  height: 16.8rem;
  top: 14.1rem;
  left: 1.6rem;
}

.figma-design-main .metlit-analytics-2 {
  position: absolute;
  height: 2.2rem;
  top: -.1rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .server-info {
  position: absolute;
  width: 13.2rem;
  height: 13.2rem;
  top: 3.2rem;
  left: 0;
}

.figma-design-main .name {
  position: absolute;
  height: 1.9rem;
  top: 0;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
  background: transparent;
  border: none;
  padding: 0;
}

.figma-design-main .upload-date {
  position: absolute;
  width: 12.4rem;
  height: 1.9rem;
  top: 5.3rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .last-opened {
  position: absolute;
  width: 12.4rem;
  height: 1.9rem;
  top: 8.3rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .opened-users {
  position: absolute;
  width: 12.4rem;
  height: 1.9rem;
  top: 11.3rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .server-data {
  position: absolute;
  width: 26.4rem;
  height: 13rem;
  top: 3.3rem;
  left: 14.5rem;
}

.figma-design-main .p {
  position: absolute;
  height: 3.8rem;
  top: 0;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .upload-date-2 {
  position: absolute;
  height: 1.9rem;
  top: 5.1rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .last-opened-2 {
  position: absolute;
  height: 1.9rem;
  top: 8.1rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .opened-users-2 {
  position: absolute;
  height: 1.9rem;
  top: 11.1rem;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .recent-action-frame {
  display: flex;
  flex-direction: column;
  width: 28.8rem;
  align-items: flex-start;
  justify-content: center;
  gap: .8rem;
  position: absolute;
  top: 7.5rem;
  left: 1.6rem;
}

.figma-design-main .text-wrapper-58 {
  position: relative;
  width: fit-content;
  margin-top: -1.0rem;
  font-family: "Inter", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .file-name-frame {
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  position: absolute;
  top: .9rem;
  left: 1.6rem;
}

.figma-design-main .success-icon-2 {
  position: relative;
  width: 3.7rem;
  height: 3.6rem;
  object-fit: cover;
}

.figma-design-main .DAEJIN-YUN-SV-PR {
  position: relative;
  width: fit-content;
  margin-top: -1.0rem;
  font-family: "Inter", Helvetica;
  font-weight: 600;
  color: #ffffff;
  font-size: 2.4rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .search-bar-section {
  position: fixed;
  width: 100%;
  height: 5rem;
  top: 8.6rem;
  left: 0;
  background-color: #0c1f32;
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  gap: 2.4rem;
  padding: 0 2rem;
  box-sizing: border-box;
}

.figma-design-main .right-search-bar {
  position: relative;
  width: 30%;
  height: 3.5rem;
  background-color: #0c1f32;
}

.figma-design-main .vector-wrapper {
  position: relative;
  height: 3.5rem;
  background-color: #f1f3f4;
  border-radius: 1.3rem;
}

.figma-design-main .vector-150 {
  position: absolute;
  width: 2.3rem;
  height: 2rem;
  top: .6rem;
  left: 1.7rem;
}

.figma-design-main .text-input {
  position: relative;
  /* width: 110.2rem; */
  height: 3.6rem;
  /* top: .8rem; */
  /* left: 17.9rem; */
  background-color: #0c1f32;
  flex: 1;
}

.figma-design-main .frame-wrapper {
  height: 3.5rem;
  background-color: #f1f3f4;
  border-radius: 1.3rem;
}

.figma-design-main .frame {
  position: relative;
  width: 90rem;
  height: 1.7rem;
  top: .9rem;
  left: 2.1rem;
}

.figma-design-main .material-symbols-2 {
  position: absolute;
  width: 1.4rem;
  height: 1.4rem;
  top: .2rem;
  left: 0;
}

.figma-design-main .mdi-menu-right {
  position: absolute;
  width: 1.2rem;
  height: 1.2rem;
  top: .2rem;
  left: 2.1rem;
}

.figma-design-main .text-wrapper-59 {
  position: absolute;
  height: 1.7rem;
  top: -.1rem;
  left: 4rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 1.4rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .frame-2 {
  position: absolute;
  width: 28rem;
  height: 1.7rem;
  top: 0;
  left: 14.9rem;
}

.figma-design-main .mdi-menu-right-2 {
  left: 0;
  position: absolute;
  width: 1.2rem;
  height: 1.2rem;
  top: .2rem;
}

.figma-design-main .text-wrapper-60 {
  position: absolute;
  height: 1.6rem;
  top: 0;
  left: 2.1rem;
  font-family: "Roboto", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 1.4rem;
  letter-spacing: 0.2.5rem;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .mdi-menu-right-3 {
  left: 14rem;
  position: absolute;
  width: 1.2rem;
  height: 1.2rem;
  top: .2rem;
}

.figma-design-main .text-wrapper-61 {
  height: 1.7rem;
  top: -.1rem;
  left: 15.9rem;
  color: #000000;
  font-size: 1.4rem;
  position: absolute;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .folder-move-icon {
  display: flex;
  height: 1.9rem;
  align-items: center;
  gap: 2rem;
  position: relative;
  background-color: #0c1f32;
}

.figma-design-main .img-2 {
  position: relative;
  width: 1.6rem;
  height: 1.7rem;
  object-fit: cover;
}

.figma-design-main .upper-icon {
  position: relative;
  width: 1.5rem;
  height: 1.4rem;
  object-fit: cover;
}

    /* 상단 고정 그룹: Flexbox 적용 */
    .figma-design-main .top-fixed-group {
        position: fixed;
        width: 100%;
        height: 8.6rem; /* 1080 기준 8vh ≈ 8.6rem */
        top: 0;
        left: 0;
        background-color: #0c1f32;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        padding: 0 2rem;
        box-sizing: border-box;
    }


    /* 우측 버튼 그룹 */
    .figma-design-main .frame-3 {
        display: flex;
        gap: 1rem; /* 버튼 간격 */
        /* margin-left: auto; */ /* 우측 정렬 */
    }


.figma-design-main .profile-button {
  position: relative;
  width: 10.4rem;
  height: 4.9rem;
  background-color: #546474;
  border-radius: 4..5rem;
}
.figma-design-main .profile-button {
        position: relative;
        width: 10.4rem;
        height: 4.9rem;
        background-color: #546474;
        border-radius: 4..5rem;
    }
.figma-design-main .text-wrapper-62 {
  position: absolute;
  height: 1.9rem;
  top: 1.4rem;
  left: 3.7rem;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .image {
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  top: 1.6rem;
  left: 1.7rem;
  object-fit: cover;
}

.figma-design-main .option-button {
  position: relative;
  width: 10.4rem;
  height: 4.9rem;
  background-color: #536473;
  border-radius: 3.7.5rem;
}

.figma-design-main .text-wrapper-63 {
  position: absolute;
  height: 1.9rem;
  top: 1.4rem;
  left: 3.5rem;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .image-2 {
  width: 1.5rem;
  height: 1.6rem;
  top: 1.7rem;
  left: 1.7rem;
  position: absolute;
  object-fit: cover;
}

.figma-design-main .swinfo-button {
  position: relative;
  width: 10.4rem;
  height: 4.9rem;
  background-color: #536373;
  border-radius: 3.7.5rem;
}

.figma-design-main .text-wrapper-64 {
  position: absolute;
  height: 1.9rem;
  top: 1.4rem;
  left: 2.8rem;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .image-3 {
  width: 1.5rem;
  height: 1.6rem;
  top: 1.6rem;
  left: 1rem;
  position: absolute;
  object-fit: cover;
}

.figma-design-main .login-utton {
  position: relative;
  width: 10.4rem;
  height: 4.9rem;
  background-color: #546474;
  border-radius: 3.7.5rem;
}

.figma-design-main .login {
  position: absolute;
  height: 1.9rem;
  top: 1.4rem;
  left: 3.3rem;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .image-4 {
  width: 1.3rem;
  height: 1.5rem;
  top: 1.7rem;
  left: 1.6rem;
  position: absolute;
  object-fit: cover;
}

.figma-design-main .login-image-wrapper {
  position: relative;
  width: auto;
  height: 2.1rem;
  /* top: 3.5rem; */
  /* left: 46%; */
/*  background-image: url(./img/not-loging-image.png);*/
  background-size: cover;
  background-position: 50% 50%;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.figma-design-main .login-image {
  /* position: absolute; */
  width: 3rem;
  height: 2.1rem;
  top: 0;
  left: 0;
  object-fit: cover;
}

.figma-design-main .software-title {
  /* position: absolute; */
  width: 44rem;
  height: 3rem;
  /* top: 3rem; */
  /* left: 2rem; */
  position: relative;
}

.figma-design-main .product-version {
  position: absolute;
  height: 2.2rem;
  top: .6rem;
  left: 30.1rem;
  font-family: "Inter", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 1.8rem;
  letter-spacing: 0;
  line-height: normal;
}

.figma-design-main .product-name {
  position: absolute;
  height: 3rem;
  top: 0;
  left: 0;
  font-family: "Inter", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 2.5rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .min-max-exit-button {
  display: flex;
  width: 10rem;
  height: 1.8rem;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
  position: absolute;
  top: 1.8rem;
  left: 180rem;
}

.figma-design-main .min-button {
  position: relative;
  width: 2rem;
  height: 1.6.7rem;
  margin-left: -5.0rem;
  object-fit: cover;
}

.figma-design-main .max-button {
  position: relative;
  width: 2rem;
  height: 2rem;
  margin-top: -1.0rem;
  margin-bottom: -1.0rem;
  object-fit: cover;
}

.figma-design-main .exit-button {
  position: relative;
  width: 2rem;
  height: 2rem;
  margin-top: -1.0rem;
  margin-bottom: -1.0rem;
  margin-right: -5.0rem;
  object-fit: cover;
}

.figma-design-main .text-wrapper-65 {
  width: auto;
  height: 3rem;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 2.5rem;
  text-align: center;
  letter-spacing: 0.2.5rem;
  line-height: normal;
}

.figma-design-main .button {
  all: unset;
  box-sizing: border-box;
  position: absolute;
  width: 10.4rem;
  height: 4.9rem;
  top: 5.9rem;
  left: 135.6rem;
  background-color: #546474;
  border-radius: 4..5rem;
}

.figma-design-main .profile {
  position: absolute;
  height: 1.9rem;
  top: 1.4rem;
  left: 3.2rem;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.figma-design-main .upload {
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  top: 1.4rem;
  left: 1rem;
  object-fit: cover;
}



/* 버튼 스타일 */
.icon-button {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .5rem 1rem;
    background-color: transparent;
    border: .1rem solid #007bff;
    border-radius: .8rem;
    color: white;
    font-size: 1.4rem;
    cursor: pointer;
    transition: background-color 0.3s;
}

/* 버튼이미지 스타일 */
.icon-image {
    width: 2.4rem;
    height: 2.4rem;
    object-fit: contain;
}

/* 버튼 호버 효과 */
.icon-button:hover {
    background-color: #007bff;
    color: white;
}

/* 버튼 기본 스타일 */
button {
    padding: 1rem 2rem; /* 버튼 내부 여백 */
    font-size: 1rem; /* 글자 크기 */
    display: flex; /* 내부 요소를 가로 정렬 */
    align-items: center;
    justify-content: center;
    gap: 1rem; /* 아이콘과 텍스트 간 간격 */
    max-width: 100%; /* 부모 요소에 맞춤 */
    box-sizing: border-box;
}

    /* 버튼 내 이미지 스타일 */
    button img {
        max-width: 100%;
        height: auto;
        object-fit: contain; /* 이미지 비율 유지 */
    }

@media screen and (max-width: 76.8rem) {
    button {
        width: 100%;
        font-size: 0.9rem;
        padding: .8rem 1.6rem;
    }

        button img {
            width: 2rem;
            height: 2rem;
        }
}


    /* 호버 시 효과 */
.profile-button:hover,
.option-button:hover,
.swinfo-button:hover,
.login-utton:hover {
    background-color: #4C6FED;
}

/* DxTreeView의 아이콘 크기 조정 */
/*.custom-treeview .dxbl-image {
    width: 1.6rem !important;
    height: 1.6rem !important;
    vertical-align: middle;
    
}*/

/* 숨겨진 파일 선택 input */
/*#file-upload {
    display: none;
}*/
/* 트리뷰 화살표 강제 숨김 */
/* DxTreeView의 아이콘 크기 조정 */
/*.custom-treeview .dxbl-image {
    width: 1.6rem !important;
    height: 1.6rem !important;
    vertical-align: middle;
 
}*/

/* 숨겨진 파일 선택 input */
#file-upload {
    display: none;
}

.custom-treeview .expand-btn {
    display: none !important;
}

.treeview-item {
    padding: .5rem 1rem;
    border-radius: .5rem;
    transition: background-color 0.3s;
}

    .treeview-item:hover {
        background-color: #ddd;
        color: black;
    }

.selected-tree-item {
    background-color: #007bff;
    color: white;
    font-weight: bold;
}



/* Table and cell styling */
.custom-table {
    width: 100%;
    border-collapse: collapse;
    color: white;
    table-layout: fixed;
  /*  border: .1rem solid #0C1F32;*/
}

    .custom-table th, .custom-table td {
        text-align: center;
        vertical-align: middle;
        padding: 1rem;
        color: white;
       /* border: .1rem solid #0C1F32;*/
        white-space: nowrap; /* Prevent line breaks */
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Table header styling */
    .custom-table th {
        background-color: #0C1F32;
        font-size: 1.6rem;
        color: white;
    }

/* Row hover effect */
.clickable-row:hover {
    background-color: #2d4b6a;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

/* Selected row effect */
.clickable-row.selected {
    background-color: #4a90e2;
    color: white;
    font-weight: bold;
}

/* Centered image button */
.image-button-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

/* Image button styling */
.image-button {
    background: transparent;
    border: none;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .image-button img {
        width: 2.5rem;
        height: 2.5rem;
        display: block;
        margin: 0 auto;
    }

    .image-button:hover img {
        opacity: 0.8;
        transition: opacity 0.3s ease;
    }

/* Base table styling */
.custom-table {
    width: 100%;
    border-collapse: collapse;
    color: white;
    table-layout: fixed;
}
.custom-table th {
   position: sticky;
}
    /* Table cells */
    .custom-table th, .custom-table td {
        text-align: center;
        padding: 1rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 1.2rem;
    }

/* Hover effect */
.clickable-row:hover {
    background-color: #2d4b6a;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

/* Selected row: subtle reverse effect */
.selected-row {
    background-color: #4a90e2;
    color: black !important; /* Reversed text color */
    transition: background-color 0.3s ease;
}
    /* 선택된 행의 각 셀에도 반영 */
    .selected-row td {
        background-color: white !important;
        color: black !important;
    }
/* Image next to file name */
/*.file-icon {
    width: 2rem;
    height: 2rem;
    vertical-align: middle;
    margin-right: .5rem;
}*/

/* Image button styling */
.image-button-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.image-button {
    background: transparent;
    border: none;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .image-button img {
        width: 2.5rem;
        height: 2.5rem;
        display: block;
    }

    .image-button:hover img {
        opacity: 0.8;
    }
.file-name {
    font-size: 1.6rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    max-width: 100%;
    height: 3rem;
}
/* Alternating row background for clarity */
.custom-table tbody tr:nth-child(odd) {
    background-color: #1E2D3C;
}

.custom-table tbody tr:nth-child(even) {
    background-color: #2D3E50;
}
/* File and folder icons next to text */
.icon-text {
    display: flex;
    align-items: center;
    gap: .8rem;
}

    /* Image size */
    .icon-text img {
        width: 2rem;
        height: 2rem;
        vertical-align: middle;
    }

/* Status icon */
.status-icon {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}


.search-input {
    flex: 1; /* 남은 공간을 모두 차지 */
    margin-left: 4.8rem; /* 이미지와 간격 */
    border: none; /* 테두리 제거 */
    outline: none; /* 포커스 시 테두리 제거 */
    font-size: 1.6rem;
    padding: .5rem;
    background-color: transparent; /* 배경 투명 */
    width: 50rem;
}




.data-information {
    /* padding: 1.5rem; */
    background-color: black;
    color: white;
    border-radius: .8rem;
}

.scroll-container {
    overflow-y: auto;
    /* max-height: 41.6rem; */
    /* padding-right: 1rem; */
    height: 100%;
    box-sizing: border-box;
    padding: 1.5rem;
}

.grid-layout {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.title-section {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.icon {
    width: 1.5rem;
    height: 1.5rem;
}

.file-name {
    font-size: 2.5rem;
    font-weight: bold;
}

.section-title {
    font-size: 2.1rem;
    font-weight: bold;
    margin-top: 0.5rem;
    width: 25.6rem;
}

.recent-action {
    font-size: 1.7rem;
    color: lightgray;
}
.grid-container {
    display: flex;
    align-items: center; 
    gap: 1rem; 
}
.analytics-grid, .details-grid {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: .4rem;
}

.grid-value, .grid-item {
    display: inline-block;
    vertical-align: middle; /* 정렬 보정 */
    margin-right: 1rem; /* 요소 간 여백 추가 */
    font-size: 1.4rem;
}

.tag-image {
    width: 10rem;
    height: 2rem;
    margin-top: .5rem;
}
.custom-chart {
    background-color: transparent !important;
    width: 42rem !important;!i;!;!i;!;
    height: 13rem !important;!i;!;!i;!;
}
.spec-chart-item .custom-chart {height: 16rem !important;}

    .custom-chart .dxc-arg-elements text {
        fill: white !important;
    }
 

.preview-label {
    position: absolute;
    top: 1rem;
    left: 1rem;
    color: white !important;
    font-size: 1.6rem;
    font-weight: bold;
    background-color: rgba(0, 0, 0, 0.5);
    padding: .5rem 1rem;
    border-radius: .5rem;
}
.ExportModal-dialog {
    width: 90vw; /* 가로를 화면의 90%로 설정 */
    max-width: 88.4rem; /* 최대 너비 제한 */
    height: 90vh; /* 전체 높이 설정 */
    max-height: 90vh; /* 최대 높이 제한 */
    background-color: transparent; /* 배경색 */
    border-radius: 1rem;
    overflow-y: auto; /* 세로 스크롤 허용 */
    overflow-x: hidden; /* 가로 스크롤 제거 */
    padding: 1rem; /* 내부 여백 */
    margin: auto; /* 중앙 정렬 */
    display: flex;
    flex-direction: column;
}
.E-settingsModal-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* 가로/세로 중앙 정렬 */
    z-index: 1050;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5); /* 반투명 배경 */
    display: flex;
    justify-content: center;
    align-items: center;
}

/* 모달 다이얼로그 */
.settingsModal-dialog {
    width: 60%;
    max-width: 80rem;
    margin: auto;
}

/* 모달 컨텐츠 */
.settingsModal-content {
    background-color: #2C3E50;
    color: white;
    padding: 2rem;
    border-radius: 1rem;
    box-shadow: 0 0 1.5rem rgba(0, 0, 0, 0.5);
}

/* 모달 헤더 */
.settingsModal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: .1rem solid #444;
    padding-bottom: 1rem;
}

.settingsModal-title {
    font-size: 2rem;
    color: white;
    margin: 0;
}

.settingsModal-close {
    background: none;
    border: none;
    color: white;
    font-size: 2rem;
    cursor: pointer;
}

/* 모달 본문 */
.settingsModal-body {
    padding: 2rem 0;
}

/* 체크박스 그룹 (가로 배열) */
.settingsModal-checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

/* 모달 푸터 */
.settingsModal-footer {
    display: flex;
    justify-content: flex-end;
    border-top: .1rem solid #444;
    padding-top: 1rem;
}

/* 저장 및 닫기 버튼 */
.settingsModal-save-button {
    padding: 1rem 2rem;
    background-color: #546474;
    color: white;
    border: none;
    border-radius: .5rem;
    cursor: pointer;
    margin-right: 1rem;
}

.settingsModal-close-button {
    padding: 1rem 2rem;
    background-color: #546474;
    color: white;
    border: none;
    border-radius: .5rem;
    cursor: pointer;
}
.group {
    width: 100%;
    max-width: 100%;
    overflow: auto;
}

.detail-Graph-Modal-grid {
    display: grid;
    grid-template-columns: 8fr 2fr;
    grid-template-rows: 9fr 1fr; /* ✅ 행 높이 비율 9:1 */
    gap: rem;
    padding: rem;
    height: 100%; /* ✅ 전체 높이 설정 (필요하면 조절 가능) */
}

.detail-Graph-grid-item {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f0f0f0;
    border-radius: .5rem;
    padding: 1.5rem;
    font-weight: bold;
    text-align: center;
}



.detail-Graph-grid-item1 {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border-radius: .5rem;
    padding: 1.5rem;
    font-weight: bold;
    text-align: center;
    height: 100%;
    width: 100%;
}

.detail-Modal-body {
    padding: rem 0;
    height:100%;
}
.detail-Graph-grid-item2 {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border-radius: .5rem;
    padding: 1.5rem;
    font-weight: bold;
    text-align: center;
    height: 15rem;
    margin-top: 1rem;
    z-index: 2;
}


.detail-Graph-grid-item3 {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border-radius: .5rem;
    padding: 1.5rem;
    font-weight: bold;
    text-align: center;
    height: 100%;
    gap: 3rem;
}


.detail-Graph-grid-item4 {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border-radius: .5rem;
    padding: rem;
    font-weight: bold;
    text-align: center;
    height: 100%;
}



.Detail-custom-checkbox {
    display: flex;
    align-items: center;
    gap: .1rem;
    font-size: 1.2rem;
    margin: .2rem 0;
}

.colored-checkbox {
    width: 1.8rem;
    height: 1.8rem;
    appearance: none;
    background-color: transparent;
    border: .2rem solid #D7DBEC; /* 기본 테두리 색상 */
    border-radius: .4rem;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

    /* 체크박스가 체크되었을 때 테두리 색상 유지 */
    .colored-checkbox:checked {
        background-color: transparent;
        position: relative;
    }

        /* 체크박스에 색상 적용 (테두리만 변경) */
        .colored-checkbox:checked::before {
            content: '✔';
            font-size: 1.4rem;
            font-weight: bold;
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

.checkbox-container {
    display: flex;
    flex-direction: column; /* 세로 정렬 */
    gap: rem; /* 체크박스 간 간격 */
    background-color: var(--program-primary-color);
    padding: rem;
    border-radius: .6rem;
    margin-top: 35rem;
}


.E-graph-box-legend {
    position: absolute;
    bottom: 1rem;
    left: 0;
    right: 0;
    text-align: right;
}


.E-graph-box .dx-legend-outside {
    max-height: 12rem !important;
    overflow-y: unset;
}

.E-graph-box .dx-legend {
    font-size: 1.2rem !important; /* 범례 텍스트 크기 축소 */
    padding: .4rem .6rem; /* 내부 여백 최소화 */
}

.E-graph-box .dx-legend-item {
    margin-bottom: .2rem !important; /* 범례 항목 간격 줄이기 */
}
.chart-container {
    height: 93%;
    /* margin-right: 3rem; */
    overflow: auto;
}
    .chart-container .dxc-chart {
        width: 42.3rem !important;
        height: 17.5rem !important;!i;!;
        max-width: 46.4rem !important;
        max-height: 17.5rem !important;
    }
.preview-image .chart-container .dxc-chart {
    height: auto !important;!i;!;
}
.chart-container_pop .dxc-chart {
    width: 78.5rem !important;
    height: 29.5rem !important;
    max-width: 78.5rem !important;
    max-height: 29.5rem !important;
    margin-left: 17rem;
    margin-top: 6rem;
}
.chart-container_pop .dx-chart-legend-items {
    min-width: 20rem !important; /* 기존 10rem에서 확장 */
    max-width: 25rem !important; /* 기존 12rem에서 확장 */
    margin: .4rem .8rem !important; /* 항목 간 간격 유지 */
    justify-items: flex-start;
}

.E-graph-box_pop .dx-legend-outside {
    max-height: 12rem !important;
    overflow-y: unset;
    width: 72rem;
}
.E-graph-box_pop {
    width: calc(50% - 1rem); /* 2개씩 배치되도록 설정 */
    min-width: 30rem; /* 최소 너비 */
    aspect-ratio: 16/9; /* 그래프의 가로세로 비율 유지 */
    background-color: white; /* 임시 배경 */
    display: flex;
    align-items: center;
    justify-content: center;
    border: .1rem solid #ccc;
}

    .E-graph-box_pop .dxc-arg-elements text {
        fill: black !important;
    }

.chart-container_pop .dx-chart-legend {
    position: absolute !important;
    top: -1.2rem;
    left: 173%;
    transform: translateX(-50%);
    background: transparent;
    color: black !important;
    padding: .5rem 1rem;
    border-radius: .5rem;
    z-index: 1;
    max-width: 35rem;
    overflow: hidden;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center;
    row-gap: .5rem;
}
    .chart-container .dx-chart-legend {
        position: absolute !important;
        top: -1.2rem; /* 차트 위쪽에 배치 */
        left: 113%;
        transform: translateX(-50%); /* 중앙 정렬 */
        background: transparent; /* 반투명 배경 */
        color: white !important; /* 글씨 색상 변경 */
        padding: .5rem 1rem;
        border-radius: .5rem;
        z-index: 1; /* 차트 위에 오도록 설정 */
        max-width: 35rem; /* 범례의 최대 너비 제한 */
        overflow: hidden;
        display: flex !important;
        flex-wrap: wrap !important; /* ✅ 여러 줄 정렬 허용 */
        justify-content: center !important; /* ✅ 중앙 정렬 */
        align-items: center;
        row-gap: .5rem; /* ✅ 줄 간격 추가 */
    }



    .chart-container .dx-chart-legend-items {
        min-width: 20rem !important; /* 기존 10rem에서 확장 */
        max-width: 25rem !important; /* 기존 12rem에서 확장 */
        margin: .4rem .8rem !important; /* 항목 간 간격 유지 */
        justify-items: flex-start;
    }

    .chart-container.dx-chart-legend .dx-legend-item-text {
        white-space: pre-wrap;
    }