.area-links-wrapper {
  margin-top: 40px;
}

.area-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 16px;
  row-gap: 16px;
}

.area-links--sub {
  column-gap: 8px;
  row-gap: 4px;
}

.area-link {
  display: flex;
  align-items: center;
  gap: 16px;
}

.area-links--sub .area-link {
  gap: 8px;
}

.area-links .area-link:not(:last-child)::after {
  content: "";
  display: block;
  width: 1px;
  height: 16px;
  background: #ccc;
}

.all-area-links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.area-links-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.area-children-links {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-left: 1em;
}