.op-feature{--op-blue:#176bc3;--op-deep:#143a5d;--op-ink:#18334f;--op-muted:#5b7185;--op-line:#d9e7f2;--op-pale:#f1f8ff;--op-mint:#eaf8f3;color:var(--op-ink);background:#fff;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif}.op-feature *{box-sizing:border-box}.op-feature .container{width:min(1180px,calc(100% - 48px));margin:0 auto}.op-crumb{border-bottom:1px solid #e6edf4;background:#fff;color:#8495a5;font-size:13px}.op-crumb .container{padding:15px 0}.op-crumb a{color:#58748f;text-decoration:none}.op-kicker{margin:0;color:var(--op-blue);font-size:12px;font-weight:900;letter-spacing:.18em}.op-heading{max-width:720px;margin-bottom:45px}.op-heading--center{margin-right:auto;margin-left:auto;text-align:center}.op-heading h2,.op-paperless h2,.op-case h2{margin:12px 0 18px;color:var(--op-deep);font-size:clamp(30px,3.1vw,44px);line-height:1.4}.op-heading>p:last-child,.op-paperless p,.op-case p{color:var(--op-muted);font-size:16px;line-height:2}.op-hero{padding:66px 0 78px;background:linear-gradient(135deg,#f7fbff 0%,#fff 50%,#eaf5ff 100%)}.op-hero__grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center;gap:34px}.op-hero__copy h1{margin:14px 0 22px;color:var(--op-deep);font-size:clamp(36px,3.1vw,40px);line-height:1.32}.op-hero__copy>p:not(.op-kicker):not(.op-hero__note){margin:0;color:#4c647a;font-size:17px;line-height:2}.op-option-label{display:inline-block;margin-top:18px;padding:6px 12px;border:1px solid #77aee3;border-radius:999px;color:#1762aa;background:#fff;font-size:12px;font-weight:800}.op-hero__visual{position:relative;margin:0;overflow:hidden;border:1px solid #d0e3f4;border-radius:26px;background:#dbeefa;box-shadow:0 24px 56px rgba(28,75,119,.16)}.op-hero__visual img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}.op-hero__visual figcaption{position:absolute;right:14px;bottom:14px;padding:8px 13px;border-radius:8px;color:#fff;background:rgba(20,58,93,.9);font-size:11px;font-weight:800}.op-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:30px}.op-button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:13px 24px;border-radius:999px;text-decoration:none;font-weight:800;transition:transform .2s,box-shadow .2s}.op-button:hover{transform:translateY(-2px)}.op-button--primary{color:#fff;background:var(--op-blue);box-shadow:0 10px 26px rgba(23,107,195,.24)}.op-button--white{color:var(--op-deep);background:#fff}.op-text-link{color:var(--op-blue);font-weight:800;text-decoration:none}.op-text-link--white{color:#fff}.op-hero__note{margin:16px 0 0!important;color:#778b9d!important;font-size:12px!important;line-height:1.7!important}.op-problem{padding:92px 0;background:#fff}.op-before-after{display:grid;grid-template-columns:1fr 56px 1fr;align-items:center;gap:20px}.op-before-after__side{min-height:310px;padding:32px;border:1px solid var(--op-line);border-radius:22px}.op-before-after__side small{font-size:11px;font-weight:900;letter-spacing:.15em}.op-before-after__side h3{margin:12px 0 24px;font-size:24px}.op-before-after__side ul{display:grid;gap:14px;margin:0;padding:0;list-style:none}.op-before-after__side li{position:relative;padding-left:23px;line-height:1.7}.op-before-after__side li:before{position:absolute;left:0;top:1px}.op-before-after__before{background:#f8f9fb;color:#5d6b78}.op-before-after__before small{color:#8998a5}.op-before-after__before li:before{content:"—";color:#9aa8b4}.op-before-after__after{border-color:#a6d7c6;background:var(--op-mint)}.op-before-after__after small{color:#248962}.op-before-after__after li:before{content:"✓";color:#24966b;font-weight:900}.op-before-after__arrow{color:#7baedf;font-size:42px;text-align:center}.op-value{padding:88px 0;background:#163c60;color:#fff}.op-value .op-kicker{color:#8ccbea}.op-value h2{color:#fff}.op-value__grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.op-value__grid article{padding:34px;border:1px solid rgba(255,255,255,.16);border-radius:20px;background:rgba(255,255,255,.07)}.op-value__role{display:inline-block;padding:6px 11px;border-radius:999px;color:#143a5d;background:#a9dded;font-size:12px;font-weight:900}.op-value__grid h3{margin:18px 0 12px;font-size:23px}.op-value__grid p{margin:0;color:#cadbe7;line-height:1.9}.op-capabilities{padding:96px 0;background:#f4f9fe}.op-capabilities__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.op-capabilities__grid article{padding:28px 24px;border:1px solid var(--op-line);border-radius:18px;background:#fff}.op-capabilities__grid span{display:block;margin-bottom:22px;color:#86b4df;font-size:12px;font-weight:900;letter-spacing:.14em}.op-capabilities__grid h3{margin:0 0 12px;color:var(--op-deep);font-size:19px}.op-capabilities__grid p{margin:0;color:var(--op-muted);font-size:14px;line-height:1.85}.op-screens{padding:100px 0;background:#fff}.op-screen{display:grid;grid-template-columns:.78fr 1.22fr;align-items:center;gap:54px;padding:42px 0;border-top:1px solid var(--op-line)}.op-screen--reverse{grid-template-columns:1.22fr .78fr}.op-screen__copy>span{color:var(--op-blue);font-size:11px;font-weight:900;letter-spacing:.15em}.op-screen__copy h3{margin:12px 0 15px;color:var(--op-deep);font-size:30px}.op-screen__copy p{margin:0;color:var(--op-muted);line-height:1.9}.op-screen__copy ul{display:grid;gap:8px;margin:20px 0 0;padding:0;list-style:none}.op-screen__copy li{position:relative;padding-left:22px;color:#36536d;font-size:14px}.op-screen__copy li:before{position:absolute;left:0;color:#3ca27a;content:"✓";font-weight:900}.op-screen__image{display:grid;min-height:335px;margin:0;padding:26px;border:1px solid #cadae8;border-radius:24px;place-items:center;background:linear-gradient(145deg,#eef7ff,#f9fcff);box-shadow:0 18px 40px rgba(30,75,117,.1)}.op-screen__image img{display:block;width:min(100%,500px);height:auto}.op-screens__action{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;margin-top:26px;padding:32px;border-radius:20px;background:#eef7ff}.op-screens__action p{margin:0;color:var(--op-muted);font-size:13px}.op-workflow{padding:96px 0;background:#f1f7fc}.op-workflow__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0;padding:0;list-style:none}.op-workflow__steps li{padding:27px 23px;border:1px solid var(--op-line);border-radius:18px;background:#fff}.op-workflow__steps b{display:grid;width:38px;height:38px;margin-bottom:22px;border-radius:50%;place-items:center;color:#fff;background:var(--op-blue)}.op-workflow__steps h3{margin:0 0 9px;color:var(--op-deep);font-size:18px}.op-workflow__steps p{margin:0;color:var(--op-muted);font-size:14px;line-height:1.75}.op-workflow__usecases{display:flex;flex-wrap:wrap;gap:9px;margin-top:28px}.op-workflow__usecases span{padding:8px 14px;border:1px solid #b6cee4;border-radius:999px;color:#396486;background:#fff;font-size:12px;font-weight:700}.op-paperless{padding:92px 0;background:#fff}.op-paperless__grid{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:64px}.op-paperless__flow{display:grid;grid-template-columns:1fr 30px 1fr 30px 1fr;align-items:center}.op-paperless__flow article{display:grid;min-height:145px;padding:20px;border:1px solid var(--op-line);border-radius:18px;place-items:center;background:#f7fbff;text-align:center}.op-paperless__flow span{color:var(--op-blue);font-size:11px;font-weight:900}.op-paperless__flow b{color:var(--op-deep);font-size:15px}.op-paperless__flow i{color:#73a9d8;font-size:24px;font-style:normal;text-align:center}.op-start{padding:94px 0;background:#f4f9fe}.op-start__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0;padding:0;list-style:none}.op-start__steps li{position:relative;padding:28px 23px;border:1px solid var(--op-line);border-radius:18px;background:#fff}.op-start__steps b{display:block;margin-bottom:22px;color:#81b1de;font-size:24px}.op-start__steps h3{margin:0 0 10px;color:var(--op-deep);font-size:17px}.op-start__steps p{margin:0;color:var(--op-muted);font-size:13px;line-height:1.8}.op-case{padding:92px 0;background:#fff}.op-case .container{display:grid;grid-template-columns:1fr .8fr;align-items:center;gap:66px}.op-case__quote{padding:34px;border-radius:22px;color:#fff;background:linear-gradient(145deg,#1a6bb2,#153e68);box-shadow:0 18px 42px rgba(24,66,106,.2)}.op-case__quote span{display:inline-block;padding:5px 10px;border-radius:999px;color:#173f63;background:#cce9f4;font-size:11px;font-weight:900}.op-case__quote strong{display:block;margin:21px 0 14px;font-size:23px;line-height:1.6}.op-case__quote p{margin:0;color:#d4e5f1;font-size:14px;line-height:1.8}.op-note{padding:30px 0;border-top:1px solid #f0dfaf;border-bottom:1px solid #f0dfaf;background:#fff7df}.op-note b{display:block;margin-bottom:7px;color:#664b16;font-size:18px}.op-note p{margin:0;color:#705f3e;line-height:1.8}.op-cta{padding:84px 0;color:#fff;background:linear-gradient(135deg,#155da8,#123d70);text-align:center}.op-cta> .container>p{margin:0 0 13px;color:#cbe4fa}.op-cta h2{margin:0;font-size:clamp(30px,3vw,44px);line-height:1.45}.op-cta .op-actions{justify-content:center}

/* Bootstrap 3 の clearfix 疑似要素が grid / flex の列として数えられるのを防ぐ。 */
.op-hero__grid:before,.op-hero__grid:after,.op-paperless__grid:before,.op-paperless__grid:after,.op-case .container:before,.op-case .container:after{display:none!important;content:none!important}

@media(max-width:1050px){.op-hero__grid{grid-template-columns:1fr;gap:38px}.op-hero__copy{max-width:760px}.op-capabilities__grid,.op-workflow__steps,.op-start__steps{grid-template-columns:repeat(2,1fr)}.op-screen,.op-screen--reverse,.op-paperless__grid,.op-case .container{grid-template-columns:1fr}.op-screen--reverse .op-screen__image{order:2}.op-screen--reverse .op-screen__copy{order:1}}
@media(max-width:760px){.op-feature .container{width:min(100% - 32px,1180px)}.op-hero{padding:46px 0 58px}.op-hero__copy h1{font-size:36px}.op-hero__copy>p:not(.op-kicker):not(.op-hero__note){font-size:15px;line-height:1.85}.op-hero__visual{border-radius:18px}.op-heading h2,.op-paperless h2,.op-case h2{font-size:30px}.op-problem,.op-capabilities,.op-screens,.op-workflow,.op-paperless,.op-start,.op-case{padding:66px 0}.op-before-after{grid-template-columns:1fr}.op-before-after__arrow{transform:rotate(90deg)}.op-value__grid,.op-capabilities__grid,.op-workflow__steps,.op-start__steps{grid-template-columns:1fr}.op-screen,.op-screen--reverse{gap:26px;padding:34px 0}.op-screen__image{min-height:240px;padding:14px;border-radius:17px}.op-paperless__flow{grid-template-columns:1fr}.op-paperless__flow i{transform:rotate(90deg);padding:8px}.op-case .container{gap:38px}.op-cta{padding:66px 0}.op-cta h2{font-size:30px}}
@media(max-width:440px){.op-hero__copy h1{font-size:28px}.op-actions{align-items:stretch;flex-direction:column}.op-button{width:100%;text-align:center}.op-before-after__side{min-height:0;padding:25px 22px}.op-screen__copy h3{font-size:26px}.op-screens__action{padding:24px 18px;text-align:center}.op-cta h2{font-size:27px}}