/* Small compatibility and accessibility additions to the original stylesheet. */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { min-width: 0; text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
body, input, textarea, select, button { font-family: 'Noto Sans JP', sans-serif; }
button { margin: 0; }
table { border-collapse: collapse; text-indent: 0; }
img { display: block; }
[hidden] { display: none !important; }
main { display: block; }
#container { overflow-x: clip; }
#contact { scroll-margin-top: 20px; }
fieldset { min-width: 0; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible,
[tabindex="-1"]:focus-visible { outline: 3px solid #245caf; outline-offset: 4px; }
input, textarea { color: #111; background: #fff; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 1000; padding: 12px 20px; background: #fff; border: 2px solid #da251d; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.form-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-note { margin: 0 0 30px; padding: 10px 16px; font-size: 1.3rem; color: #8b0000; background: #fff5f5; border: 1px solid #f5c0c0; border-radius: 4px; letter-spacing: .04em; line-height: 1.7; }
.contactSec .tabBox { max-width: 100%; }
.contactSec .tabBox table { table-layout: fixed; }
.contactSec .tabBox table td { overflow-wrap: anywhere; word-break: normal; }
.contactSec .tabBox table th { padding-right: 12px; }
.contactSec .tabBox table th label { display: inline; }
.choice-group { display: flex; flex-direction: column; gap: 8px; }
.choice-label { display: flex; align-items: flex-start; gap: 8px; min-height: 30px; cursor: pointer; font-size: 1.5rem; line-height: 1.6; letter-spacing: normal; }
.choice-label input { flex: 0 0 18px; width: 18px; height: 18px; margin: 3px 0 0; accent-color: #da251d; }
.choice-label span { min-width: 0; }
.field-hint { margin-top: 6px; color: #5f5f5f; font-size: 1.2rem; letter-spacing: 0; }
.field-error { margin: 6px 0 0; font-size: 1.3rem; letter-spacing: 0; }
[aria-invalid="true"] { border-color: #c91c14 !important; }
.error-summary { margin: 0 0 28px; padding: 15px 18px; border: 1px solid #da251d; border-radius: 4px; background: #fff5f5; font-size: 1.4rem; line-height: 1.8; }
.error-summary p { font-weight: 700; }
.error-summary ul { margin: 8px 0 0 1.2em; list-style: disc; }
.error-summary a { color: #9c1912; text-decoration: underline; }
.contact-button { display: inline-flex; align-items: center; justify-content: center; padding: 12px 16px; width: 100%; min-height: 75px; color: #fff; font-size: 1.8rem; font-weight: 700; text-align: center; line-height: 1.5; letter-spacing: .05em; border: 0; border-radius: 100px; appearance: none; cursor: pointer; background: #da251d; box-shadow: 0 0 7px rgb(218 37 29 / 70%); }
.contact-button.secondary { background: #777; box-shadow: 0 0 7px rgb(136 136 136 / 50%); }
.contact-button:disabled { opacity: .6; cursor: wait; }
.contact-button:hover:enabled { opacity: .8; }
.confirm-intro { margin-bottom: 30px; text-align: center; font-size: 1.6rem; line-height: 1.8; }
.contactSec .tabBox .confirm-table th,
.contactSec .tabBox .confirm-table td { padding: 10px 12px 16px 0; vertical-align: top; letter-spacing: .05em; border-bottom: 1px solid #eee; }
.contactSec .tabBox .confirm-table th { width: 35%; font-size: 1.5rem; }
.confirm-table td { white-space: pre-wrap; }
.confirm-actions { margin-top: 30px; gap: 20px; }
.confirm-actions li:first-child { width: 241px; }
.confirm-actions li:last-child { width: 321px; }
.send-error { margin-top: 20px; line-height: 1.8; text-align: center; }
.contact-complete { padding: 60px 0; text-align: center; }
.contact-complete h3 { margin-bottom: 20px; font-size: 2.4rem; font-weight: 700; }
.contact-complete p { font-size: 1.6rem; line-height: 2; }
.contact-complete .confirmation-notice { margin: 16px 0; padding: 16px; font-size: 1.5rem; border: 1px solid #e9c0aa; background: #fff8f1; border-radius: 4px; }
.done-actions { max-width: 280px; margin: 32px auto 0; }
.image-container .client-name { max-width: 20%; padding: 15px; font-weight: 700; font-size: 1.4rem; line-height: 1.6; text-align: center; overflow-wrap: anywhere; }
.error-page { width: min(680px, calc(100% - 48px)); margin: 80px auto; padding: 48px 24px; text-align: center; }
.error-page img { width: min(371px, 100%); }
.error-page h1 { margin: 48px 0 20px; font-size: 2.8rem; font-weight: 700; }
.error-page p { margin-bottom: 30px; font-size: 1.6rem; line-height: 1.9; }
.error-page .contact-button { max-width: 321px; color: #fff; }

/* The source forced a 1280px page between the phone and desktop breakpoints. */
@media (min-width: 897px) and (max-width: 1279px) {
  .content { width: calc(100% - 80px); }
  #gHeader .hBox { min-height: 95px; padding-right: 220px; }
  #gHeader .logo { width: min(30vw, 371px); }
  #gHeader p { font-size: 1.1rem; }
  #gHeader .contact { width: 200px; }
  .mainVisual .lBox { width: 59%; }
  .mainVisual .lBox p { margin-left: 0; font-size: clamp(1.3rem, 1.32vw, 1.7rem); letter-spacing: .03em; }
  .mainVisual .lBox h2 { font-size: clamp(3.3rem, 3.9vw, 5rem); letter-spacing: .06em; }
  .mainVisual .rBox { width: 50%; margin-left: -9%; }
  .mainVisual .mark { right: -22px; width: 210px; }
  .mainVisual::after { width: 48%; }
  .businessSec .busUl > li { width: calc((100% - 28px) / 2); }
  .businessSec .busUl li h2 { font-size: clamp(2.15rem, 2.35vw, 3rem); }
  .businessSec .busUl li h2 span { letter-spacing: .05em; }
  .businessSec .busUl li .txt { font-size: 1.7rem; }
  .businessSec .busUl li .waistband p { font-size: 1.7rem; }
  .businessSec .busUl li .noteUl { margin: 0 20px; }
  .troubleSec .troubleUl { gap: 24px; }
  .troubleSec .troubleUl li { width: calc((100% - 72px) / 4); margin-right: 0; padding: 0 18px 28px; }
  .troubleSec .imgBox .photoBox { width: 39%; }
  .troubleSec .imgBox .textBox { width: 55%; }
  .troubleSec .imgBox .textBox .text { font-size: 2.1rem; }
  .troubleSec .imgBox .textBox .bg01 { width: 100%; font-size: 2rem; }
  .troubleSec .imgBox .textBox .bg01::after { left: -40px; width: 70px; height: 67px; }
  .supportSec .imgBoxUl li .textBox,
  .supportSec .imgBoxUl li:nth-child(2) .textBox { width: 47%; }
  .supportSec .imgBoxUl li .textBox h3 { font-size: 2.2rem; }
  .supportSec .imgBoxUl li .photoBox { width: 53%; margin-right: -4%; }
  .supportSec .imgBoxUl li:nth-child(2n) .photoBox { margin-left: -4%; }
  .guestsSec .content { width: min(950px, calc(100% - 80px)); }
  .image-container { padding: 24px; }
  .image-container img, .image-container .client-name { padding: 8px; }
}

@media (max-width: 896px) {
  .mailForm td textarea,
  .mailForm td input[type="text"],
  .mailForm td input[type="email"],
  .mailForm td input[type="tel"] { font-size: 16px; }
  .contactSec .tabBox .input-table th { padding-right: 0; }
  .contact-button { min-height: 57px; font-size: 1.6rem; }
  .mailForm .submit li { max-width: 100%; margin-left: 0; margin-right: 0; }
  .confirm-actions { gap: 14px; }
  .confirm-actions li:first-child,
  .confirm-actions li:last-child { width: 100%; max-width: 321px; }
  .contactSec .tabBox .confirm-table th { padding: 16px 0 8px; border-bottom: 0; }
  .contactSec .tabBox .confirm-table td { padding: 0 0 16px; }
  .contact-complete { padding: 30px 0; }
  .contact-complete h3 { font-size: 2rem; }
  .contact-complete p { font-size: 1.5rem; }
  .choice-label { min-height: 32px; }
  .image-container { min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .image-container .client-name { width: 100%; max-width: 100%; font-size: 1.2rem; padding: 10px; }
  .image-container img { justify-self: center; }
  .scrolldown2 { left: 50%; bottom: 0; }
  .error-page { margin: 30px auto; padding: 32px 0; }
  .error-page h1 { font-size: 2.3rem; }
}

@media (max-width: 360px) {
  .mainVisual .lBox { padding-left: 20px; padding-right: 20px; }
  .mainVisual .lBox p { font-size: 1.15rem; }
  .businessSec .busUl li h2 span { font-size: 1.8rem; letter-spacing: .05em; }
  .troubleSec .troubleUl li { padding-left: 10px; padding-right: 10px; }
  #gFooter .fLogo { max-width: calc(100% - 48px); }
  #gFooter address { padding-left: 18px; padding-right: 18px; overflow-wrap: anywhere; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .scrolldown2::before { animation: none; }
}