@charset "UTF-8";
.dashboard-menu-content {
  position: absolute;
  left: 0;
  top: 105px;
  bottom: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 290px;
  background-color: #101010;
  padding: 60px 30px;
}
.dashboard-menu-content .dashboard-menu {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.dashboard-menu-content .dashboard-menu .dashboard-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  width: 100%;
}
.dashboard-menu-content .dashboard-menu .dashboard-title .dashboard-text {
  font-family: "Microsoft YaHei UI";
  font-size: 35px;
  font-weight: bold;
  color: #fff;
}
.dashboard-menu-content .dashboard-menu .dashboard-title .dashboard-text-sub-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}
.dashboard-menu-content .dashboard-menu .dashboard-title .dashboard-text-sub-content .dashboard-sub-icon {
  width: 38px;
  height: auto;
}
.dashboard-menu-content .dashboard-menu .dashboard-title .dashboard-text-sub-content .dashboard-sub-text {
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: #fff;
}
.dashboard-menu-content .dashboard-menu .dashboard-menu-divider {
  width: 100%;
  height: 1px;
  background-color: #fff;
  margin-bottom: 20px;
}
.dashboard-menu-content .dashboard-menu .dashboard-menu-button-content {
  display: flex;
  flex-direction: column;
  gap: 30px;
  width: 100%;
  height: auto;
}
.dashboard-menu-content .dashboard-menu .dashboard-menu-button-content .dashboard-menu-button {
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 15px;
  padding: 0 35px;
  width: 100%;
  height: 81px;
  background-color: #000;
  border-radius: 100px;
  cursor: pointer;
}
.dashboard-menu-content .dashboard-menu .dashboard-menu-button-content .dashboard-menu-button .dashboard-menu-button-icon {
  width: 30px;
  height: auto;
}
.dashboard-menu-content .dashboard-menu .dashboard-menu-button-content .dashboard-menu-button .button-name {
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 14px;
  color: #fff;
}
.dashboard-menu-content .date-time-display {
  display: flex;
  justify-content: center;
  gap: 7px;
}
.dashboard-menu-content .date-time-display .date, .dashboard-menu-content .date-time-display .time {
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 15px;
  color: #fff;
}

.dashboard-container {
  position: absolute;
  top: 105px;
  right: 0;
  bottom: 0;
  left: 290px;
  padding: 60px 80px;
  background-color: #d6d6d6;
}
.dashboard-container .dashboard-content {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 30px;
  background-color: #fff;
}
.dashboard-container .dashboard-content .dashboard-header-info-bar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  align-items: end;
  padding: 28px 90px;
  width: 100%;
  height: 90px;
  border-top-left-radius: 30px;
  border-top-right-radius: 30px;
  background-color: #033dfb;
}
.dashboard-container .dashboard-content .dashboard-header-info-bar .platform-activities {
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 30px;
  font-weight: bold;
  color: #fff;
}
.dashboard-container .dashboard-content .dashboard-header-info-bar .dashboard-header-info-text {
  display: flex;
  gap: 7px;
}
.dashboard-container .dashboard-content .dashboard-header-info-bar .dashboard-header-info-text .dashboard-company-name, .dashboard-container .dashboard-content .dashboard-header-info-bar .dashboard-header-info-text .dashboard-uuid {
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 17px;
  color: #fff;
}
.dashboard-container .dashboard-content .dashboard-data-content {
  position: absolute;
  top: 90px;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 80px 65px 90px;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-overview-content {
  display: flex;
  justify-content: center;
  gap: 60px;
  width: 100%;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-overview-content .dashboard-description {
  display: flex;
  align-items: center;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-overview-content .dashboard-description p {
  line-height: 27px;
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 16px;
  font-weight: bold;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-overview-content .category-box-content {
  display: flex;
  gap: 30px;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-overview-content .category-box-content .category-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 30px 0 40px;
  width: 310px;
  height: 140px;
  background-color: #FF0606;
  border-top-right-radius: 25px;
  border-top-left-radius: 25px;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.59);
}
.dashboard-container .dashboard-content .dashboard-data-content .data-overview-content .category-box-content .category-box .image-content {
  display: flex;
  align-items: end;
  padding-bottom: 20px;
  height: 100%;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-overview-content .category-box-content .category-box .image-content .user-icon-image {
  width: 40px;
  height: auto;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-overview-content .category-box p {
  line-height: 25px;
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 22px;
  font-weight: bold;
  color: #fff;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-content {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-content .month-stats {
  display: flex;
  align-items: center;
  width: 100%;
  height: 72px;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-content .month-stats .date-content {
  display: flex;
  justify-content: start;
  align-items: center;
  padding: 0 60px;
  width: 300px;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-content .month-stats .date-content .date {
  display: grid;
  place-items: center;
  height: 33px;
  width: 130px;
  border-radius: 30px;
  background-color: #0303FB;
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 15px;
  color: #fff;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-content .month-stats .category-data-content {
  display: flex;
  justify-content: start;
  gap: 30px;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-content .month-stats .category-data-content .data {
  display: flex;
  justify-content: start;
  align-items: center;
  padding: 0 20px;
  width: 310px;
}
.dashboard-container .dashboard-content .dashboard-data-content .data-content .month-stats .category-data-content .data .data-value {
  display: flex;
  justify-content: end;
  align-items: center;
  padding: 0 10px;
  height: 33px;
  background-color: #ffb7b7;
  border-radius: 50px;
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: #fff;
}
.dashboard-container .dashboard-content .data-content > :nth-child(1) {
  background-color: #8BCCFF;
}
.dashboard-container .dashboard-content .data-content > :nth-child(2) {
  background-color: #5AB7FF;
}
.dashboard-container .dashboard-content .data-content > :nth-child(3) {
  background-color: #03A6FB;
}
.dashboard-container .dashboard-content .data-content > :nth-child(4) {
  background-color: #038FFB;
}

.show-user-info-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  height: 100%;
}
.show-user-info-content .search-content {
  display: flex;
  justify-content: end;
  padding-right: 10px;
  width: 100%;
  height: auto;
}
.show-user-info-content .search-content .search-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  width: 200px;
  height: 40px;
  border-radius: 100px;
  background-color: #fff;
  padding: 0 18px;
}
.show-user-info-content .search-content .search-bar .input-box {
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 15px;
  color: #848484;
  width: 130px;
}
.show-user-info-content .search-content .search-bar .search-icon {
  width: 18px;
  height: auto;
  cursor: pointer;
}
.show-user-info-content .users-info-box {
  position: relative;
  width: 100%;
  height: 660px;
  background-color: #fff;
}
.show-user-info-content .users-info-box .users-info-table-header {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  padding-left: 30px;
  height: 60px;
  background-color: #033dfb;
}
.show-user-info-content .users-info-box .users-info-table-header .data-cell-divider {
  width: 1px;
  height: 18%;
  background-color: #fff;
}
.show-user-info-content .users-info-box .users-info-table {
  position: absolute;
  top: 60px;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 20px 0 20px 30px;
}
.show-user-info-content .users-info-box .users-info-table .user-info {
  display: flex;
  gap: 1px;
}
.show-user-info-content .users-info-box .users-info-table .user-info .data-cell {
  color: #474747;
}

.data-cell {
  display: grid;
  place-items: center;
  font-family: "맑은 고딕", "Malgun Gothic", "Apple SD Gothic Neo", "NotoSansKR", sans-serif;
  font-size: 15px;
  color: #fff;
}

.dashboard-user-number, .position {
  width: 100px;
}

.dashboard-name {
  width: 120px;
}

.reg-date, .phone-number {
  width: 150px;
}

.affiliate-org {
  width: 220px;
}

.department {
  width: 190px;
}

.task {
  width: 180px;
}

/*# sourceMappingURL=dashboard.css.map */