@charset "UTF-8";

/*--------------------------------------------------------
　1.トップページスタイル
--------------------------------------------------------*/

/* =======================================
　フォントサイズ調整
======================================= */

@media screen and (max-width: 1024px) {

  p.fontsize-pc-tab32,
  h2.fontsize-pc-tab32 {
    font-size: 32px !important;
    margin-bottom: 40px;
  }

  h3 {
    font-size: 32px !important;
  }

}


@media screen and (max-width: 1023px) {

  p.fontsize-pc-tab32,
  h2.fontsize-pc-tab32 {
    font-size: 30px !important;
  }

  h3 {
    font-size: 30px !important;
  }

  body,
  p,
  td,
  li,
  dt,
  dd {
    font-size: 18px;
  }

}


@media screen and (max-width: 781px) {

  p.fontsize-pc-tab32,
  h2.fontsize-pc-tab32 {
    font-size: 28px !important;
  }

  h3 {
    font-size: 28px !important;
  }

  body,
  p,
  td,
  li,
  dt,
  dd {
    font-size: 16px;
  }
}



@media screen and (max-width: 639px) {

  p.fontsize-pc-tab32,
  h2.fontsize-pc-tab32 {
    font-size: 24px !important;
  }

  h3 {
    font-size: 24px !important;
  }
}



/* =======================================
　レスポンシブ調整
======================================= */
.wp-block-snow-monkey-blocks-section.smb-section.sp-side-spacing,
.wp-block-snow-monkey-blocks-section-with-bgimage.smb-section.smb-section-with-bgimage.sp-side-spacing {
  padding-left: 16px !important;
  padding-right: 16px !important;
}






/* =======================================
　CTAエリア（パターン登録）
======================================= */

/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.cta-section {
  padding-bottom: 16vw;
}

.wp-block-snow-monkey-blocks-section.smb-section.cta-section::before {
  content: "";
  display: block;
  position: absolute;
  top: -12vw;
  left: 0;
  width: 100%;
  height: 26vw;
  background: url('../../images/msk/msk02.webp') no-repeat center center;
  background-size: contain;
  pointer-events: none;
}

.wp-block-snow-monkey-blocks-section.smb-section.cta-section .c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.cta-section .c-container {
    padding: 0 40px;
  }
}


/*----- ロゴ -----*/
@media (max-width: 639px) {
  .wp-block-image.cta-logo {
    width: 80%;
    margin: 0 auto;
  }
}

/*----- ボックス -----*/
.cta-btn-box p {
  line-height: 1.2 !important;
}

/*----- キャッチフレーズ -----*/
.cta-catch p {
  line-height: 1.2 !important;
  padding: 0 !important;
}

@media screen and (max-width: 781px) {
  .cta-catch p {
    font-size: 32px !important;
  }
}

/*----- CTAボタン -----*/
/* 電話番号 */
p.tel-number::before {
  content: '';
  background: url('../../images/top-lp/icon-phone-wh.webp') no-repeat;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  margin-right: 8px;
  width: 14px;
  height: 24px;
  display: inline-block;
}



/*----- 注釈リスト -----*/
@media screen and (max-width: 1023px) {
  ul.wp-block-list.is-style-sme-list-remark.cta-list li {
    font-size: 16px;
  }
}



/* =======================================
　メインビジュアル
======================================= */
/*----- MVグループ -----*/

/* MV画像 */
.wp-block-group.mv-group .wp-block-group.mv-image-group {
  position: absolute;
  z-index: 1;
  width: 100%;
}

.wp-block-group.mv-image-group .wp-block-image img {
  width: 100%;
}

/* MVエリアカバー */
.wp-block-group.mv-group .wp-block-group.mv-cover {
  position: relative;
  z-index: 2;
}

@media screen and (min-width: 640px) {
  .wp-block-group.mv-group.pc {
    display: block;
  }

  .wp-block-group.mv-group.sp {
    display: none;
  }
}

@media screen and (max-width: 639px) {
  .wp-block-group.mv-group.pc {
    display: none;
  }

  .wp-block-group.mv-group.sp {
    display: block;
  }
}


/* PC */
.wp-block-group.mv-group.pc .wp-block-group.mv-cover {
  height: 48.5vw;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  padding: .5vw 3vw;
}

.wp-block-group.mv-group .wp-block-group.mv-cover figure.wp-block-image.mv-btn-pc {
  width: 36vw;
}

.wp-block-group.mv-group .wp-block-group.mv-cover figure.wp-block-image.mv-btn-pc img {
  border-radius: 16px;
}


/* sp */
.wp-block-group.mv-group.sp .wp-block-group.mv-cover {
  height: 201.3vw;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  padding: .5vw 3vw;
}

.wp-block-group.mv-group .wp-block-group.mv-cover figure.wp-block-image.mv-btn-sp {
  width: 100%;
}

.wp-block-group.mv-group .wp-block-group.mv-cover figure.wp-block-image.mv-btn-sp img {
  border-radius: 16px;
}



/* =======================================
　リードエリア
======================================= */

/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.lead-section {
  position: relative;
  z-index: 3;
  padding-top: 6vw;
}

/* 背景画像 */
figure.wp-block-image.lead-bg {
  position: absolute;
  z-index: -1;
  width: 60vw;
  left: -2vw;
  margin-top: 6vw;
}

@media screen and (max-width: 1023px) {
  figure.wp-block-image.lead-bg {
    width: 80vw;
    left: -3vw;
    margin-top: 35vw;
    display: none;
  }

  /* カラム */
  .wp-block-columns.lead-col {
    flex-direction: column;
  }

  figure.wp-block-image.lead-image-tab {
    margin-top: -20vw;
    position: relative;
    z-index: -1;
  }
}





/* =======================================
　納得の結果を、適正価格で
======================================= */

/*----- グループ -----*/
.wp-block-group.fee-group {
  position: relative;
  z-index: 2;
  margin-top: -2vw;
}

.wp-block-snow-monkey-blocks-section-with-bgimage.fee-section .c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section-with-bgimage.fee-section .c-container {
    padding: 0 40px;
  }
}

/* マスク図形 */
.fee-msk {
  background: url(../../images/msk/msk01.webp) no-repeat center -2px;
  background-size: contain;
  width: 100%;
  height: 20vw;
  position: absolute;
  z-index: 2;
}

@media screen and (max-width: 1400px) {
  .wp-block-group.fee-group {
    margin-top: -7vw;
  }
}


/*----- セクション（コンテンツ） -----*/
.wp-block-snow-monkey-blocks-section-with-bgimage.smb-section.smb-section-with-bgimage.fee-section {
  position: relative;
  z-index: 1;
  padding-top: 26vw;
  padding-bottom: 18vw;
}


/* カラム */
@media screen and (max-width: 1023px) {
  .wp-block-columns.benefit-col {
    flex-direction: column;
    gap: 0;
  }
}


/*----- メリットリスト -----*/
.wp-block-possweb-decoration.fee-benefit ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* アクセント画像 */
@media screen and (max-width: 1023px) {
  .wp-block-image.benefit-accent-image {
    display: flex;
    justify-content: center;
  }

  .wp-block-image.benefit-accent-image img {
    max-width: 160px;
  }
}


/*----- 料金詳細 -----*/
/* カラム */
@media screen and (max-width: 1023px) {
  .wp-block-columns.gap56.fee-detail-col {
    flex-direction: column;
  }
}

/* テキスト */
p.fee-detail {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  flex-wrap: wrap;
  padding-bottom: 0;
  line-height: 1;
}

p.fee-detail span {
  font-weight: 600;
  padding-bottom: 0;
  line-height: 1;
}

p.fee-detail span.small {
  padding-bottom: 10px;
}

span.fee {
  color: var(--color-primary02);
}

span.fee>.large {
  font-size: 80px;
  letter-spacing: -2px !important;
}

span.fee .small {
  vertical-align: 7px;
}


@media screen and (max-width: 781px) {
  ul.wp-block-list.fee-point li {
    font-size: 14px;
  }
}





/* =======================================
　CTAエリア01（コントロール）
======================================= */
.wp-block-group.cta-group.cta01 {
  position: relative;
  z-index: 3;
}



/* =======================================
　この料金でここまで改善できる！
======================================= */

/*----- グループ -----*/
.wp-block-group.case-group {
  position: relative;
  z-index: 4;
  margin-top: -10vw;
}

/* マスク図形 */
.case-msk {
  background: url(../../images/msk/msk03.webp) no-repeat center top;
  background-size: contain;
  width: 100%;
  height: 20vw;
  position: absolute;
  z-index: 2;
}


/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.case-section {
  position: relative;
  z-index: 3;
  padding-top: 14vw;
  padding-bottom: 4vw;
}

.wp-block-snow-monkey-blocks-section.smb-section.case-section .smb-section__inner>.c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.case-section .smb-section__inner>.c-container {
    padding: 0 40px;
  }
}


/* 背景画像 */
.wp-block-image.case-bg figure {
  position: absolute;
  z-index: -1;
  width: 50vw;
  right: -2vw;
  top: -6vw;
}


@media screen and (max-width: 1023px) {
  .wp-block-image.case-bg figure {
    top: 24vw;
  }
}


@media screen and (max-width: 781px) {
  .wp-block-image.case-bg figure {
    position: relative;
    z-index: -1;
    width: 80vw;
    right: 0w;
    top: 0;
  }
}


/* 見出し全体 */
h2.wp-block-heading.case-heading {
  font-family: var(--type-primary-font-serif);
  letter-spacing: 4px;
  line-height: 1;
  margin-bottom: 0;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 1vw;
}

/* テキスト */
h2.wp-block-heading.case-heading span {
  font-weight: 600;
  line-height: 1;
}

h2.wp-block-heading.case-heading span.small {
  font-size: min(max(4vw, 64px), 100vw);
  padding-bottom: 4px;
}

h2.wp-block-heading.case-heading span.large {
  font-size: min(max(4vw, 64px), 100vw);
}

h2.wp-block-heading.case-heading .first span.large {
  color: var(--color-primary01);
}

h2.wp-block-heading.case-heading .next span.large {
  color: var(--color-primary02);
}



@media screen and (max-width: 781px) {
  h2.wp-block-heading.case-heading span.small {
    font-size: 40px !important;
  }

  h2.wp-block-heading.case-heading span.large {
    font-size: 40px !important;
  }
}




/* =======================================
　caseスライドショー
======================================= */

.case-slider-container {
  position: relative;
  width: 100%;
  margin: 48px 0 0;
  padding: 0;
  box-sizing: border-box;
}

/* タイトルタブ */
.case-slider-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
  padding: 0 72px 16px;
}


@media screen and (max-width: 1023px) {
  .case-slider-tabs {
    padding: 0 40px 16px;
  }
}

.case-slider-tab {
  padding: 12px 24px;
  background: var(--color-gray00);
  border-radius: 4px;
  color: var(--color-gray05);
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
  text-align: center;
}

.case-slider-tab.active {
  background: var(--color-accent01);
  color: var(--color-wh);
  font-weight: 600;
}

.case-slider-wrapper {
  position: relative;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

.case-slider-track {
  display: flex;
  transition: transform 0.5s ease-in-out;
  will-change: transform;
  width: 100%;
}

.case-slide {
  flex: 0 0 100%;
  min-width: 0;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}

.case-slide-content {
  width: 100%;
  padding: 0 56px;
  overflow: hidden;
  box-sizing: border-box;
}

.case-slide-content-inner {
  display: flex;
  flex-direction: column;
  gap: 28px;
  padding: 32px;
  background: var(--color-gray00);
  border: 4px solid var(--color-primary02);
  border-radius: 24px;
  width: 100%;
  box-sizing: border-box;
  max-width: 100%;
}



@media screen and (max-width: 781px) {
  .case-slide-content {
    padding: 0 40px;
  }

  .case-slide-content-inner {
    gap: 16px;
    padding: 16px;
  }
}


@media screen and (max-width: 639px) {
  .case-slide-content-inner {
    gap: 8px;
  }
}


/* 1. 見出し部 */
.case-slide-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-weight: bold;
  margin: 0;
  padding: 0 8px 8px;
  color: var(--color-primary-font-main);
  border-bottom: 3px solid var(--color-primary02);
}

.case-slide-heading-label {
  font-size: 20px;
}

.case-slide-heading-title {
  font-size: 28px;
}

@media (max-width: 639px) {
  .case-slide-heading {
    gap: 0
  }

  .case-slide-heading-label {
    font-size: 16px;
  }

  .case-slide-heading-title {
    font-size: 24px;
  }
}



/* 2. 患者情報 */
.case-slide-patient-info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 24px;
  padding: 0 16px;
}

@media screen and (max-width: 781px) {
  .case-slide-patient-info {
    gap: 8px;
  }
}

.case-info-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  line-height: 1.35;
}

.case-info-item:last-child {
  margin-bottom: 0;
}

span.case-info-label {
  border: 1px solid var(--color-primary02);
  border-radius: 4px;
  padding: 4px 8px;
  color: var(--color-primary02);
  margin-right: 8px;
}

.case-info-value {
  color: var(--color-primary-font-main);
}


@media (max-width: 639px) {
  .case-info-item {
    font-size: 14px !important;
  }
}


/* 3. 画像部 */
.case-slide-images {
  display: flex;
  justify-content: center;
  gap: 24px;
}

.case-image-item {
  display: flex;
  flex-direction: column;
  background: var(--color-wh);
  padding: 6px 16px 16px;
  border: 1px solid var(--color-gray01);
  border-radius: 8px;
  width: 100%;
}

.case-image-label {
  font-size: 16px;
  font-weight: 600;
  color: var(--color-primary-font-main);
  margin-bottom: 4px;
  text-align: center;
}

.case-image-wrapper {
  width: 100%;
  overflow: hidden;
  border-radius: 4px;
  max-width: 100%;
}

.case-image {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.case-slider-prev,
.case-slider-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  background: var(--color-accent01);
  color: var(--color-wh);
  font-size: 48px;
  line-height: 1;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  padding-bottom: 13px;
}

.case-slider-prev {
  left: 0;
}

.case-slider-next {
  right: 0;
}

.case-slider-prev.disabled,
.case-slider-next.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* レスポンシブ対応 */
@media (max-width: 781px) {
  .case-slider-container {
    padding: 0 24px;
  }

  .case-slider-tabs {
    gap: 4px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .case-slider-tabs::-webkit-scrollbar {
    height: 4px;
  }

  .case-slider-tabs::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 2px;
  }

  .case-slider-tab {
    padding: 8px 16px;
    font-size: 14px;
    flex-shrink: 0;
  }

  .case-slide {
    padding: 0 8px;
  }

  .case-slide-header {
    padding: 16px 16px 12px;
  }

  .case-slide-heading {
    font-size: 20px;
  }

  .case-slide-patient-info {
    padding: 0 16px;
  }

  .case-slide-images {
    padding: 16px;
    gap: 10px;
  }

  .case-image-label {
    font-size: 14px;
    padding: 6px;
  }

  .case-slider-prev,
  .case-slider-next {
    width: 40px;
    height: 40px;
    font-size: 36px;
  }

  .case-slider-prev {
    left: 0;
  }

  .case-slider-next {
    right: 0;
  }
}



@media (max-width: 639px) {
  .case-slider-container {
    padding: 0 8px;
  }

  .case-slide-content-inner {
    padding: 8px 0;
  }

  .case-slide-images {
    flex-direction: column;
  }
}


@media (max-width: 480px) {
  .case-slider-tabs {
    padding: 0 8px;
    gap: 8px;
  }

  .case-slider-tab {
    padding: 4px 8px;
    font-size: 12px;
  }

  /* スライド */
  .case-slider-wrapper {
    overflow: visible;
  }

  .case-slider-container {
    padding-bottom: 48px;
    overflow-x: hidden;
  }

  .case-slider-prev,
  .case-slider-next {
    top: auto;
    bottom: -48px;
  }

  .case-slider-prev {
    left: 50%;
    right: auto;
    transform: translateX(calc(-100% - 8px));
  }

  .case-slider-next {
    right: auto;
    left: 50%;
    transform: translateX(8px);
  }

  .case-slide-content {
    padding: 0;
  }

  .case-slide-content-inner {
    padding: 4px 2px;
    gap: 6px;
  }

  .case-slide-header {
    padding: 8px 8px 4px;
  }

  .case-slide-heading {
    padding: 0 2px 4px;
  }

  .case-slide-heading span.case-slide-heading-label {
    font-size: 12px;
    padding-top: 4px;
  }

  .case-slide-heading span.case-slide-heading-title {
    font-size: 16px;
  }

  .case-slide-patient-info {
    padding: 0 10px;
  }

  .case-info-item {
    font-size: 10px !important;
  }

  span.case-info-label {
    padding: 0;
    margin: 0;
    border: none;
  }

  .case-slide-images {
    padding: 6px;
    gap: 6px;
  }

  .case-image-label {
    font-size: 12px;
    padding: 8px 0 4px;
    line-height: 1;
  }

  .case-image-item {
    padding: 0 8px 8px;
  }
}



@media (max-width: 360px) {
  .case-slider-container {
    padding-bottom: 25px;
  }

  .case-slider-prev,
  .case-slider-next {
    bottom: -25px;
  }
}


/* =======================================
　安心の分割・キャッシュレス対応（見出し部）
======================================= */

/*----- 見出しグループ -----*/
.wp-block-group.pay-hgroup {
  margin-top: 8vw;
  position: relative;
  z-index: 2;
}

/* 見出し */
h2.wp-block-heading.pay-heading {
  position: absolute;
  z-index: 2;
}

h2.wp-block-heading.pay-heading span {
  font-size: min(max(4.2vw, 64px), 100vw);
}


@media (max-width: 639px) {
  h2.wp-block-heading.pay-heading {
    position: relative;
    z-index: 2;
  }

  h2.wp-block-heading.pay-heading span {
    font-size: 32px;
  }
}


/* メイン画像 */
figure.wp-block-image.pay-main-image {
  position: relative;
  z-index: 1;
}

figure.wp-block-image.pay-main-image img {
  max-width: 40vw;
}


@media screen and (max-width: 1023px) {
  figure.wp-block-image.pay-main-image img {
    max-width: 75vw;
  }
}


/* キャッチコピー */
.wp-block-group.pay-catch {
  position: relative;
  z-index: 2;
  margin-top: -4vw;
  margin-bottom: 3vw;
}

.wp-block-group.pay-catch p {
  line-height: 1.2;
}

.wp-block-group.pay-catch p.main-catch {
  font-size: min(max(3vw, 40px), 100vw);
  font-weight: 600;
  color: var(--color-primary02);
}

.wp-block-group.pay-catch p.sub-catch {
  font-size: min(max(2vw, 28px), 100vw);
  font-weight: 600;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-wrap: wrap;
  line-height: 1.5;
}


@media screen and (max-width: 639px) {
  .wp-block-group.pay-catch {
    margin-top: 0;
  }

  .wp-block-group.pay-catch p.main-catch {
    font-size: 24px;
  }

  .wp-block-group.pay-catch p.sub-catch {
    font-size: 20px;
  }
}



/* =======================================
　安心の分割・キャッシュレス対応（コンテンツ部）
======================================= */

/*----- グループ -----*/
.wp-block-group.pay-contents-group {
  margin-top: -12vw;
}

@media screen and (max-width: 639px) {
  .wp-block-group.pay-contents-group {
    margin-top: -64vw;
  }
}



/*----- マスク図形 -----*/
.pay-msk {
  background: url(../../images/msk/msk04.webp) no-repeat center top;
  background-size: contain;
  width: 100%;
  height: 18vw;
  position: absolute;
  z-index: 1;
  margin-top: -17vw;
}


/*----- コンテンツセクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.pay-section {
  padding-top: 12vw;
  padding-bottom: 13vw;
}

.wp-block-snow-monkey-blocks-section.smb-section.pay-section .smb-section__inner>.c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.pay-section .smb-section__inner>.c-container {
    padding: 0 40px;
  }

  /* カラム */
  .wp-block-columns.pay-detail-col {
    flex-direction: column;
  }
}



@media screen and (max-width: 639px) {
  .wp-block-snow-monkey-blocks-section.smb-section.pay-section {
    padding-top: 68vw;
  }
}


.wp-block-snow-monkey-blocks-box.smb-box.cashless-box {
  margin-top: 40px;
}

.wp-block-group.pay-service-group p {
  margin: 0 0 -30px;
  padding: 8px 16px;
  background: var(--color-wh);
  position: relative;
  z-index: 2;
}



/* =======================================
　CTAエリア02（コントロール）
======================================= */
.wp-block-group.cta-group.cta02 {
  position: relative;
  z-index: 3;
  margin-bottom: 5vw;
}

.wp-block-group.cta-group.cta02 .wp-block-snow-monkey-blocks-section.smb-section.cta-section {
  padding-bottom: 0;
}

/*----- マスク図形 -----*/
.reason-msk {
  background: url(../../images/msk/msk06.webp) no-repeat center top;
  background-size: contain;
  width: 100%;
  height: 13vw;
  position: absolute;
  z-index: 1;
}



/* =======================================
　当院が選ばれる理由
======================================= */

/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.reason-section {
  padding-top: 18vw;
  position: relative;
  overflow: hidden;
  padding-bottom: 30vw;
}

.wp-block-snow-monkey-blocks-section.smb-section.reason-section .c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.reason-section .c-container {
    padding: 0 40px;
  }
}

/* 背景画像固定用の共通クラス */
.fixed-bg-section {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

/* #content の疑似要素で背景画像を固定表示 */
#content::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  /* デフォルトでは非表示 */
  visibility: hidden;
}

/* セクションがビューポートに入ったときに背景画像を表示 */
#content.has-fixed-bg-reason::before {
  visibility: visible;
  opacity: 1;
  background-image: url(../../images/top-lp/reason-bg.webp);
}

#content.has-fixed-bg-flow::before {
  visibility: visible;
  opacity: 1;
  background-image: url(../../images/top-lp/flow-bg.webp);
}

/* 背景画像が表示されているときは、#contentの背景色を透明にする */
#content.has-fixed-bg-reason,
#content.has-fixed-bg-reason #content-inner {
  background: transparent;
}

#content.has-fixed-bg-flow,
#content.has-fixed-bg-flow #content-inner {
  background: transparent;
}


/*----- 見出し -----*/
/* h2 */
h2.wp-block-heading.reason-heading {
  font-size: min(max(4.2vw, 64px), 100vw);
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  color: var(--color-wh);
  letter-spacing: 4px;
  margin: 6vw auto 10vw;
}


@media (max-width: 639px) {
  h2.wp-block-heading.reason-heading {
    font-size: 32px !important;
    margin-bottom: 20vw;
    margin-top: 40vw;
  }
}


/*----- 理由コンテンツ-----*/
/* 理由バッジ */
figure.wp-block-image.reason-badge {
  position: absolute;
  top: -72px;
  left: -48px;
}

/* 概要 */
.wp-block-possweb-decoration.reason-summary {
  border-left: 4px solid var(--color-primary02);
}


@media (max-width: 639px) {
  figure.wp-block-image.reason-badge {
    position: absolute;
    top: -56px;
    left: -32px;
  }

  figure.wp-block-image.size-full.is-resized.reason-badge img {
    width: 90px !important;
  }

  .reason-summary p {
    font-size: 18px !important;
    line-height: 1.65;
  }
}



/* =======================================
　ドクター紹介
======================================= */

/*----- マスク図形 -----*/
.doctor-msk {
  background: url(../../images/msk/msk05.webp) no-repeat center top;
  background-size: contain;
  width: 100%;
  height: 16vw;
  position: absolute;
  z-index: 1;
  margin-top: -15vw;
}


/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.doctor-section {
  margin-top: -8vw;
  position: relative;
  z-index: 2;
  padding-bottom: 16vw;
}

.wp-block-snow-monkey-blocks-section.smb-section.doctor-section .smb-section__inner>.c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.doctor-section .smb-section__inner>.c-container {
    padding: 0 40px;
  }
}


/*----- 見出し -----*/
/* h2 */
h2.wp-block-heading.doctor-heading {
  font-size: min(max(4.2vw, 64px), 100vw);
  letter-spacing: 4px;
}

@media (max-width: 639px) {
  h2.wp-block-heading.doctor-heading {
    font-size: 40px !important;
    margin-bottom: 24px;
  }
}


/*----- 医師紹介 -----*/
/* カラム */
@media screen and (max-width: 1023px) {
  .wp-block-columns.gap80.doctor-info-col {
    flex-direction: column;
    align-items: center;
  }
}


/* 名前 */
.name-group p {
  line-height: 1 !important;
}

p.no-padding.mincho.name-text {
  letter-spacing: 4px;
}


@media (max-width: 639px) {
  p.no-padding.mincho.name-text {
    font-size: 40px !important;
  }
}


/*----- 医師詳細 -----*/

@media screen and (max-width: 1023px) {

  /* カラム */
  .wp-block-columns.doctor-detail-col {
    flex-direction: column;
  }
}



/* =======================================
　CTAエリア03（コントロール）
======================================= */
.wp-block-group.cta-group.cta03 {
  position: relative;
  z-index: 3;
  margin-bottom: 5vw;
}

.wp-block-group.cta-group.cta03 .wp-block-snow-monkey-blocks-section.smb-section.cta-section {
  padding-bottom: 0;
}

/*----- マスク図形 -----*/
.flow-msk {
  background: url(../../images/msk/msk06.webp) no-repeat center top;
  background-size: contain;
  width: 100%;
  height: 13vw;
  position: absolute;
  z-index: 1;
}



/* =======================================
　治療の流れ
======================================= */

/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.flow-section {
  padding-top: 12vw;
  padding-bottom: 16vw;
}

.wp-block-snow-monkey-blocks-section.smb-section.flow-section .smb-section__inner>.c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.flow-section .smb-section__inner>.c-container {
    padding: 0 40px;
  }
}





/*----- 見出し -----*/
/* h2 */
h2.wp-block-heading.flow-heading {
  font-size: min(max(4.2vw, 64px), 100vw);
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  color: var(--color-wh);
  letter-spacing: 4px;
  margin: 4vw auto 4vw;
}


@media (max-width: 639px) {
  h2.wp-block-heading.flow-heading {
    font-size: 32px;
    margin-top: 40vw;
    margin-bottom: 20vw;
  }
}


/*----- コンテンツグループ -----*/
@media (max-width: 639px) {
  .wp-block-group.gap40.flow-contents-group {
    gap: 16px;
  }

  .wp-block-group.flow-image-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}

.flow-arrow {
  background: url(../../images/top-lp/arrow-flow.webp) no-repeat center top;
  background-size: contain;
  width: 58px;
  height: 24px;
  margin: 0 auto;
}


@media (max-width: 639px) {
  .flow-arrow {
    width: 32px;
    height: 14px;
  }
}



/* =======================================
　患者様の声
======================================= */

/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.voice-section .smb-section__inner>.c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.voice-section .smb-section__inner>.c-container {
    padding: 0 40px;
  }
}


/*----- 見出し部 -----*/
/* h2見出し */
h2.wp-block-heading.voice-heading {
  font-size: min(max(4.2vw, 64px), 100vw);
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  color: var(--color-wh);
  letter-spacing: 4px;
  margin: 4vw auto 0;
}

@media (max-width: 639px) {
  h2.wp-block-heading.voice-heading {
    font-size: 32px !important;
    margin: 8vw auto 0;
  }
}


/* キャッチ */
p.voice-catch.weight500 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}



/*----- google-kuchikomiスライダー -----*/
.google-kuchikomi-slider-container {
  position: relative;
  width: 100%;
  margin: 48px 0;
  padding: 0;
  box-sizing: border-box;
}

.google-kuchikomi-slider-wrapper {
  position: relative;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.google-kuchikomi-slider-track {
  display: flex;
  transition: transform 0.5s ease-in-out;
  will-change: transform;
  flex-shrink: 0;
}

.google-kuchikomi-slide-group {
  min-width: 0;
  box-sizing: border-box;
  display: flex;
  gap: 24px;
  padding: 0;
  flex-shrink: 0;
}

/* カードスタイル */
.google-kuchikomi-item {
  flex: 1;
  min-width: 0;
  background: var(--color-wh);
  border: 1px solid var(--color-gray01);
  border-radius: 12px;
  padding: 24px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: box-shadow 0.3s ease;
}

.google-kuchikomi-item:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

/* 空白のカード（完全に透明・非表示） */
.google-kuchikomi-item-empty {
  opacity: 0;
  pointer-events: none;
  border: none;
  background: transparent;
  padding: 0;
  visibility: visible;
}

/* ヘッダー部分 */
.google-kuchikomi-header {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: space-between;
}

.google-kuchikomi-icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  overflow: hidden;
}

.google-kuchikomi-icon-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.google-kuchikomi-name-area {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.google-kuchikomi-name {
  font-size: 20px;
  font-weight: 600;
  color: var(--color-primary-font-main);
  line-height: 1.4;
}

.google-kuchikomi-stars {
  font-size: 18px;
  color: #FFD700;
  line-height: 1;
  letter-spacing: 2px;
}

/* Googleアイコン */
.google-kuchikomi-brand-icon {
  flex-shrink: 0;
  margin-left: auto;
  position: relative;
  top: -6px;
  right: 6px;
}

.google-brand-icon-img {
  width: auto;
  height: 24px;
  object-fit: contain;
  display: block;
}

/* 概要文 */
.google-kuchikomi-summary {
  font-size: 18px;
  line-height: 1.6;
  color: var(--color-primary-font-main);
  flex: 1;
}

/* 続きを読むリンク */
.google-kuchikomi-read-more {
  margin-top: auto;
  padding-top: 8px;
}

.google-kuchikomi-link {
  display: inline-block;
  padding: 0;
  color: var(--color-gray04);
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
}

.google-kuchikomi-link:hover {
  opacity: 0.7;
}

/* 矢印ボタンコントロール */
.google-kuchikomi-slider-controls {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  margin-top: 24px;
}

/* 矢印ボタン */
.google-kuchikomi-slider-prev,
.google-kuchikomi-slider-next {
  width: 48px;
  height: 48px;
  background: transparent;
  color: var(--color-wh);
  font-size: 48px;
  line-height: 1;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 13px;
  border: 1px solid var(--color-wh);
}

.google-kuchikomi-slider-prev.disabled,
.google-kuchikomi-slider-next.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* レスポンシブ対応 */
@media (max-width: 781px) {
  .google-kuchikomi-slide-group {
    flex-direction: column;
    gap: 16px;
    padding: 0;
  }

  .google-kuchikomi-item {
    padding: 20px;
    flex: none;
    width: 100%;
  }

  .google-kuchikomi-slider-controls {
    gap: 16px;
    margin-top: 16px;
  }

  .google-kuchikomi-slider-prev,
  .google-kuchikomi-slider-next {
    width: 40px;
    height: 40px;
    font-size: 32px;
  }
}



/*----- Instagram -----*/

/* アカウントリンク */
main p.instagram-link a {
  color: #FFF !important;
}


/* スライダーギャラリーのラッパー */
.slider-gallery-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
}

/* スライダートラック */
.slider-gallery-track {
  display: flex;
  will-change: transform;
  gap: 16px;
}

/* スライダー内の画像要素 */
.slider-gallery-track .wp-block-image {
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  aspect-ratio: 36 / 25;
}

.slider-gallery-track .wp-block-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* スライダーアニメーション（通常：左から右へ） */
@keyframes slider-gallery-scroll {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}

/* スライダーアニメーション（逆向き：右から左へ） */
@keyframes slider-gallery-scroll-reverse {
  0% {
    transform: translateX(-50%);
  }

  100% {
    transform: translateX(0);
  }
}

/* 初期化済みのギャラリーのスタイル調整 */
.wp-block-gallery.slider-gallery-initialized {
  display: block;
  margin: 0;
  padding: 0;
}

.wp-block-gallery.slider-gallery-initialized .slider-gallery-wrapper {
  width: 100%;
}

/* スマホ対応：639px以下で2個分の画像スペース */
@media screen and (max-width: 639px) {
  .slider-gallery-track {
    gap: 12px;
  }
}



/* =======================================
　FAQ見出しセクション
======================================= */

/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section-with-bgimage.smb-section.smb-section-with-bgimage.faq-heading-section {
  padding-top: 8vw;
  padding-bottom: 16vw;
}

.wp-block-snow-monkey-blocks-section-with-bgimage.smb-section.smb-section-with-bgimage.faq-heading-section .c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section-with-bgimage.smb-section.smb-section-with-bgimage.faq-heading-section .c-container {
    padding: 0 40px;
  }
}

@media screen and (max-width: 781px) {
  .wp-block-snow-monkey-blocks-section-with-bgimage.smb-section.smb-section-with-bgimage.faq-heading-section .c-container {
    padding: 0 25vw 0 24px;
  }
}


@media (max-width: 639px) {
  .wp-block-snow-monkey-blocks-section-with-bgimage.smb-section.smb-section-with-bgimage.faq-heading-section {
    padding-bottom: 8vw;
    padding-top: 16vw;
  }
}


/*----- 見出し部 -----*/
/* h2見出し */
h2.wp-block-heading.faq-heading {
  font-size: min(max(4.2vw, 64px), 100vw);
  letter-spacing: 4px;
  line-height: 1.3;
}



@media (max-width: 639px) {
  .wp-block-group.gap8.faq-heading-group {
    justify-content: center;
    align-items: center;
    gap: 24px;
  }

  h2.wp-block-heading.faq-heading {
    font-size: 32px !important;
    text-align: center;
  }

  .wp-block-group.faq-catch-group {
    align-items: center;
    justify-content: center;
    gap: 0;
  }
}





/* =======================================
　FAQコンテンツセクション
======================================= */

/*----- マスク図形 -----*/
.faq-msk {
  background: url(../../images/msk/msk07.webp) no-repeat center bottom;
  background-size: contain;
  width: 100%;
  height: 11vw;
  position: absolute;
  z-index: 1;
  margin-top: -11vw;
}

/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.faq-contents-section {
  padding-top: 0;
  padding-bottom: 16vw;
  margin-top: -3vw;
  position: relative;
  z-index: 2;
}

.wp-block-snow-monkey-blocks-section.smb-section.faq-contents-section .smb-section__inner>.c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.faq-contents-section .smb-section__inner>.c-container {
    padding: 0 40px;
  }
}

/* @media screen and (max-width: 639px) {
  .wp-block-snow-monkey-blocks-section.smb-section.faq-contents-section {
    padding: 0 16px;
  }
} */


/* カラム */
@media screen and (max-width: 1023px) {
  .wp-block-columns.faq-col {
    flex-direction: column;
  }
}


/* アクセント画像 */
.wp-block-image.faq-accent figure {
  width: 15vw;
}


@media screen and (max-width: 1023px) {
  .wp-block-image.faq-accent {
    transform: rotate(-90deg);
    margin: 0;
  }
}


@media (max-width: 639px) {
  .wp-block-snow-monkey-blocks-section-with-bgimage.smb-section.smb-section-with-bgimage.smb-section--fit.faq-heading-section.sp-side-spacing .smb-section-with-bgimage__bgimage.smb-section-with-bgimage__bgimage--lg>img {
    display: none;
  }

  .wp-block-image.faq-accent-sp {
    width: 80%;
    margin: 0 auto;
  }
}



/*----- アコーディオン -----*/
.wp-block-accordion.faq-aco .wp-block-accordion-item.is-layout-flow.wp-block-accordion-item-is-layout-flow {
  margin-bottom: 32px;
}

.wp-block-accordion.faq-aco h3.wp-block-accordion-heading {
  font-size: 32px;
}

@media screen and (max-width: 781px) {
  .wp-block-accordion.faq-aco h3.wp-block-accordion-heading {
    font-size: 24px !important;
  }
}

.wp-block-accordion.faq-aco .wp-block-accordion-panel {
  padding: 16px 24px 16px 48px;
}

.wp-block-accordion.faq-aco .wp-block-accordion-panel::before {
  content: 'A:';
  position: absolute;
  font-size: 24px;
  font-weight: 600;
  color: var(--color-wh);
  margin: -4px 0 0 -28px;
}



/* =======================================
　コラムセクション
======================================= */

/*----- マスク図形 -----*/
.blog-msk {
  background: url(../../images/msk/msk08.webp) no-repeat center top;
  background-size: contain;
  width: 100%;
  height: 16vw;
  position: absolute;
  z-index: 3;
  margin-top: -14vw;
}


/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.blog-section {
  padding-top: 0;
  padding-bottom: 16vw;
  margin-top: -4vw;
  position: relative;
  z-index: 4;
}

.wp-block-snow-monkey-blocks-section.smb-section.blog-section .smb-section__inner>.c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.blog-section .smb-section__inner>.c-container {
    padding: 0 40px;
  }
}


/*----- 見出し部 -----*/
/* h2見出し */
h2.wp-block-heading.blog-heading {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

h2.wp-block-heading.blog-heading span {
  font-size: min(max(4.2vw, 64px), 100vw);
  letter-spacing: 4px;
  line-height: 1.2;
}


@media (max-width: 639px) {
  h2.wp-block-heading.blog-heading {
    margin-top: 10vw;
  }

  h2.wp-block-heading.blog-heading span {
    font-size: 32px;
    margin-bottom: 8px;
  }
}


/* キャッチ */
p.blog-catch {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}



/*----- ブログコンテンツ -----*/
/* クエリループ */
.wp-block-query.blog-post-feed figure.wp-block-post-featured-image img {
  border-radius: 16px;
}

.wp-block-query.blog-post-feed h2.wp-block-post-title.has-medium-font-size {
  margin: 0 0 24px;
}

/* もっと読むボタン */
.wp-block-snow-monkey-blocks-buttons a.smb-btn.smb-btn--wider {
  padding: 16px 32px;
}



/* =======================================
　CTAエリア04（コントロール）
======================================= */
.wp-block-group.cta-group.cta04 {
  position: relative;
  z-index: 3;
  margin-bottom: 5vw;
}

.wp-block-group.cta-group.cta04 .wp-block-snow-monkey-blocks-section.smb-section.cta-section {
  padding-bottom: 6vw;
}

/*----- マスク図形 -----*/
.flow-msk {
  background: url(../../images/msk/msk06.webp) no-repeat center top;
  background-size: contain;
  width: 100%;
  height: 13vw;
  position: absolute;
  z-index: 1;
}




/* =======================================
　医院の紹介
======================================= */

/*----- セクション -----*/
.wp-block-snow-monkey-blocks-section.smb-section.info-section .smb-section__inner>.c-container {
  padding: 0 80px;
}

@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-section.smb-section.info-section .smb-section__inner>.c-container {
    padding: 0 40px;
  }
}

/*----- 情報カラム -----*/

@media screen and (max-width: 1023px) {

  /* カラム */
  .wp-block-columns.info-col {
    gap: 24px;
    flex-direction: column;
  }
}

/* 電話番号 */
.wp-block-group.tel-number-info figure.wp-block-image.tel-icon {
  margin-top: -6px;
}


/* =======================================
　Googleカレンダー（レスポンシブ対応）
======================================= */

.calendar {
  position: relative;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

/* アスペクト比を維持するためのパディング（270/283 ≈ 95.4%） */
.calendar::before {
  content: "";
  display: block;
  padding-bottom: 95.4%;
}

.calendar iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
  border-radius: 0;
}

/* レスポンシブ対応 */


@media screen and (min-width: 1024px) {
  .calendar.pc {
    display: block;
  }

  .calendar.sp {
    display: none;
  }
}

@media (max-width: 781px) {
  .calendar {
    margin: 0 auto;
  }
}

@media screen and (max-width: 1023px) {
  .calendar.pc {
    display: none;
  }

  .calendar.sp {
    display: block;
  }
}


/* =======================================
　GoogleMap埋め込み
======================================= */
.map {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 40%;
}


@media (max-width: 1023px) {
  .map {
    padding-top: 60%;
  }
}