/* ///////////////////////
全体設定
////////////////////// */
a {
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}
/* 見出しのフォントサイズ */
@media screen and (max-width: 639px) {
  h2 {
    --_font-size-level: 3;
  }
}

/* ///////////////////////
フォント設定
////////////////////// */
.shippori-mincho {
  font-family: "Shippori Mincho", serif;
  font-weight: normal;
}

/* ///////////////////////
ヘッダー
////////////////////// */
/* ヘッダーメニュー細字 */
.p-global-nav .c-navbar .c-navbar__item > a {
  font-weight: 400;
}
/* 背景色設定 */
.l-header {
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.4) 0%,
    rgba(255, 255, 255, 0.2) 70%,
    rgba(255, 255, 255, 0) 100%
  );
}
/* 予約ボタン装飾 */
.c-navbar .header-reserve {
  border-radius: 2px;
  background: linear-gradient(180deg, #b3a497 0%, #9b8b7e 60%, #8a7b6f 100%);
}
.c-navbar .header-reserve a {
  padding-right: 30px;
  padding-left: 30px;
}

/* ///////////////////////
フッター
////////////////////// */
/* フッターの背景色、文字色設定 */
.l-footer,
.c-copyright {
  background-color: #f0f0f0;
  color: #444;
}

/* フッターボタン */
.footer-contact a {
  display: flex;
  justify-content: center; /* 中央配置 */
  align-items: center;
  width: 215px;
  height: auto;
  padding: 16px;
  background-color: #9b8b7e;
  color: #fff;
  text-decoration: none;
  border-radius: 50px;
}
.footer-contact a:hover {
  text-decoration: none;
  background-color: #85786d;
}

/* 固定フッターの装飾 */
.p-footer-sticky-nav {
  background-color: transparent;
}
.p-footer-sticky-nav .footer-menu_sp {
  height: 45px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
}
.p-footer-sticky-nav .footer-menu_sp a {
  font-size: 1rem;
}
.menu_web {
  background: linear-gradient(180deg, #b3a497 0%, #9b8b7e 60%, #8a7b6f 100%);
  color: #fff;
}

/* ///////////////////////
ドロワーメニュー
////////////////////// */
/* ドロワーメニュー 位置*/
/* 背景色 */
nav#drawer-nav {
  background-color: #fff;
}
/* 全体真ん中寄せ */
.c-drawer__inner {
  text-align: center;
}
/* ロゴ真ん中寄せ、サイズ */
.c-hsm-message-box.c-hsm-message-box_invert.p-hsm-drawer.c-blinking {
  max-width: 50%;
  margin: 0 auto;
  margin-bottom: 2rem;
}

/* 高さ調整 */
[id="drawer-nav"].c-drawer--overall .c-drawer__inner {
  height: 100%;
}
/* メニューの文字 */
.c-drawer__menu {
  padding-top: 30px;
  color: #333;
  font-weight: bold;
}

/* ハンバーガーボタンの色（3本線の色もまとめて） */
.c-drawer .c-hamburger-btn__bar {
  background-color: #333;
}

/* ドロワーメニュー内の文字色 */
#drawer-nav,
#drawer-nav a {
  color: #333; /* ここも同じ色に */
}

/* ///////////////////////
トップページ
////////////////////// */
/* fv */
/* 見出しの位置調整 */
.fv-heading__items {
  position: relative;
  top: 0;
  left: 4%;
}
@media screen and (max-width: 639px) {
  .fv-heading__items {
    top: 142px;
    left: 0;
    display: inline-block;
    z-index: 1;
  }
  .fv-heading__items::before {
    content: "";
    position: absolute;
    inset: -15px -16px;
    background: rgba(255, 255, 255, 0.6);
    filter: blur(20px);
    border-radius: 50px;
    transform: translateX(-40px);
    z-index: -1;
  }
}

/* ツルについてセクション */
@media screen and (max-width: 781px) {
  .about-tsuru .about-tsuru__contents {
    display: flex;
    flex-direction: column-reverse;
  }
}

/* こんなお悩みありませんかセクション */
/* パネルの装飾設定 */
.problems-item .smb-panels__item {
  border: 1px solid #ecdfd8;
  border-radius: 1rem;
  box-shadow: none;
}
.problems-item .smb-panels__item__body {
  padding-left: 10px;
  padding-right: 5px;
}
.problems-item .smb-panels__item {
  border: 1px solid #e2e2e2;
  border-radius: 1rem;
  box-shadow: none;
}

/* 特徴セクション */
.features .smb-panels__item {
  border-radius: 1rem;
  box-shadow: none;
}
.features .smb-panels__item__body {
  padding: 0;
}
.features .feature-item__text-group {
  padding-inline: 20px;
  padding-bottom: 20px;
}
.feature-item .wp-block-image img {
  width: 100%;
  height: 280px;
  object-fit: cover;
}
.features .features-list .c-row {
  justify-content: center;
}
/* ボックスの装飾 */
.feature-item {
  padding-left: 0;
  padding-right: 0;
}
.feature-item .smb-panels__item--free {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  border: 1px solid #ecdfd8;
}

/* メニューセクション */
/* 角丸へ */
.menu-item img,
.menu .menu-item__price,
.menu .menu-item__price .wp-block-snow-monkey-blocks-pricing-table-item {
  border-radius: 16px;
}
.menu .menu-item__price .smb-pricing-table__item ul {
  text-align: left;
}
.menu .smb-pricing-table__item__title {
  font-family: "Shippori Mincho", serif;
  font-weight: normal;
}

/* 施術実例セクション */
.before-after__list .c-row {
  justify-content: center;
}
.case-photo__group .case-photo {
  aspect-ratio: 600 / 271;
  overflow: hidden;
}

.case-photo__group .case-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* CTA */
.link-item .smb-items__banner {
  border-radius: 16px;
}

/* アクセスセクション */
.access .access-table table tr td:first-of-type {
  width: 100px;
  display: inline-block;
}
iframe {
  display: block;
  margin: 0 auto;
}

/* ///////////////////////
ここから下層ページ 下層ページ全体設定
////////////////////// */
/* ヘッダー下の余白を消す */
.page .l-contents__inner {
  padding-top: 0;
  padding-bottom: 0;
}
/* ヘッダータイトルの設定 */
.c-page-header .c-page-header__title {
  color: #333;
  font-family: "Shippori Mincho", serif;
  font-weight: normal;
  font-size: var(--wp--preset--font-size--sm-4-xl) !important;
}
/* スマホ時のフォントサイズ設定 */
@media screen and (max-width: 639px) {
  .c-page-header .c-page-header__title {
    font-size: var(--wp--preset--font-size--sm-2-xl) !important;
  }
}
.blog .l-contents__inner:first-child,
.single .l-contents__inner:first-child {
  padding-top: 140px;
}

/* ////////////////////////
お問合せ
//////////////////////// */
/* ボタンの文字を太字に */
.snow-monkey-form--button-has-accent-color .smf-button-control__control {
  font-weight: bold;
}
/* 必須の文字装飾 */
.smf-item__label__text {
  display: flex;
  gap: 12px;
  align-items: center;
}
.smf-item__label__text::after {
  content: "必須";
  color: #fff;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 22px;
  background-color: #9b8b7e;
  border-radius: 4px;
  font-size: 12px;
  font-weight: bold;
}

/* 任意の文字装飾 */
.is-optional .smf-item__label__text::after {
  content: "任意";
  color: #fff;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 22px;
  background-color: #bdbdbd;
  border-radius: 4px;
  font-size: 12px;
  font-weight: bold;
}

/* プライバシーポリシー見出し装飾 */
.privacy-policy h2 {
  border-left: 4px solid var(--wp--preset--color--sm-accent);
}

/* ////////////////////////
初めての方へ
//////////////////////// */
/* 画像のサイズ設定・位置調整 */
.flow-item img {
  aspect-ratio: 3/2;
  object-fit: cover;
  border-radius: 16px;
}
.flow-item .c-row__col:nth-of-type(2) {
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.link-section__item .smb-items__banner {
  height: 280px;
}
@media screen and (max-width: 639px) {
  .flow-item .has-sm-2-xl-font-size {
    font-size: var(--wp--preset--font-size--sm-l) !important;
  }
  .flow-item__contents .smb-media-text__contents-wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }
}
/* スライダー設定 */
.custom-slider .spider__slide img {
  aspect-ratio: 16/9;
  object-fit: cover;
}
/* CTA設定 */
.link-section__item .smb-items__banner {
  border-radius: 16px;
}

/* ////////////////////////
メニュー・料金
//////////////////////// */
.menu-intro img {
  transform: rotate(4deg);
}
.menu-package__item .smb-price-menu {
  border-top: none;
}
.menu-package__item .smb-price-menu__item {
  display: flex;
  justify-content: space-between;
}
.sub-plan__card .smb-panels__item {
  border-radius: 16px;
  box-shadow: none;
  border: 1px solid #eee;
}
/* スマホ設定 */
@media screen and (max-width: 639px) {
  .menu-package .menu-package__text {
    width: fit-content;
  }
  .page-menu__price {
    display: flex;
    justify-content: space-between;
    align-items: end;
  }
  .page-menu__price.is-top {
    align-items: start;
  }
  .page-menu__price .has-sm-xl-font-size {
    font-size: var(--wp--preset--font-size--sm-l) !important;
  }
  .menu-package__item {
    padding-left: 13px;
    padding-right: 13px;
  }
  .menu-intro .wp-block-columns {
    gap: 10px;
  }
}
@media screen and (max-width: 1023px) {
  .menu-package__item .smb-panels__item__body {
    padding-left: 10px;
    padding-right: 10px;
  }
}
@media screen and (max-width: 781px) {
  .menu-package__item .wp-block-columns {
    gap: 10px;
  }
}

/* ////////////////////////
Tsuruについて
//////////////////////// */
.message-text {
  font-size: 16px;
}
