﻿@charset "utf-8";

/* ==============================
  footer 共通
============================== */
footer {
  color: #333;
  margin: 40px auto 0;
  text-align: center;
  background-color: #fce4ed;
  border-top: 1px solid #fce4ed;
  border-bottom: 1px solid #fce4ed;
}
.footer__container {
  /* width: 100%; */
  padding: 20px 20px 80px;
  line-height: 1.5;
  text-align: center;
}
.footer__info {
  font-size: 12px;
}
.footer__copyright {
  border-top: 1px solid #d2d3d4;
  margin-top: 40px;
  padding-top: 20px;
}
.footer__copyright,
.footer__disclaimer {
  font-size: 11px;
}

@media screen and (max-width: 768px) {
  footer {
    margin: 0 auto;
  }
  .footer__container {
    width: auto;
  }
}



/* ==============================
  theme tokens
============================== */

.treatment-card--pink,
.treatment-block--pink,
.treatment-hero--pink {
	--theme-main: #e45c9a;
	--theme-dark: #c92f76;
	--theme-border: #f0a8c9;
	--theme-dotted: #eeb0cc;
	--theme-button: #e73891;
	--theme-button-dark: #c71872;
	--theme-accent: #d4488e;
	--theme-price: #d92778;
	--theme-price-gradient: linear-gradient(to bottom, #ff74ad 0%, #f03786 52%, #cf1f6c 100%);
	--theme-depth-shadow: 205, 31, 108;
	--theme-button-gradient: linear-gradient(90deg, #f15aa4 0%, #c71872 100%);
	--theme-feature-bg: url("../img/treatment_hero/icon/circle_pink.webp");
	--theme-label-image: url("../img/treatment_hero/label/label_pink.webp");
	--theme-bg: url("../img/treatment_hero/bg/bg_pink_pc.webp") center / cover no-repeat;
}

.treatment-card--purple,
.treatment-block--purple,
.treatment-hero--purple {
	--theme-main: #8d6cd4;
	--theme-dark: #6f4ea9;
	--theme-border: #cbb6ec;
	--theme-dotted: #c8aee8;
	--theme-button: #8d6cd4;
	--theme-button-dark: #6f4ea9;
	--theme-accent: #8d6cd4;
	--theme-price: #6f4ea9;
	--theme-price-gradient: linear-gradient(to bottom, #a984ea 0%, #7655c5 52%, #5731a0 100%);
	--theme-depth-shadow: 87, 49, 160;
	--theme-button-gradient: linear-gradient(90deg, #9b79dc 0%, #5f3c9d 100%);
	--theme-feature-bg: url("../img/treatment_hero/icon/circle_purple.webp");
	--theme-label-image: url("../img/treatment_hero/label/label_purple.webp");
	--theme-bg: url("../img/treatment_hero/bg/bg_purple_pc.webp") center / cover no-repeat;
}

.treatment-card--blue,
.treatment-block--blue,
.treatment-hero--blue {
	--theme-main: #2f8ed8;
	--theme-dark: #0f5fae;
	--theme-border: #9bd2f3;
	--theme-dotted: #8ec9ee;
	--theme-button: #1f83d4;
	--theme-button-dark: #0c63b4;
	--theme-accent: #0b63b6;
	--theme-price: #0b63c7;
	--theme-price-gradient: linear-gradient(to bottom, #55acf1 0%, #2d86dc 52%, #0965c2 100%);
	--theme-depth-shadow: 9, 101, 194;
	--theme-button-gradient: linear-gradient(90deg, #2f8ed8 0%, #0c63b4 100%);
	--theme-feature-bg: url("../img/treatment_hero/icon/circle_blue.webp");
	--theme-label-image: url("../img/treatment_hero/label/label_blue.webp");
	--theme-bg: url("../img/treatment_hero/bg/bg_blue_pc.webp") center / cover no-repeat;
}

.treatment-card--green,
.treatment-block--green,
.treatment-hero--green {
	--theme-main: #6f965a;
	--theme-dark: #4f753e;
	--theme-border: #bdd7b2;
	--theme-dotted: #b7cfaa;
	--theme-button: #6f965a;
	--theme-button-dark: #4f753e;
	--theme-accent: #5f814c;
	--theme-price: #2f7d3d;
	--theme-price-gradient: linear-gradient(to bottom, #68ad72 0%, #408b4b 52%, #246c30 100%);
	--theme-depth-shadow: 36, 108, 48;
	--theme-button-gradient: linear-gradient(90deg, #7aa363 0%, #4f753e 100%);
	--theme-feature-bg: url("../img/treatment_hero/icon/circle_green.webp");
	--theme-label-image: url("../img/treatment_hero/label/label_green.webp");
	--theme-bg: url("../img/treatment_hero/bg/bg_green_pc.webp") center / cover no-repeat;
}

.treatment-card--orange,
.treatment-block--orange,
.treatment-hero--orange {
	--theme-main: #e49a3a;
	--theme-dark: #bf7420;
	--theme-border: #efc58d;
	--theme-dotted: #e7b978;
	--theme-button: #e4932f;
	--theme-button-dark: #bd6e1d;
	--theme-accent: #c87822;
	--theme-price: #d86f1f;
	--theme-price-gradient: linear-gradient(to bottom, #ffa34a 0%, #ff7228 52%, #e84413 100%);
	--theme-depth-shadow: 232, 68, 19;
	--theme-button-gradient: linear-gradient(90deg, #eda344 0%, #bd6e1d 100%);
	--theme-feature-bg: url("../img/treatment_hero/icon/circle_orange.webp");
	--theme-label-image: url("../img/treatment_hero/label/label_orange.webp");
	--theme-bg: url("../img/treatment_hero/bg/bg_orange_pc.webp") center / cover no-repeat;
}

.treatment-card--pink {
	--theme-light: #fff0f7;
}

.treatment-card--purple {
	--theme-light: #f5edff;
}

.treatment-card--blue {
	--theme-light: #eaf7ff;
}

.treatment-card--green {
	--theme-light: #f1f8ed;
}

.treatment-card--orange {
	--theme-light: #fff3df;
}

/* ==============================
  treatment-block 共通
============================== */

.treatment-block {
  position: relative;
  margin: 40px auto 0;
}

/* ==============================
  treatment-hero theme tokens
============================== */

.treatment-hero--pink {
  --theme-label-bg: linear-gradient(90deg, #f8b8c8 0%, #ef719a 36%, #ec5488 62%, #f391b0 100%);
  --theme-label-border: rgba(160, 28, 65, 0.9);
  --theme-label-shadow: rgba(166, 27, 75, 0.44);
  --theme-label-glow: rgba(244, 96, 143, 0.38);
  --theme-label-rim: rgba(255, 235, 241, 0.94);
}

.treatment-hero--purple {
  --theme-label-bg: linear-gradient(90deg, #d8a6d7 0%, #c58ac9 48%, #a869b8 100%);
  --theme-label-border: rgba(230, 200, 255, 0.85);
  --theme-label-shadow: rgba(80, 30, 140, 0.45);
  --theme-label-glow: rgba(155, 90, 190, 0.32);
  --theme-label-rim: rgba(255, 241, 252, 0.86);
}

.treatment-hero--blue {
  --theme-label-bg: linear-gradient(90deg, #69c7ff 0%, #2f95e4 52%, #1672c8 100%);
  --theme-label-border: rgba(155, 210, 243, 0.9);
  --theme-label-shadow: rgba(20, 70, 130, 0.45);
  --theme-label-glow: rgba(58, 151, 225, 0.32);
  --theme-label-rim: rgba(231, 249, 255, 0.9);
}

.treatment-hero--green {
  --theme-label-bg: linear-gradient(90deg, #b9d8a8 0%, #7eaa69 52%, #638d4e 100%);
  --theme-label-border: rgba(189, 215, 178, 0.9);
  --theme-label-shadow: rgba(55, 95, 40, 0.45);
  --theme-label-glow: rgba(108, 150, 88, 0.3);
  --theme-label-rim: rgba(245, 255, 240, 0.9);
}

.treatment-hero--orange {
  --theme-label-bg: linear-gradient(90deg, #f7c987 0%, #e49a3a 52%, #c87822 100%);
  --theme-label-border: rgba(239, 197, 141, 0.9);
  --theme-label-shadow: rgba(130, 75, 20, 0.4);
  --theme-label-glow: rgba(225, 148, 54, 0.32);
  --theme-label-rim: rgba(255, 247, 230, 0.9);
}

/* ==============================
  treatment-hero 共通
============================== */

.treatment-hero__name,
.treatment-hero__price-num,
.treatment-hero__price-unit,
.treatment-hero__price-tax {
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
}

.treatment-hero {
  position: relative;
}

.treatment-hero__card {
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding: 30px;
  background: var(--theme-bg);
  box-sizing: border-box;
}

.treatment-hero__left,
.treatment-hero__right {
  position: relative;
  z-index: 1;
}

.treatment-hero__left {
  flex: 1;
  min-width: 0;
}

.treatment-hero__name {
  margin: 0 0 20px;
  padding-top: 10px;
  color: #282421;
  font-size: 50px;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
}

.treatment-hero__name span {
  font-size: 30px;
}

.treatment-hero__subtitle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  margin: -6px 0 20px;
  color: #242020;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.92),
    0 0 10px rgba(255, 255, 255, 0.64);
}

.treatment-hero__subtitle::before,
.treatment-hero__subtitle::after {
  content: "✦";
  display: flex;
  align-items: center;
  width: 100px;
  height: 22px;
  flex: 1 1 70px;
  color: var(--theme-price);
  font-size: 18px;
  line-height: 1;
}

.treatment-hero__subtitle::before {
  justify-content: flex-end;
  background: linear-gradient(var(--theme-price), var(--theme-price)) left 50% / calc(100% - 30px) 1px no-repeat;
}

.treatment-hero__subtitle::after {
  justify-content: flex-start;
  background: linear-gradient(var(--theme-price), var(--theme-price)) right 50% / calc(100% - 30px) 1px no-repeat;
}

.treatment-hero__features {
  display: flex;
  align-items: center;
}

.treatment-hero__feature {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.treatment-hero__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 164px;
  height: 168px;
  padding: 20px 18px 24px;
  gap: 8px;
  border: 0;
  border-radius: 0;
  background: var(--theme-feature-bg) center / contain no-repeat;
  filter:
    drop-shadow(0 4px 0 rgba(var(--theme-depth-shadow), 0.12))
    drop-shadow(0 14px 18px rgba(var(--theme-depth-shadow), 0.22))
    drop-shadow(0 0 10px rgba(255, 255, 255, 0.48));
  box-sizing: border-box;
}

.treatment-hero__icon img {
  display: block;
  width: 48px;
  height: 48px;
  object-fit: contain;
}

.treatment-hero__feature-text {
  margin: 0;
  color: #151515;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
}

.treatment-hero__feature-text strong {
  color: var(--theme-price);
  font-size: 26px;
  font-weight: 600;
}
.treatment-hero__feature-text small {
  font-size: 11px;
}

.treatment-hero__divider {
  display: block;
  width: 1px;
  align-self: stretch;
  margin: 0 20px;
  border-left: 1.5px solid var(--theme-dotted);
  flex-shrink: 0;
}

.treatment-hero__right {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  gap: 20px;
  margin-top: 20px;
}

.treatment-hero__detail {
  margin: 0;
  padding: 8px 16px;
  border: 1.5px solid var(--theme-accent);
  color: var(--theme-accent);
  font-size: 16px;
  white-space: nowrap;
  box-sizing: border-box;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
}

.treatment-hero__price {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  align-self: center;
  gap: 7px;
  margin: 0;
  line-height: 1;
  filter:
    drop-shadow(0 2px 1px rgba(255, 255, 255, 0.95))
    drop-shadow(0 0 12px rgba(255, 255, 255, 0.78))
    drop-shadow(0 0 28px rgba(255, 255, 255, 0.42));
}

.treatment-hero__price-num,
.treatment-hero__price-unit,
.treatment-hero__price-tax {
  background: var(--theme-price-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-family: "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
  font-weight: 500;
  text-shadow: 0 1px 0 rgba(120, 80, 80, 0.12);
}

.treatment-hero__price-num {
  font-size: 92px;
  letter-spacing: -0.01em;
}

.treatment-hero__price-unit {
  padding-bottom: 12px;
  font-size: 34px;
}

.treatment-hero__price-tax {
  padding-bottom: 13px;
  font-size: 16px;
}

.treatment-hero__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  width: 24vw;
  height: 70px;
  margin-top: 20px;
  background: var(--theme-button-gradient);
  text-decoration: none;
  box-sizing: border-box;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.16);
  font-feature-settings: "palt";
}

/* ==============================
  SP対応
============================== */

@media screen and (max-width: 767px) {
  .treatment-card--pink,
  .treatment-block--pink,
  .treatment-hero--pink {
    --theme-bg: url("../img/treatment_hero/bg/bg_pink_sp.webp") center / cover no-repeat;
  }

  .treatment-card--purple,
  .treatment-block--purple,
  .treatment-hero--purple {
    --theme-bg: url("../img/treatment_hero/bg/bg_purple_sp.webp") center / cover no-repeat;
  }

  .treatment-card--blue,
  .treatment-block--blue,
  .treatment-hero--blue {
    --theme-bg: url("../img/treatment_hero/bg/bg_blue_sp.webp") center / cover no-repeat;
  }

  .treatment-card--green,
  .treatment-block--green,
  .treatment-hero--green {
    --theme-bg: url("../img/treatment_hero/bg/bg_green_sp.webp") center / cover no-repeat;
  }

  .treatment-card--orange,
  .treatment-block--orange,
  .treatment-hero--orange {
    --theme-bg: url("../img/treatment_hero/bg/bg_orange_sp.webp") center / cover no-repeat;
  }

  /* .treatment-block {
    margin: 28px auto;
  } */

  .treatment-hero__card {
    display: block;
    text-align: center;
  }

  .treatment-hero__label {
    padding: 8px 18px;
    font-size: 14px;
  }

  .treatment-hero__name {
    padding-top: 18px;
    margin-bottom: 20px;
    font-size: 36px;
    text-align: center;
  }

  .treatment-hero__features {
    justify-content: center;
    gap: 8px;
  }

  .treatment-hero__feature {
    flex: 1;
  }

  .treatment-hero__icon {
    width: 96px;
    height: 96px;
    padding: 8px;
    border-width: 2px;
  }

  .treatment-hero__icon img {
    width: 28px;
    height: 28px;
  }

  .treatment-hero__feature-text {
    font-size: 10px;
  }

  .treatment-hero__feature-text strong {
    font-size: 18px;
  }

  .treatment-hero__divider {
    width: 100%;
    height: 1px;
    margin: 22px 0;
    border-left: none;
    border-top: 1.5px solid var(--theme-dotted);
  }

  .treatment-hero__right {
    align-items: center;
    gap: 14px;
    margin-top: 0;
  }

  .treatment-hero__detail {
    padding: 8px 10px;
    font-size: 13px;
    white-space: normal;
  }

  .treatment-hero__price-num {
    font-size: 58px;
  }

  .treatment-hero__price-unit {
    font-size: 22px;
    padding-bottom: 6px;
  }

  .treatment-hero__price-tax {
    font-size: 12px;
    padding-bottom: 6px;
  }

  .treatment-hero__btn {
    height: 58px;
    margin-top: 8px;
    padding: 14px 20px;
    gap: 16px;
    font-size: 20px;
  }

  .treatment-hero__btn-arrow {
    width: 34px;
    height: 34px;
  }

  .treatment-hero__btn-arrow::after {
    width: 10px;
    height: 10px;
    border-width: 2.5px;
  }
}

.treatment-hero__btn {
  display: block;
  width: min(26vw, 360px);
  height: auto;
  margin-top: 20px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  line-height: 0;
}

.treatment-hero__btn img {
  display: block;
  width: 100%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(var(--theme-depth-shadow), 0.18))
    drop-shadow(0 18px 22px rgba(var(--theme-depth-shadow), 0.28))
    drop-shadow(0 0 12px rgba(255, 255, 255, 0.5));
}

.treatment-hero__label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  width: min(100%, 360px);
  min-width: 0;
  min-height: 0;
  aspect-ratio: 960 / 191;
  margin: 0 auto 10px;
  padding: 0 20px;
  border: 0;
  border-radius: 0;
  background: var(--theme-label-image) center / contain no-repeat;
  box-shadow: none;
  filter:
    drop-shadow(0 4px 0 rgba(var(--theme-depth-shadow), 0.16))
    drop-shadow(0 11px 14px rgba(var(--theme-depth-shadow), 0.24))
    drop-shadow(0 0 7px rgba(255, 255, 255, 0.45));
  overflow: visible;
  color: #fff;
  font-size: 26px;
  line-height: 1;
  font-family: "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
  text-align: center;
  box-sizing: border-box;
  z-index: 10;
  font-weight: 700;
}


/* .treatment-hero.w980 {
  width: min(980px, 100%);
} */

@media screen and (max-width: 1024px) {
  /* .treatment-hero.w980 {
    width: calc(100% - 24px);
  } */

  .treatment-hero__card {
    padding: clamp(22px, 3vw, 30px);
  }

  .treatment-hero__name {
    font-size: clamp(38px, 5vw, 50px);
  }

  .treatment-hero__icon {
    width: clamp(118px, 16vw, 164px);
    height: clamp(121px, 16.4vw, 168px);
    padding: clamp(20px, 2.9vw, 30px) clamp(12px, 1.8vw, 18px) clamp(18px, 2.4vw, 24px);
  }

  .treatment-hero__feature-text {
    font-size: clamp(13px, 1.8vw, 18px);
  }

  .treatment-hero__feature-text strong {
    font-size: clamp(20px, 2.6vw, 30px);
  }

  .treatment-hero__price-num {
    font-size: clamp(70px, 9vw, 96px);
  }
}

@media screen and (max-width: 767px) {
  .treatment-hero.w980 {
    width: 100%;
    box-sizing: border-box;
  }

  .treatment-hero__card {
    display: block;
    min-height: 0;
    padding: 24px 14px 28px;
    text-align: center;
  }

  .treatment-hero__left {
    padding: 0;
    text-align: center;
  }

  .treatment-hero__label {
    width: min(95%, 360px);
    margin: 0 auto 12px;
    padding: 0 clamp(20px, 11vw, 52px);
    font-size: clamp(18px, 5.7vw, 26px);
    gap: 3vw;
  }

  .treatment-hero__name {
    margin: 0 0 14px;
    padding: 10px 0 0;
    font-size: clamp(30px, 8vw, 38px);
    text-align: center;
  }

  .treatment-hero__name span {
    font-size: clamp(18px, 5vw, 24px);
  }

  .treatment-hero__subtitle {
    gap: 5px;
    margin: -4px 0 18px;
    font-size: clamp(14px, 4vw, 18px);
    letter-spacing: 0.03em;
  }

  .treatment-hero__subtitle::before,
  .treatment-hero__subtitle::after {
    width: 15vw;
    flex-basis: 13vw;
    height: 14px;
    font-size: 11px;
  }

  .treatment-hero__subtitle::before {
    background-size: calc(100% - 20px) 1px;
  }

  .treatment-hero__subtitle::after {
    background-size: calc(100% - 20px) 1px;
  }

  .treatment-hero__features {
    justify-content: center;
    gap: 6px;
  }

  .treatment-hero__feature {
    flex: 1 1 0;
  }

  .treatment-hero__feature-sep {
    display: none;
  }

  .treatment-hero__icon {
    width: clamp(94px, 29vw, 112px);
    height: clamp(96px, 29.8vw, 115px);
    padding: 18px 10px 15px;
    gap: 4px;
  }

  .treatment-hero__icon img {
    width: 28px;
    height: 28px;
  }

  .treatment-hero__feature-text {
    font-size: clamp(9px, 2.8vw, 11px);
  }

  .treatment-hero__feature-text strong {
    font-size: clamp(16px, 4.8vw, 18px);
  }

  .treatment-hero__divider {
    width: 100%;
    min-height: 0;
    height: 1px;
    margin: 22px 0 16px;
    border-left: 0;
    border-top: 1.5px solid var(--theme-dotted);
  }

  .treatment-hero__right {
    align-items: center;
    width: 100%;
    gap: 12px;
    margin-top: 0;
  }

  .treatment-hero__detail {
    min-width: 0;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto 0 0;
    padding: 8px 18px;
    box-sizing: border-box;
    font-size: 16px;
    text-align: left;
  }

  .treatment-hero__price-num {
    font-size: clamp(56px, 17vw, 68px);
  }

  .treatment-hero__price-unit {
    padding-bottom: 7px;
    font-size: 22px;
  }

  .treatment-hero__price-tax {
    padding-bottom: 8px;
    font-size: 12px;
  }

  .treatment-hero__btn {
    width: min(95%, 360px);
    margin: 8px auto 0;
  }
}

/* ================================ */
/* recommend-menu / treatment-card  */
/* ================================ */

.recommend-menu {
	padding: 40px 16px 44px;
	background: #fbfaf7;
}

.recommend-menu__title {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 28px;
	color: #2f2b29;
	font-size: 31px;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
	letter-spacing: 0.08em;
}

.recommend-menu__title:before,
.recommend-menu__title:after {
	content: "";
	flex: 1;
	height: 1px;
	background: #cdbf9f;
}

.recommend-menu__title-text {
	display: inline-block;
	position: relative;
	padding: 0 28px;
}

.recommend-menu__title-text:before,
.recommend-menu__title-text:after {
	content: "❆";
	position: absolute;	
	top: 50%;
	color: #cdbf9f;
	font-size: 14px;
	line-height: 1;
	transform: translateY(-52%);
}

.recommend-menu__title-text:before { left: 0; }
.recommend-menu__title-text:after  { right: 0; }

.recommend-menu__list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 22px;
	max-width: 900px;
	margin: 0 auto;
}

.treatment-card {
	display: block;
	color: inherit;
	text-decoration: none;
}

.treatment-card__inner {
	display: flex;
	flex-direction: column;
	position: relative;
	overflow: hidden;
	padding: 20px 15px 18px;
	border: 1px solid var(--theme-border);
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(109, 97, 77, 0.08);
	box-sizing: border-box;
	text-align: left;
	min-height: 270px;
	height: 100%;
}

.treatment-card__inner:after {
	content: "";
	position: absolute;
	left: -8%;
	right: -8%;
	bottom: -24px;
	width: auto;
	height: 88px;
	background: var(--theme-light);
	pointer-events: none;
}

.recommend-menu__title,
.treatment-card__name {
	font-family: "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
}

.treatment-card__price-num,
.treatment-card__price-yen,
.treatment-card__price-tax {
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
}

.treatment-card__label {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	gap: 8px;
	max-width: 100%;
	margin: 0 0 26px;
	padding: 5px 22px 5px 16px;
	border: 1px solid var(--theme-border);
	border-radius: 999px;
	background: var(--theme-light);
	color: var(--theme-main);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: 0.02em;
	box-sizing: border-box;
}

.treatment-card__label-icon {
	display: block;
	width: 38px;
	height: 38px;
	object-fit: contain;
	flex-shrink: 0;
}

.treatment-card__name {
	margin: 0 0 15px;
	color: #282421;
	font-size: clamp(24px, 3vw, 30px);
	font-weight: bold;
	line-height: 1.18;
	letter-spacing: 0.05em;
	overflow-wrap: anywhere;
}
.treatment-card__name span {
	font-size: 0.86em;
}

.treatment-card__content {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-bottom: 18px;
	border-bottom: 1px dashed var(--theme-dotted);
	position: relative;
	z-index: 1;
}

.treatment-card__detail {
	margin: 0;
	color: #767372;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.42;
	letter-spacing: -0.03em;
}

.treatment-card__price {
	flex-shrink: 0;
	margin: 0;
	color: #222;
	line-height: 1;
	white-space: nowrap;
	display: flex;
	align-items: flex-end;
	position: relative;
}

.treatment-card__price-num {
	color: var(--theme-price);
	font-size: 40px;
	font-style: italic;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.treatment-card__price-suffix {
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
	margin-left: 8px;
	padding-bottom: 5px;
	gap: 4px;
}

.treatment-card__price-yen {
	font-size: 18px;
	font-weight: 700;
}

.treatment-card__price-tax {
	color: #666;
	font-size: 13px;
	font-weight: 700;
}

.treatment-card__footer {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 18px;
	margin-top: 10px;
	padding-right: 2px;
}

.treatment-card__link {
	color: var(--theme-main);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: 0.06em;
}

.treatment-card__arrow {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--theme-button);
	flex-shrink: 0;
}

.treatment-card__arrow::before {
	content: "";
	position: absolute;
	left: 11px;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 2px;
	background: #fff;
	border-radius: 1px;
}

.treatment-card__arrow::after {
	content: "";
	position: absolute;
	right: 13px;
	top: 50%;
	width: 12px;
	height: 12px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: translateY(-50%) rotate(45deg);
	box-sizing: border-box;
}
@media screen and (max-width: 767px) {
  .recommend-menu__title {
    font-size: 28px;
  }
  .recommend-menu__list {
    grid-template-columns: auto;
  }
}
@media (hover: hover) {
	.treatment-card__inner {
		transition: transform 0.25s ease, box-shadow 0.25s ease;
	}

	.treatment-card:hover .treatment-card__inner {
		transform: translateY(-3px);
		box-shadow: 0 12px 28px rgba(50, 40, 30, 0.12);
	}
}

/* 詳細情報 共通
------------------------------*/

.details-box__title {
	text-align: center;
	color: #fff;
	font-size: 32px;
	padding: 20px 0;
	margin-bottom: 10px;
}

.details-box__title--pink {
  background-color: #e95383;
}
.details-box__title--purple {
  background-color: #8957a1;
}
.details-box__title--blue {
  background-color: #00b7ee;
}
.details-box__title--green {
  background-color: #6f965a;
}

.details-box__content table {
	width: 910px;
	border: 1px #d2d3d4 solid;
	border-collapse: collapse;
}

.details-box__content h2{
	font-size: 24px;
	text-align: center;
	margin-top: 10px;
}

.details-box__content td {
	border: 1px #d2d3d4 solid;
	padding: 15px 15px;
	vertical-align: middle;
  text-align: left;
}

.details-box__content th {
	border: 1px #d2d3d4 solid;
	background: #f3f3f3;
	padding: 15px 15px;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	width: 180px;
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .details-box__title {
    color: #fff;
    text-align: center;
    padding: 14px 0;
    font-size: 28px;
  }
  .details-box__content {
    padding-left: 24px;
    padding-right: 24px;
    box-sizing: border-box;
  }
  .details-box__content table {
    border-collapse: collapse;
    width: 100%;
  }
  .details-box__content th {
    width: 170px;
    padding: 12px;
    line-height: 1.5;
  }
  .details-box__content td {
    border: 1px #d2d3d4 solid;
    padding: 12px;
    line-height: 1.5;
  }
  .details-box__row-heading td {
    background: #f3f3f3;
    text-align: center;
  }
}

@media screen and (max-width: 768px) {
  .details-box__title {
    color: #fff;
    text-align: center;
    padding: 10px 0;
    font-size: 26px;
  }
  .details-box__content {
    padding-left: 15px;
    padding-right: 15px;
  }
  .details-box__content table {
    border-collapse: collapse;
    width: 100%;
  }
  .details-box__content td {
    border: 1px #d2d3d4 solid;
    padding: 10px;
    line-height: 1.5;
  }
  .details-box__row-heading td {
    background: #f3f3f3;
    text-align: center;
  }
}


/* 見出し 共通
------------------------------*/

.menu-heading {
	position: relative;
	display: block;
	min-height: 0;
	box-sizing: border-box;
	padding: 40px 20px 44px;
	overflow: visible;
	color: #000;
	text-align: center;
}

.menu-heading:after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 22px;
	width: 190px;
	height: 4px;
	background: var(--menu-heading-accent, linear-gradient(90deg, #ffb5bc 0%, #ef4f8d 100%));
	transform: translateX(-50%);
}

.menu-heading--pink,
.menu-heading--green,
.menu-heading--purple,
.menu-heading--orange,
.menu-heading--blue {
	color: #000;
}

.menu-heading--pink {
	--menu-heading-accent: linear-gradient(90deg, #ffb5bc 0%, #ef4f8d 100%);
}

.menu-heading--green {
	--menu-heading-accent: linear-gradient(90deg, #b7df9e 0%, #5f9b45 100%);
}

.menu-heading--purple {
	--menu-heading-accent: linear-gradient(90deg, #d8b5f2 0%, #8d61c8 100%);
}

.menu-heading--orange {
	--menu-heading-accent: linear-gradient(90deg, #ffd08a 0%, #ef8b28 100%);
}

.menu-heading--blue {
	--menu-heading-accent: linear-gradient(90deg, #9dd9ff 0%, #2f8ed8 100%);
}

.menu-heading__main {
	display: block;
	color: #000;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-weight: bold;
	font-size: 36px;
	letter-spacing: 0;
	line-height: 1.15;
	text-shadow: none;
}

.menu-heading__main small {
	font-size: 24px;
}

.menu-heading__main sup,
.menu-heading__sub sup {
	font-size: 55%;
	line-height: 0;
}

.menu-heading__sub {
	display: none;
}


/* おすすめチェックリスト 共通
------------------------------*/

.recommend-check {
	--recommend-check-main: #e84f93;
	--recommend-check-line: #e8cbd6;
	width: min(820px, 100%);
	margin: 0 auto 30px;
	padding: 0 32px;
	box-sizing: border-box;
	background: transparent;
	text-align: left;
}

.recommend-check li {
	display: flex;
	align-items: center;
	position: relative;
	min-height: 58px;
	padding: 17px 0 17px 62px;
	border-bottom: 1px solid var(--recommend-check-line);
	color: #000;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 25px;
	font-weight: bold;
	line-height: 1.45;
	letter-spacing: 0;
	text-shadow: none;
}

.recommend-check li:last-child {
	border-bottom: none;
}

.recommend-check li:before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 28px;
	height: 28px;
	box-sizing: border-box;
	border: 2px solid var(--recommend-check-main);
	border-radius: 50%;
	background: #fff;
	transform: translateY(-50%);
}

.recommend-check li:after {
	content: "";
	position: absolute;
	left: 6px;
	top: 50%;
	width: 14px;
	height: 8px;
	border-left: 3px solid var(--recommend-check-main);
	border-bottom: 3px solid var(--recommend-check-main);
	transform: translateY(-64%) rotate(-45deg);
}

.recommend-check--pink {
	--recommend-check-main: #e84f93;
	--recommend-check-line: #e8cbd6;
}

.recommend-check--purple {
	--recommend-check-main: #8d61c8;
	--recommend-check-line: #d9c9eb;
}

.recommend-check--orange {
	--recommend-check-main: #ef8b28;
	--recommend-check-line: #edd2ae;
}

.recommend-check--green {
	--recommend-check-main: #5f9b45;
	--recommend-check-line: #c9ddbe;
}

.recommend-check--blue {
	--recommend-check-main: #2f8ed8;
	--recommend-check-line: #bdd9ee;
}

@media screen and (max-width: 767px) {
  .menu-heading {
    min-height: 0;
    padding: 40px 20px 44px;
  }
  .menu-heading__main {
    font-size: 26px;
  }
  .menu-heading:after {
    bottom: 22px;
    width: 80px;
    height: 4px;
  }
  .recommend-check {
    width: auto;
    margin-right: 15px;
    margin-left: 15px;
    padding: 0;
  }
  .recommend-check li {
    min-height: 44px;
    padding: 10px 0 10px 42px;
    font-size: 17px;
    line-height: 1.5;
  }
  .recommend-check li:before {
    width: 24px;
    height: 24px;
  }
  .recommend-check li:after {
    left: 5px;
    width: 12px;
    height: 7px;
  }
}
