@charset "UTF-8";
/* ----------------------------------------------------
   ブロックエディタ用　CSS
---------------------------------------------------- */

.editor-styles-wrapper{
  background:var(--bs-white);
}
@media (min-width: 1200px) {
    .block-page .container-xl, 
    .block-page .container-lg,
    .block-page .container-md,
    .block-page .container-sm,
    .block-page .container {
        max-width: 960px;
    }
}

/* =========================
   色
========================= */
.has-accent-color {
  color: var(--bs-accent);
}
.has-primary-color {
  color: var(--bs-primary);
}

/* =========================
   MV
========================= */
.page-mv {
  position: relative;
  z-index: 0;
  overflow: hidden;
  width: 90%;
  max-width: 1280px;
  height: 400px;
  margin: 0 auto;
  border-radius: 60px;
}
/* カラー（100%） */
.page-mv::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--bs-light);
  z-index: -2;
}
/* 背景画像（40%） */
.page-mv::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url('../img/top/mv.webp') no-repeat center / cover;
  opacity: 0.4;
  z-index: -1;
}
.page-mv .container{
  height: 100%;
}
h1.page-mv-title{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  height: 100%;
  width: 100%;
  font-weight: 700;
  color: var(--bs-white);
  font-size: 48px;
}
@media (max-width: 767px) {
  .page-mv {
    width: auto;
    height: 180px;
    border-radius: 30px;
    margin-right: 20px;
    margin-left: 20px;
  }
  h1.page-mv-title{
    font-size: var(--bs-font-sp-h2);
  }
}

/* =========================
   フォント
========================= */
h2.wp-block-heading{
  text-align: center;
  margin-top: var(--bs-space-2xl-pc);
  width: 100%;
}
h3.wp-block-heading {
  margin-top: var(--bs-space-2xl);
  margin-bottom: var(--bs-space-lg);
  position: relative;
  padding-left: 16px; /* 線の分の余白 */
  color: var(--bs-base);
}
h3.wp-block-heading::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 70%;
  background-color: var(--bs-primary);
  border-radius: 999px; /* ←角丸 */
}
h4.wp-block-heading {
  position: relative;
  padding-left: 16px; /* 丸＋余白 */
  margin-top: var(--bs-space-xl);
  margin-bottom: var(--bs-space-md);
  color: var(--bs-base);
  font-size: var(--bs-font-md);
  font-weight: 700;
}
h4.wp-block-heading::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.4em; /* ←文字に合わせる */
  width: 8px;
  height: 8px;
  background-color: var(--bs-primary);
  border-radius: 50%;
}
h5.wp-block-heading{
  margin-top: var(--bs-space-xl);
  margin-bottom: var(--bs-space-md);
  color: var(--bs-base);
  font-size: var(--bs-font-base);
  font-weight: 700;
}
@media (max-width: 767px) {
  h2.wp-block-heading{
    margin-top: var(--bs-space-xl);
  }
  h3.wp-block-heading {
    margin-top: var(--bs-space-xl);
  }
  h4.wp-block-heading{
    margin-top: var(--bs-space-lg);
    font-size: var(--bs-font-base);
  }
  h5.wp-block-heading{
    margin-top: var(--bs-space-lg);
    font-size: var(--bs-font-sp-base);
  }
}
.block-page p{
  margin-bottom: var(--bs-space-md);
}
/* =========================
   レイアウト
========================= */
.block-page .wp-block-group {
  margin-bottom: var(--bs-space-2xl);
}
.block-page .wp-block-media-text{
  gap: var(--bs-space-2xl);
}
.block-page .wp-block-media-text>.wp-block-media-text__content{
  padding: 0;
}
.block-page .wp-block-media-text>.wp-block-media-text__media{
  margin-bottom: var(--bs-space-lg);
}
@media (max-width: 767px) {
  .block-page .wp-block-media-text{
    gap: 0;
  }
  .block-page .wp-block-media-text>.wp-block-media-text__content{
    padding: 0;
  }
  .block-page .wp-block-media-text>.wp-block-media-text__media{
    margin-bottom: var(--bs-space-sm);
  }
}
/* =========================
   改行
========================= */
br.sp{
	display: none;
}
@media screen and (max-width: 768px) {
    br.sp {
        display: block;
    }
    br.pc {
        display: none;
    }
}
/* =========================
   角丸
========================= */
.block-page img{
  border-radius: 40px;
}
@media (max-width: 767px) {
  .block-page img{
    border-radius: 20px;
  }
}
/* =========================
   リスト
========================= */
ul.wp-block-list {
  padding-left: 1.6rem;
}
ul.wp-block-list li::marker {
  color: var(--bs-light);
}
ol.wp-block-list{
  counter-reset: my-counter;
  list-style: none;
  padding: 0;
}
ol.wp-block-list li {
  padding-left: 30px;
  position: relative;
}
ol.wp-block-list li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  background-color: var(--bs-light);
  font-family: var(--bs-font-en);
  border: 1px solid;
  border-radius: 50%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 22px;
  width: 22px;
  color: var(--bs-white);
  line-height: 1;
  position: absolute;
  top: 5px;
  left: 0;
}

/* =========================
   table
========================= */
/* regular */
.wp-block-table table.has-fixed-layout{
  width: 100%;
  background:var(--bs-white);
  color: var(--bs-text);
  margin-top: var(--bs-space-lg);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 40px;
  overflow: hidden;
  border: 1px solid var(--bs-pale);
}
.wp-block-table table.has-fixed-layout th,
.wp-block-table table.has-fixed-layout td {
  border-bottom: 1px solid var(--bs-pale);
}
.wp-block-table table.has-fixed-layout thead{
  border-bottom: 0;
}
.wp-block-table table.has-fixed-layout thead th { 
  text-align: center;
  background-color: var(--bs-pale);
  border-top: 0;
  border-left: 0;
  border-bottom: 0;
  border-right: 1px solid var(--bs-white);
  padding: var(--bs-space-xs) var(--bs-space-md);
}
.wp-block-table table.has-fixed-layout thead th:last-child{
  border-right: 0;
}
.wp-block-table table.has-fixed-layout td { 
  border-top: 0;
  border-left: 0;
  border-bottom: 1px solid var(--bs-pale);
  border-right: 1px solid var(--bs-pale);
  padding: var(--bs-space-xs) var(--bs-space-md);
}
.wp-block-table table.has-fixed-layout td:last-child{
  border-right: 0;
}
.wp-block-table table.has-fixed-layout tr:last-child td{
  border-bottom: 0;
}
@media (max-width: 767px) {
  .wp-block-table table.has-fixed-layout{
    border-radius: 20px;
  }
  .wp-block-table table.has-fixed-layout thead th,
  .wp-block-table table.has-fixed-layout td { 
    padding: var(--bs-space-xs);
  }
}

/* =========================
   step_block
========================= */
.is-style-step-group{
  margin-top:var(--bs-space-2xl);
  counter-reset: step;
}
.is-style-step-group .is-style-step{
  display: block;
  position: relative;
  padding: var(--bs-space-xl);
  background-color: var(--bs-mono-ultra);
  border-radius: 40px;
  counter-increment: step;
}
/* 各見出しでカウント */
.is-style-step .h3-number-title {
  position: relative;
  padding-left: 80px; /* 全体の余白 */
  margin-top: 0;
  color: var(--bs-text);
}
/* 01 */
.is-style-step .h3-number-title::before {
  content: counter(step, decimal-leading-zero);
  width: auto;
  height: auto;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  color: var(--bs-pale);
  font-family: var(--bs-font-en);
  font-size: 48px;
  background: none;
}
/* ・ */
.is-style-step .h3-number-title::after {
  content: "・";
  position: absolute;
  left: 56px; /* 数字の右 */
  top: 50%;
  transform: translateY(-50%);
  color: var(--bs-primary);
}
.is-style-step p:last-child{
  margin-bottom: 0;
}
.is-style-step:not(:last-child)::after {
  content: "";
  display: block;
  margin: 16px auto;
  position: absolute;
  left: 50%;
  bottom: -52px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 24px solid var(--bs-primary);
}
@media (max-width: 767px) {
  .is-style-step-group .is-style-step{
    padding: var(--bs-space-lg);
    border-radius: 20px;
  }
  .is-style-step .h3-number-title::before {
    font-size: 36px;
  }
  .is-style-step .h3-number-title::after {
    left: 50px; /* 数字の右 */
  }
}

/* =========================
   ボタン・リンク
========================= */
.block-page .text-link{
  margin-top: var(--bs-space-lg);
}
.block-page .text-link a{
  color: var(--bs-light);
  text-decoration: underline;
}
.block-page .text-link a::before {
  content: "＞";
  margin-right: 4px;
  color: var(--bs-light);
}
.block-page .text-link a:hover::before,
.block-page .text-link a:hover{
  color: var(--bs-primary);
  transition: 0.5s;
}
.block-page .wp-block-button__link{
  display: block;
  width: fit-content;
  margin: var(--bs-space-lg) auto 0;
  font-size: var(--bs-font-lg);
  text-decoration: none;
  color: var(--bs-white);
  background-color: var(--bs-primary);
  border-radius: 200px;
  border: 2px solid var(--bs-primary);
  padding: var(--bs-space-md) var(--bs-space-lg);
  height: fit-content;
  font-weight: 700;
  text-align: center;
}
.block-page .wp-block-button__link:hover{
  color: var(--bs-primary);
  background-color: var(--bs-white);
  transition: 0.5s;
}

.block-page .is-style-outline-primary .wp-block-button__link{
  color: var(--bs-primary);
  background-color: var(--bs-white);
}
.block-page .is-style-outline-primary .wp-block-button__link:hover{
  color: var(--bs-white);
  background-color: var(--bs-primary);
  transition: 0.5s;
}

/* =========================
   診療案内
========================= */
.medical-btn-row{
  display: flex;
  justify-content: center;
  align-items: stretch;
  margin-top: var(--bs-space-2xl);
  margin-bottom: var(--bs-space-2xl-pc);
}
.medical-btn-row .wp-block-button{
  display: flex;
  flex: 1;
}
.medical-btn-row .wp-block-button__link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--bs-space-xs);
  width: 100%;
  height: 100%;
  margin-top: 0;
  min-height: 100%;
  background-color: var(--bs-light);
  border-radius: 20px;
  border: 2px solid var(--bs-light);
}
.medical-btn-row .wp-block-button__link:hover {
  color: var(--bs-light);
}
.medical-btn-row .wp-block-button__link::after {
  content: "";
  width: 28px;
  height: 28px;
  background-color: currentColor;
  /* SVGをマスクとして使う */
  -webkit-mask: url('../img/arrow_circle_down.svg') no-repeat center / contain;
  mask: url('../img/arrow_circle_down.svg') no-repeat center / contain;
}
.medical-block{
  margin-top: var(--bs-space-2xl-pc);
  background-color: var(--bs-mono-ultra);
  border-radius: 40px;
  padding: var(--bs-space-2xl) var(--bs-space-xl) var(--bs-space-xl);
}
.medical-block .medical-block-inner{
  padding-bottom: var(--bs-space-xl);
  border-bottom:  1px dashed var(--bs-primary);
}
.medical-block .medical-block-inner:last-child{
  margin-bottom: var(--bs-space-sm);
  padding-bottom: 0;
  border-bottom:  0;
}
.medical-block .medical-page-link{
  margin-bottom: 0;
}
.medical-block-inner h3.wp-block-heading{
  margin-top: 0;
}
.medical-page-link > div{
  display: flex;
  flex-wrap: wrap;
  gap: var(--bs-space-md);
  align-items: flex-end;
}
.medical-page-link p{
  margin: 0;
  font-size: var(--bs-font-md);
  font-weight: 700;
  color: var(--bs-light);
}
.medical-page-link p.medical-no-link{
  font-size: var(--bs-font-base);
  font-weight: 400;
  color: var(--bs-text);
}
.medical-page-link a{
  display: flex;
  align-items: center;
  font-size: var(--bs-font-md);
  font-weight: 700;
  padding: var(--bs-space-xs) var(--bs-space-md);
  color: var(--bs-light);
  border: 1px solid var(--bs-light);
  background-color: var(--bs-white);
  border-radius: 16px;
  text-decoration: none;
}
.medical-page-link a::after {
  content: "";
  width: 28px;
  height: 28px;
  background-color: currentColor;
  /* SVGをマスクとして使う */
  -webkit-mask: url('../img/arrow_circle_right.svg') no-repeat center / contain;
  mask: url('../img/arrow_circle_right.svg') no-repeat center / contain;
}
.medical-page-link a:hover{
  color: var(--bs-white);
  background-color: var(--bs-light);
  transition: 0.5s;
}

@media (max-width: 767px) {
  .medical-btn-row{
    margin-bottom: var(--bs-space-xl);
    flex-direction: column;
  }
  .medical-block{
    margin-top: var(--bs-space-xl);
    padding: var(--bs-space-xl) var(--bs-space-lg) var(--bs-space-lg);
  }
  .medical-page-link > div{
    gap: var(--bs-space-xs);
  }
}
/* =========================
   お知らせ投稿ページ
========================= */
h2.single-news-title{
  margin-bottom: var(--bs-space-xl);
  position: relative;
  padding-left: 16px; /* 線の分の余白 */
  color: var(--bs-base);
}
h2.single-news-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 70%;
  background-color: var(--bs-primary);
  border-radius: 999px; /* ←角丸 */
}
.single-news-date{
  display: block;
  color: var(--bs-light);
}
.news-content{
  margin-top: var(--bs-space-xl);
}