fix : 반응형 수정

src/components/main/MainUam.jsx

@@ -11,6 +11,7 @@ function MainAirspaceTransition() {
   const lineRef = useRef([]);
   const dotRef = useRef(null);
   const uamImageRef = useRef(null); // ← 추가
+  const isMobile = window.innerWidth <= 768;
 
   useEffect(() => {
     const ctx = gsap.context(() => {
@@ -19,7 +20,12 @@ function MainAirspaceTransition() {
       gsap.set(dotRef.current, { x: -320, opacity: 0, scale: 1 });
       gsap.set(".airspace-uam-content", { opacity: 0, y: 36 });
       gsap.set(uamImageRef.current, { opacity: 0 }); // ← 추가
-
+      // dot 초기 x 이동거리
+      gsap.set(dotRef.current, {
+        x: isMobile ? -160 : -320,
+        opacity: 0,
+        scale: 1,
+      });
       const tl = gsap.timeline({
         scrollTrigger: {
           trigger: sectionRef.current,
@@ -72,11 +78,10 @@ function MainAirspaceTransition() {
       tl.to(dotRef.current, {
         x: 0,
         y: 0,
-        scale: 52,
+        scale: isMobile ? 42 : 52,
         duration: 1.2,
         ease: "power2.inOut",
       });
-
       // airspace-uam-content + UAM 이미지 동시 등장  ← 수정
       tl.to(
         [".airspace-uam-content", uamImageRef.current],
@@ -102,7 +107,11 @@ function MainAirspaceTransition() {
 
       <div className="airspace-panel airspace-panel--uam" ref={rightRef}>
         <p>UAM SYSTEM</p>
-        <h2>도심 항공 네트워크로</h2>
+        <h2>
+          도심 항공
+          <span className="airspace-mobile-br"> </span>
+          네트워크로
+        </h2>
       </div>
 
       <div className="airspace-lines">

src/css/main.css

@@ -221,10 +221,18 @@ body{overflow-x:hidden;}
 
 .airspace-dot-image{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;z-index:2;pointer-events:none;}
 .airspace-dot-image img{width:32%;height:32%;object-fit:contain;filter:drop-shadow(0 8px 32px rgba(58,64,129,.28));animation:float-uam 5s ease-in-out infinite;will-change:transform;}
-
-@media (max-width:768px){.airspace-panel{padding:0 28px;}
-.airspace-panel h2{font-size:44px;}
-.airspace-line{left:28px;}
+.airspace-mobile-br{display:none;}
+
+@media (max-width:768px){
+  .airspace-moving-dot{left:88%;top:43%;transform:translate(-50%,-50%);}
+  .airspace-dot-uam{width:150px;}
+  .airspace-uam-content{left:0;right:0;top:auto;bottom:7%;transform:none;padding:0 6vw;max-width:100%;}
+  .airspace-uam-content h2{font-size:clamp(38px,10vw,58px);line-height:.95;letter-spacing:-.07em;word-break:keep-all;}
+  .airspace-uam-content span{font-size:14px;line-height:1.7;word-break:keep-all;}
+   .airspace-dot-image img{width: 16px;height:16%}
+  .airspace-dot-image{
+    transform:translateX(-5%);
+  }
 }
 
 @keyframes uamShine{0%,48%{transform:translateX(-120%);opacity:0;}58%{opacity:.75;}76%,100%{transform:translateX(120%);opacity:0;}}