@scope (.otosystem) to (.o-module-content) {
/* OtosystemPretendard는 fonts/pretendard-subset.css(한글 분할 서브셋, 쓰인 글자 조각만 받음)에서 선언 */



:scope{--o-ink:#0d1b2a;--o-dark:#1b263b;--o-mid:#415a77;--o-soft:#778da9;--o-paper:#fff;--o-line:rgba(224,225,221,.22);--o-shadow:0 32px 64px rgba(13,27,42,.34);--o-gutter:max(clamp(24px,5vw,96px),calc((100vw - 1440px) / 2));--o-text:clamp(16px,.42vw + 9px,19px);--o-small:clamp(14px,.25vw + 9.5px,16px);--o-duration:240ms;--o-ease:cubic-bezier(.2,.65,.3,1);background:var(--o-ink);color:var(--o-paper);font:400 var(--o-text)/1.65 OtosystemPretendard,sans-serif;overflow:clip;isolation:isolate;text-align:left;word-break:keep-all;overflow-wrap:anywhere}
:scope :not(.o-module-content *),:scope :not(.o-module-content *)::before,:scope :not(.o-module-content *)::after{box-sizing:border-box}
:scope :where(h1,h2,h3,p,figure):not(.o-module-content *){margin:0}:scope :where(a:not(.o-module-content *)){color:inherit;text-decoration:none}:scope :where(button):not(.o-module-content *){font:inherit;cursor:pointer}:scope [data-inquiry-open]{padding:0;border:0;border-radius:0;background:transparent;color:inherit;text-align:left}:scope :where(a,button):not(.o-module-content *):focus-visible{outline:3px solid currentColor;outline-offset:5px}:scope img:not(.o-module-content *){display:block;max-width:100%;height:auto}:scope [hidden]:not(.o-module-content *){display:none!important}
:scope .o-header{min-height:104px;padding:24px var(--o-gutter);display:flex;align-items:center;gap:32px;position:relative;z-index:20;border-bottom:1px solid var(--o-line)}
:scope .o-logo{font:600 32px/1 OtosystemOutfit,OtosystemPretendard,sans-serif;letter-spacing:-1.5px;display:flex;align-items:center;min-height:48px;margin-right:auto}:scope .o-logo img{max-width:180px;max-height:48px}:scope .o-header-nav{display:flex;align-items:center;gap:32px}:scope .o-header-nav a{display:inline-flex;align-items:center;min-height:48px}:scope .o-button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;min-height:56px;padding:12px 24px;background:var(--o-paper);color:var(--o-ink);border:1px solid transparent;border-radius:0;font-weight:600;transition:background var(--o-duration),color var(--o-duration)}
:scope .o-button:hover{background:var(--o-soft);color:var(--o-ink)}:scope [data-menu-open],:scope [data-menu-close]{min-width:48px;min-height:48px;background:transparent;color:inherit;border:1px solid var(--o-line);padding:8px 16px}:scope .o-skip{position:absolute;left:24px;top:-100px;z-index:100;padding:12px 24px;background:var(--o-paper);color:var(--o-ink)}:scope .o-skip:focus{top:16px}
:scope #o-menu{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;border:0;background:var(--o-dark);color:var(--o-paper);padding:0 max(var(--o-gutter),env(safe-area-inset-right)) max(40px,env(safe-area-inset-bottom)) max(var(--o-gutter),env(safe-area-inset-left));overflow:auto;scroll-padding-block:calc(max(40px,env(safe-area-inset-top)) + 80px) 16px;-webkit-overflow-scrolling:touch}
:scope #o-menu::backdrop{background:var(--o-ink)}
:scope #o-menu .o-menu-top,:scope #o-menu .o-menu-body{max-width:1280px;margin-inline:auto}
:scope #o-menu .o-menu-top{position:sticky;top:0;z-index:1;background:var(--o-dark);padding:max(40px,env(safe-area-inset-top)) 0 16px}
:scope #o-menu [data-menu-close]{display:block;margin-inline-start:auto}
:scope #o-menu .o-menu-body{margin-top:48px;user-select:none}
:scope #o-menu .o-menu-primary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 64px;padding-bottom:40px}
:scope #o-menu .o-menu-primary>:is(a,button){display:flex;align-items:center;min-height:80px;font-size:40px;font-weight:500;line-height:1.2;letter-spacing:-.02em}
:scope #o-menu .o-menu-inquiry{justify-content:space-between;gap:16px;padding:16px 24px;background:var(--o-paper);color:var(--o-ink)}
:scope #o-menu .o-menu-inquiry:focus-visible{outline-color:var(--o-paper)}
:scope #o-menu .o-menu-secondary{padding:16px 0 0 24px}
:scope #o-menu .o-menu-section{min-width:0;border-top:1px solid var(--o-line)}
:scope #o-menu h2{font-size:24px;font-weight:500;line-height:1.3;letter-spacing:-.01em;margin-bottom:16px}
:scope #o-menu h3{font-size:18px;font-weight:500;line-height:1.3}
:scope #o-menu h3>a,:scope #o-menu h3>span{display:flex;align-items:center;min-height:48px}
:scope #o-menu ul{list-style:none;margin:0;padding:0}
:scope #o-menu li a,:scope #o-menu li span{display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px;min-height:48px;padding-block:8px;font-size:16px;line-height:1.5}
:scope #o-menu .o-menu-group{padding-bottom:16px}
:scope #o-menu details>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;padding-block:8px;font-size:16px;line-height:1.5;cursor:pointer;list-style:none}
:scope #o-menu details>summary:focus-visible{outline:3px solid currentColor;outline-offset:5px}
:scope #o-menu details>summary::-webkit-details-marker{display:none}
:scope #o-menu details>summary::after{content:'＋';flex-shrink:0;font-size:24px;transition:transform var(--o-duration) var(--o-ease)}
:scope #o-menu details[open]>summary::after{transform:rotate(45deg)}
:scope #o-menu .o-menu-third{margin:0 0 12px;padding-inline-start:16px;border-inline-start:1px solid var(--o-line)}
:scope #o-menu .o-menu-third li a,:scope #o-menu .o-menu-third li span{opacity:.78}
:scope #o-menu .o-menu-third li a:hover,:scope #o-menu .o-menu-third li a:focus-visible{opacity:1}
:scope #o-menu .o-menu-external{font-size:12px;opacity:.78}
:scope #o-menu .o-menu-modules{border-top:1px solid var(--o-line)}
:scope #o-menu .o-menu-modules>summary{min-height:64px;font-size:24px;font-weight:500;line-height:1.3;letter-spacing:-.01em}
:scope #o-menu .o-menu-platform{font-size:14px;font-weight:400;letter-spacing:0;opacity:.78}
:scope #o-menu .o-menu-section>summary{min-height:56px;font-size:18px;font-weight:500;line-height:1.3;letter-spacing:-.01em}
:scope #o-menu .o-menu-account{margin-top:32px;border-top:1px solid var(--o-line);padding-top:24px}
:scope #o-menu .o-menu-landings{margin-top:32px;border-top:1px solid var(--o-line);padding-top:24px}
:scope #o-menu .o-menu-landings h2{font-size:16px;margin-bottom:8px}
:scope #o-menu .o-menu-landings ul{display:flex;flex-wrap:wrap;gap:0 24px}
:scope #o-menu .o-menu-landings a{min-height:48px;text-decoration:underline;text-underline-offset:4px}
@media(max-width:767px){:scope #o-menu{scroll-padding-block-start:calc(max(24px,env(safe-area-inset-top)) + 80px)}:scope #o-menu .o-menu-top{padding-top:max(24px,env(safe-area-inset-top))}:scope #o-menu .o-menu-body{margin-top:24px}:scope #o-menu .o-menu-primary{grid-template-columns:1fr;gap:8px;padding-bottom:32px}:scope #o-menu .o-menu-primary>:is(a,button){min-height:64px;font-size:28px}:scope #o-menu .o-menu-inquiry{padding:12px 16px}:scope #o-menu .o-menu-secondary{padding-inline-start:16px}:scope #o-menu .o-menu-modules>summary{min-height:56px;font-size:20px}}

:scope .o-eyebrow{font-family:OtosystemOutfit,OtosystemPretendard,sans-serif;font-size:var(--o-small);letter-spacing:.12em;text-transform:uppercase;line-height:1.5}:scope .o-hero{position:relative;padding:64px var(--o-gutter) 0;min-height:1040px}:scope .o-hero h1{font-size:clamp(44px,6.6vw,112px);font-weight:600;letter-spacing:-.055em;line-height:1.14;max-width:1150px;margin-top:32px;position:relative;z-index:2;text-wrap:balance}:scope .o-hero-copy{display:flex;justify-content:space-between;align-items:center;gap:32px;margin-top:32px;position:relative;z-index:3}:scope .o-hero-copy p{max-width:560px;font-size:calc(var(--o-text) + 2px);color:var(--o-paper)}
:scope .o-hero-stage{height:560px;position:relative;margin:24px auto 0;max-width:1400px;pointer-events:none}:scope .o-screen{position:absolute;width:28%;box-shadow:var(--o-shadow)}:scope .o-screen img{width:100%;aspect-ratio:3/2;object-fit:cover}:scope .o-screen:nth-child(1){left:0;top:4%;z-index:4}:scope .o-screen:nth-child(2){left:24%;top:46%;z-index:3}:scope .o-screen:nth-child(3){left:48%;top:4%;z-index:1}:scope .o-screen:nth-child(4){left:72%;top:46%;z-index:2}
:scope .o-hero-stage::before{content:"";position:absolute;inset:-15% -12%;background:radial-gradient(ellipse at 46% 48%,color-mix(in srgb,var(--o-soft) 24%,transparent),transparent 65%);pointer-events:none}
:scope .o-screen{box-shadow:none}
:scope .o-screen-float{position:relative;overflow:hidden;box-shadow:var(--o-shadow)}
:scope .o-screen-float::after{content:"";position:absolute;inset:-20% auto -20% -35%;width:24%;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--o-paper) 22%,transparent) 48%,color-mix(in srgb,var(--o-paper) 4%,transparent) 58%,transparent);opacity:0;transform:translate3d(0,0,0) skewX(-18deg);pointer-events:none}
:scope .o-screen:nth-child(1){--o-float-y:-16px;--o-float-rotate:-.6deg;--o-float-time:6.4s;--o-shine-time:7.1s;--o-shine-delay:-2s}
:scope .o-screen:nth-child(2){--o-float-y:20px;--o-float-rotate:.8deg;--o-float-time:8.8s;--o-shine-time:8.3s;--o-shine-delay:-5.4s}
:scope .o-screen:nth-child(3){--o-float-y:-12px;--o-float-rotate:.5deg;--o-float-time:7.3s;--o-shine-time:6.7s;--o-shine-delay:-3.4s}
:scope .o-screen:nth-child(4){--o-float-y:18px;--o-float-rotate:-.7deg;--o-float-time:8.1s;--o-shine-time:8.9s;--o-shine-delay:-6.6s}
:scope.is-ambient-ready .o-screen-float{animation:o-ambient-float var(--o-float-time) ease-in-out infinite;animation-play-state:paused;will-change:transform}
:scope.is-ambient-ready .o-screen-float::after{animation:o-ambient-shine var(--o-shine-time) ease-in-out var(--o-shine-delay) infinite;animation-play-state:paused}
:scope.is-ambient-ready .o-hero-stage::before{animation:o-ambient-glow 18s ease-in-out infinite;animation-play-state:paused}
:scope.is-ambient-playing .o-screen-float,:scope.is-ambient-playing .o-screen-float::after,:scope.is-ambient-playing .o-hero-stage::before{animation-play-state:running}
@keyframes o-ambient-float{0%,100%{transform:translate3d(0,0,0) rotate(0)}50%{transform:translate3d(0,var(--o-float-y),0) rotate(var(--o-float-rotate))}}
@keyframes o-ambient-shine{0%,8%,100%{transform:translate3d(0,0,0) skewX(-18deg);opacity:0}40%{opacity:.7}62%{transform:translate3d(560%,0,0) skewX(-18deg);opacity:0}}
@keyframes o-ambient-glow{0%,100%{transform:translate3d(-7%,0,0);opacity:.65}50%{transform:translate3d(7%,-3%,0);opacity:1}}
:scope .o-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;margin-bottom:48px}:scope h2:not(.o-module-content *){font-size:clamp(36px,4.4vw,72px);line-height:1.2;letter-spacing:-.045em;font-weight:500;text-wrap:balance}:scope .o-section-heading h2{max-width:800px;margin-top:16px}:scope .o-section-heading>p{max-width:360px}:scope .o-projects{padding:96px var(--o-gutter);background:var(--o-paper);color:var(--o-ink)}
:scope .o-types{padding:112px var(--o-gutter)}:scope .o-types-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:64px}:scope .o-type-tabs{display:flex;flex-direction:column}:scope .o-type-tabs button{background:none;color:var(--o-paper);text-align:left;min-height:80px;border:0;border-bottom:1px solid var(--o-line);font-size:clamp(24px,2.5vw,40px);letter-spacing:-.035em;padding:16px 0;display:flex;justify-content:space-between;align-items:center;gap:24px}:scope .o-type-tabs button::after{content:'↗';font-family:OtosystemOutfit}:scope .o-type-tabs button[aria-selected=true]{background:var(--o-paper);color:var(--o-ink);padding-inline:24px}:scope .o-type-panel{margin-top:32px}:scope .o-type-panel img{width:100%;aspect-ratio:3/2;object-fit:cover}:scope .o-type-panel h3{font-size:24px;margin:24px 0 8px}:scope .o-type-panel p{max-width:640px}:scope .o-type-panels .o-type-panel:first-child{margin-top:0}
:scope .o-process{padding:96px var(--o-gutter);background:var(--o-dark)}:scope .o-process-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px}:scope .o-process-screen{position:relative;align-self:start;border:1px solid var(--o-soft);padding:32px;min-height:360px;display:flex;flex-direction:column;gap:24px}:scope .o-process-screen::before{content:'YOUR NEXT SITE';font:500 14px OtosystemOutfit,sans-serif;letter-spacing:.12em}:scope .o-process-screen svg{width:100%;height:auto;flex:1;color:var(--o-paper)}:scope .o-process-screen .o-wire{border:1px solid var(--o-soft);min-height:64px;padding:16px}:scope .o-process-steps{list-style:none;margin:0;padding:0}:scope .o-process-step{padding:32px 0;border-top:1px solid var(--o-line);display:grid;grid-template-columns:48px 1fr;gap:16px}:scope .o-process-step>span{font:400 24px OtosystemOutfit,sans-serif}:scope .o-process-step h3{font-size:24px;margin-bottom:8px}:scope .o-process-step p{max-width:480px}:scope .o-process-step.is-active{color:var(--o-paper)}
:scope .o-contact{background:var(--o-paper);color:var(--o-ink);padding:112px var(--o-gutter)}:scope .o-contact h2{font-size:clamp(40px,6.4vw,104px);max-width:1200px;margin:32px 0 40px}:scope .o-contact-body{display:flex;justify-content:space-between;gap:64px;align-items:flex-start}:scope .o-contact p{max-width:560px}:scope .o-contact .o-button{background:var(--o-ink);color:var(--o-paper);margin-top:32px;max-width:100%}:scope .o-contact ul{padding:0;list-style:none;max-width:440px;margin:0}:scope .o-contact li{border-bottom:1px solid var(--o-soft);padding:16px 0}:scope .o-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px;padding:48px var(--o-gutter);font-size:var(--o-small)}:scope .o-footer nav{display:flex;gap:24px;flex-wrap:wrap}:scope .o-footer :is(a,button[data-inquiry-open]){display:inline-flex;align-items:center;min-height:48px}:scope .o-footer-brand{font:500 32px OtosystemOutfit,sans-serif}
:scope .o-sub{background:var(--o-paper);color:var(--o-ink);padding:80px var(--o-gutter);min-height:70vh}:scope .o-sub-heading{max-width:1280px;margin:0 auto 48px;border-bottom:1px solid var(--o-soft);padding-bottom:40px}:scope .o-sub-heading h1{font-size:clamp(36px,4vw,64px);letter-spacing:-.04em;line-height:1.2;margin:16px 0}:scope .o-module-content{max-width:1280px;margin:auto;min-width:0;line-height:normal;word-break:normal;overflow-wrap:normal}:scope .o-preview-article{max-width:800px;line-height:1.75;word-break:keep-all;overflow-wrap:anywhere}:scope .o-preview-article h2{font-size:28px;margin:40px 0 16px}:scope .o-preview-article p{margin:16px 0}:scope .o-preview-table{width:100%;border-collapse:collapse}:scope .o-preview-table th,:scope .o-preview-table td{text-align:left;padding:16px;border-bottom:1px solid var(--o-soft)}
@media(min-width:1600px){:scope .o-hero{min-height:1200px}:scope .o-hero-stage{height:660px}}
@media(max-width:1000px){:scope .o-section-heading{align-items:flex-start;flex-direction:column;gap:24px}:scope .o-types-layout,:scope .o-process-layout{gap:40px}:scope .o-hero{min-height:900px}:scope .o-hero-stage{height:400px}:scope .o-screen{width:34%}:scope .o-screen:nth-child(2){left:22%}:scope .o-screen:nth-child(3){left:44%}:scope .o-screen:nth-child(4){left:66%}}
@media(max-width:767px){:scope .o-header{padding-block:16px;min-height:80px;gap:16px}:scope .o-logo{font-size:28px}:scope .o-header-nav{display:none}:scope .o-hero{padding-top:48px;min-height:auto}:scope .o-hero h1{font-size:clamp(40px,9.8vw,64px);margin-top:24px}:scope .o-hero-copy{flex-direction:column;align-items:flex-start;gap:24px;margin-top:24px}:scope .o-hero-copy p{font-size:16px}:scope .o-hero-stage{height:424px;margin-top:32px;width:100%}:scope .o-screen{width:52%}:scope .o-screen:nth-child(1){left:0;top:0}:scope .o-screen:nth-child(2){left:48%;top:24%}:scope .o-screen:nth-child(3){left:0;top:48%}:scope .o-screen:nth-child(4){left:48%;top:72%}:scope .o-projects,:scope .o-types,:scope .o-process,:scope .o-contact{padding:64px var(--o-gutter)}:scope .o-section-heading{gap:24px;margin-bottom:32px}:scope .o-types-layout,:scope .o-process-layout{display:block}:scope .o-type-tabs{margin-bottom:32px}:scope .o-type-tabs button{min-height:64px;font-size:24px}:scope .o-process-screen{min-height:240px;padding:24px;margin-bottom:40px}:scope .o-process-step{padding:24px 0;gap:8px;grid-template-columns:40px 1fr}:scope .o-contact-body{flex-direction:column;gap:40px}:scope .o-contact h2{margin:24px 0 32px}:scope .o-footer{flex-direction:column;align-items:flex-start;gap:24px;padding-block:32px}:scope .o-sub{padding:48px var(--o-gutter)}:scope .o-preview-table th,:scope .o-preview-table td{padding:12px 8px}:scope .o-contact .o-button{font-size:16px;gap:16px;padding:12px 16px}}
@media(max-width:767px){:scope .o-screen:nth-child(1){--o-float-y:-8px;--o-float-rotate:-.75deg}:scope .o-screen:nth-child(2){--o-float-y:10px;--o-float-rotate:1deg}:scope .o-screen:nth-child(3){--o-float-y:-6px;--o-float-rotate:.5deg}:scope .o-screen:nth-child(4){--o-float-y:9px;--o-float-rotate:-.9deg}}
@media(prefers-reduced-motion:reduce){:scope :not(.o-module-content *){scroll-behavior:auto!important;transition:none!important;animation:none!important}:scope :not(.o-module-content *)::before,:scope :not(.o-module-content *)::after{animation:none!important}:scope .o-screen{transform:none!important}:scope .o-hero-stage{perspective:none}:scope .o-process-content{clip-path:none!important}:scope .o-process-wire span{opacity:1!important;transform:none!important}}
:scope .o-section-heading{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr);gap:16px 64px}:scope .o-section-heading>.o-eyebrow{grid-column:1/-1;max-width:none}:scope .o-section-heading>h2{margin:0}:scope .o-section-heading>p:last-child{align-self:end}:scope .o-scroll-cue{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--o-line);padding:16px 0;min-height:56px;font-size:14px}:scope .o-contact-email{margin-top:24px}:scope .o-contact-email a{display:inline-flex;min-height:48px;align-items:center;text-decoration:underline}:scope .o-menu-top{display:flex;align-items:center;justify-content:space-between}:scope .o-menu-trigger{display:flex;align-items:center;gap:16px}:scope .o-process-wire{display:grid;grid-template-columns:1fr 1fr;gap:16px}:scope .o-process-wire span{border:1px dashed var(--o-soft);min-height:80px;transform-origin:left}:scope .o-process-wire span:first-child{grid-column:1/-1;min-height:40px}:scope .o-process-wire span:last-child{grid-column:1/-1;min-height:120px}:scope .o-process-content{position:absolute;inset:88px 48px 48px;background:var(--o-paper);color:var(--o-ink);display:flex;flex-direction:column;justify-content:space-between;padding:32px;font-family:OtosystemOutfit,sans-serif}:scope .o-process-content strong{font-size:clamp(32px,4vw,64px);font-weight:500;line-height:1.1}:scope .o-type-tabs button .o-type-number{font:400 14px OtosystemOutfit;margin-right:auto}:scope .o-empty{padding:48px 0}
@media(max-width:1000px){:scope .o-section-heading{grid-template-columns:1fr;gap:24px}:scope .o-section-heading>p:last-child{max-width:640px}}
@media(max-width:767px){:scope .o-process-content{inset:80px 40px 40px;padding:24px}:scope .o-type-tabs button{gap:16px}:scope .o-type-tabs button .o-type-number{margin-right:0}}

:scope .o-contact-body{display:grid;grid-template-columns:1.3fr 1fr;gap:24px 80px}:scope .o-contact-body>ul{grid-column:2;grid-row:1/5;width:100%;justify-self:end}:scope .o-contact-body>.o-button{justify-self:start;grid-column:1;margin-top:8px}:scope .o-contact-body>.o-contact-email{grid-column:1;margin:0}:scope .o-contact-other{grid-column:1;display:inline-flex;align-items:center;min-height:48px;text-decoration:underline}:scope .o-footer-group ul{list-style:none;padding:0;margin:0}:scope .o-footer-group>span{display:block;min-height:48px;padding-block:12px}
@media(max-width:767px){:scope .o-contact-body{grid-template-columns:1fr;gap:24px}:scope .o-contact-body>ul{grid-column:1;grid-row:auto;justify-self:start}:scope .o-contact-body>.o-button{margin-top:8px}}
:scope .o-preview-article a{color:var(--o-mid);display:inline-flex;align-items:center;min-height:48px}
/* Project gallery: outgoing scenes leave left as new scenes enter from the right. */
:scope .o-project-gallery{display:grid;grid-template-columns:176px minmax(0,1fr);gap:40px;align-items:start}
:scope .o-project-nav{display:grid;grid-template-columns:1fr;gap:16px;margin:0}
:scope .o-project-nav a{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:4px;background:transparent;border:1px solid var(--o-soft);color:var(--o-ink);transition:background var(--o-duration),border-color var(--o-duration)}
:scope .o-project-nav img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:left center;flex:none}
:scope .o-project-nav a>span{font:500 16px/24px OtosystemPretendard,sans-serif;text-align:center}
:scope .o-project-nav a[aria-selected=true]{background:var(--o-ink);border-color:var(--o-ink);color:var(--o-paper)}
:scope .o-project-nav a:hover{border-color:var(--o-ink)}
:scope .o-project-stage{min-width:0}
:scope .o-project{min-width:0;margin:0 0 48px;scroll-margin-top:24px}
:scope .o-project-image{display:block;overflow:hidden}
:scope .o-project-image img{width:100%;aspect-ratio:2/1;max-height:calc(100vh - 320px);object-fit:contain}
:scope .o-project-address{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px;padding:8px 0;border-bottom:1px solid var(--o-soft)}
:scope .o-project-address a{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;width:100%;font:500 clamp(18px,1.5vw,24px)/1.4 OtosystemOutfit,OtosystemPretendard,sans-serif;overflow-wrap:anywhere;min-width:0}
:scope .o-project-link-copy{display:grid;gap:2px;min-width:0}:scope .o-project-link-label{font:500 12px/1.4 OtosystemPretendard,sans-serif;letter-spacing:.08em;color:var(--o-mid)}
:scope .o-project-link-arrow{display:grid;place-items:center;flex:none;width:48px;height:48px;background:var(--o-ink);color:var(--o-paper);font:400 26px/1 OtosystemOutfit,sans-serif;transition:background var(--o-duration)}
:scope .o-project-address a:hover .o-project-link-arrow{background:var(--o-mid)}
:scope .o-project-address small{flex:none;font-size:14px}
:scope .o-project-gallery.is-gallery .o-project-stage{display:grid;overflow:clip}
:scope .o-project-gallery.is-gallery .o-project{grid-area:1/1;margin:0;align-self:start;background:var(--o-paper);visibility:hidden;transform:translateX(100%);pointer-events:none;transition:transform 650ms var(--o-ease),visibility 0s}
:scope .o-project-gallery.is-gallery .o-project.is-current{visibility:visible;transform:translateX(0);pointer-events:auto;z-index:1}
:scope .o-project-gallery.is-gallery .o-project.is-exiting{visibility:visible;transform:translateX(-100%)}
/* 자체 운영 서비스: 이미지 아래 소개와 방문 동작을 한 그룹으로 표시. */
:scope .o-project-service{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 0;border-bottom:1px solid var(--o-soft)}
:scope .o-project-intro{min-width:0;overflow-wrap:anywhere}
:scope .o-project-intro h3{font-size:24px;line-height:1.3;font-weight:500;margin-block:8px}
:scope .o-project-intro p{font-size:16px;line-height:1.5}
:scope .o-project-intro .o-project-category{font-size:14px;color:var(--o-mid)}
:scope .o-project-actions{display:flex;flex-shrink:0;gap:8px}
:scope .o-project-action{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:48px;padding:12px 16px;background:var(--o-ink);color:var(--o-paper);font-size:16px;line-height:1.5;border:1px solid var(--o-ink);transition:background var(--o-duration),color var(--o-duration)}
:scope .o-project-action-secondary{background:transparent;color:var(--o-ink)}
:scope .o-project-action:hover{background:var(--o-mid);color:var(--o-paper)}
:scope .o-project-action:focus-visible{outline:2px solid var(--o-ink);outline-offset:4px}
@media(max-width:767px){:scope .o-project-service{flex-direction:column;align-items:stretch;gap:12px;padding-block:12px}:scope .o-project-intro h3{margin-block:4px}:scope .o-project-actions{flex-direction:column}:scope .o-project-action{min-height:44px;padding-block:8px}}
/* 데스크톱 갤러리: 썸네일 열을 이미지 높이에 맞춰 줄여, 프로젝트 수가 늘어도 갤러리 높이를 키우지 않음 */
@media(min-width:768px){:scope .o-project-gallery.is-gallery .o-project-nav{align-self:stretch;display:flex;flex-direction:column;gap:8px}:scope .o-project-gallery.is-gallery .o-project-nav a{flex:1 1 0;min-height:0}:scope .o-project-gallery.is-gallery .o-project-nav img{flex:1 1 0;min-height:0;height:0;aspect-ratio:auto}}
:scope .o-kakao-icon{width:20px;height:20px;flex:none}
:scope .o-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:1000px){:scope .o-project-gallery{grid-template-columns:128px minmax(0,1fr);gap:24px}:scope .o-project-nav{gap:8px}}
@media(max-width:767px){:scope .o-project-gallery{display:block}:scope .o-project-nav{gap:8px;margin-bottom:24px}:scope .o-project-nav a{flex-direction:row;align-items:center;gap:16px;min-height:80px;padding:8px}:scope .o-project-nav img{width:112px}:scope .o-project-nav a>span{text-align:left}:scope .o-project-address{gap:16px}:scope .o-project-image img{max-height:none}:scope .o-project-image:has(source) img{aspect-ratio:3/2}}
@media(max-width:767px) and (max-height:650px){:scope .o-project-nav a{min-height:48px;padding:2px}:scope .o-project-nav img{width:64px}}
@media(max-width:767px){:scope .o-header:has(.o-admin-link){flex-wrap:wrap}:scope .o-header-nav:has(.o-admin-link){display:flex;order:3;width:100%}:scope .o-header-nav:has(.o-admin-link) .o-button{display:none}}
:scope .o-project-placeholder{font:400 clamp(16px,1.4vw,24px)/1.5 OtosystemOutfit,OtosystemPretendard,sans-serif;overflow-wrap:anywhere;min-width:0}
:scope .o-section-heading{position:sticky;top:0;z-index:3;padding-block:12px;background:var(--o-ink)}
:scope .o-projects>.o-section-heading{background:var(--o-paper)}
:scope .o-process>.o-section-heading{background:var(--o-dark)}
@media(max-width:767px){
  :scope .o-project-gallery.is-gallery .o-project-nav{display:flex;overflow-x:auto;scrollbar-width:thin}
  :scope .o-project-gallery.is-gallery .o-project-nav a{flex:none;width:200px}
  :scope .o-project-gallery.is-gallery .o-project-nav img{width:80px}
}
/* Silk scroll story: slide full-height screens through a clipped stage. */
:scope .o-types.is-scroll .o-types-layout{align-items:start;background:var(--o-ink)}
:scope .o-types.is-scroll .o-type-panels{display:grid;min-width:0;overflow:hidden}
:scope .o-types.is-scroll .o-type-panel{grid-area:1/1;margin:0;min-width:0;visibility:hidden;transform:translateY(100%);transition:transform 650ms var(--o-ease),visibility 0s 650ms}
:scope .o-types.is-scroll .o-type-panel.is-before{transform:translateY(-100%)}
:scope .o-types.is-scroll .o-type-panel.is-current{visibility:visible;transform:translateY(0);z-index:1;transition-delay:0s}
:scope .o-types.is-scroll .o-type-tabs button{transition:background var(--o-duration),color var(--o-duration)}
:scope .o-type-short{display:none}
@media(max-width:767px){
  :scope .o-types.is-tabs .o-type-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:24px;padding-block:4px}
  :scope .o-types.is-tabs .o-type-tabs button{min-width:0;justify-content:center;white-space:nowrap;font-size:16px;min-height:48px;padding:8px;gap:0;border:1px solid var(--o-line)}
  :scope .o-types.is-tabs :is(.o-type-number,.o-type-title){display:none}
  :scope .o-types.is-tabs .o-type-short{display:inline}
  :scope .o-types.is-tabs .o-type-tabs button::after{display:none}
  :scope .o-types.is-tabs .o-type-panel{margin-top:0}
}

:scope .o-footer-company{width:100%;border-top:1px solid var(--o-line);padding-top:24px;color:var(--o-soft);font-size:13px;line-height:1.65}:scope .o-footer-company p{display:flex;flex-wrap:wrap;gap:8px 24px}:scope .o-footer-company p+p{margin-top:8px}:scope .o-footer-company strong{color:var(--o-paper);font-weight:600}
:scope .o-footer-company a{min-height:0}

/* Silk: a constant, slow logo strip; the plain document remains scrollable. */
:scope .o-sites{position:sticky;bottom:0;z-index:2;margin-top:32px;padding-top:32px;background:var(--o-paper)}
:scope .o-sites-viewport{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding-block:8px;cursor:grab;user-select:none}
:scope .o-sites-viewport::-webkit-scrollbar{display:none}
:scope .o-sites-viewport:active{cursor:grabbing}
:scope .o-sites-viewport:focus-visible{outline:3px solid var(--o-ink);outline-offset:4px}
:scope .o-sites-track{display:flex;width:max-content}
:scope .o-sites-list{display:flex;flex:none;gap:32px;list-style:none;padding:0 32px 0 0;margin:0}
:scope .o-site{display:flex;flex:none;align-items:center;justify-content:center;width:208px;height:96px;padding:16px;font:500 18px/1.5 OtosystemOutfit,OtosystemPretendard,sans-serif;white-space:nowrap}
:scope .o-site img{width:176px;height:56px;object-fit:contain}
:scope .o-site:is([data-domain="composecoffee.com"],[data-domain="evergreenjb.me"],[data-domain="playwebon.com"],[data-domain="debt119.com"]) img{filter:brightness(0)}
:scope .o-sites.is-animated .o-sites-viewport{overflow:hidden}
:scope .o-sites.is-animated .o-sites-track{animation:o-sites-flow 120s linear infinite;animation-play-state:paused}
:scope .o-sites.is-playing .o-sites-track{animation-play-state:running}
@keyframes o-sites-flow{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){:scope .o-sites.is-animated .o-sites-viewport{overflow-x:auto}:scope .o-sites-list[aria-hidden=true]{display:none}}

:scope #o-inquiry{--o-field:#fff;width:min(720px,calc(100% - 32px));max-height:min(840px,calc(100dvh - 32px));margin:auto;padding:32px;border:1px solid var(--o-soft);border-radius:0;background:var(--o-paper);color:var(--o-ink);overflow:auto;overscroll-behavior:contain;font:400 16px/1.6 OtosystemPretendard,sans-serif}:scope #o-inquiry::backdrop{background:rgba(13,27,42,.8)}
:scope .o-inquiry-head{display:flex;justify-content:space-between;align-items:start;gap:24px;border-bottom:1px solid var(--o-soft);padding-bottom:16px}:scope .o-inquiry-head h2{font-size:36px;line-height:1.2;margin-top:8px}:scope .o-inquiry-head button,:scope .o-inquiry-success button{min-height:48px;padding:8px 16px;border:1px solid var(--o-ink);border-radius:0;background:transparent;color:var(--o-ink)}:scope #o-inquiry>p{margin:16px 0 24px}
:scope .o-inquiry-type{grid-column:1/-1}:scope .o-inquiry-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}:scope .o-inquiry-fields label{display:block;font-weight:600}:scope .o-inquiry-fields label span{display:inline;margin-left:4px;font-size:14px;font-weight:400}:scope .o-inquiry-fields input,:scope .o-inquiry-fields select,:scope .o-inquiry-fields textarea{display:block;width:100%;min-height:48px;margin-top:8px;padding:8px 12px;border:1px solid var(--o-mid);border-radius:0;background:var(--o-field);color:var(--o-ink);font:400 16px/1.5 OtosystemPretendard,sans-serif}:scope .o-inquiry-fields textarea{resize:vertical}:scope .o-inquiry-message{grid-column:1/-1}
:scope .o-inquiry-consent{display:grid;gap:16px;margin:24px 0}:scope .o-inquiry-consent label{display:flex;align-items:start;gap:12px;cursor:pointer}:scope .o-inquiry-consent input{flex:none;width:20px;height:20px;margin:3px 0 0;accent-color:var(--o-ink)}:scope .o-inquiry-consent span{font-size:14px;line-height:1.6}:scope .o-inquiry-consent strong{display:inline-block;margin-right:4px}:scope .o-inquiry-status{margin:0 0 16px;padding:12px 16px;border:1px solid var(--o-mid);border-left-width:4px;background:color-mix(in srgb,var(--o-soft) 22%,var(--o-field));color:var(--o-ink);font-weight:600}:scope .o-inquiry-submit{width:100%;min-height:56px;padding:12px 24px;border:1px solid var(--o-ink);border-radius:0;background:var(--o-ink);color:var(--o-paper);font-weight:600}:scope .o-inquiry-submit:disabled{opacity:.65;cursor:wait}:scope #o-inquiry:has(.o-inquiry-success:not([hidden]))>:is(.o-inquiry-head,#o-inquiry-intro){display:none}:scope .o-inquiry-success{padding:32px 0 16px}:scope .o-inquiry-success h3{font-size:28px;margin-bottom:24px}
:scope #o-inquiry :where(input,textarea,button):focus-visible{outline:3px solid var(--o-mid);outline-offset:3px}
@media(max-width:767px){:scope #o-inquiry{width:calc(100% - 16px);max-height:calc(100dvh - 16px);padding:24px}:scope .o-inquiry-fields{grid-template-columns:1fr}:scope .o-inquiry-message{grid-column:1}:scope .o-inquiry-head h2{font-size:30px}}

:scope .o-logo-mark{width:36px;height:36px;margin-right:12px}

/* B2B main: keep the existing palette, outer scroll transforms and sharp surfaces. */
:scope.o-is-main #o-main .o-hero{min-height:auto;padding-top:48px}
:scope.o-is-main #o-main .o-hero h1{font-size:clamp(36px,4.5vw,64px);max-width:1120px;letter-spacing:-.04em;line-height:1.2;margin-top:24px}
:scope.o-is-main #o-main .o-hero-copy p{max-width:720px}
:scope.o-is-main #o-main .o-b2b-actions{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;margin-top:24px;position:relative;z-index:3}
:scope.o-is-main #o-main .o-b2b-secondary{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:56px;padding:12px 0;border-bottom:1px solid currentColor;font-weight:600}
:scope.o-is-main #o-main .o-hero-stage{height:440px;margin-top:16px}
:scope.o-is-main #o-main .o-hero-stage::after{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(var(--o-line) 1px,transparent 1px),linear-gradient(90deg,var(--o-line) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse,black,transparent 70%)}
:scope.o-is-main #o-main .o-b2b-problems{padding:96px var(--o-gutter)}
:scope.o-is-main #o-main .o-b2b-problems h2,:scope.o-is-main #o-main .o-process h2{font-size:clamp(32px,3.5vw,48px);font-weight:500;line-height:1.25;letter-spacing:-.03em;max-width:960px}
:scope.o-is-main #o-main .o-b2b-problems{background:var(--o-dark)}
:scope.o-is-main #o-main .o-b2b-problems .o-section-heading{background:var(--o-dark);position:relative}
:scope.o-is-main #o-main .o-b2b-infra{border-top:1px solid var(--o-line)}
:scope.o-is-main #o-main .o-problem-list{display:grid;grid-template-columns:1fr;gap:0;margin-top:48px}
:scope.o-is-main #o-main .o-problem{--o-reveal:1;position:relative;display:grid;grid-template-columns:1fr 1.3fr;gap:40px;padding:32px 24px}
:scope.o-is-main #o-main .o-problem::before{content:'';position:absolute;inset:0;border-top:1px solid var(--o-soft);background:color-mix(in srgb,var(--o-mid) 12%,transparent);transform:scaleX(var(--o-reveal));transform-origin:left;pointer-events:none}
:scope.o-is-main #o-main .o-problem h3{font-size:24px;line-height:1.3;position:relative}
:scope.o-is-main #o-main .o-problem p{position:relative;max-width:640px}
:scope.o-is-main #o-main .o-b2b-screen{position:relative;overflow:hidden}
:scope.o-is-main #o-main .o-type-panel .o-b2b-screen img{width:100%;aspect-ratio:3/2;object-fit:contain}
:scope.o-is-main #o-main .o-type-panel small{display:block;font-size:var(--o-small);line-height:1.5;margin-top:16px}
:scope.o-is-main #o-main .o-work-motion{position:absolute;inset:0;pointer-events:none;color:var(--o-mid)}
:scope.o-is-main #o-main .o-work-motion-1::before{content:'';position:absolute;left:12%;right:12%;top:51%;border-top:2px solid currentColor}
:scope.o-is-main #o-main .o-work-motion-1 span:first-child{position:absolute;top:calc(51% - 6px);left:12%;width:76%;height:12px}
:scope.o-is-main #o-main .o-work-motion-2 span{position:absolute;left:27%;right:4%;height:9%;top:39%;border:2px solid currentColor;opacity:0}
:scope.o-is-main #o-main .o-work-motion-2 span:nth-child(2){top:49%;animation-delay:2s!important}
:scope.o-is-main #o-main .o-work-motion-2 span:nth-child(3){top:59%;animation-delay:4s!important}
:scope.o-is-main #o-main .o-work-motion-3 span{position:absolute;left:calc(50% - 32px);top:calc(45% - 32px);width:64px;height:64px;border:2px solid currentColor;border-radius:50%;opacity:0}
:scope.o-is-main #o-main .o-work-motion-3 span:nth-child(2){animation-delay:.65s!important}
:scope.o-is-main #o-main .o-work-motion-3 span:nth-child(3){animation-delay:1.3s!important}
:scope.o-is-main #o-main.is-b2b-ready .o-work-motion-1 span:first-child{animation:o-b2b-flow 7s var(--o-ease) infinite paused}
:scope.o-is-main #o-main.is-b2b-ready .o-work-motion-2 span{animation:o-b2b-row 6s var(--o-ease) infinite paused}
:scope.o-is-main #o-main.is-b2b-ready .o-work-motion-3 span{animation:o-b2b-ring 2s var(--o-ease) infinite paused}
:scope.o-is-main #o-main .is-b2b-playing .o-work-motion span,:scope.o-is-main #o-main.is-b2b-ready .is-b2b-playing .o-work-motion-1 span:first-child{animation-play-state:running}
:scope.o-is-main #o-main .o-sites{position:relative;bottom:auto;padding-bottom:24px}
:scope.o-is-main #o-main .o-sites h3{font-size:24px;line-height:1.3;margin-bottom:24px}
:scope.o-is-main #o-main .o-process-screen::before{content:'BUSINESS CONTINUITY'}
:scope.o-is-main #o-main .o-care-status{display:flex;gap:12px;align-items:center;font-family:OtosystemPretendard,sans-serif}
:scope.o-is-main #o-main .o-care-status::before{content:'';width:8px;height:8px;background:currentColor}
:scope.o-is-main #o-main.is-b2b-ready .o-care-status::before{animation:o-b2b-status 6s var(--o-ease) infinite paused}
:scope.o-is-main #o-main .is-b2b-playing .o-care-status::before{animation-play-state:running}
:scope.o-is-main #o-main .o-contact h2{font-size:clamp(36px,4.5vw,64px);line-height:1.2;letter-spacing:-.03em}
:scope.o-is-main #o-main .o-contact-body{display:block}
:scope.o-is-main #o-main .o-contact-channels{display:flex;align-items:center;flex-wrap:wrap;gap:32px;margin-top:32px}
:scope.o-is-main #o-main .o-contact-channels .o-button{margin:0;min-width:224px}
:scope.o-is-main #o-main .o-contact-note{margin-top:32px;font-size:var(--o-text);max-width:720px}
:scope.o-is-main #o-main .o-kakao-float{position:fixed;right:24px;bottom:max(16px,env(safe-area-inset-bottom));z-index:15;display:flex;align-items:center;gap:16px;min-height:48px;padding:12px 16px;background:var(--o-ink);color:var(--o-paper);border:1px solid var(--o-soft);font-size:14px}
:scope.o-is-main #o-main.is-motion-paused :is(.o-screen-float,.o-sites-track,.o-work-motion span),:scope.o-is-main #o-main.is-motion-paused .o-screen-float::after,:scope.o-is-main #o-main.is-motion-paused .o-hero-stage::before,:scope.o-is-main #o-main.is-motion-paused .o-care-status::before{animation-play-state:paused!important}
@keyframes o-b2b-flow{0%,10%{transform:translateX(0)}75%,100%{transform:translateX(100%)}}
@keyframes o-b2b-row{0%,30%,100%{opacity:0}10%,20%{opacity:1}}
@keyframes o-b2b-ring{0%{opacity:.6;transform:scale(.5)}100%{opacity:0;transform:scale(2)}}
@keyframes o-b2b-status{0%,100%{opacity:1}50%{opacity:.25}}
@media(max-width:767px){
:scope.o-is-main #o-main .o-hero h1{font-size:36px}
:scope.o-is-main #o-main .o-hero-stage{height:360px}
:scope.o-is-main #o-main .o-b2b-actions{display:grid;gap:16px}
:scope.o-is-main #o-main .o-b2b-actions .o-button{gap:16px;padding:12px 16px}
:scope.o-is-main #o-main .o-b2b-problems{padding:64px var(--o-gutter)}
:scope.o-is-main #o-main .o-problem{grid-template-columns:1fr;gap:24px;padding:24px 0}
:scope.o-is-main #o-main .o-contact-channels{display:grid;gap:16px}
:scope.o-is-main #o-main .o-kakao-float{right:12px;bottom:max(12px,env(safe-area-inset-bottom));width:56px;height:56px;min-height:0;padding:0;justify-content:center;border:0;border-radius:50%;background:var(--o-kakao);color:var(--o-kakao-ink);box-shadow:0 8px 20px rgba(0,0,0,.3)}
:scope.o-is-main #o-main .o-kakao-float .o-kakao-icon{width:28px;height:28px}
:scope.o-is-main #o-main .o-kakao-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}:scope.o-is-main #o-main .o-kakao-arrow{display:none}
:scope.o-is-main .o-footer{padding-bottom:96px}
:scope.o-is-main #o-main .o-process-screen{min-height:360px}
:scope.o-is-main #o-main .o-screen:nth-child(1){--o-float-rotate:-.3deg}
:scope.o-is-main #o-main .o-screen:nth-child(2){--o-float-rotate:.4deg}
:scope.o-is-main #o-main .o-screen:nth-child(3){--o-float-rotate:.25deg}
:scope.o-is-main #o-main .o-screen:nth-child(4){--o-float-rotate:-.35deg}
}

:scope.o-is-main #o-main .o-work-motion-1 span:first-child::before{content:"";display:block;width:12px;height:12px;background:currentColor;border-radius:50%}
@media(max-width:767px){:scope.o-is-main #o-main .o-types-layout{padding-bottom:64px}}

:scope.o-is-main #o-main #o-types .o-section-heading h2{font-size:clamp(32px,3.5vw,48px)}
@media(min-width:1001px){:scope.o-is-main #o-main .o-project-gallery{grid-template-columns:144px minmax(0,1fr)}}

:scope.o-is-main #o-main .o-type-panel h3{margin:0 0 8px;line-height:1.3}
:scope.o-is-main #o-main .o-type-panel p+p{margin-top:8px}
:scope.o-is-main #o-main .o-type-panel .o-b2b-screen{margin-top:16px}
@media(prefers-reduced-motion:reduce){:scope.o-is-main #o-main .o-problem::before{transform:none!important}}
:scope.o-is-main #o-main #o-types:not(.is-scroll) .o-section-heading{position:relative}
:scope.o-is-main #o-main .o-section-heading{padding-block:32px;margin-bottom:40px}
:scope.o-is-main #o-main .o-technology>.o-section-heading{background:var(--o-dark)}
:scope .o-type-tabs button .o-type-number{flex-shrink:0;white-space:nowrap}
@media(max-width:767px){
  :scope.o-is-main #o-main .o-section-heading{gap:24px;padding-block:24px;margin-bottom:32px}
}

/* Approved service landing composition; the existing palette and assets stay shared. */
:scope{--o-muted:#c5cdd8;--o-kakao:#fee500;--o-kakao-ink:#191919}
:scope.o-is-main #o-main .o-hero{padding-top:48px;padding-bottom:24px}:scope.o-is-main #o-main .o-hero h1{font-size:clamp(32px,4.6vw,60px);line-height:1.23;max-width:1160px;text-wrap:pretty}:scope.o-is-main #o-main .o-hero-copy{margin-top:24px}:scope.o-is-main #o-main .o-hero-copy p{font-size:18px;max-width:760px;line-height:1.75;color:var(--o-muted)}
:scope .o-tech-intro{margin-top:24px;position:relative;z-index:2}:scope .o-tech-intro>p:first-child{font-size:16px}:scope .o-tech-quick{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}:scope .o-tech-quick a{display:inline-flex;align-items:center;min-height:40px;padding:4px 16px;border:1px solid var(--o-soft);font-family:OtosystemOutfit,OtosystemPretendard,sans-serif;font-size:15px}:scope .o-tech-quick a:hover{background:var(--o-dark)}:scope .o-tech-intro-note{margin-top:8px;font-size:13px;color:var(--o-muted)}
:scope.o-is-main #o-main .o-hero-stage{height:440px;margin-top:24px;max-width:1120px}:scope .o-screen:nth-child(2),:scope .o-screen:nth-child(4){top:36%}:scope .o-hero-stage:before,:scope .o-hero-stage:after{display:none}:scope .o-screen{box-shadow:none}
:scope .o-technology{padding:80px var(--o-gutter);background:var(--o-dark)}:scope .o-technology h2{font-size:clamp(30px,3.5vw,48px);font-weight:500;line-height:1.25}:scope .o-tech-list{border-top:1px solid var(--o-soft);margin-top:48px}:scope .o-tech-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.7fr) auto;gap:32px;align-items:center;padding:32px 0;border-bottom:1px solid var(--o-line);scroll-margin-top:24px}:scope .o-tech-name>p{font-size:13px;color:var(--o-muted);margin-bottom:8px}:scope .o-tech-name h3{font:500 36px/1.2 OtosystemOutfit,OtosystemPretendard,sans-serif;letter-spacing:-.035em}:scope .o-tech-name>span{display:block;margin-top:4px;color:var(--o-muted);font-size:15px}:scope .o-tech-detail h4{font-size:20px;font-weight:500;margin:0 0 8px}:scope .o-tech-detail>p{color:var(--o-muted);font-size:16px;line-height:1.7;max-width:58ch}:scope .o-tech-detail ul{display:flex;flex-wrap:wrap;gap:8px 16px;list-style:none;margin:16px 0 0;padding:0;font-size:13px}:scope .o-tech-detail li{color:var(--o-paper)}:scope .o-tech-ask{display:flex;align-items:center;gap:16px;min-height:48px;padding:8px 0;border-bottom:1px solid var(--o-soft);font-size:14px}:scope .o-tech-ask:hover{color:var(--o-paper)}:scope .o-tech-guide{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-top:40px}:scope .o-tech-guide p{font-size:16px;color:var(--o-muted)}:scope .o-tech-guide strong{font-weight:500;color:var(--o-paper)}:scope .o-tech-guide a{min-height:48px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--o-soft)}

:scope.o-is-main #o-main .o-hero h1{white-space:pre-line}
:scope .o-tech-quick a{min-height:44px}

:scope .o-tech-ask{white-space:normal!important;border-bottom:1px solid var(--o-soft)}
:scope .o-inquiry-options{margin-top:24px;border-block:1px solid var(--o-soft);padding-block:8px}:scope .o-inquiry-options summary{min-height:48px;display:flex;align-items:center;cursor:pointer;font-weight:600}:scope .o-inquiry-options[open]>.o-inquiry-fields{margin:16px 0}
:scope .o-inquiry-technologies{grid-column:1/-1;min-width:0;padding:0;margin:0;border:0}:scope .o-inquiry-technologies legend{font-weight:600;margin-bottom:8px}:scope .o-inquiry-technologies legend span{font-weight:400;font-size:14px}
:scope .o-tech-options{display:flex;gap:8px;flex-wrap:wrap}:scope .o-tech-options label{display:flex;align-items:center;gap:8px;min-height:48px;padding:8px 12px;border:1px solid var(--o-mid);cursor:pointer;font-weight:400}:scope .o-tech-options input{width:20px;min-height:20px;height:20px;margin:0;padding:0;accent-color:var(--o-ink)}:scope .o-tech-options label span{margin:0;font-size:16px}
:scope .o-tech-options label:has(input:checked){background:var(--o-ink);color:var(--o-paper)}
:scope #o-inquiry :where(input,textarea,select,button,summary):focus-visible{outline:3px solid var(--o-mid);outline-offset:3px}
@media(max-width:1000px){:scope .o-tech-row{grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:16px 32px}:scope .o-tech-ask{grid-column:2;justify-self:start}}
@media(max-width:767px){
:scope.o-is-main #o-main .o-hero h1{font-size:clamp(30px,7.8vw,44px);line-height:1.25}:scope.o-is-main #o-main .o-hero-copy p{font-size:16px}:scope.o-is-main #o-main .o-hero-stage{height:max(424px,100vw);margin-top:24px}:scope .o-hero-stage::before,:scope .o-hero-stage::after{display:none}:scope .o-screen:nth-child(2){top:20%}:scope .o-screen:nth-child(3){top:44%}:scope .o-screen:nth-child(4){top:64%}
:scope.o-is-main #o-main .o-b2b-actions{gap:16px}:scope.o-is-main #o-main .o-b2b-actions>.o-button{width:100%;min-height:56px;white-space:normal}

:scope .o-technology{padding-block:48px}:scope .o-tech-list{margin-top:32px}:scope .o-tech-row{grid-template-columns:1fr;gap:24px;padding-block:32px}:scope .o-tech-name h3{font-size:32px}:scope .o-tech-detail h4{font-size:20px}:scope .o-tech-ask{grid-column:1;font-size:16px;min-height:48px}:scope .o-tech-guide{flex-direction:column;align-items:start}
}

:scope .o-contact-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px}:scope .o-contact-check h3{font-size:20px;font-weight:500}:scope .o-contact-check ol{list-style:none;padding:0;margin:24px 0 0}:scope .o-contact-check li{padding:16px 0;border-top:1px solid var(--o-line);display:grid;grid-template-columns:80px minmax(0,1fr);gap:16px}:scope .o-contact-check li>span{font-weight:500}:scope .o-contact-check li>p{font-size:16px;color:var(--o-mid)}
@media(max-width:767px){:scope .o-contact-layout{grid-template-columns:1fr;gap:48px}:scope .o-contact-check li{grid-template-columns:72px minmax(0,1fr)}:scope .o-contact h2{font-size:32px;line-height:1.25}:scope .o-contact-body>.o-contact-note{font-size:14px}:scope #o-menu .o-menu-primary>:is(a,button){white-space:normal}}

@media(max-width:360px){:scope .o-header{gap:8px}:scope .o-logo{font-size:24px;white-space:nowrap;flex-shrink:0}:scope .o-logo-mark{width:28px;height:28px;margin-right:8px}:scope .o-menu-trigger{gap:8px;padding:12px;white-space:nowrap;flex-shrink:0}}
:scope .o-tech-view{display:inline-flex;align-items:center;gap:8px;min-height:48px;margin-left:16px;white-space:nowrap;text-decoration:underline;text-underline-offset:4px}
:scope #o-tech .o-tech-list{position:relative;z-index:0}
:scope #o-tech .o-tech-row{position:relative;isolation:isolate}
:scope #o-tech .o-tech-row::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;pointer-events:none;background:linear-gradient(90deg,var(--o-soft),var(--o-paper),var(--o-soft));transform-origin:left;opacity:0}
:scope #o-tech .o-tech-row.is-tech-revealed::after{animation:o-tech-line 1.1s var(--o-ease) both}
@keyframes o-tech-line{0%{transform:scaleX(0);opacity:0}35%{opacity:1}70%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
:scope #o-tech .o-tech-ask{transition:border-color 200ms var(--o-ease)}
:scope #o-tech .o-tech-ask>span[aria-hidden=true]{display:inline-block;transition:transform 200ms var(--o-ease)}
:scope #o-tech .o-tech-ask:is(:focus-visible,:active){border-color:var(--o-paper)}
:scope #o-tech .o-tech-ask:is(:focus-visible,:active)>span[aria-hidden=true]{transform:translate(6px,-6px)}
@media(min-width:768px){
  :scope #o-tech .o-tech-row::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 85% 50%,color-mix(in srgb,var(--o-paper) 16%,transparent),transparent 65%),linear-gradient(110deg,var(--o-mid),var(--o-dark));border-left:2px solid var(--o-soft);opacity:0;transition:opacity 240ms var(--o-ease)}
  :scope #o-tech .o-tech-row:focus-within::before{opacity:.65}
}
@media(min-width:768px) and (hover:hover) and (pointer:fine){
  :scope #o-tech .o-tech-row:hover::before{opacity:.65}
  :scope #o-tech .o-tech-ask:hover{border-color:var(--o-paper)}
  :scope #o-tech .o-tech-ask:hover>span[aria-hidden=true]{transform:translate(6px,-6px)}
}
@media(prefers-reduced-motion:reduce){
  :scope #o-tech .o-tech-row::after{animation:none!important}
  :scope #o-tech .o-tech-row::before,:scope #o-tech .o-tech-ask,:scope #o-tech .o-tech-ask>span[aria-hidden=true]{transition:none}
  :scope #o-tech .o-tech-ask>span[aria-hidden=true]{transform:none!important}
}

/* otosystem header — 07 Segmented (Orizan main.css 팔레트), 기본 다크 + 라이트 */


/* ---------- 토큰 ---------- */
:scope{--o-white:#fff;--o-hero-bg:#161515;--o-light-text:#5C6972;--o-dark-text:#CDCDCD;--hs-sub:#120f0f;--hs-ink:#fff;--hs-line:rgba(207,208,212,.2);--h-bg:#161515;--h-surface:#1B1A1A;--h-card:#1F1E1E;--h-sub:#120f0f;--h-ink:#fff;--h-text:#CDCDCD;--h-muted:#ADADAD;--h-line:rgba(207,208,212,.2);--h-accent:#EFFB53;--h-accent-ink:#EFFB53;--h-on-accent:#151518;--h-shadow:0 20px 40px rgba(0,0,0,.35);--h-font:"OtosystemSatoshi Variable","OtosystemSatoshi",OtosystemOutfit,OtosystemPretendard,sans-serif}
:scope[data-theme="light"]{--hs-sub:#fff;--hs-ink:#151518;--hs-line:rgba(21,21,24,.12);--h-bg:#fff;--h-surface:#F2F2F2;--h-card:#fff;--h-sub:#fff;--h-ink:#151518;--h-text:#5C6972;--h-muted:#5C6972;--h-line:rgba(21,21,24,.12);--h-accent:#EFFB53;--h-accent-ink:#5f6800;--h-on-accent:#151518;--h-shadow:0 20px 40px rgba(21,21,24,.1)}

/* ---------- 헤더 ---------- */
:scope .o-header{display:flex;align-items:center;gap:24px;min-height:104px;padding:0 var(--o-gutter);background:var(--h-bg);color:var(--h-ink);border-bottom:1px solid var(--h-line);position:relative;z-index:30;transition:background .4s,color .4s,border-color .4s}
:scope .o-header .o-logo{display:flex;align-items:center;gap:8px;margin-right:0;min-height:48px;font:700 24px/1 var(--h-font);letter-spacing:-.02em;color:var(--h-ink);white-space:nowrap;flex-shrink:0}
:scope .o-header .o-logo-mark{display:block;width:28px;height:28px;margin:0;background:currentColor;-webkit-mask:url(../assets/130258fbc6131ea155d9.svg) center/contain no-repeat;mask:url(../assets/130258fbc6131ea155d9.svg) center/contain no-repeat}

/* 대메뉴 : 세그먼트 */
:scope .o-gnb{margin:0 auto;padding:4px;border-radius:50px;background:var(--h-card);border:1px solid var(--h-line)}
:scope .o-gnb-list{display:flex;gap:4px;margin:0;padding:0;list-style:none}
:scope .o-gnb-item{position:relative;list-style:none}
:scope .o-gnb-link{display:flex;align-items:center;min-height:48px;padding:0 24px;border-radius:30px;font:500 16px/1 var(--h-font);color:var(--h-text);white-space:nowrap;transition:all .4s ease-in-out}
/* 기본은 채움 없음 — 마우스 오버(키보드 포커스)일 때만 라임 채움 */
:scope .o-gnb-item.is-current>.o-gnb-link{color:var(--h-ink)}
:scope .o-gnb-item:hover>.o-gnb-link,:scope .o-gnb-item:focus-within>.o-gnb-link{background:var(--h-accent);color:var(--h-on-accent)}

/* 서브메뉴 : 09 Ghost Pill — 거의 투명한 유리 패널, 호버 행만 라임 캡슐
   ※ 헤더(.o-header)에는 backdrop-filter를 넣지 않습니다. 넣으면 이 패널의 블러가 뒤 화면에 닿지 않습니다. */
:scope .o-gnb-sub{position:absolute;top:calc(100% + 12px);left:0;min-width:280px;margin:0;padding:12px;list-style:none;background:color-mix(in srgb,var(--hs-sub) 18%,transparent);border:1px solid var(--hs-line);border-radius:20px;-webkit-backdrop-filter:blur(8px) saturate(150%);backdrop-filter:blur(8px) saturate(150%);opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .4s ease-in-out;z-index:40}
:scope .o-gnb-sub:before{content:"";position:absolute;left:0;right:0;bottom:100%;height:20px}
:scope .o-gnb-sub li{list-style:none}
:scope .o-gnb-sub a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;line-height:46px;border-radius:30px;font-size:16px;font-weight:600;color:var(--hs-ink);white-space:nowrap;transition:all .35s cubic-bezier(.2,.65,.3,1)}
:scope .o-gnb-sub .o-sub-arrow{opacity:0;transition:opacity .3s}
:scope .o-gnb-sub a:hover,:scope .o-gnb-sub a:focus-visible{background:rgba(239,251,83,.85);color:var(--h-on-accent);transform:scale(1.03);box-shadow:0 10px 24px rgba(239,251,83,.3);outline:none}
:scope .o-gnb-sub a:hover .o-sub-arrow,:scope .o-gnb-sub a:focus-visible .o-sub-arrow{opacity:1}
/* 라이트: 어두운 본문 위에서도 글자가 읽히도록 불투명도를 높임 */
:scope[data-theme="light"] .o-gnb-sub{background:color-mix(in srgb,var(--hs-sub) 72%,transparent);-webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%)}
@supports not (backdrop-filter:blur(1px)){:scope .o-gnb-sub{background:color-mix(in srgb,var(--hs-sub) 92%,transparent)}}
:scope .o-gnb-item:hover>.o-gnb-sub,:scope .o-gnb-item:focus-within>.o-gnb-sub{opacity:1;visibility:visible;transform:translateY(0)}

/* 우측 버튼 */
:scope .o-header .o-header-nav{display:flex;align-items:center;gap:12px;flex-shrink:0}
:scope .o-header .o-header-phone{font:700 18px/1 var(--h-font);color:var(--h-ink);white-space:nowrap}
:scope .o-header .o-admin-link{font-size:14px;color:var(--h-muted);min-height:48px}
:scope .o-header .o-admin-link:hover{color:var(--h-accent-ink)}
:scope .o-theme-toggle{display:grid;place-items:center;width:48px;height:48px;padding:0;border-radius:50%;border:1px solid var(--h-line);background:transparent;color:var(--h-ink);font-size:18px;cursor:pointer;transition:all .4s}
:scope .o-theme-toggle:hover{border-color:var(--h-accent-ink);color:var(--h-accent-ink)}
:scope .o-theme-light{display:none}
:scope[data-theme="light"] .o-theme-light{display:inline}
:scope[data-theme="light"] .o-theme-dark{display:none}
:scope .o-header .o-button{position:relative;z-index:1;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;min-width:0;margin:0;padding:0 24px;border-radius:30px;border:1px solid var(--h-line);background:var(--h-card);color:var(--h-accent-ink);font:700 15px/1 var(--h-font);white-space:nowrap;transition:.5s ease-in-out}
:scope .o-header .o-button:after{content:"";position:absolute;inset:0;background:var(--h-accent);clip-path:circle(0% at 50% 50%);transition:all cubic-bezier(0,.96,.58,1.1) .8s;z-index:-1}
:scope .o-header .o-button:hover{background:var(--h-card);color:var(--h-on-accent)}
:scope .o-header .o-button:hover:after{clip-path:circle(100% at 50% 50%);transition-duration:4s}
:scope .o-header .o-menu-trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:48px;height:48px;padding:0;border-radius:50%;border:1px solid var(--h-line);background:transparent;color:var(--h-ink);font-size:16px;cursor:pointer;transition:all .4s}
:scope .o-header .o-menu-trigger:hover{border-color:var(--h-accent-ink);color:var(--h-accent-ink)}
:scope .o-menu-trigger-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- 반응형 ---------- */
@media (max-width:1399px){:scope .o-gnb-link{padding:0 16px;font-size:15px}}
@media (max-width:1199px){
  :scope .o-gnb{display:none}
  :scope .o-header .o-header-nav{margin-left:auto}
  :scope .o-header .o-menu-trigger{width:auto;padding:0 16px;border-radius:30px}
  :scope .o-menu-trigger-label{position:static;width:auto;height:auto;overflow:visible;clip:auto}
}
@media (max-width:767px){
  :scope .o-header{min-height:72px;gap:12px;flex-wrap:nowrap}
  :scope .o-header .o-logo{font-size:21px}
  :scope .o-header .o-logo-mark{width:24px;height:24px}
  :scope .o-header .o-header-nav{display:flex;width:auto;order:0;gap:8px}
  :scope .o-header .o-button,:scope .o-header .o-header-phone,:scope .o-header .o-admin-link{display:none}
  :scope .o-theme-toggle,:scope .o-header .o-menu-trigger{height:44px}
  :scope .o-theme-toggle{width:44px}
}
@media (prefers-reduced-motion:reduce){:scope .o-gnb-sub a{transform:none!important}:scope .o-gnb-sub,:scope .o-gnb-link,:scope .o-header .o-button:after{transition:none}}

/* ---------- 메인: 히어로 영상 위 투명 헤더 ---------- */
:scope.o-is-main .o-header{position:absolute;top:0;left:0;right:0;background:transparent;border-bottom-color:transparent;
  --h-ink:#fff;--h-text:rgba(255,255,255,.82);--h-muted:rgba(255,255,255,.6);--h-line:rgba(255,255,255,.24);--h-card:rgba(255,255,255,.08);--h-surface:rgba(255,255,255,.14);--h-accent-ink:#EFFB53}
:scope.o-is-main .o-gnb{-webkit-backdrop-filter:none;backdrop-filter:none}

:scope :is(.o-header .o-logo,.o-foot .o-foot-logo,#o-menu.o-fm .o-fm-logo){display:inline-flex;align-items:center;gap:12px;font:600 32px/1 OtosystemOutfit,OtosystemPretendard,sans-serif;letter-spacing:-1.5px;white-space:nowrap}
:scope :is(.o-logo,.o-foot-logo,.o-fm-logo) .o-identity-mark{display:block;flex:none;width:36px;height:36px;max-height:none}
:scope :is(.o-logo,.o-foot-logo,.o-fm-logo) .o-identity-upload{display:block;width:auto;max-width:180px;height:auto;max-height:48px}
:scope[data-theme="light"] .o-identity-mark{filter:brightness(0)}
:scope.o-is-main .o-header .o-identity-mark{filter:none}
@media(max-width:767px){
  :scope :is(.o-header .o-logo,.o-foot .o-foot-logo,#o-menu.o-fm .o-fm-logo){gap:8px;font-size:24px}
  :scope :is(.o-logo,.o-foot-logo,.o-fm-logo) .o-identity-mark{width:28px;height:28px}
}

/* otosystem 전체 메뉴(☰) — 06 Card Columns + 04 라임 띠(수치·연락처·문의) */
:scope #o-menu.o-fm{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;display:none;flex-direction:column;overflow-y:auto;background:var(--sec-grain) var(--h-bg);color:var(--h-ink);
  --fm-px:var(--o-gutter);--fm-py:clamp(24px,4.5vh,48px)}
:scope #o-menu.o-fm[open]{display:flex}
:scope #o-menu.o-fm::backdrop{background:var(--h-bg)}
/* 기존 규칙 초기화 */
:scope #o-menu.o-fm .o-fm-top,:scope #o-menu.o-fm .o-fm-body{width:auto;max-width:none;margin:0;user-select:auto}
:scope #o-menu.o-fm [data-menu-close]{display:inline-flex;margin:0}
:scope #o-menu.o-fm li a{display:block;min-height:0;line-height:1.6}
/* 상단 */
:scope #o-menu.o-fm .o-fm-top{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;flex:none;padding:var(--fm-py) var(--fm-px) 12px;background:var(--sec-grain) var(--h-bg)}
:scope #o-menu.o-fm .o-fm-logo{display:flex;align-items:center}
:scope #o-menu.o-fm .o-fm-tools{display:flex;align-items:center;gap:24px}
:scope #o-menu.o-fm .o-fm-txt{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0;border:0;background:none;font:500 14px/1 var(--h-font);color:var(--h-text);cursor:pointer;transition:color .3s}
:scope #o-menu.o-fm .o-fm-txt span[aria-hidden]{font-size:18px}
:scope #o-menu.o-fm .o-fm-txt:hover,:scope #o-menu.o-fm .o-fm-txt:focus-visible{color:var(--h-accent-ink)}
/* 본문 */
:scope #o-menu.o-fm .o-fm-body{flex:1;display:flex;flex-direction:column;gap:16px;padding:clamp(24px,5vh,56px) var(--fm-px) var(--fm-py)}
:scope #o-menu.o-fm .o-fm-map{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-content:start}
:scope #o-menu.o-fm .o-fm-col{padding:clamp(16px,2vw,24px);border-radius:22px;background:var(--h-card);border:1px solid var(--h-line);transition:border-color .3s,transform .3s}
:scope #o-menu.o-fm .o-fm-col:hover{border-color:color-mix(in srgb,var(--h-accent-ink) 55%,transparent);transform:translateY(-3px)}
:scope #o-menu.o-fm .o-fm-tag{display:block;margin-bottom:12px;font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:var(--h-accent-ink)}
:scope #o-menu.o-fm .o-fm-h{display:block;margin-bottom:16px;font-size:24px;font-weight:700;letter-spacing:-.03em;color:var(--h-ink);transition:color .3s}
:scope #o-menu.o-fm .o-fm-h:hover,:scope #o-menu.o-fm .o-fm-h:focus-visible{color:var(--h-accent-ink)}
:scope #o-menu.o-fm .o-fm-list{display:grid;gap:4px;margin:0;padding:0;list-style:none}
:scope #o-menu.o-fm .o-fm-list a{position:relative;display:flex;align-items:center;min-height:44px;padding:4px 0;font-size:15px;color:var(--h-text);transition:color .25s,padding-left .25s}
:scope .o-foot-menu .o-foot-group li a{display:flex;align-items:center;min-height:44px}
:scope .o-foot-menu .o-foot-group:first-child ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
@media(max-width:900px){:scope .o-foot-menu .o-foot-group:first-child{flex-basis:100%;min-width:0}}
:scope #o-menu.o-fm .o-fm-list a:before{content:"";position:absolute;left:0;top:calc(50% - 3px);width:6px;height:6px;border-radius:50%;background:var(--h-accent-ink);opacity:0;transform:scale(.4);transition:opacity .25s,transform .25s}
:scope #o-menu.o-fm .o-fm-list a:hover,:scope #o-menu.o-fm .o-fm-list a:focus-visible{padding-left:12px;color:var(--h-accent-ink)}
:scope #o-menu.o-fm .o-fm-list a:hover:before,:scope #o-menu.o-fm .o-fm-list a:focus-visible:before{opacity:1;transform:scale(1)}
/* 라임 띠 : 수치 · 연락처 · 문의 */
:scope #o-menu.o-fm .o-fm-band{display:flex;align-items:center;gap:clamp(16px,3vw,32px);flex:none;padding:24px clamp(24px,3vw,40px);border-radius:24px;background:var(--h-accent);color:var(--h-on-accent)}
:scope #o-menu.o-fm .o-fm-stats{flex:1.5;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
:scope #o-menu.o-fm .o-fm-stats b{display:flex;align-items:flex-start;font:800 40px/1 var(--h-font);letter-spacing:-.045em;font-variant-numeric:tabular-nums}
:scope #o-menu.o-fm .o-fm-stats em{font-style:normal;font-size:.5em;line-height:1.1;margin-left:.04em}
:scope #o-menu.o-fm .o-fm-stats li>span{display:block;margin-top:8px;font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:rgba(21,21,24,.6)}
:scope #o-menu.o-fm .o-fm-vr{width:1px;align-self:stretch;background:rgba(21,21,24,.2)}
:scope #o-menu.o-fm .o-fm-contact{display:grid;gap:4px;font-size:14px;font-weight:600}
:scope #o-menu.o-fm .o-fm-contact a:hover{text-decoration:underline;text-underline-offset:4px}
:scope #o-menu.o-fm .o-fm-ask{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:52px;padding:0 24px;border:0;border-radius:40px;background:var(--h-on-accent);color:var(--h-accent);font:700 15px/1 var(--h-font);cursor:pointer;transition:transform .3s}
:scope #o-menu.o-fm .o-fm-ask:hover,:scope #o-menu.o-fm .o-fm-ask:focus-visible{transform:translateY(-2px)}
@media (max-width:1180px){:scope #o-menu.o-fm .o-fm-band{flex-wrap:wrap}:scope #o-menu.o-fm .o-fm-stats{flex-basis:100%}:scope #o-menu.o-fm .o-fm-vr{display:none}:scope #o-menu.o-fm .o-fm-contact{flex:1}}
@media (max-width:1023px){:scope #o-menu.o-fm .o-fm-map{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){
  :scope #o-menu.o-fm .o-fm-top{flex-wrap:wrap;gap:16px}
  :scope #o-menu.o-fm .o-fm-tools{width:100%;justify-content:flex-end}
  :scope #o-menu.o-fm .o-fm-tools .o-fm-txt{min-width:44px;justify-content:center}
  :scope #o-menu.o-fm .o-fm-map{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  :scope #o-menu.o-fm .o-fm-col{padding:16px;border-radius:18px}
  :scope #o-menu.o-fm .o-fm-h{margin-bottom:8px;font-size:18px}
  :scope #o-menu.o-fm .o-fm-list a{padding:4px 0;font-size:14px}
  :scope #o-menu.o-fm .o-fm-band{padding:16px;border-radius:20px;gap:16px}
  :scope #o-menu.o-fm .o-fm-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  :scope #o-menu.o-fm .o-fm-ask{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){:scope #o-menu.o-fm .o-fm-col,:scope #o-menu.o-fm .o-fm-list a{transition:none}:scope #o-menu.o-fm .o-fm-col:hover{transform:none}}
:scope #o-menu.o-fm .o-fm-stats b>span{display:inline;margin:0;font:inherit;letter-spacing:inherit;color:inherit}
:scope #o-menu.o-fm .o-fm-stats b>em{display:inline;font:inherit;font-size:.5em;color:inherit}

@media(max-width:767px){
  :scope .o-header .o-menu-trigger{width:44px;min-width:44px;padding:0;flex:none}
  :scope .o-menu-trigger-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}

:scope .o-fm-direct-arrow{display:none}
:scope #o-menu.o-fm .o-fm-toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:48px;padding:0;border:0;background:transparent;color:var(--h-ink);font:700 20px/1.4 var(--h-font);text-align:left}
:scope #o-menu.o-fm .o-fm-toggle>span{font-size:24px;line-height:1}
:scope #o-menu.o-fm .o-fm-toggle[aria-expanded="true"]>span{transform:rotate(45deg)}
@media(max-width:767px){
  :scope #o-menu.o-fm .o-fm-map.is-accordion{grid-template-columns:minmax(0,1fr);flex:none;gap:12px}
  :scope #o-menu.o-fm .is-accordion .o-fm-col{padding:12px 16px}
  :scope #o-menu.o-fm .is-accordion .o-fm-col:hover{transform:none}
  :scope #o-menu.o-fm .is-accordion .o-fm-tag,:scope #o-menu.o-fm .is-accordion .o-fm-section>.o-fm-h{display:none}
  :scope #o-menu.o-fm .is-accordion .o-fm-list{margin-top:12px;padding-top:8px;border-top:1px solid var(--h-line)}
  :scope #o-menu.o-fm .is-accordion .o-fm-list a{font-size:16px;min-height:44px}
  :scope #o-menu.o-fm .is-accordion .o-fm-col:not(.o-fm-section)>.o-fm-h{display:flex;align-items:center;justify-content:space-between;min-height:48px;margin:0;font-size:20px;line-height:1.4}
  :scope #o-menu.o-fm .is-accordion .o-fm-direct-arrow{display:inline;font-size:24px}
}

}
body:has(.otosystem){margin:0}
.otosystem.o-is-sub .o-sub{background:var(--h-bg);color:var(--h-ink)}
.otosystem.o-is-sub .o-module-content{max-width:1280px;margin:auto;min-width:0;line-height:normal;word-break:normal;overflow-wrap:normal}
.otosystem .o-inquiry-success:focus-visible{outline:3px solid currentColor}
