@font-face{font-family:Pretendard;src:url('./fonts/PretendardVariable.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--bg:#0d0d0d;--orange:#e84b1d;--panel:rgba(68,68,68,.2);--width:1620px}
*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{margin:0;background:var(--bg);color:#fff;font-family:Pretendard,Arial,sans-serif}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.section-width{width:min(var(--width),calc(100% - 80px));margin:0 auto}.page-section{position:relative}.section-title,.about-ceo h1{margin:0;font-size:90px;line-height:1.19;letter-spacing:-3px}.about-header{position:absolute;z-index:20;top:57px;left:50%;display:flex;width:min(1604px,calc(100% - 80px));height:54px;align-items:center;justify-content:space-between;transform:translateX(-50%)}.about-logo{width:151px}.about-header nav{display:flex;align-items:center;gap:80px;font-size:14px}.about-header nav a{white-space:nowrap}.nav-toggle{display:none}.about-hero{height:694px;background:linear-gradient(rgba(0,0,0,.28),rgba(0,0,0,.28)),url('./image/about/vis.jpg') center 48%/cover no-repeat}
.about-ceo{height:1260px;padding-top:230px}.ceo-layout{position:absolute;top:247px;left:0;width:100%;height:863px}.ceo-photo{position:absolute;left:calc((100vw - min(var(--width),calc(100vw - 80px)))/-2);top:0;width:833px;height:863px;object-fit:cover;object-position:center 22%;border-radius:0 50px 50px 0}.ceo-copy{position:absolute;top:0;right:62px;width:738px;height:800px}.ceo-tabs{display:flex;width:390px;height:42px;align-items:center;border-radius:50px;background:#1c1c1c;box-shadow:inset -4px 6px 12px 2px rgba(0,0,0,.7);color:#777;font-size:20px}.ceo-tabs strong{display:grid;width:137px;height:42px;place-items:center;border-radius:50px;background:var(--orange);color:#212121}.ceo-tabs span{margin-left:58px}.ceo-copy h2{margin:88px 0 50px;font-size:40px;line-height:1.25;letter-spacing:-1.4px}.ceo-body{font-size:20px;line-height:1.5}.ceo-body p{margin:0 0 22px}.ceo-sign{position:absolute;right:0;bottom:0;margin:0;font-size:50px;font-weight:600}.ceo-sign small{margin-right:29px;font-size:30px}
.about-aube{height:1079px;padding-top:87px}.aube-layout{display:grid;grid-template-columns:642px 578px;gap:198px;margin:113px 0 0 108px}.aube-copy dl{margin:0 0 45px}.aube-copy dl div{display:flex;align-items:center;min-height:30px}.aube-copy dt{width:136px;color:var(--orange);font-size:20px;font-weight:700}.aube-copy dd{margin:0;font-size:16px}.aube-copy p{margin:0 0 25px;font-size:20px;line-height:1.5}.aube-mark{position:relative;height:428px;overflow:hidden}.aube-mark img{position:absolute;top:0;left:0;width:578px;filter:drop-shadow(0 13px 18px rgba(0,0,0,.4))}.aube-mark img:nth-child(2){top:58px;opacity:.8}.aube-mark img:nth-child(3){top:116px;opacity:.6}.aube-mark img:nth-child(4){top:174px;opacity:.5}.aube-mark img:nth-child(5){top:232px;opacity:.4}.aube-mark img:nth-child(6){top:290px;opacity:.28}
.about-team{height:1473px;padding-top:108px}.section-heading-row{display:grid;grid-template-columns:746px 1fr;gap:74px;align-items:start}.section-heading-row h3{margin:32px 0 14px;font-size:30px;line-height:1.2}.section-heading-row p{margin:0;font-size:20px;line-height:1.2}.org-chart{width:1620px;height:777px;margin-top:96px;border-radius:30px}
.about-system{height:1337px;padding-top:51px;overflow:hidden}.system-stage{position:relative;height:890px;margin-top:70px}.system-visual{position:absolute;top:66px;left:40px;width:550px;height:550px;object-fit:contain;mix-blend-mode:screen}.system-slider{position:absolute;top:0;left:683px;width:937px;height:820px}.system-card{position:absolute;top:156px;left:0;width:790px;height:420px;padding:78px 72px;border-radius:40px;background:#222;box-shadow:0 12px 24px rgba(0,0,0,.45);opacity:0;transform:translateX(100px);transition:.55s ease}.system-card::before,.system-card::after{position:absolute;z-index:-1;left:90px;width:610px;height:80px;border-radius:40px;background:#202020;content:'';filter:blur(6px)}.system-card::before{top:-76px}.system-card::after{bottom:-110px}.system-card.is-active{opacity:1;transform:none}.system-card span{font-size:30px;font-weight:700}.system-card h3{margin:72px 0 35px;font-size:40px}.system-card p{font-size:19px;line-height:1.5}.system-next{position:absolute;right:5px;bottom:116px;width:122px;height:122px;padding:0;border:0;border-radius:50%;background:none;cursor:pointer}.system-next img{width:100%}
.about-process{height:1653px;padding-top:154px}.process-heading{grid-template-columns:746px 1fr}.process-map{position:relative;width:1620px;height:930px;margin-top:105px}.process-center{position:absolute;z-index:2;top:125px;left:522px;width:596px;height:748px;opacity:.72}.process-logo{position:absolute;z-index:3;top:466px;left:680px;width:280px}.process-node{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50px;background:var(--panel);text-align:center}.process-node b{font-size:26px;line-height:1.2}.process-node span{margin-top:10px;font-size:22px}.n1{top:0;left:312px;width:198px;height:250px}.n2{top:26px;left:164px;width:257px;height:324px}.n3{top:83px;left:0;width:323px;height:406px}.n4{top:165px;left:137px;width:411px;height:516px}.n5{top:165px;right:137px;width:411px;height:516px}.n6{top:83px;right:0;width:323px;height:406px}.n7{top:26px;right:164px;width:257px;height:324px}.n8{top:0;right:312px;width:198px;height:250px}.n1 b,.n8 b{font-size:16px}.n1 span,.n8 span{font-size:16px}.n2 b,.n7 b{font-size:20px}.n2 span,.n7 span{font-size:20px}.n4 b,.n5 b{font-size:30px}.n4 span,.n5 span{font-size:30px}
.about-footer{position:relative;height:718px;background:#000;overflow:hidden}.footer-top{display:flex;padding-top:119px;justify-content:space-between}.company-info{font-size:16px;line-height:1.8}.company-info p{margin:0}.company-info i{margin:0 10px;font-style:normal}.footer-links{display:grid;grid-template-columns:repeat(3,auto);gap:54px;font-size:16px}.footer-links div{display:flex;flex-direction:column;gap:15px}.footer-links .social{font-weight:600}.footer-logo{position:absolute;bottom:0;left:50%;width:1621px;transform:translateX(-50%)}
@media(max-width:1100px){.about-header nav{gap:28px}.section-title,.about-ceo h1{font-size:64px}.about-ceo,.about-aube,.about-team,.about-system,.about-process{height:auto;padding:110px 0}.ceo-layout{position:relative;top:auto;display:grid;grid-template-columns:45% 1fr;gap:45px;height:auto;margin-top:70px}.ceo-photo{position:relative;left:auto;width:100%;height:680px;border-radius:0 35px 35px 0}.ceo-copy{position:relative;right:auto;width:auto;height:auto}.ceo-copy h2{margin-top:55px;font-size:32px}.ceo-body{font-size:17px}.ceo-sign{position:relative;margin-top:35px;text-align:right}.aube-layout{grid-template-columns:1fr 45%;gap:60px;margin:70px 0 0}.section-heading-row{grid-template-columns:1fr;gap:20px}.org-chart{height:auto;margin-top:60px}.system-stage{height:750px}.system-visual{left:0;width:40%;height:auto}.system-slider{left:43%;width:57%}.system-card{width:calc(100% - 100px);height:380px;padding:50px}.system-next{right:0}.process-map{width:100%;transform:scale(.75);transform-origin:top center;margin-bottom:-180px}.about-footer{height:520px}.footer-logo{width:85%}}
@media(max-width:720px){.section-width{width:calc(100% - 40px)}.about-header{top:22px;width:calc(100% - 40px)}.about-logo{width:112px}.nav-toggle{z-index:2;display:flex;width:42px;height:42px;flex-direction:column;justify-content:center;gap:7px;border:0;background:none}.nav-toggle span{display:block;width:26px;height:2px;background:#fff}.about-header nav{position:fixed;top:-22px;right:-20px;display:none;width:calc(100vw + 40px);height:100vh;flex-direction:column;justify-content:center;background:#0d0d0d;font-size:22px}.about-header nav.is-open{display:flex}.about-hero{height:420px}.section-title,.about-ceo h1{font-size:48px;letter-spacing:-2px}.about-ceo,.about-aube,.about-team,.about-system,.about-process{padding:80px 0}.ceo-layout{display:block;margin-top:45px}.ceo-photo{height:500px;border-radius:0 28px 28px 0}.ceo-copy{margin-top:40px}.ceo-tabs{width:100%;font-size:16px}.ceo-copy h2{margin:45px 0 30px;font-size:27px}.ceo-body{font-size:15px}.ceo-body br{display:none}.ceo-sign{font-size:36px}.aube-layout{display:flex;flex-direction:column;margin-top:45px}.aube-copy p{font-size:16px}.aube-copy p br{display:none}.aube-mark{width:min(578px,100%);height:280px;margin-right:auto;margin-left:auto;transform:scale(.7);transform-origin:top center}.section-heading-row h3{margin:10px 0;font-size:22px}.section-heading-row p{font-size:16px}.section-heading-row p br{display:none}.system-stage{height:890px;margin-top:40px}.system-visual{position:relative;top:0;left:50%;width:320px;transform:translateX(-50%)}.system-slider{top:340px;left:0;width:100%;height:500px}.system-card{top:0;width:100%;height:380px;padding:40px 28px}.system-card h3{margin:45px 0 25px;font-size:28px}.system-card p{font-size:15px}.system-card p br{display:none}.system-next{right:0;bottom:0;width:76px;height:76px}.process-map{left:50%;width:1620px;transform:translateX(-50%) scale(.23);margin-top:20px;margin-bottom:-650px}.about-footer{height:620px}.footer-top{display:block;padding-top:70px}.company-info{font-size:12px}.company-info i{margin:0 3px}.footer-links{margin-top:45px;gap:30px;font-size:13px}.footer-logo{width:90%;bottom:20px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Desktop/wide: keep the CEO portrait and copy together in one centered frame. */
@media(min-width:1101px){
  .ceo-layout{
    left:50%;
    width:min(var(--width),calc(100vw - 80px));
    display:grid;
    grid-template-columns:minmax(0,51.42fr) minmax(0,45.56fr);
    column-gap:3.02%;
    transform:translateX(-50%);
  }
  .ceo-photo{
    position:relative;
    top:auto;
    left:auto;
    width:100%;
    height:min(863px,calc((100vw - 80px) * .533));
    border-radius:50px;
  }
  .ceo-copy{
    position:relative;
    top:auto;
    right:auto;
    width:100%;
    height:800px;
  }
}
.about-ceo{height:1510px}.ceo-layout{top:397px}
@media(max-width:1100px){.about-ceo{height:auto}.ceo-layout{top:auto}}

/* System: 축 회전 비주얼 + 상하 블라인드형 카드 휠 */
.system-visual-wrap{position:absolute;top:66px;left:40px;width:550px;height:550px;display:grid;place-items:center;perspective:900px}
.system-visual-wrap::before{position:absolute;z-index:2;top:50%;left:50%;width:18px;height:18px;border:3px solid rgba(255,255,255,.7);border-radius:50%;box-shadow:0 0 30px 8px rgba(232,75,29,.35);content:"";transform:translate(-50%,-50%);pointer-events:none}
.system-visual-wrap::after{position:absolute;top:50%;left:8%;width:84%;height:1px;background:linear-gradient(90deg,transparent,rgba(232,75,29,.45),transparent);content:"";transform:translateY(-50%);pointer-events:none}
.system-visual{position:relative;top:auto;left:auto;width:100%;height:100%;object-fit:contain;mix-blend-mode:screen;transform-origin:50% 50%;backface-visibility:hidden}
.system-visual.is-spinning{animation:system-axis-spin 760ms cubic-bezier(.45,.05,.25,1)}
@keyframes system-axis-spin{0%{filter:blur(0);opacity:1;transform:rotate(0) scale(1)}45%{filter:blur(3px);opacity:.28;transform:rotate(168deg) scale(.72)}55%{filter:blur(3px);opacity:.28;transform:rotate(198deg) scale(.72)}100%{filter:blur(0);opacity:1;transform:rotate(360deg) scale(1)}}
.system-slider{overflow:hidden;mask-image:none;-webkit-mask-image:none}
.system-slider::before,.system-slider::after{position:absolute;z-index:5;right:0;left:0;height:140px;content:"";pointer-events:none}
.system-slider::before{top:0;background:linear-gradient(to bottom,rgba(13,13,13,.82),rgba(13,13,13,.38) 55%,transparent)}
.system-slider::after{bottom:0;background:linear-gradient(to top,rgba(13,13,13,.82),rgba(13,13,13,.38) 55%,transparent)}
.system-card{top:156px;display:block;opacity:0;filter:blur(12px);transform:translate(0,0) rotate(0);transform-origin:center center;backface-visibility:hidden;transition:opacity 480ms ease,filter 560ms ease}
.system-card::before,.system-card::after{display:none;content:none}
.system-card.is-active{z-index:3;opacity:1;filter:blur(0);transform:translate(0,0) rotate(0)}
.system-card.is-prev{z-index:1;opacity:.5;filter:blur(4px);transform:translate(-105px,-500px) rotate(-6deg)}
.system-card.is-next{z-index:1;opacity:.5;filter:blur(4px);transform:translate(-105px,500px) rotate(6deg)}
.system-next{z-index:6}
.system-slider{left:578px;width:1042px}
.system-card{left:105px}
@media(max-width:1100px){.system-visual-wrap{left:0;width:40%;height:auto;aspect-ratio:1}.system-visual{width:100%;height:100%}.system-slider{left:38%;width:62%}.system-card{left:70px;width:calc(100% - 100px)}.system-card.is-prev{transform:translate(-70px,-470px) rotate(-5deg)}.system-card.is-next{transform:translate(-70px,470px) rotate(5deg)}}
@media(max-width:720px){.system-visual-wrap{position:relative;top:0;left:50%;width:320px;height:320px;transform:translateX(-50%)}.system-slider{top:340px;left:0;width:100%}.system-card{left:28px;width:calc(100% - 28px)}.system-card.is-prev{transform:translate(-28px,-430px) rotate(-4deg)}.system-card.is-next{transform:translate(-28px,430px) rotate(4deg)}}

/* 9개 객체가 하나의 평면 원형 궤도를 도는 시스템 휠 */
.system-slider{top:0;left:0;width:1620px;height:820px;overflow:hidden}
.system-card{top:156px;left:683px;width:790px;height:420px;opacity:0;visibility:hidden;filter:blur(9px);transform-origin:center;transition:transform 820ms cubic-bezier(.3,.7,.2,1),opacity 520ms ease,filter 520ms ease,visibility 0s linear 820ms}
.system-card.is-active{z-index:4;opacity:1;filter:blur(0);transform:translate(0,0) rotate(0)}
.system-card.is-orbiting{z-index:1}
.system-card.is-active,.system-card[data-ring-slot="1"],.system-card[data-ring-slot="8"]{visibility:visible;transition-delay:0s}
.system-card[data-ring-slot="1"],.system-card[data-ring-slot="8"]{opacity:.5;filter:blur(4px)}
.system-card[data-ring-slot="1"]{transform:translate(-60px,520px) rotate(6deg)}
.system-card[data-ring-slot="2"]{transform:translate(-360px,610px) rotate(4deg)}
.system-card[data-ring-slot="3"]{transform:translate(-720px,570px) rotate(-2deg)}
.system-card[data-ring-slot="4"]{transform:translate(-980px,300px) rotate(-6deg)}
.system-card[data-ring-slot="5"]{transform:translate(-980px,-150px) rotate(6deg)}
.system-card[data-ring-slot="6"]{transform:translate(-720px,-480px) rotate(4deg)}
.system-card[data-ring-slot="7"]{transform:translate(-360px,-610px) rotate(-4deg)}
.system-card[data-ring-slot="8"]{transform:translate(-60px,-520px) rotate(-6deg)}
.system-slider::before,.system-slider::after{height:120px}
.system-next{right:20px}
.system-slider{cursor:grab;touch-action:pan-x;user-select:none}
.system-slider.is-dragging{cursor:grabbing}
.system-card{translate:0 var(--system-drag-y,0px);transition:transform 820ms cubic-bezier(.3,.7,.2,1),translate 260ms ease,opacity 520ms ease,filter 520ms ease,visibility 0s linear 820ms}
.system-slider.is-dragging .system-card{transition:none}
.system-visual.is-spinning.is-reverse{animation-direction:reverse}
@media(max-width:1100px){.system-slider{left:0;width:100%}.system-card{left:43%;width:52%}.system-card[data-ring-slot="1"]{transform:translate(-35px,500px) rotate(5deg)}.system-card[data-ring-slot="2"]{transform:translate(-220px,590px) rotate(4deg)}.system-card[data-ring-slot="3"]{transform:translate(-430px,540px) rotate(-2deg)}.system-card[data-ring-slot="4"]{transform:translate(-560px,280px) rotate(-5deg)}.system-card[data-ring-slot="5"]{transform:translate(-560px,-150px) rotate(5deg)}.system-card[data-ring-slot="6"]{transform:translate(-430px,-460px) rotate(4deg)}.system-card[data-ring-slot="7"]{transform:translate(-220px,-590px) rotate(-4deg)}.system-card[data-ring-slot="8"]{transform:translate(-35px,-500px) rotate(-5deg)}}
@media(max-width:720px){.system-slider{top:340px;left:0;width:100%;height:500px}.system-card{top:0;left:28px;width:calc(100% - 28px)}.system-card[data-ring-slot="1"]{transform:translate(-18px,500px) rotate(4deg)}.system-card[data-ring-slot="2"]{transform:translate(-100px,610px) rotate(3deg)}.system-card[data-ring-slot="3"]{transform:translate(-190px,550px) rotate(-2deg)}.system-card[data-ring-slot="4"]{transform:translate(-240px,260px) rotate(-4deg)}.system-card[data-ring-slot="5"]{transform:translate(-240px,-150px) rotate(4deg)}.system-card[data-ring-slot="6"]{transform:translate(-190px,-460px) rotate(3deg)}.system-card[data-ring-slot="7"]{transform:translate(-100px,-600px) rotate(-3deg)}.system-card[data-ring-slot="8"]{transform:translate(-18px,-500px) rotate(-4deg)}}
.aube-mark img:nth-child(6){opacity:.1}
.aube-mark img:nth-child(2){opacity:.6}
.aube-mark img:nth-child(3){opacity:.5}
.aube-mark img:nth-child(4){opacity:.4}

/* AUBE vertical motion trail */
.aube-mark img{
  animation:aube-vertical-trail 3.6s cubic-bezier(.45,.05,.25,1) infinite alternate;
  will-change:transform;
}
.aube-mark img:nth-child(2){animation-delay:70ms}
.aube-mark img:nth-child(3){animation-delay:140ms}
.aube-mark img:nth-child(4){animation-delay:210ms}
.aube-mark img:nth-child(5){animation-delay:280ms}
.aube-mark img:nth-child(6){animation-delay:350ms}
@keyframes aube-vertical-trail{
  0%{transform:translateY(-18px)}
  45%{transform:translateY(0)}
  100%{transform:translateY(22px)}
}
@media(prefers-reduced-motion:reduce){.aube-mark img{animation:none}}

/* Stronger bidirectional afterimage: each duplicate follows the lead logo. */
.aube-mark img{animation-duration:2.7s;animation-timing-function:cubic-bezier(.4,0,.2,1)}
.aube-mark img:nth-child(2){animation-delay:-120ms}
.aube-mark img:nth-child(3){animation-delay:-240ms}
.aube-mark img:nth-child(4){animation-delay:-360ms}
.aube-mark img:nth-child(5){animation-delay:-480ms}
.aube-mark img:nth-child(6){animation-delay:-600ms}
@keyframes aube-vertical-trail{
  0%{transform:translateY(-48px)}
  50%{transform:translateY(0)}
  100%{transform:translateY(48px)}
}

/* One lead logo travels inside the frame; the other copies are true delayed trails. */
.aube-mark img{top:0!important;animation:aube-follow-path 4.2s cubic-bezier(.45,0,.55,1) infinite normal}
.aube-mark img:nth-child(1){z-index:6;animation-delay:0s}
.aube-mark img:nth-child(2){z-index:5;animation-delay:120ms}
.aube-mark img:nth-child(3){z-index:4;animation-delay:240ms}
.aube-mark img:nth-child(4){z-index:3;animation-delay:360ms}
.aube-mark img:nth-child(5){z-index:2;animation-delay:480ms}
.aube-mark img:nth-child(6){z-index:1;animation-delay:600ms}
@keyframes aube-follow-path{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(290px)}
}
@media(prefers-reduced-motion:reduce){.aube-mark img{animation:none;transform:none}}
