/* Other Responsive Clamps (font-size以外) */
:root {
  --w-review-detail: clamp(640px, 47.4444vw, 1250px);
  --w-review-description: clamp(350px, 27.0833vw, 760px);
  --s-review-figure: clamp(150px, 13.8889vw, 360px);
  --w-qa-detail: clamp(400px, 53.125vw, 765px);
  --w-footer-wrap: clamp(600px, 63.1944vw, 1642px);
}

section {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

.logo img {
  max-width: clamp(150px, 20.2083vw, 350px);
  height: clamp(33px, 4.5139vw, 80px);
}

.cta:not(.common-header .cta) {
  width: clamp(22em, 40.2778vw, 580px);
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

.cta p {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0071 + 10px), calc((100vw - 1400px) * 0.0071 + 10.28px));
}

.header-bg-wave {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}
.header-bg-wave li {
  flex-wrap: nowrap;
}
.header-bg-wave .inner p:last-child {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 40px), calc((100vw - 1400px) * 0.0556 + 47.5px));
}

#copy {
  width: clamp(600px, 68.0556vw, 70%);
  height: clamp(300px, 47.2222vw, 680px);
}

.three-point-li {
  width: clamp(300px, 50vw, 800px);
}

.three-point-li img {
  width: clamp(100px, 13.8889vw, 250px);
  height: clamp(44px, 6.1806vw, 111px);
}

#thinking .content {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

#thinking .thinking-list {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 20px), calc((100vw - 1400px) * 0.0556 + 27.5px));
}

#thinking figure {
  width: clamp(400px, 59.0278vw, 850px);
  height: clamp(207px, calc(59.0278vw / 1.9318), 440px);
}

#thinking .description {
  width: clamp(300px, 41.0vw, 590px);
  height: clamp(224px, calc(41.0vw / 1.3409), 440px);
  padding-left: clamp(60px, 8.3333vw, 120px);
}

#punchline {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

.service_features-li .inner p:last-child {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 40px), calc((100vw - 1400px) * 0.0556 + 47.5px));
}

#review {
  padding: 0 0 clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

#review .container {
  padding-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

#review .content {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

#review .detail {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 20px), calc((100vw - 1400px) * 0.0556 + 27.5px));
}

.review-detail {
  width: var(--w-review-detail);
}

.review-detail .description {
  width: var(--w-review-description);
}

.review-detail .description .inner {
  margin-top: clamp(10px, calc((100vw - 1400px) * 0.0556 + 10px), calc((100vw - 1400px) * 0.0556 + 17.5px));
}

.review-detail figure {
  flex: 0 0 var(--s-review-figure);
  width: var(--s-review-figure);
  height: var(--s-review-figure);
}

#qa .title-large {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

#qa .qa-detail {
  width: var(--w-qa-detail);
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

#guarantee .content ul,
#quality_control .content ul {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

#quality_control footer {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
}

#quality_control footer p {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 20px), calc((100vw - 1400px) * 0.0556 + 27.5px));
}

body > div > footer {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 40px), calc((100vw - 1400px) * 0.0556 + 47.5px));
}

body > div > footer > .wrap {
  margin-top: clamp(0px, calc((100vw - 1400px) * 0.0556 + 80px), calc((100vw - 1400px) * 0.0556 + 87.5px));
  width: var(--w-footer-wrap);
}
/* Responsive Media Queries */
@media (min-width: 1441px) {
  #thinking .description {
    width: 40vw!important;
    height: 35vw;
  }
  #thinking figure {
    width: 60vw!important;
    height: 35vw;
  }
  .cta:not(.common-header .cta) {
    padding: 0.5em 0 1em;
    width: 22em;
  }
}
@media (481px <= width < 960px) {
  :root {
    --fs-small-heading: clamp(24px, 1.7361vw, 25px);
    --fs-medium-heading: clamp(30px, 2.9167vw, 42px);
    --fs-large-heading: clamp(29px, 2.9167vw, 42px);
    --fs-large-text: clamp(22px, 1.3889vw, 20px);
    --fs-normal-text: clamp(16px, 1.1111vw, 16px);
    --fs-copy-span: clamp(20px, 2.9861vw, 43px);
    --fs-cta-p: clamp(18px, 2.0833vw, 30px);
    --fs-cta-dt: clamp(22px, 1.8056vw, 26px);
    --fs-cta-dd: clamp(24px, 2.0139vw, 29px);
    --lh-small-heading: 150%;
    --lh-medium-heading: 130%;
    --lh-large-heading: 130%;
    --lh-large-text: 140%;
    --lh-normal-text: 130%;
    --lh-cta: 100%;
  }
  #copy {
    width: 100vw;
    padding-left: 40vw;
  }
  .kv figure {
    margin-top: 32.8056vw;
  }
  .three-point-li {
    padding: 0;
    gap: 1vw;
  }
  #punchline {
    flex-wrap: wrap;
  }
  #thinking .description {
    padding: 10vw 7vw;
    width: 86vw;
    box-sizing: content-box;
  }
  #thinking figure {
    width: 100vw;
  }
  #thinking .inner {
    margin-top: 1em;
    flex-direction: column;
  }
  #review .data .detail {
    flex-direction: column;
  }
  .header-bg-wave .inner p:last-child {
    margin-top: 1em;
  }
  #review h1 br {
    display: unset;
  }
  #review .data {
    padding: 0 5vw;
  }
  #review .detail {
    margin-top: 1em;
  }
  #review .detail dl {
    margin-top: .5em;
  }
  #review .detail,
  #review .detail dl {
    gap: 0;
  }
  #review .detail dl + dl::before {
    content: "";
  }
  .review-detail {
    width: 100vw;
  }
  .review-detail:nth-child(odd) .description,
  .review-detail:nth-child(even) .description {
    order: 1;
  }
  .review-detail:nth-child(odd) .description .wrap::after,
  .review-detail:nth-child(even) .description .wrap::after {
    top: -20px;
    left: 50%;
    right: 50%;
    transform: translateX(-50%);
    border-top: 0;
    border-left: 10px solid transparent;
    border-bottom: 20px solid #ffffff;
    border-right: 10px solid transparent;
  }
  .review-detail {
    flex-direction: column;
  }
  .bunner {
    padding: 40vw 0 15vw;
  }
  .header-bg-wave li {
    flex-direction: column;
  }
  .header-bg-wave li + li {
    margin-top: 10vw;
  }
  .header-bg-wave .description {
    order: 1;
    width: 95vw;
    margin-left: auto;
    margin-right: auto;
  }
  .header-bg-wave li .description {
    order: 1;
    width: 100vw!important;
    padding: 0 2.5vw;
  }
  .quality_control-li li:nth-child(odd) .description {
    order: 1;
  }
  .header-bg-wave figure {
    width: 100vw;
  }
  .header-bg-wave li figure {
    width: 100vw;
    padding: 0 2.5vw;
  }
  .header-bg-wave .wrap {
    width: 100vw;
    padding: 3vw 0 6vw;
  }
  #quality_control footer h3,
  #quality_control footer p {
    margin: 1em 0;
    padding: 0 1em;
  }
  body > div > footer > .wrap {
    flex-direction: column;
    width: 100vw;
  }
}
@media (max-width: 480px) {
  html {
    font-size: calc(10px + 0.5vw); /* Further adjust for very small screens */
  }
  body {
    background-size: auto;
  }
  .common-header .cta {
    display: unset;
  }
  .kv figure {
    flex: 0 0 55vw;
    max-width: 60vw;
    height: 55vw;
    margin-top: 28vw;
  }
  #copy {
    max-width: 95vw;
    width: 90vw;
    padding-left: 45vw;
  }
  #copy span {
    bottom: -8vw;
    margin-top: auto;
    font-size: 5.1vw;
  }
  .three-point-li {
    width: fit-content;
    gap: 2vw;
  }
  #tagline h1 {
    display: flex;
    flex-direction: column;
    justify-items: center;
    align-items: center;
  }
  #tagline h1 span {
    font-size: 5.5vw;
  }
  #tagline h1 span:last-child {
    width: 12em;
  }
  .cta dl dt::before,
  .cta dl dd::after {
    font-size: 7.5vw;
  }
  .cta dt {
    margin-right: .1em;
    font-size: 5.5vw;
  }
  .cta dd {
    font-size: 6.5vw;
  }
  .cta:not(.common-header .cta) {
    padding: 3vw 1vw 4vw;
    width: 90vw;
  }
  .cta:not(.common-header .cta) p:last-child {
    margin-top: 2vw;
  }
  .cta .cta-attention {
    /* Optional: Fine-tune for small screens if clamp isn't sufficient */
    width: clamp(64px, 17.2043vw, 128px); /* Adjust vw for faster scaling on mobile if desired (e.g., 64px at ~372px viewport) */
  }
  #thinking .content {
    width: 100vw;
  }
  #thinking .inner {
    flex-direction: column;
    margin-top: 1em;
  }
  #thinking .description {
    padding: 5vw 0 5vw 10vw;
    width: 100vw;
    height: fit-content;
  }
  #thinking .description h2 {
    width: fit-content;
    font-size: 7vw;
  }
  #thinking ul {
    gap: 1vw;
  }
  #thinking li {
    font-size: 4.4vw;
  }
  #thinking li + li {
    margin-top: 2vw;
  }
  #thinking figure {
    width: 100vw;
  }
  #punchline {
    display: flex;
    flex-direction: column;
    gap: 2vw;
    padding-top: 7vw;
    padding-bottom: 9vw;
  }
  #punchline span {
    display: block;
    text-align: left;
    font-size: 7vw;
  }
  section .title-large {
    font-size: 7vw;
  }
  section .title-large .title {
    font-size: 7vw;
  }
  section .title-large img {
    height: 1.5em;
    width: auto;
  }
  .header-bg-wave li {
    flex-direction: column;
  }
  .header-bg-wave li + li {
    margin-top: 10vw;
  }
  .header-bg-wave li figure {
    width: 100vw;
    padding: 0 2.5vw;
  }
  .header-bg-wave li .description {
    order: 1;
    width: 100vw!important;
    padding: 0 2.5vw;
  }
  .header-bg-wave li .description .wrap {
    width: 96vw;
  }
  .header-bg-wave header h2 {
    font-size: 7vw;
  }
  .header-bg-wave .inner {
    gap: 2vw;
  }
  .header-bg-wave p {
    font-size: 5vw;
  }
  .header-bg-wave p + p {
    margin-top: 2vw;
  }
  .header-bg-wave strong {
    font-size: 6.5vw;
  }
  .service_features-li .inner p:last-child {
    margin-top: 4vw;
  }
  .service_features-return .inner p:last-child {
    text-align: left;
  }
  .service_features-trouble .inner p strong br {
    display: none;
  }
  #review ul {
    width: 100vw;
    overflow: hidden;
  }
  #review h1 br {
    display: unset;
  }
  #review .data h2 {
    padding: 0 2vw;
    font-size: 7vw;
    text-align: left;
  }
  #review .detail {
    display: flex;
    flex-direction: column;
    margin-top: 4vw;
  }
  #review .detail dl {
    gap: 0;
    font-size: 6vw;
  }
  #review .detail dl + dl::before {
    content: "";
  }
  .review-detail {
    flex-direction: column;
  }
  .review-detail .description {
    order: 1;
  }
  .review-detail:nth-child(odd) .description .wrap::after,
  .review-detail:nth-child(even) .description .wrap::after {
    top: -20px;
    left: 50%;
    right: 50%;
    transform: translateX(-50%);
    border-top: 0;
    border-left: 10px solid transparent;
    border-bottom: 20px solid #ffffff;
    border-right: 10px solid transparent;
  }
  .review-detail .description header h2 {
    font-size: 5vw;
  }
  .review-detail .description .inner {
    font-size: clamp(12px, 3.8vw, 16px);
    line-height: 1.8;
    padding: 3vw;
  }
  .bunner {
    padding: 40vw 0 10vw;
  }
  .bunner .title span {
    font-size: 6vw;
  }
  #qa .title-large {
    margin-top: 15vw;
  }
  #qa .qa-detail {
    margin-left: auto;
    margin-right: auto;
    width: 95vw;
  }
  #qa .qa-detail ul {
    padding: 0;
  }
  #qa .question {
    font-size: 5vw;
    padding-left: 10vw;
  }
  #qa .answer {
    font-size: 4.5vw;
    padding-left: 10vw;
  }
  #qa .question::before, #qa .answer::before {
    font-size: 4vw;
  }
  #qa .cta {
    margin: 15vw auto;
  }
  section .title-large {
    gap: 0;
  }
  section .title-large .title span {
    font-size: 5vw;
  }
  #guarantee .title {
    padding: 0 5vw;
    line-height: 1.2;
  }
  #guarantee .title br {
    display: unset;
  }
  #guarantee > header {
    align-items: center;
    text-align: center;
  }
  .guarantee-li header {
    margin-top: 3vw;
    padding: 3vw 0;
    justify-content: center;
    text-align: center;
  }
  .guarantee-li .inner {
    margin-top: 3vw;
    padding: 0 3vw;
  }
  .guarantee-smile .inner p:last-child {
    margin-top: 5vw;
    text-align: left;
  }
  .guarantee-loaner_car h2 {
    margin: 0 auto;
    width: 12em;
    text-align: left;
  }
  .guarantee-loaner_car .inner {
    margin-top: 5vw;
    width: 95vw;
  }
  #quality_control .title-large {
    align-items: center;
  }
  #quality_control .description {
    order: 1;
  }
  #quality_control .description .wrap {
    margin: 3vw 5vw;
  }
  #quality_control .description header h2 {
    margin: 0 auto;
  }
  #quality_control .description .inner {
    margin-top: 3vw;
  }
  #quality_control .cta {
    margin: 10vw auto;
  }
  #quality_control footer {
    margin: 10vw auto;
    padding: 5vw;
  }
  #quality_control footer h3 {
    font-size: 7vw;
  }
  #quality_control footer p {
    font-size: 6.5vw;
    margin-top: 6vw;
    line-height: 1.5;
  }
  .btn {
    font-size: 5vw;
  }
  body > div > footer > .wrap {
    width: fit-content;
    flex-direction: column;
  }
  .footer-left, .footer-right {
    padding: 0;
  }
  .address {
    font-size: 4vw;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fade-in-up, .fade-in-left, .fade-in-right {
    animation: none;
    opacity: 1;
    transform: none;
  }
}