.Map.Detail {
  position: relative;
}
@media all and (min-width: 1200px) {
  .Map.Detail {
    mask-image: url("/wp-content/themes/ibizz/images/mask/map-mask.svg");
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
  }
}
@media (max-width: 768px) {
  .Map.Detail {
    mask-image: none;
    padding: 3.75rem 0;
    margin: 0;
  }
  .Map.Detail::before {
    content: "";
    left: 50%;
    max-width: 100.2vw;
    transform: var(--transform, translateX(-50%));
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: -1;
    width: 120rem;
    background: #E77724;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  .Map.Detail::before {
    max-width: 100vw;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .Map.Detail {
    mask-image: none;
    padding: 3.75rem 0;
    margin: 0;
  }
  .Map.Detail::before {
    content: "";
    left: 50%;
    max-width: 100.2vw;
    transform: var(--transform, translateX(-50%));
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: -1;
    width: 120rem;
    background: #E77724;
  }
}
@media (min-width: 768px) and (max-width: 1024px) and (max-width: 768px) {
  .Map.Detail::before {
    max-width: 100vw;
  }
}
.Map.Detail > .inner {
  position: relative;
  background: #E77724;
  display: flex;
}
@media (max-width: 768px) {
  .Map.Detail > .inner {
    flex-direction: column;
  }
}
@media (min-width: 1024px) {
  .Map.Detail > .inner > .location-list {
    padding-left: 11.25rem;
    padding-top: 5rem;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 88;
    max-width: 35%;
  }
}
.Map.Detail > .inner > .location-list > .Heading .h2 {
  margin-bottom: 0.625rem;
  color: #F3D03E;
}
.Map.Detail > .inner > .location-list ul {
  gap: 1.25rem;
}
.Map.Detail > .inner > .location-list li > .inner > .Heading {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.Map.Detail > .inner > .location-list li > .inner > .Heading span.icon {
  display: flex;
}
.Map.Detail > .inner > .location-list li > .inner > .Heading span.icon img {
  width: 1.1875rem;
  height: 1.3125rem;
}
.Map.Detail > .inner > .location-list li > .inner > .Heading .h4 {
  color: #131313;
  margin: 0;
}
.Map.Detail > .inner > .location-list li > .inner > .Heading:hover span.icon img {
  content: url("/wp-content/themes/ibizz/images/pointer-hover.svg");
}
@media (min-width: 1024px) {
  .Map.Detail > .inner > .map {
    margin-left: auto;
  }
}
.Map.Detail > .inner > .map .wrap_svl_center_box {
  position: relative;
}
@media (min-width: 1024px) {
  .Map.Detail > .inner > .map .wrap_svl_center_box {
    width: 70vw;
    left: 70%;
    transform: translate(-70%, 0);
  }
}
.Map.Detail > .inner > .map #popup-wrap {
  inset: 8.75rem 12.5rem auto auto !important;
  position: absolute;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}
.Map.Detail > .inner > .map #popup-wrap.active {
  opacity: 1;
}
.Map.Detail > .inner > .map #popup-wrap:hover::after {
  content: url("/wp-content/themes/ibizz/images/popup-arrow.svg");
  position: absolute;
  right: 0.25rem;
  bottom: 0.4375rem;
  width: 2.4375rem;
  height: 2.4375rem;
}
.Map.Detail > .inner > .map #popup-wrap > .box_view_html {
  mask-image: url("/wp-content/themes/ibizz/images/mask/map-popup-mask.svg");
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}
@media (max-width: 768px) {
  .Map.Detail > .inner > .map #popup-wrap {
    inset: 1.25rem -1.25rem auto auto !important;
    z-index: 99;
  }
  .Map.Detail > .inner > .map #popup-wrap > .box_view_html {
    mask-image: url("/wp-content/themes/ibizz/images/mask/map-popup-mask-mobile.svg");
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    padding: 0;
  }
  .Map.Detail > .inner > .map #popup-wrap > .box_view_html > * {
    width: 85%;
    margin-left: auto;
  }
  .Map.Detail > .inner > .map #popup-wrap > .box_view_html > .close_ihp {
    position: absolute;
    right: 3.125rem;
    display: flex;
    justify-content: flex-end;
  }
}
.Map.Detail > .inner > .map #popup-wrap > * {
  color: #131313 !important;
  background: #FFF4E1;
  width: 15.125rem;
  min-height: 15.125rem;
  padding: 1.25rem 1.5625rem;
}
@media (max-width: 768px) {
  .Map.Detail > .inner > .map #popup-wrap > * {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .Map.Detail > .inner > .map #popup-wrap > * {
    width: 100vw;
  }
}
.Map.Detail > .inner > .map #popup-wrap > * p {
  text-align: left;
  font-size: 0.75rem;
  font-weight: 500;
}
.Map.Detail > .inner > .map #popup-wrap > * p:first-of-type {
  margin-top: 0;
}
@media (max-width: 768px) {
  .Map.Detail > .inner > .map #popup-wrap > * p:first-of-type {
    margin-top: 0.9375rem;
  }
}
.Map.Detail > .inner > .map #popup-wrap > * p strong {
  font-weight: 500;
  font-size: 1rem;
}
.Map.Detail > .inner > .map #popup-wrap > * p em {
  text-transform: uppercase;
  font-style: normal;
}
.Map.Detail > .inner > .map #popup-wrap span.close_ihp svg {
  fill: #131313;
}
.Map.Detail > .inner > .map body .wrap_svl img.pins_image_hover, .Map.Detail > .inner > .map body .wrap_svl .point_style.has-hover:hover img.pins_image {
  cursor: pointer;
  width: 1.875rem;
  height: 1.875rem;
}
.Map.Detail > .inner > .map .drag_element {
  width: 1.875rem;
  height: 1.875rem;
}
.Map.Detail > .inner > .map .drag_element .point_style {
  cursor: pointer;
}
.Map.Detail > .inner > .map .drag_element .point_style img {
  width: 1.875rem;
  height: 1.875rem;
  transition: all 0.15s ease-in-out;
}
.Map.Detail > .inner > .map .drag_element .point_style img:hover, .Map.Detail > .inner > .map .drag_element .point_style img.active, .Map.Detail > .inner > .map .drag_element .point_style img.li-active {
  content: url("/wp-content/themes/ibizz/images/pointer-hover.svg");
}
.Map.Detail > .inner > .map .drag_element .point_style img + span {
  left: -17px;
  top: -17px;
  position: absolute;
  width: 100%;
  height: 1.875rem;
  z-index: 9;
  color: white;
  pointer-events: none;
  display: flex !important;
  justify-content: center;
  align-items: center;
}
@media (max-width: 768px) {
  .Map.Detail > .inner > .map .drag_element .point_style img + span {
    left: -21px;
    top: -21px;
  }
}
@media (max-width: 768px) {
  .Map.Detail > .inner > .map .drag_element .point_style img + span {
    width: 34px;
    height: 34px;
  }
}
.Map.Detail > .inner > .map .drag_element .point_style span {
  display: none !important;
}
@media (max-width: 768px) {
  .Map.Detail > .inner > .map .wrap_svl_center {
    overflow: hidden;
    width: 100%;
  }
}
@media (max-width: 1400px) and (min-width: 1024px) {
  .Map.Detail {
    mask-image: none;
    border-radius: 1.25rem;
    overflow: hidden;
  }
  .Map.Detail .location-list {
    padding-top: 2.5rem !important;
    padding-left: 2.5rem !important;
  }
}