.pingshang_services_main {
  padding: 80px 0;
  background: #fef8f8;
  background-size: 100% 100%;
  background-position: center top;
  background-repeat: no-repeat;
}

.pingshang_services_main .container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px;
}

.pingshang_services_head {
  text-align: center;
}

.pingshang_services_title {
  margin: 0;
}

.pingshang_services_subtitle {
  margin: 30px auto 0;
  max-width: 1060px;
  color: #000;
  text-align: center;
  font-family: var(--font-text-family);
  font-size: var(--font-18);
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-transform: capitalize;
}

.pingshang_services_flags {
  margin: 60px auto 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
}

.pingshang_services_flag_item {
  width: 81px;
  height: 81px;
}

.pingshang_services_flag_icon {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.pingshang_services_map_wrap {
  margin-top: 66px;
  position: relative;
}

.pingshang_services_map {
  width: 100%;
  height: auto;
  display: block;
}

.pingshang_services_markers {
  list-style: none;
  margin: 0;
  padding: 0;
}

.pingshang_services_marker {
  position: absolute;
}

.pingshang_services_pin {
  width: 73px;
  aspect-ratio: 1;
  border: none;
  padding: 0;
  background-color: transparent;
  background-image: var(--pin-bg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  position: relative;
  box-shadow: none;
  transition: background-image 0.2s ease;
}

.marker-3 .pingshang_services_pin {
  background-image: var(--pin-hover-bg);
}

/* .pingshang_services_marker:hover .pingshang_services_pin,
.pingshang_services_marker:focus-within .pingshang_services_pin {
  background-image: var(--pin-hover-bg);
} */

.pingshang_services_label {
  position: absolute;
  white-space: nowrap;
  padding: 8px 14px;
  width: 204px;
  /* height: 67px; */
  aspect-ratio: 204/67;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  color: #4B2423;
  font-size: var(--font-20);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease;
  background: linear-gradient(0deg, #FFF 0%, #FFF 100%), #F4C3C1;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: none;
}

.pingshang_services_label.is-visible,
.pingshang_services_marker:focus-within .pingshang_services_label {
  opacity: 1;
  visibility: visible;
}

.marker-1 { left: 84%; top: 79%; }
.marker-2 { left: 50%; top: 3%; }
.marker-3 { left: 40%; top: 13%; }
.marker-4 { left: 46%; top: 14%; }
.marker-5 { left: 39%; top: 20%; }
.marker-6 { left: 10%; top: 36%; }

.marker-1 .pingshang_services_label,
.marker-6 .pingshang_services_label{
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%);
}

.marker-3 .pingshang_services_label {
  left: -20%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%);
}
.marker-5 .pingshang_services_label
 {
    right: 0px;
    bottom: 10px;
    transform: translateX(-40%);
}

.marker-2 .pingshang_services_label{
  bottom: 30px;
  transform: translateX(40%);
}
.marker-4 .pingshang_services_label {
    top: 20px;
    transform: translateX(40%);
}

@media screen and (min-width: 1600px) {
  .pingshang_services_main .container { max-width: 1360px; }
}
@media screen and (max-width: 1400px) {
  .pingshang_services_main { padding: 70px 0; }
  .pingshang_services_subtitle { font-size: 20px; }
  .pingshang_services_pin { width: 66px; }
  .pingshang_services_label { width: 188px; }
}
@media screen and (max-width: 1200px) {
  .pingshang_services_main { padding: 60px 0; }
  .pingshang_services_subtitle { font-size: 18px; }
  .pingshang_services_flag_item { width: 72px; height: 72px; }
  .pingshang_services_pin { width: 58px; }
  .pingshang_services_label { width: 168px;}
}
@media screen and (max-width: 992px) {
  .pingshang_services_main { padding: 50px 0; }
  .pingshang_services_subtitle { font-size: 16px; }
  .pingshang_services_flag_item { width: 64px; height: 64px; }
  .pingshang_services_pin { width: 46px; }
  .pingshang_services_label { width: 142px; }
  .marker-2 .pingshang_services_label{bottom: 10px;}
  .marker-4 .pingshang_services_label { top: 10px;}
}
@media screen and (max-width: 768px) {
  .pingshang_services_main { padding: 40px 0; }
  .pingshang_services_subtitle { margin-top: 16px; font-size: 14px; line-height: 1.5; }
  .pingshang_services_flags { gap: 12px; margin-top: 20px; }
  .pingshang_services_flag_item { width: 54px; height: 54px; }
  .pingshang_services_map_wrap { margin-top: 20px; }
  .pingshang_services_pin { width: 38px; }
  .pingshang_services_label { width: 122px; }
}
@media screen and (max-width: 576px) {
  .pingshang_services_main { padding: 30px 0; }
  .pingshang_services_main .container { padding: 0 12px; }
  .pingshang_services_subtitle { font-size: 13px; }
  .pingshang_services_pin { width: 32px; }
  .pingshang_services_label { width: 108px; }
  .marker-5 .pingshang_services_label{ transform: translateX(-28%); }
}