{"id":73,"date":"2019-11-29T10:41:24","date_gmt":"2019-11-29T03:41:24","guid":{"rendered":"http:\/\/www.ivecr5.ac.th\/web2020\/?page_id=73"},"modified":"2026-01-08T18:04:34","modified_gmt":"2026-01-08T11:04:34","slug":"%e0%b8%a7%e0%b8%b4%e0%b8%aa%e0%b8%b1%e0%b8%a2%e0%b8%97%e0%b8%b1%e0%b8%a8%e0%b8%99%e0%b9%8c%e0%b9%81%e0%b8%a5%e0%b8%b0%e0%b8%9e%e0%b8%b1%e0%b8%99%e0%b8%98%e0%b8%81%e0%b8%b4%e0%b8%88","status":"publish","type":"page","link":"https:\/\/www.ivecr5.ac.th\/web2020\/%e0%b8%a7%e0%b8%b4%e0%b8%aa%e0%b8%b1%e0%b8%a2%e0%b8%97%e0%b8%b1%e0%b8%a8%e0%b8%99%e0%b9%8c%e0%b9%81%e0%b8%a5%e0%b8%b0%e0%b8%9e%e0%b8%b1%e0%b8%99%e0%b8%98%e0%b8%81%e0%b8%b4%e0%b8%88\/","title":{"rendered":"\u0e27\u0e34\u0e2a\u0e31\u0e22\u0e17\u0e31\u0e28\u0e19\u0e4c\u0e41\u0e25\u0e30\u0e1e\u0e31\u0e19\u0e18\u0e01\u0e34\u0e08"},"content":{"rendered":"<div class=\"vce-row-container\" data-vce-boxed-width=\"true\"><div class=\"vce-row vce-row--col-gap-30 vce-row-content--top\" id=\"el-fc9ac1c4\" data-vce-do-apply=\"all el-fc9ac1c4\"><div class=\"vce-row-content\" data-vce-element-content=\"true\"><div class=\"vce-col vce-col--md-auto vce-col--xs-1 vce-col--xs-last vce-col--xs-first vce-col--sm-last vce-col--sm-first vce-col--md-last vce-col--lg-last vce-col--xl-last vce-col--md-first vce-col--lg-first vce-col--xl-first\" id=\"el-97f304ed\"><div class=\"vce-col-inner\" data-vce-do-apply=\"border margin background  el-97f304ed\"><div class=\"vce-col-content\" data-vce-element-content=\"true\" data-vce-do-apply=\"padding el-97f304ed\"><div class=\"vce-raw-html\"><div class=\"vce-raw-html-wrapper\" id=\"el-4813c164\" data-vce-do-apply=\"all el-4813c164\"><span class=\"vcv-ui-content-editable-helper-loader vcv-ui-wp-spinner\"><\/span><!-- \n    SECTION: Dependencies \n    \u0e2a\u0e48\u0e27\u0e19\u0e19\u0e35\u0e49\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e17\u0e33\u0e07\u0e32\u0e19\u0e02\u0e2d\u0e07 React \u0e41\u0e25\u0e30 Tailwind \u0e43\u0e19\u0e42\u0e2b\u0e21\u0e14 Standalone\n-->\n<script crossorigin=\"\" src=\"https:\/\/unpkg.com\/react@18\/umd\/react.development.js\"><\/script>\n<script crossorigin=\"\" src=\"https:\/\/unpkg.com\/react-dom@18\/umd\/react-dom.development.js\"><\/script>\n<script src=\"https:\/\/unpkg.com\/@babel\/standalone\/babel.min.js\"><\/script>\n<script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n\n<!-- \n    SECTION: Fonts\n    \u0e42\u0e2b\u0e25\u0e14 Font Kanit \u0e42\u0e14\u0e22\u0e40\u0e09\u0e1e\u0e32\u0e30\n-->\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin=\"\">\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@200;300;400;500;600;700&amp;display=swap\" rel=\"stylesheet\">\n\n<!-- \n    SECTION: Custom Styles\n    \u0e01\u0e33\u0e2b\u0e19\u0e14 Font Kanit \u0e41\u0e25\u0e30 Animation\n-->\n<style>\n    \/* \u0e1a\u0e31\u0e07\u0e04\u0e31\u0e1a\u0e43\u0e0a\u0e49 Font Kanit \u0e01\u0e31\u0e1a\u0e17\u0e38\u0e01 element \u0e20\u0e32\u0e22\u0e43\u0e19 vocational-root \u0e1e\u0e23\u0e49\u0e2d\u0e21 !important \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e01\u0e31\u0e19 Theme \u0e17\u0e31\u0e1a *\/\n    #vocational-root, \n    #vocational-root * { \n        font-family: 'Kanit', sans-serif !important; \n    }\n    \n    \/* Animation Keyframes *\/\n    @keyframes fadeInUp {\n        from { opacity: 0; transform: translateY(20px); }\n        to { opacity: 1; transform: translateY(0); }\n    }\n    \n    .animate-fade-in {\n        animation: fadeInUp 0.6s ease-out forwards;\n        opacity: 0; \/* \u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e0b\u0e48\u0e2d\u0e19\u0e44\u0e27\u0e49\u0e01\u0e48\u0e2d\u0e19 *\/\n    }\n    \n    .delay-100 { animation-delay: 0.1s; }\n    .delay-200 { animation-delay: 0.2s; }\n    .delay-300 { animation-delay: 0.3s; }\n\n    \/* New Animations for Header *\/\n    @keyframes blob {\n        0% { transform: translate(0px, 0px) scale(1); }\n        33% { transform: translate(30px, -50px) scale(1.1); }\n        66% { transform: translate(-20px, 20px) scale(0.9); }\n        100% { transform: translate(0px, 0px) scale(1); }\n    }\n    .animate-blob {\n        animation: blob 7s infinite;\n    }\n    .animation-delay-2000 {\n        animation-delay: 2s;\n    }\n    \n    @keyframes shine {\n        to { background-position: 200% center; }\n    }\n    .animate-shine {\n        background-size: 200% auto;\n        animation: shine 3s linear infinite;\n    }\n\n    @keyframes float {\n        0%, 100% { transform: translateY(0); }\n        50% { transform: translateY(-10px); }\n    }\n    .animate-float {\n        animation: float 6s ease-in-out infinite;\n    }\n\n    \/* Custom Scrollbar *\/\n    .custom-scrollbar::-webkit-scrollbar {\n        width: 8px;\n    }\n    .custom-scrollbar::-webkit-scrollbar-track {\n        background: #f1f1f1; \n    }\n    .custom-scrollbar::-webkit-scrollbar-thumb {\n        background: #cbd5e1; \n        border-radius: 4px;\n    }\n    .custom-scrollbar::-webkit-scrollbar-thumb:hover {\n        background: #94a3b8; \n    }\n<\/style>\n\n<!-- \n    SECTION: Main Container \n-->\n<div id=\"vocational-root\" class=\"bg-slate-50 min-h-screen p-4 md:p-8\">\n    <!-- React \u0e08\u0e30 Render \u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e25\u0e07\u0e43\u0e19\u0e19\u0e35\u0e49 -->\n<\/div>\n\n<!-- \n    SECTION: React Application\n-->\n<script type=\"text\/babel\">\n    const { useState, useEffect } = React;\n\n    const Icon = ({ name, size = 24, className }) => {\n        useEffect(() => {\n            lucide.createIcons();\n        }, [name]);\n        return <i data-lucide={name} className={className} style={{ width: size, height: size }}><\/i>;\n    };\n\n    const InfoCard = ({ title, icon, children, className = \"\" }) => (\n        <div className={`bg-white rounded-2xl p-6 shadow-sm border border-slate-100 hover:shadow-md transition-all duration-300 ${className}`}>\n            <div className=\"flex items-center gap-3 mb-4\">\n                <div className=\"p-2 bg-blue-50 text-blue-600 rounded-lg shrink-0\">\n                    <Icon name={icon} size={24} \/>\n                <\/div>\n                <h3 className=\"text-xl font-bold text-slate-800\">{title}<\/h3>\n            <\/div>\n            <div className=\"text-slate-600 leading-relaxed font-light\">\n                {children}\n            <\/div>\n        <\/div>\n    );\n\n    const ListSection = ({ items, title, icon }) => (\n        <div className=\"bg-white rounded-2xl p-6 md:p-8 shadow-sm border border-slate-100 h-full\">\n            <div className=\"flex items-center gap-3 mb-6 pb-4 border-b border-slate-50\">\n                <div className=\"p-2 bg-orange-50 text-orange-600 rounded-lg shrink-0\">\n                    <Icon name={icon} size={24} \/>\n                <\/div>\n                <h3 className=\"text-xl font-bold text-slate-800\">{title}<\/h3>\n            <\/div>\n            <ul className=\"space-y-4\">\n                {items.map((item, idx) => (\n                    <li key={idx} className=\"flex items-start gap-3 text-slate-600 font-light hover:text-slate-900 transition-colors\">\n                        <span className=\"flex-shrink-0 w-6 h-6 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center text-xs font-bold mt-0.5\">\n                            {idx + 1}\n                        <\/span>\n                        <span className=\"leading-relaxed\">{item}<\/span>\n                    <\/li>\n                ))}\n            <\/ul>\n        <\/div>\n    );\n\n    const App = () => {\n        \/\/ \u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e08\u0e32\u0e01\u0e44\u0e1f\u0e25\u0e4c PDF\n        const missionItems = [\n            \"\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e2b\u0e25\u0e31\u0e01\u0e2a\u0e39\u0e15\u0e23\u0e41\u0e25\u0e30\u0e01\u0e32\u0e23\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e43\u0e2b\u0e49\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e25\u0e34\u0e28\u0e17\u0e32\u0e07\u0e27\u0e34\u0e0a\u0e32\u0e01\u0e32\u0e23 \u0e2a\u0e2d\u0e14\u0e04\u0e25\u0e49\u0e2d\u0e07\u0e01\u0e31\u0e1a\u0e21\u0e32\u0e15\u0e23\u0e10\u0e32\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e1e \u0e15\u0e32\u0e21\u0e01\u0e23\u0e2d\u0e1a\u0e04\u0e38\u0e13\u0e27\u0e38\u0e12\u0e34\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e28\u0e36\u0e01\u0e29\u0e32\",\n            \"\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e04\u0e23\u0e39 \u0e2d\u0e32\u0e08\u0e32\u0e23\u0e22\u0e4c\u0e41\u0e25\u0e30\u0e1a\u0e38\u0e04\u0e25\u0e32\u0e01\u0e23\u0e17\u0e32\u0e07\u0e01\u0e32\u0e23\u0e28\u0e36\u0e01\u0e29\u0e32\u0e43\u0e2b\u0e49\u0e21\u0e35\u0e2a\u0e21\u0e23\u0e23\u0e16\u0e19\u0e30\u0e14\u0e49\u0e32\u0e19\u0e01\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e40\u0e23\u0e35\u0e22\u0e19\u0e23\u0e39\u0e49 \u0e17\u0e31\u0e01\u0e29\u0e30\u0e14\u0e49\u0e32\u0e19\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e40\u0e17\u0e04\u0e42\u0e19\u0e42\u0e25\u0e22\u0e35\u0e17\u0e35\u0e48\u0e17\u0e31\u0e19\u0e2a\u0e21\u0e31\u0e22 \u0e01\u0e32\u0e23\u0e27\u0e34\u0e08\u0e31\u0e22 \u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e19\u0e27\u0e31\u0e15\u0e01\u0e23\u0e23\u0e21 \u0e41\u0e25\u0e30\u0e1a\u0e23\u0e34\u0e01\u0e32\u0e23\u0e27\u0e34\u0e0a\u0e32\u0e01\u0e32\u0e23 \u0e27\u0e34\u0e0a\u0e32\u0e0a\u0e35\u0e1e\u0e2a\u0e39\u0e48\u0e04\u0e27\u0e32\u0e21\u0e01\u0e49\u0e32\u0e27\u0e2b\u0e19\u0e49\u0e32\u0e43\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e1e\",\n            \"\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e1c\u0e39\u0e49\u0e40\u0e23\u0e35\u0e22\u0e19\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e35\u0e22\u0e19\u0e14\u0e35 \u0e40\u0e23\u0e35\u0e22\u0e19\u0e23\u0e39\u0e49\u0e27\u0e34\u0e0a\u0e32\u0e0a\u0e35\u0e1e\u0e17\u0e38\u0e01\u0e17\u0e35\u0e48 \u0e17\u0e38\u0e01\u0e40\u0e27\u0e25\u0e32 \u0e2a\u0e48\u0e07\u0e40\u0e2a\u0e23\u0e34\u0e21\u0e01\u0e32\u0e23\u0e40\u0e23\u0e35\u0e22\u0e19\u0e2a\u0e2d\u0e07\u0e20\u0e32\u0e29\u0e32\u0e42\u0e14\u0e22\u0e43\u0e0a\u0e49 AI \u0e2a\u0e19\u0e31\u0e1a\u0e2a\u0e19\u0e38\u0e19\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e19\u0e27\u0e31\u0e15\u0e01\u0e23\u0e23\u0e21 \u0e01\u0e32\u0e23\u0e27\u0e34\u0e08\u0e31\u0e22 \u0e41\u0e25\u0e30\u0e2a\u0e34\u0e48\u0e07\u0e1b\u0e23\u0e30\u0e14\u0e34\u0e29\u0e10\u0e4c \u0e22\u0e01\u0e23\u0e30\u0e14\u0e31\u0e1a\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e28\u0e36\u0e01\u0e29\u0e32\u0e04\u0e38\u0e13\u0e20\u0e32\u0e1e\u0e2a\u0e39\u0e07 \u0e15\u0e2d\u0e1a\u0e2a\u0e19\u0e2d\u0e07\u0e41\u0e23\u0e07\u0e07\u0e32\u0e19\u0e2a\u0e21\u0e23\u0e23\u0e16\u0e19\u0e30\u0e2a\u0e39\u0e07 \u0e16\u0e48\u0e32\u0e22\u0e17\u0e2d\u0e14\u0e1a\u0e23\u0e34\u0e01\u0e32\u0e23\u0e27\u0e34\u0e0a\u0e32\u0e0a\u0e35\u0e1e\u0e2a\u0e39\u0e48\u0e0a\u0e38\u0e21\u0e0a\u0e19 \u0e41\u0e25\u0e30\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e23\u0e32\u0e22\u0e44\u0e14\u0e49\u0e23\u0e30\u0e2b\u0e27\u0e48\u0e32\u0e07\u0e40\u0e23\u0e35\u0e22\u0e19\",\n            \"\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e23\u0e30\u0e1a\u0e1a\u0e01\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e28\u0e36\u0e01\u0e29\u0e32\u0e17\u0e35\u0e48\u0e22\u0e37\u0e14\u0e2b\u0e22\u0e38\u0e48\u0e19 \u0e17\u0e31\u0e49\u0e07\u0e43\u0e19\u0e23\u0e30\u0e1a\u0e1a \u0e19\u0e2d\u0e01\u0e23\u0e30\u0e1a\u0e1a \u0e42\u0e14\u0e22\u0e01\u0e32\u0e23\u0e19\u0e33\u0e23\u0e30\u0e1a\u0e1a\u0e14\u0e34\u0e08\u0e34\u0e17\u0e31\u0e25\u0e21\u0e32\u0e43\u0e0a\u0e49\u0e43\u0e19\u0e01\u0e32\u0e23\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e28\u0e36\u0e01\u0e29\u0e32 \u0e41\u0e25\u0e30\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e04\u0e27\u0e32\u0e21\u0e40\u0e02\u0e49\u0e21\u0e41\u0e02\u0e47\u0e07\u0e20\u0e32\u0e04\u0e35\u0e40\u0e04\u0e23\u0e37\u0e2d\u0e02\u0e48\u0e32\u0e22\u0e04\u0e27\u0e32\u0e21\u0e23\u0e48\u0e27\u0e21\u0e21\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e28\u0e36\u0e01\u0e29\u0e32\",\n            \"\u0e2a\u0e48\u0e07\u0e40\u0e2a\u0e23\u0e34\u0e21\u0e20\u0e32\u0e1e\u0e25\u0e31\u0e01\u0e29\u0e13\u0e4c\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e28\u0e36\u0e01\u0e29\u0e32\u0e22\u0e38\u0e04\u0e43\u0e2b\u0e21\u0e48 (\u0e01\u0e49\u0e32\u0e27\u0e14\u0e35)\"\n        ];\n\n        const goalItems = [\n            \"\u0e2b\u0e25\u0e31\u0e01\u0e2a\u0e39\u0e15\u0e23\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e2d\u0e14\u0e04\u0e25\u0e49\u0e2d\u0e07\u0e01\u0e31\u0e1a\u0e21\u0e32\u0e15\u0e23\u0e10\u0e32\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e1e \u0e15\u0e32\u0e21\u0e01\u0e23\u0e2d\u0e1a\u0e04\u0e38\u0e13\u0e27\u0e38\u0e12\u0e34\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e28\u0e36\u0e01\u0e29\u0e32\",\n            \"\u0e04\u0e23\u0e39 \u0e2d\u0e32\u0e08\u0e32\u0e23\u0e22\u0e4c\u0e41\u0e25\u0e30\u0e1a\u0e38\u0e04\u0e25\u0e32\u0e01\u0e23\u0e17\u0e32\u0e07\u0e01\u0e32\u0e23\u0e28\u0e36\u0e01\u0e29\u0e32\u0e21\u0e35\u0e2a\u0e21\u0e23\u0e23\u0e16\u0e19\u0e30\u0e43\u0e19\u0e14\u0e49\u0e32\u0e19\u0e01\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e40\u0e23\u0e35\u0e22\u0e19\u0e01\u0e32\u0e23\u0e2a\u0e2d\u0e19 \u0e42\u0e14\u0e22\u0e43\u0e0a\u0e49\u0e40\u0e17\u0e04\u0e42\u0e19\u0e42\u0e25\u0e22\u0e35\u0e17\u0e35\u0e48\u0e17\u0e31\u0e19\u0e2a\u0e21\u0e31\u0e22 \u0e21\u0e35\u0e1c\u0e25\u0e07\u0e32\u0e19\u0e27\u0e34\u0e08\u0e31\u0e22\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e19\u0e27\u0e31\u0e15\u0e01\u0e23\u0e23\u0e21 \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e01\u0e49\u0e32\u0e27\u0e2b\u0e19\u0e49\u0e32\u0e43\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e1e \u0e01\u0e32\u0e23\u0e1a\u0e23\u0e34\u0e01\u0e32\u0e23\u0e27\u0e34\u0e0a\u0e32\u0e01\u0e32\u0e23\",\n            \"\u0e1c\u0e39\u0e49\u0e40\u0e23\u0e35\u0e22\u0e19\u0e21\u0e35\u0e17\u0e31\u0e01\u0e29\u0e30\u0e27\u0e34\u0e0a\u0e32\u0e0a\u0e35\u0e1e \u0e2a\u0e48\u0e07\u0e40\u0e2a\u0e23\u0e34\u0e21\u0e01\u0e32\u0e23\u0e40\u0e23\u0e35\u0e22\u0e19\u0e23\u0e39\u0e49\u0e2a\u0e2d\u0e07\u0e20\u0e32\u0e29\u0e32 \u0e42\u0e14\u0e22\u0e43\u0e0a\u0e49 AI \u0e2a\u0e19\u0e31\u0e1a\u0e2a\u0e19\u0e38\u0e19\u0e01\u0e32\u0e23\u0e21\u0e35\u0e23\u0e32\u0e22\u0e44\u0e14\u0e49\u0e23\u0e30\u0e2b\u0e27\u0e48\u0e32\u0e07\u0e40\u0e23\u0e35\u0e22\u0e19 \u0e22\u0e01\u0e23\u0e30\u0e14\u0e31\u0e1a\u0e04\u0e38\u0e13\u0e20\u0e32\u0e1e\u0e01\u0e32\u0e23\u0e28\u0e36\u0e01\u0e29\u0e32\u0e43\u0e2b\u0e49\u0e2a\u0e2d\u0e14\u0e04\u0e25\u0e49\u0e2d\u0e07\u0e01\u0e31\u0e1a\u0e04\u0e27\u0e32\u0e21\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e02\u0e2d\u0e07\u0e41\u0e23\u0e07\u0e07\u0e32\u0e19\u0e17\u0e35\u0e48\u0e21\u0e35\u0e2a\u0e21\u0e23\u0e23\u0e16\u0e19\u0e30\u0e2a\u0e39\u0e07 \u0e1e\u0e23\u0e49\u0e2d\u0e21\u0e17\u0e31\u0e49\u0e07\u0e16\u0e48\u0e32\u0e22\u0e17\u0e2d\u0e14\u0e41\u0e25\u0e30\u0e1a\u0e23\u0e34\u0e01\u0e32\u0e23\u0e27\u0e34\u0e0a\u0e32\u0e0a\u0e35\u0e1e\u0e2a\u0e39\u0e48\u0e0a\u0e38\u0e21\u0e0a\u0e19\",\n            \"\u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19\u0e2f \u0e21\u0e35\u0e23\u0e30\u0e1a\u0e1a\u0e01\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e28\u0e36\u0e01\u0e29\u0e32\u0e17\u0e35\u0e48\u0e22\u0e37\u0e14\u0e2b\u0e22\u0e38\u0e48\u0e19 \u0e42\u0e14\u0e22\u0e19\u0e33\u0e23\u0e30\u0e1a\u0e1a\u0e14\u0e34\u0e08\u0e34\u0e17\u0e31\u0e25\u0e21\u0e32\u0e43\u0e0a\u0e49\u0e43\u0e19\u0e01\u0e32\u0e23\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23 \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e22\u0e01\u0e23\u0e30\u0e14\u0e31\u0e1a\u0e04\u0e38\u0e13\u0e20\u0e32\u0e1e\u0e01\u0e32\u0e23\u0e28\u0e36\u0e01\u0e29\u0e32 \u0e41\u0e25\u0e30\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e04\u0e27\u0e32\u0e21\u0e40\u0e02\u0e49\u0e21\u0e41\u0e02\u0e47\u0e07\u0e43\u0e2b\u0e49\u0e01\u0e31\u0e1a\u0e40\u0e04\u0e23\u0e37\u0e2d\u0e02\u0e48\u0e32\u0e22\u0e04\u0e27\u0e32\u0e21\u0e23\u0e48\u0e27\u0e21\u0e21\u0e37\u0e2d\u0e14\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e28\u0e36\u0e01\u0e29\u0e32\",\n            \"\u0e1c\u0e39\u0e49\u0e40\u0e23\u0e35\u0e22\u0e19 \u0e04\u0e23\u0e39 \u0e2d\u0e32\u0e08\u0e32\u0e23\u0e22\u0e4c \u0e1a\u0e38\u0e04\u0e25\u0e32\u0e01\u0e23\u0e17\u0e32\u0e07\u0e01\u0e32\u0e23\u0e28\u0e36\u0e01\u0e29\u0e32 \u0e21\u0e35\u0e04\u0e38\u0e13\u0e18\u0e23\u0e23\u0e21 \u0e08\u0e23\u0e34\u0e22\u0e18\u0e23\u0e23\u0e21 \u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e20\u0e32\u0e04\u0e20\u0e39\u0e21\u0e34\u0e43\u0e08\u0e43\u0e19\u0e04\u0e27\u0e32\u0e21\u0e40\u0e1b\u0e47\u0e19\u0e44\u0e17\u0e22 \u0e41\u0e25\u0e30\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e20\u0e32\u0e1e\u0e25\u0e31\u0e01\u0e29\u0e13\u0e4c\u0e17\u0e35\u0e48\u0e14\u0e35 (\u0e01\u0e49\u0e32\u0e27\u0e14\u0e35) \u0e1e\u0e31\u0e12\u0e19\u0e32\u0e01\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e2a\u0e34\u0e48\u0e07\u0e41\u0e27\u0e14\u0e25\u0e49\u0e2d\u0e21 \u0e41\u0e25\u0e30\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e04\u0e27\u0e32\u0e21\u0e1b\u0e25\u0e2d\u0e14\u0e20\u0e31\u0e22\u0e43\u0e19\u0e2a\u0e16\u0e32\u0e19\u0e28\u0e36\u0e01\u0e29\u0e32\"\n        ];\n\n        return (\n            <div className=\"max-w-6xl mx-auto\">\n                \n                {\/* HEADER SECTION (\u0e04\u0e07\u0e44\u0e27\u0e49\u0e15\u0e32\u0e21\u0e40\u0e14\u0e34\u0e21)\n                *\/}\n                <div className=\"relative bg-gradient-to-br from-indigo-900 via-blue-800 to-sky-900 rounded-3xl shadow-2xl overflow-hidden mb-12 p-8 md:p-14 animate-fade-in\">\n                    <div className=\"absolute top-0 right-0 -mr-20 -mt-20 w-80 h-80 bg-blue-500 rounded-full mix-blend-multiply filter blur-3xl opacity-20 animate-blob\"><\/div>\n                    <div className=\"absolute bottom-0 left-0 -ml-20 -mb-20 w-80 h-80 bg-purple-500 rounded-full mix-blend-multiply filter blur-3xl opacity-20 animate-blob animation-delay-2000\"><\/div>\n                    <div className=\"absolute inset-0 bg-[url('https:\/\/www.transparenttextures.com\/patterns\/cubes.png')] opacity-5\"><\/div>\n\n                    <div className=\"relative z-10 flex flex-col md:flex-row items-center justify-between gap-8 md:gap-12\">\n                        <div className=\"space-y-6 text-center md:text-left max-w-3xl\">\n                            <div className=\"inline-block px-4 py-1.5 rounded-full bg-white\/10 border border-white\/20 text-blue-100 text-sm font-medium backdrop-blur-sm shadow-sm\">\n                                Institute of Vocational Education Central Region 5\n                            <\/div>\n                            \n                            <h1 className=\"text-4xl md:text-5xl lg:text-6xl font-bold tracking-tight text-white leading-tight drop-shadow-md\">\n                                \u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19\u0e01\u0e32\u0e23\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e28\u0e36\u0e01\u0e29\u0e32<br\/>\n                                <span className=\"text-transparent bg-clip-text bg-gradient-to-r from-amber-200 via-yellow-100 to-amber-300 animate-shine drop-shadow-sm\">\n                                    \u0e20\u0e32\u0e04\u0e01\u0e25\u0e32\u0e07 5\n                                <\/span>\n                            <\/h1>\n                            \n                            <p className=\"text-blue-100\/90 text-lg font-light leading-relaxed max-w-2xl mx-auto md:mx-0\">\n                                \u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19\u0e0a\u0e31\u0e49\u0e19\u0e19\u0e33\u0e14\u0e49\u0e32\u0e19\u0e27\u0e34\u0e0a\u0e32\u0e0a\u0e35\u0e1e \u0e40\u0e19\u0e49\u0e19\u0e01\u0e32\u0e23\u0e27\u0e34\u0e08\u0e31\u0e22 \u0e19\u0e27\u0e31\u0e15\u0e01\u0e23\u0e23\u0e21 \u0e1a\u0e23\u0e34\u0e01\u0e32\u0e23\u0e27\u0e34\u0e0a\u0e32\u0e01\u0e32\u0e23\u0e41\u0e25\u0e30\u0e27\u0e34\u0e0a\u0e32\u0e0a\u0e35\u0e1e \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1c\u0e25\u0e34\u0e15\u0e01\u0e33\u0e25\u0e31\u0e07\u0e04\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e28\u0e36\u0e01\u0e29\u0e32\u0e17\u0e35\u0e48\u0e21\u0e35\u0e2a\u0e21\u0e23\u0e23\u0e16\u0e19\u0e30\u0e2a\u0e39\u0e07\n                            <\/p>\n                        <\/div>\n\n                        <div className=\"relative animate-float shrink-0 hidden md:block\">\n                            <div className=\"absolute inset-0 bg-amber-400 blur-2xl opacity-20 rounded-full transform scale-110\"><\/div>\n                            <div className=\"relative bg-gradient-to-b from-white\/10 to-white\/5 backdrop-blur-md border border-white\/20 p-8 rounded-2xl shadow-2xl ring-1 ring-white\/10\">\n                                <Icon name=\"award\" size={80} className=\"text-amber-300 drop-shadow-lg\" \/>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                {\/* CONTENT SECTION (\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e43\u0e2b\u0e21\u0e48\u0e08\u0e32\u0e01 PDF)\n                *\/}\n                <div className=\"space-y-8 animate-fade-in delay-100\">\n                    \n                    {\/* Row 1: Vision & Identity *\/}\n                    <div className=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n                        <div className=\"bg-gradient-to-r from-blue-600 to-blue-800 rounded-2xl p-8 text-white shadow-lg relative overflow-hidden group\">\n                            <div className=\"absolute top-0 right-0 p-4 opacity-10 group-hover:scale-110 transition-transform duration-500\">\n                                <Icon name=\"telescope\" size={120} \/>\n                            <\/div>\n                            <div className=\"relative z-10\">\n                                <div className=\"flex items-center gap-3 mb-4 text-blue-200\">\n                                    <Icon name=\"eye\" size={24} \/>\n                                    <h3 className=\"font-bold text-lg uppercase tracking-wider\">\u0e27\u0e34\u0e2a\u0e31\u0e22\u0e17\u0e31\u0e28\u0e19\u0e4c (Vision)<\/h3>\n                                <\/div>\n                                <p className=\"text-xl md:text-2xl font-semibold leading-relaxed\">\n                                    \"\u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19\u0e0a\u0e31\u0e49\u0e19\u0e19\u0e33\u0e14\u0e49\u0e32\u0e19\u0e27\u0e34\u0e0a\u0e32\u0e0a\u0e35\u0e1e \u0e40\u0e19\u0e49\u0e19\u0e01\u0e32\u0e23\u0e27\u0e34\u0e08\u0e31\u0e22 \u0e19\u0e27\u0e31\u0e15\u0e01\u0e23\u0e23\u0e21 \u0e1a\u0e23\u0e34\u0e01\u0e32\u0e23\u0e27\u0e34\u0e0a\u0e32\u0e01\u0e32\u0e23\u0e41\u0e25\u0e30\u0e27\u0e34\u0e0a\u0e32\u0e0a\u0e35\u0e1e \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1c\u0e25\u0e34\u0e15\u0e01\u0e33\u0e25\u0e31\u0e07\u0e04\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e28\u0e36\u0e01\u0e29\u0e32\u0e17\u0e35\u0e48\u0e21\u0e35\u0e2a\u0e21\u0e23\u0e23\u0e16\u0e19\u0e30\u0e2a\u0e39\u0e07\"\n                                <\/p>\n                            <\/div>\n                        <\/div>\n\n                        <div className=\"bg-white rounded-2xl p-8 shadow-sm border border-slate-100 relative overflow-hidden group\">\n                             <div className=\"absolute top-0 right-0 p-4 text-slate-100 group-hover:text-orange-50 transition-colors duration-500\">\n                                <Icon name=\"fingerprint\" size={120} \/>\n                            <\/div>\n                            <div className=\"relative z-10\">\n                                <div className=\"flex items-center gap-3 mb-4 text-orange-500\">\n                                    <Icon name=\"badge-check\" size={24} \/>\n                                    <h3 className=\"font-bold text-lg uppercase tracking-wider\">\u0e2d\u0e31\u0e15\u0e25\u0e31\u0e01\u0e29\u0e13\u0e4c (Identity)<\/h3>\n                                <\/div>\n                                <p className=\"text-xl md:text-2xl font-semibold text-slate-800 leading-relaxed\">\n                                    \"\u0e19\u0e31\u0e01\u0e1b\u0e0f\u0e34\u0e1a\u0e31\u0e15\u0e34\u0e01\u0e32\u0e23\u0e14\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e27\u0e30\u0e21\u0e32\u0e15\u0e23\u0e10\u0e32\u0e19\u0e2a\u0e32\u0e01\u0e25\"\n                                <\/p>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    {\/* Row 2: Mission & Goals *\/}\n                    <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-6\">\n                        <ListSection title=\"\u0e1e\u0e31\u0e19\u0e18\u0e01\u0e34\u0e08 (Mission)\" icon=\"rocket\" items={missionItems} \/>\n                        <ListSection title=\"\u0e40\u0e1b\u0e49\u0e32\u0e1b\u0e23\u0e30\u0e2a\u0e07\u0e04\u0e4c (Goals)\" icon=\"target\" items={goalItems} \/>\n                    <\/div>\n\n                    {\/* Row 3: Symbols & Tree *\/}\n                    <div className=\"bg-white rounded-2xl p-8 shadow-sm border border-slate-100\">\n                        <div className=\"flex items-center gap-3 mb-8\">\n                            <div className=\"p-2 bg-purple-50 text-purple-600 rounded-lg shrink-0\">\n                                <Icon name=\"palette\" size={24} \/>\n                            <\/div>\n                            <h2 className=\"text-2xl font-bold text-slate-800\">\u0e2a\u0e31\u0e0d\u0e25\u0e31\u0e01\u0e29\u0e13\u0e4c\u0e1b\u0e23\u0e30\u0e08\u0e33\u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19<\/h2>\n                        <\/div>\n\n                        <div className=\"grid grid-cols-1 md:grid-cols-2 gap-8 lg:gap-12\">\n                            {\/* Color & Flag *\/}\n                            <div className=\"space-y-6\">\n                                <div>\n                                    <h4 className=\"font-bold text-lg text-slate-700 mb-3 flex items-center gap-2\">\n                                        <span className=\"w-4 h-4 rounded-full bg-gradient-to-r from-blue-400 to-blue-600\"><\/span>\n                                        \u0e2a\u0e35\u0e1b\u0e23\u0e30\u0e08\u0e33\u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19 : \u0e2a\u0e35\u0e1f\u0e49\u0e32 - \u0e02\u0e32\u0e27\n                                    <\/h4>\n                                    <ul className=\"space-y-3 pl-6 border-l-2 border-slate-100\">\n                                        <li className=\"text-slate-600 font-light\">\n                                            <strong className=\"text-blue-500\">\u0e2a\u0e35\u0e1f\u0e49\u0e32:<\/strong> \u0e2b\u0e21\u0e32\u0e22\u0e16\u0e36\u0e07 \u0e04\u0e27\u0e32\u0e21\u0e23\u0e48\u0e27\u0e21\u0e21\u0e37\u0e2d\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2a\u0e23\u0e23\u0e04\u0e4c \u0e04\u0e27\u0e32\u0e21\u0e08\u0e23\u0e34\u0e07\u0e43\u0e08\u0e17\u0e35\u0e48\u0e08\u0e30\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e40\u0e17\u0e04\u0e42\u0e19\u0e42\u0e25\u0e22\u0e35 \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e21\u0e31\u0e48\u0e19\u0e04\u0e07 \u0e21\u0e31\u0e48\u0e07\u0e04\u0e31\u0e48\u0e07 \u0e22\u0e31\u0e48\u0e07\u0e22\u0e37\u0e19 (\u0e2a\u0e2d\u0e14\u0e04\u0e25\u0e49\u0e2d\u0e07\u0e01\u0e31\u0e1a\u0e2a\u0e35\u0e19\u0e49\u0e33\u0e17\u0e30\u0e40\u0e25\u0e02\u0e2d\u0e07\u0e17\u0e31\u0e49\u0e07 4 \u0e08\u0e31\u0e07\u0e2b\u0e27\u0e31\u0e14)\n                                        <\/li>\n                                        <li className=\"text-slate-600 font-light\">\n                                            <strong className=\"text-slate-400\">\u0e2a\u0e35\u0e02\u0e32\u0e27:<\/strong> \u0e2b\u0e21\u0e32\u0e22\u0e16\u0e36\u0e07 \u0e04\u0e27\u0e32\u0e21\u0e0b\u0e37\u0e48\u0e2d\u0e2a\u0e31\u0e15\u0e22\u0e4c \u0e2a\u0e38\u0e08\u0e23\u0e34\u0e15 \u0e40\u0e17\u0e35\u0e48\u0e22\u0e07\u0e18\u0e23\u0e23\u0e21 \u0e41\u0e25\u0e30\u0e40\u0e1b\u0e47\u0e19\u0e08\u0e38\u0e14\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e02\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e04\u0e19\n                                        <\/li>\n                                    <\/ul>\n                                <\/div>\n                                <div>\n                                    <h4 className=\"font-bold text-lg text-slate-700 mb-4 flex items-center gap-2\">\n                                        <Icon name=\"flag\" size={18} className=\"text-slate-400\" \/>\n                                        \u0e18\u0e07\u0e1b\u0e23\u0e30\u0e08\u0e33\u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19\n                                    <\/h4>\n                                    \n                                    {\/* Flag Image Update *\/}\n                                    <div className=\"mb-4 rounded-xl overflow-hidden shadow-md border border-slate-100 group\">\n                                        <img decoding=\"async\" \n                                            src=\"https:\/\/www.ivecr5.ac.th\/web2020\/wp-content\/uploads\/2026\/01\/Screenshot-2026-01-08-175537.png\" \n                                            alt=\"\u0e18\u0e07\u0e1b\u0e23\u0e30\u0e08\u0e33\u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19\" \n                                            className=\"w-full h-auto object-cover transform group-hover:scale-105 transition-transform duration-500\"\n                                            onError={(e) => {\n                                                e.target.onerror = null;\n                                                e.target.src = \"https:\/\/placehold.co\/600x400\/e2e8f0\/475569?text=Flag+Image+Not+Found\";\n                                            }}\n                                        \/>\n                                    <\/div>\n\n                                    <p className=\"text-slate-600 font-light leading-relaxed pl-6 border-l-2 border-slate-100\">\n                                        \u0e18\u0e07\u0e2a\u0e35\u0e1f\u0e49\u0e32-\u0e02\u0e32\u0e27 \u0e2a\u0e37\u0e48\u0e2d\u0e16\u0e36\u0e07\u0e01\u0e32\u0e23\u0e23\u0e48\u0e27\u0e21\u0e01\u0e31\u0e19\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e41\u0e25\u0e30\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e40\u0e23\u0e35\u0e22\u0e19\u0e01\u0e32\u0e23\u0e2a\u0e2d\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2a\u0e23\u0e23\u0e04\u0e4c \u0e42\u0e14\u0e22\u0e04\u0e27\u0e32\u0e21\u0e23\u0e48\u0e27\u0e21\u0e21\u0e37\u0e2d\u0e02\u0e2d\u0e07\u0e17\u0e38\u0e01\u0e20\u0e32\u0e04\u0e2a\u0e48\u0e27\u0e19\u0e43\u0e19\u0e17\u0e49\u0e2d\u0e07\u0e17\u0e30\u0e40\u0e25\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19 (\u0e2a\u0e35\u0e1f\u0e49\u0e32) \u0e20\u0e32\u0e22\u0e43\u0e15\u0e49\u0e2b\u0e25\u0e31\u0e01\u0e04\u0e38\u0e13\u0e18\u0e23\u0e23\u0e21\u0e41\u0e25\u0e30\u0e18\u0e23\u0e23\u0e21\u0e32\u0e20\u0e34\u0e1a\u0e32\u0e25 (\u0e2a\u0e35\u0e02\u0e32\u0e27\u0e15\u0e23\u0e07\u0e01\u0e25\u0e32\u0e07)\n                                    <\/p>\n                                <\/div>\n                            <\/div>\n\n                            {\/* Tree *\/}\n                            <div className=\"flex flex-col h-full\">\n                                <div className=\"bg-green-50\/50 rounded-xl p-6 border border-green-100 flex-grow\">\n                                    <div className=\"flex items-center gap-3 mb-4 text-green-700\">\n                                        <Icon name=\"trees\" size={24} \/>\n                                        <h3 className=\"font-bold text-lg\">\u0e15\u0e49\u0e19\u0e44\u0e21\u0e49\u0e1b\u0e23\u0e30\u0e08\u0e33\u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19 : \u0e15\u0e49\u0e19\u0e08\u0e34\u0e01\u0e17\u0e30\u0e40\u0e25<\/h3>\n                                    <\/div>\n                                    \n                                    {\/* Tree Image Added *\/}\n                                    <div className=\"mb-4 rounded-lg overflow-hidden shadow-sm border border-green-100 group\">\n                                        <img decoding=\"async\" \n                                            src=\"https:\/\/www.ivecr5.ac.th\/web2020\/wp-content\/uploads\/2026\/01\/43d4317cdf0b5af8299b9be12b5723f91006f109.jpg\" \n                                            alt=\"\u0e15\u0e49\u0e19\u0e08\u0e34\u0e01\u0e17\u0e30\u0e40\u0e25\" \n                                            className=\"w-full h-48 object-cover transform group-hover:scale-105 transition-transform duration-500\"\n                                        \/>\n                                        <div className=\"bg-green-800 text-white text-xs py-1 px-3 text-center\">\n                                            Barringtonia asiatica\n                                        <\/div>\n                                    <\/div>\n\n                                    <div className=\"space-y-4 text-slate-600 font-light text-sm md:text-base leading-relaxed\">\n                                        <p>\n                                            \u0e44\u0e21\u0e49\u0e22\u0e37\u0e19\u0e15\u0e49\u0e19\u0e23\u0e34\u0e21\u0e17\u0e30\u0e40\u0e25\u0e2d\u0e48\u0e32\u0e27\u0e44\u0e17\u0e22 \u0e2a\u0e39\u0e07\u0e1b\u0e23\u0e30\u0e21\u0e32\u0e13 10 \u0e40\u0e21\u0e15\u0e23 \u0e41\u0e1c\u0e48\u0e01\u0e34\u0e48\u0e07\u0e01\u0e49\u0e32\u0e19\u0e2a\u0e32\u0e02\u0e32 \u0e40\u0e1b\u0e25\u0e37\u0e2d\u0e01\u0e2a\u0e35\u0e19\u0e49\u0e33\u0e15\u0e32\u0e25\/\u0e40\u0e17\u0e32 \u0e43\u0e1a\u0e40\u0e02\u0e35\u0e22\u0e27\u0e40\u0e02\u0e49\u0e21\u0e21\u0e31\u0e19\u0e27\u0e32\u0e27 \u0e14\u0e2d\u0e01\u0e2a\u0e35\u0e02\u0e32\u0e27\u0e40\u0e01\u0e2a\u0e23\u0e0a\u0e21\u0e1e\u0e39 \u0e1c\u0e25\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48\n                                        <\/p>\n                                        <div className=\"bg-white p-4 rounded-lg shadow-sm border border-green-100\/50\">\n                                            <p className=\"font-medium text-green-800 mb-2\">\u0e04\u0e27\u0e32\u0e21\u0e2b\u0e21\u0e32\u0e22\u0e2d\u0e31\u0e19\u0e17\u0e23\u0e07\u0e04\u0e38\u0e13\u0e04\u0e48\u0e32:<\/p>\n                                            <ul className=\"space-y-2 list-disc list-inside\">\n                                                <li>\u0e40\u0e1b\u0e47\u0e19\u0e15\u0e49\u0e19\u0e44\u0e21\u0e49\u0e17\u0e35\u0e48\u0e21\u0e35\u0e43\u0e19 4 \u0e08\u0e31\u0e07\u0e2b\u0e27\u0e31\u0e14\u0e02\u0e2d\u0e07\u0e2a\u0e16\u0e32\u0e1a\u0e31\u0e19<\/li>\n                                                <li>\u0e01\u0e34\u0e48\u0e07\u0e01\u0e49\u0e32\u0e19\u0e43\u0e2b\u0e0d\u0e48 \u0e2b\u0e21\u0e32\u0e22\u0e16\u0e36\u0e07 \u0e01\u0e32\u0e23\u0e42\u0e2d\u0e1a\u0e2d\u0e49\u0e2d\u0e21\u0e2d\u0e32\u0e23\u0e35 \u0e14\u0e39\u0e41\u0e25\u0e2a\u0e23\u0e23\u0e1e\u0e2a\u0e34\u0e48\u0e07<\/li>\n                                                <li>\u0e40\u0e01\u0e2a\u0e23\u0e14\u0e2d\u0e01\u0e41\u0e15\u0e01\u0e40\u0e1b\u0e47\u0e19\u0e1d\u0e2d\u0e22 \u0e2b\u0e21\u0e32\u0e22\u0e16\u0e36\u0e07 \u0e04\u0e27\u0e32\u0e21\u0e23\u0e48\u0e27\u0e21\u0e21\u0e37\u0e2d\u0e23\u0e48\u0e27\u0e21\u0e43\u0e08\u0e02\u0e2d\u0e07\u0e17\u0e38\u0e01\u0e20\u0e32\u0e04\u0e2a\u0e48\u0e27\u0e19<\/li>\n                                                <li>\u0e1c\u0e25\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48 \u0e2b\u0e21\u0e32\u0e22\u0e16\u0e36\u0e07 \u0e01\u0e32\u0e23\u0e40\u0e15\u0e34\u0e1a\u0e42\u0e15\u0e40\u0e1b\u0e47\u0e19\u0e23\u0e48\u0e21\u0e40\u0e07\u0e32\u0e43\u0e2b\u0e49\u0e1c\u0e39\u0e49\u0e2d\u0e37\u0e48\u0e19\u0e15\u0e48\u0e2d\u0e44\u0e1b<\/li>\n                                            <\/ul>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n        );\n    };\n\n    const root = ReactDOM.createRoot(document.getElementById('vocational-root'));\n    root.render(<App \/>);\n<\/script><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div>\n<p>Views: 31<\/p>","protected":false},"excerpt":{"rendered":"<p>Views: 31<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-73","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.ivecr5.ac.th\/web2020\/wp-json\/wp\/v2\/pages\/73","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ivecr5.ac.th\/web2020\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.ivecr5.ac.th\/web2020\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.ivecr5.ac.th\/web2020\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ivecr5.ac.th\/web2020\/wp-json\/wp\/v2\/comments?post=73"}],"version-history":[{"count":16,"href":"https:\/\/www.ivecr5.ac.th\/web2020\/wp-json\/wp\/v2\/pages\/73\/revisions"}],"predecessor-version":[{"id":18139,"href":"https:\/\/www.ivecr5.ac.th\/web2020\/wp-json\/wp\/v2\/pages\/73\/revisions\/18139"}],"wp:attachment":[{"href":"https:\/\/www.ivecr5.ac.th\/web2020\/wp-json\/wp\/v2\/media?parent=73"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}