/* Typography Variables */
:root {
  --fs-small-heading: clamp(22px, 1.7361vw, 25px); /* 小見出し, min 22px, max 25px at 1440px */
  --fs-medium-heading: clamp(26px, 2.5vw, 36px); /* 中見出し, min 26px, max 36px at 1440px */
  --fs-large-heading: clamp(30px, 2.9167vw, 42px); /* 大見出し, min 30px, max 42px at 1440px */
  --fs-large-text: clamp(18px, 1.3889vw, 20px); /* テキスト大, min 18px, max 20px at 1440px */
  --fs-normal-text: clamp(16px, 1.1111vw, 16px); /* 通常テキスト, min 16px, max 16px at 1440px */
  --fs-copy-span: clamp(20px, 2.9861vw, 43px); /* #copy span, min 20px, max 43px at 1440px */
  --fs-cta-p: clamp(18px, 2.0833vw, 30px); /* CTA p, min 18px, max 30px at 1440px */
  --fs-cta-dt: clamp(22px, 1.8056vw, 26px); /* CTA dt, min 22px, max 26px at 1440px */
  --fs-cta-dd: clamp(24px, 2.0139vw, 29px); /* CTA dd, min 24px, max 29px at 1440px */

  --lh-small-heading: 150%; /* 小見出し行間150% */
  --lh-medium-heading: 130%; /* 中見出し行間130% */
  --lh-large-heading: 130%; /* 大見出し行間130% */
  --lh-large-text: 140%; /* テキスト大行間140% */
  --lh-normal-text: 130%; /* 通常テキスト行間130% */
  --lh-cta: 100%; /* CTA行間100% */
}

/* Font Size and Line Height Declarations */
section .title-large .title {
  font-size: var(--fs-large-heading);
  line-height: var(--lh-large-heading);
}

#tagline h1 span,
.header-bg-wave strong,
#guarantee .title span {
  font-size: var(--fs-small-heading);
  line-height: var(--lh-small-heading);
}

.common-header .cta {
  font-size: var(--fs-normal-text);
}

.cta:not(.common-header .cta) {
  font-size: 1rem;
}

.cta dt {
  font-size: var(--fs-cta-dt);
  line-height: var(--lh-cta);
}

.cta dd {
  font-size: var(--fs-cta-dd);
  line-height: var(--lh-cta);
}

.cta p {
  font-size: var(--fs-cta-p);
  line-height: var(--lh-cta);
}

.cta dl::before,
.cta dl::after {
  font-size: var(--fs-cta-dd);
}
.cta dl dt::before,
.cta dl dd::after {
  font-size: var(--fs-cta-dd);
}

.header-bg-wave header h2 {
  font-size: var(--fs-medium-heading);
  line-height: var(--lh-medium-heading);
}

.header-bg-wave p {
  font-size: var(--fs-large-text);
  line-height: var(--lh-large-text);
}

#copy span {
  font-size: var(--fs-copy-span);
}

#thinking h2 {
  font-size: var(--fs-medium-heading);
  line-height: var(--lh-medium-heading);
}

#thinking li {
  font-size: var(--fs-large-text);
  line-height: var(--lh-large-text);
}

#punchline {
  font-size: var(--fs-large-heading);
  line-height: var(--lh-large-heading);
}

#review .data h2 {
  font-size: var(--fs-medium-heading);
  line-height: var(--lh-medium-heading);
}

#review .data .detail {
  font-size: var(--fs-medium-heading);
  line-height: var(--lh-medium-heading);
}

.review-detail .description header h2 {
  font-size: var(--fs-large-text);
  line-height: var(--lh-large-text);
}

.review-detail .description .inner {
  font-size: var(--fs-normal-text);
  line-height: var(--lh-normal-text);
}

.bunner .title span {
  font-size: var(--fs-large-heading);
}

#qa .question {
  font-size: var(--fs-large-text);
  line-height: var(--lh-large-text);
}

#qa .answer {
  font-size: var(--fs-normal-text);
}

#qa .answer::before {
  font-size: var(--fs-large-text);
}

#quality_control footer h3,
#quality_control footer p {
  font-size: var(--fs-medium-heading);
  line-height: var(--lh-medium-heading);
}

.address {
  font-size: var(--fs-normal-text);
}

.text-link {
  font-size: var(--fs-normal-text);
  line-height: var(--lh-normal-text);
}

.btn {
  font-size: var(--fs-large-text);
  line-height: var(--lh-large-text);
}