@charset "UTF-8";
/* ========================
アクセス全体設定
======================== */
.page-title-area::before {
  background-image: url(../images/page-title/page-title-access.jpg);
  filter: blur(2px);
}

/* ========================
マップ・行き方
======================== */
#map .google-map-frame {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  margin-bottom: var(--margin-element-large-pc);
}

#map .guide-card-list {
  display: flex;
  justify-content: space-between;
  gap: 24px;
}

#map .guide-card {
  width: 100%;
  max-width: var(--width-contents-small);
  padding: 40px;
  gap: var(--margin-element-small-pc);
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: var(--color-base-second);
  border-radius: 8px;
}

#map .guide-card .main-text {
  min-height: 57px;
  display: flex;
  align-items: center;
}

/*スマートフォン*/
@media screen and (max-width: 767px) {
  #map .google-map-frame {
    aspect-ratio: 4/3;
    margin-bottom: var(--margin-element-large-sp);
  }

  #map .guide-card-list {
    flex-direction: column;
    align-items: center;
  }
}

/* ========================
お問い合わせ
======================== */
#contact .contact-box {
  margin: 0 auto;
  max-width: 710px;
  padding: 48px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--gutter-small-pc);
  border: solid 1px var(--color-sub);
}

#contact .contact-box .phone {
  font: var(--font-text-normal-bold);
  font-size: 3rem; /*48px*/
}

#contact .contact-box .address,
#contact .contact-box .hours {
  font: var(--font-text-normal);
}

/*スマートフォン*/
@media screen and (max-width: 767px) {
  #contact .contact-box {
    max-width: var(--width-contents-medium);
    padding: 24px 8px;
    gap: var(--gutter-small-sp);
  }

  #contact .contact-box .phone {
    font-size: 1.75rem; /*28px*/
  }
}