|
|
|
@ -1,12 +1,37 @@ |
|
|
|
|
|
|
|
import { useRef } from "react"; |
|
|
|
import SubHero from "../../components/SubHero"; |
|
|
|
import SubHero from "../../components/SubHero"; |
|
|
|
import useFadeIn from "../../hooks/useFadeIn"; |
|
|
|
import useFadeIn from "../../hooks/useFadeIn"; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
import { motion, useInView } from "framer-motion"; |
|
|
|
|
|
|
|
import { MapPin, ShieldAlert, Network, BadgeCheck } from "lucide-react"; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const ease = [0.22, 1, 0.36, 1]; |
|
|
|
|
|
|
|
const basePath = import.meta.env.BASE_URL; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const INTRO_CARDS = [ |
|
|
|
|
|
|
|
{ label: "비행 계획", img: `${basePath}/images/utm_intro_icon1.png` }, |
|
|
|
|
|
|
|
{ label: "비행 승인", img: `${basePath}/images/utm_intro_icon2.png` }, |
|
|
|
|
|
|
|
{ label: "실시간 관제", img: `${basePath}/images/utm_intro_icon3.png` }, |
|
|
|
|
|
|
|
{ label: "데이터 관리", img: `${basePath}/images/utm_intro_icon4.png` }, |
|
|
|
|
|
|
|
]; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const UTM_WHAT_LIST = [ |
|
|
|
|
|
|
|
"실시간 비행체 위치 감시 및 추적", |
|
|
|
|
|
|
|
"AI 기반 충돌 위험 사전 분석·경보", |
|
|
|
|
|
|
|
"기상청 연계 기상 정보 자동 반영", |
|
|
|
|
|
|
|
"동적 공역 설정 및 지오펜싱 관리", |
|
|
|
|
|
|
|
]; |
|
|
|
function IntroPage() { |
|
|
|
function IntroPage() { |
|
|
|
const ref = useFadeIn(); |
|
|
|
const ref = useFadeIn(); |
|
|
|
const UTM_NAV = [ |
|
|
|
const UTM_NAV = [ |
|
|
|
{ label: "UTM/UATM 소개", to: "/utm/intro" }, |
|
|
|
{ label: "UTM/UATM 소개", to: "/utm/intro" }, |
|
|
|
{ label: "도입사례", to: "/utm/case" }, |
|
|
|
{ label: "도입사례", to: "/utm/case" }, |
|
|
|
]; |
|
|
|
]; |
|
|
|
|
|
|
|
const introRef = useRef(null); |
|
|
|
|
|
|
|
const introInView = useInView(introRef, { once: true, margin: "-60px" }); |
|
|
|
|
|
|
|
const whatRef = useRef(null); |
|
|
|
|
|
|
|
const whatInView = useInView(whatRef, { once: true, margin: "-60px" }); |
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
return ( |
|
|
|
<article ref={ref}> |
|
|
|
<article ref={ref}> |
|
|
|
<SubHero |
|
|
|
<SubHero |
|
|
|
@ -23,28 +48,340 @@ function IntroPage() { |
|
|
|
/> |
|
|
|
/> |
|
|
|
|
|
|
|
|
|
|
|
<div className="sub-content"> |
|
|
|
<div className="sub-content"> |
|
|
|
<section className="sub-section"> |
|
|
|
<div className="inner-wrap"> |
|
|
|
<span className="sub-section-eyebrow sub-fade-in">UTM/UATM 소개</span> |
|
|
|
<section className="utm-intro" ref={introRef}> |
|
|
|
{/* <main className="sub-page"> |
|
|
|
{/* ── 상단 텍스트 블록 ── */} |
|
|
|
<section className="sub-visual"> |
|
|
|
<div className="utm-intro__top"> |
|
|
|
<div className="inner"> |
|
|
|
<motion.span |
|
|
|
<h2>UTM/UATM 소개</h2> |
|
|
|
className="fc-eyebrow" |
|
|
|
<p>Urban Air Mobility & UTM Air Traffic Management</p> |
|
|
|
initial={{ opacity: 0, y: 16 }} |
|
|
|
</div> |
|
|
|
animate={introInView ? { opacity: 1, y: 0 } : {}} |
|
|
|
</section> |
|
|
|
transition={{ duration: 0.6, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
Overview |
|
|
|
|
|
|
|
</motion.span> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<motion.h2 |
|
|
|
|
|
|
|
className="utm-intro__title" |
|
|
|
|
|
|
|
initial={{ opacity: 0, y: 20 }} |
|
|
|
|
|
|
|
animate={introInView ? { opacity: 1, y: 0 } : {}} |
|
|
|
|
|
|
|
transition={{ duration: 0.7, delay: 0.1, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
PAL Networks의 UTM/UATM은 |
|
|
|
|
|
|
|
<br /> |
|
|
|
|
|
|
|
<em>도심 항공 관제의 새로운 기준</em>입니다. |
|
|
|
|
|
|
|
</motion.h2> |
|
|
|
|
|
|
|
|
|
|
|
<section className="sub-content-section"> |
|
|
|
<motion.p |
|
|
|
<div className="inner"> |
|
|
|
className="utm-intro__desc" |
|
|
|
<h3>도심 항공 모빌리티 핵심 기술</h3> |
|
|
|
initial={{ opacity: 0, y: 16 }} |
|
|
|
<p> |
|
|
|
animate={introInView ? { opacity: 1, y: 0 } : {}} |
|
|
|
안전한 도심 상공 운항과 통합 관제를 실현하는 |
|
|
|
transition={{ duration: 0.6, delay: 0.2, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
UAM 기체 운용과 UTM 관제 플랫폼을 동시에 보유한 국내 유일의 통합 |
|
|
|
|
|
|
|
사업자입니다. |
|
|
|
|
|
|
|
<br />실 운용 데이터로 검증된 시스템으로{" "} |
|
|
|
|
|
|
|
<strong>안전한 저고도 공역 관리</strong>를 실현합니다. |
|
|
|
|
|
|
|
</motion.p> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{/* ── 4개 카드 그리드 ── */} |
|
|
|
|
|
|
|
<ul className="utm-intro__cards"> |
|
|
|
|
|
|
|
{INTRO_CARDS.map((card, i) => ( |
|
|
|
|
|
|
|
<motion.li |
|
|
|
|
|
|
|
key={card.label} |
|
|
|
|
|
|
|
className="utm-intro__card" |
|
|
|
|
|
|
|
initial={{ opacity: 0, y: 24 }} |
|
|
|
|
|
|
|
animate={introInView ? { opacity: 1, y: 0 } : {}} |
|
|
|
|
|
|
|
transition={{ duration: 0.6, delay: 0.15 + i * 0.08, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<span className="utm-intro__card-num"> |
|
|
|
|
|
|
|
{String(i + 1).padStart(2, "0")} |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<img |
|
|
|
|
|
|
|
src={card.img} |
|
|
|
|
|
|
|
alt={card.label} |
|
|
|
|
|
|
|
className="utm-intro__card-img" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<p className="utm-intro__card-label">{card.label}</p> |
|
|
|
|
|
|
|
</motion.li> |
|
|
|
|
|
|
|
))} |
|
|
|
|
|
|
|
</ul> |
|
|
|
|
|
|
|
</section> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{/* ── UTM 소개 섹션 ── */} |
|
|
|
|
|
|
|
<section className="utm-what" ref={whatRef}> |
|
|
|
|
|
|
|
<div className="inner-wrap"> |
|
|
|
|
|
|
|
<div className="utm-what__inner"> |
|
|
|
|
|
|
|
<div className="utm-what__left"> |
|
|
|
|
|
|
|
<motion.span |
|
|
|
|
|
|
|
className="utm-what__eyebrow" |
|
|
|
|
|
|
|
initial={{ opacity: 0, y: 16 }} |
|
|
|
|
|
|
|
animate={whatInView ? { opacity: 1, y: 0 } : {}} |
|
|
|
|
|
|
|
transition={{ duration: 0.6, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
What is UTM |
|
|
|
|
|
|
|
</motion.span> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<motion.h2 |
|
|
|
|
|
|
|
className="utm-what__title" |
|
|
|
|
|
|
|
initial={{ opacity: 0, y: 20 }} |
|
|
|
|
|
|
|
animate={whatInView ? { opacity: 1, y: 0 } : {}} |
|
|
|
|
|
|
|
transition={{ duration: 0.7, delay: 0.1, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
UTM, |
|
|
|
<br /> |
|
|
|
<br /> |
|
|
|
PAL Networks의 UTM/UATM 기술을 소개합니다. |
|
|
|
무엇을 할 수 있나요? |
|
|
|
</p> |
|
|
|
</motion.h2> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<motion.p |
|
|
|
|
|
|
|
className="utm-what__desc" |
|
|
|
|
|
|
|
initial={{ opacity: 0, y: 16 }} |
|
|
|
|
|
|
|
animate={whatInView ? { opacity: 1, y: 0 } : {}} |
|
|
|
|
|
|
|
transition={{ duration: 0.6, delay: 0.2, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
UTM은 단순한 관제 시스템을 넘어, 도심 저고도 공역 전체를 |
|
|
|
|
|
|
|
디지털로 운영하는 통합 플랫폼입니다. 실시간 감시부터 충돌 위험 |
|
|
|
|
|
|
|
분석, 기상 연계, 공역 관리까지 — 비행의 모든 순간을 안전하게 |
|
|
|
|
|
|
|
연결합니다. |
|
|
|
|
|
|
|
</motion.p> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<motion.ul |
|
|
|
|
|
|
|
className="utm-what__list" |
|
|
|
|
|
|
|
initial={{ opacity: 0, y: 16 }} |
|
|
|
|
|
|
|
animate={whatInView ? { opacity: 1, y: 0 } : {}} |
|
|
|
|
|
|
|
transition={{ duration: 0.6, delay: 0.3, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
{UTM_WHAT_LIST.map((item) => ( |
|
|
|
|
|
|
|
<li key={item}> |
|
|
|
|
|
|
|
<span className="utm-what__list-dot" /> |
|
|
|
|
|
|
|
{item} |
|
|
|
|
|
|
|
</li> |
|
|
|
|
|
|
|
))} |
|
|
|
|
|
|
|
</motion.ul> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</section> |
|
|
|
<motion.div |
|
|
|
</main> */} |
|
|
|
className="utm-what__right" |
|
|
|
|
|
|
|
initial={{ opacity: 0, x: 32 }} |
|
|
|
|
|
|
|
animate={whatInView ? { opacity: 1, x: 0 } : {}} |
|
|
|
|
|
|
|
transition={{ duration: 0.8, delay: 0.2, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<div |
|
|
|
|
|
|
|
className="utm-what__img-wrap" |
|
|
|
|
|
|
|
style={{ |
|
|
|
|
|
|
|
backgroundImage: `url(${basePath}images/utm_what_img.png)`, |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
{/* 드론들 */} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="drone drone--1"> |
|
|
|
|
|
|
|
<div className="drone__bg drone__bg--red"> |
|
|
|
|
|
|
|
<svg |
|
|
|
|
|
|
|
width="20" |
|
|
|
|
|
|
|
height="20" |
|
|
|
|
|
|
|
viewBox="0 0 24 24" |
|
|
|
|
|
|
|
fill="none" |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M12 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" |
|
|
|
|
|
|
|
fill="#fff" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M4 4l4 4M20 4l-4 4M4 20l4-4M20 20l-4-4" |
|
|
|
|
|
|
|
stroke="#fff" |
|
|
|
|
|
|
|
strokeWidth="2" |
|
|
|
|
|
|
|
strokeLinecap="round" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<circle cx="4" cy="4" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
<circle cx="20" cy="4" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
<circle cx="4" cy="20" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
<circle cx="20" cy="20" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
</svg> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className="drone__ping drone__ping--red" /> |
|
|
|
|
|
|
|
<div className="drone__ping drone__ping--red drone__ping--delay" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="drone drone--2"> |
|
|
|
|
|
|
|
<div className="drone__bg drone__bg--blue"> |
|
|
|
|
|
|
|
<svg |
|
|
|
|
|
|
|
width="20" |
|
|
|
|
|
|
|
height="20" |
|
|
|
|
|
|
|
viewBox="0 0 24 24" |
|
|
|
|
|
|
|
fill="none" |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M12 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" |
|
|
|
|
|
|
|
fill="#fff" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M4 4l4 4M20 4l-4 4M4 20l4-4M20 20l-4-4" |
|
|
|
|
|
|
|
stroke="#fff" |
|
|
|
|
|
|
|
strokeWidth="2" |
|
|
|
|
|
|
|
strokeLinecap="round" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<circle cx="4" cy="4" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
<circle cx="20" cy="4" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
<circle cx="4" cy="20" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
<circle cx="20" cy="20" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
</svg> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className="drone__ping drone__ping--blue" /> |
|
|
|
|
|
|
|
<div className="drone__ping drone__ping--blue drone__ping--delay" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="drone drone--3"> |
|
|
|
|
|
|
|
<div className="drone__bg drone__bg--blue"> |
|
|
|
|
|
|
|
<svg |
|
|
|
|
|
|
|
width="20" |
|
|
|
|
|
|
|
height="20" |
|
|
|
|
|
|
|
viewBox="0 0 24 24" |
|
|
|
|
|
|
|
fill="none" |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M12 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" |
|
|
|
|
|
|
|
fill="#fff" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M4 4l4 4M20 4l-4 4M4 20l4-4M20 20l-4-4" |
|
|
|
|
|
|
|
stroke="#fff" |
|
|
|
|
|
|
|
strokeWidth="2" |
|
|
|
|
|
|
|
strokeLinecap="round" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<circle cx="4" cy="4" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
<circle cx="20" cy="4" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
<circle cx="4" cy="20" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
<circle cx="20" cy="20" r="2" fill="#fff" /> |
|
|
|
|
|
|
|
</svg> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className="drone__ping drone__ping--blue" /> |
|
|
|
|
|
|
|
<div className="drone__ping drone__ping--blue drone__ping--delay" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="drone-alert"> |
|
|
|
|
|
|
|
<div className="drone-alert__dot" /> |
|
|
|
|
|
|
|
<div className="drone-alert__content"> |
|
|
|
|
|
|
|
<p className="drone-alert__title">⚠ 불법 드론 감지</p> |
|
|
|
|
|
|
|
<p className="drone-alert__desc"> |
|
|
|
|
|
|
|
식별 불가 기체 접근 중 <br /> GND-150m |
|
|
|
|
|
|
|
</p> |
|
|
|
|
|
|
|
<p className="drone-alert__pos">위치 37.5°N 126.9°E</p> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</motion.div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</section> |
|
|
|
</section> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="inner-wrap"> |
|
|
|
|
|
|
|
{/* ── DRONE → UATM 진화 섹션 ── */} |
|
|
|
|
|
|
|
<section className="utm-evo"> |
|
|
|
|
|
|
|
<div className="utm-evo__left"> |
|
|
|
|
|
|
|
{" "} |
|
|
|
|
|
|
|
<motion.span |
|
|
|
|
|
|
|
className="fc-eyebrow" |
|
|
|
|
|
|
|
initial={{ opacity: 0, y: 16 }} |
|
|
|
|
|
|
|
animate={introInView ? { opacity: 1, y: 0 } : {}} |
|
|
|
|
|
|
|
transition={{ duration: 0.6, ease }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
Evolution |
|
|
|
|
|
|
|
</motion.span> |
|
|
|
|
|
|
|
<h2 className="utm-evo__title"> |
|
|
|
|
|
|
|
UTM에서 UATM으로, |
|
|
|
|
|
|
|
<br /> |
|
|
|
|
|
|
|
<em>하늘길의 패러다임이 바뀝니다</em> |
|
|
|
|
|
|
|
</h2> |
|
|
|
|
|
|
|
<p className="utm-evo__desc"> |
|
|
|
|
|
|
|
드론 한 대의 비행에서 시작된 기술이, 이제 도심 전체의 하늘을 |
|
|
|
|
|
|
|
통합 관제하는 UATM으로 진화했습니다. PAL Networks는 이 변화의 |
|
|
|
|
|
|
|
최전선에서 기체와 관제를 함께 운영합니다. |
|
|
|
|
|
|
|
</p> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="utm-evo__right"> |
|
|
|
|
|
|
|
<div className="utm-evo__track"> |
|
|
|
|
|
|
|
<div className="utm-evo__item"> |
|
|
|
|
|
|
|
<div className="utm-evo__card-wrap utm-evo__card-wrap--left"> |
|
|
|
|
|
|
|
<div className="utm-evo__card"> |
|
|
|
|
|
|
|
<div className="utm-evo__card-name">🚁 DRONE</div> |
|
|
|
|
|
|
|
<div className="utm-evo__card-desc"> |
|
|
|
|
|
|
|
개별 드론 운용 단계. 단순 비행 임무 수행 중심으로 체계적 |
|
|
|
|
|
|
|
관리 체계 부재. |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<span className="utm-evo__card-tag">단일 기체 운용</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className="utm-evo__dot-wrap"> |
|
|
|
|
|
|
|
<div className="utm-evo__dot">01</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className="utm-evo__empty" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="utm-evo__item"> |
|
|
|
|
|
|
|
<div className="utm-evo__empty" /> |
|
|
|
|
|
|
|
<div className="utm-evo__dot-wrap"> |
|
|
|
|
|
|
|
<div className="utm-evo__dot">02</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className="utm-evo__card-wrap utm-evo__card-wrap--right"> |
|
|
|
|
|
|
|
<div className="utm-evo__card"> |
|
|
|
|
|
|
|
<div className="utm-evo__card-name">📡 UTM</div> |
|
|
|
|
|
|
|
<div className="utm-evo__card-desc"> |
|
|
|
|
|
|
|
무인기 교통관리 시스템 도입. 비행 경로 승인·충돌 |
|
|
|
|
|
|
|
방지·공역 관리 체계화. |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<span className="utm-evo__card-tag"> |
|
|
|
|
|
|
|
공역 관리 시스템 |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="utm-evo__item"> |
|
|
|
|
|
|
|
<div className="utm-evo__card-wrap utm-evo__card-wrap--left"> |
|
|
|
|
|
|
|
<div className="utm-evo__card"> |
|
|
|
|
|
|
|
<div className="utm-evo__card-name">✈️ UAM</div> |
|
|
|
|
|
|
|
<div className="utm-evo__card-desc"> |
|
|
|
|
|
|
|
도심항공모빌리티 등장. 유인 eVTOL 기체가 도심 저고도 |
|
|
|
|
|
|
|
공역을 비행. |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<span className="utm-evo__card-tag"> |
|
|
|
|
|
|
|
도심 항공 모빌리티 |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className="utm-evo__dot-wrap"> |
|
|
|
|
|
|
|
<div className="utm-evo__dot">03</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className="utm-evo__empty" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="utm-evo__item utm-evo__item--active"> |
|
|
|
|
|
|
|
<div className="utm-evo__empty" /> |
|
|
|
|
|
|
|
<div className="utm-evo__dot-wrap"> |
|
|
|
|
|
|
|
<div className="utm-evo__dot">04</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className="utm-evo__card-wrap utm-evo__card-wrap--right"> |
|
|
|
|
|
|
|
<div className="utm-evo__card"> |
|
|
|
|
|
|
|
<div className="utm-evo__card-name">🛸 UATM</div> |
|
|
|
|
|
|
|
<div className="utm-evo__card-desc"> |
|
|
|
|
|
|
|
UAM과 UTM의 완전한 통합. 기체 운용부터 관제까지 하나의 |
|
|
|
|
|
|
|
플랫폼으로 실현. |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<span className="utm-evo__card-tag"> |
|
|
|
|
|
|
|
통합 관제 플랫폼 |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<div className="utm-evo__pal-flag"> |
|
|
|
|
|
|
|
PAL Networks가 실현합니다 |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</section> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</article> |
|
|
|
</article> |
|
|
|
); |
|
|
|
); |
|
|
|
|
