@charset "UTF-8";
/*
このブロックはHTML構造・クラス名を acf/staff-card（is-style-compact）と共通化しているが、
WordPressのCSS自動読み込みはブロック名（acf/staff-card）単位で判定されるため、
acf/doctor-card 単体のページではそのCSSが読み込まれない。
そのため @use で staff-card のCSSをこのファイルの出力に含めて自己完結させる。
*/
.wp-block-acf-staff-card {
  container-type: inline-size;
  container-name: staffCard;
}
.wp-block-acf-staff-card .header {
  display: flex;
  align-items: center;
  column-gap: clamp(15px, 2vw, 20px);
  flex-direction: column;
}
.wp-block-acf-staff-card .image {
  flex-shrink: 0;
  width: 70%;
  max-width: 380px;
  display: flex;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  margin-top: 15px;
  border-radius: var(--wp--custom--border-radius);
}
.wp-block-acf-staff-card .image img {
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: inherit;
  vertical-align: middle;
}
.wp-block-acf-staff-card .info {
  flex-grow: 1;
}
.wp-block-acf-staff-card .names {
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 8px;
  font-weight: inherit;
  line-height: 1.2;
}
.wp-block-acf-staff-card .names ruby {
  display: ruby;
  ruby-align: space-between;
}
.wp-block-acf-staff-card .names ruby rt {
  margin-bottom: 2px;
}
.wp-block-acf-staff-card .title {
  color: var(--wp--preset--color--primary);
  font-size: var(--wp--preset--font-size--medium);
}
.wp-block-acf-staff-card .name {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--large);
  font-weight: 600;
}
.wp-block-acf-staff-card .kana {
  font-family: inherit;
  font-size: 0.8rem;
}
.wp-block-acf-staff-card .comment {
  margin-top: clamp(10px, 2vw, 15px);
}
.wp-block-acf-staff-card .content {
  margin-top: clamp(15px, 2vw, 25px);
  display: flex;
  flex-direction: column;
  row-gap: 25px;
}
.wp-block-acf-staff-card .content-wrap {
  border-radius: var(--wp--custom--border-radius);
}
.wp-block-acf-staff-card .content-wrap .items {
  font-size: 0.9em;
}
.wp-block-acf-staff-card .content-title {
  display: flex;
  align-items: center;
  column-gap: 1rem;
  margin-bottom: clamp(0.8rem, 2vw, 1rem);
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--medium);
}
.wp-block-acf-staff-card .content-title::before, .wp-block-acf-staff-card .content-title::after {
  content: "";
  flex-grow: 1;
  display: block;
  height: 1px;
  background-color: var(--wp--preset--color--base-border);
}
.wp-block-acf-staff-card .histories .item .inner {
  display: flex;
  align-items: flex-start;
  column-gap: 0.8rem;
}
.wp-block-acf-staff-card .histories .item .when {
  flex-shrink: 0;
}
@container staffCard (min-width:768px) {
  .wp-block-acf-staff-card .wrapper:not(:has(.image)):not(:has(.content-wrap:nth-child(2))) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: clamp(15px, 3vw, 40px);
  }
  .wp-block-acf-staff-card .wrapper:not(:has(.image)):not(:has(.content-wrap:nth-child(2))) .content {
    margin-top: 0;
  }
}
@media screen and (min-width: 769px) {
  .wp-block-acf-staff-card .header {
    flex-direction: row;
    align-items: flex-start;
  }
  .wp-block-acf-staff-card .image {
    width: 40%;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
  }
  .wp-block-acf-staff-card .image img {
    width: 100%;
    height: auto;
    aspect-ratio: 4/3;
    object-fit: cover;
    border-radius: calc(var(--wp--custom--border-radius) * 0.7);
  }
  .wp-block-acf-staff-card .names {
    align-items: flex-start;
  }
  .wp-block-acf-staff-card .content:not(:has(.content-wrap:nth-child(2))) .content-wrap:first-of-type .items {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: clamp(15px, 2vw, 30px);
    row-gap: clamp(8px, 1vw, 10px);
  }
  .wp-block-acf-staff-card .content:not(:has(.content-wrap:nth-child(2))) .content-wrap:first-of-type .items .item {
    margin: 0;
  }
  .wp-block-acf-staff-card .content:has(.content-wrap:nth-child(2)) {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: clamp(10px, 2vw, 20px);
  }
  .wp-block-acf-staff-card .content:has(.content-wrap:nth-child(2))::after {
    order: 2;
    content: "";
    width: 1px;
    height: calc(100% - 25px);
    align-self: flex-end;
    display: block;
    background-color: var(--wp--preset--color--base-border);
  }
  .wp-block-acf-staff-card .content:has(.content-wrap:nth-child(2)) .content-wrap:nth-child(2) {
    order: 3;
  }
}
.wp-block-acf-staff-card .profile-link {
  margin: 0.8rem 0 0;
  font-size: 0.85rem;
}
.wp-block-acf-staff-card .profile-link a {
  color: var(--wp--preset--color--primary);
  text-decoration: underline;
}
.wp-block-acf-staff-card:not([class*=is-style-]) .wrapper, .wp-block-acf-staff-card.is-style-default .wrapper {
  --shadow-height: 15px;
  position: relative;
  margin-bottom: var(--shadow-height);
  padding: clamp(20px, 2.5vw, 40px) clamp(20px, 2.5vw, 40px);
  background-color: #fff;
  border: 1px solid var(--wp--preset--color--base-border);
  border-radius: var(--wp--custom--border-radius);
  box-shadow: 0 2px 15px rgba(243, 184, 184, 0.05);
}
.wp-block-acf-staff-card:not([class*=is-style-]) .wrapper::after, .wp-block-acf-staff-card.is-style-default .wrapper::after {
  content: "";
  width: 95%;
  height: var(--shadow-height);
  display: block;
  position: absolute;
  top: calc(100% + 1px);
  left: 50%;
  transform: translateX(-50%);
  background-image: radial-gradient(ellipse at top, rgba(0, 0, 0, 0.05), transparent);
}
.wp-block-acf-staff-card {
  /*
  コンパクト（記事末尾の監修者表示等、経歴タイムラインを省いた簡易表示）
  診療科カラー（内科=primary系グリーン／眼科=secondary系ブルー）を
  `.department-eye` クラスの有無でCSSカスタムプロパティごと切り替える。
  */
}
.wp-block-acf-staff-card.is-style-compact {
  --card-color: var(--wp--preset--color--primary);
  --card-color-700: var(--wp--preset--color--primary-700);
  --card-color-50: var(--wp--preset--color--primary-50);
  margin-top: clamp(30px, 4vw, 45px);
}
.wp-block-acf-staff-card.is-style-compact.department-eye {
  --card-color: var(--wp--preset--color--secondary);
  --card-color-700: var(--wp--preset--color--secondary-700);
  --card-color-50: var(--wp--preset--color--secondary-50);
}
.wp-block-acf-staff-card.is-style-compact .wrapper {
  display: flex !important;
  flex-direction: column !important;
  padding: clamp(20px, 3vw, 28px) clamp(20px, 3vw, 32px);
  background-color: var(--card-color-50);
  border-left: 3px solid var(--card-color);
  border-radius: var(--wp--custom--border-radius);
}
.wp-block-acf-staff-card.is-style-compact .histories {
  display: none;
}
.wp-block-acf-staff-card.is-style-compact .header {
  margin-bottom: 0;
  flex-direction: row;
  align-items: center;
  column-gap: clamp(14px, 2.5vw, 20px);
}
.wp-block-acf-staff-card.is-style-compact .image {
  width: clamp(56px, 10vw, 80px);
  max-width: none;
  margin: 0;
  flex-shrink: 0;
}
.wp-block-acf-staff-card.is-style-compact .image img {
  aspect-ratio: 1/1;
  border-radius: 50%;
}
.wp-block-acf-staff-card.is-style-compact .info {
  min-width: 0;
}
.wp-block-acf-staff-card.is-style-compact .names {
  align-items: flex-start;
  text-align: left;
  margin-bottom: 0.3em;
}
.wp-block-acf-staff-card.is-style-compact .title {
  color: var(--card-color);
}
.wp-block-acf-staff-card.is-style-compact .content {
  display: block !important;
  margin-top: clamp(14px, 2vw, 18px);
  padding-top: clamp(14px, 2vw, 18px);
}
.wp-block-acf-staff-card.is-style-compact .content-wrap.qualifications .content-title {
  font-size: 0.75rem;
  margin-bottom: 0.5em;
  color: var(--card-color-700);
}
.wp-block-acf-staff-card.is-style-compact .content-wrap.qualifications .content-title::before, .wp-block-acf-staff-card.is-style-compact .content-wrap.qualifications .content-title::after {
  display: none;
}
.wp-block-acf-staff-card.is-style-compact .content-wrap.qualifications .items {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  column-gap: 1.2em;
  row-gap: 0.3em;
}
.wp-block-acf-staff-card.is-style-compact .content-wrap.qualifications .items .item {
  margin: 0;
}
.wp-block-acf-staff-card.is-style-compact .profile-link a {
  color: var(--card-color-700);
}

.wp-block-acf-doctor-card .acf-block-empty-notice {
  padding: 1.5rem;
  color: #999;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.03);
  border: 2px dashed #ccc;
  border-radius: var(--wp--custom--border-radius);
}

/*# sourceMappingURL=style.css.map */