@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700;800;900&display=swap');
:root{--blue:#0652ef;--ink:#142334;--line:#dbe2e8;--muted:#52606e}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;color:var(--ink);background:#fff;font-family:'Noto Sans JP',sans-serif;font-size:16px;line-height:1.85}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a,button,summary{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #faab30;outline-offset:6px}img{display:block;max-width:100%}h1,h2,h3,p{margin:0}h2{font-size:clamp(2rem,3.4vw,3.3rem);line-height:1.65;letter-spacing:.025em}h3{line-height:1.6}header{height:104px;padding:0 4.5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf0f3;background:#fff;position:relative;z-index:10}.brand{width:255px;overflow:hidden;height:60px;display:flex;align-items:center}.brand img{filter:invert(1);mix-blend-mode:multiply;width:300px;max-width:none;margin-left:-26px}nav{display:flex;align-items:center;gap:30px}nav a{font-size:14px;font-weight:700;line-height:1.7}nav a>span{display:block;font-family:Arial,sans-serif;font-size:10px;letter-spacing:.12em;color:#82909d}nav a:hover{color:var(--blue)}nav .nav-contact{background:var(--blue);color:white;display:flex;gap:28px;align-items:center;padding:17px 25px}nav .nav-contact span{color:white;font-size:22px}.menu-toggle{display:none}.hero{position:relative;min-height:720px;overflow:hidden;padding:72px 6% 0}.hero-copy{position:relative;z-index:2;max-width:52%}.eyebrow{font-family:Arial,sans-serif;font-size:12px;font-weight:700;letter-spacing:.17em;line-height:1.5}.hero .eyebrow{color:var(--blue);margin-bottom:24px}h1{font-size:clamp(3rem,5.5vw,5.5rem);line-height:1.4;letter-spacing:.035em;font-weight:900;white-space:nowrap}h1 span{color:var(--blue)}.hero-description{font-size:16px;margin:24px 0 27px;line-height:2}.solid-button{display:inline-flex;gap:48px;align-items:center;justify-content:space-between;background:var(--blue);color:white;padding:16px 24px;font-size:14px;font-weight:700;border:0;transition:background .2s}.solid-button:hover{background:#003dba}.solid-button span{font-size:24px;line-height:1}.hero-visual{position:absolute;right:0;top:32px;width:49%;height:570px;background:#176de1;overflow:hidden;border-radius:100px 0 0 0}.hero-photo{height:100%;width:100%;object-fit:cover}.hero-visual:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#06396788)}.visual-caption{position:absolute;bottom:62px;left:35px;color:white;font-family:Arial,sans-serif;font-size:14px;letter-spacing:.15em;z-index:1;line-height:1.6}.visual-index{position:absolute;right:24px;top:38px;writing-mode:vertical-rl;color:#fff;font-family:Arial,sans-serif;font-size:10px;letter-spacing:.18em}.hero-bottom{display:flex;align-items:center;justify-content:space-between;position:relative;margin-top:44px;width:100%;z-index:2}.hero-word{color:#e5ebf3;font-family:Arial,sans-serif;font-size:clamp(2rem,5.3vw,5rem);font-weight:800;line-height:1.1;letter-spacing:-.04em}.scroll{font:10px Arial,sans-serif;letter-spacing:.1em;display:flex;align-items:center;gap:20px}.scroll span{font-size:23px}.audience-strip{display:grid;grid-template-columns:1fr 1fr;border-block:1px solid var(--line);margin:0 6%}.audience-strip>a{padding:26px 28px;display:grid;grid-template-columns:1fr auto;align-items:center;position:relative;transition:background .2s}.audience-strip>a:hover{background:#f0f5ff}.audience-strip>a:first-child{border-right:1px solid var(--line);padding-left:0}.audience-label{font:11px Arial,sans-serif;letter-spacing:.15em;color:var(--blue);grid-column:1;margin-bottom:4px}.audience-strip strong{font-size:19px}.circle{border:1px solid currentColor;border-radius:50%;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;font-family:Arial,sans-serif;font-size:22px;font-weight:400}.audience-strip .circle{grid-column:2;grid-row:1/3;color:var(--blue)}.section{padding:110px 8%}.section-label>span{font:12px Arial,sans-serif;letter-spacing:.12em;color:var(--blue);font-weight:700}.section-label>p{font-size:15px;margin-top:8px;font-weight:600}.about,.flow,.faq,.company{display:grid;grid-template-columns:30% 70%}.about-content>h2{font-size:clamp(2rem,4vw,3.8rem)}.blue{color:var(--blue)}.about-bottom{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:30px}.about-bottom p{line-height:2.2;font-size:15px}.about-symbol{font:900 170px Arial,sans-serif;color:#e6edfb;position:relative;margin-right:25px}.about-symbol span{position:absolute;right:-25px;top:-25px;color:var(--blue);font-size:90px}.services{background:#f3f6fa}.section-top{display:flex;justify-content:space-between;align-items:flex-end;gap:30px}.section-top h2{margin-top:18px}.section-top>p{font-size:15px;color:var(--muted);margin-bottom:9px}.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:48px}.service-card{background:#fff;padding:40px}.card-top{display:flex;justify-content:space-between;font:12px Arial,sans-serif;letter-spacing:.1em;color:var(--blue)}.card-top span:last-child{font-size:24px;line-height:1;color:#92ace0}.service-card h3{font-size:30px;margin:32px 0 20px}.service-card>p{font-size:15px;color:var(--muted)}.service-card ul{padding:0;list-style:none;margin:25px 0}.service-card li{font-size:14px;padding:9px 0;border-bottom:1px solid var(--line)}.service-card li:before{content:'＋';margin-right:10px;color:var(--blue)}.text-link{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:700;margin-top:30px}.text-link:hover .circle{background:var(--blue);color:white;border-color:var(--blue)}.dark{background:#132b48;color:white}.dark .card-top{color:#a0c3ff}.dark>p{color:#d0d9e3}.dark li{border-color:#3a4c62}.dark li:before{color:#91b6ff}.flow .section-label h2{margin-top:30px}.steps{list-style:none;margin:0;padding:0}.steps li{display:flex;gap:28px;padding:30px 0;border-top:1px solid var(--line)}.steps li:last-child{border-bottom:1px solid var(--line)}.steps li>span{font:34px Arial,sans-serif;color:var(--blue);line-height:1.3}.steps h3{font-size:21px;margin-bottom:10px}.steps p{font-size:15px;color:var(--muted)}.faq{padding-top:10px}.faq-list details{border-bottom:1px solid var(--line)}summary{cursor:pointer;padding:24px 0;display:flex;justify-content:space-between;gap:15px;font-weight:600;font-size:15px;list-style:none}summary::-webkit-details-marker{display:none}summary>span{color:var(--blue);font-size:22px;line-height:1.3}details[open] summary>span{transform:rotate(45deg)}details>p{font-size:15px;color:var(--muted);padding:0 30px 24px 0}.company{background:#f4f6f8}.company-content h2{font-size:30px;margin-bottom:20px}dl{margin:0}dl>div{display:grid;grid-template-columns:130px 1fr;padding:18px 0;border-bottom:1px solid var(--line);font-size:15px}dt{color:var(--muted)}dd{margin:0}.contact{background:var(--blue);color:white;padding-top:65px;padding-bottom:70px}.contact .eyebrow{color:#c2d6ff}.contact-row{display:flex;justify-content:space-between;align-items:center;gap:50px;margin-top:20px}.contact h2{font-size:clamp(2.5rem,4.6vw,4.5rem)}.contact-row>div{width:38%}.contact-row p{font-size:15px}.contact-button{border:0;border-bottom:1px solid #81aaff;background:transparent;color:#fff;display:flex;width:100%;align-items:center;justify-content:space-between;padding:26px 0 14px;margin-top:12px;font-size:23px;font-weight:700}.contact-button:hover{color:#d6e4ff}footer{background:#101c2c;color:white;padding:48px 6% 25px;display:grid;grid-template-columns:260px 1fr auto;align-items:center;gap:25px}.footer-brand{width:250px;overflow:hidden;height:80px;display:flex;align-items:center}.footer-brand img{width:290px;max-width:none;margin-left:-22px;mix-blend-mode:screen}footer>div span{font-size:14px}footer>div p{font-size:12px;color:#a3afbd}.to-top{font:11px Arial,sans-serif;letter-spacing:.12em}footer small{grid-column:1/-1;border-top:1px solid #35404d;padding-top:22px;font:11px Arial,sans-serif;color:#a3afbd}dialog{border:0;padding:55px;max-width:min(90vw,560px);color:var(--ink)}dialog::backdrop{background:#0c1d38aa;backdrop-filter:blur(5px)}dialog h2{font-size:30px;margin:18px 0}dialog p{font-size:15px}dialog .solid-button{margin-top:25px}.close-dialog{position:absolute;right:14px;top:8px;border:0;background:none;font-size:30px;color:var(--ink)}.skip{position:absolute;top:-100px;left:10px;padding:10px;background:white;z-index:100}.skip:focus{top:10px}@media(min-width:1550px){.hero{min-height:850px;padding-top:110px}.hero-visual{height:680px}.hero-bottom{margin-top:70px}header{padding-inline:6%}}
@media(max-width:1100px){header{padding-inline:4%;height:88px}.brand{width:210px}.brand img{width:250px;margin-left:-22px}nav{gap:20px}nav .nav-contact{padding:12px 17px}nav a{font-size:12px}.hero{min-height:650px;padding-top:65px}.hero-visual{height:520px}.hero-description{font-size:14px}.section{padding:85px 6%}.service-card{padding:30px}.service-card h3{font-size:25px}.about-symbol{display:none}.audience-strip strong{font-size:16px}}
@media(max-width:760px){html{scroll-padding-top:25px}header{height:78px;padding:0 6%}.brand{width:210px}.menu-toggle{display:flex;align-items:center;gap:15px;border:0;background:none;color:var(--ink);font:12px Arial,sans-serif;letter-spacing:.1em;padding:12px 0 12px 15px}.menu-toggle span{font-size:25px}nav{display:none;position:absolute;left:0;right:0;top:78px;padding:22px 6%;background:white;box-shadow:0 12px 20px #1232}nav.open{display:grid;gap:0}nav>a{padding:13px 0;font-size:15px;border-bottom:1px solid #e3e9f0}nav .nav-contact{margin-top:15px}nav a>span{font-size:10px}.hero{padding:40px 6% 0;min-height:0;display:flex;flex-direction:column}.hero-copy{max-width:100%}.hero .eyebrow{font-size:10px;margin-bottom:20px}h1{font-size:clamp(2.5rem,9.6vw,4.3rem);line-height:1.45}.hero-description{margin:20px 0;line-height:1.9;font-size:14px}.solid-button{padding:13px 20px}.hero-visual{position:relative;top:auto;right:auto;width:calc(100% + 6.8%);height:310px;margin-top:32px;border-radius:65px 0 0 0}.visual-caption{left:25px;bottom:30px;font-size:11px}.visual-index{font-size:9px}.hero-bottom{margin:22px 0 28px}.hero-word{font-size:8vw}.scroll{font-size:0;gap:0}.scroll span{font-size:25px}.audience-strip{grid-template-columns:1fr}.audience-strip>a{padding:21px 0}.audience-strip>a:first-child{border-right:0;border-bottom:1px solid var(--line)}.audience-strip strong{font-size:16px}.audience-label{font-size:10px}.section{padding:65px 6%}.about,.flow,.faq,.company{grid-template-columns:1fr;gap:30px}.section-label>p{margin-top:4px;font-size:14px}.section-label>span{font-size:11px}.about-content>h2{font-size:29px}.about-bottom{margin-top:25px}.about-bottom p{font-size:14px}.about-bottom p br{display:none}.section-top{display:block}.section-top h2{font-size:29px}.section-top>p{margin-top:22px;font-size:14px}.service-grid{grid-template-columns:1fr;margin-top:30px;gap:18px}.service-card{padding:28px}.service-card h3{font-size:26px}.service-card>p,.service-card li{font-size:14px}.flow .section-label h2{font-size:29px;margin-top:15px}.steps li{gap:20px;padding:24px 0}.steps h3{font-size:18px}.steps p{font-size:14px}.steps li>span{font-size:29px}.faq{padding-top:0}summary{font-size:14px;gap:14px}summary>span{flex-shrink:0}details>p{font-size:14px}.company-content h2{font-size:25px}dl>div{grid-template-columns:100px 1fr;font-size:14px}.contact-row{display:block;margin-top:25px}.contact h2{font-size:39px}.contact-row>div{width:100%;margin-top:25px}.contact .eyebrow{font-size:10px}.contact-button{font-size:21px}.contact-row p{font-size:14px}footer{grid-template-columns:1fr auto;gap:15px;padding:30px 6% 24px}.footer-brand{width:220px;height:66px}.footer-brand img{width:260px}footer>div{grid-row:2}.to-top{grid-column:2;grid-row:2;font-size:9px}footer small{margin-top:16px}dialog{padding:40px 25px}dialog h2{font-size:25px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Motion remains optional: content is visible without JavaScript. */
.hero-line{display:inline-block}.hero-line-first{color:var(--ink)}
@keyframes ugree-enter{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes ugree-photo{from{transform:scale(1.045) translateY(0)}to{transform:scale(1.01) translateY(-3px)}}
.steps li{position:relative}.steps li>span{position:relative;z-index:1;background:white;align-self:flex-start;min-width:44px}
.steps li:not(:last-child)::after{content:"";position:absolute;left:20px;top:76px;bottom:-20px;width:1px;background:var(--line);transform-origin:top}
@media(prefers-reduced-motion:no-preference){
.hero-line-first{animation:ugree-enter .8s cubic-bezier(.2,.7,.2,1) both}.hero-line-second{animation:ugree-enter .8s .18s cubic-bezier(.2,.7,.2,1) both}
.hero-copy>.eyebrow{animation:ugree-enter .7s both}.hero-description{animation:ugree-enter .8s .32s both}.hero-copy>.solid-button{animation:ugree-enter .8s .42s both}.hero-visual{animation:ugree-enter 1s .12s both}
.hero-photo{animation:ugree-photo 4.8s ease-out both}
.motion-reveal{transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}.motion-reveal.is-pending{opacity:0;transform:translateY(24px)}.motion-reveal:focus-within{opacity:1;transform:none}
.steps.motion-steps li:not(:last-child)::after{background:var(--blue);transform:scaleY(0);transition:transform .9s ease}.steps.motion-steps li.step-visible::after{transform:scaleY(1)}
.solid-button,.nav-contact,.contact-button,.circle{transition:background .25s ease,color .25s ease,transform .25s ease}.solid-button span,.nav-contact span{transition:transform .25s ease}
@media(hover:hover){.solid-button:hover span,.nav-contact:hover span{transform:translate(3px,-3px)}.text-link:hover .circle,.contact-button:hover .circle,.audience-strip>a:hover .circle{transform:translate(3px,-3px)}.service-card{transition:transform .3s ease}.service-card:hover{transform:translateY(-4px)}}
.solid-button:focus-visible span,.nav-contact:focus-visible span{transform:translate(3px,-3px)}
}
@media(max-width:760px){.steps li:not(:last-child)::after{left:16px;top:65px;bottom:-16px}.steps li>span{min-width:36px}}
@media(prefers-reduced-motion:reduce){.hero-line,.hero-photo,.hero-visual,.hero-description,.hero-copy>.eyebrow,.hero-copy>.solid-button{animation:none!important}.motion-reveal.is-pending{opacity:1;transform:none}.steps.motion-steps li::after{transform:none!important}}
