:root {
  --color-text: #231815;
  --color-gray: #737373;
  --color-gray-light: #e6e6e6;
  --color-white: #ffffff;
  --font-size-xsmall: clamp(10.5px, 0.656rem + ((1vw - 3.2px) * 0.384), 14px);
  --font-size-small: clamp(12px, 0.75rem + ((1vw - 3.2px) * 0.439), 16px);
  --font-size-medium: clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.439), 18px);
  --font-size-large: clamp(16px, 1rem + ((1vw - 3.2px) * 0.439), 20px);
  --font-size-x-large: clamp(16px, 1rem + ((1vw - 3.2px) * 0.877), 24px);
  --font-size-xx-large: clamp(20px, 1.25rem + ((1vw - 3.2px) * 0.877), 28px);
  --lending-trim: calc((1em - 1lh) / 2);
}

@supports not (top: 1lh) {
  :root {
    --lending-trim: 0;
  }
}
img {
  max-width: 100%;
  height: auto;
}

.c-group {
  container-type: inline-size;
  width: 100%;
  max-width: 456px;
}
.c-group__map {
  position: relative;
  aspect-ratio: 456/504;
  border: solid 2px var(--color-white);
  background: url("images/map-260319.jpg") no-repeat top/cover;
}
.c-group__map-item {
  display: flex;
  align-items: flex-start;
  width: -moz-fit-content;
  width: fit-content;
  cursor: pointer;
}
.c-group__map-item-pin {
  flex-shrink: 0;
  aspect-ratio: 1/1;
  width: 2.1710526316%;
  width: 2.1710526316cqw;
  transform: translateY(30%);
}
.c-group__map-item-text {
  font-size: 2.4122807018%;
  font-size: 2.4122807018cqw;
  line-height: 1.3636363636;
  font-feature-settings: "halt";
}
.c-group__map-item-text .small {
  font-size: 1.9736842105cqw;
}
.c-group__map-item.--connect-with {
  display: flex;
  position: absolute;
  gap: 1.5px;
}
.c-group__map-item.--subgroup {
  gap: 2.5px;
}
.c-group__map-item.--shinkawa {
  top: 21.0317460317%;
  left: 11.8421052632%;
}
.c-group__map-item.--asuhi {
  top: 4.3650793651%;
  left: 40.5701754386%;
}
.c-group__map-item.--iwami {
  top: 32.5396825397%;
  left: 4.1666666667%;
}
.c-group__map-item.--heartful {
  top: 60.3174603175%;
  left: 14.6929824561%;
}
.c-group__map-item.--tomishiro {
  top: 69.0476190476%;
  left: 4.1666666667%;
}
.c-group__map-item.--kiroro {
  top: 52.1825396825%;
  left: 29.1666666667%;
}
.c-group__map-item.--yokohama-izumi {
  top: 82.5396825397%;
  left: 40.350877193%;
}
.c-group__map-subgroup {
  position: absolute;
  border: solid 1px var(--color-text);
}
.c-group__map-subgroup-title {
  padding-top: 0.4385964912cqw;
  padding-bottom: 0.6578947368cqw;
  padding-inline: 1.7543859649cqw;
  background-color: var(--color-text);
  color: var(--color-white);
  font-size: 2.4122807018cqw;
  line-height: 1.0909090909;
  font-feature-settings: "halt";
}
.c-group__map-subgroup-title .small {
  font-size: 1.7543859649cqw;
  line-height: 1.75;
}
.c-group__map-subgroup-list {
  padding-inline: 1.0964912281cqw;
  padding-block: 0.4385964912cqw;
  background-color: var(--color-white);
}
.c-group__map-subgroup.--otakibashi {
  top: 13.4920634921%;
  left: 57.8947368421%;
}
.c-group__map-subgroup.--amc {
  top: 51.1904761905%;
  left: 54.8245614035%;
}
.c-group__map-description {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0.875273523cqw 2.6258205689cqw;
  background-color: rgba(255, 255, 255, 0.7);
}
.c-group__map-description-pin {
  aspect-ratio: 1/1;
  width: 2.1663019694cqw;
  vertical-align: middle;
}
.c-group__map-description-list {
  display: flex;
  -moz-column-gap: 2.6258205689cqw;
  column-gap: 2.6258205689cqw;
  row-gap: 0.6564551422cqw;
  flex-wrap: wrap;
  font-size: 2.6258205689cqw;
  line-height: 1.1666666667;
}
.c-group__map-description-list .small {
  font-size: 2.1881838074cqw;
  line-height: 1.4;
}
.c-group__map-description-list > li {
  display: flex;
  align-items: flex-start;
  gap: 0.875273523cqw;
  font-feature-settings: "halt";
}
.c-group__map-description-list > li .c-group__map-description-pin {
  flex-shrink: 0;
  transform: translateY(20%);
}
.c-group__map-description-list > li:not(:last-child) {
  letter-spacing: 0.1em;
}
.c-group__map-description-list > li:last-child {
  letter-spacing: 0;
}
.c-group__map-description-type {
  display: flex;
  position: absolute;
  right: 4.3763676149cqw;
  bottom: 0.875273523cqw;
  align-items: center;
  gap: 0;
  font-size: 2.1881838074cqw;
  line-height: 1.2;
}
.c-group__map-description-type > li:not(:last-child) {
  margin-right: 1.3129102845cqw;
}
.c-group__map-description-type::before {
  content: "[";
}
.c-group__map-description-type::after {
  content: "]";
}
.c-group__detail {
  display: flex;
  flex-direction: column;
  padding-inline: 4.6052631579cqw;
  padding-block: 5.0438596491cqw;
  gap: 4.3859649123cqw;
  border: solid 2px var(--color-white);
  border-top: none;
  background-color: var(--color-gray-light);
}
.c-group__detail-left {
  flex: 0 1 auto;
}
.c-group__detail-left img {
  width: 50%;
}
.c-group__detail-right {
  flex: 0 1 auto;
}
.c-group__detail-title {
  margin-bottom: calc(13px + var(--lending-trim));
  font-size: var(--font-size-small);
  letter-spacing: 0.24em;
}
.c-group__detail-text {
  margin-bottom: 0;
  font-size: var(--font-size-xsmall);
  line-height: 2;
  letter-spacing: 0.02em;
}
.c-group__detail-info {
  font-size: var(--font-size-xsmall);
  line-height: 2;
}
.c-group__detail-info-wrapper {
  display: flex;
  gap: 1em;
}
.c-group__detail-info-web {
  color: #38acb5;
}