.repair-service-page {
  --repair-navy:#173653;
  --repair-blue:#1a83bc;
  --repair-sky:#70c6e8;
  --repair-green:#6bc785;
  --repair-orange:#ff9c3f;
  color:var(--repair-navy);
}
.repair-service-page main { overflow:hidden; background:#fff; }
.repair-inner { width:min(877px, calc(100% - 64px)); height:100%; margin-inline:auto; }
.repair-title { position:relative; padding-left:16px; border-left:3px solid #62c3e9; }
.repair-title p { margin:0 0 3px; color:#59b7df; font:800 11px/1.2 Arial,sans-serif; letter-spacing:.11em; }
.repair-title h2 { margin:0; color:var(--repair-navy); font-size:22px; font-weight:850; line-height:1.4; letter-spacing:.025em; }

/* Reference y 55–312 */
.repair-hero { height:262px; overflow:hidden; background:#f4fcff; }
.repair-hero-inner {
  position:relative;
  width:min(941px,100%);
  height:262px;
  margin-inline:auto;
  overflow:hidden;
  background:url("assets/repair-work/ip-01_clean_hero.webp") 71% 50% / cover no-repeat;
}
.repair-hero-inner::before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(255,255,255,.97) 0 31%,rgba(255,255,255,.74) 41%,rgba(255,255,255,0) 54%);
}
.repair-hero-copy { position:absolute; z-index:2; top:49px; left:max(72px,calc((100% - 797px)/2)); width:340px; }
.repair-kicker { margin:0 0 7px; color:#5fb7da; font:800 11px/1.2 Arial,sans-serif; letter-spacing:.13em; }
.repair-hero h1 { margin:0 0 9px; color:#142f48; font-size:49px; font-weight:900; line-height:1.12; letter-spacing:.025em; }
.repair-hero-copy > p:last-child { margin:0; color:#18334c; font-size:17px; font-weight:750; line-height:1.55; letter-spacing:.015em; }
.repair-hero-note { position:absolute; z-index:3; top:24px; left:54%; margin:0; padding:7px 13px 8px; border-radius:18px; color:#1878ba; background:rgba(255,255,255,.84); box-shadow:0 5px 15px rgba(34,111,157,.10); font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-size:18px; font-weight:900; line-height:1.5; letter-spacing:.07em; text-align:center; white-space:nowrap; transform:rotate(-7deg); }
.repair-hero-message { position:absolute; z-index:2; right:26px; bottom:10px; margin:0; padding:14px 23px 9px 34px; border-radius:70% 0 0 0; color:#283e45; background:rgba(250,255,241,.86); font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-size:14px; font-weight:700; line-height:1.65; text-align:center; }

/* Reference y 312–518 */
.repair-about { height:205px; overflow:hidden; background:#fff; }
.repair-about-grid { display:grid; grid-template-columns:54% 46%; gap:16px; align-items:center; }
.repair-about-copy { align-self:start; padding-top:29px; }
.repair-about-copy > p { margin:10px 0 0 16px; color:#40566b; font-size:11px; font-weight:600; line-height:1.7; }
.repair-about-visual { position:relative; align-self:stretch; }
.repair-about-visual img { position:absolute; right:-23px; bottom:3px; width:410px; height:176px; object-fit:contain; }
.repair-about-visual p { position:absolute; z-index:2; top:31px; right:47px; margin:0; color:#2379b8; font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-size:12px; font-weight:800; line-height:1.55; letter-spacing:.06em; text-align:center; transform:rotate(-8deg); }

/* Reference y 518–781 */
.repair-services { height:263px; padding-top:2px; overflow:hidden; background:#fff; }
.repair-services .repair-title { margin:0 0 9px; }
.repair-service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.repair-service-grid article { height:203px; overflow:hidden; padding:8px 10px 10px; border:1px solid #e7edf1; border-radius:16px; background:#fff; box-shadow:0 6px 18px rgba(45,90,115,.08); }
.repair-service-image { position:relative; height:105px; margin:-1px -2px 5px; }
.repair-service-image > img:first-child { width:100%; height:100%; border-radius:13px; object-fit:cover; }
.repair-service-icon { position:absolute; bottom:7px; left:6px; width:52px; height:52px; padding:6px; border-radius:50%; background:rgba(255,255,255,.9); object-fit:contain; }
.repair-service-grid article:nth-child(2) .repair-service-icon { background:#e4f8eb; }
.repair-service-grid article:nth-child(3) .repair-service-icon { background:#fff0dc; }
.repair-service-grid article:nth-child(4) .repair-service-icon { background:#ffe8ee; }
.repair-service-grid h3 { margin:0 0 3px; color:#173a5b; font-size:13px; font-weight:900; line-height:1.4; white-space:nowrap; }
.repair-service-grid p { margin:0; color:#536778; font-size:10px; font-weight:600; line-height:1.55; }

/* Reference y 781–1103 */
.repair-trouble { position:relative; height:322px; overflow:hidden; background:linear-gradient(180deg,#edfaff 0 63%,#fff 100%); border-radius:0 0 70px 70px; }
.repair-trouble::before { content:""; position:absolute; left:-26px; bottom:-42px; width:180px; height:180px; opacity:.55; background:url("assets/repair-work/ip-15_leaf_decoration.webp") center/contain no-repeat; }
.repair-trouble .repair-title { margin-top:14px; }
.repair-trouble-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; margin-top:11px; }
.repair-trouble-grid article { height:114px; display:grid; grid-template-columns:77px 1fr; gap:4px; align-items:center; padding:8px; border-radius:14px; background:#fff; box-shadow:0 5px 15px rgba(39,112,145,.07); }
.repair-trouble-grid img { width:72px; height:76px; object-fit:contain; }
.repair-trouble-grid h3 { margin:0 0 4px; color:#173b5e; font-size:11px; font-weight:900; line-height:1.5; }
.repair-trouble-grid p { margin:0; color:#5a6c7c; font-size:8.5px; font-weight:600; line-height:1.5; }
.repair-solution { position:relative; height:124px; display:flex; align-items:flex-end; justify-content:center; padding-bottom:20px; text-align:center; }
.repair-down { position:absolute; top:5px; left:50%; width:47px; height:37px; object-fit:contain; transform:translateX(-50%); }
.repair-solution h2 { margin:0; color:#1480bd; font-size:21px; font-weight:900; line-height:1.35; }
.repair-solution p { margin:3px 0 0; color:#4c6071; font-size:11px; font-weight:600; }
.repair-staff { position:absolute; right:12px; bottom:-2px; width:200px; height:115px; }
.repair-staff img { position:absolute; right:65px; bottom:0; width:92px; height:113px; object-fit:contain; object-position:center bottom; }
.repair-staff p { position:absolute; top:20px; right:0; width:80px; height:58px; display:grid; place-items:center; margin:0; border:1px solid #a7dceb; border-radius:50%; color:#1879b2; background:#fff; font-size:10px; font-weight:800; line-height:1.45; transform:rotate(-5deg); }

/* Reference y 1103–1288 */
.repair-reasons { position:relative; height:185px; padding-top:16px; overflow:hidden; background:linear-gradient(100deg,#f4fff4,#fff 48%,#f2fff4); }
.repair-reasons::after { content:""; position:absolute; right:-18px; bottom:-35px; width:115px; height:128px; opacity:.38; background:url("assets/repair-work/ip-15_leaf_decoration.webp") center/contain no-repeat; transform:scaleX(-1); }
.repair-reason-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:8px; }
.repair-reason-grid article { height:105px; display:grid; grid-template-columns:83px 1fr; align-items:center; gap:2px; padding:9px; border-radius:17px; background:rgba(255,255,255,.95); box-shadow:0 5px 16px rgba(45,100,75,.06); }
.repair-reason-grid img { width:78px; height:82px; object-fit:contain; }
.repair-reason-grid h3 { margin:0 0 4px; color:#173a5b; font-size:11px; font-weight:900; line-height:1.4; white-space:nowrap; }
.repair-reason-grid h3 span { width:25px; height:25px; display:inline-grid; place-items:center; margin-right:5px; border-radius:50%; color:#fff; background:#76cb82; font-size:14px; }
.repair-reason-grid article:nth-child(2) h3 span { background:#62add2; }
.repair-reason-grid article:nth-child(3) h3 span { background:#f5a44d; }
.repair-reason-grid p { margin:0; color:#52687b; font-size:9px; font-weight:600; line-height:1.55; }

/* Reference y 1288–1497 */
.repair-flow-section { height:209px; padding-top:15px; overflow:hidden; background:#fff; }
.repair-flow-heading { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:9px; }
.repair-flow-heading > p { margin:0 4px 4px 0; color:#435f77; font-size:11px; font-weight:600; }
.repair-flow { height:139px; display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin:0; padding:0; list-style:none; }
.repair-flow li { position:relative; display:grid; grid-template-columns:40px 34px minmax(0,1fr); grid-template-rows:48px 1fr; column-gap:4px; align-items:center; padding:9px 9px 10px; border:1px solid #e5edf1; border-radius:15px; background:#fff; box-shadow:0 5px 15px rgba(38,93,121,.06); }
.repair-flow li:not(:last-child)::after { content:"›"; position:absolute; z-index:2; top:45px; right:-15px; color:#75c6e5; font-size:34px; font-weight:500; line-height:1; }
.repair-flow li > span { position:absolute; top:11px; left:13px; width:38px; height:38px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#70c3e7; font-size:14px; font-weight:850; }
.repair-flow li:nth-child(2) > span { background:#74ccb6; }
.repair-flow li:nth-child(3) > span { background:#ffc77e; }
.repair-flow li:nth-child(4) > span { background:#f3a0b7; }
.repair-flow img { grid-column:2; width:34px; height:34px; margin:0; object-fit:contain; transform:none; }
.repair-flow h3 { grid-column:3; margin:0; color:#173c5d; font-size:14px; font-weight:900; line-height:1.3; white-space:normal; }
.repair-flow p { grid-column:1/4; margin:6px 2px 0; color:#52677a; font-size:9.5px; font-weight:600; line-height:1.55; text-align:center; }

/* Reference y 1497–1609 */
.repair-contact { height:118px; display:flex; align-items:center; overflow:hidden; background:linear-gradient(90deg,#fff8ef,#f7fdff 43%,#ecfaff); }
.repair-contact-inner { width:min(941px,100%); height:93px; display:grid; grid-template-columns:280px 248px 1fr; align-items:center; gap:14px; margin-inline:auto; padding:0 65px; border-radius:70px; background:rgba(255,255,255,.95); box-shadow:0 5px 18px rgba(45,100,130,.06); }
.repair-contact h2 { margin:0; color:#17466a; font-size:20px; font-weight:900; line-height:1.4; }
.repair-contact p { margin:3px 0 0; color:#4e6577; font-size:10px; font-weight:600; line-height:1.55; }
.repair-phone { display:flex; align-items:center; gap:8px; color:#1883bd; }
.repair-phone > img { width:26px; height:26px; object-fit:contain; }
.repair-phone span { display:flex; flex-direction:column; }
.repair-phone b { font-size:27px; font-weight:900; line-height:1.2; white-space:nowrap; }
.repair-phone small { color:#536779; font-size:8.5px; font-weight:700; text-align:center; }
.repair-form { height:54px; display:flex; align-items:center; justify-content:center; gap:9px; border-radius:999px; color:#fff; background:linear-gradient(100deg,#ffa443,#ff862b); box-shadow:0 8px 18px rgba(244,130,37,.22); font-size:14px; font-weight:850; white-space:nowrap; }
.repair-form img { width:26px; height:23px; object-fit:contain; filter:brightness(0) invert(1); }
.repair-form span { font-size:25px; font-weight:400; }
.repair-service-page .site-footer { height:187px; }

@media (max-width:860px) {
  .repair-inner { width:calc(100% - 36px); }
  .repair-hero { height:600px; }
  .repair-hero-inner { height:600px; background-position:67% bottom; background-size:auto 100%; }
  .repair-hero-inner::before { background:linear-gradient(180deg,rgba(255,255,255,.98) 0 44%,rgba(255,255,255,.15) 67%,rgba(255,255,255,.65)); }
  .repair-hero-copy { top:34px; left:50%; width:calc(100% - 42px); text-align:center; transform:translateX(-50%); }
  .repair-hero h1 { font-size:56px; }
  .repair-hero-copy > p:last-child { font-size:17px; }
  .repair-hero-note { top:270px; right:24px; left:auto; max-width:calc(100% - 48px); font-size:18px; line-height:1.45; white-space:normal; }
  .repair-hero-message { font-size:14px; }
  .repair-about,.repair-services,.repair-trouble,.repair-reasons,.repair-flow-section,.repair-contact { height:auto; overflow:visible; }
  .repair-about { padding:35px 0; }
  .repair-about-grid { grid-template-columns:1fr; gap:20px; }
  .repair-about-copy { padding-top:0; }
  .repair-about-copy > p { margin-left:0; font-size:14px; }
  .repair-about-visual { min-height:300px; }
  .repair-about-visual img { position:static; width:100%; height:300px; }
  .repair-about-visual p { top:40px; right:50px; font-size:14px; }
  .repair-services { padding:35px 0; }
  .repair-title h2 { font-size:27px; }
  .repair-service-grid { grid-template-columns:repeat(2,1fr); gap:18px; margin-top:20px; }
  .repair-service-grid article { height:auto; min-height:305px; padding:12px 14px 16px; }
  .repair-service-image { height:180px; }
  .repair-service-icon { width:66px; height:66px; }
  .repair-service-grid h3 { margin-top:10px; font-size:17px; white-space:normal; }
  .repair-service-grid p { font-size:13px; }
  .repair-trouble { padding:30px 0 0; border-radius:0 0 45px 45px; }
  .repair-trouble-grid { grid-template-columns:repeat(2,1fr); gap:15px; }
  .repair-trouble-grid article { height:150px; grid-template-columns:105px 1fr; }
  .repair-trouble-grid img { width:100px; height:110px; }
  .repair-trouble-grid h3 { font-size:14px; }
  .repair-trouble-grid p { font-size:11px; }
  .repair-solution { height:180px; align-items:center; padding:45px 190px 0 0; }
  .repair-staff { right:0; height:170px; }
  .repair-staff img { height:165px; width:120px; }
  .repair-staff p { top:30px; }
  .repair-reasons { padding:35px 0; }
  .repair-reason-grid { grid-template-columns:1fr; gap:14px; margin-top:20px; }
  .repair-reason-grid article { height:150px; grid-template-columns:130px 1fr; padding:14px; }
  .repair-reason-grid img { width:120px; height:125px; }
  .repair-reason-grid h3 { font-size:17px; }
  .repair-reason-grid p { font-size:13px; }
  .repair-flow-section { padding:35px 0; }
  .repair-flow-heading { align-items:flex-start; gap:15px; }
  .repair-flow-heading > p { max-width:48%; font-size:13px; }
  .repair-flow { height:auto; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:18px; }
  .repair-flow li { min-height:180px; grid-template-columns:40px 50px minmax(0,1fr); grid-template-rows:62px 1fr; column-gap:8px; padding:14px; }
  .repair-flow li:not(:last-child)::after { display:none; }
  .repair-flow li > span { width:44px; height:44px; }
  .repair-flow img { grid-column:2; width:46px; height:46px; margin:0; }
  .repair-flow h3 { font-size:17px; }
  .repair-flow p { font-size:13px; }
  .repair-contact { padding:28px 18px; }
  .repair-contact-inner { width:100%; height:auto; grid-template-columns:1fr 1fr; gap:18px; padding:28px; border-radius:36px; }
  .repair-contact-inner > div:first-child { grid-column:1/3; text-align:center; }
  .repair-contact h2 { font-size:25px; }
  .repair-contact p { font-size:13px; }
  .repair-service-page .site-footer { height:auto; }
}

@media (max-width:560px) {
  .repair-hero { height:590px; }
  .repair-hero-inner { height:590px; background-position:63% bottom; }
  .repair-hero-copy { top:28px; }
  .repair-hero h1 { font-size:48px; }
  .repair-hero-copy > p:last-child { font-size:15px; }
  .repair-hero-note { top:260px; right:16px; max-width:210px; padding:7px 11px 8px; font-size:16px; }
  .repair-hero-message { right:6px; bottom:5px; }
  .repair-title h2 { font-size:23px; }
  .repair-about-visual { min-height:230px; }
  .repair-about-visual img { height:230px; }
  .repair-about-visual p { top:24px; right:15px; font-size:12px; }
  .repair-service-grid { grid-template-columns:1fr; }
  .repair-service-grid article { min-height:310px; }
  .repair-service-image { height:190px; }
  .repair-trouble-grid { grid-template-columns:1fr; }
  .repair-trouble-grid article { height:145px; grid-template-columns:105px 1fr; }
  .repair-solution { height:265px; padding:45px 0 125px; align-items:center; }
  .repair-solution h2 { font-size:20px; }
  .repair-staff { right:50%; bottom:0; transform:translateX(50%); }
  .repair-reason-grid article { min-height:160px; height:auto; grid-template-columns:105px 1fr; }
  .repair-reason-grid img { width:100px; height:110px; }
  .repair-reason-grid h3 { font-size:15px; white-space:normal; }
  .repair-flow-heading { display:block; }
  .repair-flow-heading > p { max-width:none; margin-top:10px; }
  .repair-flow { grid-template-columns:1fr; }
  .repair-flow li { min-height:170px; }
  .repair-contact-inner { grid-template-columns:1fr; padding:25px 18px; }
  .repair-contact-inner > div:first-child { grid-column:auto; }
  .repair-phone { justify-content:center; }
  .repair-phone b { font-size:25px; }
  .repair-form { height:58px; }
}
