From 5ab9bdb139f9a0fc3b13e62316a9733e0f93a90b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?siyeon00=28=EC=9D=B4=EC=8B=9C=EC=97=B0=29?=
 <siyeon00@palnet.co.kr>
Date: Fri, 12 Jun 2026 17:16:59 +0900
Subject: [PATCH] =?UTF-8?q?feat=20:=20=EC=BD=98=EC=86=94=20=EC=98=A4?=
 =?UTF-8?q?=EB=A5=98=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/FloatingKeywords.jsx |  2 +-
 src/components/SubHero.jsx          |  2 +-
 src/pages/solution/IbePage.jsx      | 13 ++++++++-----
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/components/FloatingKeywords.jsx b/src/components/FloatingKeywords.jsx
index 8504997..c6e38fe 100644
--- a/src/components/FloatingKeywords.jsx
+++ b/src/components/FloatingKeywords.jsx
@@ -39,7 +39,7 @@ export default function FloatingKeywords() {
     <div className="fk-wrap">
       {KEYWORDS.map((kw, i) => (
         <motion.span
-          key={kw.text}
+          key={i}
           className="fk-item"
           style={{
             left: `${POSITIONS[i].x}%`,
diff --git a/src/components/SubHero.jsx b/src/components/SubHero.jsx
index 96b02b9..a1e540b 100644
--- a/src/components/SubHero.jsx
+++ b/src/components/SubHero.jsx
@@ -217,7 +217,7 @@ export default function SubHero({ title, desc, navItems, rightSlot }) {
         (() => {
           const children = Array.isArray(title.props?.children)
             ? title.props.children
-            : [title];
+            : [title.props?.children ?? title];
           const lines = [];
           let current = [];
           children.forEach((child, i) => {
diff --git a/src/pages/solution/IbePage.jsx b/src/pages/solution/IbePage.jsx
index 98c8af6..7d4dce6 100644
--- a/src/pages/solution/IbePage.jsx
+++ b/src/pages/solution/IbePage.jsx
@@ -1,6 +1,6 @@
 import useFadeIn from "../../hooks/useFadeIn";
 import SubHero from "../../components/SubHero";
-import { useRef } from "react";
+import { Fragment, useRef } from "react";
 import { motion, useInView } from "framer-motion";
 import { Search, Armchair, CalendarClock, Wallet, Ticket } from "lucide-react";
 
@@ -173,13 +173,16 @@ function IbePage() {
               ].map((item, i) => {
                 const Icon = item.icon;
                 return (
-                  <>
+                  <Fragment key={i}>
                     <motion.div
-                      key={i}
                       className="ibe-booking__item"
                       initial={{ opacity: 0, y: 24 }}
                       animate={bookingInView ? { opacity: 1, y: 0 } : {}}
-                      transition={{ duration: 0.6, ease, delay: 0.2 + i * 0.1 }}
+                      transition={{
+                        duration: 0.6,
+                        ease,
+                        delay: 0.2 + i * 0.1,
+                      }}
                     >
                       <div className="ibe-booking__circle">
                         <Icon
@@ -208,7 +211,7 @@ function IbePage() {
                         <div className="ibe-booking__line-flow" />
                       </div>
                     )}
-                  </>
+                  </Fragment>
                 );
               })}
             </div>