{"id":2904,"date":"2025-08-18T11:08:06","date_gmt":"2025-08-18T02:08:06","guid":{"rendered":"http:\/\/jbgmna.com\/?page_id=2904"},"modified":"2025-08-18T11:18:51","modified_gmt":"2025-08-18T02:18:51","slug":"e9-%eb%b9%84%ec%9e%90-e74%eb%b9%84%ec%9e%90%eb%b3%80%ea%b2%bd","status":"publish","type":"page","link":"http:\/\/jbgmna.com\/?page_id=2904","title":{"rendered":"E9 \ube44\uc790 E74\ube44\uc790\ubcc0\uacbd"},"content":{"rendered":"\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\r\n\r\n\r\n \r\n \r\n E-9\uc5d0\uc11c E-7-4 \ube44\uc790\ub85c | \uc219\ub828\uae30\ub2a5\uc778\ub825 \ube44\uc790 \uc804\ud658 \uc548\ub0b4<\/title>\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js\"><\/script>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap\" rel=\"stylesheet\">\r\n <!-- Chosen Palette: Warm Neutrals with Blue Accent -->\r\n <!-- Application Structure Plan: The application is structured as a user journey. It starts with the \"Why\" (Benefits) to motivate the user, moves to the interactive \"Can I?\" (Eligibility Checker) for self-assessment, then explains the \"How\" (Process), covers the \"What to watch out for?\" (Precautions), and ends with a clear call-to-action (Contact). This non-linear, task-oriented structure is more engaging and user-friendly than a simple document layout, guiding the user from motivation to action. -->\r\n <!-- Visualization & Content Choices: \r\n - Report Info: Benefits of E-7-4 -> Goal: Motivate -> Viz\/Method: Icon-based cards (HTML\/Tailwind) -> Interaction: Subtle hover effects -> Justification: Visually appealing and easy to scan.\r\n - Report Info: Point-based system -> Goal: Allow self-assessment -> Viz\/Method: Interactive form with dropdowns and a dynamic Chart.js bar chart -> Interaction: User selections update the chart and score in real-time -> Justification: Makes the complex point system tangible and personal.\r\n - Report Info: Application steps -> Goal: Explain sequence -> Viz\/Method: Visual timeline with HTML\/CSS -> Interaction: Click to expand details -> Justification: More intuitive for showing a process than a text list.\r\n - Report Info: Precautions -> Goal: Warn\/Inform -> Viz\/Method: Highlighted callout boxes -> Interaction: None -> Justification: Draws attention to critical information.\r\n -->\r\n <!-- CONFIRMATION: NO SVG graphics used. NO Mermaid JS used. -->\r\n <style>\r\n body {\r\n font-family: 'Noto Sans KR', sans-serif;\r\n }\r\n .chart-container {\r\n position: relative;\r\n width: 100%;\r\n max-width: 700px;\r\n margin-left: auto;\r\n margin-right: auto;\r\n height: 250px;\r\n max-height: 300px;\r\n }\r\n @media (min-width: 768px) {\r\n .chart-container {\r\n height: 300px;\r\n max-height: 350px;\r\n }\r\n }\r\n .step-item.active .step-circle {\r\n background-color: #3b82f6;\r\n color: white;\r\n }\r\n .step-item.active .step-title {\r\n color: #3b82f6;\r\n font-weight: 700;\r\n }\r\n .step-details {\r\n transition: max-height 0.5s ease-in-out, opacity 0.5s ease-in-out;\r\n max-height: 0;\r\n opacity: 0;\r\n overflow: hidden;\r\n }\r\n .step-details.show {\r\n max-height: 500px;\r\n opacity: 1;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"bg-gray-50 text-gray-800\">\r\n\r\n <header class=\"bg-white shadow-sm sticky top-0 z-50\">\r\n <nav class=\"container mx-auto px-6 py-4 flex justify-between items-center\">\r\n <div class=\"text-2xl font-bold text-blue-600\">\r\n <a href=\"#\">E-7-4 \ube44\uc790 \uc804\ud658 \uac00\uc774\ub4dc<\/a>\r\n <\/div>\r\n <div class=\"hidden md:flex space-x-8\">\r\n <a href=\"#benefits\" class=\"text-gray-600 hover:text-blue-600 transition\">\uc8fc\uc694 \ud61c\ud0dd<\/a>\r\n <a href=\"#checker\" class=\"text-gray-600 hover:text-blue-600 transition\">\uc790\uaca9 \ud655\uc778<\/a>\r\n <a href=\"#process\" class=\"text-gray-600 hover:text-blue-600 transition\">\ubcc0\uacbd \uc808\ucc28<\/a>\r\n <a href=\"#contact\" class=\"bg-blue-500 text-white px-4 py-2 rounded-full hover:bg-blue-600 transition\">\uc0c1\ub2f4 \ubb38\uc758<\/a>\r\n <\/div>\r\n <button id=\"mobile-menu-button\" class=\"md:hidden\">\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 6h16M4 12h16m-7 6h7\" \/>\r\n <\/svg>\r\n <\/button>\r\n <\/nav>\r\n <div id=\"mobile-menu\" class=\"hidden md:hidden bg-white py-2\">\r\n <a href=\"#benefits\" class=\"block px-6 py-2 text-gray-600 hover:bg-gray-100\">\uc8fc\uc694 \ud61c\ud0dd<\/a>\r\n <a href=\"#checker\" class=\"block px-6 py-2 text-gray-600 hover:bg-gray-100\">\uc790\uaca9 \ud655\uc778<\/a>\r\n <a href=\"#process\" class=\"block px-6 py-2 text-gray-600 hover:bg-gray-100\">\ubcc0\uacbd \uc808\ucc28<\/a>\r\n <a href=\"#contact\" class=\"block px-6 py-2 text-gray-600 hover:bg-gray-100\">\uc0c1\ub2f4 \ubb38\uc758<\/a>\r\n <\/div>\r\n <\/header>\r\n\r\n <main>\r\n <section id=\"hero\" class=\"bg-blue-50 py-20\">\r\n <div class=\"container mx-auto px-6 text-center\">\r\n <h1 class=\"text-4xl md:text-5xl font-bold text-gray-800 mb-4\">\ud55c\uad6d\uc5d0\uc11c\uc758 \uc0c8\ub85c\uc6b4 \uc2dc\uc791 E-7-4 \ube44\uc790<\/h1>\r\n <p class=\"text-lg text-gray-600 max-w-3xl mx-auto\">E-9 \ube44\uc790\uc5d0\uc11c \uc219\ub828\uae30\ub2a5\uc778\ub825(E-7-4) \ube44\uc790\ub85c \uc804\ud658\ud558\uc5ec \uc548\uc815\uc801\uc778 \ubbf8\ub798\uc640 \ub354 \ud070 \uae30\ud68c\ub97c \ub9cc\ub4dc\uc138\uc694. \ub2f9\uc2e0\uc758 \uc131\uacf5\uc801\uc778 \uc815\ucc29\uc744 \ube44\uc790\uc7a1\ucf54\ub9ac\uc544\uac00 \ud568\uaed8\ud569\ub2c8\ub2e4.<\/p>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"benefits\" class=\"py-16 bg-white\">\r\n <div class=\"container mx-auto px-6\">\r\n <h2 class=\"text-3xl font-bold text-center mb-2\">\uc65c E-7-4 \ube44\uc790\ub85c \ubcc0\uacbd\ud574\uc57c \ud560\uae4c\uc694?<\/h2>\r\n <p class=\"text-center text-gray-600 mb-12\">E-7-4 \ube44\uc790\ub294 \ub2e8\uc21c\ud55c \uccb4\ub958 \uc5f0\uc7a5\uc744 \ub118\uc5b4, \ub2f9\uc2e0\uc758 \uc0b6\uc5d0 \uc911\uc694\ud55c \ubcc0\ud654\ub97c \uac00\uc838\uc635\ub2c8\ub2e4.<\/p>\r\n <div class=\"grid md:grid-cols-3 gap-8\">\r\n <div class=\"bg-gray-50 p-8 rounded-lg shadow-md hover:shadow-xl transition-shadow text-center\">\r\n <div class=\"text-4xl mb-4\">\ud83d\uddd3\ufe0f<\/div>\r\n <h3 class=\"text-xl font-bold mb-2\">\uc548\uc815\uc801\uc778 \uc7a5\uae30 \uccb4\ub958<\/h3>\r\n <p class=\"text-gray-600\">E-9 \ube44\uc790\uc758 4\ub144 10\uac1c\uc6d4 \uccb4\ub958 \uae30\uac04 \uc81c\ud55c \uc5c6\uc774, \uace0\uc6a9 \uacc4\uc57d\uc744 \uc720\uc9c0\ud558\uba70 \ud55c\uad6d\uc5d0\uc11c \uacc4\uc18d \uadfc\ubb34\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-8 rounded-lg shadow-md hover:shadow-xl transition-shadow text-center\">\r\n <div class=\"text-4xl mb-4\">\ud83d\udc68\u200d\ud83d\udc69\u200d\ud83d\udc67\u200d\ud83d\udc66<\/div>\r\n <h3 class=\"text-xl font-bold mb-2\">\uc18c\uc911\ud55c \uac00\uc871 \ucd08\uccad<\/h3>\r\n <p class=\"text-gray-600\">\ubc30\uc6b0\uc790\uc640 \ubbf8\uc131\ub144 \uc790\ub140\ub97c \ud55c\uad6d\uc73c\ub85c \ucd08\uccad\ud558\uc5ec \ud568\uaed8 \uc0dd\ud65c\ud558\uba70 \uc548\uc815\uc801\uc778 \uac00\uc815 \uc0dd\ud65c\uc744 \uafb8\ub9b4 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-8 rounded-lg shadow-md hover:shadow-xl transition-shadow text-center\">\r\n <div class=\"text-4xl mb-4\">\ud83c\uddf0\ud83c\uddf7<\/div>\r\n <h3 class=\"text-xl font-bold mb-2\">\uc601\uc8fc\uad8c(F-5) \ucde8\ub4dd\uc758 \ubc1c\ud310<\/h3>\r\n <p class=\"text-gray-600\">E-7-4 \ube44\uc790\ub85c \uc77c\uc815 \uae30\uac04 \uc774\uc0c1 \uccb4\ub958 \ubc0f \uc18c\ub4dd \uc694\uac74 \ucda9\uc871 \uc2dc, \uc601\uc8fc\uad8c\uc744 \uc2e0\uccad\ud560 \uc218 \uc788\ub294 \uc790\uaca9\uc774 \uc8fc\uc5b4\uc9d1\ub2c8\ub2e4.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"checker\" class=\"py-16 bg-gray-50\">\r\n <div class=\"container mx-auto px-6\">\r\n <h2 class=\"text-3xl font-bold text-center mb-2\">\ub098\uc758 E-7-4 \uc804\ud658 \uac00\ub2a5\uc131\uc740?<\/h2>\r\n <p class=\"text-center text-gray-600 mb-12\">\uc544\ub798 \ud56d\ubaa9\uc744 \uc120\ud0dd\ud558\uc5ec \uc608\uc0c1 \uc810\uc218\ub97c \ud655\uc778\ud574\ubcf4\uc138\uc694. \uc774\ub294 \uacf5\uc2dd\uc801\uc778 \uc2ec\uc0ac \uacb0\uacfc\uac00 \uc544\ub2c8\uba70, \uc815\ud655\ud55c \uc0c1\ub2f4\uc744 \uc704\ud55c \ucc38\uace0 \uc790\ub8cc\uc785\ub2c8\ub2e4.<\/p>\r\n \r\n <div class=\"bg-white p-8 rounded-lg shadow-lg\">\r\n <div class=\"grid md:grid-cols-2 gap-8 items-center\">\r\n <div>\r\n <form id=\"point-calculator-form\" class=\"space-y-6\">\r\n <div>\r\n <label for=\"income\" class=\"block text-sm font-medium text-gray-700\">\ucd5c\uadfc 2\ub144 \ud3c9\uade0 \uc5f0\uac04 \uc18c\ub4dd<\/label>\r\n <select id=\"income\" class=\"mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500\">\r\n <option value=\"0\">\uc120\ud0dd\ud558\uc138\uc694<\/option>\r\n <option value=\"10\">2,600\ub9cc\uc6d0 \uc774\uc0c1<\/option>\r\n <option value=\"15\">3,000\ub9cc\uc6d0 \uc774\uc0c1<\/option>\r\n <option value=\"20\">3,300\ub9cc\uc6d0 \uc774\uc0c1<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label for=\"korean\" class=\"block text-sm font-medium text-gray-700\">\ud55c\uad6d\uc5b4 \ub2a5\ub825 (KIIP \ub610\ub294 TOPIK)<\/label>\r\n <select id=\"korean\" class=\"mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500\">\r\n <option value=\"0\">\uc120\ud0dd\ud558\uc138\uc694<\/option>\r\n <option value=\"10\">\uc0ac\ud68c\ud1b5\ud569 2\ub2e8\uacc4 \ub610\ub294 TOPIK 2\uae09<\/option>\r\n <option value=\"15\">\uc0ac\ud68c\ud1b5\ud569 3\ub2e8\uacc4 \ub610\ub294 TOPIK 3\uae09<\/option>\r\n <option value=\"20\">\uc0ac\ud68c\ud1b5\ud569 4\ub2e8\uacc4 \ub610\ub294 TOPIK 4\uae09<\/option>\r\n <option value=\"25\">\uc0ac\ud68c\ud1b5\ud569 5\ub2e8\uacc4 \ub610\ub294 TOPIK 5\uae09 \uc774\uc0c1<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label for=\"age\" class=\"block text-sm font-medium text-gray-700\">\ub098\uc774 (\ub9cc)<\/label>\r\n <select id=\"age\" class=\"mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500\">\r\n <option value=\"0\">\uc120\ud0dd\ud558\uc138\uc694<\/option>\r\n <option value=\"15\">~ 26\uc138<\/option>\r\n <option value=\"20\">27\uc138 ~ 33\uc138<\/option>\r\n <option value=\"15\">34\uc138 ~ 39\uc138<\/option>\r\n <option value=\"10\">40\uc138 \uc774\uc0c1<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label for=\"experience\" class=\"block text-sm font-medium text-gray-700\">\ud604 \uadfc\ubb34\ucc98 \uadfc\uc18d \uae30\uac04<\/label>\r\n <select id=\"experience\" class=\"mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500\">\r\n <option value=\"0\">\uc120\ud0dd\ud558\uc138\uc694<\/option>\r\n <option value=\"10\">1\ub144 \uc774\uc0c1<\/option>\r\n <option value=\"15\">2\ub144 \uc774\uc0c1<\/option>\r\n <option value=\"20\">3\ub144 \uc774\uc0c1<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/form>\r\n <\/div>\r\n <div class=\"text-center\">\r\n <div class=\"chart-container\">\r\n <canvas id=\"pointChart\"><\/canvas>\r\n <\/div>\r\n <p class=\"mt-4 text-lg\">\ub098\uc758 \uc608\uc0c1 \uc810\uc218: <span id=\"total-score\" class=\"font-bold text-blue-600 text-2xl\">0<\/span> \uc810<\/p>\r\n <p id=\"result-message\" class=\"mt-2 text-gray-600 font-medium\"><\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"process\" class=\"py-16 bg-white\">\r\n <div class=\"container mx-auto px-6\">\r\n <h2 class=\"text-3xl font-bold text-center mb-12\">E-7-4 \ube44\uc790 \ubcc0\uacbd, \uc774\ub807\uac8c \uc9c4\ud589\ub429\ub2c8\ub2e4<\/h2>\r\n <div class=\"relative\">\r\n <div class=\"absolute left-1\/2 -translate-x-1\/2 h-full w-0.5 bg-gray-200\" aria-hidden=\"true\"><\/div>\r\n <div id=\"steps-container\" class=\"space-y-12\">\r\n <div class=\"step-item text-center cursor-pointer\" data-step=\"1\">\r\n <div class=\"step-circle inline-flex items-center justify-center w-12 h-12 rounded-full bg-gray-200 text-gray-600 font-bold text-lg mb-2 transition\">1<\/div>\r\n <h3 class=\"step-title text-xl font-semibold transition\">\uc790\uaca9 \uac80\ud1a0 \ubc0f \uc11c\ub958 \uc900\ube44<\/h3>\r\n <div class=\"step-details\">\r\n <p class=\"mt-2 text-gray-600 max-w-xl mx-auto bg-gray-50 p-4 rounded-md\">\ubcf8\uc778\uc758 \uc810\uc218\ub97c \uacc4\uc0b0\ud558\uace0, \uc18c\ub4dd\uae08\uc561\uc99d\uba85\uc6d0, \ud55c\uad6d\uc5b4\ub2a5\ub825\uc2dc\ud5d8 \uc131\uc801\ud45c, \uacbd\ub825\uc99d\uba85\uc11c, \ud45c\uc900\uadfc\ub85c\uacc4\uc57d\uc11c \ub4f1 \ud544\uc694 \uc11c\ub958\ub97c \uaf3c\uaf3c\ud788 \uc900\ube44\ud569\ub2c8\ub2e4. \ud574\uc678\uc5d0\uc11c \ubc1c\uae09\ub41c \uc11c\ub958\ub294 \uc544\ud3ec\uc2a4\ud2f0\uc720 \ub610\ub294 \uc601\uc0ac \ud655\uc778\uc774 \ud544\uc694\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step-item text-center cursor-pointer\" data-step=\"2\">\r\n <div class=\"step-circle inline-flex items-center justify-center w-12 h-12 rounded-full bg-gray-200 text-gray-600 font-bold text-lg mb-2 transition\">2<\/div>\r\n <h3 class=\"step-title text-xl font-semibold transition\">\uad00\ud560 \ucd9c\uc785\uad6d\u00b7\uc678\uad6d\uc778\uccad \uc2e0\uccad<\/h3>\r\n <div class=\"step-details\">\r\n <p class=\"mt-2 text-gray-600 max-w-xl mx-auto bg-gray-50 p-4 rounded-md\">\uc900\ube44\ub41c \uc11c\ub958\ub97c \uac00\uc9c0\uace0 \ud604\uc7ac \uccb4\ub958\uc9c0 \uad00\ud560 \ucd9c\uc785\uad6d\u00b7\uc678\uad6d\uc778\uccad\uc5d0 \ubc29\ubb38\ud558\uc5ec E-7-4 \ube44\uc790 \ubcc0\uacbd\uc744 \uacf5\uc2dd\uc801\uc73c\ub85c \uc2e0\uccad\ud569\ub2c8\ub2e4. \uc5f0\uac04 \ucffc\ud130\uac00 \uc788\uc5b4 \ubd84\uae30\ubcc4\ub85c \uc120\ubc1c\ud558\ubbc0\ub85c \uc2e0\uccad \uc2dc\uae30\ub97c \uc798 \ud655\uc778\ud574\uc57c \ud569\ub2c8\ub2e4.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step-item text-center cursor-pointer\" data-step=\"3\">\r\n <div class=\"step-circle inline-flex items-center justify-center w-12 h-12 rounded-full bg-gray-200 text-gray-600 font-bold text-lg mb-2 transition\">3<\/div>\r\n <h3 class=\"step-title text-xl font-semibold transition\">\uc2ec\uc0ac \ubc0f \uacb0\uacfc \ud1b5\ubcf4<\/h3>\r\n <div class=\"step-details\">\r\n <p class=\"mt-2 text-gray-600 max-w-xl mx-auto bg-gray-50 p-4 rounded-md\">\ucd9c\uc785\uad6d\u00b7\uc678\uad6d\uc778\uccad\uc5d0\uc11c \uc81c\ucd9c\ub41c \uc11c\ub958\uc640 \uc2e0\uccad\uc778\uc758 \uc790\uaca9 \uc694\uac74\uc744 \uc885\ud569\uc801\uc73c\ub85c \uc2ec\uc0ac\ud569\ub2c8\ub2e4. \uc2ec\uc0ac \uae30\uac04\uc740 \ud1b5\uc0c1 \uc218 \uc8fc\uc5d0\uc11c \uc218 \uac1c\uc6d4\uc774 \uc18c\uc694\ub420 \uc218 \uc788\uc2b5\ub2c8\ub2e4. \uacb0\uacfc\ub294 \uac1c\ubcc4\uc801\uc73c\ub85c \ud1b5\ubcf4\ub429\ub2c8\ub2e4.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step-item text-center cursor-pointer\" data-step=\"4\">\r\n <div class=\"step-circle inline-flex items-center justify-center w-12 h-12 rounded-full bg-gray-200 text-gray-600 font-bold text-lg mb-2 transition\">4<\/div>\r\n <h3 class=\"step-title text-xl font-semibold transition\">\uc678\uad6d\uc778 \ub4f1\ub85d \ubc0f \uccb4\ub958<\/h3>\r\n <div class=\"step-details\">\r\n <p class=\"mt-2 text-gray-600 max-w-xl mx-auto bg-gray-50 p-4 rounded-md\">\ube44\uc790 \ubcc0\uacbd \ud5c8\uac00\ub97c \ubc1b\uc73c\uba74, \uc0c8\ub85c\uc6b4 \uccb4\ub958\uc790\uaca9(E-7-4)\uc774 \uae30\uc7ac\ub41c \uc678\uad6d\uc778\ub4f1\ub85d\uc99d\uc744 \ubc1c\uae09\ubc1b\uac8c \ub429\ub2c8\ub2e4. \uc774\uc81c \ub2f9\uc2e0\uc740 \uc219\ub828\uae30\ub2a5\uc778\ub825\uc73c\ub85c\uc11c \ud55c\uad6d\uc5d0\uc11c \uc0c8\ub85c\uc6b4 \uc0b6\uc744 \uc2dc\uc791\ud558\uac8c \ub429\ub2c8\ub2e4.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"precautions\" class=\"py-16 bg-blue-50\">\r\n <div class=\"container mx-auto px-6\">\r\n <h2 class=\"text-3xl font-bold text-center mb-12\">\uaf2d \uc54c\uc544\ub450\uc5b4\uc57c \ud560 \ud575\uc2ec \uc720\uc758\uc0ac\ud56d<\/h2>\r\n <div class=\"grid md:grid-cols-2 gap-8\">\r\n <div class=\"bg-white p-6 rounded-lg shadow-md flex items-start\">\r\n <div class=\"text-red-500 text-2xl mr-4\">\u26a0\ufe0f<\/div>\r\n <div>\r\n <h3 class=\"font-bold text-lg mb-2\">\uc2e0\uccad \ubd88\uac00 \uc0ac\uc720 (\uacb0\uaca9 \uc0ac\uc720)<\/h3>\r\n <p class=\"text-gray-600\">\uc138\uae08 \uccb4\ub0a9, \ubc8c\uae08 100\ub9cc\uc6d0 \uc774\uc0c1\uc758 \ud615\uc0ac \ubc94\uc8c4 \uae30\ub85d, \ucd9c\uc785\uad6d\uad00\ub9ac\ubc95 4\ud68c \uc774\uc0c1 \uc704\ubc18 \ub4f1\uc758 \uae30\ub85d\uc774 \uc788\ub294 \uacbd\uc6b0 \uc2e0\uccad\uc774 \uc81c\ud55c\ub420 \uc218 \uc788\uc2b5\ub2c8\ub2e4. \uc2e0\uccad \uc804 \ubc18\ub4dc\uc2dc \ud655\uc778\ud574\uc57c \ud569\ub2c8\ub2e4.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"bg-white p-6 rounded-lg shadow-md flex items-start\">\r\n <div class=\"text-blue-500 text-2xl mr-4\">\ud83d\udca1<\/div>\r\n <div>\r\n <h3 class=\"font-bold text-lg mb-2\">\uc9c0\uc5ed\ud2b9\ud654\ud615 \ube44\uc790(E-7-4R) \ud65c\uc6a9<\/h3>\r\n <p class=\"text-gray-600\">\uc815\ubd80\uac00 \uc9c0\uc815\ud55c \uc778\uad6c\uac10\uc18c\uc9c0\uc5ed(\uc74d\u00b7\uba74 \ub2e8\uc704)\uc5d0\uc11c \uadfc\ubb34\ud558\ub294 \uacbd\uc6b0, \ucd94\uac00 \uac00\uc810 \ubc0f \uc644\ud654\ub41c \uc694\uac74\uc774 \uc801\uc6a9\ub420 \uc218 \uc788\uc2b5\ub2c8\ub2e4. \ubcf8\uc778\uc758 \uadfc\ubb34\uc9c0\uac00 \ud574\ub2f9\ud558\ub294\uc9c0 \ud655\uc778\ud574\ubcf4\uc138\uc694.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n <\/main>\r\n\r\n <footer id=\"contact\" class=\"bg-[#d7e6f4] text-gray-800\">\r\n <div class=\"container mx-auto px-6 py-12\">\r\n <div class=\"text-center\">\r\n <h2 class=\"text-3xl font-bold mb-4\">\uc804\ubb38\uac00\uc758 \ub3c4\uc6c0\uc774 \ud544\uc694\ud558\uc2e0\uac00\uc694?<\/h2>\r\n <p class=\"text-gray-600 mb-8\">E-7-4 \ube44\uc790 \ubcc0\uacbd, \ubcf5\uc7a1\ud558\uace0 \uc5b4\ub835\uac8c \ub290\uaef4\uc9c0\uc2dc\ub098\uc694? \uc9c0\uae08 \ubc14\ub85c \ube44\uc790\uc7a1\ucf54\ub9ac\uc544\uc640 \uc0c1\ub2f4\ud558\uc138\uc694.<\/p>\r\n <a href=\"mailto:jirunpeople@naver.com\" class=\"bg-blue-600 text-white px-8 py-3 rounded-full font-bold hover:bg-blue-700 transition text-lg\">\uc774\uba54\uc77c\ub85c \uc0c1\ub2f4 \uc608\uc57d\ud558\uae30<\/a>\r\n <\/div>\r\n <div class=\"mt-12 pt-8 border-t border-gray-400 grid md:grid-cols-3 gap-8 text-center md:text-left\">\r\n <div class=\"md:col-span-1\">\r\n <h3 class=\"font-bold text-lg mb-2\">\ube44\uc790\uc7a1\ucf54\ub9ac\uc544\ud589\uc815\uc0ac\uc0ac\ubb34\uc18c<\/h3>\r\n <p class=\"text-gray-600\">VisaJobKorea Administrative Attorney<\/p>\r\n <\/div>\r\n <div class=\"md:col-span-2 grid grid-cols-1 sm:grid-cols-2 gap-8\">\r\n <div>\r\n <h4 class=\"font-semibold text-gray-800\">\uc8fc\uc18c<\/h4>\r\n <p class=\"text-gray-600\">\uacbd\uae30\ub3c4 \uace0\uc591\uc2dc \uc77c\uc0b0\ub3d9\uad6c \uc7a5\ud56d\ub3d9 895-1 \uc6b0\uc2e0\ud504\ub77c\uc790 505-2\ud638<\/p>\r\n <\/div>\r\n <div>\r\n <h4 class=\"font-semibold text-gray-800\">\uc5f0\ub77d\ucc98<\/h4>\r\n <p class=\"text-gray-600\">\uc804\ud654: 010-6584-0070<\/p>\r\n <p class=\"text-gray-600\">\ud329\uc2a4: 031-624-2738<\/p>\r\n <p class=\"text-gray-600\">\uba54\uc77c: jirunpeople@naver.com<\/p>\r\n <p class=\"text-gray-600\">\ud648\ud398\uc774\uc9c0: www.jbgmna.com<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"mt-8 text-center text-gray-600 text-sm\">\r\n <p>© 2025 \ube44\uc790\uc7a1\ucf54\ub9ac\uc544\ud589\uc815\uc0ac\uc0ac\ubb34\uc18c. All Rights Reserved.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/footer>\r\n\r\n <script>\r\n document.addEventListener('DOMContentLoaded', function () {\r\n const mobileMenuButton = document.getElementById('mobile-menu-button');\r\n const mobileMenu = document.getElementById('mobile-menu');\r\n\r\n mobileMenuButton.addEventListener('click', () => {\r\n mobileMenu.classList.toggle('hidden');\r\n });\r\n \r\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\r\n anchor.addEventListener('click', function (e) {\r\n e.preventDefault();\r\n mobileMenu.classList.add('hidden');\r\n document.querySelector(this.getAttribute('href')).scrollIntoView({\r\n behavior: 'smooth'\r\n });\r\n });\r\n });\r\n\r\n const form = document.getElementById('point-calculator-form');\r\n const totalScoreEl = document.getElementById('total-score');\r\n const resultMessageEl = document.getElementById('result-message');\r\n const ctx = document.getElementById('pointChart').getContext('2d');\r\n \r\n const chartData = {\r\n labels: ['\ub098\uc758 \uc608\uc0c1 \uc810\uc218'],\r\n datasets: [{\r\n label: '\uc810\uc218',\r\n data: [0],\r\n backgroundColor: ['#3b82f6'],\r\n borderColor: ['#1d4ed8'],\r\n borderWidth: 1,\r\n barThickness: 50,\r\n }]\r\n };\r\n\r\n const pointChart = new Chart(ctx, {\r\n type: 'bar',\r\n data: chartData,\r\n options: {\r\n indexAxis: 'y',\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n plugins: {\r\n legend: {\r\n display: false\r\n },\r\n tooltip: {\r\n enabled: false\r\n },\r\n annotation: {\r\n annotations: {\r\n line1: {\r\n type: 'line',\r\n xMin: 200,\r\n xMax: 200,\r\n borderColor: 'rgb(239, 68, 68)',\r\n borderWidth: 2,\r\n borderDash: [6, 6],\r\n label: {\r\n content: '\ud569\uaca9 \uae30\uc900 (200\uc810)',\r\n enabled: true,\r\n position: 'end',\r\n backgroundColor: 'rgba(239, 68, 68, 0.8)',\r\n font: {\r\n weight: 'bold'\r\n }\r\n }\r\n }\r\n }\r\n }\r\n },\r\n scales: {\r\n x: {\r\n beginAtZero: true,\r\n max: 300,\r\n title: {\r\n display: true,\r\n text: '\uc810\uc218 (Points)'\r\n }\r\n },\r\n y: {\r\n grid: {\r\n display: false\r\n }\r\n }\r\n }\r\n }\r\n });\r\n\r\n function calculateScore() {\r\n const income = parseInt(document.getElementById('income').value) || 0;\r\n const korean = parseInt(document.getElementById('korean').value) || 0;\r\n const age = parseInt(document.getElementById('age').value) || 0;\r\n const experience = parseInt(document.getElementById('experience').value) || 0;\r\n \r\n const baseScore = 50; \/\/ \uae30\ubcf8 \uc810\uc218(\ud559\ub825, \uacbd\ub825 \ub4f1)\r\n const totalScore = baseScore + income + korean + age + experience;\r\n \r\n totalScoreEl.textContent = totalScore;\r\n pointChart.data.datasets[0].data[0] = totalScore;\r\n \r\n if (totalScore >= 200) {\r\n resultMessageEl.textContent = \"\ud569\uaca9 \uae30\uc900\uc744 \ub118\uc5c8\uc2b5\ub2c8\ub2e4! \uc804\ubb38\uac00\uc640 \uc0c1\ub2f4\uc744 \uc2dc\uc791\ud574\ubcf4\uc138\uc694.\";\r\n resultMessageEl.classList.remove('text-red-500');\r\n resultMessageEl.classList.add('text-green-600');\r\n } else if (totalScore > 0) {\r\n resultMessageEl.textContent = `\ud569\uaca9\uae4c\uc9c0 ${200 - totalScore}\uc810\uc774 \ubd80\uc871\ud569\ub2c8\ub2e4. \uac00\uc810 \ud56d\ubaa9\uc744 \ud655\uc778\ud574\ubcf4\uc138\uc694.`;\r\n resultMessageEl.classList.remove('text-green-600');\r\n resultMessageEl.classList.add('text-red-500');\r\n } else {\r\n resultMessageEl.textContent = \"\";\r\n }\r\n\r\n pointChart.update();\r\n }\r\n\r\n form.addEventListener('change', calculateScore);\r\n\r\n const stepsContainer = document.getElementById('steps-container');\r\n stepsContainer.addEventListener('click', function(e) {\r\n const stepItem = e.target.closest('.step-item');\r\n if (!stepItem) return;\r\n\r\n const currentActive = stepsContainer.querySelector('.step-item.active');\r\n if (currentActive && currentActive !== stepItem) {\r\n currentActive.classList.remove('active');\r\n currentActive.querySelector('.step-details').classList.remove('show');\r\n }\r\n \r\n stepItem.classList.toggle('active');\r\n stepItem.querySelector('.step-details').classList.toggle('show');\r\n });\r\n \r\n \/\/ Activate the first step by default\r\n const firstStep = stepsContainer.querySelector('.step-item[data-step=\"1\"]');\r\n if(firstStep) {\r\n firstStep.classList.add('active');\r\n firstStep.querySelector('.step-details').classList.add('show');\r\n }\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>E-9\uc5d0\uc11c E-7-4 \ube44\uc790\ub85c | \uc219\ub828\uae30\ub2a5\uc778\ub825 \ube44\uc790 \uc804\ud658 \uc548\ub0b4 E-7-4 \ube44\uc790 \uc804\ud658 \uac00\uc774\ub4dc \uc8fc\uc694 \ud61c\ud0dd \uc790\uaca9 \ud655\uc778 \ubcc0\uacbd \uc808\ucc28 \uc0c1\ub2f4 \ubb38\uc758 \uc8fc\uc694 \ud61c\ud0dd \uc790\uaca9 \ud655\uc778 \ubcc0\uacbd \uc808\ucc28 \uc0c1\ub2f4 \ubb38\uc758 \ud55c\uad6d\uc5d0\uc11c\uc758 \uc0c8\ub85c\uc6b4 …<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2904","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/jbgmna.com\/index.php?rest_route=\/wp\/v2\/pages\/2904","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/jbgmna.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/jbgmna.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/jbgmna.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/jbgmna.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2904"}],"version-history":[{"count":4,"href":"http:\/\/jbgmna.com\/index.php?rest_route=\/wp\/v2\/pages\/2904\/revisions"}],"predecessor-version":[{"id":2908,"href":"http:\/\/jbgmna.com\/index.php?rest_route=\/wp\/v2\/pages\/2904\/revisions\/2908"}],"wp:attachment":[{"href":"http:\/\/jbgmna.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2904"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}