.c-glossary {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: calc(var(--vw) * 8);
  margin-top: calc(var(--vw) * 24);
}

.c-glossary__nav {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: calc(var(--vw) * 8);
}

.c-glossary__nav-title {
  text-align: center;
  margin-bottom: calc(var(--vw) * 16);
  margin-top: calc(var(--vw) * 24);
  color: var(--black);
  text-align: center;
}

.c-glossary__nav-item {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--gray-100);
  border-radius: calc(var(--vw) * 4);
  color: var(--gray-600);
  width: calc(var(--vw) * 32);
  height: calc(var(--vw) * 32);
}

.c-glossary__nav-item-link {
  text-decoration: none;
  font-size: calc(var(--vw) * 18);
  color: var(--black);
  font-weight: 400;
}

.c-glossary__list-title {
  border-bottom: 1px solid var(--gray-200);
  margin-bottom: calc(var(--vw) * 16);
  margin-top: calc(var(--vw) * 16);
}

.c-glossary__list {
  display: flex;
  flex-wrap: wrap;
}

.c-glossary__list li {
  padding-top: calc(var(--vw) * 16);
  padding-bottom: calc(var(--vw) * 16);
}

.c-glossary__list li a {
  text-decoration: none;
  font-size: calc(var(--vw) * 16);
  color: var(--gray-600);
  font-weight: 600;
}

@media (min-width: 768px) {
  .c-glossary__list li {
    flex: 0 0 50%;
  }
}

@media (min-width: 1024px) {
  .c-glossary__list li {
    flex: 0 0 25%;
  }
}