{"id":563,"date":"2026-09-29T13:23:32","date_gmt":"2026-09-29T04:23:32","guid":{"rendered":"https:\/\/nfuture.kr\/?page_id=563"},"modified":"2026-10-16T10:57:37","modified_gmt":"2026-10-16T01:57:37","slug":"%ed%9a%8c%ec%82%ac%ec%86%8c%ea%b0%9c","status":"publish","type":"page","link":"https:\/\/nfuture.kr\/?page_id=563","title":{"rendered":"ABOUT N FUTURE"},"content":{"rendered":"\n\n<!-- AOS -->\n<link href=\"https:\/\/unpkg.com\/aos@2.3.1\/dist\/aos.css\" rel=\"stylesheet\">\n<script src=\"https:\/\/unpkg.com\/aos@2.3.1\/dist\/aos.js\"><\/script>\n\n<!--\n=========================================================\nIMPORTANT\n=========================================================\n\n\uc544\ub798 \ud5e4\ub354\uc5d0\ub294 \ubcc4\ub3c4\uc758 CSS\ub97c \uc801\uc6a9\ud558\uc9c0 \uc54a\uc2b5\ub2c8\ub2e4.\n\nsub-page-header\ntech-minimal\nheader-container\nsub-category\npage-title\nbreadcrumb\nglow-sphere-1\nglow-sphere-2\n\n\uc704 \ud074\ub798\uc2a4\ub294 \uae30\uc874 N FUTURE \uc0ac\uc774\ud2b8\uc758 \uacf5\ud1b5 CSS\ub97c \uadf8\ub300\ub85c \uc0ac\uc6a9\ud569\ub2c8\ub2e4.\n=========================================================\n-->\n\n<section\n    class=\"sub-page-header tech-minimal\"\n    data-aos=\"fade-up\"\n    data-aos-duration=\"1500\">\n\n    <div class=\"glow-sphere-1\"><\/div>\n    <div class=\"glow-sphere-2\"><\/div>\n\n    <div class=\"header-container\">\n\n        <span class=\"sub-category\">\n            COMPANY PROFILE\n        <\/span>\n\n        <h1 class=\"page-title\">\n            \ud68c\uc0ac\uc18c\uac1c\n        <\/h1>\n\n        <div class=\"breadcrumb\">\n\n            <span class=\"home\">\n                N FUTURE\n            <\/span>\n\n            <span class=\"sep\">\/\/<\/span>\n\n            <span class=\"home\">\n                ABOUT US\n            <\/span>\n\n            <span class=\"sep\">\/\/<\/span>\n\n            <span class=\"current\">\n                COMPANY PROFILE\n            <\/span>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n\n\n\n\n<style>\n\/* =========================================================\n   N FUTURE COMPANY PROFILE\n   \ud5e4\ub354 CSS \uc5c6\uc74c\n========================================================= *\/\n\n.nf-company-shell,\n.nf-company-shell * {\n    box-sizing: border-box;\n}\n\n.nf-company-shell {\n    --nf-blue: #0052ff;\n    --nf-navy: #0f172a;\n    --nf-text: #526279;\n    --nf-muted: #64748b;\n    --nf-line: #dbe3ed;\n    --nf-bg: #f6f8fb;\n\n    width: 100%;\n    overflow: hidden;\n\n    background: #fff;\n\n    font-family:\n        'Pretendard',\n        'Noto Sans KR',\n        -apple-system,\n        BlinkMacSystemFont,\n        sans-serif;\n\n    color: var(--nf-navy);\n}\n\n.nf-company-shell h1,\n.nf-company-shell h2,\n.nf-company-shell h3,\n.nf-company-shell p {\n    margin: 0;\n}\n\n.nf-company-shell img {\n    display: block;\n    max-width: 100%;\n}\n\n.nf-company-inner {\n    width: calc(100% - 48px);\n    max-width: 1200px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================================\n   REVEAL MOTION\n========================================================= *\/\n\n.nf-company-shell.motion-ready .nf-reveal {\n    opacity: 0;\n\n    transform: translate3d(0, 26px, 0);\n\n    transition:\n        opacity 1.05s cubic-bezier(.22,1,.36,1),\n        transform 1.05s cubic-bezier(.22,1,.36,1);\n\n    transition-delay: var(--nf-delay, 0ms);\n\n    will-change: opacity, transform;\n}\n\n.nf-company-shell.motion-ready\n.nf-reveal.is-visible {\n    opacity: 1;\n\n    transform: translate3d(0,0,0);\n}\n\n\n\/* =========================================================\n   COMMON SECTION\n========================================================= *\/\n\n.nf-section-index {\n    display: flex;\n    align-items: center;\n\n    gap: 14px;\n\n    margin-bottom: 23px;\n}\n\n.nf-section-index .num {\n    color: var(--nf-blue);\n\n    font-size: 13px;\n    font-weight: 800;\n}\n\n.nf-section-index .line {\n    flex: 0 0 38px;\n\n    width: 38px;\n    height: 1px;\n\n    background: #cbd5e1;\n}\n\n.nf-section-index .label {\n    color: #64748b;\n\n    font-size: 12px;\n    font-weight: 800;\n\n    letter-spacing: 1.7px;\n}\n\n.nf-section-title {\n    color: var(--nf-navy);\n\n    font-size: clamp(36px, 3.7vw, 48px);\n    line-height: 1.45;\n    font-weight: 750;\n\n    letter-spacing: -1.8px;\n\n    word-break: keep-all;\n}\n\n\n\/* =========================================================\n   01 ABOUT\n========================================================= *\/\n\n.nf-about {\n    width: 100%;\n\n    padding: 105px 24px 120px;\n\n    background: #fff;\n}\n\n.nf-about-layout {\n    display: grid;\n\n    grid-template-columns:\n        minmax(0, .78fr)\n        minmax(0, 1.22fr);\n\n    gap: 82px;\n\n    align-items: start;\n}\n\n\n\/* ABOUT TEXT *\/\n\n.nf-company-shell .nf-about-lead {\n    margin: 0 0 27px !important;\n\n    color: #0f172a !important;\n\n    font-size: 20px !important;\n    line-height: 1.85 !important;\n    font-weight: 650 !important;\n\n    letter-spacing: -.35px;\n\n    word-break: keep-all;\n}\n\n.nf-company-shell .nf-about-text {\n    margin: 0 0 17px !important;\n\n    color: #526279 !important;\n\n    font-size: 17px !important;\n    line-height: 1.9 !important;\n    font-weight: 400 !important;\n\n    letter-spacing: -.15px;\n\n    word-break: keep-all;\n}\n\n.nf-company-shell .nf-about-text:last-child {\n    margin-bottom: 0 !important;\n}\n\n\n\/* =========================================================\n   BATTERY KEYWORDS\n========================================================= *\/\n\n.nf-keywords {\n    margin-top: 78px;\n\n    border-top: 1px solid var(--nf-line);\n    border-bottom: 1px solid var(--nf-line);\n}\n\n.nf-keyword-grid {\n    display: grid;\n\n    grid-template-columns: repeat(4, 1fr);\n}\n\n.nf-keyword {\n    position: relative;\n\n    min-height: 158px;\n\n    padding: 31px 28px 30px;\n\n    overflow: hidden;\n\n    border-right: 1px solid var(--nf-line);\n\n    transition:\n        padding-left .55s cubic-bezier(.22,1,.36,1),\n        background-color .55s cubic-bezier(.22,1,.36,1);\n}\n\n.nf-keyword:last-child {\n    border-right: 0;\n}\n\n.nf-keyword::after {\n    content: \"\";\n\n    position: absolute;\n\n    left: 0;\n    bottom: 0;\n\n    width: 0;\n    height: 2px;\n\n    background: var(--nf-blue);\n\n    transition:\n        width .65s cubic-bezier(.22,1,.36,1);\n}\n\n.nf-keyword:hover {\n    padding-left: 34px;\n\n    background: #f8faff;\n}\n\n.nf-keyword:hover::after {\n    width: 100%;\n}\n\n.nf-keyword-num {\n    display: block;\n\n    margin-bottom: 26px;\n\n    color: var(--nf-blue);\n\n    font-size: 11px;\n    font-weight: 800;\n}\n\n.nf-keyword strong {\n    display: block;\n\n    color: var(--nf-navy);\n\n    font-size: 19px;\n    line-height: 1.55;\n    font-weight: 720;\n\n    word-break: keep-all;\n}\n\n\n\/* =========================================================\n   02 TECHNOLOGY BACKGROUND\n========================================================= *\/\n\n.nf-background {\n    width: 100%;\n\n    padding: 135px 24px;\n\n    background: var(--nf-bg);\n}\n\n.nf-background-head {\n    display: grid;\n\n    grid-template-columns:\n        minmax(0,.8fr)\n        minmax(0,1.2fr);\n\n    gap: 80px;\n\n    align-items: end;\n\n    margin-bottom: 65px;\n}\n\n.nf-company-shell .nf-background-desc {\n    margin: 0 !important;\n\n    padding-bottom: 4px;\n\n    color: #526279 !important;\n\n    font-size: 18px !important;\n    line-height: 1.9 !important;\n    font-weight: 400 !important;\n\n    letter-spacing: -.15px;\n\n    word-break: keep-all;\n}\n\n\n\/* =========================================================\n   KARI \/ CES\n========================================================= *\/\n\n.nf-background-grid {\n    display: grid;\n\n    grid-template-columns:\n        repeat(2, minmax(0,1fr));\n\n    gap: 30px;\n}\n\n.nf-history-panel {\n    min-width: 0;\n\n    overflow: hidden;\n\n    background: #fff;\n\n    box-shadow:\n        0 15px 48px rgba(15,23,42,.04);\n\n    transition:\n        transform .75s cubic-bezier(.22,1,.36,1),\n        box-shadow .75s cubic-bezier(.22,1,.36,1);\n}\n\n.nf-history-panel:hover {\n    transform: translateY(-5px);\n\n    box-shadow:\n        0 25px 65px rgba(15,23,42,.09);\n}\n\n.nf-history-image {\n    position: relative;\n\n    width: 100%;\n    height: 390px;\n\n    overflow: hidden;\n\n    background: #e8edf4;\n}\n\n.nf-history-image > img {\n    width: 100%;\n    height: 100%;\n\n    object-fit: cover;\n\n    transform: scale(1.001);\n\n    transition:\n        transform 1.35s cubic-bezier(.22,1,.36,1);\n}\n\n.nf-history-panel:hover\n.nf-history-image > img {\n    transform: scale(1.045);\n}\n\n.nf-history-image::after {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 0;\n\n    background:\n        linear-gradient(\n            180deg,\n            rgba(5,15,31,0) 38%,\n            rgba(5,15,31,.62) 100%\n        );\n\n    pointer-events: none;\n}\n\n\n\/* KARI IMAGE *\/\n\n.nf-kari-image img {\n    object-position: center center;\n}\n\n\n\/* CES *\/\n\n.nf-ces-image img {\n    object-position: center center;\n}\n\n\n\/* IMAGE OVERLAY *\/\n\n.nf-history-image-label {\n    position: absolute;\n    z-index: 3;\n\n    left: 28px;\n    right: 28px;\n    bottom: 26px;\n\n    color: #fff;\n}\n\n.nf-history-image-label span {\n    display: block;\n\n    margin-bottom: 8px;\n\n    color: #8aafff;\n\n    font-size: 11px;\n    line-height: 1;\n    font-weight: 800;\n\n    letter-spacing: 1.5px;\n}\n\n.nf-history-image-label strong {\n    display: block;\n\n    color: #fff;\n\n    font-size: 25px;\n    line-height: 1.35;\n    font-weight: 700;\n\n    letter-spacing: -.5px;\n}\n\n\n\/* HISTORY COPY *\/\n\n.nf-history-content {\n    min-height: 230px;\n\n    padding: 34px 35px 38px;\n}\n\n.nf-history-number {\n    display: block;\n\n    margin-bottom: 17px;\n\n    color: var(--nf-blue);\n\n    font-size: 11px;\n    font-weight: 800;\n\n    letter-spacing: .4px;\n}\n\n.nf-history-content h3 {\n    margin: 0 0 14px !important;\n\n    color: var(--nf-navy);\n\n    font-size: 23px;\n    line-height: 1.5;\n    font-weight: 730;\n\n    letter-spacing: -.6px;\n\n    word-break: keep-all;\n}\n\n.nf-company-shell\n.nf-history-content p {\n    margin: 0 !important;\n\n    color: #64748b !important;\n\n    font-size: 15.5px !important;\n    line-height: 1.85 !important;\n\n    word-break: keep-all;\n}\n\n\n\/* =========================================================\n   03 CORE VALUES\n========================================================= *\/\n\n.nf-values {\n    width: 100%;\n\n    padding: 135px 24px;\n\n    background: #fff;\n}\n\n.nf-values-header {\n    display: grid;\n\n    grid-template-columns:\n        minmax(0,.82fr)\n        minmax(0,1.18fr);\n\n    gap: 80px;\n\n    align-items: end;\n\n    margin-bottom: 67px;\n}\n\n.nf-company-shell\n.nf-values-desc {\n    margin: 0 !important;\n\n    max-width: 660px;\n\n    padding-bottom: 4px;\n\n    color: #526279 !important;\n\n    font-size: 18px !important;\n    line-height: 1.9 !important;\n    font-weight: 400 !important;\n\n    word-break: keep-all;\n}\n\n\n\/* =========================================================\n   CORE VALUES INTERACTION\n========================================================= *\/\n\n.nf-values-list {\n    position: relative;\n\n    overflow: hidden;\n\n    border-top: 1px solid #cbd5e1;\n}\n\n\n\/* \ud654\uba74 \uc9c4\uc785 \uc804 *\/\n\n.nf-company-shell.motion-ready\n.nf-values-list\n.nf-value-row {\n    opacity: 0;\n\n    transform:\n        translate3d(0,22px,0);\n}\n\n\n\/* \ud654\uba74 \uc9c4\uc785 *\/\n\n.nf-company-shell.motion-ready\n.nf-values-list.is-visible\n.nf-value-row {\n    opacity: 1;\n\n    transform:\n        translate3d(0,0,0);\n}\n\n\n\/* \uc790\uc5f0\uc2a4\ub7ec\uc6b4 \uc21c\ucc28 \uc18d\ub3c4 *\/\n\n.nf-values-list\n.nf-value-row:nth-child(1) {\n    transition-delay: 0ms;\n}\n\n.nf-values-list\n.nf-value-row:nth-child(2) {\n    transition-delay: 75ms;\n}\n\n.nf-values-list\n.nf-value-row:nth-child(3) {\n    transition-delay: 150ms;\n}\n\n.nf-values-list\n.nf-value-row:nth-child(4) {\n    transition-delay: 225ms;\n}\n\n\n.nf-value-row {\n    position: relative;\n\n    display: grid;\n\n    grid-template-columns:\n        90px\n        260px\n        minmax(0,1fr);\n\n    gap: 30px;\n\n    align-items: center;\n\n    min-height: 128px;\n\n    overflow: hidden;\n\n    border-bottom:\n        1px solid var(--nf-line);\n\n    transition:\n        opacity .9s cubic-bezier(.22,1,.36,1),\n        transform .9s cubic-bezier(.22,1,.36,1),\n        padding-left .6s cubic-bezier(.22,1,.36,1),\n        background-color .6s cubic-bezier(.22,1,.36,1);\n}\n\n\n\/* HOVER *\/\n\n.nf-value-row::before {\n    content: \"\";\n\n    position: absolute;\n\n    top: 0;\n    bottom: 0;\n    left: 0;\n\n    width: 0;\n\n    background:\n        linear-gradient(\n            90deg,\n            rgba(0,82,255,.05),\n            rgba(0,82,255,0)\n        );\n\n    transition:\n        width .75s cubic-bezier(.22,1,.36,1);\n}\n\n.nf-value-row:hover {\n    padding-left: 13px;\n}\n\n.nf-value-row:hover::before {\n    width: 55%;\n}\n\n.nf-value-num,\n.nf-value-title,\n.nf-value-text {\n    position: relative;\n\n    z-index: 2;\n}\n\n.nf-value-num {\n    color: var(--nf-blue);\n\n    font-size: 12px;\n    font-weight: 800;\n\n    transition:\n        transform .5s cubic-bezier(.22,1,.36,1);\n}\n\n.nf-value-row:hover\n.nf-value-num {\n    transform: translateX(3px);\n}\n\n.nf-value-title {\n    color: var(--nf-navy);\n\n    font-size: 24px;\n    line-height: 1.3;\n    font-weight: 720;\n\n    letter-spacing: -.5px;\n}\n\n.nf-value-text {\n    color: #526279;\n\n    font-size: 16.5px;\n    line-height: 1.8;\n\n    word-break: keep-all;\n}\n\n\n\/* =========================================================\n   04 FUTURE MOBILITY\n========================================================= *\/\n\n.nf-mobility {\n    width: 100%;\n\n    padding: 135px 24px 145px;\n\n    background: #f7f9fc;\n}\n\n.nf-mobility-header {\n    display: grid;\n\n    grid-template-columns:\n        minmax(0,.85fr)\n        minmax(0,1.15fr);\n\n    gap: 76px;\n\n    align-items: end;\n\n    margin-bottom: 68px;\n}\n\n.nf-company-shell\n.nf-mobility-desc {\n    margin: 0 !important;\n\n    max-width: 670px;\n\n    padding-bottom: 4px;\n\n    color: #526279 !important;\n\n    font-size: 18px !important;\n    line-height: 1.9 !important;\n    font-weight: 400 !important;\n\n    word-break: keep-all;\n}\n\n\n\/* =========================================================\n   MOBILITY GRID\n========================================================= *\/\n\n.nf-mobility-grid {\n    display: grid;\n\n    grid-template-columns:\n        repeat(3,minmax(0,1fr));\n\n    gap: 3px;\n\n    background: #fff;\n}\n\n.nf-mobility-item {\n    position: relative;\n\n    min-width: 0;\n    height: 500px;\n\n    overflow: hidden;\n\n    background: #0f172a;\n}\n\n.nf-mobility-item img {\n    width: 100%;\n    height: 100%;\n\n    object-fit: cover;\n\n    transform: scale(1.001);\n\n    transition:\n        transform 1.35s cubic-bezier(.22,1,.36,1),\n        filter 1.35s cubic-bezier(.22,1,.36,1);\n}\n\n.nf-mobility-item:hover img {\n    transform: scale(1.045);\n}\n\n.nf-mobility-item::after {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 0;\n\n    background:\n        linear-gradient(\n            180deg,\n            rgba(4,13,29,.01) 18%,\n            rgba(4,13,29,.12) 48%,\n            rgba(4,13,29,.92) 100%\n        );\n}\n\n\n\/* IMAGE CROP *\/\n\n.nf-aav img {\n    object-position: center center;\n}\n\n.nf-uam img {\n    object-position: center center;\n}\n\n.nf-drone img {\n    object-position: center center;\n}\n\n\n\/* MOBILITY COPY *\/\n\n.nf-mobility-info {\n    position: absolute;\n    z-index: 3;\n\n    left: 31px;\n    right: 31px;\n    bottom: 31px;\n}\n\n.nf-mobility-label {\n    display: block;\n\n    margin-bottom: 9px;\n\n    color: #8aafff;\n\n    font-size: 11px;\n    line-height: 1;\n    font-weight: 800;\n\n    letter-spacing: 1.5px;\n}\n\n.nf-mobility-info h3 {\n    color: #fff;\n\n    font-size: 27px;\n    line-height: 1.35;\n    font-weight: 720;\n\n    letter-spacing: -.5px;\n}\n\n.nf-company-shell\n.nf-mobility-info p {\n    margin: 12px 0 0 !important;\n\n    color:\n        rgba(255,255,255,.78) !important;\n\n    font-size: 14.5px !important;\n    line-height: 1.7 !important;\n\n    word-break: keep-all;\n}\n\n\n\/* =========================================================\n   END\n========================================================= *\/\n\n.nf-ending {\n    position: relative;\n\n    width: 100%;\n\n    padding: 120px 24px 125px;\n\n    overflow: hidden;\n\n    background: #0b1729;\n}\n\n.nf-ending::after {\n    content: \"N FUTURE\";\n\n    position: absolute;\n\n    right: -25px;\n    bottom: -38px;\n\n    color:\n        rgba(255,255,255,.028);\n\n    font-size: 150px;\n    line-height: 1;\n    font-weight: 800;\n\n    letter-spacing: -8px;\n\n    white-space: nowrap;\n}\n\n.nf-ending-inner {\n    position: relative;\n    z-index: 2;\n\n    max-width: 1200px;\n\n    margin: 0 auto;\n}\n\n.nf-ending-line {\n    width: 58px;\n    height: 3px;\n\n    margin-bottom: 34px;\n\n    background: var(--nf-blue);\n}\n\n.nf-ending-label {\n    display: block;\n\n    margin-bottom: 20px;\n\n    color: #77a0ff;\n\n    font-size: 12px;\n    font-weight: 800;\n\n    letter-spacing: 1.7px;\n}\n\n.nf-ending h2 {\n    max-width: 940px;\n\n    color: #fff;\n\n    font-size:\n        clamp(30px,3.8vw,46px);\n\n    line-height: 1.55;\n    font-weight: 620;\n\n    letter-spacing: -1.6px;\n\n    word-break: keep-all;\n}\n\n\n\/* =========================================================\n   SMALL DESKTOP\n   1025 ~ 1279\n========================================================= *\/\n\n@media\n(min-width:1025px)\nand (max-width:1279px) {\n\n    .nf-company-inner {\n        width: calc(100% - 64px);\n    }\n\n    .nf-about-layout {\n        gap: 60px;\n    }\n\n    .nf-background-head,\n    .nf-values-header,\n    .nf-mobility-header {\n        gap: 55px;\n    }\n\n    .nf-section-title {\n        font-size: 40px;\n    }\n\n    .nf-history-image {\n        height: 340px;\n    }\n\n    .nf-mobility-item {\n        height: 450px;\n    }\n}\n\n\n\/* =========================================================\n   TABLET\n   769 ~ 1024\n========================================================= *\/\n\n@media\n(min-width:769px)\nand (max-width:1024px) {\n\n    .nf-company-inner {\n        width: calc(100% - 56px);\n    }\n\n    .nf-about {\n        padding:\n            95px 28px 105px;\n    }\n\n    .nf-about-layout {\n        grid-template-columns: 1fr;\n\n        gap: 45px;\n    }\n\n    .nf-section-title {\n        font-size: 38px;\n    }\n\n    .nf-company-shell\n    .nf-about-lead {\n        max-width: 780px;\n\n        font-size:\n            21px !important;\n    }\n\n    .nf-company-shell\n    .nf-about-text {\n        max-width: 800px;\n    }\n\n    .nf-keywords {\n        margin-top: 65px;\n    }\n\n    .nf-keyword-grid {\n        grid-template-columns:\n            repeat(2,1fr);\n    }\n\n    .nf-keyword:nth-child(2) {\n        border-right: 0;\n    }\n\n    .nf-keyword:nth-child(1),\n    .nf-keyword:nth-child(2) {\n        border-bottom:\n            1px solid var(--nf-line);\n    }\n\n    .nf-background,\n    .nf-values,\n    .nf-mobility {\n        padding:\n            105px 28px 110px;\n    }\n\n    .nf-background-head,\n    .nf-values-header,\n    .nf-mobility-header {\n        grid-template-columns: 1fr;\n\n        gap: 30px;\n\n        margin-bottom: 52px;\n    }\n\n    .nf-company-shell\n    .nf-background-desc,\n    .nf-company-shell\n    .nf-values-desc,\n    .nf-company-shell\n    .nf-mobility-desc {\n        max-width: 800px;\n\n        font-size:\n            18px !important;\n    }\n\n    .nf-history-image {\n        height: 310px;\n    }\n\n    .nf-history-content {\n        padding:\n            30px 28px 33px;\n    }\n\n    .nf-value-row {\n        grid-template-columns:\n            65px\n            210px\n            minmax(0,1fr);\n\n        gap: 22px;\n    }\n\n    .nf-mobility-grid {\n        grid-template-columns:\n            repeat(2,1fr);\n    }\n\n    .nf-mobility-item {\n        height: 430px;\n    }\n\n    .nf-mobility-item:last-child {\n        grid-column: 1 \/ -1;\n\n        height: 390px;\n    }\n}\n\n\n\/* =========================================================\n   WIDE MOBILE\n   600 ~ 768\n========================================================= *\/\n\n@media\n(min-width:600px)\nand (max-width:768px) {\n\n    .nf-company-inner {\n        width:\n            calc(100% - 44px);\n    }\n\n    .nf-about {\n        padding:\n            82px 22px 90px;\n    }\n\n    .nf-about-layout {\n        grid-template-columns: 1fr;\n\n        gap: 42px;\n    }\n\n    .nf-section-title {\n        font-size: 35px;\n    }\n\n    .nf-company-shell\n    .nf-about-lead {\n        font-size:\n            20px !important;\n    }\n\n    .nf-company-shell\n    .nf-about-text {\n        font-size:\n            16.5px !important;\n    }\n\n    .nf-keywords {\n        margin-top: 55px;\n    }\n\n    .nf-keyword-grid {\n        grid-template-columns:\n            repeat(2,1fr);\n    }\n\n    .nf-keyword {\n        min-height: 135px;\n    }\n\n    .nf-keyword:nth-child(2) {\n        border-right: 0;\n    }\n\n    .nf-keyword:nth-child(1),\n    .nf-keyword:nth-child(2) {\n        border-bottom:\n            1px solid var(--nf-line);\n    }\n\n    .nf-background,\n    .nf-values,\n    .nf-mobility {\n        padding:\n            90px 22px 95px;\n    }\n\n    .nf-background-head,\n    .nf-values-header,\n    .nf-mobility-header {\n        grid-template-columns: 1fr;\n\n        gap: 28px;\n\n        margin-bottom: 45px;\n    }\n\n    .nf-company-shell\n    .nf-background-desc,\n    .nf-company-shell\n    .nf-values-desc,\n    .nf-company-shell\n    .nf-mobility-desc {\n        font-size:\n            17.5px !important;\n    }\n\n    .nf-background-grid {\n        grid-template-columns: 1fr;\n\n        gap: 34px;\n    }\n\n    .nf-history-image {\n        height: 350px;\n    }\n\n    .nf-history-content {\n        min-height: 0;\n\n        padding:\n            30px 28px 34px;\n    }\n\n    .nf-value-row {\n        grid-template-columns:\n            52px\n            180px\n            minmax(0,1fr);\n\n        gap: 17px;\n\n        min-height: 115px;\n    }\n\n    .nf-value-title {\n        font-size: 21px;\n    }\n\n    .nf-value-text {\n        font-size: 15px;\n    }\n\n    .nf-mobility-grid {\n        grid-template-columns: 1fr;\n    }\n\n    .nf-mobility-item {\n        height: 450px;\n    }\n\n    .nf-ending {\n        padding:\n            90px 22px 95px;\n    }\n\n    .nf-ending h2 {\n        font-size: 32px;\n    }\n}\n\n\n\/* =========================================================\n   MOBILE\n   480 ~ 599\n========================================================= *\/\n\n@media\n(min-width:480px)\nand (max-width:599px) {\n\n    .nf-company-inner {\n        width:\n            calc(100% - 40px);\n    }\n\n    .nf-about {\n        padding:\n            75px 20px 82px;\n    }\n\n    .nf-about-layout {\n        grid-template-columns: 1fr;\n\n        gap: 36px;\n    }\n\n    .nf-section-title {\n        font-size: 31px;\n    }\n\n    .nf-company-shell\n    .nf-about-lead {\n        font-size:\n            19px !important;\n    }\n\n    .nf-company-shell\n    .nf-about-text {\n        font-size:\n            16px !important;\n    }\n\n    .nf-keywords {\n        margin-top: 48px;\n    }\n\n    .nf-keyword-grid {\n        grid-template-columns:\n            repeat(2,1fr);\n    }\n\n    .nf-keyword {\n        min-height: 125px;\n\n        padding: 24px 19px;\n    }\n\n    .nf-keyword:nth-child(2) {\n        border-right: 0;\n    }\n\n    .nf-keyword:nth-child(1),\n    .nf-keyword:nth-child(2) {\n        border-bottom:\n            1px solid var(--nf-line);\n    }\n\n    .nf-keyword strong {\n        font-size: 16px;\n    }\n\n    .nf-background,\n    .nf-values,\n    .nf-mobility {\n        padding:\n            80px 20px 85px;\n    }\n\n    .nf-background-head,\n    .nf-values-header,\n    .nf-mobility-header {\n        grid-template-columns: 1fr;\n\n        gap: 24px;\n\n        margin-bottom: 38px;\n    }\n\n    .nf-company-shell\n    .nf-background-desc,\n    .nf-company-shell\n    .nf-values-desc,\n    .nf-company-shell\n    .nf-mobility-desc {\n        font-size:\n            17px !important;\n    }\n\n    .nf-background-grid {\n        grid-template-columns: 1fr;\n\n        gap: 30px;\n    }\n\n    .nf-history-image {\n        height: 285px;\n    }\n\n    .nf-history-content {\n        min-height: 0;\n\n        padding:\n            26px 23px 29px;\n    }\n\n    .nf-history-content h3 {\n        font-size: 20px;\n    }\n\n    .nf-company-shell\n    .nf-history-content p {\n        font-size:\n            14.5px !important;\n    }\n\n    .nf-value-row {\n        grid-template-columns:\n            43px\n            minmax(0,1fr);\n\n        gap: 8px 14px;\n\n        min-height: 0;\n\n        padding:\n            25px 0;\n    }\n\n    .nf-value-title {\n        font-size: 20px;\n    }\n\n    .nf-value-text {\n        grid-column: 2;\n\n        font-size: 15px;\n    }\n\n    .nf-mobility-grid {\n        grid-template-columns: 1fr;\n    }\n\n    .nf-mobility-item {\n        height: 410px;\n    }\n\n    .nf-mobility-info {\n        left: 25px;\n        right: 25px;\n        bottom: 25px;\n    }\n\n    .nf-ending {\n        padding:\n            82px 20px 88px;\n    }\n\n    .nf-ending h2 {\n        font-size: 29px;\n    }\n}\n\n\n\/* =========================================================\n   SMALL MOBILE\n   ~479\n========================================================= *\/\n\n@media (max-width:479px) {\n\n    .nf-company-inner {\n        width:\n            calc(100% - 36px);\n    }\n\n    .nf-about {\n        padding:\n            68px 18px 75px;\n    }\n\n    .nf-about-layout {\n        grid-template-columns: 1fr;\n\n        gap: 32px;\n    }\n\n    .nf-section-index {\n        gap: 10px;\n\n        margin-bottom: 18px;\n    }\n\n    .nf-section-index .line {\n        flex-basis: 28px;\n\n        width: 28px;\n    }\n\n    .nf-section-index .label {\n        font-size: 10.5px;\n\n        letter-spacing: 1.3px;\n    }\n\n    .nf-section-title {\n        font-size: 28px;\n        line-height: 1.5;\n\n        letter-spacing: -1.1px;\n    }\n\n    .nf-company-shell\n    .nf-about-lead {\n        margin-bottom:\n            23px !important;\n\n        font-size:\n            18px !important;\n\n        line-height:\n            1.78 !important;\n    }\n\n    .nf-company-shell\n    .nf-about-text {\n        margin-bottom:\n            15px !important;\n\n        font-size:\n            15.5px !important;\n\n        line-height:\n            1.85 !important;\n    }\n\n    .nf-keywords {\n        margin-top: 42px;\n    }\n\n    .nf-keyword-grid {\n        grid-template-columns:\n            repeat(2,1fr);\n    }\n\n    .nf-keyword {\n        min-height: 113px;\n\n        padding: 21px 14px;\n    }\n\n    .nf-keyword:nth-child(2) {\n        border-right: 0;\n    }\n\n    .nf-keyword:nth-child(1),\n    .nf-keyword:nth-child(2) {\n        border-bottom:\n            1px solid var(--nf-line);\n    }\n\n    .nf-keyword-num {\n        margin-bottom: 15px;\n\n        font-size: 10px;\n    }\n\n    .nf-keyword strong {\n        font-size: 14.5px;\n    }\n\n    .nf-background,\n    .nf-values,\n    .nf-mobility {\n        padding:\n            72px 18px 78px;\n    }\n\n    .nf-background-head,\n    .nf-values-header,\n    .nf-mobility-header {\n        grid-template-columns: 1fr;\n\n        gap: 22px;\n\n        margin-bottom: 35px;\n    }\n\n    .nf-company-shell\n    .nf-background-desc,\n    .nf-company-shell\n    .nf-values-desc,\n    .nf-company-shell\n    .nf-mobility-desc {\n        font-size:\n            16px !important;\n\n        line-height:\n            1.85 !important;\n    }\n\n    .nf-background-grid {\n        grid-template-columns: 1fr;\n\n        gap: 27px;\n    }\n\n    .nf-history-image {\n        height: 245px;\n    }\n\n    .nf-history-image-label {\n        left: 20px;\n        right: 20px;\n        bottom: 18px;\n    }\n\n    .nf-history-image-label strong {\n        font-size: 21px;\n    }\n\n    .nf-history-content {\n        min-height: 0;\n\n        padding:\n            23px 20px 26px;\n    }\n\n    .nf-history-content h3 {\n        font-size: 19px;\n    }\n\n    .nf-company-shell\n    .nf-history-content p {\n        font-size:\n            14px !important;\n\n        line-height:\n            1.8 !important;\n    }\n\n    .nf-value-row {\n        grid-template-columns:\n            38px\n            minmax(0,1fr);\n\n        gap: 7px 11px;\n\n        min-height: 0;\n\n        padding:\n            22px 0;\n    }\n\n    .nf-value-title {\n        font-size: 19px;\n    }\n\n    .nf-value-text {\n        grid-column: 2;\n\n        font-size: 14.5px;\n        line-height: 1.75;\n    }\n\n    .nf-mobility-grid {\n        grid-template-columns: 1fr;\n    }\n\n    .nf-mobility-item {\n        height: 360px;\n    }\n\n    .nf-mobility-info {\n        left: 22px;\n        right: 22px;\n        bottom: 22px;\n    }\n\n    .nf-mobility-info h3 {\n        font-size: 22px;\n    }\n\n    .nf-company-shell\n    .nf-mobility-info p {\n        font-size:\n            13.5px !important;\n    }\n\n    .nf-ending {\n        padding:\n            75px 18px 80px;\n    }\n\n    .nf-ending h2 {\n        font-size: 26px;\n    }\n\n    .nf-ending::after {\n        font-size: 58px;\n    }\n}\n\n\n\/* =========================================================\n   REDUCED MOTION\n========================================================= *\/\n\n@media\n(prefers-reduced-motion:reduce) {\n\n    .nf-company-shell *,\n    .nf-company-shell *::before,\n    .nf-company-shell *::after {\n        transition-duration:\n            .01ms !important;\n\n        animation-duration:\n            .01ms !important;\n    }\n\n    .nf-company-shell.motion-ready\n    .nf-reveal,\n    .nf-company-shell.motion-ready\n    .nf-values-list\n    .nf-value-row {\n        opacity: 1 !important;\n\n        transform:\n            none !important;\n    }\n}\n<\/style>\n\n\n<div class=\"nf-company-shell\">\n\n\n    <!-- =====================================================\n         01 ABOUT N FUTURE\n    ====================================================== -->\n\n    <section class=\"nf-about\">\n\n        <div class=\"nf-company-inner\">\n\n            <div class=\"nf-about-layout\">\n\n\n                <div class=\"nf-reveal\">\n\n                    <div class=\"nf-section-index\">\n\n                        <span class=\"num\">\n                            01\n                        <\/span>\n\n                        <span class=\"line\"><\/span>\n\n                        <span class=\"label\">\n                            ABOUT N FUTURE\n                        <\/span>\n\n                    <\/div>\n\n                    <h2 class=\"nf-section-title\">\n                        \ubbf8\ub798 \ubaa8\ube4c\ub9ac\ud2f0\ub97c \uc704\ud55c<br>\n                        \ucc28\uc138\ub300 \ubc30\ud130\ub9ac \uae30\uc220\n                    <\/h2>\n\n                <\/div>\n\n\n\n                <div\n                    class=\"nf-about-copy nf-reveal\"\n                    style=\"--nf-delay:100ms;\">\n\n                    <p class=\"nf-about-lead\">\n                        \uc5d4\ud4e8\uccd0\ub294 \ub300\ud55c\ubbfc\uad6d\uc758 \uc6b0\uc8fc\ud56d\uacf5\uccad \uc0b0\ud558\n                        \ud55c\uad6d\ud56d\uacf5\uc6b0\uc8fc\uc5f0\uad6c\uc6d0\uc758 \uae30\uc220\uae30\ubc18\ucc3d\uc5c5\uc544\uce74\ub370\ubbf8\ub97c\n                        \ud1b5\ud558\uc5ec \uc124\ub9bd\ub41c \ucca8\ub2e8 \uae30\uc220 \uae30\uc5c5\uc785\ub2c8\ub2e4.\n                    <\/p>\n\n                    <p class=\"nf-about-text\">\n                        \uc720\ubb34\uc778 \ud56d\uacf5\uae30, \ubb3c\ub958\u00b7FPV\u00b7\ub18d\uc5c5\uc6a9 \ub4dc\ub860 \ub4f1\uc5d0\n                        \uc0ac\uc6a9\ub418\ub294 \uac00\uc7a5 \uc9c4\ubcf4\ub41c \ubc30\ud130\ub9ac\uc758 \uc5f0\uad6c \uac1c\ubc1c\uc744\n                        \uc804\ubb38\uc73c\ub85c \ud558\uace0 \uc788\uc2b5\ub2c8\ub2e4.\n                    <\/p>\n\n                    <p class=\"nf-about-text\">\n                        \uc6b0\ub9ac\ub294 \u201c\uac00\uc7a5 \uac00\ubcbc\uc6b4 \ubc30\ud130\ub9ac\u201d,\n                        \u201c\uac00\uc7a5 \uc548\uc804\ud55c \ubc30\ud130\ub9ac\u201d,\n                        \u201c\uace0\uc131\ub2a5 \ubc30\ud130\ub9ac\u201d,\n                        \u201c\ud569\ub9ac\uc801 \uac00\uaca9\uc758 \ubc30\ud130\ub9ac\u201d\ub97c \uc704\ud55c\n                        \ub178\ub825\uc744 \uc9c0\uc18d\ud558\uace0 \uc788\uc2b5\ub2c8\ub2e4.\n                    <\/p>\n\n                    <p class=\"nf-about-text\">\n                        \uc5d4\ud4e8\uccd0\uc758 \uc774\ub7ec\ud55c \ub178\ub825\uc740 \ubbf8\uad6d \uc18c\ube44\uc790 \uae30\uc220\ud611\ud68c\uc5d0\uc11c\n                        \uc778\uc815\ubc1b\uc544 CES \ud601\uc2e0\uc0c1\uc744 \uc218\uc0c1\ud558\uc600\uc2b5\ub2c8\ub2e4.\n                    <\/p>\n\n                    <p class=\"nf-about-text\">\n                        \ubbf8\ub798 \ubaa8\ube4c\ub9ac\ud2f0 \uc0b0\uc5c5\uc758 \ud0c4\uc18c\uc911\ub9bd\uc5d0 \uae30\uc5ec\ud558\uace0,\n                        \ub204\uad6c\ub098 \ub9cc\uc871\ud558\uba70 \uc548\uc804\ud558\uac8c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub294\n                        \ubc30\ud130\ub9ac \uae30\uc220\uc744 \uc9c0\uc18d\uc801\uc73c\ub85c \ub9cc\ub4e4\uc5b4\uac00\uaca0\uc2b5\ub2c8\ub2e4.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n\n            <!-- BATTERY POINT -->\n\n            <div class=\"nf-keywords nf-reveal\">\n\n                <div class=\"nf-keyword-grid\">\n\n                    <div class=\"nf-keyword\">\n\n                        <span class=\"nf-keyword-num\">\n                            01\n                        <\/span>\n\n                        <strong>\n                            \uac00\uc7a5 \uac00\ubcbc\uc6b4<br>\n                            \ubc30\ud130\ub9ac\n                        <\/strong>\n\n                    <\/div>\n\n\n                    <div class=\"nf-keyword\">\n\n                        <span class=\"nf-keyword-num\">\n                            02\n                        <\/span>\n\n                        <strong>\n                            \uac00\uc7a5 \uc548\uc804\ud55c<br>\n                            \ubc30\ud130\ub9ac\n                        <\/strong>\n\n                    <\/div>\n\n\n                    <div class=\"nf-keyword\">\n\n                        <span class=\"nf-keyword-num\">\n                            03\n                        <\/span>\n\n                        <strong>\n                            \uace0\uc131\ub2a5<br>\n                            \ubc30\ud130\ub9ac\n                        <\/strong>\n\n                    <\/div>\n\n\n                    <div class=\"nf-keyword\">\n\n                        <span class=\"nf-keyword-num\">\n                            04\n                        <\/span>\n\n                        <strong>\n                            \ud569\ub9ac\uc801\uc778 \uac00\uaca9\uc758<br>\n                            \ubc30\ud130\ub9ac\n                        <\/strong>\n\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/section>\n\n\n\n    <!-- =====================================================\n         02 TECHNOLOGY BACKGROUND\n    ====================================================== -->\n\n    <section class=\"nf-background\">\n\n        <div class=\"nf-company-inner\">\n\n\n            <div class=\"nf-background-head\">\n\n\n                <div class=\"nf-reveal\">\n\n                    <div class=\"nf-section-index\">\n\n                        <span class=\"num\">\n                            02\n                        <\/span>\n\n                        <span class=\"line\"><\/span>\n\n                        <span class=\"label\">\n                            TECHNOLOGY BACKGROUND\n                        <\/span>\n\n                    <\/div>\n\n                    <h2 class=\"nf-section-title\">\n                        \uae30\uc220\uc5d0\uc11c \uc2dc\uc791\ud574<br>\n                        \uc131\uacfc\ub85c \uc99d\uba85\ud569\ub2c8\ub2e4\n                    <\/h2>\n\n                <\/div>\n\n\n\n                <p\n                    class=\"nf-background-desc nf-reveal\"\n                    style=\"--nf-delay:100ms;\">\n\n                    \ud56d\uacf5\uc6b0\uc8fc \uae30\uc220\uc744 \uae30\ubc18\uc73c\ub85c \uc2dc\uc791\ud55c \uc5d4\ud4e8\uccd0\ub294\n                    \ubbf8\ub798 \ubaa8\ube4c\ub9ac\ud2f0\ub97c \uc704\ud55c \ubc30\ud130\ub9ac \uae30\uc220\uc744 \uc9c0\uc18d\uc801\uc73c\ub85c\n                    \uc5f0\uad6c\ud558\uba70 \uae30\uc220 \uacbd\uc7c1\ub825\uc744 \ud655\uc7a5\ud558\uace0 \uc788\uc2b5\ub2c8\ub2e4.\n\n                <\/p>\n\n            <\/div>\n\n\n\n            <div class=\"nf-background-grid\">\n\n\n                <!-- KARI -->\n\n                <article\n                    class=\"nf-history-panel nf-reveal\">\n\n                    <div\n                        class=\"nf-history-image nf-kari-image\">\n\n                        <img decoding=\"async\"\n                            src=\"https:\/\/images.unsplash.com\/photo-1712180468023-4d39c317a1d3?auto=format&amp;fit=crop&amp;w=1600&amp;q=85\"\n                            alt=\"\uaca9\ub0a9\uace0 \ub0b4\ubd80 \ud56d\uacf5\uae30\"\n                            loading=\"lazy\">\n\n                        <div\n                            class=\"nf-history-image-label\">\n\n                            <span>\n                                TECHNOLOGY BASE\n                            <\/span>\n\n                            <strong>\n                                Korea Aerospace<br>\n                                Research Institute\n                            <\/strong>\n\n                        <\/div>\n\n                    <\/div>\n\n\n                    <div class=\"nf-history-content\">\n\n                        <span\n                            class=\"nf-history-number\">\n                            BACKGROUND 01\n                        <\/span>\n\n                        <h3>\n                            \ud55c\uad6d\ud56d\uacf5\uc6b0\uc8fc\uc5f0\uad6c\uc6d0\n                            \uae30\uc220\uae30\ubc18\ucc3d\uc5c5\uc544\uce74\ub370\ubbf8\n                        <\/h3>\n\n                        <p>\n                            \uc5d4\ud4e8\uccd0\ub294 \ud55c\uad6d\ud56d\uacf5\uc6b0\uc8fc\uc5f0\uad6c\uc6d0\uc758\n                            \uae30\uc220\uae30\ubc18\ucc3d\uc5c5\uc544\uce74\ub370\ubbf8\ub97c \ud1b5\ud574 \uc124\ub9bd\ub418\uc5b4\n                            \ud56d\uacf5\u00b7\ub4dc\ub860 \ubd84\uc57c\uc758 \ubc30\ud130\ub9ac \uae30\uc220\uc744\n                            \uc9c0\uc18d\uc801\uc73c\ub85c \uc5f0\uad6c\ud558\uace0 \uc788\uc2b5\ub2c8\ub2e4.\n                        <\/p>\n\n                    <\/div>\n\n                <\/article>\n\n\n\n                <!-- CES -->\n\n                <article\n                    class=\"nf-history-panel nf-reveal\"\n                    style=\"--nf-delay:100ms;\">\n\n                    <div\n                        class=\"nf-history-image nf-ces-image\">\n\n                        <img decoding=\"async\"\n                            src=\"https:\/\/images.unsplash.com\/photo-1768590149213-8ab16aaf7511?auto=format&amp;fit=crop&amp;w=1600&amp;q=85\"\n                            alt=\"\ub77c\uc2a4\ubca0\uc774\uac70\uc2a4 CES \ud589\uc0ac\uc7a5\"\n                            loading=\"lazy\">\n\n                        <div\n                            class=\"nf-history-image-label\">\n\n                            <span>\n                                2025 AWARD\n                            <\/span>\n\n                            <strong>\n                                CES Innovation Award\n                            <\/strong>\n\n                        <\/div>\n\n                    <\/div>\n\n\n                    <div class=\"nf-history-content\">\n\n                        <span\n                            class=\"nf-history-number\">\n                            ACHIEVEMENT 02\n                        <\/span>\n\n                        <h3>\n                            CES \ud601\uc2e0\uc0c1 \uc218\uc0c1\n                        <\/h3>\n\n                        <p>\n                            \uc5d4\ud4e8\uccd0\uc758 \ubbf8\ub798 \ubaa8\ube4c\ub9ac\ud2f0 \ubc30\ud130\ub9ac \uae30\uc220\uacfc\n                            \uc9c0\uc18d\uc801\uc778 \ud601\uc2e0 \ub178\ub825\uc740 \ubbf8\uad6d \uc18c\ube44\uc790 \uae30\uc220\ud611\ud68c\uc5d0\uc11c\n                            \uc778\uc815\ubc1b\uc544 CES \ud601\uc2e0\uc0c1 \uc218\uc0c1\uc73c\ub85c \uc774\uc5b4\uc84c\uc2b5\ub2c8\ub2e4.\n                        <\/p>\n\n                    <\/div>\n\n                <\/article>\n\n            <\/div>\n\n        <\/div>\n\n    <\/section>\n\n\n\n    <!-- =====================================================\n         03 CORE VALUES\n    ====================================================== -->\n\n    <section class=\"nf-values\">\n\n        <div class=\"nf-company-inner\">\n\n\n            <div class=\"nf-values-header\">\n\n\n                <div class=\"nf-reveal\">\n\n                    <div class=\"nf-section-index\">\n\n                        <span class=\"num\">\n                            03\n                        <\/span>\n\n                        <span class=\"line\"><\/span>\n\n                        <span class=\"label\">\n                            CORE VALUES\n                        <\/span>\n\n                    <\/div>\n\n                    <h2 class=\"nf-section-title\">\n                        \uc5d4\ud4e8\uccd0\uac00 \uc9c0\ud5a5\ud558\ub294<br>\n                        \ub124 \uac00\uc9c0 \ud575\uc2ec\uac00\uce58\n                    <\/h2>\n\n                <\/div>\n\n\n\n                <p\n                    class=\"nf-values-desc nf-reveal\"\n                    style=\"--nf-delay:100ms;\">\n\n                    \uae30\uc220 \ud601\uc2e0\uacfc \uc548\uc804\uc131\uc744 \uae30\ubc18\uc73c\ub85c\n                    \ud569\ub9ac\uc801\uc778 \uc5d0\ub108\uc9c0 \uc194\ub8e8\uc158\uc744 \uc81c\uacf5\ud558\uace0,\n                    \uace0\uac1d\uc758 \uc694\uad6c\uc5d0 \uc720\uc5f0\ud558\uac8c \ub300\uc751\ud569\ub2c8\ub2e4.\n\n                <\/p>\n\n            <\/div>\n\n\n\n            <div class=\"nf-values-list\">\n\n\n                <div class=\"nf-value-row\">\n\n                    <div class=\"nf-value-num\">\n                        01\n                    <\/div>\n\n                    <div class=\"nf-value-title\">\n                        Innovation\n                    <\/div>\n\n                    <div class=\"nf-value-text\">\n                        \uac00\uc7a5 \uac00\ubcbc\uc6b4 \ubc30\ud130\ub9ac + \uace0\uc131\ub2a5 \ubc30\ud130\ub9ac\n                    <\/div>\n\n                <\/div>\n\n\n\n                <div class=\"nf-value-row\">\n\n                    <div class=\"nf-value-num\">\n                        02\n                    <\/div>\n\n                    <div class=\"nf-value-title\">\n                        Quality\n                    <\/div>\n\n                    <div class=\"nf-value-text\">\n                        \uac00\uc7a5 \uc548\uc804\ud55c \ubc30\ud130\ub9ac\n                    <\/div>\n\n                <\/div>\n\n\n\n                <div class=\"nf-value-row\">\n\n                    <div class=\"nf-value-num\">\n                        03\n                    <\/div>\n\n                    <div class=\"nf-value-title\">\n                        Sustainability\n                    <\/div>\n\n                    <div class=\"nf-value-text\">\n                        \ud569\ub9ac\uc801 \uac00\uaca9\uc758 \ubc30\ud130\ub9ac\ub85c \uc804\ub3d9\ud654 \uac00\uc18d\ud654\n                    <\/div>\n\n                <\/div>\n\n\n\n                <div class=\"nf-value-row\">\n\n                    <div class=\"nf-value-num\">\n                        04\n                    <\/div>\n\n                    <div class=\"nf-value-title\">\n                        Partnership\n                    <\/div>\n\n                    <div class=\"nf-value-text\">\n                        \uace0\uac1d \uc694\uccad\uc5d0 \ub9de\ub294 \uc81c\uc791\n                    <\/div>\n\n                <\/div>\n\n\n            <\/div>\n\n        <\/div>\n\n    <\/section>\n\n\n\n    <!-- =====================================================\n         04 FUTURE MOBILITY\n    ====================================================== -->\n\n    <section class=\"nf-mobility\">\n\n        <div class=\"nf-company-inner\">\n\n\n            <div class=\"nf-mobility-header\">\n\n\n                <div class=\"nf-reveal\">\n\n                    <div class=\"nf-section-index\">\n\n                        <span class=\"num\">\n                            04\n                        <\/span>\n\n                        <span class=\"line\"><\/span>\n\n                        <span class=\"label\">\n                            FUTURE MOBILITY\n                        <\/span>\n\n                    <\/div>\n\n                    <h2 class=\"nf-section-title\">\n                        \ub2e4\uc591\ud55c<br>\n                        \ubbf8\ub798 \uc774\ub3d9\uc218\ub2e8\uc744 \uc704\ud55c<br>\n                        \ubc30\ud130\ub9ac \uae30\uc220\n                    <\/h2>\n\n                <\/div>\n\n\n\n                <p\n                    class=\"nf-mobility-desc nf-reveal\"\n                    style=\"--nf-delay:100ms;\">\n\n                    \uc720\ubb34\uc778 \ud56d\uacf5\uae30\uc640 \ucc28\uc138\ub300 \ud56d\uacf5 \ubaa8\ube4c\ub9ac\ud2f0,\n                    \uc0b0\uc5c5\uc6a9 \ub4dc\ub860 \ub4f1 \ubbf8\ub798 \uc774\ub3d9\uc218\ub2e8\uc758 \uc804\ub3d9\ud654\ub97c \uc704\ud55c\n                    \uace0\uc131\ub2a5 \ubc30\ud130\ub9ac \uae30\uc220\uc744 \uc5f0\uad6c\ud558\uace0 \uac1c\ubc1c\ud569\ub2c8\ub2e4.\n\n                <\/p>\n\n            <\/div>\n\n\n\n            <div class=\"nf-mobility-grid\">\n\n\n                <!-- AAV -->\n\n                <article\n                    class=\"nf-mobility-item nf-aav nf-reveal\">\n\n                    <img decoding=\"async\"\n                        src=\"https:\/\/images.unsplash.com\/photo-1639847648040-b1af1ce3cecf?auto=format&amp;fit=crop&amp;w=1400&amp;q=85\"\n                        alt=\"VTOL \ubb34\uc778 \ud56d\uacf5\uae30\"\n                        loading=\"lazy\">\n\n                    <div class=\"nf-mobility-info\">\n\n                        <span\n                            class=\"nf-mobility-label\">\n                            ADVANCED AIR VEHICLE\n                        <\/span>\n\n                        <h3>\n                            AAV\n                        <\/h3>\n\n                        <p>\n                            \uc720\ubb34\uc778 \ud56d\uacf5\uae30\ub97c \uc704\ud55c\n                            \uace0\uc131\ub2a5 \ubc30\ud130\ub9ac \uae30\uc220\n                        <\/p>\n\n                    <\/div>\n\n                <\/article>\n\n\n\n                <!-- UAM -->\n\n                <article\n                    class=\"nf-mobility-item nf-uam nf-reveal\"\n                    style=\"--nf-delay:90ms;\">\n\n                    <img decoding=\"async\"\n                        src=\"https:\/\/images.unsplash.com\/photo-1776865193302-9308579ae4b8?auto=format&amp;fit=crop&amp;w=1400&amp;q=85\"\n                        alt=\"\ubbf8\ub798\ud615 \uc804\uae30 \ud56d\uacf5\uae30 UAM\"\n                        loading=\"lazy\">\n\n                    <div class=\"nf-mobility-info\">\n\n                        <span\n                            class=\"nf-mobility-label\">\n                            URBAN AIR MOBILITY\n                        <\/span>\n\n                        <h3>\n                            UAM\n                        <\/h3>\n\n                        <p>\n                            \ucc28\uc138\ub300 \ub3c4\uc2ec \ud56d\uacf5 \ud658\uacbd\uc744 \uc704\ud55c\n                            \uace0\ubc00\ub3c4 \uc5d0\ub108\uc9c0 \uc194\ub8e8\uc158\n                        <\/p>\n\n                    <\/div>\n\n                <\/article>\n\n\n\n                <!-- DRONE -->\n\n                <article\n                    class=\"nf-mobility-item nf-drone nf-reveal\"\n                    style=\"--nf-delay:180ms;\">\n\n                    <img decoding=\"async\"\n                        src=\"https:\/\/images.unsplash.com\/photo-1473968512647-3e447244af8f?auto=format&amp;fit=crop&amp;w=1400&amp;q=85\"\n                        alt=\"\ud558\ub298\uc744 \ube44\ud589\ud558\ub294 \ub4dc\ub860\"\n                        loading=\"lazy\">\n\n                    <div class=\"nf-mobility-info\">\n\n                        <span\n                            class=\"nf-mobility-label\">\n                            UNMANNED AERIAL VEHICLE\n                        <\/span>\n\n                        <h3>\n                            DRONE\n                        <\/h3>\n\n                        <p>\n                            \ubb3c\ub958\u00b7FPV\u00b7\ub18d\uc5c5\uc6a9 \ub4dc\ub860\uc744 \uc704\ud55c\n                            \uacbd\ub7c9 \uace0\uc131\ub2a5 \ubc30\ud130\ub9ac \uae30\uc220\n                        <\/p>\n\n                    <\/div>\n\n                <\/article>\n\n\n            <\/div>\n\n        <\/div>\n\n    <\/section>\n\n\n\n    <!-- =====================================================\n         END\n    ====================================================== -->\n\n    <section class=\"nf-ending\">\n\n        <div\n            class=\"nf-ending-inner nf-reveal\">\n\n            <div class=\"nf-ending-line\"><\/div>\n\n            <span class=\"nf-ending-label\">\n                OUR COMMITMENT\n            <\/span>\n\n            <h2>\n                \ubbf8\ub798 \ubaa8\ube4c\ub9ac\ud2f0 \uc0b0\uc5c5\uc758 \ud0c4\uc18c\uc911\ub9bd\uc5d0 \uae30\uc5ec\ud558\uace0,\n                \ub204\uad6c\ub098 \ub9cc\uc871\ud558\uba70 \uc548\uc804\ud558\uac8c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub294\n                \ubc30\ud130\ub9ac \uae30\uc220\uc744 \uc9c0\uc18d\uc801\uc73c\ub85c \ub9cc\ub4e4\uc5b4\uac00\uaca0\uc2b5\ub2c8\ub2e4.\n            <\/h2>\n\n        <\/div>\n\n    <\/section>\n\n\n<\/div>\n\n\n<script>\ndocument.addEventListener(\n    'DOMContentLoaded',\n    function () {\n\n        \/* =================================================\n           \uae30\uc874 \uc0ac\uc774\ud2b8 \ud5e4\ub354 AOS\n           aos-init \/ aos-animate \uc790\ub3d9 \uc0dd\uc131\n        ================================================= *\/\n\n        if (typeof AOS !== 'undefined') {\n\n            AOS.init();\n\n        }\n\n\n        const shell =\n            document.querySelector(\n                '.nf-company-shell'\n            );\n\n\n        if (!shell) {\n            return;\n        }\n\n\n        const reduceMotion =\n            window.matchMedia(\n                '(prefers-reduced-motion: reduce)'\n            ).matches;\n\n\n        if (reduceMotion) {\n\n            shell\n                .querySelectorAll(\n                    '.nf-reveal'\n                )\n                .forEach(\n                    function (element) {\n\n                        element.classList.add(\n                            'is-visible'\n                        );\n\n                    }\n                );\n\n\n            const valuesList =\n                shell.querySelector(\n                    '.nf-values-list'\n                );\n\n\n            if (valuesList) {\n\n                valuesList.classList.add(\n                    'is-visible'\n                );\n\n            }\n\n\n            return;\n\n        }\n\n\n        requestAnimationFrame(\n            function () {\n\n                shell.classList.add(\n                    'motion-ready'\n                );\n\n\n                requestAnimationFrame(\n                    function () {\n\n\n                        \/* =====================================\n                           GENERAL REVEAL\n                        ===================================== *\/\n\n                        const revealItems =\n                            shell.querySelectorAll(\n                                '.nf-reveal'\n                            );\n\n\n                        const revealObserver =\n                            new IntersectionObserver(\n\n                                function (\n                                    entries,\n                                    observer\n                                ) {\n\n                                    entries.forEach(\n                                        function (\n                                            entry\n                                        ) {\n\n                                            if (\n                                                !entry\n                                                    .isIntersecting\n                                            ) {\n                                                return;\n                                            }\n\n\n                                            entry\n                                                .target\n                                                .classList\n                                                .add(\n                                                    'is-visible'\n                                                );\n\n\n                                            observer\n                                                .unobserve(\n                                                    entry\n                                                        .target\n                                                );\n\n                                        }\n                                    );\n\n                                },\n\n                                {\n                                    threshold: 0.12,\n\n                                    rootMargin:\n                                        '0px 0px -7% 0px'\n                                }\n\n                            );\n\n\n                        revealItems.forEach(\n                            function (item) {\n\n                                revealObserver\n                                    .observe(item);\n\n                            }\n                        );\n\n\n                        \/* =====================================\n                           CORE VALUES\n                        ===================================== *\/\n\n                        const valuesList =\n                            shell.querySelector(\n                                '.nf-values-list'\n                            );\n\n\n                        if (valuesList) {\n\n                            const valuesObserver =\n                                new IntersectionObserver(\n\n                                    function (\n                                        entries,\n                                        observer\n                                    ) {\n\n                                        entries.forEach(\n                                            function (\n                                                entry\n                                            ) {\n\n                                                if (\n                                                    !entry\n                                                        .isIntersecting\n                                                ) {\n                                                    return;\n                                                }\n\n\n                                                entry\n                                                    .target\n                                                    .classList\n                                                    .add(\n                                                        'is-visible'\n                                                    );\n\n\n                                                observer\n                                                    .unobserve(\n                                                        entry\n                                                            .target\n                                                    );\n\n                                            }\n                                        );\n\n                                    },\n\n                                    {\n                                        threshold:\n                                            0.16,\n\n                                        rootMargin:\n                                            '0px 0px -5% 0px'\n                                    }\n\n                                );\n\n\n                            valuesObserver.observe(\n                                valuesList\n                            );\n\n                        }\n\n                    }\n                );\n\n            }\n        );\n\n    }\n);\n<\/script>\n\n","protected":false},"excerpt":{"rendered":"<p>COMPANY PROFILE \ud68c\uc0ac\uc18c\uac1c N FUTURE \/\/ ABOUT US \/\/ COMPANY PROFILE 01 ABOUT N FUTURE \ubbf8\ub798 \ubaa8\ube4c\ub9ac\ud2f0\ub97c \uc704\ud55c \ucc28\uc138\ub300 \ubc30\ud130\ub9ac \uae30\uc220 \uc5d4\ud4e8\uccd0\ub294 \ub300\ud55c\ubbfc\uad6d\uc758 \uc6b0\uc8fc\ud56d\uacf5\uccad \uc0b0\ud558 \ud55c\uad6d\ud56d\uacf5\uc6b0\uc8fc\uc5f0\uad6c\uc6d0\uc758 \uae30\uc220\uae30\ubc18\ucc3d\uc5c5\uc544\uce74\ub370\ubbf8\ub97c \ud1b5\ud558\uc5ec \uc124\ub9bd\ub41c \ucca8\ub2e8 \uae30\uc220 \uae30\uc5c5\uc785\ub2c8\ub2e4. \uc720\ubb34\uc778 \ud56d\uacf5\uae30, \ubb3c\ub958\u00b7FPV\u00b7\ub18d\uc5c5\uc6a9 \ub4dc\ub860 \ub4f1\uc5d0 \uc0ac\uc6a9\ub418\ub294 \uac00\uc7a5 \uc9c4\ubcf4\ub41c &hellip; <a href=\"https:\/\/nfuture.kr\/?page_id=563\">Continued<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-fullwidth.php","meta":{"kt_blocks_editor_width":"","footnotes":""},"class_list":["post-563","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nfuture.kr\/index.php?rest_route=\/wp\/v2\/pages\/563","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nfuture.kr\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nfuture.kr\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nfuture.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nfuture.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=563"}],"version-history":[{"count":7,"href":"https:\/\/nfuture.kr\/index.php?rest_route=\/wp\/v2\/pages\/563\/revisions"}],"predecessor-version":[{"id":597,"href":"https:\/\/nfuture.kr\/index.php?rest_route=\/wp\/v2\/pages\/563\/revisions\/597"}],"wp:attachment":[{"href":"https:\/\/nfuture.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=563"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}