{"id":29,"date":"2026-03-29T00:57:48","date_gmt":"2026-03-28T15:57:48","guid":{"rendered":"https:\/\/in.bemypet.kr\/bonetopet\/?page_id=29"},"modified":"2026-04-27T18:50:59","modified_gmt":"2026-04-27T09:50:59","slug":"home","status":"publish","type":"page","link":"https:\/\/in.bemypet.kr\/bonetopet\/","title":{"rendered":"\uba54\uc778"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"29\" class=\"elementor elementor-29\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e6b24d9 e-con-full e-flex e-con e-parent\" data-id=\"e6b24d9\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9e39489 elementor-widget elementor-widget-html\" data-id=\"9e39489\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link rel=\"stylesheet\" as=\"style\" crossorigin href=\"https:\/\/cdn.jsdelivr.net\/gh\/orioncactus\/pretendard@v1.3.9\/dist\/web\/static\/pretendard.min.css\" \/>\n\n<style>\n    \/* \ud788\uc5b4\ub85c \uc139\uc158 \uc804\uc6a9 \uc2a4\ud0c0\uc77c *\/\n    .hero-video-clear {\n        position: relative;\n        width: 100%;\n        height: 100vh; \/* \ud654\uba74 \ub192\uc774\ub97c 100% \uac00\ub4dd \ucc44\uc6c0 *\/\n        min-height: 700px;\n        overflow: hidden;\n        display: flex;\n        align-items: center; \/* \uc138\ub85c \uc911\uc559 \uc815\ub82c *\/\n        justify-content: center; \/* \uac00\ub85c \uc911\uc559 \uc815\ub82c *\/\n        font-family: 'Pretendard', sans-serif;\n    }\n\n    \/* 1. \ube44\ub514\uc624 \ubc30\uacbd \uc601\uc5ed *\/\n    .hero-video-bg {\n        position: absolute;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        z-index: 1;\n    }\n\n    \/* \uc0ac\uc6a9\uc790\uac00 \uc81c\uacf5\ud55c \uc601\uc0c1 *\/\n    .hero-video-bg video {\n        width: 100%;\n        height: 100%;\n        object-fit: cover; \/* \ube44\uc728\uc5d0 \ub9de\ucdb0 \uac00\ub4dd \ucc44\uc6c0 *\/\n        opacity: 0.95; \/* \uc601\uc0c1\uc758 \uc6d0\ub798 \uc0c9\uac10\uc744 \uac70\uc758 \uadf8\ub300\ub85c \uc720\uc9c0 *\/\n    }\n    \n    \/* 2. \ucd08\uc18c\ud615 \ub2e4\ud06c \uc624\ubc84\ub808\uc774 (\ud14d\uc2a4\ud2b8 \uac00\ub3c5\uc131\uc744 \uc704\ud55c \ucd5c\uc18c\ud55c\uc758 \uc7a5\uce58) *\/\n    .hero-light-overlay {\n        position: absolute;\n        top: 0; left: 0; width: 100%; height: 100%;\n        \/* \uadf8\ub77c\ub514\uc5b8\ud2b8\ub97c \uc5c6\uc560\uace0, \uc544\uc8fc \uc605\uc740 \ud22c\uba85\ud55c \uac80\uc740\uc0c9 \uc624\ubc84\ub808\uc774\ub85c \ubcc0\uacbd *\/\n        background-color: rgba(0, 0, 0, 0.2); \/* 20% \ud22c\uba85\ub3c4 (\uc774\uc804 \ubc84\uc804\uc758 \uc808\ubc18) *\/\n        z-index: 2;\n    }\n\n    \/* 3. \uc911\uc559 \ucf58\ud150\uce20 \uc601\uc5ed *\/\n    .hero-content-video {\n        position: relative;\n        z-index: 3; \/* \uc601\uc0c1\uacfc \uc624\ubc84\ub808\uc774\ubcf4\ub2e4 \uc704\uc5d0 *\/\n        max-width: 800px;\n        width: 100%;\n        text-align: center;\n        padding: 0 24px;\n        color: #ffffff; \/* \ud770\uc0c9 \ud14d\uc2a4\ud2b8 \uc720\uc9c0 *\/\n    }\n\n    .hero-title-main-v {\n        font-size: 4.5rem; \/* \ub354 \ud06c\uace0 \uc784\ud329\ud2b8 \uc788\uac8c 72px *\/\n        font-weight: 800;\n        line-height: 1.2;\n        margin-bottom: 24px;\n        letter-spacing: -0.03em;\n        \/* \ubc30\uacbd\uc774 \ub354 \ubc1d\uc544\uc9c4 \ub9cc\ud07c \ud14d\uc2a4\ud2b8 \uadf8\ub9bc\uc790\ub97c \ubbf8\uc138\ud558\uac8c \uac15\ud654\ud558\uc5ec \uac00\ub3c5\uc131 \ud655\ubcf4 *\/\n        text-shadow: 0 3px 15px rgba(0,0,0,0.6); \n    }\n\n    \/* \uba54\ubaa8\ub41c \uba54\uc778 \ud3ec\uc778\ud2b8 \uceec\ub7ec(#accent-amber)\ub97c \ud0c0\uc774\ud2c0 \uc77c\ubd80\uc5d0 \ud3ec\uc778\ud2b8\ub85c \uc0ac\uc6a9 *\/\n    .hero-title-main-v span {\n        color: #B58431; \/* Deep Amber *\/\n    }\n\n    .hero-desc-sub-v {\n        font-size: 1.375rem; \/* 22px *\/\n        line-height: 1.6;\n        margin-bottom: 50px;\n        letter-spacing: -0.01em;\n        text-shadow: 0 3px 15px rgba(0,0,0,0.6);\n    }\n\n    .hero-action-btn-v {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        background-color: #ffffff; \/* \ubc84\ud2bc\uc740 \ud770\uc0c9\uc73c\ub85c \uae54\ub054\ud558\uac8c *\/\n        color: #216838; \/* \ud14d\uc2a4\ud2b8\ub294 \ub2e4\uc2dc \uba54\uc778 \ube0c\ub79c\ub4dc \uceec\ub7ec Forest Green *\/\n        padding: 20px 60px;\n        font-size: 1.25rem; \/* 20px *\/\n        font-weight: 700;\n        border-radius: 50px; \/* \ub354 \ub465\uae00\uac8c \ub9cc\ub4e4\uc5b4 \uac10\uc131\uc801\uc778 \ub290\ub08c \ucd94\uac00 *\/\n        text-decoration: none;\n        transition: all 0.3s ease;\n        box-shadow: 0 10px 30px rgba(0,0,0,0.3);\n    }\n\n    .hero-action-btn-v:hover {\n        background-color: #216838; \/* \ud638\ubc84 \uc2dc \ub2e4\uc2dc \uba54\uc778 \uceec\ub7ec\ub85c *\/\n        color: #ffffff;\n        transform: translateY(-3px); \/* \uc704\ub85c \uc0b4\uc9dd \ub5a0\uc624\ub974\ub294 \ud6a8\uacfc *\/\n        box-shadow: 0 15px 40px rgba(0,0,0,0.4);\n    }\n\n    \/* \ubaa8\ubc14\uc77c \ubc18\uc751\ud615 (\ud654\uba74\uc774 992px\ubcf4\ub2e4 \uc791\uc544\uc9c8 \ub54c) *\/\n    @media (max-width: 992px) {\n        .hero-title-main-v {\n            font-size: 3rem; \/* \ubaa8\ubc14\uc77c 48px *\/\n        }\n        .hero-desc-sub-v {\n            font-size: 1.125rem; \/* \ubaa8\ubc14\uc77c 18px *\/\n        }\n        .hero-action-btn-v {\n            padding: 18px 48px;\n            font-size: 1.125rem;\n        }\n    }\n<\/style>\n\n<section class=\"hero-video-clear\">\n    <div class=\"hero-video-bg\">\n        <video autoplay loop muted playsinline poster=\"poster_placeholder.jpg\">\n            <source src=\"https:\/\/img.bemypet.kr\/content\/sites\/71\/2026\/03\/20183729\/video_s-1.mp4\" type=\"video\/mp4\">\n            [ Placeholder ]<br>\n            \ubcf4\ud638\uc790\uc640 \ubc18\ub824\ub3d9\ubb3c\uc774 \uad50\uac10\ud558\uba70 \ub6f0\ub178\ub294 \uace0\ud654\uc9c8 \ub77c\uc774\ud504\uc2a4\ud0c0\uc77c \uc601\uc0c1 (Full Screen)\n        <\/video>\n    <\/div>\n    \n    <div class=\"hero-light-overlay\"><\/div>\n\n    <div class=\"hero-content-video\">\n        <h1 class=\"hero-title-main-v\"><span>\ud65c\uae30\ucc2c \ub0b4\uc77c<\/span>\uc744<br>\uc120\ubb3c\ud558\uc138\uc694<\/h1>\n        <p class=\"hero-desc-sub-v\">\n            \uad00\uc808, \uc2ac\uac1c\uace8, \ubf08 \uac74\uac15\ubd80\ud130 \uadfc\uc721\uae4c\uc9c0<br>\n            \ubcf8\ud22c\ud3ab\uc73c\ub85c \uc2dc\uc791\ud558\ub294 \uccb4\uacc4\uc801\uc778 \ucf00\uc5b4\n        <\/p>\n        <a href=\"#buy-section\" class=\"hero-action-btn-v\">\uc81c\ud488 \uc0c1\uc138\ubcf4\uae30<\/a>\n    <\/div>\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-04d61c3 e-flex e-con-boxed e-con e-parent\" data-id=\"04d61c3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8f78b17 elementor-widget elementor-widget-html\" data-id=\"8f78b17\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"ko\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>\ubb38\uc81c \uc81c\uae30(\uacf5\uac10) \uc139\uc158<\/title>\n    <link rel=\"stylesheet\" as=\"style\" crossorigin href=\"https:\/\/cdn.jsdelivr.net\/gh\/orioncactus\/pretendard@v1.3.9\/dist\/web\/static\/pretendard.min.css\" \/>\n    <style>\n        \/* --- \uacf5\ud1b5 \ubcc0\uc218 \ubc0f \ucd08\uae30\ud654 --- *\/\n        :root {\n            --text-dark: #111111;\n            --text-gray: #666666;\n        }\n\n        * { margin: 0; padding: 0; box-sizing: border-box; }\n        body {\n            font-family: 'Pretendard', sans-serif;\n            color: var(--text-dark);\n            line-height: 1.6;\n            letter-spacing: -0.02em;\n            background-color: #FFFFFF;\n            -webkit-font-smoothing: antialiased;\n        }\n        \n        .inner {\n            max-width: 1200px;\n            margin: 0 auto;\n            padding: 0 24px;\n        }\n        .section-padding {\n            padding: 120px 0;\n        }\n        \n        .placeholder {\n            background-color: #F8F9FA;\n            border: 1px dashed #CCCCCC;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            color: #999999;\n            font-size: 0.9rem;\n            text-align: center;\n            padding: 20px;\n            width: 100%;\n        }\n\n        \/* --- \ubb38\uc81c \uc81c\uae30 (\uacf5\uac10) \uc139\uc158 \uc804\uc6a9 \uc2a4\ud0c0\uc77c --- *\/\n        .problem-section { text-align: center; }\n        .sec-title {\n            font-size: 2.5rem;\n            font-weight: 700;\n            margin-bottom: 16px;\n        }\n        .sec-desc {\n            font-size: 1.125rem;\n            color: var(--text-gray);\n            margin-bottom: 60px;\n        }\n        .problem-grid {\n            display: grid;\n            grid-template-columns: repeat(3, 1fr);\n            gap: 24px;\n        }\n        .problem-card .placeholder {\n            aspect-ratio: 1 \/ 1;\n            margin-bottom: 20px;\n            border-radius: 8px;\n        }\n        .problem-card h3 {\n            font-size: 1.25rem;\n            font-weight: 600;\n        }\n\n        \/* --- \ubc18\uc751\ud615 \ucc98\ub9ac --- *\/\n        @media (max-width: 768px) {\n            .problem-grid { grid-template-columns: 1fr; }\n            .section-padding { padding: 80px 0; }\n        }\n    <\/style>\n<\/head>\n<body>\n\n    <section class=\"problem-section section-padding\">\n        <div class=\"inner\">\n            <h2 class=\"sec-title\">\uc0ac\uc18c\ud55c \ubcc0\ud654, \ub193\uce58\uace0 \uacc4\uc2e0\uac00\uc694?<\/h2>\n            <p class=\"sec-desc\">\ub9d0 \ubabb\ud558\ub294 \uc544\uc774\ub4e4\uc758 \uad00\uc808\uc740 \uc774\ubbf8 \ubb34\ub9ac\ud558\uace0 \uc788\uc744\uc9c0 \ubaa8\ub985\ub2c8\ub2e4.<\/p>\n            \n            <div class=\"problem-grid\">\n                <div class=\"problem-card\">\n                    <div class=\"placeholder\">[ Image ]<br>\uc0b0\ucc45 \uc911 \uc8fc\uc800\uc549\uc740 \ubaa8\uc2b5<\/div>\n                    <h3>\uc0b0\ucc45\uc744 \uae08\ubc29 \ud798\ub4e4\uc5b4\ud55c\ub2e4<\/h3>\n                <\/div>\n                <div class=\"problem-card\">\n                    <div class=\"placeholder\">[ Image ]<br>\uc18c\ud30c \ubc11\uc5d0\uc11c \uc62c\ub824\ub2e4\ubcf4\ub294 \ubaa8\uc2b5<\/div>\n                    <h3>\ub6f0\uc5b4\uc624\ub974\ub0b4\ub9ac\uae30\ub97c \uc8fc\uc800\ud55c\ub2e4<\/h3>\n                <\/div>\n                <div class=\"problem-card\">\n                    <div class=\"placeholder\">[ Image ]<br>\ub2e4\ub9ac\ub97c \ud565\ub294 \ubaa8\uc2b5<\/div>\n                    <h3>\ud2b9\uc815 \ub2e4\ub9ac\ub97c \uc790\uafb8 \ud565\uac70\ub098 \uc808\ub69d\uc778\ub2e4<\/h3>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3976147 e-flex e-con-boxed e-con e-parent\" data-id=\"3976147\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2a5697c elementor-widget elementor-widget-html\" data-id=\"2a5697c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"deliver-stage\" id=\"what-we-deliver\" aria-labelledby=\"deliver-stage-title\">\n  <div class=\"deliver-stage__bg\" aria-hidden=\"true\">\n    <div class=\"deliver-stage__grid\"><\/div>\n    <div class=\"deliver-stage__glow deliver-stage__glow--1\"><\/div>\n    <div class=\"deliver-stage__glow deliver-stage__glow--2\"><\/div>\n  <\/div>\n\n  <div class=\"deliver-stage__inner\">\n    <header class=\"deliver-stage__header\" id=\"deliverStageHeader\">\n      <p class=\"deliver-stage__kicker\">BONE TO PET SOLUTION<\/p>\n\n      <h2 class=\"deliver-stage__title\" id=\"deliver-stage-title\" aria-label=\"\uc6b0\ub9ac \uc544\uc774\ub97c \uc704\ud55c 5-WAY \ucf00\uc5b4\">\n        <span class=\"deliver-stage__title-line\">\n          <span class=\"deliver-stage__title-word\">\uad00\uc808\ubd80\ud130<\/span>\n          <span class=\"deliver-stage__title-word\">\uc5f0\uace8\uae4c\uc9c0<\/span>\n        <\/span>\n        <span class=\"deliver-stage__title-line\">\n          <span class=\"deliver-stage__title-word\" style=\"color: var(--accent);\">\uc644\ubcbd\ud55c<\/span>\n          <span class=\"deliver-stage__title-word\">5-WAY<\/span>\n          <span class=\"deliver-stage__title-word\">\ucf00\uc5b4<\/span>\n        <\/span>\n      <\/h2>\n\n      <div class=\"deliver-stage__title-bar\" aria-hidden=\"true\">\n        <span class=\"deliver-stage__title-bar-fill\"><\/span>\n      <\/div>\n\n      <p class=\"deliver-stage__desc\">\n        \ubcf5\uc7a1\ud55c \uc601\uc591\uc81c \uc120\ud0dd\uc740 \uc774\uc81c \uadf8\ub9cc!<br\/>\n        \ubcf8\ud22c\ud3ab \ud558\ub098\ub85c \uc6b0\ub9ac \uc544\uc774\uc758 \ubf08 \uac74\uac15\ubd80\ud130 \uadfc\uc721, \uc18c\ud654\uae4c\uc9c0 \ud55c \ubc88\uc5d0 \uad00\ub9ac\ud558\uc138\uc694.\n      <\/p>\n    <\/header>\n\n    <div class=\"deliver-stage__layout\">\n      <div class=\"deliver-stage__visual\">\n        <div class=\"deliver-visual-card\">\n          <div class=\"deliver-visual-card__top\">\n            <div class=\"deliver-visual-card__eyebrow\">\n              <span class=\"deliver-visual-card__dot\"><\/span>\n              <span id=\"deliverVisualMetaKr\">\ud2bc\ud2bc\ud55c \uad00\uc808 \uac74\uac15<\/span>\n            <\/div>\n          <\/div>\n\n          <div class=\"deliver-visual\">\n            <div class=\"deliver-visual__image-wrap\">\n              <img decoding=\"async\"\n                id=\"deliverMainImage\"\n                src=\"https:\/\/placehold.co\/800x800\/CBDCC9\/216838?text=Joint+Health+Image\"\n                alt=\"\ud2bc\ud2bc\ud55c \uad00\uc808 \uac74\uac15 \uad00\ub828 \uc774\ubbf8\uc9c0\"\n                class=\"deliver-visual__image\"\n              \/>\n            <\/div>\n\n            <div class=\"deliver-visual__caption\">\n              <strong id=\"deliverVisualTitle\">\ud2bc\ud2bc\ud55c \uad00\uc808 \uac74\uac15<\/strong>\n              <p id=\"deliverVisualDesc\">\n                \uc5f0\uace8 \ubc0f \uad00\uc808\uc758 \ubee3\ubee3\ud568\uc744 \uac10\uc18c\uc2dc\ud0a4\uace0 \ubd80\ub4dc\ub7ec\uc6b4 \uc6c0\uc9c1\uc784\uc744 \ub3d5\uc2b5\ub2c8\ub2e4.\n              <\/p>\n            <\/div>\n\n            <div class=\"deliver-visual__controls\" aria-label=\"\uc774\ubbf8\uc9c0 \uc2ac\ub77c\uc774\ub4dc \ud0d0\uc0c9\">\n              <button type=\"button\" class=\"deliver-nav-btn\" id=\"deliverPrevBtn\" aria-label=\"\uc774\uc804 \uc2ac\ub77c\uc774\ub4dc\">\n                <span aria-hidden=\"true\">\u2190<\/span>\n              <\/button>\n\n              <div class=\"deliver-indicators\" id=\"deliverIndicators\" role=\"tablist\" aria-label=\"\uc2ac\ub77c\uc774\ub4dc \uc778\ub514\ucf00\uc774\ud130\"><\/div>\n\n              <button type=\"button\" class=\"deliver-nav-btn\" id=\"deliverNextBtn\" aria-label=\"\ub2e4\uc74c \uc2ac\ub77c\uc774\ub4dc\">\n                <span aria-hidden=\"true\">\u2192<\/span>\n              <\/button>\n            <\/div>\n\n            <div class=\"deliver-mobile-progress\" aria-live=\"polite\">\n              <span id=\"deliverMobileCounter\">01 \/ 05<\/span>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"deliver-stage__steps\" aria-label=\"What we deliver points\" id=\"deliverSteps\">\n        \n        <article\n          class=\"deliver-step-card is-active\" tabindex=\"0\" data-index=\"0\"\n          data-image=\"https:\/\/placehold.co\/800x800\/CBDCC9\/216838?text=Joint+Health+Image\"\n          data-title=\"\ud2bc\ud2bc\ud55c \uad00\uc808 \uac74\uac15\"\n          data-desc=\"\uc5f0\uace8 \ubc0f \uad00\uc808\uc758 \ubee3\ubee3\ud568\uc744 \uac10\uc18c\uc2dc\ud0a4\uace0 \ubd80\ub4dc\ub7ec\uc6b4 \uc6c0\uc9c1\uc784\uc744 \ub3d5\uc2b5\ub2c8\ub2e4.\"\n        >\n          <span class=\"deliver-step-card__index\">01<\/span>\n          <div class=\"deliver-step-card__body\">\n            <strong>\ud2bc\ud2bc\ud55c \uad00\uc808 \uac74\uac15<\/strong>\n            <p>\uad00\uc808\uc758 \ubee3\ubee3\ud568 \uac10\uc18c \ubc0f \ubd80\ub4dc\ub7ec\uc6b4 \uc6c0\uc9c1\uc784 \ub3c4\uc6c0<\/p>\n          <\/div>\n        <\/article>\n\n        <article\n          class=\"deliver-step-card\" tabindex=\"0\" data-index=\"1\"\n          data-image=\"https:\/\/placehold.co\/800x800\/EDEEF0\/216838?text=Cartilage+Recovery\"\n          data-title=\"\uc190\uc0c1\ub41c \uc5f0\uace8 \ud68c\ubcf5\"\n          data-desc=\"\uc190\uc0c1\ub41c \uc5f0\uace8 \uc138\ud3ec\uc758 \uc7ac\uc0dd\uc744 \ucd09\uc9c4\ud558\uc5ec \uadfc\ubcf8\uc801\uc778 \ubf08 \uac74\uac15\uc744 \ucc59\uae41\ub2c8\ub2e4.\"\n        >\n          <span class=\"deliver-step-card__index\">02<\/span>\n          <div class=\"deliver-step-card__body\">\n            <strong>\uc190\uc0c1\ub41c \uc5f0\uace8 \ud68c\ubcf5<\/strong>\n            <p>\uc190\uc0c1\ub41c \uc5f0\uace8 \uc138\ud3ec \uc7ac\uc0dd \ucd09\uc9c4<\/p>\n          <\/div>\n        <\/article>\n\n        <article\n          class=\"deliver-step-card\" tabindex=\"0\" data-index=\"2\"\n          data-image=\"https:\/\/placehold.co\/800x800\/F5F1E8\/B58431?text=Inflammation+Relief\"\n          data-title=\"\uad6d\uc18c \uc5fc\uc99d \uc644\ud654\"\n          data-desc=\"\uad00\uc808 \uc8fc\ubcc0\uc758 \uc5fc\uc99d \ubc18\uc751\uc744 \uc5b5\uc81c\ud558\uc5ec \uc544\uc774\ub4e4\uc758 \ud1b5\uc99d\uc744 \uc904\uc5ec\uc90d\ub2c8\ub2e4.\"\n        >\n          <span class=\"deliver-step-card__index\">03<\/span>\n          <div class=\"deliver-step-card__body\">\n            <strong>\uad6d\uc18c \uc5fc\uc99d \uc644\ud654<\/strong>\n            <p>\uad00\uc808 \uc8fc\ubcc0 \uc5fc\uc99d \ubc18\uc751 \uc5b5\uc81c \ubc0f \ud1b5\uc99d \uc644\ud654<\/p>\n          <\/div>\n        <\/article>\n\n        <article\n          class=\"deliver-step-card\" tabindex=\"0\" data-index=\"3\"\n          data-image=\"https:\/\/placehold.co\/800x800\/CBDCC9\/216838?text=Digestion+Support\"\n          data-title=\"\uc18d \ud3b8\ud55c \uc18c\ud654 \ud761\uc218\"\n          data-desc=\"\uc601\uc591 \ud761\uc218\uc728\uc744 \uadf9\ub300\ud654\ud558\uace0 \uc704\uc7a5 \uc7a5\uc560\ub97c \ucd5c\uc18c\ud654\ud558\ub3c4\ub85d \uc124\uacc4\ub418\uc5c8\uc2b5\ub2c8\ub2e4.\"\n        >\n          <span class=\"deliver-step-card__index\">04<\/span>\n          <div class=\"deliver-step-card__body\">\n            <strong>\uc18d \ud3b8\ud55c \uc18c\ud654 \ud761\uc218<\/strong>\n            <p>\ub192\uc740 \uc601\uc591 \ud761\uc218\uc728 \ubc0f \uc704\uc7a5 \uc7a5\uc560 \ucd5c\uc18c\ud654<\/p>\n          <\/div>\n        <\/article>\n\n        <article\n          class=\"deliver-step-card\" tabindex=\"0\" data-index=\"4\"\n          data-image=\"https:\/\/placehold.co\/800x800\/EDEEF0\/B58431?text=High+Palatability\"\n          data-title=\"\uac04\uc2dd \uac19\uc740 \uae30\ud638\uc131\"\n          data-desc=\"\uc785\ub9db \uae4c\ub2e4\ub85c\uc6b4 \uc544\uc774\ub4e4\ub3c4 \uac70\ubd80\uac10 \uc5c6\uc774 \uba3c\uc800 \ucc3e\ub294 \ub9db\uc788\ub294 \uc601\uc591\uc81c\uc785\ub2c8\ub2e4.\"\n        >\n          <span class=\"deliver-step-card__index\">05<\/span>\n          <div class=\"deliver-step-card__body\">\n            <strong>\uac04\uc2dd \uac19\uc740 \uae30\ud638\uc131<\/strong>\n            <p>\uc785\ub9db \uae4c\ub2e4\ub85c\uc6b4 \uc544\uc774\ub4e4\ub3c4 \uac70\ubd80\uac10 \uc5c6\ub294 \ub9db<\/p>\n          <\/div>\n        <\/article>\n\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<style>\n  :root{\n    \/* \ubcf8\ud22c\ud3ab \ube0c\ub79c\ub4dc \uceec\ub7ec \ub9e4\ud551 *\/\n    --bg: #F8F9FA; \n    --surface: rgba(255,255,255,.85);\n    --surface-strong: rgba(255,255,255,1);\n    --surface-soft: rgba(255,255,255,.7);\n    --line: rgba(33,104,56,.12);\n    --line-strong: rgba(33,104,56,.4);\n    --text: #111111;\n    --muted: rgba(17,17,17,.72);\n    --soft: rgba(17,17,17,.48);\n    --brand: #216838; \/* Forest Green *\/\n    --brand-deep: #154524;\n    --accent: #B58431; \/* Deep Amber *\/\n    --shadow: 0 16px 40px rgba(33,104,56,.06);\n    --shadow-strong: 0 24px 60px rgba(33,104,56,.12);\n  }\n\n  \/* \ud3ab \uc601\uc591\uc81c \uc0ac\uc774\ud2b8\uc5d0 \ub2e4\ud06c\ubaa8\ub4dc\ub294 \ubd80\uc801\ud569\ud560 \uc218 \uc788\uc5b4, \ubc30\uacbd \ud1a4\uc744 \ubc1d\uac8c \uc720\uc9c0\ud558\ub3c4\ub85d \ub2e4\ud06c\ubaa8\ub4dc \ubbf8\ub514\uc5b4\ucffc\ub9ac\ub294 \ub2e8\uc21c\ud654\ud588\uc2b5\ub2c8\ub2e4 *\/\n  @media (prefers-color-scheme: dark){\n    :root{\n      --bg:#1A1A1A;\n      --surface:rgba(30,30,30,.8);\n      --surface-strong:rgba(40,40,40,.95);\n      --surface-soft:rgba(30,30,30,.6);\n      --line:rgba(255,255,255,.1);\n      --line-strong:rgba(203,220,201,.4); \/* Linen Sage \ud1a4 *\/\n      --text:#F5F1E8;\n      --muted:rgba(245,241,232,.74);\n      --soft:rgba(245,241,232,.5);\n    }\n  }\n\n  .deliver-stage{\n    position:relative;\n    overflow:hidden;\n    \/* \ubcf8\ud22c\ud3ab \ub179\uc0c9\uc5d0 \ub9de\ub294 \uc740\uc740\ud55c \ubc30\uacbd \uad11\uc6d0 *\/\n    background:\n      radial-gradient(circle at 18% 20%, rgba(33,104,56,.06), transparent 26%),\n      radial-gradient(circle at 82% 16%, rgba(181,132,49,.06), transparent 24%),\n      linear-gradient(180deg, var(--bg), var(--bg));\n    padding:140px 20px;\n    color:var(--text);\n    isolation:isolate;\n    font-family: 'Pretendard', sans-serif;\n  }\n\n  .deliver-stage__bg{ position:absolute; inset:0; z-index:0; pointer-events:none; }\n\n  .deliver-stage__grid{\n    position:absolute; inset:0;\n    background-image:\n      linear-gradient(to right, rgba(33,104,56,.03) 1px, transparent 1px),\n      linear-gradient(to bottom, rgba(33,104,56,.03) 1px, transparent 1px);\n    background-size:44px 44px;\n    opacity:.8;\n    mask-image:radial-gradient(circle at center, #000 32%, transparent 92%);\n  }\n\n  .deliver-stage__glow{ position:absolute; border-radius:50%; filter:blur(60px); opacity:.55; }\n  .deliver-stage__glow--1{ width:340px; height:340px; background:rgba(33,104,56,.08); left:8%; top:12%; }\n  .deliver-stage__glow--2{ width:400px; height:400px; background:rgba(181,132,49,.08); right:6%; bottom:10%; }\n\n  .deliver-stage__inner{ position:relative; z-index:1; max-width:1200px; margin:0 auto; }\n\n  .deliver-stage__header{\n    --mx:0px; --my:0px;\n    max-width:820px; margin:0 auto 56px; text-align:center;\n    opacity:0; transform:translate3d(0,24px,0); filter:blur(10px);\n    transition: opacity .8s ease, transform .8s ease, filter .8s ease;\n    position:relative; will-change:transform;\n  }\n\n  .deliver-stage__header::before{\n    content:\"\"; position:absolute; left:50%; top:8%; width:320px; height:320px;\n    border-radius:50%; transform:translate(-50%, -50%);\n    background:radial-gradient(circle, rgba(33,104,56,.08), rgba(33,104,56,0) 68%);\n    filter:blur(24px); opacity:0; transition:opacity .8s ease, transform .35s ease;\n    pointer-events:none; z-index:0;\n  }\n\n  .deliver-stage.is-visible .deliver-stage__header{ opacity:1; transform:translate3d(var(--mx), var(--my), 0); filter:blur(0); }\n  .deliver-stage.is-visible .deliver-stage__header::before{ opacity:1; }\n  .deliver-stage__header > *{ position:relative; z-index:1; }\n\n  .deliver-stage__kicker{\n    margin:0 0 16px; font-size:14px; letter-spacing:.15em; font-weight:800;\n    color:var(--brand); transform:translateY(14px); opacity:0;\n    transition:transform .75s cubic-bezier(.2,.7,.2,1), opacity .75s ease;\n  }\n\n  .deliver-stage.is-visible .deliver-stage__kicker{ transform:translateY(0); opacity:1; transition-delay:.05s; }\n\n  .deliver-stage__title{\n    margin:0; font-size:clamp(34px,4vw,52px); line-height:1.2; letter-spacing:-0.03em;\n    font-weight:800; display:inline-flex; flex-direction:column; gap:.08em;\n  }\n\n  .deliver-stage__title-line{ display:block; overflow:hidden; }\n  .deliver-stage__title-word{\n    display:inline-block; margin-right:.18em; transform:translateY(115%) rotate(3deg);\n    opacity:0; filter:blur(8px);\n    transition: transform .9s cubic-bezier(.2,.7,.15,1), opacity .8s ease, filter .8s ease, color .25s ease;\n    will-change:transform, opacity, filter;\n  }\n\n  .deliver-stage.is-visible .deliver-stage__title-word{ transform:translateY(0) rotate(0); opacity:1; filter:blur(0); }\n  .deliver-stage.is-visible .deliver-stage__title-line:nth-child(1) .deliver-stage__title-word:nth-child(1){ transition-delay:.12s; }\n  .deliver-stage.is-visible .deliver-stage__title-line:nth-child(1) .deliver-stage__title-word:nth-child(2){ transition-delay:.18s; }\n  .deliver-stage.is-visible .deliver-stage__title-line:nth-child(2) .deliver-stage__title-word:nth-child(1){ transition-delay:.30s; }\n  .deliver-stage.is-visible .deliver-stage__title-line:nth-child(2) .deliver-stage__title-word:nth-child(2){ transition-delay:.36s; }\n  .deliver-stage.is-visible .deliver-stage__title-line:nth-child(2) .deliver-stage__title-word:nth-child(3){ transition-delay:.42s; }\n\n  .deliver-stage__title-bar{\n    width:min(280px, 42%); height:4px; margin:24px auto 0; border-radius:999px;\n    background:rgba(33,104,56,.12); overflow:hidden; opacity:0; transform:translateY(10px);\n    transition:opacity .7s ease, transform .7s ease;\n  }\n\n  .deliver-stage.is-visible .deliver-stage__title-bar{ opacity:1; transform:translateY(0); transition-delay:.38s; }\n  .deliver-stage__title-bar-fill{\n    display:block; width:0%; height:100%; border-radius:inherit;\n    background:linear-gradient(90deg, var(--brand), var(--accent));\n    box-shadow:0 0 12px rgba(181,132,49,.3);\n    transition:width 1s cubic-bezier(.2,.7,.2,1);\n  }\n  .deliver-stage.is-visible .deliver-stage__title-bar-fill{ width:100%; transition-delay:.48s; }\n\n  .deliver-stage__desc{\n    margin:24px auto 0; max-width:700px; font-size:18px; line-height:1.6;\n    color:var(--muted); opacity:0; transform:translateY(18px);\n    transition:opacity .8s ease, transform .8s ease;\n  }\n  .deliver-stage.is-visible .deliver-stage__desc{ opacity:1; transform:translateY(0); transition-delay:.34s; }\n\n  .deliver-stage__layout{ display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(320px, 0.9fr); gap:40px; align-items:stretch; }\n  .deliver-stage__visual, .deliver-stage__steps{ min-width:0; }\n\n  .deliver-visual-card{\n    height:100%; border-radius:32px; border:1px solid var(--line);\n    background: var(--surface); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);\n    box-shadow:var(--shadow); padding:24px; display:flex; flex-direction:column; position:relative; overflow:hidden;\n  }\n\n  .deliver-visual-card__top{ position:relative; z-index:2; display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:20px; }\n  .deliver-visual-card__eyebrow{ display:inline-flex; align-items:center; gap:10px; font-size:14px; font-weight:800; letter-spacing:.05em; color:var(--soft); }\n\n  .deliver-visual-card__dot{\n    width:10px; height:10px; border-radius:50%; background:var(--accent);\n    animation:deliverPulse 2.2s ease-out infinite; flex:0 0 auto;\n  }\n\n  .deliver-visual{\n    position:relative; z-index:2; width:100%; height:100%; min-height:500px; border-radius:24px; overflow:hidden;\n    background:var(--bg); border:1px solid var(--line);\n  }\n\n  .deliver-visual__image-wrap{ position:relative; width:100%; height:100%; overflow:hidden; isolation:isolate; }\n  .deliver-visual__image-wrap::after{\n    content:\"\"; position:absolute; inset:0;\n    background: linear-gradient(0deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,0) 40%); z-index:1; pointer-events:none;\n  }\n\n  .deliver-visual__image{\n    position:absolute !important; inset:0 !important; width:100% !important; height:100% !important;\n    max-width:none !important; max-height:none !important; display:block !important;\n    object-fit:cover !important; object-position:center center !important;\n    transform:scale(1.02); transition: opacity .45s ease, transform .7s ease; opacity:1;\n  }\n  .deliver-visual__image.is-switching{ opacity:.24; transform:scale(1.06); filter:blur(4px); }\n\n  .deliver-visual__caption{\n    position:absolute; left:24px; right:24px; bottom:84px; z-index:3; display:flex; flex-direction:column; gap:8px; pointer-events:none;\n  }\n  .deliver-visual__caption strong{ font-size:clamp(24px,2vw,32px); line-height:1.2; font-weight:800; color:#fff; text-shadow:0 4px 12px rgba(0,0,0,.4); }\n  .deliver-visual__caption p{ margin:0; max-width:90%; font-size:16px; line-height:1.5; color:rgba(255,255,255,.9); text-shadow:0 4px 12px rgba(0,0,0,.4); }\n\n  .deliver-visual__controls{\n    position:absolute; left:20px; right:20px; bottom:20px; z-index:4; display:grid; grid-template-columns:auto 1fr auto; gap:16px; align-items:center;\n  }\n  .deliver-nav-btn{\n    width:48px; height:48px; border:none; border-radius:50%; display:grid; place-items:center; cursor:pointer; color:#fff;\n    background:rgba(255,255,255,.2); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);\n    transition:transform .25s ease, background .25s ease;\n  }\n  .deliver-nav-btn:hover{ background:rgba(255,255,255,.35); transform:translateY(-2px); }\n\n  .deliver-indicators{ display:flex; align-items:center; justify-content:center; gap:8px; }\n  .deliver-indicator{\n    position:relative; border:none; width:100%; max-width:60px; min-width:20px; height:8px; border-radius:999px;\n    background:rgba(255,255,255,.3); overflow:hidden; cursor:pointer; transition:transform .25s ease;\n  }\n  .deliver-indicator::before{\n    content:\"\"; position:absolute; inset:0; width:0%; border-radius:inherit;\n    background:var(--accent); transition:width .35s ease;\n  }\n  .deliver-indicator.is-active{ background:rgba(255,255,255,.5); }\n  .deliver-indicator.is-active::before{ width:100%; }\n\n  .deliver-mobile-progress{\n    position:absolute; top:20px; right:20px; z-index:4; display:none; padding:8px 14px; border-radius:999px;\n    background:rgba(0,0,0,.5); color:#fff; font-size:13px; font-weight:700; letter-spacing:.05em; backdrop-filter:blur(10px);\n  }\n\n  .deliver-stage__steps{ display:flex; flex-direction:column; gap:16px; justify-content:center; }\n\n  .deliver-step-card{\n    display:grid; grid-template-columns:60px 1fr; gap:20px; align-items:center;\n    padding:20px 24px 20px 20px; border-radius:24px; border:1px solid var(--line);\n    background:var(--surface-soft); box-shadow:var(--shadow); opacity:0; transform:translateX(24px);\n    cursor:pointer; scroll-snap-align:start; transition: all .3s ease;\n  }\n\n  .deliver-stage.is-visible .deliver-step-card{ opacity:1; transform:translateX(0); }\n  .deliver-stage.is-visible .deliver-step-card:nth-child(1){ transition-delay:.08s; }\n  .deliver-stage.is-visible .deliver-step-card:nth-child(2){ transition-delay:.14s; }\n  .deliver-stage.is-visible .deliver-step-card:nth-child(3){ transition-delay:.20s; }\n  .deliver-stage.is-visible .deliver-step-card:nth-child(4){ transition-delay:.26s; }\n  .deliver-stage.is-visible .deliver-step-card:nth-child(5){ transition-delay:.32s; }\n\n  .deliver-step-card:hover, .deliver-step-card.is-active{\n    border-color:var(--brand); box-shadow:var(--shadow-strong); background:var(--surface-strong); transform:translateY(-3px);\n  }\n\n  .deliver-step-card__index{\n    width:60px; height:60px; border-radius:18px; display:grid; place-items:center;\n    background:rgba(33,104,56,.05); border:1px solid rgba(33,104,56,.1);\n    font-size:16px; font-weight:800; color:var(--brand); transition:all .3s ease;\n  }\n  .deliver-step-card.is-active .deliver-step-card__index{\n    background:var(--brand); color:#fff; border-color:var(--brand);\n  }\n\n  .deliver-step-card__body strong{ display:block; margin-bottom:6px; font-size:18px; font-weight:800; color:var(--text); }\n  .deliver-step-card__body p{ margin:0; font-size:14px; line-height:1.6; color:var(--muted); }\n\n  @keyframes deliverPulse{\n    0%{ box-shadow:0 0 0 0 rgba(181,132,49,.4); }\n    70%{ box-shadow:0 0 0 10px rgba(181,132,49,0); }\n    100%{ box-shadow:0 0 0 0 rgba(181,132,49,0); }\n  }\n\n  @media (max-width: 1100px){\n    .deliver-stage{ padding:110px 20px; }\n    .deliver-stage__layout{ grid-template-columns:1fr; }\n    .deliver-visual{ min-height: 400px; }\n    .deliver-stage__steps{ display:grid; grid-template-columns:repeat(2, 1fr); gap:16px; }\n  }\n\n  @media (max-width: 760px){\n    .deliver-stage{ padding:80px 16px; }\n    .deliver-stage__title{ font-size:clamp(28px,8vw,36px); }\n    .deliver-stage__desc{ font-size:15px; }\n    .deliver-visual{ min-height:350px; }\n    .deliver-visual__caption{ bottom: 70px; }\n    .deliver-visual__caption strong{ font-size: 22px; }\n    .deliver-visual__caption p{ font-size: 14px; }\n    .deliver-mobile-progress{ display:inline-flex; }\n    .deliver-stage__steps{\n      display:grid; grid-auto-flow:column; grid-auto-columns:85%; gap:12px;\n      overflow-x:auto; padding-bottom:10px; scroll-snap-type:x mandatory; scrollbar-width:none;\n    }\n    .deliver-step-card{ grid-template-columns:50px 1fr; padding:16px; min-height: 100%; }\n    .deliver-step-card__index{ width:50px; height:50px; }\n  }\n<\/style>\n\n<script>\n  (() => {\n    const section = document.querySelector('.deliver-stage');\n    if (!section) return;\n\n    const header = section.querySelector('#deliverStageHeader');\n    const observer = new IntersectionObserver((entries) => {\n      entries.forEach((entry) => {\n        if (entry.isIntersecting) {\n          section.classList.add('is-visible');\n        }\n      });\n    }, { threshold: 0.2 });\n\n    observer.observe(section);\n\n    const cards = Array.from(section.querySelectorAll('.deliver-step-card'));\n    const stepsWrap = section.querySelector('#deliverSteps');\n    const mainImage = section.querySelector('#deliverMainImage');\n    const visualTitle = section.querySelector('#deliverVisualTitle');\n    const visualDesc = section.querySelector('#deliverVisualDesc');\n    const metaKr = section.querySelector('#deliverVisualMetaKr');\n    const indicatorsWrap = section.querySelector('#deliverIndicators');\n    const prevBtn = section.querySelector('#deliverPrevBtn');\n    const nextBtn = section.querySelector('#deliverNextBtn');\n    const mobileCounter = section.querySelector('#deliverMobileCounter');\n\n    if (!cards.length || !mainImage || !indicatorsWrap) return;\n\n    let activeIndex = 0;\n    let activeSrc = mainImage.getAttribute('src') || '';\n    let switchTimer = null;\n    const isReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    const isMobile = () => window.innerWidth <= 760;\n\n    const pad = (num) => String(num + 1).padStart(2, '0');\n\n    const indicators = cards.map((card, index) => {\n      const btn = document.createElement('button');\n      btn.type = 'button';\n      btn.className = 'deliver-indicator';\n      btn.setAttribute('role', 'tab');\n      btn.setAttribute('aria-label', `${index + 1}\ubc88 \uc2ac\ub77c\uc774\ub4dc \ubcf4\uae30`);\n      btn.setAttribute('aria-selected', index === 0 ? 'true' : 'false');\n      btn.dataset.index = index;\n      indicatorsWrap.appendChild(btn);\n\n      btn.addEventListener('click', () => activateByIndex(index, true));\n      return btn;\n    });\n\n    const updateUI = (card, index) => {\n      const nextTitle = card.dataset.title || '';\n      const nextDesc = card.dataset.desc || '';\n      const nextSrc = card.dataset.image || '';\n\n      cards.forEach((item) => item.classList.remove('is-active'));\n      indicators.forEach((item) => {\n        item.classList.remove('is-active');\n        item.setAttribute('aria-selected', 'false');\n      });\n\n      card.classList.add('is-active');\n      if (indicators[index]) {\n        indicators[index].classList.add('is-active');\n        indicators[index].setAttribute('aria-selected', 'true');\n      }\n\n      if (visualTitle) visualTitle.textContent = nextTitle;\n      if (visualDesc) visualDesc.textContent = nextDesc;\n      if (metaKr) metaKr.textContent = nextTitle;\n      if (mobileCounter) {\n        mobileCounter.textContent = `${pad(index)} \/ ${pad(cards.length - 1)}`;\n      }\n\n      if (!nextSrc || nextSrc === activeSrc) return;\n\n      if (!isReducedMotion) {\n        mainImage.classList.add('is-switching');\n      }\n\n      clearTimeout(switchTimer);\n      switchTimer = setTimeout(() => {\n        mainImage.src = nextSrc;\n        mainImage.alt = nextTitle ? `${nextTitle} \uad00\ub828 \uc774\ubbf8\uc9c0` : '\ubcf8\ud22c\ud3ab \uc774\ubbf8\uc9c0';\n        activeSrc = nextSrc;\n\n        requestAnimationFrame(() => {\n          mainImage.classList.remove('is-switching');\n        });\n      }, isReducedMotion ? 0 : 180);\n    };\n\n    const activateByIndex = (index, scrollCard = false) => {\n      if (index < 0) index = cards.length - 1;\n      if (index >= cards.length) index = 0;\n\n      activeIndex = index;\n      const card = cards[index];\n      updateUI(card, index);\n\n      if (scrollCard && isMobile() && stepsWrap) {\n        card.scrollIntoView({\n          behavior: isReducedMotion ? 'auto' : 'smooth',\n          inline: 'start',\n          block: 'nearest'\n        });\n      }\n    };\n\n    cards.forEach((card, index) => {\n      card.addEventListener('mouseenter', () => {\n        if (!isMobile()) activateByIndex(index, false);\n      });\n      card.addEventListener('focus', () => activateByIndex(index, false));\n      card.addEventListener('click', () => activateByIndex(index, true));\n    });\n\n    if (prevBtn) {\n      prevBtn.addEventListener('click', () => activateByIndex(activeIndex - 1, true));\n    }\n\n    if (nextBtn) {\n      nextBtn.addEventListener('click', () => activateByIndex(activeIndex + 1, true));\n    }\n\n    let scrollTicking = false;\n    if (stepsWrap) {\n      stepsWrap.addEventListener('scroll', () => {\n        if (!isMobile() || scrollTicking) return;\n\n        scrollTicking = true;\n        requestAnimationFrame(() => {\n          const wrapRect = stepsWrap.getBoundingClientRect();\n          let closestIndex = activeIndex;\n          let closestDistance = Infinity;\n\n          cards.forEach((card, index) => {\n            const rect = card.getBoundingClientRect();\n            const distance = Math.abs(rect.left - wrapRect.left);\n            if (distance < closestDistance) {\n              closestDistance = distance;\n              closestIndex = index;\n            }\n          });\n\n          if (closestIndex !== activeIndex) {\n            activateByIndex(closestIndex, false);\n          }\n\n          scrollTicking = false;\n        });\n      });\n    }\n\n    if (header && !isReducedMotion) {\n      const resetHeader = () => {\n        header.style.setProperty('--mx', '0px');\n        header.style.setProperty('--my', '0px');\n      };\n\n      section.addEventListener('mousemove', (e) => {\n        if (window.innerWidth <= 760 || !section.classList.contains('is-visible')) return;\n\n        const rect = section.getBoundingClientRect();\n        const x = ((e.clientX - rect.left) \/ rect.width) - 0.5;\n        const y = ((e.clientY - rect.top) \/ rect.height) - 0.5;\n\n        const moveX = x * 10;\n        const moveY = y * 8;\n\n        header.style.setProperty('--mx', `${moveX}px`);\n        header.style.setProperty('--my', `${moveY}px`);\n      });\n\n      section.addEventListener('mouseleave', resetHeader);\n      window.addEventListener('resize', resetHeader);\n    }\n\n    activateByIndex(0, false);\n  })();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7d7c04b e-con-full e-flex e-con e-parent\" data-id=\"7d7c04b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1960817 elementor-widget elementor-widget-html\" data-id=\"1960817\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"h-scroll\" id=\"core-horizontal\">\n  <div class=\"h-scroll__spacer\">\n    <div class=\"h-scroll__sticky\">\n      <div class=\"h-scroll__track\">\n\n        <section class=\"panel panel--ingredients\">\n          <div class=\"ingredients-inner\">\n            <div class=\"section-header\">\n              <p class=\"kicker\">PREMIUM INGREDIENTS<\/p>\n              <h2 class=\"title\">\uc218\uc900 \ub192\uc740 \uc6d0\ub8cc\uc758 \ud669\uae08 \ubc30\ud569<\/h2>\n              <p class=\"desc\">\uc790\uc5f0\uc5d0\uc11c \ucc3e\uc740 \uad00\uc808 \uac74\uac15\uc758 \ud575\uc2ec \uc131\ubd84\ub4e4\uc744 \ucd5c\uc801\uc758 \ube44\uc728\ub85c \ub2f4\uc558\uc2b5\ub2c8\ub2e4.<\/p>\n            <\/div>\n\n            <div class=\"floating-showcase\">\n              <div class=\"center-product\">\n                <div class=\"center-product__glow\"><\/div>\n                <img decoding=\"async\" src=\"https:\/\/placehold.co\/400x400\/CBDCC9\/216838?text=Bone+to+Pet+Bottle\" alt=\"\ubcf8\ud22c\ud3ab \uc601\uc591\uc81c\" class=\"product-img\">\n              <\/div>\n\n              <article class=\"float-card card-1\">\n                <div class=\"icon-wrap\">\ud83c\udf3f<\/div>\n                <div class=\"text-wrap\">\n                  <h3>\ucd08\ub85d\uc785\ud64d\ud569<\/h3>\n                  <p>\ud48d\ubd80\ud55c \uc624\uba54\uac003\ub85c \ud1b5\uc99d \uc644\ud654<\/p>\n                <\/div>\n              <\/article>\n\n              <article class=\"float-card card-2\">\n                <div class=\"icon-wrap\">\ud83e\udeb5<\/div>\n                <div class=\"text-wrap\">\n                  <h3>\ubcf4\uc2a4\uc6f0\ub9ac\uc544<\/h3>\n                  <p>\uc5f0\uace8 \ubcf4\ud638 \ubc0f \ubd80\ub4dc\ub7ec\uc6b4 \uc6c0\uc9c1\uc784<\/p>\n                <\/div>\n              <\/article>\n\n              <article class=\"float-card card-3\">\n                <div class=\"icon-wrap\">\ud83e\uddb4<\/div>\n                <div class=\"text-wrap\">\n                  <h3>\uae00\ub8e8\ucf54\uc0ac\ubbfc<\/h3>\n                  <p>\uc190\uc0c1\ub41c \uc5f0\uace8 \uc7ac\uc0dd \ubc0f \ubf08 \uac15\ud654<\/p>\n                <\/div>\n              <\/article>\n              \n              <article class=\"float-card card-4\">\n                <div class=\"icon-wrap\">\u2728<\/div>\n                <div class=\"text-wrap\">\n                  <h3>MSM (\uc2dd\uc774\uc720\ud669)<\/h3>\n                  <p>\uad00\uc808 \uc5f0\uace8 \ubc0f \uc778\ub300 \uc870\uc9c1 \uc720\uc9c0<\/p>\n                <\/div>\n              <\/article>\n            <\/div>\n          <\/div>\n        <\/section>\n\n        <section class=\"panel panel--philosophy\">\n          <div class=\"philosophy-inner\">\n            <div class=\"section-header\">\n              <p class=\"kicker\">BRAND PHILOSOPHY<\/p>\n              <h2 class=\"title\">\ubcf8\ud22c\ud3ab\uc774 \uc9c0\ud0a4\ub294 3\uac00\uc9c0 \uc57d\uc18d<\/h2>\n            <\/div>\n\n            <div class=\"arch-grid\">\n              <article class=\"arch-card\">\n                <div class=\"arch-card__image-wrap\">\n                  <img decoding=\"async\" src=\"https:\/\/placehold.co\/600x800\/216838\/F5F1E8?text=Human+Grade\" alt=\"Human Grade\">\n                <\/div>\n                <div class=\"arch-card__content\">\n                  <span class=\"step-num\">01<\/span>\n                  <h3>100% Human Grade<\/h3>\n                  <p>\uc0ac\ub78c\uc774 \uba39\uc744 \uc218 \uc788\ub294 \uae68\ub057\ud558\uace0 \uc548\uc804\ud55c \ucd5c\uc0c1\uae09 \uc6d0\ub8cc\ub9cc\uc744 \uace0\uc9d1\ud569\ub2c8\ub2e4.<\/p>\n                <\/div>\n              <\/article>\n\n              <article class=\"arch-card\" style=\"transition-delay: 0.2s;\">\n                <div class=\"arch-card__image-wrap\">\n                  <img decoding=\"async\" src=\"https:\/\/placehold.co\/600x800\/154524\/CBDCC9?text=Vet+Formulated\" alt=\"Vet Formulated\">\n                <\/div>\n                <div class=\"arch-card__content\">\n                  <span class=\"step-num\">02<\/span>\n                  <h3>Vet Formulated<\/h3>\n                  <p>\uc804\ubb38 \uc5f0\uad6c\uc9c4\uc774 \ubc18\ub824\ub3d9\ubb3c\uc758 \uc2e0\uccb4 \uad6c\uc870\uc5d0 \ub9de\ucdb0 \ucd5c\uc801\uc758 \ube44\uc728\ub85c \ubc30\ud569\ud588\uc2b5\ub2c8\ub2e4.<\/p>\n                <\/div>\n              <\/article>\n\n              <article class=\"arch-card\" style=\"transition-delay: 0.4s;\">\n                <div class=\"arch-card__image-wrap\">\n                  <img decoding=\"async\" src=\"https:\/\/placehold.co\/600x800\/B58431\/F5F1E8?text=Strict+Safety\" alt=\"Safety\">\n                <\/div>\n                <div class=\"arch-card__content\">\n                  <span class=\"step-num\">03<\/span>\n                  <h3>Strict Quality Control<\/h3>\n                  <p>\ucca0\uc800\ud55c \uc704\uc0dd \uad00\ub9ac\uc640 \ubd88\ud544\uc694\ud55c \ucca8\uac00\ubb3c \ubc30\uc81c\ub85c \uc644\ubcbd\ud55c \uc548\uc804\uc744 \uc57d\uc18d\ud569\ub2c8\ub2e4.<\/p>\n                <\/div>\n              <\/article>\n            <\/div>\n          <\/div>\n        <\/section>\n\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<style>\n  :root {\n    \/* \ubcf8\ud22c\ud3ab \ube0c\ub79c\ub4dc \uceec\ub7ec *\/\n    --brand-green: #216838;\n    --brand-green-dark: #154524;\n    --brand-sage: #CBDCC9;\n    --brand-amber: #B58431;\n    --bg-ivory: #F9F8F6; \/* \ub530\ub73b\ud55c \uc544\uc774\ubcf4\ub9ac \ubc30\uacbd *\/\n    --text-dark: #222222;\n    --text-muted: #666666;\n  }\n\n  body {\n    margin: 0; padding: 0;\n    font-family: 'Pretendard', sans-serif;\n    background-color: var(--bg-ivory);\n    color: var(--text-dark);\n    overflow-x: hidden;\n  }\n\n  \/* --- \uac00\ub85c \uc2a4\ud06c\ub864 \ub808\uc774\uc544\uc6c3 --- *\/\n  .h-scroll { position: relative; }\n  .h-scroll__spacer { height: 200vh; }\n  .h-scroll__sticky { position: sticky; top: 0; height: 100vh; overflow: hidden; }\n  .h-scroll__track {\n    display: flex; width: 200vw; height: 100%;\n    will-change: transform; transform: translate3d(0,0,0);\n    transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);\n  }\n  .panel { width: 100vw; height: 100vh; flex: 0 0 100vw; overflow: hidden; display: flex; align-items: center; justify-content: center;}\n\n  \/* --- \uacf5\ud1b5 \ud5e4\ub354 \uc2a4\ud0c0\uc77c --- *\/\n  .section-header { text-align: center; margin-bottom: 60px; z-index: 10; position: relative; }\n  .kicker { font-size: 14px; font-weight: 800; letter-spacing: 0.15em; color: var(--brand-amber); margin-bottom: 12px; }\n  .title { font-size: clamp(32px, 4vw, 48px); font-weight: 800; color: var(--brand-green); margin: 0 0 16px; letter-spacing: -0.02em; }\n  .desc { font-size: 18px; color: var(--text-muted); margin: 0; }\n\n  \/* =========================================\n     SECTION 1 : Floating Organic Layout\n  ========================================= *\/\n  .panel--ingredients {\n    background: radial-gradient(circle at center, #ffffff 0%, var(--bg-ivory) 100%);\n  }\n  .ingredients-inner { width: 100%; max-width: 1200px; padding: 0 24px; }\n  \n  .floating-showcase {\n    position: relative; height: 600px; display: flex; align-items: center; justify-content: center;\n  }\n\n  \/* \uc911\uc559 \uc81c\ud488 *\/\n  .center-product { position: relative; z-index: 5; animation: gentleFloat 6s ease-in-out infinite; }\n  .center-product__glow {\n    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);\n    width: 350px; height: 350px; border-radius: 50%;\n    background: radial-gradient(circle, rgba(203,220,201,0.8) 0%, rgba(203,220,201,0) 70%);\n    z-index: -1;\n  }\n  .product-img { width: 250px; height: auto; object-fit: contain; filter: drop-shadow(0 20px 30px rgba(0,0,0,0.1)); }\n\n  \/* \ud50c\ub85c\ud305 \uce74\ub4dc (\uc131\ubd84) *\/\n  .float-card {\n    position: absolute; display: flex; align-items: center; gap: 16px;\n    background: rgba(255, 255, 255, 0.9); padding: 16px 24px 16px 16px;\n    border-radius: 100px; \/* \uc54c\uc57d\/\uc870\uc57d\ub3cc \ubaa8\uc591 *\/\n    box-shadow: 0 12px 30px rgba(33,104,56,0.08);\n    border: 1px solid rgba(203,220,201,0.5);\n    backdrop-filter: blur(8px);\n    transition: transform 0.3s ease, box-shadow 0.3s ease;\n    cursor: default; z-index: 10;\n  }\n  .float-card:hover {\n    transform: translateY(-5px) scale(1.05);\n    box-shadow: 0 20px 40px rgba(181,132,49,0.15);\n    border-color: var(--brand-amber);\n  }\n  .float-card .icon-wrap {\n    width: 50px; height: 50px; border-radius: 50%; background: var(--brand-sage);\n    display: flex; align-items: center; justify-content: center; font-size: 24px;\n  }\n  .float-card .text-wrap h3 { margin: 0 0 4px; font-size: 16px; color: var(--brand-green); font-weight: 700; }\n  .float-card .text-wrap p { margin: 0; font-size: 13px; color: var(--text-muted); max-width: 150px; line-height: 1.4; }\n\n  \/* \uac1c\ubcc4 \uce74\ub4dc \uc704\uce58 \uc9c0\uc815 & \uc560\ub2c8\uba54\uc774\uc158 *\/\n  .card-1 { top: 10%; left: 15%; animation: floatItem1 7s ease-in-out infinite; }\n  .card-2 { top: 20%; right: 10%; animation: floatItem2 8s ease-in-out infinite reverse; }\n  .card-3 { bottom: 15%; left: 10%; animation: floatItem2 6s ease-in-out infinite; }\n  .card-4 { bottom: 25%; right: 15%; animation: floatItem1 9s ease-in-out infinite reverse; }\n\n  @keyframes gentleFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-15px); } }\n  @keyframes floatItem1 { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(10px, -15px); } }\n  @keyframes floatItem2 { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-10px, 15px); } }\n\n\n  \/* =========================================\n     SECTION 2 : Arch Shaped Cards (Philosophy)\n  ========================================= *\/\n  .panel--philosophy { background-color: #FFFFFF; }\n  .philosophy-inner { width: 100%; max-width: 1200px; padding: 0 24px; }\n  \n  .arch-grid {\n    display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px;\n  }\n\n  .arch-card {\n    display: flex; flex-direction: column; align-items: center; text-align: center;\n    opacity: 0; transform: translateY(40px); transition: all 0.8s ease;\n  }\n  .arch-card.is-visible { opacity: 1; transform: translateY(0); }\n\n  .arch-card__image-wrap {\n    width: 100%; aspect-ratio: 3\/4;\n    border-radius: 200px 200px 16px 16px; \/* \ub465\uadfc \uc544\uce58 \ud615\ud0dc *\/\n    overflow: hidden; margin-bottom: 30px;\n    box-shadow: 0 20px 40px rgba(0,0,0,0.06);\n    position: relative;\n  }\n  .arch-card__image-wrap img {\n    width: 100%; height: 100%; object-fit: cover;\n    transition: transform 0.6s ease;\n  }\n  .arch-card:hover .arch-card__image-wrap img { transform: scale(1.08); }\n  \n  \/* \uc774\ubbf8\uc9c0 \ud558\ub2e8 \uc740\uc740\ud55c \uadf8\ub77c\ub370\uc774\uc158 *\/\n  .arch-card__image-wrap::after {\n    content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 40%;\n    background: linear-gradient(to top, rgba(0,0,0,0.2), transparent);\n  }\n\n  .arch-card__content .step-num {\n    display: block; font-size: 16px; font-weight: 800; color: var(--brand-amber); margin-bottom: 12px;\n  }\n  .arch-card__content h3 {\n    font-size: 24px; font-weight: 800; color: var(--brand-green); margin: 0 0 12px;\n  }\n  .arch-card__content p {\n    font-size: 16px; color: var(--text-muted); line-height: 1.6; margin: 0; padding: 0 10px;\n  }\n\n\n  \/* --- \ubc18\uc751\ud615 --- *\/\n  @media (max-width: 980px) {\n    .h-scroll__spacer { height: auto; }\n    .h-scroll__sticky { position: relative; height: auto; overflow: visible; }\n    .h-scroll__track { width: 100%; height: auto; display: block; transform: none !important; }\n    .panel { width: 100%; height: auto; padding: 100px 0; }\n    \n    .floating-showcase { height: auto; flex-direction: column; gap: 30px; margin-top: 40px; }\n    .center-product { order: -1; margin-bottom: 20px; }\n    .float-card { position: relative; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; width: 100%; max-width: 320px; animation: none !important; }\n    \n    .arch-grid { grid-template-columns: 1fr; gap: 60px; max-width: 400px; margin: 0 auto; }\n  }\n<\/style>\n\n<script>\n(function(){\n  const desktopMq = window.matchMedia('(min-width: 981px)');\n  const wrapper = document.querySelector('.h-scroll');\n  const spacer = document.querySelector('.h-scroll__spacer');\n  const track = document.querySelector('.h-scroll__track');\n  const panels = Array.from(document.querySelectorAll('.h-scroll .panel'));\n\n  if(!wrapper || !spacer || !track || !panels.length) return;\n\n  let currentPanel = 0;\n  let isAnimating = false;\n\n  function isDesktop(){ return desktopMq.matches; }\n\n  function setPanel(index, animate = true){\n    currentPanel = Math.max(0, Math.min(index, panels.length - 1));\n    track.style.transition = animate ? 'transform .8s cubic-bezier(0.25, 1, 0.5, 1)' : 'none';\n    track.style.transform = `translate3d(${currentPanel * -100}vw, 0, 0)`;\n  }\n\n  function updateLayout(){\n    if(!isDesktop()){\n      spacer.style.height = 'auto'; track.style.transition = 'none'; track.style.transform = 'translate3d(0,0,0)';\n      return;\n    }\n    spacer.style.height = (panels.length * 100) + 'vh';\n    setPanel(currentPanel, false);\n  }\n\n  function isWrapperActive(){\n    const rect = wrapper.getBoundingClientRect();\n    return rect.top <= 0 && rect.bottom >= window.innerHeight;\n  }\n\n  function handleWheel(e){\n    if(!isDesktop() || !isWrapperActive() || isAnimating) return;\n    const goingDown = e.deltaY > 8; const goingUp = e.deltaY < -8;\n    \n    if(currentPanel === 0 && goingDown){\n      e.preventDefault(); isAnimating = true; setPanel(1, true);\n      setTimeout(() => { isAnimating = false; }, 850);\n    } else if(currentPanel === 1 && goingUp){\n      e.preventDefault(); isAnimating = true; setPanel(0, true);\n      setTimeout(() => { isAnimating = false; }, 850);\n    }\n  }\n\n  window.addEventListener('wheel', handleWheel, { passive:false });\n  window.addEventListener('resize', updateLayout);\n  desktopMq.addEventListener('change', updateLayout);\n  updateLayout();\n\n  \/\/ Section 2 - Arch Cards Animation Observer\n  const observer = new IntersectionObserver((entries) => {\n    entries.forEach(entry => {\n      if (entry.isIntersecting) {\n        entry.target.classList.add('is-visible');\n        observer.unobserve(entry.target);\n      }\n    });\n  }, { threshold: 0.2 });\n\n  document.querySelectorAll('.arch-card').forEach(card => observer.observe(card));\n\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>[ Placeholder ] \ubcf4\ud638\uc790\uc640 \ubc18\ub824\ub3d9\ubb3c\uc774 \uad50\uac10\ud558\uba70 \ub6f0\ub178\ub294 \uace0\ud654\uc9c8 \ub77c\uc774\ud504\uc2a4\ud0c0\uc77c \uc601\uc0c1 (Full Screen) \ud65c\uae30\ucc2c \ub0b4\uc77c\uc744\uc120\ubb3c\ud558\uc138\uc694 \uad00\uc808, \uc2ac\uac1c\uace8, \ubf08 \uac74\uac15\ubd80\ud130 \uadfc\uc721\uae4c\uc9c0 \ubcf8\ud22c\ud3ab\uc73c\ub85c \uc2dc\uc791\ud558\ub294 \uccb4\uacc4\uc801\uc778 \ucf00\uc5b4 \uc81c\ud488 \uc0c1\uc138\ubcf4\uae30 \ubb38\uc81c \uc81c\uae30(\uacf5\uac10) \uc139\uc158 \uc0ac\uc18c\ud55c \ubcc0\ud654, \ub193\uce58\uace0 \uacc4\uc2e0\uac00\uc694? \ub9d0 \ubabb\ud558\ub294 \uc544\uc774\ub4e4\uc758 \uad00\uc808\uc740 \uc774\ubbf8 \ubb34\ub9ac\ud558\uace0 \uc788\uc744\uc9c0 \ubaa8\ub985\ub2c8\ub2e4. [ Image ]\uc0b0\ucc45 \uc911 \uc8fc\uc800\uc549\uc740 \ubaa8\uc2b5 \uc0b0\ucc45\uc744 \uae08\ubc29 \ud798\ub4e4\uc5b4\ud55c\ub2e4 [ Image ]\uc18c\ud30c \ubc11\uc5d0\uc11c \uc62c\ub824\ub2e4\ubcf4\ub294 \ubaa8\uc2b5 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-29","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>\uba54\uc778 - \ubcf8\ud22c\ud3ab<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/in.bemypet.kr\/bonetopet\/\" \/>\n<meta property=\"og:locale\" content=\"ko_KR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\uba54\uc778 - \ubcf8\ud22c\ud3ab\" \/>\n<meta property=\"og:description\" content=\"[ Placeholder ] \ubcf4\ud638\uc790\uc640 \ubc18\ub824\ub3d9\ubb3c\uc774 \uad50\uac10\ud558\uba70 \ub6f0\ub178\ub294 \uace0\ud654\uc9c8 \ub77c\uc774\ud504\uc2a4\ud0c0\uc77c \uc601\uc0c1 (Full Screen) \ud65c\uae30\ucc2c \ub0b4\uc77c\uc744\uc120\ubb3c\ud558\uc138\uc694 \uad00\uc808, \uc2ac\uac1c\uace8, \ubf08 \uac74\uac15\ubd80\ud130 \uadfc\uc721\uae4c\uc9c0 \ubcf8\ud22c\ud3ab\uc73c\ub85c \uc2dc\uc791\ud558\ub294 \uccb4\uacc4\uc801\uc778 \ucf00\uc5b4 \uc81c\ud488 \uc0c1\uc138\ubcf4\uae30 \ubb38\uc81c \uc81c\uae30(\uacf5\uac10) \uc139\uc158 \uc0ac\uc18c\ud55c \ubcc0\ud654, \ub193\uce58\uace0 \uacc4\uc2e0\uac00\uc694? \ub9d0 \ubabb\ud558\ub294 \uc544\uc774\ub4e4\uc758 \uad00\uc808\uc740 \uc774\ubbf8 \ubb34\ub9ac\ud558\uace0 \uc788\uc744\uc9c0 \ubaa8\ub985\ub2c8\ub2e4. [ Image ]\uc0b0\ucc45 \uc911 \uc8fc\uc800\uc549\uc740 \ubaa8\uc2b5 \uc0b0\ucc45\uc744 \uae08\ubc29 \ud798\ub4e4\uc5b4\ud55c\ub2e4 [ Image ]\uc18c\ud30c \ubc11\uc5d0\uc11c \uc62c\ub824\ub2e4\ubcf4\ub294 \ubaa8\uc2b5 [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/in.bemypet.kr\/bonetopet\/\" \/>\n<meta property=\"og:site_name\" content=\"\ubcf8\ud22c\ud3ab\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-27T09:50:59+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/placehold.co\/400x400\/CBDCC9\/216838?text=Bone+to+Pet+Bottle\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"18\ubd84\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/in.bemypet.kr\/bonetopet\/\",\"url\":\"https:\/\/in.bemypet.kr\/bonetopet\/\",\"name\":\"\uba54\uc778 - \ubcf8\ud22c\ud3ab\",\"isPartOf\":{\"@id\":\"https:\/\/in.bemypet.kr\/bonetopet\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/in.bemypet.kr\/bonetopet\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/in.bemypet.kr\/bonetopet\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/placehold.co\/400x400\/CBDCC9\/216838?text=Bone+to+Pet+Bottle\",\"datePublished\":\"2026-03-28T15:57:48+00:00\",\"dateModified\":\"2026-04-27T09:50:59+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/in.bemypet.kr\/bonetopet\/#breadcrumb\"},\"inLanguage\":\"ko-KR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/in.bemypet.kr\/bonetopet\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"ko-KR\",\"@id\":\"https:\/\/in.bemypet.kr\/bonetopet\/#primaryimage\",\"url\":\"https:\/\/placehold.co\/400x400\/CBDCC9\/216838?text=Bone+to+Pet+Bottle\",\"contentUrl\":\"https:\/\/placehold.co\/400x400\/CBDCC9\/216838?text=Bone+to+Pet+Bottle\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/in.bemypet.kr\/bonetopet\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/in.bemypet.kr\/bonetopet\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\uba54\uc778\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/in.bemypet.kr\/bonetopet\/#website\",\"url\":\"https:\/\/in.bemypet.kr\/bonetopet\/\",\"name\":\"\ubcf8\ud22c\ud3ab\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/in.bemypet.kr\/bonetopet\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"ko-KR\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\uba54\uc778 - \ubcf8\ud22c\ud3ab","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/in.bemypet.kr\/bonetopet\/","og_locale":"ko_KR","og_type":"article","og_title":"\uba54\uc778 - \ubcf8\ud22c\ud3ab","og_description":"[ Placeholder ] \ubcf4\ud638\uc790\uc640 \ubc18\ub824\ub3d9\ubb3c\uc774 \uad50\uac10\ud558\uba70 \ub6f0\ub178\ub294 \uace0\ud654\uc9c8 \ub77c\uc774\ud504\uc2a4\ud0c0\uc77c \uc601\uc0c1 (Full Screen) \ud65c\uae30\ucc2c \ub0b4\uc77c\uc744\uc120\ubb3c\ud558\uc138\uc694 \uad00\uc808, \uc2ac\uac1c\uace8, \ubf08 \uac74\uac15\ubd80\ud130 \uadfc\uc721\uae4c\uc9c0 \ubcf8\ud22c\ud3ab\uc73c\ub85c \uc2dc\uc791\ud558\ub294 \uccb4\uacc4\uc801\uc778 \ucf00\uc5b4 \uc81c\ud488 \uc0c1\uc138\ubcf4\uae30 \ubb38\uc81c \uc81c\uae30(\uacf5\uac10) \uc139\uc158 \uc0ac\uc18c\ud55c \ubcc0\ud654, \ub193\uce58\uace0 \uacc4\uc2e0\uac00\uc694? \ub9d0 \ubabb\ud558\ub294 \uc544\uc774\ub4e4\uc758 \uad00\uc808\uc740 \uc774\ubbf8 \ubb34\ub9ac\ud558\uace0 \uc788\uc744\uc9c0 \ubaa8\ub985\ub2c8\ub2e4. [ Image ]\uc0b0\ucc45 \uc911 \uc8fc\uc800\uc549\uc740 \ubaa8\uc2b5 \uc0b0\ucc45\uc744 \uae08\ubc29 \ud798\ub4e4\uc5b4\ud55c\ub2e4 [ Image ]\uc18c\ud30c \ubc11\uc5d0\uc11c \uc62c\ub824\ub2e4\ubcf4\ub294 \ubaa8\uc2b5 [&hellip;]","og_url":"https:\/\/in.bemypet.kr\/bonetopet\/","og_site_name":"\ubcf8\ud22c\ud3ab","article_modified_time":"2026-04-27T09:50:59+00:00","og_image":[{"url":"https:\/\/placehold.co\/400x400\/CBDCC9\/216838?text=Bone+to+Pet+Bottle","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"18\ubd84"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/in.bemypet.kr\/bonetopet\/","url":"https:\/\/in.bemypet.kr\/bonetopet\/","name":"\uba54\uc778 - \ubcf8\ud22c\ud3ab","isPartOf":{"@id":"https:\/\/in.bemypet.kr\/bonetopet\/#website"},"primaryImageOfPage":{"@id":"https:\/\/in.bemypet.kr\/bonetopet\/#primaryimage"},"image":{"@id":"https:\/\/in.bemypet.kr\/bonetopet\/#primaryimage"},"thumbnailUrl":"https:\/\/placehold.co\/400x400\/CBDCC9\/216838?text=Bone+to+Pet+Bottle","datePublished":"2026-03-28T15:57:48+00:00","dateModified":"2026-04-27T09:50:59+00:00","breadcrumb":{"@id":"https:\/\/in.bemypet.kr\/bonetopet\/#breadcrumb"},"inLanguage":"ko-KR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/in.bemypet.kr\/bonetopet\/"]}]},{"@type":"ImageObject","inLanguage":"ko-KR","@id":"https:\/\/in.bemypet.kr\/bonetopet\/#primaryimage","url":"https:\/\/placehold.co\/400x400\/CBDCC9\/216838?text=Bone+to+Pet+Bottle","contentUrl":"https:\/\/placehold.co\/400x400\/CBDCC9\/216838?text=Bone+to+Pet+Bottle"},{"@type":"BreadcrumbList","@id":"https:\/\/in.bemypet.kr\/bonetopet\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/in.bemypet.kr\/bonetopet\/"},{"@type":"ListItem","position":2,"name":"\uba54\uc778"}]},{"@type":"WebSite","@id":"https:\/\/in.bemypet.kr\/bonetopet\/#website","url":"https:\/\/in.bemypet.kr\/bonetopet\/","name":"\ubcf8\ud22c\ud3ab","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/in.bemypet.kr\/bonetopet\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"ko-KR"}]}},"_links":{"self":[{"href":"https:\/\/in.bemypet.kr\/bonetopet\/wp-json\/wp\/v2\/pages\/29","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/in.bemypet.kr\/bonetopet\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/in.bemypet.kr\/bonetopet\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/in.bemypet.kr\/bonetopet\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/in.bemypet.kr\/bonetopet\/wp-json\/wp\/v2\/comments?post=29"}],"version-history":[{"count":34,"href":"https:\/\/in.bemypet.kr\/bonetopet\/wp-json\/wp\/v2\/pages\/29\/revisions"}],"predecessor-version":[{"id":82,"href":"https:\/\/in.bemypet.kr\/bonetopet\/wp-json\/wp\/v2\/pages\/29\/revisions\/82"}],"wp:attachment":[{"href":"https:\/\/in.bemypet.kr\/bonetopet\/wp-json\/wp\/v2\/media?parent=29"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}