.ntl-bubble-list {
  display: flex;
  flex-direction: column;
  gap: 80px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.ntl-bubble-list__item {
  position: relative;
  width: 100%;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: row;
  --bubble-size: 100px;
  padding-left: calc(var(--bubble-size) + 20px);
  list-style: none;
  min-height: var(--bubble-size);
}

.ntl-bubble-list__item:not(:last-child)::after {
  position: absolute;
  content: "";
  width: 2px;
  height: 70px;
  bottom: -75px;
  left: calc(var(--bubble-size) / 2);
  transform: translateX(-50%);
  background-color: var(--line-color);
}

.ntl-bubble-list__item-bubble,
.ntl-bubble-list__item-bubble-shadow,
.ntl-bubble-list__item-index-wrapper {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  height: auto;
  max-width: var(--bubble-size);
  max-height: var(--bubble-size);
}

.ntl-bubble-list__item-bubble {
  fill: var(--bubble-color);
}

.ntl-bubble-list__item-bubble-shadow {
  fill: var(--bubble-shadow-color);
}

.ntl-bubble-list__item-bubble-shadow {
  transform: translateY(-50%) scale(1.05, 0.95);
}

.ntl-bubble-list__item-index-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
}

.ntl-bubble-list__item-text-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
	transform:translateX(10%);
	transition:.3s;
  opacity: 0;
}

.ntl-bubble-list .ntl-bubble-list__item.ntl-bubble-list__item--visible .ntl-bubble-list__item-text-wrapper {
	opacity:1;
	transform:translateX(0);
}