.city-item {
  margin-bottom: 1rem;
  padding: 1rem 2rem;
}
.city-item::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  top: 84px;
  width: 22%;
  height: 64%;
  pointer-events: none;
}

.city-item:nth-of-type(1):nth-child(odd)::before {
  left: 66%;
  background: linear-gradient(74deg, transparent 0%, transparent 10%, #38b6ab 10%, #38b6ab 20%, transparent 20%, transparent 35%, #38b6ab 35%, #38b6ab 45%, transparent 45%, transparent 60%, #38b6ab 60%, #38b6ab 70%, transparent 70%);
}
.city-item:nth-of-type(1):nth-child(even)::before {
  left: 22%;
  background: linear-gradient(106deg, transparent 20%, transparent 30%, #38b6ab 30%, #38b6ab 40%, transparent 40%, transparent 55%, #38b6ab 55%, #38b6ab 65%, transparent 65%, transparent 80%, #38b6ab 80%, #38b6ab 90%, transparent 90%);
}

.city-item:nth-of-type(2):nth-child(odd)::before {
  left: 66%;
  background: linear-gradient(74deg, transparent 0%, transparent 10%, #57ba82 10%, #57ba82 20%, transparent 20%, transparent 35%, #57ba82 35%, #57ba82 45%, transparent 45%, transparent 60%, #57ba82 60%, #57ba82 70%, transparent 70%);
}
.city-item:nth-of-type(2):nth-child(even)::before {
  left: 22%;
  background: linear-gradient(106deg, transparent 20%, transparent 30%, #57ba82 30%, #57ba82 40%, transparent 40%, transparent 55%, #57ba82 55%, #57ba82 65%, transparent 65%, transparent 80%, #57ba82 80%, #57ba82 90%, transparent 90%);
}

.city-item:nth-of-type(3):nth-child(odd)::before {
  left: 66%;
  background: linear-gradient(74deg, transparent 0%, transparent 10%, #76be59 10%, #76be59 20%, transparent 20%, transparent 35%, #76be59 35%, #76be59 45%, transparent 45%, transparent 60%, #76be59 60%, #76be59 70%, transparent 70%);
}
.city-item:nth-of-type(3):nth-child(even)::before {
  left: 22%;
  background: linear-gradient(106deg, transparent 20%, transparent 30%, #76be59 30%, #76be59 40%, transparent 40%, transparent 55%, #76be59 55%, #76be59 65%, transparent 65%, transparent 80%, #76be59 80%, #76be59 90%, transparent 90%);
}

.city-item:nth-of-type(4):nth-child(odd)::before {
  left: 66%;
  background: linear-gradient(74deg, transparent 0%, transparent 10%, #95c230 10%, #95c230 20%, transparent 20%, transparent 35%, #95c230 35%, #95c230 45%, transparent 45%, transparent 60%, #95c230 60%, #95c230 70%, transparent 70%);
}
.city-item:nth-of-type(4):nth-child(even)::before {
  left: 22%;
  background: linear-gradient(106deg, transparent 20%, transparent 30%, #95c230 30%, #95c230 40%, transparent 40%, transparent 55%, #95c230 55%, #95c230 65%, transparent 65%, transparent 80%, #95c230 80%, #95c230 90%, transparent 90%);
}