@charset "utf-8";

.map {
  padding-block: 200px;
  color: #333;
  background: rgba(var(--color-gold), .1);
}
.map__content {
  grid-template-columns: calc(980 / 1600 * 100%) minmax(0, 1fr);
  align-items: start;
  gap: 120px calc(120 / 1600 * 100%);
}
.map__content__head {
  grid-column: 1 / 3;
  grid-template-columns: repeat(auto-fit, minmax(0, auto));
  justify-content: start;
  align-items: baseline;
  gap: 60px 80px;
}
/* .map__content__head__heading {
} */
.map__content__head__info {
  grid-template-columns: auto auto;
  justify-content: start;
  align-items: baseline;
  gap: 40px;
}
.map__content__head__info__address {
  font-size: clamp(12px, calc(18 / 1200 * 100vw), 18px);
  line-height: 1.5;
}
.map__content__head__info__address small {
  font-size: max(10px, 65%);
}
.map__content__head__info__maplink {
  gap: 0 calc(10 / 18 * 1em);
  font-size: clamp(12px, calc(18 / 1200 * 100vw), 18px);
}
.map__content__head__info__maplink::before {
  content: "";
  display: block;
  width: calc(15 / 18 * 1em);
  height: calc(20 / 18 * 1em);
  background: currentColor;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14.92" height="20" viewBox="0 0 14.92 20"><path d="M7.46,0C3.34,0,0,3.34,0,7.46c0,6.97,7.46,12.54,7.46,12.54,0,0,7.46-5.57,7.46-12.54C14.92,3.34,11.58,0,7.46,0ZM7.46,10.76c-1.82,0-3.3-1.48-3.3-3.3s1.48-3.3,3.3-3.3,3.3,1.48,3.3,3.3-1.48,3.3-3.3,3.3Z"/></svg>') no-repeat center/100% auto;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14.92" height="20" viewBox="0 0 14.92 20"><path d="M7.46,0C3.34,0,0,3.34,0,7.46c0,6.97,7.46,12.54,7.46,12.54,0,0,7.46-5.57,7.46-12.54C14.92,3.34,11.58,0,7.46,0ZM7.46,10.76c-1.82,0-3.3-1.48-3.3-3.3s1.48-3.3,3.3-3.3,3.3,1.48,3.3,3.3-1.48,3.3-3.3,3.3Z"/></svg>') no-repeat center/100% auto;
}
/* .map__content__group {
} */
.map__content__group__heading {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0 calc(30 / 20 * 1em);
  font-size: clamp(14px, calc(20 / 1200 * 100vw), 20px);
  --margin-bottom: 60px;
}
.map__content__group__heading::after {
  content: "";
  display: block;
  height: 1px;
  background: rgb(var(--color-palegray));
}
/* .map__content__group__map {
} */
.map__content__group__catch {
  font-size: clamp(11px, calc(16 / 1200 * 100vw), 16px);
  line-height: 1.75;
}
.map__content__group__desc__item__copy {
  font-size: clamp(11px, calc(14 / 1200 * 100vw), 14px);
  line-height: 2.142857143;
  word-break: break-all;
}
.map__content__group--parking {
  grid-template-columns: calc(500 / 980 * 100%) minmax(0, 1fr);
  align-items: start;
  gap: 0 calc(60 / 980 * 100%);
}
.map__content__group--parking .map__content__group__heading {
  grid-column: 1 / 3;
}
.map__content__group--parking .map__content__group__desc {
  align-self: center;
}
/* .map__content__group--parking .map__content__group__desc__item {
}*/
.map__content__group--parking .map__content__group__desc__item--other {
  margin-top: clamp(50px, calc(80 / 1200 * 100vw), 80px);
}
.map__content__group--parking .map__content__group__desc__item__heading {
  margin-block: 0 30px;
  box-sizing: border-box;
  padding: 15px calc(20 / 16 * 1em);
  font-size: clamp(11px, calc(16 / 1200 * 100vw), 16px);
  background: rgb(var(--color-gray));
}
.map__content__group--parking .map__content__group__desc__item--main .map__content__group__desc__item__heading {
  background: #901D22;
}
.map__content__group--parking .map__content__group__desc__item__list {
  grid-template-columns: 100%;
  align-items: start;
  gap: 15px 0;
}
.map__content__group--parking .map__content__group__desc__item__list__item {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0 calc(10 / 18 * 1em);
  font-size: clamp(12px, calc(18 / 1200 * 100vw), 18px);
}
.map__content__group--parking .map__content__group__desc__item__list__item::before {
  content: "";
  align-self: start;
  display: block;
  width: calc(25 / 18 * 1em);
  height: calc(25 / 18 * 1em);
  background: url(../img/icon_parking.webp) no-repeat center/100% auto;
}
.map__content__group--parking .map__content__group__desc__item__list__item__name {
  line-height: calc(25 / 18);
}
.map__content__group--route .map__content__group__catch {
  --margin-top: 30px;
}
@media screen and (max-width: 767px){
  .map {
    padding-block: 100px;
  }
  .map__content {
    grid-template-columns: 100%;
    gap: 0;
  }
  .map__content__head {
    grid-column: 1;
    grid-template-columns: 100%;
    align-items: start;
    gap: 60px 0;
  }
  .map__content__head__info {
    grid-template-columns: 100%;
    align-items: start;
    gap: 20px 0;
  }
  .map__content__head__info__address {
    font-size: 14px;
  }
  .map__content__head__info__maplink {
    font-size: 14px;
    justify-content: start;
  }
  .map__content__group__heading {
    gap: 0 calc(22 / 16 * 1em);
    font-size: 16px;
    --margin-bottom: 30px;
  }
  .map__content__group__catch {
    font-size: 12px;
  }
  .map__content__group__desc__item__copy {
    font-size: 12px;
    line-height: 2;
  }
  .map__content__group--parking {
    grid-template-columns: 100%;
    gap: 0;
    margin-top: 60px;
  }
  .map__content__group--parking .map__content__group__heading {
    grid-column: 1;
  }
  .map__content__group--parking .map__content__group__desc {
    align-self: start;
  }
  .map__content__group--parking .map__content__group__desc__item--main {
    margin-top: 30px;
  }
  .map__content__group--parking .map__content__group__desc__item--other {
    margin-top: 30px;
  }
  .map__content__group--parking .map__content__group__desc__item__heading {
    margin-block: 0 20px;
    padding: 11px calc(12 / 14 * 1em);
    font-size: 14px;
  }
  .map__content__group--parking .map__content__group__desc__item__list {
    gap: 10px 0;
  }
  .map__content__group--parking .map__content__group__desc__item__list__item {
    gap: 0 calc(8 / 12 * 1em);
    font-size: 12px;
  }
  .map__content__group--parking .map__content__group__desc__item__list__item::before {
    width: calc(18 / 12 * 1em);
    height: calc(18 / 12 * 1em);
  }
  .map__content__group--parking .map__content__group__desc__item__list__item__name {
    line-height: calc(18 / 12);
  }
  .map__content__group--route {
    margin-top: 70px;
  }
  .map__content__group--route .map__content__group__catch {
    --margin-top: 35px;
  }
}