/* TOP・下層共通。既存ロゴから医院名の文字部分を表示する。 */
.clinic-wordmark {
  position: relative;
  display: block;
  width: 100%;
  max-width: 676px;
  aspect-ratio: 676 / 58;
  overflow: hidden;
}
.clinic-wordmark img {
  position: absolute;
  display: block;
  width: 133.284024%;
  max-width: none;
  height: auto;
  left: -33.284024%;
  top: -51.724138%;
}
.p-top__greeting-title .clinic-wordmark { margin-inline: auto; }
.clinic-director-label { display: block; margin-top: 18px; }
.clinic-staff-profile { display: grid; grid-template-columns: minmax(160px, 240px) minmax(0, 1fr); gap: 32px; align-items: start; }
.clinic-staff-profile__body { min-width: 0; }
.clinic-staff-photo {
  aspect-ratio: 3 / 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  border: 1px solid #d1dce4;
  border-radius: 8px;
  background: #eff4f7;
  color: #6a8498;
  font-size: 15px;
  letter-spacing: .1em;
}
.clinic-floating { display: none; }
@media (max-width: 900px) {
  body { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }
  .clinic-floating {
    position: fixed;
    z-index: 100;
    inset: auto 0 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    background: #fff;
    box-shadow: 0 -2px 12px rgb(0 0 0 / 10%);
  }
  .clinic-floating__link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    min-height: calc(72px + env(safe-area-inset-bottom, 0px));
    padding: 8px 4px calc(8px + env(safe-area-inset-bottom, 0px));
    color: #fff;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
  }
  .clinic-floating__link--tel { background: #164b77; }
  .clinic-floating__link--web { background: #0077aa; }
  .clinic-floating__link--line { background: #06a947; }
  .clinic-floating__link svg, .clinic-floating__link img { width: 24px; height: 24px; object-fit: contain; }
  .clinic-floating__link:focus-visible { outline: 3px solid #fff; outline-offset: -5px; }
}
@media (max-width: 767px) {
  .clinic-staff-profile { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .clinic-staff-photo { width: min(100%, 210px); margin-inline: auto; }
}

/* TOP: latest blog posts, between FAQ and gallery. */
.p-top__blog { padding: 88px 24px; background: #fff; color: #333; }
.p-top__blog-inner { max-width: 1000px; margin-inline: auto; }
.p-top__blog-heading { margin: 0 0 48px; text-align: center; font-family: "Zen Old Mincho", serif; font-weight: 400; }
.p-top__blog-heading .en { display: block; font-size: 60px; line-height: 1.2; letter-spacing: .05em; }
.p-top__blog-heading .jp { display: block; margin-top: 12px; font-size: 20px; line-height: 1.6; }
.p-top__blog-heading .jp::before { content: ""; display: block; width: 50px; height: 1px; margin: 0 auto 10px; background: currentColor; }
.p-top__blog-list { margin: 0; padding: 0; list-style: none; }
.p-top__blog-item { border-bottom: 1px dashed #ccc; }
.p-top__blog-link { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 12px; padding: 22px 0; color: inherit; text-decoration: none; line-height: 1.8; font-size: 16px; }
.p-top__blog-date { color: #164b77; font-variant-numeric: tabular-nums; }
.p-top__blog-title { overflow-wrap: anywhere; }
.p-top__blog-link:hover .p-top__blog-title { text-decoration: underline; text-underline-offset: 4px; }
.p-top__blog-btn-wrap { margin-top: 40px; text-align: center; }
.p-top__blog-btn { display: inline-flex; align-items: center; justify-content: center; gap: 12px; width: min(100%, 310px); min-height: 66px; padding: 16px 24px; background: #f0f253; color: #454545; font-size: 18px; font-weight: 700; text-decoration: none; }
.p-top__blog-btn:hover { background: #e5e83b; }
.p-top__blog-link:focus-visible, .p-top__blog-btn:focus-visible { outline: 2px solid #164b77; outline-offset: 4px; }
.p-top__blog-empty { text-align: center; line-height: 1.8; }
@media (max-width: 767px) {
  .p-top__blog { padding: 56px 20px; }
  .p-top__blog-heading { margin-bottom: 28px; }
  .p-top__blog-heading .en { font-size: 40px; }
  .p-top__blog-heading .jp { font-size: 17px; }
  .p-top__blog-link { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 18px 0; font-size: 15px; }
  .p-top__blog-date { font-size: 14px; }
  .p-top__blog-btn-wrap { margin-top: 28px; }
  .p-top__blog-btn { min-height: 58px; font-size: 16px; }
}