@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&family=Noto+Serif+JP:wght@600;700;900&display=swap');
:root{--ink:#111;--red:#db1820;--deep:#b91219;--paper:#f7f7f7;--line:#06c755;--muted:#6b6b6b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:'Noto Sans JP',sans-serif;line-height:1.8;background:#fff}a{color:inherit}img{max-width:100%;display:block}h1,h2,h3,p{margin-top:0}.wrap{max-width:1180px;margin:auto;padding:0 24px}.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:700;color:var(--red);display:block;margin-bottom:12px}.section{padding:100px 0;position:relative;overflow:hidden}.section h2{font:900 clamp(28px,4vw,48px)/1.35 'Noto Serif JP',serif;letter-spacing:.04em;margin-bottom:30px}.section-lead{max-width:680px;color:#555}.topbar{font-size:12px;background:#111;color:#fff;padding:7px 0}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;background:#fff}.brand{font-weight:900;font-size:21px;letter-spacing:.03em;line-height:1.1;text-decoration:none}.brand small{font-size:9px;display:block;color:var(--red);letter-spacing:.14em}.nav-actions{display:flex;align-items:center;gap:20px}.tel{font-weight:900;text-decoration:none;font-size:17px}.tel small{display:block;font-size:10px;line-height:1.1;color:#555;font-weight:400}.cta{display:inline-flex;justify-content:center;align-items:center;gap:10px;border-radius:2px;background:var(--line);color:white;text-decoration:none;font-weight:900;padding:16px 24px;line-height:1.35;box-shadow:0 10px 24px #059f4740;transition:.2s}.cta:hover{transform:translateY(-2px);background:#05b34d}.cta:focus-visible,a:focus-visible{outline:3px solid #005fcc;outline-offset:3px}.cta::before{content:'LINE';font-size:9px;border:1px solid #fff;border-radius:50%;padding:2px}.hero{background:var(--ink);color:#fff;min-height:670px;position:relative;overflow:hidden}.hero-photo{position:absolute;inset:0 0 0 47%;background:linear-gradient(90deg,#111 0%,#1112 28%,#1112),var(--hero) center/cover no-repeat;opacity:.84}.hero:after{content:'';position:absolute;width:80vw;height:13px;background:var(--red);transform:rotate(-13deg);top:53%;left:-10%;z-index:1}.hero .wrap{position:relative;z-index:2;padding-top:88px}.hero h1{font:900 clamp(39px,5.2vw,70px)/1.3 'Noto Serif JP',serif;letter-spacing:.04em;max-width:750px;margin:10px 0 24px}.hero-copy{max-width:640px;font-size:16px;text-shadow:0 1px 5px #000}.badges{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}.badges span{border:1px solid #ffffff80;padding:5px 11px;font-size:12px;font-weight:700}.hero .cta{min-width:330px}.notes{font-size:11px;margin-top:10px;color:#eee}.statband{background:var(--red);color:#fff;padding:20px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px}.stat{padding:7px 20px;border-left:1px solid #ffffff55}.stat strong{display:block;font-size:31px;line-height:1.2;font-family:'Noto Serif JP',serif}.stat span{font-size:12px}.symptoms{background:var(--paper)}.symptom-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:40px;border-top:1px solid #ddd;border-left:1px solid #ddd}.symptom{background:#fff;border-right:1px solid #ddd;border-bottom:1px solid #ddd;padding:27px 20px;min-height:145px}.symptom b{display:block;font:700 19px 'Noto Serif JP',serif}.symptom i{color:var(--red);font-style:normal;font-size:24px;display:block}.diagnose{display:grid;grid-template-columns:1fr 1fr;gap:78px;align-items:center}.diag-art{background:#161616;color:#fff;min-height:460px;position:relative;padding:36px;overflow:hidden}.house{height:295px;position:absolute;bottom:0;left:12%;width:76%;border:4px solid #fff;border-top:0;clip-path:polygon(50% 0,100% 32%,100% 100%,0 100%,0 32%)}.dot{position:absolute;width:15px;height:15px;border:3px solid var(--red);background:#fff;border-radius:50%}.dot:after{content:attr(data-label);position:absolute;top:-25px;left:12px;white-space:nowrap;font-size:11px;color:#fff;font-style:normal}.dot.a{top:31%;left:46%}.dot.b{top:55%;left:23%}.dot.c{bottom:15%;right:18%}.reason{border-top:1px solid #ccc;padding:18px 0}.reason b{font-size:18px}.redline{height:5px;background:var(--red);width:80px;margin:20px 0}.case{background:#111;color:#fff}.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.case figure{margin:0;position:relative}.case figcaption{font-size:12px;padding-top:9px}.case .label{position:absolute;top:12px;left:12px;background:var(--red);padding:4px 10px;font-size:11px;font-weight:bold}.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;counter-reset:flow}.flow-item{counter-increment:flow;border-top:3px solid var(--red);padding:15px 5px}.flow-item:before{content:'0' counter(flow);font:700 35px 'Noto Serif JP';color:#d7d7d7}.flow-item b{display:block}.compare{background:var(--paper)}.compare-box{border-left:5px solid var(--red);background:#fff;padding:28px}.faq{border-top:1px solid #d5d5d5}.faq details{border-bottom:1px solid #d5d5d5;padding:17px 0}.faq summary{cursor:pointer;font-weight:700;list-style:none}.faq summary:before{content:'Q';color:var(--red);font-size:18px;margin-right:12px}.faq p{padding:14px 0 0 31px;margin:0;color:#555}.line-panel{background:var(--deep);color:white;text-align:center;padding:85px 24px;position:relative;overflow:hidden}.line-panel:before{content:'';position:absolute;border:1px solid #ffffff35;width:520px;height:520px;border-radius:50%;left:-220px;top:-290px}.line-panel h2{font:900 clamp(27px,4vw,46px)/1.35 'Noto Serif JP';margin:0 0 15px;position:relative}.line-panel p{position:relative}.line-panel .cta{position:relative;min-width:min(100%,390px)}.micro{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;font-size:12px;margin-top:18px;position:relative}.footer{background:#111;color:white;padding:55px 0 90px}.footer-grid{display:flex;justify-content:space-between;gap:30px}.footer address{font-style:normal;font-size:13px;color:#ddd}.footer a{color:#fff}.mobile-cta{display:none}.leakmap{background:#f1f1f1;padding:50px 0}.leak-visual{height:390px;background:#16202a;position:relative;color:white;overflow:hidden}.leak-visual .roof{position:absolute;width:78%;height:210px;background:#283a49;clip-path:polygon(50% 0,100% 56%,100% 100%,0 100%,0 56%);left:11%;top:45px}.leak-visual .room{position:absolute;left:28%;top:212px;width:45%;height:152px;border:3px solid #fff;border-top:0}.waterpath{position:absolute;left:52%;top:90px;height:195px;border-left:4px dashed #4da3ff;transform:rotate(18deg)}.waterpath:after{content:'侵入口と濡れた場所が\A 離れている場合があります';white-space:pre;position:absolute;top:80px;left:20px;font-size:12px;color:#b9dfff}.leak-points{position:absolute;top:23%;right:15%;font-size:12px;background:var(--red);padding:6px 10px}.checks{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.check{border:1px solid #ddd;padding:20px;background:#fff}.check b{display:block;color:var(--red);font:700 26px 'Noto Serif JP'}.caution{font-size:12px;color:#666}.hidden{display:none}
@media(max-width:760px){body{padding-bottom:68px}.wrap{padding:0 18px}.topbar{font-size:10px}.nav{height:62px}.brand{font-size:17px}.nav-actions .tel,.nav-actions .cta{display:none}.hero{min-height:635px}.hero-photo{inset:0;background:linear-gradient(90deg,#111e,#1119),var(--hero) center/cover}.hero:after{top:61%;width:130vw;left:-30%}.hero .wrap{padding-top:67px}.hero h1{font-size:38px}.hero-copy{font-size:14px}.hero .cta{display:none}.hero .notes{margin-top:17px}.badges{margin:21px 0}.section{padding:66px 0}.section h2{font-size:29px}.stats{grid-template-columns:repeat(3,1fr)}.stat{padding:4px 9px}.stat strong{font-size:22px}.stat span{font-size:10px}.symptom-grid{grid-template-columns:1fr 1fr}.symptom{min-height:120px;padding:17px 13px}.symptom b{font-size:16px}.diagnose{grid-template-columns:1fr;gap:28px}.diag-art{min-height:350px}.case-grid,.checks{grid-template-columns:1fr}.flow{grid-template-columns:1fr 1fr}.flow-item{padding:10px}.footer-grid{display:block}.footer-grid>*+*{margin-top:25px}.mobile-cta{height:68px;display:grid;grid-template-columns:1fr 100px;position:fixed;z-index:20;bottom:0;left:0;right:0;box-shadow:0 -4px 20px #0003}.mobile-cta a{display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;font-size:13px;font-weight:900}.mobile-cta .line{background:var(--line)}.mobile-cta .phone{background:#222}.line-panel{padding:67px 18px}.leak-visual{height:320px}.leak-visual .room{left:20%;width:58%}.leak-points{right:5%}}
body[data-lp="gaiheki"] .hero-photo{background-image:linear-gradient(90deg,#111 0%,#1112 28%,#1112),url('assets/service-wall.webp')}body[data-lp="gaiheki"] .case img[src$="crest-before.jpg"]{content:url('assets/crest-before.webp')}body[data-lp="gaiheki"] .case img[src$="crest-after.jpg"]{content:url('assets/crest-after.webp')}@media(max-width:760px){body[data-lp="gaiheki"] .hero-photo{background-image:linear-gradient(90deg,#111e,#1119),url('assets/service-wall.webp')}}
.brand:before{content:'';display:inline-block;width:42px;height:29px;margin-right:8px;vertical-align:middle;background:url('assets/kaori-mark.png') center/contain no-repeat}body[data-lp="amamori"] .hero-photo{background-image:linear-gradient(90deg,#111 0%,#1112 28%,#1112),url('assets/rain-inspection.webp')}@media(max-width:760px){body[data-lp="amamori"] .hero-photo{background-image:linear-gradient(90deg,#111e,#1119),url('assets/rain-inspection.webp')}}
/* Readability: use one clear Gothic family throughout. */
.hero h1,.section h2,.line-panel h2,.stat strong,.symptom b,.flow-item:before,.check b{font-family:'Noto Sans JP',sans-serif!important;font-style:normal}
/* Rain-leak page: a darker, rain-soaked visual language distinct from exterior painting. */
body[data-lp="amamori"] .hero{background:#07131e}
body[data-lp="amamori"] .hero-photo{inset:0;background-image:radial-gradient(ellipse 9px 15px at 73% 22%,#e5f8ffcc 0 28%,#8dc4df70 32%,transparent 65%),radial-gradient(ellipse 6px 10px at 84% 44%,#e5f8ffb8 0 27%,#8dc4df60 31%,transparent 66%),radial-gradient(ellipse 12px 19px at 91% 18%,#e5f8ffb5 0 25%,#8dc4df65 30%,transparent 65%),radial-gradient(ellipse 7px 12px at 62% 67%,#e5f8ffab 0 27%,#8dc4df65 32%,transparent 67%),linear-gradient(90deg,#07131ef5 0%,#07131ea8 48%,#07131e42),url('assets/rain-inspection.webp');background-position:center;background-size:cover;opacity:1}
body[data-lp="amamori"] .hero:before{content:'';position:absolute;inset:0;background-image:radial-gradient(ellipse 5px 11px at 12% 8%,#dff6ff9c 0 27%,#a7d4e955 31%,transparent 67%),radial-gradient(ellipse 8px 16px at 39% 20%,#e8f9ffb0 0 25%,#8bc3dc50 29%,transparent 66%),radial-gradient(ellipse 5px 10px at 66% 5%,#e8f9ffa3 0 27%,#8bc3dc50 31%,transparent 67%),radial-gradient(ellipse 7px 14px at 92% 30%,#e8f9ffaa 0 26%,#8bc3dc55 30%,transparent 67%);background-size:210px 240px,310px 320px,260px 285px,360px 370px;background-repeat:repeat;animation:droplets-fall 5.5s linear infinite;pointer-events:none;z-index:1}
body[data-lp="amamori"] .hero:after{background:#4b9ccc;height:8px;transform:rotate(-9deg);top:58%}
body[data-lp="amamori"] .hero .wrap{z-index:2}
body[data-lp="amamori"] .statband{background:#173e58}
body[data-lp="amamori"] .leakmap{background:linear-gradient(135deg,#e9f4fa,#f7f7f7)}
body[data-lp="amamori"] .leak-visual{box-shadow:inset 0 -70px 80px #0008,0 20px 45px #173e5830}
body[data-lp="amamori"] .leak-visual:before{content:'RAIN LEAK';position:absolute;right:22px;bottom:16px;font-size:42px;font-weight:900;letter-spacing:.06em;color:#fff2;z-index:2}
body[data-lp="amamori"] .waterpath{border-color:#72c8ff;filter:drop-shadow(0 0 7px #51b9ff)}
body[data-lp="amamori"] .leak-points{background:#287eae}
body[data-lp="amamori"] .line-panel{background:linear-gradient(135deg,#12344a,#07131e)}
@keyframes droplets-fall{from{background-position:0 -240px,0 -320px,0 -285px,0 -370px}to{background-position:0 240px,0 320px,0 285px,0 370px}}
@media(max-width:760px){body[data-lp="amamori"] .hero-photo{background-image:radial-gradient(ellipse 8px 13px at 78% 20%,#e5f8ffd1 0 28%,#8dc4df70 32%,transparent 66%),radial-gradient(ellipse 6px 10px at 87% 48%,#e5f8ffb8 0 27%,#8dc4df60 31%,transparent 66%),radial-gradient(ellipse 11px 18px at 92% 29%,#e5f8ffb5 0 25%,#8dc4df65 30%,transparent 65%),linear-gradient(90deg,#07131ee8,#07131e8c),url('assets/rain-inspection.webp')}body[data-lp="amamori"] .hero:before{animation-duration:6.5s}}
/* Ad-entry treatment: the first screen answers what, why now, and how to consult. */
.hero .wrap:before{content:'写真1枚から\A 無料相談';white-space:pre;position:absolute;right:8%;top:55px;width:106px;height:106px;border-radius:50%;display:flex;align-items:center;justify-content:center;text-align:center;background:var(--red);color:#fff;font-size:14px;font-weight:900;line-height:1.45;box-shadow:0 10px 28px #0007;transform:rotate(8deg);z-index:3}
.hero h1{max-width:790px;text-shadow:0 3px 18px #0008}.hero .eyebrow{display:inline-block;background:var(--red);color:#fff;padding:5px 11px;letter-spacing:.12em}.hero .badges{max-width:720px}.hero .badges span{background:#0005;backdrop-filter:blur(4px)}.hero .cta{border:2px solid #fff;box-shadow:0 12px 0 #037e35,0 18px 35px #0007;font-size:17px}.hero .cta:hover{transform:translateY(2px);box-shadow:0 8px 0 #037e35,0 14px 28px #0007}.hero .notes{font-weight:700}.mobile-cta .line{position:relative}.mobile-cta .line:before{content:'写真OK';font-size:9px;border:1px solid #ffffff90;border-radius:10px;padding:1px 5px;margin-right:5px}@media(max-width:760px){.hero .wrap:before{right:18px;top:29px;width:80px;height:80px;font-size:11px}.hero .eyebrow{margin-top:72px;font-size:10px}.hero h1{font-size:36px;line-height:1.28}.hero .badges{gap:5px}.hero .badges span{font-size:10px;padding:4px 7px}}
body[data-lp="amamori"] .leak-visual .roof:after{content:'';position:absolute;inset:18% 11% 8%;background:radial-gradient(ellipse 5px 10px at 18% 5%,#b9e9ffcf 0 28%,transparent 68%),radial-gradient(ellipse 7px 13px at 53% 34%,#d7f4ffbd 0 28%,transparent 68%),radial-gradient(ellipse 5px 9px at 82% 7%,#b9e9ffcf 0 28%,transparent 68%);background-size:100% 100%;animation:roof-droplets 3.8s ease-in infinite;filter:drop-shadow(0 0 5px #63c4ff);opacity:0}.leak-visual .roof{overflow:hidden}@keyframes roof-droplets{0%{transform:translate(-12px,-22px);opacity:0}15%{opacity:.9}72%{opacity:.72}100%{transform:translate(22px,92px);opacity:0}}@media(prefers-reduced-motion:reduce){body[data-lp="amamori"] .hero:before,body[data-lp="amamori"] .leak-visual .roof:after{animation:none}}
body[data-lp="gaiheki"] .diag-art .dot{animation:diagnostic-pulse 2.8s ease-in-out infinite;box-shadow:0 0 0 0 #db182099}body[data-lp="gaiheki"] .diag-art .dot.b{animation-delay:.7s}body[data-lp="gaiheki"] .diag-art .dot.c{animation-delay:1.4s}@keyframes diagnostic-pulse{0%,100%{transform:scale(1);box-shadow:0 0 0 0 #db182099}45%{transform:scale(1.18);box-shadow:0 0 0 11px #db182000}55%{transform:scale(1.18);box-shadow:0 0 0 11px #db182000}}@media(prefers-reduced-motion:reduce){body[data-lp="gaiheki"] .diag-art .dot{animation:none}}
body[data-lp="gaiheki"] .hero-photo{animation:exterior-photo-breathe 9s ease-in-out infinite;transform-origin:72% center}@keyframes exterior-photo-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.055)}}@media(prefers-reduced-motion:reduce){body[data-lp="gaiheki"] .hero-photo{animation:none}}
/* Mobile ad creative: generated portrait artwork is the first-view background;
   copy remains live HTML for accessibility, SEO and future campaign changes. */
@media(max-width:760px){
  .hero{min-height:calc(100svh - 94px)}
  .hero:after{display:none}
  .hero .wrap{min-height:calc(100svh - 94px);display:flex;flex-direction:column;justify-content:flex-end;padding-top:72px;padding-bottom:54px}
  .hero h1{font-size:clamp(34px,9.5vw,43px);letter-spacing:.02em;margin-bottom:14px}
  .hero-copy{max-width:31em;margin-bottom:0;font-weight:700;line-height:1.7}
  .hero .badges{margin:16px 0 0;max-width:340px}
  .hero .notes{display:none}
  .hero .wrap:before{top:22px;right:17px}
  body[data-lp="gaiheki"] .hero-photo{inset:0;background-image:linear-gradient(180deg,#07131e92 0%,#07131e22 35%,#07131ec9 100%),linear-gradient(90deg,#07131e80 0%,transparent 72%),url('assets/hero-gaiheki-mobile-v1.png');background-position:center;background-size:cover;opacity:1;animation:none;transform:none}
  body[data-lp="amamori"] .hero-photo{inset:0;background-image:linear-gradient(180deg,#07131e80 0%,#07131e16 32%,#07131edb 100%),linear-gradient(90deg,#07131e82 0%,transparent 72%),url('assets/hero-amamori-mobile-v1.png');background-position:center;background-size:cover;opacity:1}
}

/* The mobile first view is a finished ad creative (headline, proof and CTA
   are intentionally part of the artwork), following the GSO LP treatment. */
@media(max-width:760px){
  .hero{min-height:0;aspect-ratio:9 / 16}
  .hero .wrap{display:none}
  .hero-photo{inset:0!important;background-position:center!important;background-size:100% 100%!important;opacity:1!important;transform:none!important;animation:none!important}
  body[data-lp="amamori"] .hero-photo{background-image:url('assets/hero-amamori-mobile-ad-v5.png')!important}
  body[data-lp="gaiheki"] .hero-photo{background-image:url('assets/hero-gaiheki-mobile-ad-v5.png')!important}
  body[data-lp="amamori"] .hero:before{display:none}
}

/* Native image treatment: this guarantees that the finished ad creative is
   rendered as an image, rather than relying on a CSS background swap. */
.mobile-ad-hero{display:none}
@media(max-width:1180px){
  .hero{min-height:0!important;aspect-ratio:9 / 16;background:#fff!important}
  .mobile-ad-hero{display:block!important;width:100%;height:100%;object-fit:fill;position:relative;z-index:3}
  .hero>.hero-photo,.hero>.wrap,.hero:after,body[data-lp="amamori"] .hero:before{display:none!important}
}
body.force-mobile-ad .hero{min-height:0!important;aspect-ratio:9 / 16;background:#fff!important}
body.force-mobile-ad .mobile-ad-hero{display:block!important;width:100%;height:100%;object-fit:fill;position:relative;z-index:3}
body.force-mobile-ad .hero>.hero-photo,body.force-mobile-ad .hero>.wrap,body.force-mobile-ad .hero:after,body.force-mobile-ad[data-lp="amamori"] .hero:before{display:none!important}

/* Mobile diagnostic animation: turn the abstract house outline into an
   understandable inspection map rather than a decorative empty frame. */
@media(max-width:760px){
  body[data-lp="gaiheki"] .diag-art{min-height:430px;padding:28px 22px;background:radial-gradient(circle at 72% 20%,#243647 0,transparent 32%),#101820}
  body[data-lp="gaiheki"] .diag-art h2{font-size:25px!important;margin-bottom:0}
  body[data-lp="gaiheki"] .diag-art:after{content:'赤いポイントを順に確認します';position:absolute;left:28px;bottom:20px;color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em}
  body[data-lp="gaiheki"] .house{height:224px;width:82%;left:9%;bottom:62px;border:2px solid #dbe8ee;border-top:0;background:linear-gradient(145deg,#405260 0%,#1d2b35 100%);clip-path:polygon(50% 0,100% 32%,100% 100%,0 100%,0 32%);box-shadow:0 20px 30px #0007}
  body[data-lp="gaiheki"] .house:before{content:'';position:absolute;inset:30% 19% 0;border:2px solid #9fb1bc;border-bottom:0;background:repeating-linear-gradient(90deg,transparent 0 28px,#70828d 29px 31px),repeating-linear-gradient(0deg,transparent 0 27px,#70828d 28px 30px);opacity:.8}
  body[data-lp="gaiheki"] .house:after{content:'';position:absolute;left:0;right:0;top:14%;height:3px;background:#ff3941;box-shadow:0 0 14px #ff3941;animation:kaori-inspection-scan 3.6s ease-in-out infinite}
  body[data-lp="gaiheki"] .diag-art .dot{display:block!important;width:19px;height:19px;border:4px solid #fff;background:#e8202a;box-shadow:0 0 0 0 #e8202a;z-index:3;animation:kaori-inspection-point 3.6s ease-in-out infinite}
  body[data-lp="gaiheki"] .diag-art .dot:after{top:-31px;left:15px;padding:3px 7px;border-radius:3px;background:#e8202a;color:#fff;font-size:11px;font-weight:900;line-height:1.25;box-shadow:0 4px 12px #0006}
  body[data-lp="gaiheki"] .diag-art .dot.a{top:39%;left:47%;animation-delay:0s}
  body[data-lp="gaiheki"] .diag-art .dot.b{top:62%;left:21%;animation-delay:1.2s}
  body[data-lp="gaiheki"] .diag-art .dot.c{bottom:20%;right:18%;animation-delay:2.4s}
}
@keyframes kaori-inspection-scan{0%,12%{transform:translateY(0);opacity:.25}50%{transform:translateY(132px);opacity:1}100%{transform:translateY(0);opacity:.25}}
@keyframes kaori-inspection-point{0%,20%,100%{transform:scale(1);box-shadow:0 0 0 0 #e8202a}10%{transform:scale(1.28);box-shadow:0 0 0 13px #e8202a00}30%{transform:scale(1);box-shadow:0 0 0 0 #e8202a}50%{transform:scale(1);box-shadow:0 0 0 0 #e8202a}}
@media(prefers-reduced-motion:reduce){body[data-lp="gaiheki"] .house:after,body[data-lp="gaiheki"] .diag-art .dot{animation:none!important}}