.locations {
  background: #f5f6f7;
}
.locations__sidebar {
  padding: 100px 16px 0 16px;
}
.locations__addreses {
  display: flex;
  padding: 0;
  margin: 0;
  width: 100%;
  overflow: auto;
  list-style: none;
  white-space: nowrap;
  gap: 40px;
  padding-bottom: 16px;
}
.locations__addreses li {
  width: 100%;
}
.address__details {
  font-size: 16px;
  margin: 6px 0 0 0;
  height: 0;
  display: none;
  transition: all ease-in-out 0.25s;
}
.address__details-mobile {
  background: #fff;
  padding: 24px 16px;
}
.address__details-mobile .name {
  font-size: 24px;
  font-weight: 700;
  color: #0f100f;
}
.address__link {
  display: none;
  margin-top: 10px;
  color: #036BAD;
  font-size: 14px;
}
.address {
  transition: all ease-in-out 0.25s;
  overflow: hidden;
}
.address.active .address__name {
  color: #242424;
  font-size: 20px;
}
.address.active .address__link,
.address__details-mobile .address__link {
  display: block;
}
.address__details-mobile .address__link {
  display: block;
}
.address__name {
  color: #afafaf;
  font-size: 18px;
  font-weight: 700;
  transition: all ease-in-out 0.25s;
}
.locations__slider {
  display: none;
  position: relative;
}
.locations__slider .page {
  position: absolute;
  color: #f0f0ff;
  bottom: 30px;
  right: 60px;
}
.locations__slider.active {
  display: block;
}
.locations__details {
  padding: 16px 24px;
  background: #0f172a;
  color: #fff8f8;
  width: 100%;
}
.locations .swiper-button-next,
.locations .swiper-button-prev {
  display: none;
}
@media only screen and (min-width: 768px) {
  .locations__details {
    position: absolute;
    bottom: 30px;
    left: 30px;
    z-index: 10;
    width: 80%;
  }
}
@media only screen and (min-width: 1024px) {
  .locations {
    display: flex;
  }
  .locations__sidebar {
    width: 30%;
    padding: 16px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .locations__items {
    width: 70%;
  }
  .locations__addreses {
    white-space: initial;
    flex-direction: column;
    gap: 8px;
  }
  .locations__details {
    width: 60%;
  }
  .locations .swiper-pagination {
    color: #f0f0ff;
    display: inline-block;
    position: absolute;
    bottom: 42px !important;
    right: 80px;
    width: auto;
    left: auto;
  }
  .locations .swiper-button-next,
  .locations .swiper-button-prev {
    display: block;
    border: 1px solid #fff;
    color: #fff;
    width: 47px;
    height: 47px;
    border-radius: 4px;
    right: 20px;
    left: auto;
    top: auto;
    bottom: 30px;
  }
  .locations .swiper-button-next::after,
  .locations .swiper-button-prev::after {
    content: '';
    background: url('data:image/svg+xml,<svg width="11" height="11" viewBox="0 0 11 11" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.62908 0.74659C6.04518 0.383443 6.67689 0.426375 7.04004 0.84248C7.40318 1.25858 7.36025 1.89029 6.94415 2.25344L4.36996 4.50001H10C10.5523 4.50001 11 4.94772 11 5.50001C11 6.05229 10.5523 6.50001 10 6.50001H4.36994L6.94415 8.74659C7.36025 9.10974 7.40318 9.74144 7.04004 10.1575C6.67689 10.5737 6.04518 10.6166 5.62908 10.2534L1.04575 6.25344C0.828148 6.06354 0.70328 5.78883 0.70328 5.50001C0.70328 5.2112 0.828148 4.93649 1.04575 4.74659L5.62908 0.74659Z" fill="%23F5F6F7"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .locations .swiper-button-next::after {
    background: url('data:image/svg+xml,<svg width="11" height="11" viewBox="0 0 11 11" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.37092 0.74659C4.95482 0.383443 4.32311 0.426375 3.95996 0.84248C3.59682 1.25858 3.63975 1.89029 4.05585 2.25344L6.63004 4.50001H1C0.447715 4.50001 0 4.94772 0 5.50001C0 6.05229 0.447715 6.50001 1 6.50001H6.63006L4.05585 8.74659C3.63975 9.10974 3.59682 9.74144 3.95996 10.1575C4.32311 10.5737 4.95482 10.6166 5.37092 10.2534L9.95425 6.25344C10.1719 6.06354 10.2967 5.78883 10.2967 5.50001C10.2967 5.2112 10.1719 4.93649 9.95425 4.74659L5.37092 0.74659Z" fill="white"/></svg>');
  }
  .locations .swiper-button-prev {
    right: 125px;
  }
  .address__name {
    font-size: 24px;
  }
  .address__details {
    height: 0;
    display: block;
  }
  .address.active .address__details {
    height: 80px;
  }
  .address.active .address__name {
    font-size: 26px;
  }
  .address__details-mobile {
    display: none;
  }
}
@media only screen and (min-width: 1440px) {
  .address__details {
    max-width: 50%;
  }
}