:root{--ink:#00214b;--muted:#65708a;--line:#e3e8f2;--soft:#f5f7fc;--blue:#005dfd;--blue-light:#028afd;--green:#3fdca1;--green-deep:#02a2a1;--radius:18px;--shadow:0 14px 40px #1e2a441a}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:#fff;margin:0;font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,sans-serif;line-height:1.75}a{color:inherit;text-decoration:none}ul{margin:0;padding:0;list-style:none}img,svg{display:block}.wrap{width:min(1120px,100% - 40px);margin:0 auto}section{padding:88px 0}.alt{background:var(--soft)}h2{letter-spacing:.01em;margin:0 0 10px;font-size:clamp(26px,3.2vw,34px);line-height:1.35}.sub{color:var(--muted);margin:0 0 40px;font-size:16px}.center{text-align:center}.btn{border:1.5px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:14px 26px;font-weight:700;transition:transform .12s;display:inline-flex}.btn:active{transform:scale(.98)}.btn-main{background:var(--blue);color:#fff}.btn-line{border-color:var(--blue);color:var(--blue);background:#fff}.btn-white{color:var(--blue);background:#fff}.btn:focus-visible{outline:3px solid var(--blue-light);outline-offset:2px}header{z-index:20;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);background:#ffffffeb;position:sticky;top:0}.hd{justify-content:space-between;align-items:center;gap:24px;height:68px;display:flex}.brand{color:var(--blue);align-items:center;gap:10px;font-size:20px;font-weight:800;display:flex}.brand .m{background:linear-gradient(135deg,var(--blue),var(--green));color:#fff;border-radius:9px;place-items:center;width:34px;height:34px;font-size:18px;display:grid}nav ul{color:var(--muted);gap:26px;font-size:14px;font-weight:600;display:flex}nav a:hover{color:var(--ink)}.hd .btn{padding:10px 20px;font-size:14px}@media (max-width:760px){nav{display:none}}.hero{background:radial-gradient(circle at 62% 30%,#028afd29 0 15%,#0000 16%),radial-gradient(circle at 78% 72%,#3fdca12e 0 20%,#0000 21%),radial-gradient(circle at 48% 78%,#028afd1f 0 12%,#0000 13%),linear-gradient(160deg,#028afd12 0%,#fff 55%,#3fdca117 100%);padding:88px 0 96px;position:relative;overflow:hidden}.hero-g{grid-template-columns:1fr 1fr;align-items:center;gap:32px;display:grid}h1{letter-spacing:-.01em;color:var(--ink);margin:0 0 18px;font-size:clamp(34px,4.6vw,52px);font-weight:900;line-height:1.28}h1 .em{color:var(--green-deep)}.lead{color:#3d4a6b;margin:0 0 30px;font-size:17px;font-weight:500}.cta{flex-wrap:wrap;gap:12px;display:flex}.hero-note{color:var(--muted);margin-top:18px;font-size:13px}.visual{height:560px;position:relative}.phone{background:linear-gradient(140deg,#0d0f17,#2a2f3d 45%,#858b99 48%,#171922 54%,#05060a 100%);border-radius:44px;width:272px;height:540px;padding:10px;position:absolute;top:20px;left:0;transform:rotate(4deg);box-shadow:0 34px 70px #00214b3d,0 12px 22px #0000002e}.phone:before{content:"";pointer-events:none;border:1px solid #ffffff73;border-radius:40px;position:absolute;inset:4px}.screen{text-align:center;background:#fff;border-radius:36px;flex-direction:column;align-items:center;height:100%;padding:64px 18px 22px;display:flex;position:relative;overflow:hidden}.screen-top{background:linear-gradient(#16336c,#173770);height:48px;position:absolute;top:0;left:0;right:0}.notch{z-index:2;background:#05060a;border-radius:0 0 18px 18px;width:96px;height:26px;position:absolute;top:0;left:50%;transform:translate(-50%)}.st{color:#fff;z-index:3;font-size:12px;font-weight:700;position:absolute;top:8px}.st.l{left:22px}.st.r{font-size:10px;right:20px}.avatar{background:radial-gradient(circle at 50% 34%,#f0bd99 0 21%,#0000 22%),radial-gradient(circle,#1a1a22 0 30%,#0000 31%),#dfe3ee;border:6px solid #eef0f6;border-radius:50%;width:74px;height:74px;margin:10px auto 12px}.nm{color:var(--ink);letter-spacing:.02em;font-size:22px;font-weight:900}.en{color:var(--blue);margin-top:2px;font-size:13px;font-weight:800}.role{color:#6d75a0;margin-top:4px;font-size:12.5px;font-weight:700}.qr{background-color:#0000;background-image:linear-gradient(90deg,#111 12%,#0000 12% 19%,#111 19% 28%,#0000 28% 35%,#111 35% 47%,#0000 47% 58%,#111 58% 68%,#0000 68% 77%,#111 77% 100%),linear-gradient(#111 12%,#0000 12% 19%,#111 19% 28%,#0000 28% 35%,#111 35% 47%,#0000 47% 58%,#111 58% 68%,#0000 68% 77%,#111 77% 100%);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:24px 24px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;border:8px solid #fff;outline:1.5px solid #111;width:132px;height:132px;margin:22px auto 0}.brandtxt{color:var(--ink);letter-spacing:-.04em;margin-top:auto;font-size:24px;font-weight:900}.catch{color:var(--ink);letter-spacing:-.02em;text-align:left;transform-origin:0 0;font-size:22px;font-weight:900;line-height:1.35;position:absolute;top:0;right:0;transform:rotate(-4deg)}.catch:after{content:"";background:var(--ink);width:22px;height:2px;position:absolute;bottom:-14px;left:-2px;transform:rotate(60deg)}.links{gap:14px;width:250px;display:grid;position:absolute;top:118px;right:0}.item{grid-template-columns:62px 1fr;align-items:center;column-gap:14px;display:grid}.icon{color:#fff;border-radius:18px;place-items:center;width:62px;height:62px;display:grid;box-shadow:0 10px 22px #00214b24}.icon svg{stroke:currentColor;fill:none;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:30px;height:30px}.label{color:var(--ink);white-space:nowrap;font-size:19px;font-weight:900}.c-tel{background:linear-gradient(135deg,#1ab0ff,#0787ea)}.c-line{letter-spacing:.02em;background:linear-gradient(135deg,#27d47c,#10bc5d);font-size:15px;font-weight:900}.c-ig{background:radial-gradient(circle at 72% 72%,#ffd12f 0 16%,#0000 17%),linear-gradient(135deg,#6b22f5 0%,#d517b9 45%,#ff394e 72%,#ff9b22 100%)}.c-web{background:linear-gradient(135deg,#29aaf6,#0f8fe4)}.c-shop{background:linear-gradient(135deg,#ff2c82,#ff0a67)}.wires{pointer-events:none;position:absolute;inset:0}.wires path{fill:none;stroke-width:2.5px;stroke-linecap:round}@media (max-width:900px){.visual{grid-template-columns:1fr;justify-items:center;gap:20px;height:auto;display:grid}.phone{width:250px;height:500px;position:static;transform:none}.catch{text-align:center;margin-top:6px;position:static;transform:none}.catch:after{display:none}.links{width:min(320px,100%);position:static}.wires{display:none}}.prob-top{grid-template-columns:1.1fr .9fr;align-items:center;gap:32px;margin-bottom:34px;display:grid}.prob-top h2{color:var(--ink);font-size:clamp(26px,3.4vw,36px);font-weight:900}.prob-lead{color:#3d4a6b;margin:0;font-size:16.5px;line-height:1.9}.prob-lead b{color:var(--blue);font-weight:700}.figure{height:300px;position:relative}.figure .disc{background:radial-gradient(circle at 40% 35%,#e4ecff,#cfe0ff);border-radius:50%;width:280px;height:280px;position:absolute;top:6%;right:8%}.figure .person{width:230px;height:250px;position:absolute;bottom:0;right:16%}.figure .person svg{width:100%;height:100%}.figure .scribble{width:56px;height:56px;position:absolute;top:14%;right:4%}.figure .scribble svg{width:100%;height:100%;stroke:var(--blue);fill:none;stroke-width:2px;stroke-linecap:round}.figure img{object-fit:contain;object-position:right bottom;width:100%;height:100%;position:absolute;inset:0}.grid4{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.pcard{border:1px solid var(--line);color:#1e2a44;background:#fff;border-radius:18px;padding:26px 20px 24px;font-size:15px;font-weight:600;line-height:1.75;box-shadow:0 8px 26px #1e2a440f}.pcard i{color:#fff;border-radius:15px;place-items:center;width:52px;height:52px;margin-bottom:16px;display:grid;box-shadow:0 8px 18px #1e2a441f}.pcard i svg{stroke:currentColor;fill:none;stroke-width:2.1px;stroke-linecap:round;stroke-linejoin:round;width:26px;height:26px}.i-card{background:linear-gradient(135deg,#ff5a8f,#ff1f6e)}.i-line{background:linear-gradient(135deg,#27d47c,#10bc5d)}.i-web{background:linear-gradient(135deg,#ffb04d,#ff8a00)}.i-shop{background:linear-gradient(135deg,#ff2c82,#ff0a67)}@media (max-width:900px){.prob-top{grid-template-columns:1fr}.figure{height:240px}.figure .disc{width:220px;height:220px}.figure .person{width:180px;height:200px}}.sol{grid-template-columns:1fr 300px 1fr;align-items:center;gap:28px;display:grid}.sol ul{gap:14px;display:grid}.sol li{border:1px solid var(--line);background:#fff;border-radius:14px;align-items:center;gap:12px;padding:12px 14px;display:flex}.sol li i{width:40px;height:40px;color:var(--green-deep);background:#3fdca12e;border-radius:12px;flex:none;place-items:center;display:grid}.sol li i svg{stroke:currentColor;fill:none;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.sol li b{font-size:15px;display:block}.sol li span{color:var(--muted);font-size:12.5px}.mini{width:230px;box-shadow:var(--shadow);background:#111827;border-radius:36px;margin:0 auto;padding:10px}.mini .sc{text-align:center;background:#fff;border-radius:28px;padding:22px 16px}.mini .av{background:linear-gradient(135deg,var(--blue),var(--green));border-radius:50%;width:56px;height:56px;margin:4px auto 10px}.mini b{font-size:16px;display:block}.mini small{color:var(--muted);margin-bottom:12px;font-size:12px;display:block}.mini .q{outline:1px solid var(--line);background:linear-gradient(90deg,var(--ink) 50%,transparent 50%) 0 0/14px 14px,linear-gradient(var(--ink) 50%,transparent 50%) 7px 7px/14px 14px,#fff;border:5px solid #fff;border-radius:8px;width:104px;height:104px;margin:0 auto}.sol .shop i{color:var(--green-deep);background:#3fdca14d}.steps{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.step{border:1px solid var(--line);border-radius:var(--radius);text-align:center;background:#fff;padding:30px 24px}.step .n{background:var(--blue);color:#fff;border-radius:50%;place-items:center;width:38px;height:38px;margin:0 auto 14px;font-weight:700;display:grid}.step h3{margin:0 0 6px;font-size:18px}.step p{color:var(--muted);margin:0;font-size:14px}.scene{grid-template-columns:1fr 1fr;gap:24px;display:grid}.scard{border:1px solid var(--line);border-radius:var(--radius);background:#fff;padding:32px}.tag{color:#fff;background:var(--blue);border-radius:999px;margin-bottom:12px;padding:4px 12px;font-size:12px;font-weight:700;display:inline-block}.tag.shop{background:var(--green);color:var(--ink)}.scard h3{margin:0 0 10px;font-size:20px}.scard li{padding:4px 0 4px 20px;font-size:15px;position:relative}.scard li:before{content:"";background:var(--green);border-radius:50%;width:9px;height:9px;position:absolute;top:13px;left:0}.scard p{color:var(--muted);margin:14px 0 0;font-size:14px}.feat{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}.fcard{border:1px solid var(--line);text-align:center;background:#fff;border-radius:14px;padding:20px 16px}.fcard i{width:44px;height:44px;color:var(--blue);background:#028afd1a;border-radius:12px;place-items:center;margin:0 auto 10px;display:grid}.fcard i svg{stroke:currentColor;fill:none;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.fcard b{font-size:14.5px;display:block}.fcard span{color:var(--muted);font-size:12px}.fcard.shop i{color:var(--green-deep);background:#3fdca138}.journey{grid-template-columns:repeat(4,1fr);gap:0;display:grid;position:relative}.journey:before{content:"";background:linear-gradient(90deg,var(--blue),var(--green));height:2px;position:absolute;top:36px;left:12%;right:12%}.j{text-align:center;position:relative}.j i{border:2px solid var(--blue);width:72px;height:72px;color:var(--blue);background:#fff;border-radius:50%;place-items:center;margin:0 auto 12px;display:grid;position:relative}.j.on i{border-color:var(--green);color:var(--green-deep)}.j i svg{stroke:currentColor;fill:none;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:30px;height:30px}.j b{font-size:16px;display:block}.j span{color:var(--muted);font-size:13px}.prices{grid-template-columns:repeat(3,1fr);align-items:stretch;gap:22px;display:grid}.price{border:1px solid var(--line);border-radius:var(--radius);text-align:center;background:#fff;flex-direction:column;padding:34px 26px;display:flex}.price.reco{border-color:var(--green);box-shadow:var(--shadow);position:relative}.price.reco:after{content:"おすすめ";background:var(--green);color:var(--ink);border-radius:999px;padding:4px 12px;font-size:12px;font-weight:700;position:absolute;top:-13px;left:50%;transform:translate(-50%)}.price h3{color:var(--muted);letter-spacing:.06em;margin:0;font-size:15px}.yen{margin:8px 0 2px;font-size:38px;font-weight:800}.yen small{color:var(--muted);font-size:14px;font-weight:400}.price .for{color:var(--muted);margin:0 0 18px;font-size:13.5px}.price ul{text-align:left;gap:6px;margin-bottom:22px;font-size:14px;display:grid}.price li{padding-left:20px;position:relative}.price li:before{content:"✓";color:var(--green-deep);font-weight:700;position:absolute;left:0}.price .btn{margin-top:auto}.price-note{color:var(--muted);margin:18px 0 0;font-size:12.5px}.faq{max-width:760px;margin:0 auto}.faq details{border:1px solid var(--line);background:#fff;border-radius:14px;margin-bottom:10px;padding:0 20px}.faq summary{cursor:pointer;justify-content:space-between;align-items:center;padding:16px 0;font-weight:700;list-style:none;display:flex}.faq summary:after{content:"＋";color:var(--blue);font-weight:400}.faq details[open] summary:after{content:"－"}.faq p{color:var(--muted);margin:0 0 16px;font-size:14.5px}.banner{background:linear-gradient(135deg,var(--blue) 0%,var(--blue-light) 52%,var(--green) 100%);color:#fff;border-radius:26px;grid-template-columns:1.2fr .8fr;align-items:center;gap:32px;padding:56px 40px;display:grid}.banner h2{color:#fff}.banner p{opacity:.92;margin:0 0 26px}.banner .mini{width:200px;box-shadow:0 20px 50px #00000040}footer{border-top:1px solid var(--line);color:var(--muted);padding:40px 0 28px;font-size:13px}.ft{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.ft ul{flex-wrap:wrap;gap:20px;display:flex}.ft .brand{font-size:18px}.ft small{margin-top:6px;display:block}.copy{border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:22px;padding-top:16px;display:flex}@media (max-width:900px){.hero-g,.sol,.scene,.banner{grid-template-columns:1fr}.grid4,.feat{grid-template-columns:1fr 1fr}.steps,.prices{grid-template-columns:1fr}.journey{grid-template-columns:1fr 1fr;gap:24px}.journey:before{display:none}.sol .mini{order:-1}section{padding:64px 0}}
