.block_map {
  width: 100%;
  margin: 120px 0;
}

.block_map .container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 60px 70px;
}

.block_map h2 {
  width: 100%;
  text-align: center;
  font-size: 30px;
}

.block_map_content {
  width: 32%;
  max-width: 407px;
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.map_wrap {
  display: flex;
  flex-direction: column;
  gap: 25px;
  padding: 25px;
  border-radius: 20px;
  background: var(--Gray);
}

.map_wrap strong {
  font-size: 18px;
  font-weight: 600;
  line-height: 140%;
}

.map_wrap ul {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.map_wrap li {
  font-size: 16px;
  font-weight: 500;
  line-height: 130%;
  letter-spacing: 0.32px;
  padding-left: 25px;
  position: relative;
}

.map_wrap li::before {
  content: "";
  position: absolute;
  left: 0;
  rotate: 32deg;
  top: 0;
  background-image: var(--Theme-Arrow);
  background-repeat: no-repeat;
  background-size: contain;
  width: 16px;
  height: 16px;
}

.block_map_wrap {
  width: 61%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 60px;
}

.block_map_wrap img {
  object-fit: contain;
  aspect-ratio: 759 / 424;
}

.block_map_wrap ul {
  display: flex;
  align-items: center;
  gap: 30px;
}

.block_map_wrap li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 400;
  line-height: 130%;
  letter-spacing: 0.32px;
  padding-left: 30px;
  position: relative;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='22' viewBox='0 0 1 22' fill='none'><line x1='0.5' y1='1' x2='0.5' y2='21' stroke='%23868686' stroke-linecap='round' stroke-dasharray='4 3.5' /></svg>");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 1px 22px;
}

.block_map_wrap li:first-of-type {
  padding-left: 0;
  background-image: none;
}

.block_map_wrap li::before {
  content: "";
  display: flex;
  min-width: 16px;
  aspect-ratio: 1 / 1;
  border-radius: 50px;
}

.block_map_wrap .green::before {
  background-color: #479d75;
}

.block_map_wrap .blue::before {
  background-color: #335996;
}

.block_map_wrap .yellow::before {
  background-color: #e8c135;
}

@media (max-width: 1200px) {
  .block_map {
    margin: 80px 0;
  }

  .block_map .container {
    gap: 40px 25px;
  }

  .block_map_content {
    width: 35%;
    gap: 20px;
  }

  .map_wrap {
    gap: 20px;
    padding: 25px 20px;
  }

  .block_map_wrap ul {
    flex-wrap: wrap;
    gap: 15px;
  }

  .block_map_wrap li {
    padding-left: 0;
    background-image: none;
  }
}

@media (max-width: 768px) {

  .block_map_content,
  .block_map_wrap {
    width: 100%;
    max-width: 100%;
  }

  .block_map_wrap {
    gap: 40px;
  }

  .block_map_wrap img {
    aspect-ratio: 343 / 192;
  }
}

@media (max-width: 420px) {
  .block_map_wrap ul {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }

  .block_map_wrap li,
  .block_map_wrap li:first-of-type {
    padding-bottom: 12px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="631" height="1" viewBox="0 0 631 1" fill="none"><line x1="0.5" y1="0.5" x2="630.5" y2="0.5" stroke="%23868686" stroke-width="1" stroke-linecap="round" stroke-dasharray="6 6"/></svg>');
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: 100% 2px;
    width: 100%;
  }

  .block_map_wrap li:last-of-type {
    padding-bottom: 0;
    background-image: none;
  }
}