:root{--ink:#171717;--muted:#656565;--line:#cecece;--paper:#fff;--soft:#f3f3f3;--gutter:clamp(24px,5vw,88px);--font:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic",sans-serif;--en:Arial,Helvetica,sans-serif} *{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.95;-webkit-font-smoothing:antialiased}body.menu-open{overflow:hidden}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed}img{display:block;max-width:100%;height:auto}h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{font-weight:700;line-height:1.55;letter-spacing:.025em}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid #2455be;outline-offset:5px}::selection{background:#171717;color:#fff}.wrap{width:100%;max-width:1600px;margin:auto;padding-inline:var(--gutter)}.skip{position:fixed;left:12px;top:-100px;background:#111;color:#fff;padding:12px;z-index:200}.skip:focus{top:12px}.en{font-family:var(--en);letter-spacing:.04em}.eyebrow{font-family:var(--en);font-size:13px;letter-spacing:.12em;text-transform:uppercase}.muted{color:var(--muted)}.small{font-size:14px;color:var(--muted)}.site-header{height:88px;position:sticky;top:0;z-index:60;border-bottom:1px solid var(--ink);background:rgba(255,255,255,.97);display:flex;align-items:center;justify-content:space-between;padding:0 36px}.brand{display:inline-flex;align-items:center;gap:11px;font-family:var(--en);font-size:27px;line-height:1;font-weight:700;letter-spacing:.085em}.brand-symbol{display:grid;grid-template-columns:repeat(2,8px);gap:3px;transform:rotate(-12deg)}.brand-symbol i{width:8px;height:8px;background:currentColor}.header-right{display:flex;gap:40px;align-items:center}.header-links{display:flex;gap:28px;font-size:14px}.header-links a{position:relative}.header-links a::after{content:"";position:absolute;left:0;bottom:-6px;height:1px;width:0;background:currentColor;transition:width .3s}.header-links a:hover::after{width:100%}.header-contact{border-left:1px solid var(--line);padding-left:26px}.menu-toggle{height:48px;width:48px;background:none;border:0;display:flex;justify-content:center;align-items:center;gap:7px;flex-direction:column;z-index:72}.menu-toggle span{display:block;width:26px;height:1px;background:var(--ink);transition:transform .3s}.menu-open .menu-toggle span:first-child{transform:translateY(4px) rotate(45deg)}.menu-open .menu-toggle span:last-child{transform:translateY(-4px) rotate(-45deg)}.menu-panel{position:fixed;inset:88px 0 0;background:#fff;z-index:59;overflow:auto;padding:clamp(30px,6vw,90px) var(--gutter)}.menu-panel[hidden]{display:none}.menu-grid{max-width:1280px;margin:auto;display:grid;grid-template-columns:1fr 1.5fr;gap:12%}.menu-title{font-family:var(--en);font-size:clamp(56px,7vw,110px);line-height:1}.menu-list{list-style:none;padding:0;margin:0}.menu-list a{display:flex;align-items:center;justify-content:space-between;padding:17px 0;border-bottom:1px solid var(--line);font-size:22px}.menu-list small{font-size:13px;font-family:var(--en);display:block;color:var(--muted)}.menu-list a:hover{padding-left:10px}.menu-meta{margin-top:40px;font-size:14px}.arrow{display:inline-block;font-family:var(--en);font-weight:400;font-size:24px;transition:transform .3s}.link:hover .arrow,.text-link:hover .arrow{transform:translateX(6px)} .hero{position:relative;min-height:min(790px,calc(100svh - 88px));overflow:hidden;display:flex;align-items:center;background:#fafafa;border-bottom:1px solid var(--ink)}.hero-content{z-index:2;position:relative;padding-block:90px 100px;pointer-events:none}.hero-content a,.hero-content button{pointer-events:auto}.hero-topline{font-size:14px;letter-spacing:.09em;margin-bottom:48px}.hero h1{font-size:clamp(42px,5.3vw,82px);line-height:1.55;letter-spacing:.045em}.hero h1 span{display:block}.hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-top:58px;max-width:800px}.hero-bottom p{font-size:16px}.hero-tabs{display:flex;gap:24px;align-items:center;margin-top:34px}.hero-tabs button{font-family:var(--en);font-size:13px;letter-spacing:.08em;border:0;background:none;padding:5px 0;color:#777}.hero-tabs button[aria-pressed=true]{color:#111}.hero-tabs .track{width:48px;height:1px;background:#aaa;position:relative}.hero-tabs .track:after{content:"";position:absolute;height:1px;width:24px;left:0;background:#111;transition:left .4s}.hero-tabs:has(button:last-child[aria-pressed=true]) .track:after{left:24px}.hero-art{position:absolute;inset:0;overflow:hidden;pointer-events:none}.ribbon{position:absolute;height:145%;width:22%;top:-20%;right:9%;transform:skewX(-29deg);background:linear-gradient(100deg,#eee 0%,#a8a8a8 15%,#464646 47%,#161616 76%,#050505 100%);animation:ribbon-drift 12s ease-in-out infinite alternate;opacity:.87}.ribbon.two{right:-17%;width:20%;background:linear-gradient(100deg,#fafafa,#d5d5d5 35%,#555);animation-delay:-5s;opacity:.48}.ribbon.three{right:35%;width:1px;background:#bdbdbd;opacity:.8;animation:none}.hero-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fafafa 0%,rgba(250,250,250,.98) 24%,rgba(250,250,250,.75) 53%,transparent 73%)}@keyframes ribbon-drift{from{translate:55px 0;scale:1}to{translate:-35px 0;scale:1.08}}.motion-control{position:absolute;right:36px;bottom:28px;width:40px;height:40px;border:1px solid #aaa;background:#ffffffbb;z-index:3;font-size:14px}.motion-paused .ribbon{animation-play-state:paused}.hero-index{position:absolute;right:40px;top:35px;font-size:12px;letter-spacing:.12em;z-index:2;writing-mode:vertical-rl}.section-bar{border-block:1px solid var(--ink);margin-top:-1px;padding:18px var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:17px;font-weight:500}.section-bar .eyebrow{font-size:12px;color:#737373}.section-label{display:flex;align-items:center;gap:18px}.section-label:before{content:"";width:12px;height:18px;transform:skew(-26deg);background:linear-gradient(110deg,#999,#111)}.section{padding-block:108px}.section-heading{font-size:clamp(28px,3.3vw,48px);line-height:1.8}.section-sub{font-size:16px;max-width:620px;margin-top:28px;line-height:2.15}.about-intro{max-width:1150px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:6%;align-items:center;margin-top:56px}.school-art{position:relative}.school-art img{width:100%;filter:saturate(.5);mix-blend-mode:multiply}.school-art figcaption{font-size:12px;font-family:var(--en);letter-spacing:.1em;margin-top:8px;color:var(--muted)}figure{margin:0}.about-copy{padding-left:5%;max-width:600px}.about-copy p{line-height:2.2}.link{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:22px 0;border-bottom:1px solid var(--ink);min-width:230px}.link small{display:block;font-size:13px;color:var(--muted);line-height:1.4;margin-bottom:4px}.link b{font-family:var(--en);font-size:28px;font-weight:400;line-height:1.3}.link-group{display:grid;grid-template-columns:1fr 1fr;gap:45px;margin-top:52px}.text-link{display:inline-flex;align-items:center;gap:36px;border-bottom:1px solid;padding:10px 0;font-size:15px}.dark-link{display:inline-flex;align-items:center;justify-content:space-between;gap:48px;padding:18px 24px;background:#171717;color:#fff;font-size:15px;border:1px solid #171717;transition:background .3s,color .3s}.dark-link:hover{background:#fff;color:#171717}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin-top:34px}.products-section{background:#f5f5f5}.product{display:grid;grid-template-columns:.9fr 1.15fr;gap:7%;align-items:center;padding-block:72px;border-bottom:1px solid #bbb}.product:last-child{padding-bottom:0;border:0}.product-title{font-family:var(--en);font-size:clamp(52px,6vw,84px);line-height:1.1;font-weight:400;letter-spacing:-.035em;margin:24px 0 18px}.product-name{font-size:16px;margin-bottom:26px}.product h3{font-size:clamp(24px,2.3vw,34px);margin-bottom:24px;line-height:1.65}.product p{font-size:16px;color:#535353;line-height:2.05}.status{display:inline-block;border:1px solid #777;font-size:12px;padding:0 10px;margin-left:15px}.product-visual{position:relative;overflow:hidden;padding:36px;background:#e7e7e7}.product-visual:before{content:"";position:absolute;width:33%;height:150%;right:-5%;top:-20%;background:#d2d2d2;transform:skewX(-27deg)}.product-visual> *{position:relative}.product-visual img{box-shadow:0 12px 40px #0002;width:100%;transition:transform .6s}.product-visual:hover img{transform:translateY(-5px)}.visual-caption{font-size:12px;font-family:var(--en);display:flex;justify-content:space-between;gap:12px;margin-top:20px;color:#555}.image-button{display:block;border:0;background:none;padding:0;width:100%;text-align:left}.image-button>span{font-size:13px;display:block;text-align:right;margin-top:12px}.sorotta-screen{font-size:13px;background:#fff;border:1px solid #d4d4d4;padding:22px;box-shadow:0 12px 40px #0001;line-height:1.6}.screen-brand{font-size:18px;font-weight:700;display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.screen-brand small{font-size:11px;font-weight:400;color:#777}.screen-tabs{display:flex;gap:20px;border-bottom:1px solid #ddd;padding-bottom:12px;font-size:12px}.screen-tabs span:first-child{font-weight:700}.screen-title{margin:20px 0 12px;font-size:15px}.screen-stats{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #ddd}.screen-stats>div{padding:12px;border-right:1px solid #ddd}.screen-stats>div:last-child{border:0}.screen-stats small{font-size:11px;display:block}.screen-stats b{font-size:29px;font-family:var(--en);font-weight:400}.screen-todo{padding:14px 0;border-bottom:1px solid #eee;display:flex;justify-content:space-between;gap:10px}.screen-todo i{font-size:11px;font-style:normal;background:#f0f0f0;padding:2px 6px;white-space:nowrap}.screen-note{font-size:11px;color:#666;margin-top:18px}.development-band{display:grid;grid-template-columns:1fr 1fr;gap:10%;padding-block:80px}.development-band h2{font-size:36px}.development-band .eyebrow{margin-bottom:25px}.development-band p{line-height:2.1}.dark-section{background:#171717;color:#fff}.dark-section .section-bar{border-color:#666}.dark-section .section-bar .eyebrow{color:#aaa}.dark-section .section-label:before{background:linear-gradient(110deg,#fff,#666)}.dark-section .section-sub{color:#bbb}.security-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5%;margin-top:66px}.security-item{border-top:1px solid #666;padding-top:25px}.security-item .eyebrow{color:#aaa}.security-item h3{font-size:23px;margin:22px 0}.security-item p{color:#bcbcbc;font-size:15px}.tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:56px}.tool-card{display:block;border-bottom:1px solid;padding-bottom:24px}.tool-thumb{aspect-ratio:1.35;background:#f1f1f1;overflow:hidden;margin-bottom:24px;padding:22px;position:relative}.tool-thumb img{width:100%;height:100%;object-fit:contain;filter:grayscale(1);transition:filter .4s,transform .4s}.tool-card:hover img{filter:grayscale(0);transform:scale(1.045)}.tool-no{font-family:var(--en);font-size:12px;color:#555;letter-spacing:.08em}.tool-card h3{font-size:19px;margin:13px 0}.tool-card p{font-size:14px;line-height:1.9;color:#666}.tool-card .arrow{display:block;text-align:right;margin-top:18px}.news-section{background:#f5f5f5}.news-layout{display:grid;grid-template-columns:.65fr 1.65fr;gap:8%}.display-title{font-family:var(--en);font-weight:400;letter-spacing:-.055em;font-size:clamp(58px,7vw,100px);line-height:1.15}.news-list{list-style:none;padding:0;margin:0;border-top:1px solid #bbb}.news-list a{display:grid;grid-template-columns:100px 1fr 24px;gap:20px;padding:27px 0;border-bottom:1px solid #bbb;align-items:start}.news-list time{font-family:var(--en);font-size:14px;color:#555;padding-top:3px}.news-list h3{font-size:16px;font-weight:500}.news-list small{font-size:12px;color:#666;display:block;margin-bottom:7px}.news-list a:hover h3{text-decoration:underline;text-underline-offset:5px}.closing{border-top:1px solid var(--ink);padding-block:65px 75px}.closing-title{font-size:24px;margin-bottom:35px}.closing-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid;border-bottom:1px solid}.closing-link{position:relative;padding:38px 48px 38px 0}.closing-link+ .closing-link{border-left:1px solid;padding-left:48px}.closing-link .en{font-size:clamp(36px,4.5vw,65px);font-weight:400;line-height:1.2;letter-spacing:-.025em}.closing-link h3{font-size:18px;margin-top:18px}.closing-link p{font-size:14px;color:#666;margin-top:15px;max-width:85%}.closing-link .arrow{position:absolute;right:5px;top:45px;font-size:32px}.closing-link:hover .arrow{transform:translate(5px,-5px)}.site-footer{background:#171717;color:#fff;padding-block:64px 24px}.footer-top{display:grid;grid-template-columns:1fr 1.5fr;gap:10%;padding-bottom:65px}.footer-top .brand{font-size:32px}.footer-tagline{font-size:14px;color:#aaa;margin-top:26px}.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.footer-links a{display:block;font-size:14px;margin-bottom:12px}.footer-links a:hover{text-decoration:underline}.footer-links b{display:block;font-size:12px;font-family:var(--en);color:#888;margin-bottom:20px;font-weight:400;letter-spacing:.1em}.footer-bottom{border-top:1px solid #555;padding-top:22px;display:flex;justify-content:space-between;font-family:var(--en);font-size:12px;color:#aaa}.footer-bottom a{font-family:var(--font);font-size:12px}.breadcrumb{font-size:12px;font-family:var(--en);letter-spacing:.08em;color:#737373;margin-bottom:45px}.breadcrumb a{text-decoration:underline;text-underline-offset:4px}.page-head{padding-block:48px 80px;border-bottom:1px solid var(--ink);position:relative;overflow:hidden}.page-head:after{content:"";position:absolute;right:12%;top:0;width:8%;height:100%;transform:skewX(-28deg);background:linear-gradient(100deg,#fafafa,#e7e7e7);z-index:-1}.page-head h1{font-family:var(--en);font-size:clamp(62px,8vw,120px);font-weight:400;line-height:1.08;letter-spacing:-.045em;overflow-wrap:anywhere}.page-head .jp-title{font-family:var(--font);font-size:20px;display:block;margin:22px 0 0;letter-spacing:.03em}.page-head .lead{margin-top:35px;max-width:800px;font-size:clamp(23px,2.5vw,36px);font-weight:600;line-height:1.75}.page-head .description{max-width:700px;font-size:16px;line-height:2.1;margin-top:24px;color:#555}.subnav{display:flex;gap:38px;margin-top:38px;font-size:14px}.subnav a{border-bottom:1px solid #999;padding-bottom:6px}.feature-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:10%}.feature-layout .display-title{font-size:60px}.feature-list{list-style:none;padding:0;margin:0;border-top:1px solid #aaa}.feature-list li{padding:27px 0;border-bottom:1px solid #ccc}.feature-list .eyebrow{font-size:12px;color:#777}.feature-list h3{font-size:23px;margin:9px 0 14px}.feature-list p{font-size:16px;color:#555}.wide-shot{background:#eee;padding:40px;margin-top:55px}.wide-shot img{margin:auto;box-shadow:0 16px 55px #0002}.section-titles{display:flex;justify-content:space-between;align-items:baseline;gap:30px;margin-bottom:48px}.section-titles h2{font-size:32px}.section-titles .eyebrow{color:#777}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.detail-grid h2{font-size:34px;margin-bottom:28px}.detail-grid p+p{margin-top:20px}.photo-wide{overflow:hidden}.photo-wide img{filter:saturate(.5);width:100%}.process-list{display:grid;grid-template-columns:repeat(4,1fr);gap:4%;list-style:none;padding:0;margin:50px 0 0}.process-list li{border-top:1px solid;padding-top:20px}.process-list .num{font-family:var(--en);font-size:50px;color:#aaa;line-height:1}.process-list h3{font-size:21px;margin:25px 0 14px}.process-list p{font-size:15px;color:#666}.faq{max-width:920px;margin:auto}.faq details{border-bottom:1px solid #bbb;padding:24px 0}.faq summary{list-style:none;cursor:pointer;font-size:18px;display:flex;justify-content:space-between;gap:24px}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";font-family:var(--en);font-size:24px;flex:none}.faq details[open] summary:after{content:"−"}.faq details p{margin-top:22px;color:#555;line-height:2}.company-table{border-collapse:collapse;width:100%;font-size:16px}.company-table th,.company-table td{border-bottom:1px solid #ccc;text-align:left;vertical-align:top;padding:24px 0}.company-table th{width:25%;font-weight:500}.company-table td a{text-decoration:underline}.history-list{list-style:none;padding:0;margin:0}.history-list li{display:grid;grid-template-columns:100px 1fr;gap:35px;border-top:1px solid #ccc;padding:30px 0}.history-list time{font-family:var(--en);font-size:28px}.history-list h3{font-size:22px;margin-bottom:10px}.history-list p{color:#666}.tools-list{list-style:none;margin:0;padding:0}.tools-list>li{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center;padding:64px 0;border-bottom:1px solid #ccc}.tools-list>li:first-child{padding-top:0}.tools-list h2{font-size:29px;margin:20px 0}.tools-list p{color:#555}.tools-list .small{margin-top:20px;font-size:14px}.tool-shot{padding:36px;background:#eee}.tool-shot img{width:100%;aspect-ratio:1.4;object-fit:contain}.contact-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:10%;align-items:start}.contact-intro h2{font-size:clamp(36px,4vw,56px);margin:18px 0 30px}.contact-intro p{color:#666;font-size:15px;line-height:2.1}.contact-intro .response{margin-top:36px;padding-top:24px;border-top:1px solid #ccc}.contact-intro .response strong{display:block;color:#111;font-size:16px;margin-bottom:8px}.contact-fieldset{border:0;border-top:1px solid #222;padding:24px 0 36px;margin:0}.contact-fieldset legend{float:left;width:100%;font-weight:600;font-size:18px;margin-bottom:24px}.contact-fieldset legend+*{clear:both}.contact-step{font-family:var(--en);font-size:13px;display:inline-block;margin-right:16px;color:#777;font-weight:400}.contact-required,.contact-optional{font-size:11px;display:inline-block;padding:0 7px;margin-left:10px;vertical-align:middle;font-weight:400}.contact-required{background:#171717;color:white}.contact-optional{background:#eee;color:#555}.contact-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}.contact-choice{border:1px solid #ccc;padding:15px 12px;display:flex;gap:10px;cursor:pointer;align-items:start;line-height:1.6}.contact-choice:has(input:checked){border-color:#111;background:#f0f0f0;box-shadow:inset 0 0 0 1px #111}.contact-choice input{accent-color:#111;margin-top:5px;flex:none}.contact-choice b{font-size:14px;font-weight:500}.contact-choice small{font-size:12px;color:#777;display:block;margin-top:5px}.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:24px 20px}.contact-field-wide{grid-column:1/-1}.contact-field label{display:block;font-size:14px;margin-bottom:10px}.contact-field input,.contact-field textarea{width:100%;border:1px solid #bbb;border-radius:0;background:#fafafa;padding:14px;font-size:16px;appearance:none}.contact-field textarea{resize:vertical;min-height:170px}.contact-hint{font-size:12px;color:#777;margin-top:8px}.contact-error{font-size:13px;color:#b21b1b;margin-top:8px}.contact-policy{font-size:13px;color:#666;line-height:1.9}.contact-policy a{text-decoration:underline}.contact-submit{margin-top:25px;width:100%;padding:21px 24px;border:1px solid #171717;color:#fff;background:#171717;display:flex;justify-content:space-between;align-items:center}.contact-submit:after{content:"→";font-size:24px;font-family:var(--en)}.contact-submit:hover{background:#333}.contact-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.contact-submit-status{font-size:14px;margin-top:10px}.policy{max-width:960px;margin:auto;font-size:16px}.policy h3{font-size:22px;margin:38px 0 15px}.policy p{line-height:2.15}.policy a{text-decoration:underline}.pp-digest{background:#f3f3f3;padding:28px;margin-bottom:40px}.pp-digest b{display:block;margin-bottom:15px}.pp-digest li{margin-left:20px;margin-block:12px}.callout{padding:50px;background:#f3f3f3;margin-top:60px}.callout h2{font-size:30px;margin-bottom:18px}.lightbox{border:0;padding:0;max-width:94vw;max-height:92svh;background:#fff;box-shadow:0 20px 70px #0005}.lightbox::backdrop{background:#000b;backdrop-filter:blur(4px)}.lightbox-inner{padding:56px 22px 22px}.lightbox img{max-height:78svh;object-fit:contain;margin:auto}.dialog-close{position:absolute;right:14px;top:10px;background:#fff;border:1px solid #aaa;min-width:42px;height:36px;font-size:20px}.demo{border:1px solid #bfbfbf;background:#fff;margin-top:34px;overflow:hidden}.demo-top{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:18px 22px;border-bottom:1px solid #ddd}.demo-top h3{font-size:16px}.demo-top small{font-size:12px;color:#777}.demo-alert{padding:14px 22px;background:#fff2ed;font-size:14px;color:#9a3018}.demo-alert.resolved{background:#edf5f0;color:#2e6241}.demo-scroll{overflow-x:auto}.demo table{width:100%;min-width:550px;border-collapse:collapse;table-layout:fixed;font-size:14px}.demo th,.demo td{border:1px solid #e4e4e4;padding:14px;text-align:center}.demo th{font-size:12px;font-weight:500;background:#fafafa}.demo td:first-child{text-align:left;font-size:12px;background:#fafafa;width:100px}.demo-cell{border:0;border-radius:3px;background:#eaf0f6;padding:9px 6px;display:block;width:100%;line-height:1.7;font-size:14px}.demo-cell.error{background:#ffe1d8;box-shadow:inset 0 0 0 1px #b34c32;cursor:pointer}.demo-cell.changed{background:#e5f0e8;cursor:pointer}.demo-cell small{font-size:10px;color:#555;margin-left:5px}.demo-bottom{padding:14px 22px;font-size:13px;color:#666}.teacher-dialog{border:1px solid #bbb;max-width:min(500px,90vw);padding:35px}.teacher-dialog::backdrop{background:#0009}.teacher-dialog h3{font-size:20px;margin-bottom:12px}.teacher-dialog p{font-size:14px;color:#666}.teacher-options{margin-top:24px;display:grid;gap:10px}.teacher-options button{border:1px solid #bbb;padding:12px 16px;background:#fff;text-align:left;display:flex;justify-content:space-between;font-size:15px}.teacher-options button:disabled{background:#eee;color:#888}.teacher-options small{font-size:12px}.reveal{transition:opacity .7s,transform .7s}.js .reveal.pending{opacity:0;transform:translateY(22px)} @media(min-width:1700px){.hero{min-height:850px}.hero-content{padding-block:130px}.hero h1{font-size:88px}} @media(max-width:1050px){.header-links{display:none}.site-header{height:76px;padding-inline:25px}.menu-panel{top:76px}.hero{min-height:660px}.hero h1{font-size:clamp(40px,5.8vw,65px)}.product{gap:5%;grid-template-columns:1fr 1fr}.product-visual{padding:22px}.tool-grid{grid-template-columns:repeat(2,1fr);gap:35px}.tool-card h3{font-size:21px}.tool-thumb{aspect-ratio:1.5}.feature-layout{gap:6%;grid-template-columns:.7fr 1.3fr}.contact-layout{gap:7%;grid-template-columns:.7fr 1.3fr}.contact-choices{grid-template-columns:1fr}.contact-fields{grid-template-columns:1fr}.footer-top{gap:7%;grid-template-columns:.8fr 1.2fr}.security-item h3{font-size:20px}.screen-brand small{display:none}.screen-tabs{gap:12px}.screen-stats>div{padding:9px}.process-list{grid-template-columns:repeat(2,1fr);gap:35px}.header-right{gap:15px}.hero-index{right:25px}} @media(max-width:700px){:root{--gutter:24px}.site-header{height:68px;padding:0 20px}.brand{font-size:22px;gap:9px}.brand-symbol{grid-template-columns:repeat(2,6px);gap:3px}.brand-symbol i{width:6px;height:6px}.header-contact{display:none}.menu-toggle{width:40px}.menu-panel{top:68px;padding:34px 24px}.menu-grid{grid-template-columns:1fr;gap:28px}.menu-title{font-size:42px}.menu-meta{display:none}.menu-list a{padding:13px 0;font-size:18px}.menu-list small{font-size:12px}.hero{min-height:650px;min-height:calc(88svh - 68px);align-items:center}.hero-content{padding-top:70px;padding-bottom:75px}.hero-topline{font-size:12px;letter-spacing:.05em;margin-bottom:44px;max-width:230px}.hero h1{font-size:clamp(32px,8.2vw,54px);line-height:1.75;letter-spacing:.015em}.hero-bottom{margin-top:32px}.hero-bottom p{font-size:14px;line-height:2}.hero-tabs{margin-top:27px}.hero-tabs button{font-size:12px}.hero-art:after{background:linear-gradient(90deg,rgba(250,250,250,.99) 0%,rgba(250,250,250,.95) 42%,rgba(250,250,250,.6) 74%,rgba(250,250,250,.12))}.ribbon{right:0;width:30%;top:-10%;height:130%;opacity:.8}.ribbon.two{right:-30%;width:30%}.ribbon.three{right:46%}.hero-index{font-size:10px;right:18px;top:22px}.motion-control{right:20px;bottom:20px;width:32px;height:32px;font-size:12px}.section-bar{padding:15px 24px;font-size:14px}.section-bar .eyebrow{font-size:10px;letter-spacing:.07em}.section-label{gap:12px}.section-label:before{width:9px;height:14px}.section{padding-block:62px}.section-heading{font-size:25px;line-height:1.9;letter-spacing:.01em}.section-sub{font-size:15px;line-height:2;margin-top:23px}.about-grid{grid-template-columns:1fr;gap:25px;margin-top:35px}.about-copy{padding-left:0;max-width:none}.about-copy p{font-size:15px;line-height:2.15}.school-art{margin-inline:-8px}.school-art figcaption{font-size:10px}.link-group{gap:25px;margin-top:32px}.link{min-width:0;padding:16px 0;gap:12px}.link small{font-size:12px}.link b{font-size:23px}.link .arrow{font-size:23px}.product{grid-template-columns:1fr;gap:32px;padding-block:47px}.product-title{font-size:56px;margin-top:20px;margin-bottom:12px}.product-name{font-size:14px;margin-bottom:22px}.product h3{font-size:26px;margin-bottom:20px}.product p{font-size:15px;line-height:2}.product .eyebrow{font-size:12px}.product-visual{padding:25px 20px}.product-visual .visual-caption{font-size:10px}.product-visual .image-button>span{font-size:12px}.screen-brand small{display:block;font-size:10px}.sorotta-screen{padding:16px}.screen-tabs{font-size:11px;gap:18px}.screen-title{font-size:14px}.screen-stats b{font-size:25px}.screen-todo{font-size:12px}.screen-todo i{font-size:10px}.development-band{grid-template-columns:1fr;gap:25px;padding-block:57px}.development-band h2{font-size:29px}.development-band p{font-size:15px}.development-band .eyebrow{font-size:12px;margin-bottom:20px}.security-grid{grid-template-columns:1fr;gap:35px;margin-top:40px}.security-item{padding-top:20px}.security-item h3{font-size:23px;margin:15px 0}.security-item p{font-size:15px}.security-item .eyebrow{font-size:11px}.tool-grid{gap:32px 18px;margin-top:35px}.tool-thumb{padding:12px;aspect-ratio:1.25;margin-bottom:16px}.tool-card h3{font-size:16px;margin:10px 0;line-height:1.7}.tool-card p{font-size:13px;line-height:1.85}.tool-no{font-size:10px}.tool-card .arrow{margin-top:12px;font-size:22px}.tool-card{padding-bottom:14px}.news-layout{grid-template-columns:1fr;gap:28px}.display-title{font-size:64px}.news-list a{grid-template-columns:1fr 22px;gap:6px 15px;padding:23px 0}.news-list time{grid-column:1/-1;font-size:12px}.news-list h3{font-size:15px}.news-list small{font-size:11px;margin-bottom:4px}.news-layout .text-link{margin-top:15px}.closing{padding-block:45px 50px}.closing-title{font-size:19px;margin-bottom:26px}.closing-grid{grid-template-columns:1fr}.closing-link{padding:28px 0}.closing-link+.closing-link{border-left:0;border-top:1px solid;padding-left:0}.closing-link .en{font-size:44px}.closing-link h3{font-size:16px;margin-top:12px}.closing-link p{font-size:13px;max-width:88%;margin-top:10px}.closing-link .arrow{top:29px;font-size:26px}.site-footer{padding-top:48px}.footer-top{grid-template-columns:1fr;gap:40px;padding-bottom:35px}.footer-top .brand{font-size:27px}.footer-tagline{margin-top:19px;font-size:13px}.footer-links{grid-template-columns:1fr 1fr;gap:25px}.footer-links b{margin-bottom:14px;font-size:11px}.footer-links a{font-size:13px;margin-bottom:10px}.footer-bottom{font-size:11px;gap:20px}.footer-bottom a{font-size:11px}.page-head{padding-block:30px 48px}.breadcrumb{font-size:10px;margin-bottom:35px}.page-head h1{font-size:clamp(50px,13vw,78px)}.page-head .jp-title{font-size:17px;margin-top:17px}.page-head .lead{font-size:25px;margin-top:30px}.page-head .description{font-size:15px;line-height:2;margin-top:20px}.subnav{gap:22px;flex-wrap:wrap;margin-top:26px;font-size:13px}.actions{gap:20px;margin-top:27px}.dark-link{font-size:14px;padding:15px 20px;gap:30px}.text-link{font-size:14px;gap:25px}.feature-layout{grid-template-columns:1fr;gap:35px}.feature-layout .display-title{font-size:50px}.feature-list h3{font-size:22px}.feature-list p{font-size:15px;line-height:2}.feature-list li{padding:24px 0}.wide-shot{padding:20px;margin-top:32px}.detail-grid{grid-template-columns:1fr;gap:35px}.detail-grid h2{font-size:27px;margin-bottom:22px}.detail-grid p{font-size:15px}.section-titles{margin-bottom:30px;align-items:start;flex-direction:column;gap:8px}.section-titles h2{font-size:27px}.section-titles .eyebrow{font-size:11px}.process-list{gap:30px 22px;margin-top:30px}.process-list .num{font-size:38px}.process-list h3{font-size:18px;margin:20px 0 10px}.process-list p{font-size:14px}.faq summary{font-size:16px;line-height:1.8}.faq details p{font-size:15px}.company-table{font-size:14px}.company-table th{width:30%;padding-right:15px;white-space:normal}.company-table td{overflow-wrap:anywhere}.company-table th,.company-table td{padding-block:20px}.history-list li{grid-template-columns:60px 1fr;gap:20px;padding:25px 0}.history-list time{font-size:22px}.history-list h3{font-size:19px}.history-list p{font-size:14px}.tools-list>li{grid-template-columns:1fr;gap:28px;padding:44px 0}.tools-list h2{font-size:24px;margin:16px 0}.tools-list p{font-size:15px}.tool-shot{padding:24px}.contact-layout{grid-template-columns:1fr;gap:45px}.contact-intro h2{font-size:38px;margin-bottom:20px}.contact-intro .response{margin-top:24px}.contact-choices{grid-template-columns:1fr}.contact-fieldset legend{font-size:17px}.contact-fieldset{padding-top:22px;padding-bottom:30px}.contact-choice{padding:16px}.contact-choice b{font-size:15px}.contact-choice small{font-size:12px}.contact-fields{gap:22px}.contact-field label{font-size:14px}.policy{font-size:15px}.policy h3{font-size:20px}.pp-digest{padding:22px}.callout{padding:28px;margin-top:40px}.callout h2{font-size:24px}.callout p{font-size:15px}.demo-top{align-items:start;padding:15px;flex-direction:column;gap:4px}.demo-top h3{font-size:14px}.demo-alert,.demo-bottom{padding:12px 15px;font-size:12px}.lightbox-inner{padding:55px 12px 15px}.teacher-dialog{padding:32px 22px}.teacher-dialog h3{font-size:18px}} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.js .reveal.pending{opacity:1;transform:none}} /* TREDECIM: the four colors of the supplied mark, with black typography. */ :root{--ink:#191a19;--muted:#52544f;--line:#d8ddd4;--paper:#fff;--soft:#f3f6f0;--brand-gold:#e0b055;--brand-green:#92bd9d;--brand-coral:#d9a094;--brand-violet:#8992c7;--gold-wash:#fcf6e9;--green-wash:#eff6ef;--coral-wash:#fbf1ee;--violet-wash:#f1f2f9;--primary:#191a19} .brand{color:var(--ink)} .brand-mark{width:34px;height:34px;flex:none} .site-header{border-bottom-color:#d4d8d0;background:rgba(255,255,255,.97)} .menu-toggle span{background:var(--ink)} .menu-panel{background:linear-gradient(120deg,#fff 45%,#f3f6ef)} .menu-list a{border-color:#d4d8d0} .menu-list a:hover{background:linear-gradient(90deg,transparent,#f0f2fa)} .hero{background:#fdfdf9;border-bottom-color:#c7ccbd} .hero-art:after{background:linear-gradient(90deg,#fdfdf9 0%,rgba(253,253,249,.98) 24%,rgba(253,253,249,.72) 53%,transparent 76%)} .ribbon{background:linear-gradient(105deg,#cbd0e8 0%,#a6aed6 35%,#8992c7 72%,#a3abd7 100%);opacity:.94} .ribbon.two{background:linear-gradient(112deg,#f0d799 0%,#e0b055 28%,#d9a094 70%,#e8beb5 100%);opacity:.72} .ribbon.three{width:9%;right:36%;background:linear-gradient(108deg,#d5e7d6,#92bd9d 75%);opacity:.68} .hero-index{color:var(--ink)} .motion-control{border-color:#b9c0ad;color:var(--ink);background:#fffffff0} .hero-tabs button{color:#55594f} .hero-tabs button[aria-pressed=true]{color:var(--ink)} .hero-tabs .track{background:#bbc8b9} .hero-tabs .track:after{background:var(--brand-green);height:2px} .section-bar{border-color:#c4cbbd} .section-bar .eyebrow{color:#565a51} .section-label:before{background:linear-gradient(155deg,var(--brand-gold),var(--brand-coral) 38%,var(--brand-violet) 65%,var(--brand-green));width:12px} .school-art img,.photo-wide img{filter:none} .link,.text-link{border-bottom-color:#b9c5b3} .link:hover,.text-link:hover{border-bottom-color:var(--brand-violet)} .dark-link{background:#e4e8f5;border-color:#b8c0df;color:var(--ink)} .dark-link:hover{background:#cfd6ed;border-color:#8992c7;color:var(--ink)} .products-section{background:var(--violet-wash)} .products-section .section-bar{background:#e8ebf6;border-color:#c4cae0} .product{border-bottom-color:#cbd0e2} .product-visual,.wide-shot{background:#e3e7f3} .product-visual:before{background:#cbd2eb} .product-visual img,.wide-shot img{box-shadow:0 12px 40px #4f609016} .product:nth-of-type(2) .product-visual,.sorotta-visual{background:#f4e3dd} .product:nth-of-type(2) .product-visual:before,.sorotta-visual:before{background:#e7c3b8} .product p,.feature-list p,.process-list p,.detail-grid p,.tools-list p{color:#3e413b} .status{background:#e4efdf;border-color:#aec4a6;color:var(--ink)} .product:nth-of-type(2) .status{background:#f1e3d3;border-color:#d0b491} .visual-caption,.image-button>span{color:#494b45} .dark-section{background:var(--green-wash);color:var(--ink)} .dark-section .section-bar{background:#e2eede;border-color:#b4c6aa} .dark-section .section-bar .eyebrow{color:#4c5547} .dark-section .section-label:before{background:linear-gradient(140deg,var(--brand-green),var(--brand-gold))} .dark-section .section-sub{color:#3e483b} .security-item{border-top-color:#adc39f} .security-item .eyebrow,.security-item p{color:#485044} .security-item:nth-child(2){border-top-color:var(--brand-gold)} .security-item:nth-child(3){border-top-color:var(--brand-violet)} .tool-card{border-bottom-color:#c7cdbc} .tool-thumb{background:var(--gold-wash)} .tool-card:nth-child(2) .tool-thumb{background:var(--green-wash)} .tool-card:nth-child(3) .tool-thumb{background:var(--coral-wash)} .tool-card:nth-child(4) .tool-thumb{background:var(--violet-wash)} .tool-thumb img,.tool-card:hover img{filter:none} .tool-card p,.tool-no{color:#50534b} .news-section{background:var(--gold-wash)} .news-list,.news-list a{border-color:#d9cfb5} .news-list time,.news-list small{color:#565246} .closing{border-top-color:#c4cbbd;background:#fff} .closing-grid{border-color:#c4cbbd} .closing-link{background:linear-gradient(110deg,#fff 5%,#f3f5fb)} .closing-link+.closing-link{border-color:#c4cbbd;background:linear-gradient(110deg,#fff 5%,#f9f0ec)} .closing-link p{color:#50534b} .closing-link:hover .arrow{color:var(--ink)} .site-footer{color:var(--ink);background:linear-gradient(120deg,#f4f2e9 0%,#edf4ed 38%,#f0f1f8 76%,#f7efec 100%);border-top:1px solid #d2d8ca;position:relative} .site-footer:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--brand-gold) 0 25%,var(--brand-green) 25% 50%,var(--brand-violet) 50% 75%,var(--brand-coral) 75%)} .footer-tagline,.footer-links b,.footer-bottom{color:#4e5349} .footer-bottom{border-top-color:#c4cbbd} .page-head{border-color:#c8cdbf;background:linear-gradient(110deg,#fff 55%,#f8f7ed);isolation:isolate} .page-head:after{background:linear-gradient(100deg,#edf2e7,#d3ddca);z-index:-1} body:has(.sorotta-visual) .page-head{background:linear-gradient(110deg,#fff 55%,#fcf3ee)} body:has(.sorotta-visual) .page-head:after{background:linear-gradient(100deg,#f9e4dc,#e8c7ba)} .page-head .description,.breadcrumb{color:#4e5349} .subnav a{border-color:#b9c5b3} .feature-list{border-color:#b8c3aa}.feature-list li{border-color:#d1d8c8} .feature-list .eyebrow{color:#545e4e} .process-list li{border-color:#adb89d} .process-list .num{color:#191a19;font-weight:400} .faq details{border-color:#cbd2c1} .faq details[open]{background:linear-gradient(90deg,#fff,#f4f6ed)} .faq details p,.history-list p{color:#464d40} .company-table th,.company-table td,.history-list li{border-color:#cbd2c1} .company-table a{color:var(--ink)} .tools-list>li{border-color:#cbd2c1} .tool-shot{background:var(--gold-wash)} .tools-list>li:nth-child(2) .tool-shot{background:var(--green-wash)} .tools-list>li:nth-child(3) .tool-shot{background:var(--coral-wash)} .tools-list>li:nth-child(4) .tool-shot{background:var(--violet-wash)} .contact-intro p{color:#485043} .contact-intro .response{border-color:#c4cdbb} .contact-fieldset{border-top-color:#a5b29a} .contact-choice{border-color:#c7cfbf} .contact-choice:has(input:checked){background:#eef3e8;border-color:#a4b693;box-shadow:inset 0 0 0 1px #a4b693} .contact-choice input{accent-color:#59664c} .contact-choice small,.contact-hint,.contact-policy{color:#525a4b} .contact-required{background:#ebdcba;color:var(--ink)} .contact-optional{background:#eaf0e3;color:var(--ink)} .contact-field input,.contact-field textarea{background:#fafbf7;border-color:#bcc7b1} .contact-submit{background:#e4e8f5;border-color:#b4bddc;color:var(--ink)} .contact-submit:hover{background:#cfd6ed} .pp-digest,.callout{background:var(--green-wash)} .callout .dark-link{background:#ead7b0;border-color:#d4b87e} .callout .dark-link:hover{background:#e5c68b} .teacher-options button{border-color:#bec9b4} .teacher-options button:hover:not(:disabled){background:var(--green-wash)} .teacher-options button:disabled{background:#f2f3ef;color:#696e64} /* Reused unchanged screen content from the current corporate homepage. */ .sorotta-dashboard{background:#f8f6ef;border:1px solid #d9d6c9;border-radius:8px;overflow:hidden;color:#30332d;box-shadow:0 12px 35px #70534613;line-height:1.65;width:100%} .sd-top{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:16px 18px;background:#fff;border-bottom:1px solid #e4dfd4} .sd-top>b{font-size:20px;letter-spacing:.08em;display:flex;align-items:center;gap:9px} .sd-top>span{font-size:10px;color:#62665d} .sd-mark{width:22px;height:22px;display:inline-block;flex:none;background:radial-gradient(circle at 25% 25%,#d4a53b 0 3.5px,transparent 4px),radial-gradient(circle at 75% 25%,#dfa0a8 0 3.5px,transparent 4px),radial-gradient(circle at 25% 75%,#8174b8 0 3.5px,transparent 4px),radial-gradient(circle at 75% 75%,transparent 0 2px,#dfa0a8 2.5px 3.5px,transparent 4px)} .sd-tabs{display:flex;gap:24px;font-size:12px;background:#fff;padding:0 18px;border-bottom:1px solid #e6dfd5;color:#55594f} .sd-tabs>span{padding:10px 0} .sd-tabs .active{color:#7967b4;border-bottom:2px solid #7967b4;font-weight:700} .sd-inner{padding:18px} .sd-flow{background:#fff;padding:14px;border:1px solid #e5dfd3;border-radius:5px} .sd-flow>b{font-size:12px} .sd-flow>div{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px} .sd-flow span{font-size:10px;border:1px solid #e4dfd4;border-radius:18px;padding:4px 7px;color:#62665d} .sd-flow .done{color:#367e53} .sd-flow .current{color:#7562ad;background:#eeebf7;border-color:#d6cdef} .sd-flow .ui-check:before{content:"✓";margin-right:4px;font-style:normal} .sd-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:14px 0 18px} .sd-stats>div{padding:10px 8px;border:1px solid #e5dfd3;border-radius:5px;background:#fff} .sd-stats span{font-size:10px;color:#62665d;display:block;white-space:nowrap} .sd-stats b{font-size:28px;line-height:1.4;display:block;white-space:nowrap} .sd-stats small{font-size:14px} .sd-red{color:#b94e40}.sd-gold{color:#a87517} .sd-inner h5{font-size:12px;margin:0 0 9px;font-weight:700} .sd-alert{background:#fcf1ef;border:1px solid #e9c3bf;border-radius:5px;padding:14px} .sd-alert>b{color:#b94e40;font-size:13px} .sorotta-dashboard .sd-alert p{font-size:11px;line-height:1.7;margin:6px 0 9px;color:#55594f} .sd-alert>span{display:inline-block;padding:5px 12px;background:#41423f;color:#fff;border-radius:4px;font-size:11px} .sd-today{display:flex;justify-content:space-between;gap:10px;padding-top:17px;font-size:12px} .sd-today>span{font-size:10px;color:#62665d} .page-head h1{font-family:var(--font);font-size:clamp(38px,5vw,68px);font-weight:600;line-height:1.6;letter-spacing:.035em;overflow-wrap:normal} .product-title{font-family:var(--font);font-size:clamp(42px,4.7vw,64px);font-weight:600;line-height:1.5;letter-spacing:.035em;margin-bottom:30px} .display-title,.feature-layout .display-title{font-family:var(--font);font-size:clamp(28px,3.4vw,44px);font-weight:600;letter-spacing:.025em;line-height:1.7} .link b{font-family:var(--font);font-size:23px;font-weight:500;line-height:1.7;letter-spacing:.02em} .link small{display:none} .closing-link .en{font-family:var(--font);font-size:clamp(28px,3.4vw,46px);font-weight:500;line-height:1.6;letter-spacing:.025em} .menu-title{font-family:var(--font);font-size:clamp(28px,3.5vw,48px);font-weight:600;white-space:pre-line;line-height:1.8;letter-spacing:.035em} .hero-tabs button,.eyebrow,.footer-links b,.tool-no,.breadcrumb{font-family:var(--font);letter-spacing:.045em} .hero-index{font-family:var(--font);font-size:13px;letter-spacing:.18em} .hero-tabs{gap:20px} .hero-tabs button{font-size:13px;font-weight:500;letter-spacing:.035em} .section-bar .eyebrow{font-family:var(--en);font-size:12px;letter-spacing:.08em} .visual-caption,.school-art figcaption{font-family:var(--font);letter-spacing:.02em} .news-layout>div>p{display:none} @media(max-width:700px){.page-head h1{font-size:clamp(30px,7.8vw,44px);line-height:1.7}.product-title{font-size:42px;margin-bottom:24px}.display-title,.feature-layout .display-title{font-size:29px}.link b{font-size:19px}.closing-link .en{font-size:32px}.menu-title{font-size:28px}.hero-index{font-size:11px}.hero-tabs{gap:15px}.hero-tabs button{font-size:12px}.eyebrow{font-size:12px}} @media(max-width:1050px){.sd-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.sd-top{flex-wrap:wrap}.sd-today{display:block}.sd-today>span{display:block;margin-top:4px}} @media(max-width:700px){.brand-mark{width:29px;height:29px}.hero-art:after{background:linear-gradient(90deg,rgba(253,253,249,.99) 0%,rgba(253,253,249,.93) 42%,rgba(253,253,249,.55) 74%,rgba(253,253,249,.12))}.ribbon.three{right:38%;width:11%;opacity:.58}.section-label:before{width:9px}.closing-link+.closing-link{border-top-color:#c4cbbd}.sd-top{padding:12px;gap:6px}.sd-top>b{font-size:19px}.sd-top>span{font-size:10px}.sd-tabs{padding-inline:12px;gap:18px;font-size:11px}.sd-inner{padding:12px}.sd-flow{padding:11px}.sd-flow>b{font-size:11px}.sd-flow span{font-size:10px}.sd-stats{gap:7px;margin:12px 0 15px}.sd-stats>div{padding:10px}.sd-stats span{font-size:11px}.sd-stats b{font-size:28px}.sd-stats small{font-size:14px}.sd-alert{padding:12px}.sd-alert>b{font-size:12px}.sorotta-dashboard .sd-alert p{font-size:11px}.sd-today{font-size:12px}.sd-today>span{font-size:10px}} /* Final visual and interaction layer. Layout remains usable without JavaScript. */ :root{--ease:cubic-bezier(.22,1,.36,1);--hairline:#ced4c7;--header-height:88px} html{scroll-padding-top:calc(var(--header-height) + 28px)} body{text-rendering:optimizeLegibility} h1,h2,h3{font-feature-settings:"palt";text-wrap:balance} p{text-wrap:pretty} button,a,input,textarea,summary{touch-action:manipulation} a,button{transition:color .25s,background-color .25s,border-color .25s,box-shadow .3s,transform .45s var(--ease)} button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #5965a1;outline-offset:6px} .skip:focus{background:#e4e8f5;color:#191a19} .site-header{height:var(--header-height);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);background:rgba(255,255,255,.88);transition:box-shadow .4s,background .4s;border-bottom:1px solid #d9ddd266} .site-header.is-scrolled{background:rgba(255,255,255,.95);box-shadow:0 5px 30px #434d4810} .site-header:after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;transform-origin:left;transform:scaleX(var(--read-progress,0));background:linear-gradient(90deg,#e0b055,#92bd9d 34%,#8992c7 68%,#d9a094);pointer-events:none} .brand{letter-spacing:.1em;gap:12px} .brand-mark{transition:transform .65s var(--ease)} .brand:hover .brand-mark{transform:rotate(-9deg)} .header-links a{font-weight:500;padding-block:10px} .header-links a[aria-current="page"]:after{width:100%;background:#8992c7} .header-contact{border:1px solid #c9d0e4;border-radius:2px;padding:11px 17px;font-size:13px;color:#191a19;background:#f6f7fc} .header-contact:hover{background:#e6eaf5;border-color:#8992c7} .menu-toggle{position:relative;border:1px solid #cbd3c3;border-radius:50%;width:46px;height:46px;background:#ffffffa6;transition:background .3s,transform .4s var(--ease)} .menu-toggle:hover{background:#eaf0e4;transform:rotate(5deg)} .menu-toggle span{width:20px} .menu-panel{padding-top:70px;background:radial-gradient(ellipse at 0 100%,#eaf2e6,transparent 55%),radial-gradient(ellipse at 100% 0,#edf0fa,transparent 58%),#fff} .menu-grid{gap:10%;align-items:start} .menu-title{position:relative;padding-top:22px} .menu-title:before{content:"";position:absolute;left:0;top:0;width:76px;height:5px;background:linear-gradient(90deg,#e0b055 25%,#92bd9d 25% 50%,#8992c7 50% 75%,#d9a094 75%)} .menu-list a{padding:19px 0;font-weight:500;transition:padding .4s var(--ease),background .3s} .menu-list a[aria-current="page"]{border-bottom-color:#8992c7;background:linear-gradient(90deg,transparent,#eef0f8)} .menu-list .arrow{width:36px;height:36px;display:grid;place-items:center;border:1px solid #c3cbb9;border-radius:50%;font-size:19px;line-height:1} .hero{min-height:min(880px,calc(100svh - var(--header-height)));background:#fdfdf9;isolation:isolate} .hero-art{inset:-7% -3%;contain:paint;transform:translate3d(var(--art-x,0px),var(--art-y,0px),0);transition:transform 1.8s var(--ease)} .hero-art:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 80% 20%,#f0e0c166,transparent 48%),radial-gradient(ellipse at 70% 85%,#dce8d677,transparent 48%)} .hero-art:after{background:linear-gradient(90deg,#fdfdf9 0%,#fdfdf9f5 25%,#fdfdf9aa 49%,#fdfdf924 68%,transparent 90%)} .ribbon{right:13%;width:23%;height:150%;top:-20%;transform:skewX(-27deg);background:linear-gradient(100deg,#d9def5 0%,#b2badd 28%,#8992c7 68%,#aab2d9 96%);box-shadow:inset 1px 0 0 #ffffffab,inset -1px 0 0 #6673a72b,28px 8px 60px #5d69a80b;animation:fold-drift 14s ease-in-out infinite alternate;opacity:.98} .ribbon:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 10%,#ffffff55 34%,transparent 65%);opacity:.45;animation:fold-light 11s ease-in-out infinite alternate} .ribbon.two{right:-13%;width:21%;background:linear-gradient(100deg,#f4d8ce,#d9a094 60%,#e5bab0);opacity:.87;animation-delay:-7s} .ribbon.three{right:38%;width:11%;background:linear-gradient(100deg,#dbebd9,#92bd9d 72%,#bad3b7);opacity:.85;animation:fold-drift 17s ease-in-out infinite alternate-reverse;animation-delay:-5s} .ribbon.four{right:-27%;width:12%;background:linear-gradient(100deg,#f7e6b6,#e0b055 72%,#edcf8c);opacity:.87;animation-delay:-9s} @keyframes fold-drift{0%{translate:30px -8px;scale:1}100%{translate:-24px 14px;scale:1.04}} @keyframes fold-light{0%{opacity:.12;transform:translateX(-15%)}100%{opacity:.7;transform:translateX(15%)}} .motion-paused .ribbon,.motion-paused .ribbon:after,.ambient-paused .ribbon,.ambient-paused .ribbon:after{animation-play-state:paused} .hero-content{padding-block:100px 104px} .hero-topline{display:flex;align-items:center;gap:15px;font-size:14px;font-weight:500;letter-spacing:.08em;margin-bottom:40px} .hero-topline:before{content:"";width:28px;height:2px;flex:none;background:#b5c9a8} .hero h1{font-size:clamp(44px,5.7vw,88px);font-weight:600;line-height:1.58;letter-spacing:.035em} .hero h1 span{width:fit-content;position:relative;max-width:100%} .hero h1 span:last-child:after{content:"";position:absolute;bottom:.09em;left:0;width:calc(100% - 1em);height:.115em;background:linear-gradient(90deg,#e0b05590,#92bd9d80 36%,#8992c770 70%,#d9a09470);z-index:-1;transform-origin:left;animation:line-enter 1.4s .35s var(--ease) both} @keyframes line-enter{from{transform:scaleX(0)}to{transform:scaleX(1)}} .hero-bottom{margin-top:36px} .hero-bottom p{font-size:17px;line-height:2.05;letter-spacing:.035em} .hero-tabs{margin-top:36px;gap:18px;max-width:fit-content} .hero-tabs button{min-height:44px;border-bottom:1px solid transparent;color:#4c5048} .hero-tabs button[aria-pressed=true]{border-bottom-color:#829575} .hero-tabs .track{width:36px;background:#c8d1bf} .hero-tabs .track:after{width:18px} .hero-tabs:has(button:last-child[aria-pressed=true]) .track:after{left:18px} .hero-index{right:34px;top:40px;letter-spacing:.2em;font-size:12px;opacity:.75} .motion-control{border-radius:50%;width:42px;height:42px;right:31px;bottom:30px;background:#ffffffe0;border-color:#bbc5ad} .motion-control:hover{background:#fff;transform:scale(1.06)} .section-bar{min-height:68px;background:#fff;border-block-color:#cbd1c3;padding-block:17px} .section-label{font-size:16px;font-weight:500;letter-spacing:.045em} .section-label:before{height:20px;border-radius:1px} .section-bar .eyebrow{display:grid;place-items:center;min-width:30px;height:28px;border:1px solid #d1d7c8;line-height:1;font-size:11px;color:#40483b} .section-heading{font-weight:600;line-height:1.85;letter-spacing:.035em} .section-sub{font-size:16px;line-height:2.15} .section{padding-block:clamp(72px,8vw,128px)} .about-grid{gap:7%;margin-top:52px;grid-template-columns:1.15fr .85fr} .about-copy{padding-left:0} .about-copy p{font-size:16px;line-height:2.3} .school-art{isolation:isolate} .school-art:before{content:"";position:absolute;inset:13% 3% 10%;background:radial-gradient(ellipse,#e8f0e7a6,transparent 69%);z-index:-1} .school-art img{mix-blend-mode:multiply;transform:translateZ(0)} .school-art figcaption{padding-top:15px;margin-top:10px;border-top:1px solid #d6ddce;font-size:12px;color:#535b4b} .link-group{gap:26px} .link{padding:20px 0;min-height:80px;position:relative;isolation:isolate;overflow:hidden} .link:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#e8eee080);transform:translateY(101%);transition:transform .5s var(--ease);z-index:-1} .link:hover:before{transform:translateY(0)} .link b{font-size:21px;white-space:normal} .link .arrow{width:30px;height:30px;border:1px solid #cad2bf;border-radius:50%;display:grid;place-items:center;line-height:1;font-size:19px;flex:none} .text-link{position:relative;min-height:46px;font-size:15px;gap:26px;border-bottom-color:#a7b59b} .text-link:after{content:"";position:absolute;bottom:-1px;left:0;width:100%;height:1px;background:#5965a1;transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)} .text-link:hover:after{transform:scaleX(1);transform-origin:left} .products-section{background:linear-gradient(145deg,#f8f9fc,#f0f2fa 65%,#faf7f4)} .products-section .section-bar{background:#ecf0f8} .product{grid-template-columns:.8fr 1.2fr;gap:8%;padding-block:88px;align-items:center} .product .eyebrow{font-size:12px;letter-spacing:.05em} .product-title{font-size:clamp(44px,4.8vw,68px);font-weight:600;letter-spacing:.025em;margin:24px 0 32px} .product h3{font-size:clamp(24px,2.35vw,34px);font-weight:500;line-height:1.8} .product p{font-size:16px;line-height:2.1} .status{padding:3px 10px;font-size:11px;white-space:nowrap;border-radius:2px;vertical-align:middle;margin-top:7px;margin-bottom:7px} .product-visual{overflow:visible;padding:40px 28px 25px;background:linear-gradient(135deg,#dfe5f5,#edf0f9 58%,#cfd7ee);border:1px solid #c8d1e9;border-radius:3px;isolation:isolate;box-shadow:0 28px 65px -50px #4b608988;transition:transform .65s var(--ease),box-shadow .65s var(--ease)} .product-visual:before{z-index:-1;right:8%;width:21%;height:100%;top:0;background:linear-gradient(100deg,transparent,#b7c3e94d);transform:skewX(-21deg);clip-path:inset(0)} .product-visual:after{content:"";position:absolute;left:0;top:0;height:4px;width:100%;background:linear-gradient(90deg,#8992c7,#b1b9de,#92bd9d);border-radius:2px 2px 0 0} .product:nth-of-type(2) .product-visual,.sorotta-visual{background:linear-gradient(135deg,#f4e3dd,#fcf4ef 58%,#edcdc1);border-color:#e0bfb1;box-shadow:0 28px 65px -50px #95645188} .product:nth-of-type(2) .product-visual:after,.sorotta-visual:after{background:linear-gradient(90deg,#d9a094,#e4b5a6,#e0b055)} .product:nth-of-type(2) .product-visual:before,.sorotta-visual:before{background:linear-gradient(100deg,transparent,#d9a09433)} .product-visual img{box-shadow:0 18px 34px -16px #354b744a;border:1px solid #cad2e6;border-radius:2px} .image-button>span{display:flex;align-items:center;justify-content:end;min-height:44px;font-size:12px;gap:10px;margin-top:8px} .image-button>span:before{content:"";width:18px;height:1px;background:#a4aed0} .visual-caption{border-top:1px solid #b7c1dc88;padding-top:14px;gap:12px;font-size:11px;line-height:1.8;margin-top:4px} .sorotta-dashboard+.visual-caption{margin-top:20px} .sorotta-dashboard{box-shadow:0 18px 34px -22px #64472c55} .product-visual .sorotta-dashboard{background:#f8f6ef} .development-band{gap:10%;padding-block:86px;border-bottom:0;position:relative} .development-band:after{content:"";position:absolute;bottom:0;left:var(--gutter);right:var(--gutter);height:1px;background:linear-gradient(90deg,#e0b055,#92bd9d,#8992c7,#d9a094);opacity:.7} .development-band h2{font-weight:500;letter-spacing:.02em} .development-band .eyebrow{color:#363e31} .tool-grid{gap:25px;margin-top:56px} .tool-card{position:relative;padding-bottom:24px;overflow:hidden;border-bottom-color:#b9c5ae;transition:transform .6s var(--ease),border-color .3s} .tool-thumb{border:1px solid #e6dcc4;padding:24px;transition:background .45s;aspect-ratio:1.35;border-radius:2px} .tool-card:nth-child(2) .tool-thumb{border-color:#d2dfc9} .tool-card:nth-child(3) .tool-thumb{border-color:#e7cfc7} .tool-card:nth-child(4) .tool-thumb{border-color:#cfd5eb} .tool-thumb img{transform-origin:center;transition:transform .85s var(--ease)} .tool-card .tool-no{font-size:11px;color:#4c5443} .tool-card h3{font-weight:500;font-size:19px;line-height:1.8} .tool-card p{font-size:14px;line-height:1.95} .tool-card .arrow{font-size:21px;width:32px;height:32px;margin-left:auto;border:1px solid #c6cfba;border-radius:50%;display:grid;place-items:center;line-height:1} .tool-card:hover .arrow{transform:translateX(0);background:#e6ecde;border-color:#a7b598} .news-section{background:linear-gradient(120deg,#fcf7ec,#faf9f2)} .news-list a{transition:padding .4s var(--ease),background .4s} .news-list a:hover{padding-left:12px;background:linear-gradient(90deg,transparent,#efe6cb44)} .news-list a:hover h3{text-decoration:none} .news-list h3{line-height:1.9} .news-list .arrow{font-size:21px} .closing{padding-block:72px 86px;position:relative;background:radial-gradient(ellipse at 100% 100%,#f2f4ee55,transparent 65%),#fff} .closing-title{font-size:25px;font-weight:500;letter-spacing:.02em} .closing-grid{gap:0;border:1px solid #c8d0c0;border-radius:3px;overflow:hidden} .closing-link{padding:44px 42px;isolation:isolate} .closing-link+.closing-link{padding-left:42px} .closing-link:before{content:"";position:absolute;width:42%;height:180%;right:0;top:-30%;background:linear-gradient(90deg,transparent,#bac4e522);transform:skewX(-28deg);transition:translate .8s var(--ease);z-index:-1} .closing-link+.closing-link:before{background:linear-gradient(90deg,transparent,#dfbba944)} .closing-link .en{font-size:40px;font-weight:500;letter-spacing:.03em} .closing-link h3{font-weight:500} .closing-link .arrow{right:31px;top:49px;border:1px solid #b9c5d7;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:25px;line-height:1} .closing-link+.closing-link .arrow{border-color:#d9beb0} .closing-link:hover .arrow{transform:translate(0,0);background:#dce2f2;border-color:#8992c7} .closing-link+.closing-link:hover .arrow{background:#f1ddd1;border-color:#d9a094} .closing-link:hover:before{translate:-35px 0} .closing-link p{line-height:2;font-size:14px} .site-footer{padding-block:75px 28px} .footer-top{padding-bottom:60px} .footer-links b{color:#343d2d;font-weight:500;font-size:12px} .footer-links a{width:fit-content;min-height:32px;display:flex;align-items:center;margin-bottom:5px;font-size:14px} .footer-links a:hover{text-decoration:underline;text-underline-offset:6px;text-decoration-color:#8992c7} .footer-bottom{align-items:center} .footer-bottom a{min-height:32px;display:flex;align-items:center} .page-head{padding-block:43px 76px;border-bottom-color:#cbd3c1} .page-head:after{right:13%;width:10%;opacity:.8;border-inline:1px solid #ffffffa8} .page-head h1{font-weight:600;font-size:clamp(38px,4.8vw,68px);letter-spacing:.035em;line-height:1.6} .page-head .lead{font-weight:500;font-size:clamp(25px,2.5vw,36px);line-height:1.8} .breadcrumb{font-size:12px;display:flex;gap:10px;flex-wrap:wrap} .breadcrumb a{text-decoration:none} .breadcrumb a:hover{text-decoration:underline} .subnav{gap:12px 30px} .subnav a{min-height:44px;display:flex;align-items:center;border-color:#bdc8ae;transition:background .3s,border-color .3s} .subnav a:hover{border-color:#8992c7;background:#f1f3ea} .detail-grid{gap:9%} .detail-grid h2{font-weight:500;line-height:1.85} .feature-layout{gap:8%;grid-template-columns:.72fr 1.28fr} .feature-layout .display-title{font-size:clamp(28px,3vw,42px);font-weight:500;line-height:1.9} .feature-list h3{font-weight:500;line-height:1.8} .feature-list li{padding-block:29px} .feature-list p{line-height:2.1} .process-list{gap:4%} .process-list .num{font-size:48px;font-weight:400} .process-list h3{font-weight:500;line-height:1.8} .process-list li{position:relative} .process-list li:before{content:"";position:absolute;top:-1px;left:0;width:35px;height:2px;background:#92bd9d} .process-list li:nth-child(2):before{background:#e0b055}.process-list li:nth-child(3):before{background:#8992c7}.process-list li:nth-child(4):before{background:#d9a094} .faq details{padding-block:26px} .faq summary{font-weight:500;min-height:36px;align-items:center} .faq summary:after{width:32px;height:32px;border:1px solid #bcc8b0;border-radius:50%;display:grid;place-items:center;line-height:1;font-size:21px} .faq details[open] summary:after{background:#eaf0e3} .faq details p{padding-right:45px} .contact-intro{position:sticky;top:calc(var(--header-height) + 48px)} .contact-intro h2{font-weight:500} .contact-choice{padding:18px 15px;border-radius:3px;transition:background .25s,border-color .25s,box-shadow .25s} .contact-choice:hover{background:#f5f8f0;border-color:#aab99a} .contact-choice:has(input:focus-visible){outline:2px solid #5965a1;outline-offset:3px} .contact-field input,.contact-field textarea{border-radius:3px;transition:border-color .25s,box-shadow .25s,background .25s} .contact-field input:focus,.contact-field textarea:focus{outline:0;border-color:#8992c7;box-shadow:0 0 0 3px #8992c71a;background:#fff} .contact-fieldset legend{font-weight:500} .contact-submit,.dark-link{border-radius:3px;min-height:54px;font-weight:500;box-shadow:0 6px 12px -12px #48578c} .contact-submit:hover,.dark-link:hover{transform:translateY(-2px);box-shadow:0 9px 20px -15px #48578c80} .callout{padding:50px;border:1px solid #d9e2d0;border-radius:3px;background:linear-gradient(125deg,#f4f7ef,#eaf1e4)} .callout h2{font-weight:500} .company-table th{font-weight:500} .company-table tr:hover{background:#ffffff6b} .history-list h3{font-weight:500} .tool-shot{border-radius:3px;border:1px solid #dfd9c5} .tools-list>li:nth-child(2) .tool-shot{border-color:#cbdcc3}.tools-list>li:nth-child(3) .tool-shot{border-color:#e6ccc2}.tools-list>li:nth-child(4) .tool-shot{border-color:#cfd5e9} .tools-list h2{font-weight:500;line-height:1.8} .lightbox{border:1px solid #d3d9cb;border-radius:5px;box-shadow:0 30px 100px #0d19164d} .lightbox::backdrop{background:#18241fd9;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)} .dialog-close{border-radius:50%;width:38px;height:38px;display:grid;place-items:center;line-height:1;border-color:#bcc7b1;top:12px;right:14px} .dialog-close:hover{background:#edf2e7} .teacher-dialog{border-radius:5px;border-color:#c2cbb8;box-shadow:0 30px 70px #172b2d33} .teacher-options button{border-radius:3px;min-height:50px} .teacher-options button:focus-visible{outline-offset:3px} .demo{border-color:#b9c5d9;border-radius:3px;box-shadow:0 16px 50px -35px #3c56894d} .demo-top{background:#f0f3fa} .demo-cell{transition:background .25s,box-shadow .25s} .demo-cell.error:hover{box-shadow:inset 0 0 0 2px #b34c32} .demo-cell.changed:hover{box-shadow:inset 0 0 0 2px #718a6a} .reveal{transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:var(--reveal-delay,0ms)} .js .reveal.pending{transform:translateY(28px)} @media(hover:hover) and (pointer:fine){.product-visual:hover{transform:translateY(-5px);box-shadow:0 32px 65px -40px #4b608938}.product-visual:hover img{transform:none}.tool-card:hover{transform:translateY(-5px)}.tool-card:hover .tool-thumb img{transform:scale(1.045)}} @media(min-width:1051px){.feature-layout>div:first-child{position:sticky;top:calc(var(--header-height) + 40px);align-self:start}} @media(max-width:1050px){:root{--header-height:76px}.hero{min-height:670px}.header-contact{display:none}.product{gap:6%;grid-template-columns:1fr 1.15fr}.product-visual{padding:30px 20px 20px}.product .eyebrow{font-size:11px}.product-title{font-size:48px}.product h3{font-size:26px}.status{margin-left:0}.product .eyebrow+.status{display:table}.about-grid{gap:6%;grid-template-columns:1fr 1fr}.about-copy p{font-size:15px}.link b{font-size:18px}.feature-layout{gap:6%}.closing-link{padding:36px 28px}.closing-link+.closing-link{padding-left:28px}.closing-link .en{font-size:34px}.closing-link .arrow{right:22px;top:40px;width:42px;height:42px}.contact-intro{position:static}.menu-panel{padding-top:45px}} @media(max-width:700px){:root{--header-height:68px;--gutter:24px}.site-header{padding-inline:20px}.brand{font-size:21px;gap:10px}.brand-mark{width:29px;height:29px}.menu-toggle{width:42px;height:42px}.hero{min-height:650px;min-height:calc(91svh - var(--header-height));max-height:none}.hero-content{padding-block:72px 82px}.hero-art{inset:-5% -7%}.hero-art:after{background:linear-gradient(90deg,#fdfdf9fc 2%,#fdfdf9e8 34%,#fdfdf992 64%,#fdfdf924 91%)}.ribbon{right:7%;width:31%;height:145%;top:-18%;opacity:.95}.ribbon.two{right:-26%;width:27%}.ribbon.three{right:42%;width:13%;opacity:.8}.ribbon.four{right:-47%;width:17%}.hero h1{font-size:clamp(34px,8.6vw,56px);line-height:1.85;letter-spacing:.015em;font-weight:600}.hero-topline{font-size:11px;gap:10px;max-width:none;margin-bottom:32px;letter-spacing:.025em}.hero-topline:before{width:19px}.hero-bottom{margin-top:29px}.hero-bottom p{font-size:14px;line-height:2.1;letter-spacing:.025em}.hero-tabs{margin-top:27px;gap:16px}.hero-tabs button{font-size:12px;min-height:44px}.hero-index{right:18px;top:25px;font-size:10px}.motion-control{right:20px;bottom:23px;width:36px;height:36px;font-size:12px}.section-bar{min-height:60px;padding-block:15px}.section-label{font-size:14px;letter-spacing:.025em}.section-label:before{height:16px}.section-bar .eyebrow{width:26px;min-width:26px;height:24px;font-size:10px}.section{padding-block:65px}.section-heading{font-size:26px;line-height:1.9;letter-spacing:.015em}.section-sub{font-size:15px;line-height:2.1}.about-grid{grid-template-columns:1fr;margin-top:34px;gap:31px}.about-copy p{font-size:15px;line-height:2.2}.school-art{margin-inline:-10px}.school-art figcaption{margin-inline:10px;font-size:11px;padding-top:12px}.link-group{gap:24px;margin-top:28px}.link{min-height:69px;padding-block:17px}.link b{font-size:20px}.link .arrow{width:28px;height:28px;font-size:18px}.product{grid-template-columns:1fr;padding-block:48px;gap:34px}.product-title{font-size:44px;margin:18px 0 24px}.product h3{font-size:27px;line-height:1.8;margin-bottom:20px}.product p{font-size:15px;line-height:2.1}.product .eyebrow{font-size:12px}.product .eyebrow+.status{display:inline-block;margin-left:10px}.status{font-size:10px;padding:2px 8px}.product-visual{padding:27px 17px 16px;box-shadow:0 18px 35px -30px #4b608938}.product-visual:before{right:8%;transform:skewX(-15deg)}.image-button>span{font-size:12px;min-height:38px;margin-top:7px}.visual-caption{font-size:10px;flex-wrap:wrap;gap:3px 14px;padding-top:11px}.sorotta-dashboard+.visual-caption{margin-top:16px}.development-band{padding-block:58px;gap:25px}.development-band h2{font-size:28px;line-height:1.8}.development-band .eyebrow{margin-bottom:17px;font-size:12px}.tool-grid{gap:34px 17px;margin-top:36px}.tool-thumb{padding:12px;aspect-ratio:1.25;margin-bottom:17px}.tool-card{padding-bottom:19px}.tool-card h3{font-size:16px;line-height:1.8}.tool-card p{font-size:13px;line-height:1.95}.tool-card .tool-no{font-size:10px}.tool-card .arrow{width:29px;height:29px;font-size:18px;margin-top:15px}.news-layout{gap:25px}.news-list a{padding-block:23px}.news-list a:hover{padding-left:0}.news-list h3{font-size:15px;line-height:1.9}.news-list time{font-size:12px}.closing{padding-block:47px 55px}.closing-title{font-size:20px;line-height:1.9;margin-bottom:25px}.closing-link,.closing-link+.closing-link{padding:31px 25px}.closing-link .en{font-size:31px;line-height:1.6}.closing-link h3{font-size:15px;margin-top:10px}.closing-link p{font-size:13px;margin-top:12px;max-width:91%}.closing-link .arrow{width:40px;height:40px;font-size:23px;right:24px;top:35px}.site-footer{padding-block:52px 21px}.footer-top{gap:35px;padding-bottom:33px}.footer-links a{font-size:13px;min-height:34px}.footer-bottom{font-size:10px}.footer-bottom a{font-size:11px}.page-head{padding-block:30px 48px}.breadcrumb{font-size:11px;margin-bottom:29px}.page-head h1{font-size:clamp(31px,8vw,46px);line-height:1.7;letter-spacing:.015em}.page-head .lead{font-size:25px;line-height:1.8;margin-top:26px}.page-head .description{font-size:15px;line-height:2.1}.subnav{gap:8px 21px;margin-top:25px}.subnav a{font-size:13px;min-height:42px}.feature-layout{grid-template-columns:1fr;gap:30px}.feature-layout .display-title{font-size:29px;line-height:1.8}.feature-list h3{font-size:22px;line-height:1.8}.feature-list li{padding-block:25px}.feature-list p{font-size:15px}.detail-grid{grid-template-columns:1fr;gap:32px}.detail-grid h2{font-size:27px;line-height:1.85}.process-list{gap:33px 23px}.process-list .num{font-size:39px}.process-list h3{font-size:18px}.process-list p{font-size:14px;line-height:2}.faq details{padding-block:23px}.faq summary{font-size:16px;gap:16px;line-height:1.9}.faq summary:after{width:29px;height:29px;font-size:19px}.faq details p{padding-right:0;line-height:2.1}.callout{padding:28px 24px}.callout h2{font-size:24px;line-height:1.8}.contact-layout{gap:40px}.contact-choice{padding:17px 15px}.contact-intro h2{font-size:36px}.contact-submit{min-height:58px}.menu-panel{padding:32px 24px}.menu-grid{gap:24px}.menu-title{font-size:26px;padding-top:18px;line-height:1.8}.menu-title:before{width:54px;height:4px}.menu-list a{font-size:17px;padding-block:12px}.menu-list .arrow{width:29px;height:29px;font-size:17px}.dialog-close{width:40px;height:40px}.teacher-options button{font-size:15px}.teacher-dialog{padding-top:58px}.motion-control{min-width:40px;min-height:40px}} @media(max-width:370px){:root{--gutter:20px}.site-header{padding-inline:16px}.hero h1{font-size:32px}.hero-topline{font-size:10px}.product .eyebrow{font-size:11px}.product .eyebrow+.status{margin-left:6px}.hero-tabs{gap:11px}.hero-tabs button{font-size:11px}.closing-link,.closing-link+.closing-link{padding-inline:20px}.closing-link .arrow{right:18px}.link b{font-size:18px}.contact-choice b{font-size:14px}} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-art{transform:none!important}.hero h1 span:last-child:after{transform:none}.js .reveal.pending{opacity:1;transform:none}.product-visual,.tool-card{transform:none!important}} @media print{.site-header,.menu-panel,.hero-art,.hero-index,.hero-tabs,.motion-control,.closing,.site-footer,dialog,.actions,.subnav,.skip{display:none!important}.section,.page-head{padding-block:24px}.hero{min-height:0}.hero-content{padding-block:20px}.hero h1{font-size:36px}.section-heading{font-size:26px}.wrap{padding-inline:0}.reveal{opacity:1!important;transform:none!important}.feature-layout>div:first-child,.contact-intro{position:static}.product,.detail-grid,.about-grid{break-inside:avoid;gap:25px}body{font-size:11pt}a{color:#111}h1,h2,h3{break-after:avoid}} .work-feature{display:grid;grid-template-columns:1.12fr .88fr;gap:8%;align-items:center} .work-hero{display:block;position:relative;background:#fbf4e4;border:1px solid #e3d5b5;border-radius:3px;overflow:hidden;padding:27px 28px 0;box-shadow:0 28px 65px -50px #745d35aa;transition:transform .6s var(--ease),box-shadow .6s var(--ease)} .work-overline{font-size:11px;letter-spacing:.045em;display:block;color:#4f4a3c} .work-hero-title{font-size:clamp(25px,2.6vw,38px);line-height:1.85;font-weight:600;margin-top:22px;letter-spacing:.035em} .work-hero img{width:100%;margin-top:20px;mix-blend-mode:multiply;transition:transform .8s var(--ease)} .work-open{display:flex;justify-content:space-between;align-items:center;font-size:13px;padding:16px 0;border-top:1px solid #dacdab} .work-open>span{font-size:24px} .work-hero:hover{transform:translateY(-5px);box-shadow:0 28px 65px -40px #745d3544} .work-hero:hover img{transform:scale(1.025)} .work-copy h2{font-size:clamp(24px,2.4vw,34px);line-height:1.85;font-weight:500;margin:20px 0 25px} .work-copy p{line-height:2.15;color:#40473a} .work-points{list-style:none;margin:25px 0 28px;padding:0;border-top:1px solid #d0d8c6} .work-points li{border-bottom:1px solid #d0d8c6;padding:13px 0 13px 18px;position:relative;font-size:14px;line-height:1.9} .work-points li:before{content:"";position:absolute;left:0;top:24px;width:5px;height:5px;background:#92bd9d} .works-tools{background:#f7f8f4} .work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:55px 45px} .work-card{display:block;border-bottom:1px solid #bcc8b0;padding-bottom:27px;position:relative} .work-card .tool-thumb{aspect-ratio:1.7;margin-bottom:22px;padding:30px;background:#faf3e3;overflow:hidden} .work-card:nth-child(2) .tool-thumb{background:#eaf3e6;border-color:#c9d9c0} .work-card:nth-child(3) .tool-thumb{background:#f8ebe5;border-color:#e3c8bc} .work-card:nth-child(4) .tool-thumb{background:#ebedf7;border-color:#cbd2e8} .work-card .tool-thumb img{filter:none} .work-card .tool-no{font-size:12px} .work-card h3{font-size:24px;line-height:1.8;font-weight:500;margin:15px 0} .work-card p{font-size:15px;color:#485040;line-height:2;padding-right:30px} .work-card>.arrow{display:block;text-align:right;margin-top:15px} .work-card:hover .tool-thumb img{transform:scale(1.035)} .work-card:hover>.arrow{transform:translateX(5px)} @media(max-width:1050px){.work-feature{gap:6%}.work-copy h2{font-size:26px}.work-hero{padding:23px 22px 0}.work-hero-title{font-size:28px}.work-grid{gap:40px 30px}} @media(max-width:700px){.work-feature{grid-template-columns:1fr;gap:36px}.work-hero{padding:24px 21px 0}.work-overline{font-size:10px}.work-hero-title{font-size:26px;margin-top:20px}.work-hero img{margin-top:15px}.work-open{font-size:12px;padding-block:12px}.work-copy h2{font-size:25px;margin:17px 0 22px}.work-copy p{font-size:15px}.work-points li{font-size:13px}.work-grid{grid-template-columns:1fr;gap:37px}.work-card .tool-thumb{padding:25px;aspect-ratio:1.6}.work-card h3{font-size:22px}.work-card p{font-size:14px}.work-card .tool-no{font-size:11px}.work-card{padding-bottom:19px}.work-card>.arrow{margin-top:8px}} .service-hero{position:relative;isolation:isolate;padding:76px 0 0;background:#fff;border-bottom:1px solid #cbd1c3;overflow:hidden} .service-hero:before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,#e0b055,#92bd9d,#8992c7,#d9a094);opacity:.8} .service-hero-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:4%;align-items:center;padding-bottom:67px} .service-hero-copy{min-width:0;position:relative;z-index:1} .service-illustration{min-width:0;margin:0 -5% 0 -2%;align-self:center} .service-illustration img{display:block;width:100%;height:auto;object-fit:contain} @media(max-width:700px){.service-illustration{width:100%;max-width:540px;margin:-10px auto -4px}} .service-eyebrow{display:flex;align-items:center;gap:13px;font-size:13px;letter-spacing:.055em;font-weight:500;margin-bottom:26px;color:#30372d} .service-eyebrow:before{content:"";width:24px;height:3px;background:linear-gradient(90deg,#e0b055 0 25%,#92bd9d 25% 50%,#8992c7 50% 75%,#d9a094 75%);flex:none} .service-hero h1{font-size:clamp(30px,3.12vw,46px);line-height:1.8;letter-spacing:.015em;font-weight:600;white-space:nowrap;text-wrap:initial;margin:0} .service-hero-lead{font-size:16px;line-height:2.15;letter-spacing:.025em;margin-top:26px;max-width:31em;color:#42483e} .service-hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px 26px;margin-top:34px} .service-hero-actions .dark-link{font-size:14px;gap:26px;padding:15px 20px;min-height:52px;background:#e6eaf4;border-color:#b9c3dd;box-shadow:none} .service-hero-actions .dark-link:hover{background:#d5ddef} .service-hero-actions .text-link{font-size:14px;gap:18px} .service-areas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #ccd4c2} .service-areas>a{display:flex;gap:14px;align-items:flex-start;position:relative;padding:26px 24px 30px 0;isolation:isolate;min-width:0} .service-areas>a+a{padding-left:26px;border-left:1px solid #d9dfd0} .service-areas>a:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,#e9edf73b,#e9edf788);opacity:0;transition:opacity .4s;z-index:-1} .service-areas>a:nth-child(2):before{background:linear-gradient(120deg,#eaf1e43b,#eaf1e488)} .service-areas>a:nth-child(3):before{background:linear-gradient(120deg,#f4e9dd3b,#f4e9dd88)} .service-areas>a:hover:before{opacity:1} .service-area-no{font:12px/2.2 var(--en);color:#555d4b;flex:none;border-top:2px solid #8992c7;padding-top:4px;margin-top:2px} .service-areas>a:nth-child(2) .service-area-no{border-color:#92bd9d} .service-areas>a:nth-child(3) .service-area-no{border-color:#e0b055} .service-areas h2{font-size:18px;font-weight:500;line-height:1.7;letter-spacing:.01em} .service-areas p{font-size:13px;line-height:1.9;margin-top:7px;color:#4b5342} .service-areas .arrow{font-size:19px;flex:none;margin-left:auto;line-height:1.7} @media(max-width:1050px){.service-hero{padding-top:59px}.service-hero-grid{gap:5%;grid-template-columns:1.05fr 1fr;padding-bottom:52px}.service-hero h1{font-size:clamp(26px,3.15vw,34px)}.service-eyebrow{font-size:12px;gap:10px}.service-hero-lead{font-size:15px}.service-hero-actions{gap:13px 20px;margin-top:27px}.service-hero-actions .dark-link{font-size:13px;gap:17px}.service-hero-actions .text-link{font-size:13px}.service-areas>a{gap:10px;padding-right:15px}.service-areas>a+a{padding-left:17px}.service-areas h2{font-size:16px}.service-areas p{font-size:12px}} @media(max-width:700px){.service-hero{padding-top:41px;background:#fff}.service-hero-grid{grid-template-columns:1fr;gap:34px;padding-bottom:30px}.service-eyebrow{font-size:11px;margin-bottom:22px;gap:10px;letter-spacing:.02em}.service-eyebrow:before{width:20px}.service-hero h1{font-size:clamp(25px,7vw,34px);line-height:1.85;letter-spacing:.005em;font-weight:600}.service-hero-lead{font-size:14px;line-height:2.1;margin-top:20px;max-width:none}.service-hero-actions{margin-top:23px;gap:13px 19px}.service-hero-actions .dark-link{font-size:13px;padding:12px 16px;gap:16px;min-height:48px}.service-hero-actions .text-link{font-size:13px;gap:12px}.service-areas{grid-template-columns:1fr}.service-areas>a,.service-areas>a+a{padding:18px 0;border-left:0;gap:15px}.service-areas>a+a{border-top:1px solid #d9dfd0}.service-areas h2{font-size:16px;line-height:1.75}.service-areas p{font-size:12px;line-height:1.85;margin-top:3px}.service-areas .arrow{font-size:18px;align-self:center}.service-area-no{font-size:11px;line-height:1.9}.service-areas>a:last-child{padding-bottom:24px}} @media(max-width:370px){.service-hero h1{font-size:24px}.service-hero-actions{gap:13px}.service-hero-actions .dark-link{padding-inline:12px;font-size:12px;gap:13px}.service-hero-actions .text-link{font-size:12px;gap:10px}.service-hero-lead{font-size:14px}} @media print{.service-hero{padding-top:0;background:#fff}.service-hero-grid{gap:24px;padding-bottom:20px}.service-hero-actions,.service-areas{display:none}.service-hero h1{font-size:25px}} /* Product screens stay upright and stationary. */ .product-visual,.product-visual:hover,.product-visual img,.product-visual:hover img{transform:none!important} .product-visual,.product-visual img{transition:border-color .25s,box-shadow .25s} /* A softly colored, moving field for the shared illustration language. */ .service-hero{background:linear-gradient(115deg,#fafcff 4%,#eef4ff 63%,#faf1df);--hero-drift:9px} .service-hero:after{content:"";position:absolute;z-index:-1;inset:-12%;pointer-events:none;background:radial-gradient(ellipse at 80% 33%,#b9c2e571,transparent 44%),radial-gradient(ellipse at 47% 95%,#bad7be6b,transparent 41%),radial-gradient(ellipse at 99% 80%,#e6b6a261,transparent 36%);animation:hero-color-drift 14s ease-in-out infinite alternate} .service-hero-grid{position:relative;padding-bottom:77px} .service-illustration{mix-blend-mode:multiply} .service-illustration img{animation:hero-art-drift 6s ease-in-out infinite} .hero-motion-toggle{position:absolute;right:0;bottom:25px;display:inline-flex;align-items:center;gap:8px;padding:5px 10px;min-height:34px;border:1px solid #aab7ca;border-radius:30px;background:#ffffff70;color:#3e4c60;font:inherit;font-size:11px;line-height:1.5;cursor:pointer} .hero-motion-toggle:hover{background:#fff;border-color:#7185a3} .hero-motion-toggle:focus-visible{outline:2px solid #406ea6;outline-offset:4px} .hero-motion-symbol{display:inline-grid;place-items:center;width:12px;font-size:12px} .service-hero[data-motion-paused="true"]:after,.service-hero[data-motion-paused="true"] .service-illustration img{animation-play-state:paused} @keyframes hero-art-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(calc(-1 * var(--hero-drift)))}} @keyframes hero-color-drift{from{transform:translate3d(-2%,-1%,0);opacity:.7}to{transform:translate3d(3%,3%,0);opacity:1}} @media(max-width:700px){.service-hero{--hero-drift:7px;background:linear-gradient(160deg,#f8fbff 8%,#edf3ff 55%,#f8f0df)}.service-hero-grid{padding-bottom:63px}.hero-motion-toggle{bottom:18px;min-height:36px}} @media(prefers-reduced-motion:reduce){.service-hero:after,.service-illustration img{animation:none}.hero-motion-toggle{display:none}} @media print{.service-hero{background:#fff}.service-hero:after,.hero-motion-toggle{display:none}.service-illustration img{animation:none}} /* ===== 2026-09-14 文字尺度の見直し（関さん指示）===== 英字表示用に組まれた大きさが和文に残っていたので、本文16pxを基準に上を圧縮して段を揃える。 見出しは行間を締める（1.3〜1.5）。ラベル類（eyebrow / tool-no / status）は意図的に12px。注記は14px。 */ main h2{font-size:32px;font-weight:600;line-height:1.4;letter-spacing:.02em} main h2.section-heading{font-size:32px;line-height:1.5} main h2.display-title,.feature-layout .display-title{font-size:32px;font-weight:600;line-height:1.4} main h2.product-title{font-size:40px;line-height:1.3;margin-bottom:20px} .product h3{font-size:24px;font-weight:500;line-height:1.5} .contact-intro h2{font-size:32px;font-weight:600;margin:14px 0 24px} .callout h2{font-size:26px} .work-copy h2{font-size:28px} .section-titles h2{font-weight:600} .work-hero-title{font-size:28px;line-height:1.5} .service-hero h1{font-size:42px;line-height:1.4} .page-head h1{font-size:44px;font-weight:600;line-height:1.3;letter-spacing:.02em} .page-head .lead{font-size:20px;font-weight:400;line-height:1.8;margin-top:20px} .page-head .description{font-size:16px;line-height:2;margin-top:18px} main h3{line-height:1.5} main li>h3,.feature-list h3,.work-points h3{font-size:20px;font-weight:600} .tool-card h3,.work-card h3{font-size:18px;font-weight:600;line-height:1.5;margin:12px 0 8px} .tool-card p,.work-card p{font-size:14px;line-height:1.8;padding-right:0} .section-sub{font-size:16px;line-height:1.9} .breadcrumb,figcaption,.news-list small,.contact-form small{font-size:14px} .eyebrow,.section-bar .eyebrow,.tool-card .tool-no,.work-card .tool-no,.status,.work-overline,.service-eyebrow{font-size:12px} /* トップのお知らせ欄：3件で553px→約310px。分類ラベルを日付の横に寄せて1段に */ .news-section{padding-block:64px} .news-list a{padding-block:16px;align-items:baseline} .news-list a>div{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap} .news-list small{display:inline;margin:0;white-space:nowrap} .news-list h3{font-size:16px;font-weight:500;line-height:1.6;margin:0} .news-list time{font-size:14px;padding-top:0} .news-layout .actions{margin-top:20px} /* 制作実績：ツール4件は主役ではないので4列に */ .work-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 28px} .work-card{padding-bottom:18px;display:flex;flex-direction:column}.work-card>.arrow{margin-top:auto;padding-top:12px} .work-card .tool-thumb{aspect-ratio:1.5;padding:16px;margin-bottom:14px} /* 末尾CTA：飾り語「試してみる」を小見出しに格下げし、本来の見出しを主役に */ .closing{padding-block:56px 64px} .closing-title{font-size:28px;font-weight:600;line-height:1.4;margin-bottom:28px} .closing-link{padding:36px 42px} .closing-link .en{font-size:13px;font-weight:500;line-height:1.5;letter-spacing:.12em;color:#555} .closing-link h3{font-size:22px;font-weight:600;line-height:1.5;margin-top:10px} .closing-link p{font-size:15px;line-height:1.9;margin-top:12px} .closing-link .arrow{top:36px;font-size:22px;width:44px;height:44px} @media(max-width:1050px){.work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.page-head h1{font-size:38px}main h2.product-title{font-size:36px}} @media(max-width:700px){ .page-head h1{font-size:32px;line-height:1.4}.page-head .lead{font-size:18px;margin-top:16px}.page-head .description{font-size:15px} main h2,main h2.section-heading,main h2.display-title,.feature-layout .display-title,.contact-intro h2{font-size:26px;line-height:1.5} main h2.product-title{font-size:32px}.product h3{font-size:22px}.callout h2,.work-copy h2{font-size:24px}.work-hero-title{font-size:24px} .service-hero h1{font-size:32px;line-height:1.45} main li>h3,.feature-list h3{font-size:18px} .news-section{padding-block:48px}.news-list a{padding-block:14px}.news-list time{font-size:13px} .closing{padding-block:40px 48px}.closing-title{font-size:22px;margin-bottom:20px}.closing-link{padding:24px 22px}.closing-link+.closing-link{padding-left:22px} .closing-link .en{font-size:12px}.closing-link h3{font-size:20px}.closing-link p{font-size:14px}.closing-link .arrow{top:24px;right:18px;font-size:20px;width:40px;height:40px} .work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}.work-card h3{font-size:16px} } @media(max-width:440px){.work-grid{grid-template-columns:1fr}} /* ヘッダー：問い合わせは塗りのボタンに（薄い枠だけだと入力欄に見える）。メニューボタンは円枠を外して線だけに */ .header-contact{border:1px solid var(--ink);border-radius:3px;padding:11px 20px;font-size:14px;font-weight:500;letter-spacing:.02em;color:#fff;background:var(--ink)} .header-contact:hover{background:#3a3c3a;border-color:#3a3c3a;color:#fff} .menu-toggle{border:0;border-radius:0;background:none;width:44px;height:44px;gap:6px} .menu-toggle:hover{background:none;transform:none} .menu-toggle span{width:24px;height:1.5px} .menu-open .menu-toggle span:first-child{transform:translateY(3.75px) rotate(45deg)} .menu-open .menu-toggle span:last-child{transform:translateY(-3.75px) rotate(-45deg)} /* メニュー：全画面ではなく内容ぶんの高さのシートにし、下に暗幕を敷く。行間も詰める */ .menu-panel{bottom:auto;max-height:calc(100vh - 88px);padding:44px var(--gutter) 52px;border-bottom:1px solid var(--line);box-shadow:0 40px 60px -50px #0004} body.menu-open::after{content:"";position:fixed;inset:0;background:#17171766;z-index:58} .menu-grid{gap:8%;align-items:start} .menu-title{font-size:36px;line-height:1.5;padding-top:20px} .menu-meta{display:block;margin-top:24px;font-size:14px;line-height:1.9;color:var(--muted)} .menu-list a{padding:15px 0;font-size:18px;font-weight:500} .menu-list .arrow{width:32px;height:32px;font-size:17px} @media(max-width:1050px){.menu-panel{max-height:calc(100vh - 76px)}} @media(max-width:700px){ .menu-panel{max-height:calc(100vh - 68px);padding:28px 24px 44px} .menu-title{font-size:24px;line-height:1.6;padding-top:16px}.menu-meta{display:none} .menu-list a{padding:12px 0;font-size:17px}.menu-list .arrow{width:29px;height:29px;font-size:16px} } /* 見出し書体：Zen Kaku Gothic New（Google Fonts）。本文の Hiragino と顔を分ける。参照サイト（秀英角ゴ）に近い古典寄りのゴシック */ :root{--head:"Zen Kaku Gothic New",var(--font)} h1,h2,h3,.closing-title,.menu-title,.product-title,.display-title,.section-heading,.work-hero-title,.section-titles h2{font-family:var(--head);font-weight:700;letter-spacing:.04em;font-feature-settings:"palt"} .news-list h3,.sorotta-dashboard h5,.demo h4{font-family:var(--font)} .product h3,.tool-card h3,.work-card h3,.closing-link h3,main li>h3,.feature-list h3{font-weight:700} .service-hero h1{font-size:48px;line-height:1.35} .section{padding-block:clamp(56px,6.5vw,84px)} .news-section{padding-block:56px} @media(max-width:700px){.service-hero h1{font-size:34px;line-height:1.45}.section{padding-block:48px}.news-section{padding-block:40px}} /* 中黒（・）だけ Hiragino/游ゴシックの字形に差し替えて palt で詰める。Zen Kaku の全角中黒は前後が空きすぎるため */ @font-face{font-family:"Nakaguro";src:local("Hiragino Kaku Gothic ProN W6"),local("HiraKakuProN-W6"),local("Hiragino Sans W6"),local("Yu Gothic Bold"),local("YuGothic-Bold"),local("Noto Sans JP Bold");unicode-range:U+30FB;font-weight:700} :root{--head:"Nakaguro","Zen Kaku Gothic New",var(--font)} /* ヒーローの主 CTA と callout のボタンは、ヘッダーと同じ黒ベタに統一 */ .dark-link,.service-hero-actions .dark-link,.callout .dark-link{background:var(--ink);border-color:var(--ink);color:#fff;box-shadow:none} .dark-link:hover,.service-hero-actions .dark-link:hover,.callout .dark-link:hover{background:#3a3c3a;border-color:#3a3c3a;color:#fff;transform:none;box-shadow:none} .service-hero-actions .dark-link{font-size:14px;padding:15px 22px;gap:26px;min-height:52px} /* 制作実績の主役カード（埼玉説明会）：幅を 1.12fr→.8fr に落とし、文章側を主にする */ .work-feature{grid-template-columns:.8fr 1.2fr;gap:6%;align-items:center} .work-hero{padding:20px 22px 0} .work-copy h2{line-height:1.5;margin:14px 0 20px} .work-hero-title{font-size:22px;line-height:1.5;margin-top:14px} .work-hero img{margin-top:14px} .work-open{padding-block:12px;font-size:13px} @media(max-width:700px){.work-feature{grid-template-columns:1fr;gap:28px}.work-hero-title{font-size:20px}} /* ヒーローの学校イラスト：旧トップ（Astra 版）の CSS アニメーションを移植。school-world.webp の座標に依存する */ .school-art-motion{position:relative} .school-art-motion svg{display:block;width:100%;height:auto;overflow:visible} .school-person{transform-box:view-box} .school-teacher{transform-origin:616px 470px;animation:teacher-explain 4.8s -.6s ease-in-out infinite} .school-teacher-arm{transform-origin:600px 358px;animation:teacher-gesture 4.8s -.6s ease-in-out infinite} .school-arrival{transform-origin:557px 839px;animation:student-arrive 6s -1s ease-in-out infinite} .school-office{transform-origin:911px 309px;animation:office-review 4.6s -2s ease-in-out infinite} .school-paper{transform-origin:891px 224px;animation:paper-review 4.6s -2s ease-in-out infinite} .school-seated{animation-duration:var(--person-duration,4s);animation-delay:var(--person-delay,0s);animation-timing-function:ease-in-out;animation-iteration-count:infinite} .school-listen{animation-name:student-listen} .school-write{animation-name:student-write} .school-work{animation-name:staff-work} .school-talk{animation-name:student-talk} @media(max-width:600px){ .school-teacher{animation-name:teacher-explain-mobile;animation-duration:3.4s} .school-teacher-arm{animation-name:teacher-gesture-mobile;animation-duration:3.4s} .school-arrival{animation-name:student-arrive-mobile;animation-duration:4.2s} .school-office{animation-name:office-review-mobile;animation-duration:3.3s} .school-paper{animation-name:paper-review-mobile;animation-duration:3.3s} .school-seated{animation-duration:3.1s} .school-listen{animation-name:student-listen-mobile} .school-write{animation-name:student-write-mobile} .school-work{animation-name:staff-work-mobile} .school-talk{animation-name:student-talk-mobile}} @media(prefers-reduced-motion:reduce){.school-person{animation:none!important}} @media(prefers-reduced-motion:reduce){ .school-person.school-person{animation:none!important}} @keyframes office-review{0%,100%{transform:rotate(1deg)}40%,65%{transform:rotate(-3deg)}} @keyframes paper-review{0%,100%{transform:rotate(-2deg)}35%,65%{transform:rotate(13deg)}} @keyframes staff-work{0%,12%,90%,100%{transform:rotate(-3deg)}30%,68%{transform:rotate(7deg)}45%,54%{transform:rotate(3deg)}} @keyframes student-arrive{0%,100%{transform:translate(0,0) rotate(-1deg)}40%,65%{transform:translate(10px,-7px) rotate(2deg)}52%{transform:translate(10px,-9px) rotate(.5deg)}} @keyframes student-listen{0%,18%,82%,100%{transform:rotate(-3deg)}36%,48%{transform:rotate(7deg)}60%{transform:rotate(2deg)}69%{transform:rotate(5deg)}} @keyframes student-talk{0%,18%,100%{transform:rotate(-5deg)}40%,61%{transform:rotate(7deg)}80%,88%{transform:rotate(-1deg)}} @keyframes student-write{0%,15%,100%{transform:rotate(-3deg)}35%,72%{transform:rotate(8deg)}49%,59%{transform:rotate(5deg)}} @keyframes teacher-explain{0%,100%{transform:rotate(-1deg)}45%,60%{transform:rotate(3deg)}} @keyframes teacher-gesture{0%,100%{transform:rotate(3deg)}35%,50%{transform:rotate(-22deg)}72%{transform:rotate(-8deg)}} @keyframes office-review-mobile{0%,100%{transform:translateY(0) rotate(2deg)}42%,66%{transform:translateY(-4px) rotate(-7deg)}} @keyframes paper-review-mobile{0%,100%{transform:rotate(-4deg)}34%,67%{transform:translateY(-3px) rotate(22deg)}} @keyframes staff-work-mobile{0%,12%,90%,100%{transform:translateY(0) rotate(-5deg)}30%,68%{transform:translateY(3px) rotate(13deg)}46%,55%{transform:translateY(-2px) rotate(5deg)}} @keyframes student-arrive-mobile{0%,100%{transform:translate(0,0) rotate(-2deg)}38%,67%{transform:translate(24px,-13px) rotate(4deg)}52%{transform:translate(26px,-17px) rotate(1deg)}} @keyframes student-listen-mobile{0%,18%,82%,100%{transform:translateY(0) rotate(-5deg)}36%,49%{transform:translateY(-3px) rotate(13deg)}64%{transform:rotate(3deg)}} @keyframes student-talk-mobile{0%,18%,100%{transform:translateX(-2px) rotate(-8deg)}40%,61%{transform:translateX(4px) rotate(13deg)}80%,88%{transform:translateX(1px) rotate(-2deg)}} @keyframes student-write-mobile{0%,15%,100%{transform:translate(0,0) rotate(-5deg)}35%,72%{transform:translate(3px,2px) rotate(14deg)}50%,59%{transform:translate(1px,3px) rotate(7deg)}} @keyframes teacher-explain-mobile{0%,100%{transform:translateY(0) rotate(-2deg)}45%,62%{transform:translateY(-3px) rotate(7deg)}} @keyframes teacher-gesture-mobile{0%,100%{transform:rotate(5deg)}34%,52%{transform:rotate(-38deg)}74%{transform:rotate(-12deg)}} .service-illustration svg{display:block;width:100%;height:auto} /* 2026-09-14 追記：ヒーローは全員が常時動く版（旧トップの v1）。部屋ごとに順番に動く振り付け（ch-*）は関さんの判断で不採用。 iOS Safari で mix-blend-mode が効かず白い箱になるため、画像は白を透過にした school-world-alpha.webp を使う */ .school-walk{animation:none} /* ヘッダー：デスクトップもリンク4本を出さず、ロゴ・お問い合わせ・メニューの3要素にする（関さん指示 B） */ .header-links{display:none} /* モバイルの余白とお知らせ欄 */ @media(max-width:700px){ .service-hero h1{font-size:clamp(28px,8.2vw,34px)} .section{padding-block:40px}.closing{padding-block:36px 40px}.page-head{padding-block:24px 36px} .news-section{padding-block:36px}.news-layout{gap:14px}.news-layout .actions{margin-top:6px} .news-list a{display:grid;grid-template-columns:auto 1fr 22px;gap:4px 12px;align-items:baseline;padding-block:14px} .news-list time{grid-column:1;grid-row:1;font-size:13px} .news-list a>div{display:contents} .news-list small{grid-column:2;grid-row:1;font-size:13px} .news-list h3{grid-column:1/3;grid-row:2;font-size:15px;line-height:1.6} .news-list .arrow{grid-column:3;grid-row:1} .about-grid,.product{gap:20px} } @media(max-width:700px){ /* トップの無料ツール4件：2列の細いカードをやめ、サムネ左・文字右の1列リストに */ .tool-grid{grid-template-columns:1fr;gap:0} .tool-card{display:grid;grid-template-columns:104px 1fr;gap:2px 16px;align-items:start;padding:16px 0;border-bottom:1px solid #d9d9d9} .tool-card .tool-thumb{grid-column:1;grid-row:1/5;aspect-ratio:1.25;margin:0;padding:8px} .tool-card .tool-no,.tool-card h3,.tool-card p{grid-column:2} .tool-card h3{font-size:16px;margin:2px 0 4px}.tool-card p{font-size:13px;line-height:1.7} .tool-card>.arrow{grid-column:2;justify-self:end;margin-top:4px} } /* フッター：3列（プロダクト／お役立ち情報／会社情報）をやめ、6本を1列に（関さん指示） */ .footer-links{display:flex;flex-wrap:wrap;gap:4px 28px;align-content:start;padding-top:8px} .footer-links a{font-size:14px;min-height:36px;margin:0} @media(max-width:700px){.footer-links{gap:0 22px}.footer-links a{font-size:14px;min-height:40px}}