@charset "UTF-8";
.p-access {
  inline-size: min(var(--ratio-full), var(--layout-content-narrow-width) + var(--layout-page-gutter) * 2);
  margin-inline: auto;
}

.p-access .p-access__phone {
  color: var(--semantic-text-secondary);
}
@media (min-width: 768px) {
  .p-access .p-access__phone {
    color: var(--semantic-text-primary);
  }
}

.p-access__overview,
.p-access__location,
.p-access__section-inner,
.p-access__vehicle-summary,
.p-access__parking-map,
.p-access__parking-place,
.p-access__transport-mode,
.p-access__final-notes {
  display: grid;
}

.p-access__overview,
.p-access__section-inner,
.p-access__vehicle-summary {
  gap: var(--layout-section-padding-inner-large);
}

.p-access__location,
.p-access__parking-map,
.p-access__final-notes {
  gap: var(--layout-section-padding-inner-small);
}

.p-access__map,
.p-access__parking-map-image {
  margin-block: var(--space-0);
}

.p-access__map iframe {
  display: block;
  inline-size: var(--ratio-full);
  block-size: calc(var(--space-256) + var(--space-128) + var(--space-96) + var(--space-8) - var(--space-2));
  border: var(--space-0);
}

.p-access__anchors .c-anchor-button-list {
  grid-template-columns: repeat(2, minmax(var(--space-0), 1fr));
  gap: var(--layout-grid-gap);
}

.p-access__description {
  display: grid;
  gap: var(--space-16);
}
.p-access__description > p {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  margin: var(--space-0);
}

.p-access__bullet-list {
  display: grid;
  gap: var(--component-list-gap-vertical);
}

.p-access__bullet-list li {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: grid;
  grid-template-columns: var(--space-16) minmax(var(--space-0), 1fr);
  gap: var(--space-4);
}
.p-access__bullet-list li::before {
  content: "";
  inline-size: var(--space-16);
  block-size: var(--space-24);
  background: url("../images/access/icon-list-marker.svg") no-repeat center/contain;
}

.p-access__bullet-list p {
  margin: var(--space-0);
}

.p-access__parking-map {
  justify-items: center;
}

.p-access__parking-map-image {
  inline-size: var(--ratio-full);
}

.p-access__parking-map-image img {
  display: block;
  inline-size: var(--ratio-full);
  block-size: auto;
}

.p-access__parking-notes {
  inline-size: var(--ratio-full);
}

.p-access__parking-button {
  min-block-size: var(--space-48);
}

.p-access__parking-place-title,
.p-access__transport-title {
  display: flex;
  align-items: center;
}

.p-access__parking-place-title {
  gap: var(--space-8);
}

.p-access__parking-place-number {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: grid;
  flex: none;
  inline-size: var(--space-20);
  block-size: var(--space-20);
  place-content: center;
  border-radius: var(--layout-circle-radius);
  background: var(--semantic-background-inverse-base);
  color: var(--semantic-text-inverse-primary);
}

.p-access__parking-place-inner {
  display: grid;
  gap: var(--space-0);
}

.p-access__transport-title {
  font-size: var(--font-size-18);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  gap: var(--space-12);
}

.p-access__transport-title img {
  flex: none;
  inline-size: var(--space-40);
  block-size: var(--space-40);
}

.p-access__final-notes > p {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  margin: var(--space-0);
  color: var(--semantic-text-state-error);
}

/* SPの車両概要はFigmaのHeading-2終端余白、PCはHeading-3終端余白へ接続する */
.p-access__vehicle-summary {
  --section-padding-block-end: var(--layout-section-padding-heading-2);
}

@media (min-width: 768px) {
  .p-access__overview > .p-access__location {
    justify-items: center;
  }
  .p-access__overview > .p-access__location > * {
    inline-size: min(var(--ratio-full), var(--space-256) * 3 + var(--space-56) - var(--space-2));
  }
  .p-access__map iframe {
    block-size: calc(var(--space-256) + var(--space-128) + var(--space-64) + var(--space-12));
  }
  .p-access__vehicle-summary {
    --section-padding-block-end: var(--layout-section-padding-heading-3);
  }
  .p-access__parking-place-inner > .p-access__transport-mode[data-section-spacing] {
    --section-padding-block-end: var(--space-0);
  }
  .p-access__parking-button {
    font-size: var(--font-size-16);
  }
  .p-access__parking-map-image,
  .p-access__parking-notes {
    inline-size: calc(var(--space-256) * 2 + var(--space-96));
  }
  .p-access__parking-button {
    inline-size: calc(var(--space-256) + var(--space-28));
  }
  .p-access__parking-place-number {
    font-size: var(--font-size-16);
    inline-size: var(--space-24);
    block-size: var(--space-24);
  }
  .p-access__parking-place-inner {
    grid-template-columns: repeat(2, minmax(var(--space-0), 1fr));
    gap: var(--layout-grid-gap);
  }
  .p-access__transport-title img {
    inline-size: var(--space-48);
    block-size: var(--space-48);
  }
  .p-access__transport-title {
    font-size: var(--font-size-20);
  }
}
