{"id":2343,"date":"2025-08-18T10:28:00","date_gmt":"2025-08-18T01:28:00","guid":{"rendered":"https:\/\/career-c.sognoplanning.com\/?page_id=2343"},"modified":"2025-08-18T10:28:00","modified_gmt":"2025-08-18T01:28:00","slug":"%e5%ad%a6%e7%bf%92%e3%82%a2%e3%83%97%e3%83%aa%ef%bc%88%e8%a6%81%e7%b4%84%e7%9a%84%e8%a8%80%e3%81%84%e6%8f%9b%e3%81%88%e3%81%ae%e4%bd%93%e9%a8%93%ef%bc%89","status":"publish","type":"page","link":"https:\/\/career-c.sognoplanning.com\/?page_id=2343","title":{"rendered":"\u5b66\u7fd2\u30a2\u30d7\u30ea\uff08\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048\u306e\u4f53\u9a13\uff09"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"ja\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u306a\u9762\u8ac7\u30b9\u30ad\u30eb\u5b66\u7fd2\u30a2\u30d7\u30ea<\/title>\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n    <!-- Chosen Palette: Calm Consultant (Warm neutrals with a supportive blue accent) -->\n    <!-- Application Structure Plan: An interactive, step-by-step learning module. The user is presented with a client scenario and must choose a response type ('parroting' vs. 'summarizing'). Their choice dynamically reveals the corresponding outcome and explanation. This active-learning approach is more engaging than a static diagram and reinforces the core message by demonstrating cause and effect directly. A final summary section compares the two paths to solidify the learning. -->\n    <!-- Visualization & Content Choices: Client's Statement -> Goal: Set Scene -> Viz: Styled text block -> Interaction: None. | Response Choice -> Goal: Active Learning -> Viz: Interactive Buttons -> Interaction: JS onclick event to trigger feedback display. | Outcomes & Effects -> Goal: Provide Feedback -> Viz: Dynamically updated text sections with smooth transitions -> Interaction: Content revealed based on user's button choice. | Final Summary -> Goal: Reinforce Learning -> Viz: Side-by-side comparison using HTML\/Tailwind grid -> Interaction: None. This structure guides the user from problem to solution exploration and finally to a clear conclusion. -->\n    <!-- CONFIRMATION: NO SVG graphics used. NO Mermaid JS used. -->\n    <style>\n        body {\n            font-family: 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;\n            background-color: #fdfdfc;\n            color: #333;\n        }\n        .fade-in {\n            animation: fadeIn 0.5s ease-in-out forwards;\n            opacity: 0;\n        }\n        @keyframes fadeIn {\n            from { opacity: 0; transform: translateY(10px); }\n            to { opacity: 1; transform: translateY(0); }\n        }\n        .result-card {\n            transition: all 0.3s ease-in-out;\n        }\n    <\/style>\n<\/head>\n<body class=\"antialiased\">\n    <div class=\"container mx-auto p-4 sm:p-6 md:p-8 max-w-4xl\">\n\n        <header class=\"text-center mb-10\">\n            <h1 class=\"text-2xl md:text-3xl font-bold text-gray-800\">\u9762\u8ac7\u306e\u8cea\u3092\u5287\u7684\u306b\u5909\u3048\u308b\u300c\u8a00\u3044\u63db\u3048\u300d\u306e\u529b<\/h1>\n            <p class=\"text-gray-600 mt-2\">\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u5b66\u7fd2<\/p>\n        <\/header>\n\n        <main>\n            <!-- Module 1: Relationship Issues -->\n            <div class=\"interactive-module mb-16\" id=\"module-1\">\n                <section class=\"mb-10\">\n                    <h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\u30b1\u30fc\u30b9\u30b9\u30bf\u30c7\u30a3 1\uff1a\u4eba\u9593\u95a2\u4fc2\u306e\u60a9\u307f<\/h2>\n                    <div class=\"bg-blue-50 border-l-4 border-blue-400 p-6 rounded-r-lg shadow-sm\">\n                        <p class=\"text-gray-800 text-lg\">\u300c\u4e0a\u53f8\u306f\u8a55\u4fa1\u3057\u3066\u304f\u308c\u306a\u3044\u3057\u3001\u5f8c\u8f29\u306f\u8a00\u3046\u3053\u3068\u805e\u304b\u306a\u3044\u3057\u3001\u3082\u3046\u3069\u3046\u3057\u305f\u3089\u3044\u3044\u304b\u5206\u304b\u3089\u306a\u304f\u3066\u2026\u300d<\/p>\n                    <\/div>\n                <\/section>\n                <section class=\"mb-10\">\n                    <h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\uff08\u8cea\u554f\uff09\u3042\u306a\u305f\u306a\u3089\u3001\u3069\u3046\u8fd4\u3057\u307e\u3059\u304b\uff1f<\/h2>\n                    <div class=\"flex flex-col sm:flex-row justify-center gap-4\">\n                        <button class=\"parrotBtn bg-gray-200 text-gray-700 font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-gray-300 transition-colors duration-300\">\u30aa\u30a6\u30e0\u8fd4\u3057 (\u8a00\u8449\u306e\u53cd\u5fa9)<\/button>\n                        <button class=\"summaryBtn bg-blue-500 text-white font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-blue-600 transition-colors duration-300\">\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048 (\u6c17\u6301\u3061\u306e\u6838\u5fc3)<\/button>\n                    <\/div>\n                <\/section>\n                <section class=\"result min-h-[300px] hidden\"><div class=\"result-content p-6 rounded-lg shadow-md\"><h3 class=\"result-title text-xl font-bold mb-3\"><\/h3><div class=\"bg-white p-4 rounded border border-gray-200 mb-4\"><p class=\"result-response text-lg\"><\/p><\/div><div class=\"result-effect flex items-start gap-4\"><span class=\"result-icon text-3xl\"><\/span><div><h4 class=\"font-semibold text-gray-800\">\u3082\u305f\u3089\u3055\u308c\u308b\u52b9\u679c<\/h4><p class=\"result-description text-gray-600\"><\/p><\/div><\/div><\/div><\/section>\n                <section class=\"summary hidden mt-12\"><h2 class=\"text-xl font-semibold text-center mb-6 text-gray-700\">\u307e\u3068\u3081\uff1a2\u3064\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u306e\u6bd4\u8f03<\/h2><div class=\"grid md:grid-cols-2 gap-6\"><div class=\"bg-gray-50 border border-gray-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-gray-600 mb-3\">\u73fe\u72b6\uff1a\u30aa\u30a6\u30e0\u8fd4\u3057<\/h3><p class=\"bg-white p-3 rounded border border-gray-200 text-gray-700 mb-4\">\u300c\u4e0a\u53f8\u304c\u8a55\u4fa1\u305b\u305a\u3001\u5f8c\u8f29\u3082\u8a00\u3046\u3053\u3068\u3092\u805e\u304b\u306a\u3044\u3093\u3067\u3059\u306d\u2026\u300d<\/p><div class=\"text-center\"><span class=\"text-3xl\">&#x1f914;<\/span><p class=\"font-semibold text-red-500 mt-2\">\u2192 \u8a71\u304c\u6df1\u307e\u308a\u306b\u304f\u3044<\/p><p class=\"text-sm text-gray-500\">\u4e8b\u5b9f\u78ba\u8a8d\u306b\u7559\u307e\u308a\u3001\u76f8\u8ac7\u8005\u306e\u611f\u60c5\u9762\u306b\u30a2\u30d7\u30ed\u30fc\u30c1\u3057\u306b\u304f\u3044\u3002<\/p><\/div><\/div><div class=\"bg-blue-50 border border-blue-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-blue-700 mb-3\">\u7406\u60f3\uff1a\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048<\/h3><p class=\"bg-white p-3 rounded border border-blue-200 text-gray-700 mb-4\">\u300c\u9811\u5f35\u308a\u304c\u5831\u308f\u308c\u306a\u3044\u72b6\u6cc1\u306b\u3001\u5c11\u3057**\u75b2\u308c\u3092\u611f\u3058\u3066\u3044\u3089\u3063\u3057\u3083\u308b**\u3093\u3067\u3059\u306d\u300d<\/p><div class=\"grid grid-cols-2 gap-4 text-center mt-4\"><div><span class=\"text-3xl\">&#x1f91d;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u5b89\u5fc3\u3068\u4fe1\u983c<\/p><p class=\"text-sm text-gray-500\">\u300c\u6c17\u6301\u3061\u3092\u7406\u89e3\u3057\u3066\u304f\u308c\u305f\u300d\u3068\u611f\u3058\u308b\u3002<\/p><\/div><div><span class=\"text-3xl\">&#x1f4a1;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u601d\u8003\u306e\u6574\u7406<\/p><p class=\"text-sm text-gray-500\">\u300c\u81ea\u5206\u306e\u611f\u60c5\u306b\u6c17\u3065\u304f\u300d\u624b\u52a9\u3051\u306b\u306a\u308b\u3002<\/p><\/div><\/div><\/div><\/div><\/section>\n            <\/div>\n\n            <hr class=\"my-12 border-gray-200\">\n\n            <!-- Module 2: Stagnation -->\n            <div class=\"interactive-module mb-16\" id=\"module-2\">\n                <section class=\"mb-10\"><h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\u30b1\u30fc\u30b9\u30b9\u30bf\u30c7\u30a3 2\uff1a\u505c\u6ede\u611f\u306e\u60a9\u307f<\/h2><div class=\"bg-purple-50 border-l-4 border-purple-400 p-6 rounded-r-lg shadow-sm\"><p class=\"text-gray-800 text-lg\">\u300c\u8272\u3005\u8a66\u3057\u3066\u306f\u3044\u308b\u3093\u3067\u3059\u304c\u3001\u5168\u7136\u6210\u679c\u304c\u51fa\u306a\u304f\u3066\u3002\u3082\u3046\u81ea\u5206\u306b\u306f\u624d\u80fd\u304c\u306a\u3044\u3093\u3058\u3083\u306a\u3044\u304b\u3063\u3066\u601d\u3044\u307e\u3059\u2026\u300d<\/p><\/div><\/section>\n                <section class=\"mb-10\"><h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\uff08\u8cea\u554f\uff09\u3042\u306a\u305f\u306a\u3089\u3001\u3069\u3046\u8fd4\u3057\u307e\u3059\u304b\uff1f<\/h2><div class=\"flex flex-col sm:flex-row justify-center gap-4\"><button class=\"parrotBtn bg-gray-200 text-gray-700 font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-gray-300 transition-colors duration-300\">\u30aa\u30a6\u30e0\u8fd4\u3057 (\u8a00\u8449\u306e\u53cd\u5fa9)<\/button><button class=\"summaryBtn bg-purple-500 text-white font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-purple-600 transition-colors duration-300\">\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048 (\u6c17\u6301\u3061\u306e\u6838\u5fc3)<\/button><\/div><\/section>\n                <section class=\"result min-h-[300px] hidden\"><div class=\"result-content p-6 rounded-lg shadow-md\"><h3 class=\"result-title text-xl font-bold mb-3\"><\/h3><div class=\"bg-white p-4 rounded border border-gray-200 mb-4\"><p class=\"result-response text-lg\"><\/p><\/div><div class=\"flex items-start gap-4\"><span class=\"result-icon text-3xl\"><\/span><div><h4 class=\"font-semibold text-gray-800\">\u3082\u305f\u3089\u3055\u308c\u308b\u52b9\u679c<\/h4><p class=\"result-description text-gray-600\"><\/p><\/div><\/div><\/div><\/section>\n                <section class=\"summary hidden mt-12\"><h2 class=\"text-xl font-semibold text-center mb-6 text-gray-700\">\u307e\u3068\u3081\uff1a2\u3064\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u306e\u6bd4\u8f03<\/h2><div class=\"grid md:grid-cols-2 gap-6\"><div class=\"bg-gray-50 border border-gray-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-gray-600 mb-3\">\u73fe\u72b6\uff1a\u30aa\u30a6\u30e0\u8fd4\u3057<\/h3><p class=\"bg-white p-3 rounded border border-gray-200 text-gray-700 mb-4\">\u300c\u8272\u3005\u8a66\u3057\u3066\u3082\u6210\u679c\u304c\u51fa\u305a\u3001\u624d\u80fd\u304c\u306a\u3044\u3068\u611f\u3058\u3066\u3044\u308b\u3093\u3067\u3059\u306d\u3002\u300d<\/p><div class=\"text-center\"><span class=\"text-3xl\">&#x1f914;<\/span><p class=\"font-semibold text-red-500 mt-2\">\u2192 \u601d\u8003\u304c\u505c\u6b62\u3057\u3084\u3059\u3044<\/p><p class=\"text-sm text-gray-500\">\u300c\u624d\u80fd\u304c\u306a\u3044\u300d\u3068\u3044\u3046\u81ea\u5df1\u5426\u5b9a\u3092\u80af\u5b9a\u3055\u308c\u305f\u3088\u3046\u306b\u611f\u3058\u3001\u524d\u5411\u304d\u306a\u601d\u8003\u3092\u59a8\u3052\u308b\u53ef\u80fd\u6027\u304c\u3042\u308b\u3002<\/p><\/div><\/div><div class=\"bg-purple-50 border border-purple-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-purple-700 mb-3\">\u7406\u60f3\uff1a\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048<\/h3><p class=\"bg-white p-3 rounded border border-purple-200 text-gray-700 mb-4\">\u300c\u3053\u308c\u307e\u3067\u306e\u52aa\u529b\u304c\u7d50\u679c\u306b\u7d50\u3073\u3064\u304b\u305a\u3001**\u81ea\u4fe1\u3092\u5931\u3044\u304b\u3051\u3066\u3044\u308b**\u72b6\u6cc1\u306a\u3093\u3067\u3059\u306d\u3002\u300d<\/p><div class=\"grid grid-cols-2 gap-4 text-center mt-4\"><div><span class=\"text-3xl\">&#x1f331;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u8996\u70b9\u306e\u8ee2\u63db<\/p><p class=\"text-sm text-gray-500\">\u300c\u624d\u80fd\u300d\u306e\u554f\u984c\u304b\u3089\u300c\u30d7\u30ed\u30bb\u30b9\u300d\u306e\u554f\u984c\u3078\u3068\u8996\u70b9\u3092\u79fb\u3059\u304d\u3063\u304b\u3051\u306b\u306a\u308b\u3002<\/p><\/div><div><span class=\"text-3xl\">&#x1f4aa;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u81ea\u5df1\u80af\u5b9a\u611f\u306e\u56de\u5fa9<\/p><p class=\"text-sm text-gray-500\">\u3053\u308c\u307e\u3067\u306e\u300c\u52aa\u529b\u300d\u3092\u8a8d\u3081\u308b\u8a00\u8449\u3067\u3001\u81ea\u5df1\u80af\u5b9a\u611f\u3092\u652f\u3048\u308b\u3002<\/p><\/div><\/div><\/div><\/div><\/section>\n            <\/div>\n\n            <hr class=\"my-12 border-gray-200\">\n\n            <!-- Module 3: Decision-making -->\n            <div class=\"interactive-module mb-16\" id=\"module-3\">\n                <section class=\"mb-10\"><h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\u30b1\u30fc\u30b9\u30b9\u30bf\u30c7\u30a3 3\uff1a\u6c7a\u65ad\u306e\u60a9\u307f<\/h2><div class=\"bg-green-50 border-l-4 border-green-400 p-6 rounded-r-lg shadow-sm\"><p class=\"text-gray-800 text-lg\">\u300c\u65b0\u3057\u3044\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u30ea\u30fc\u30c0\u30fc\u3092\u4efb\u3055\u308c\u305f\u3093\u3067\u3059\u304c\u3001\u81ea\u5206\u306b\u52d9\u307e\u308b\u304b\u4e0d\u5b89\u3067\u2026\u65ad\u308b\u3079\u304d\u304b\u3001\u53d7\u3051\u308b\u3079\u304d\u304b\u3001\u305a\u3063\u3068\u60a9\u3093\u3067\u3044\u307e\u3059\u3002\u300d<\/p><\/div><\/section>\n                <section class=\"mb-10\"><h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\uff08\u8cea\u554f\uff09\u3042\u306a\u305f\u306a\u3089\u3001\u3069\u3046\u8fd4\u3057\u307e\u3059\u304b\uff1f<\/h2><div class=\"flex flex-col sm:flex-row justify-center gap-4\"><button class=\"parrotBtn bg-gray-200 text-gray-700 font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-gray-300 transition-colors duration-300\">\u30aa\u30a6\u30e0\u8fd4\u3057 (\u8a00\u8449\u306e\u53cd\u5fa9)<\/button><button class=\"summaryBtn bg-green-500 text-white font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-green-600 transition-colors duration-300\">\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048 (\u6c17\u6301\u3061\u306e\u6838\u5fc3)<\/button><\/div><\/section>\n                <section class=\"result min-h-[300px] hidden\"><div class=\"result-content p-6 rounded-lg shadow-md\"><h3 class=\"result-title text-xl font-bold mb-3\"><\/h3><div class=\"bg-white p-4 rounded border border-gray-200 mb-4\"><p class=\"result-response text-lg\"><\/p><\/div><div class=\"flex items-start gap-4\"><span class=\"result-icon text-3xl\"><\/span><div><h4 class=\"font-semibold text-gray-800\">\u3082\u305f\u3089\u3055\u308c\u308b\u52b9\u679c<\/h4><p class=\"result-description text-gray-600\"><\/p><\/div><\/div><\/div><\/section>\n                <section class=\"summary hidden mt-12\"><h2 class=\"text-xl font-semibold text-center mb-6 text-gray-700\">\u307e\u3068\u3081\uff1a2\u3064\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u306e\u6bd4\u8f03<\/h2><div class=\"grid md:grid-cols-2 gap-6\"><div class=\"bg-gray-50 border border-gray-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-gray-600 mb-3\">\u73fe\u72b6\uff1a\u30aa\u30a6\u30e0\u8fd4\u3057<\/h3><p class=\"bg-white p-3 rounded border border-gray-200 text-gray-700 mb-4\">\u300c\u30ea\u30fc\u30c0\u30fc\u3092\u4efb\u3055\u308c\u3066\u3001\u65ad\u308b\u3079\u304d\u304b\u53d7\u3051\u308b\u3079\u304d\u304b\u60a9\u3093\u3067\u3044\u308b\u3093\u3067\u3059\u306d\u3002\u300d<\/p><div class=\"text-center\"><span class=\"text-3xl\">&#x1f914;<\/span><p class=\"font-semibold text-red-500 mt-2\">\u2192 \u5802\u3005\u5de1\u308a\u306b\u306a\u308a\u3084\u3059\u3044<\/p><p class=\"text-sm text-gray-500\">\u300c\u3084\u308b\u304b\/\u3084\u3089\u306a\u3044\u304b\u300d\u306e\u4e8c\u8005\u629e\u4e00\u306b\u7559\u307e\u308a\u3001\u6839\u672c\u7684\u306a\u4e0d\u5b89\u306e\u89e3\u6d88\u306b\u3064\u306a\u304c\u308a\u306b\u304f\u3044\u3002<\/p><\/div><\/div><div class=\"bg-green-50 border border-green-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-green-700 mb-3\">\u7406\u60f3\uff1a\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048<\/h3><p class=\"bg-white p-3 rounded border border-green-200 text-gray-700 mb-4\">\u300c\u5927\u304d\u306a\u30c1\u30e3\u30f3\u30b9\u3060\u3068\u611f\u3058\u3064\u3064\u3082\u3001**\u5931\u6557\u3078\u306e\u4e0d\u5b89**\u304b\u3089\u4e00\u6b69\u8e0f\u307f\u51fa\u305b\u305a\u306b\u3044\u308b\u3093\u3067\u3059\u306d\u3002\u300d<\/p><div class=\"grid grid-cols-2 gap-4 text-center mt-4\"><div><span class=\"text-3xl\">&#x1f3af;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u611f\u60c5\u306e\u660e\u78ba\u5316<\/p><p class=\"text-sm text-gray-500\">\u60a9\u307f\u306e\u6838\u5fc3\u304c\u300c\u4e0d\u5b89\u300d\u3067\u3042\u308b\u3053\u3068\u3092\u8a00\u8a9e\u5316\u3057\u3001\u5411\u304d\u5408\u3044\u3084\u3059\u304f\u3059\u308b\u3002<\/p><\/div><div><span class=\"text-3xl\">&#x1f680;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u524d\u5411\u304d\u306a\u691c\u8a0e<\/p><p class=\"text-sm text-gray-500\">\u300c\u3069\u3046\u3059\u308c\u3070\u4e0d\u5b89\u3092\u89e3\u6d88\u3067\u304d\u308b\u304b\u300d\u3068\u3044\u3046\u5177\u4f53\u7684\u306a\u4f1a\u8a71\u306b\u767a\u5c55\u3055\u305b\u3084\u3059\u3044\u3002<\/p><\/div><\/div><\/div><\/div><\/section>\n            <\/div>\n\n            <hr class=\"my-12 border-gray-200\">\n\n            <!-- Module 4: Lack of Motivation -->\n            <div class=\"interactive-module mb-16\" id=\"module-4\">\n                <section class=\"mb-10\"><h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\u30b1\u30fc\u30b9\u30b9\u30bf\u30c7\u30a3 4\uff1a\u30e2\u30c1\u30d9\u30fc\u30b7\u30e7\u30f3\u306e\u4f4e\u4e0b<\/h2><div class=\"bg-yellow-50 border-l-4 border-yellow-400 p-6 rounded-r-lg shadow-sm\"><p class=\"text-gray-800 text-lg\">\u300c\u6700\u8fd1\u3001\u4f55\u3092\u3084\u3063\u3066\u3082\u697d\u3057\u304f\u306a\u3044\u3093\u3067\u3059\u3002\u4ed5\u4e8b\u306b\u3082\u96c6\u4e2d\u3067\u304d\u306a\u3044\u3057\u3001\u4f11\u65e5\u3082\u305f\u3060\u5bdd\u3066\u904e\u3054\u3059\u3060\u3051\u3067\u2026\u300d<\/p><\/div><\/section>\n                <section class=\"mb-10\"><h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\uff08\u8cea\u554f\uff09\u3042\u306a\u305f\u306a\u3089\u3001\u3069\u3046\u8fd4\u3057\u307e\u3059\u304b\uff1f<\/h2><div class=\"flex flex-col sm:flex-row justify-center gap-4\"><button class=\"parrotBtn bg-gray-200 text-gray-700 font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-gray-300 transition-colors duration-300\">\u30aa\u30a6\u30e0\u8fd4\u3057 (\u8a00\u8449\u306e\u53cd\u5fa9)<\/button><button class=\"summaryBtn bg-yellow-500 text-white font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-yellow-600 transition-colors duration-300\">\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048 (\u6c17\u6301\u3061\u306e\u6838\u5fc3)<\/button><\/div><\/section>\n                <section class=\"result min-h-[300px] hidden\"><div class=\"result-content p-6 rounded-lg shadow-md\"><h3 class=\"result-title text-xl font-bold mb-3\"><\/h3><div class=\"bg-white p-4 rounded border border-gray-200 mb-4\"><p class=\"result-response text-lg\"><\/p><\/div><div class=\"flex items-start gap-4\"><span class=\"result-icon text-3xl\"><\/span><div><h4 class=\"font-semibold text-gray-800\">\u3082\u305f\u3089\u3055\u308c\u308b\u52b9\u679c<\/h4><p class=\"result-description text-gray-600\"><\/p><\/div><\/div><\/div><\/section>\n                <section class=\"summary hidden mt-12\"><h2 class=\"text-xl font-semibold text-center mb-6 text-gray-700\">\u307e\u3068\u3081\uff1a2\u3064\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u306e\u6bd4\u8f03<\/h2><div class=\"grid md:grid-cols-2 gap-6\"><div class=\"bg-gray-50 border border-gray-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-gray-600 mb-3\">\u73fe\u72b6\uff1a\u30aa\u30a6\u30e0\u8fd4\u3057<\/h3><p class=\"bg-white p-3 rounded border border-gray-200 text-gray-700 mb-4\">\u300c\u4f55\u3092\u3084\u3063\u3066\u3082\u697d\u3057\u304f\u306a\u304f\u3066\u3001\u4ed5\u4e8b\u306b\u3082\u96c6\u4e2d\u3067\u304d\u306a\u3044\u3093\u3067\u3059\u306d\u3002\u300d<\/p><div class=\"text-center\"><span class=\"text-3xl\">&#x1f914;<\/span><p class=\"font-semibold text-red-500 mt-2\">\u2192 \u5171\u611f\u304c\u4f1d\u308f\u308a\u306b\u304f\u3044<\/p><p class=\"text-sm text-gray-500\">\u4e8b\u5b9f\u306e\u78ba\u8a8d\u306b\u805e\u3053\u3048\u3001\u76f8\u8ac7\u8005\u306e\u7121\u6c17\u529b\u306a\u72b6\u614b\u3092\u305f\u3060\u80af\u5b9a\u3059\u308b\u3060\u3051\u3067\u7d42\u308f\u3063\u3066\u3057\u307e\u3046\u3002<\/p><\/div><\/div><div class=\"bg-yellow-50 border border-yellow-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-yellow-700 mb-3\">\u7406\u60f3\uff1a\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048<\/h3><p class=\"bg-white p-3 rounded border border-yellow-200 text-gray-700 mb-4\">\u300c\u4ee5\u524d\u306f\u611f\u3058\u3066\u3044\u305f\u306f\u305a\u306e**\u610f\u6b32\u3084\u5145\u5b9f\u611f\u304c\u5931\u308f\u308c\u3066\u3044\u308b**\u3088\u3046\u3067\u3001\u3054\u81ea\u8eab\u3067\u3082\u6238\u60d1\u3063\u3066\u3044\u3089\u3063\u3057\u3083\u308b\u3093\u3067\u3059\u306d\u3002\u300d<\/p><div class=\"grid grid-cols-2 gap-4 text-center mt-4\"><div><span class=\"text-3xl\">&#x2600;&#xfe0f;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u72b6\u614b\u306e\u8a00\u8a9e\u5316<\/p><p class=\"text-sm text-gray-500\">\u6f20\u7136\u3068\u3057\u305f\u4e0d\u8abf\u306b\u540d\u524d\u304c\u3064\u304d\u3001\u5ba2\u89b3\u7684\u306b\u6349\u3048\u3084\u3059\u304f\u306a\u308b\u3002<\/p><\/div><div><span class=\"text-3xl\">&#x2764;&#xfe0f;&#x200d;&#x1fa79;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u5b89\u5fc3\u611f<\/p><p class=\"text-sm text-gray-500\">\u300c\u3053\u306e\u4eba\u306f\u81ea\u5206\u306e\u8f9b\u3055\u3092\u5206\u304b\u3063\u3066\u304f\u308c\u308b\u300d\u3068\u3044\u3046\u4fe1\u983c\u611f\u304c\u751f\u307e\u308c\u308b\u3002<\/p><\/div><\/div><\/div><\/div><\/section>\n            <\/div>\n\n            <hr class=\"my-12 border-gray-200\">\n\n            <!-- Module 5: Comparison with Others -->\n            <div class=\"interactive-module mb-16\" id=\"module-5\">\n                <section class=\"mb-10\"><h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\u30b1\u30fc\u30b9\u30b9\u30bf\u30c7\u30a3 5\uff1a\u4ed6\u8005\u3068\u306e\u6bd4\u8f03<\/h2><div class=\"bg-red-50 border-l-4 border-red-400 p-6 rounded-r-lg shadow-sm\"><p class=\"text-gray-800 text-lg\">\u300c\u540c\u671f\u304c\u3069\u3093\u3069\u3093\u51fa\u4e16\u3057\u3066\u3044\u304f\u306e\u306b\u3001\u81ea\u5206\u3060\u3051\u304c\u53d6\u308a\u6b8b\u3055\u308c\u3066\u3044\u308b\u3088\u3046\u306a\u6c17\u304c\u3057\u3066\u7126\u308a\u307e\u3059\u3002\u5f7c\u3068\u6bd4\u3079\u3066\u81ea\u5206\u306b\u306f\u4f55\u304c\u8db3\u308a\u306a\u3044\u3093\u3060\u308d\u3046\u3063\u3066\u2026\u300d<\/p><\/div><\/section>\n                <section class=\"mb-10\"><h2 class=\"text-xl font-semibold text-center mb-4 text-gray-700\">\uff08\u8cea\u554f\uff09\u3042\u306a\u305f\u306a\u3089\u3001\u3069\u3046\u8fd4\u3057\u307e\u3059\u304b\uff1f<\/h2><div class=\"flex flex-col sm:flex-row justify-center gap-4\"><button class=\"parrotBtn bg-gray-200 text-gray-700 font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-gray-300 transition-colors duration-300\">\u30aa\u30a6\u30e0\u8fd4\u3057 (\u8a00\u8449\u306e\u53cd\u5fa9)<\/button><button class=\"summaryBtn bg-red-500 text-white font-semibold py-3 px-6 rounded-lg shadow-sm hover:bg-red-600 transition-colors duration-300\">\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048 (\u6c17\u6301\u3061\u306e\u6838\u5fc3)<\/button><\/div><\/section>\n                <section class=\"result min-h-[300px] hidden\"><div class=\"result-content p-6 rounded-lg shadow-md\"><h3 class=\"result-title text-xl font-bold mb-3\"><\/h3><div class=\"bg-white p-4 rounded border border-gray-200 mb-4\"><p class=\"result-response text-lg\"><\/p><\/div><div class=\"flex items-start gap-4\"><span class=\"result-icon text-3xl\"><\/span><div><h4 class=\"font-semibold text-gray-800\">\u3082\u305f\u3089\u3055\u308c\u308b\u52b9\u679c<\/h4><p class=\"result-description text-gray-600\"><\/p><\/div><\/div><\/div><\/section>\n                <section class=\"summary hidden mt-12\"><h2 class=\"text-xl font-semibold text-center mb-6 text-gray-700\">\u307e\u3068\u3081\uff1a2\u3064\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u306e\u6bd4\u8f03<\/h2><div class=\"grid md:grid-cols-2 gap-6\"><div class=\"bg-gray-50 border border-gray-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-gray-600 mb-3\">\u73fe\u72b6\uff1a\u30aa\u30a6\u30e0\u8fd4\u3057<\/h3><p class=\"bg-white p-3 rounded border border-gray-200 text-gray-700 mb-4\">\u300c\u540c\u671f\u304c\u51fa\u4e16\u3057\u3066\u3001\u81ea\u5206\u3060\u3051\u53d6\u308a\u6b8b\u3055\u308c\u3066\u3044\u308b\u3088\u3046\u306b\u611f\u3058\u3066\u7126\u3063\u3066\u3044\u308b\u3093\u3067\u3059\u306d\u3002\u300d<\/p><div class=\"text-center\"><span class=\"text-3xl\">&#x1f914;<\/span><p class=\"font-semibold text-red-500 mt-2\">\u2192 \u6bd4\u8f03\u3092\u52a9\u9577\u3059\u308b<\/p><p class=\"text-sm text-gray-500\">\u610f\u8b58\u304c\u300c\u540c\u671f\u300d\u306b\u5411\u3044\u305f\u307e\u307e\u306b\u306a\u308a\u3001\u81ea\u5206\u81ea\u8eab\u306e\u8ab2\u984c\u3068\u5411\u304d\u5408\u3044\u306b\u304f\u3044\u3002<\/p><\/div><\/div><div class=\"bg-red-50 border border-red-200 p-6 rounded-lg\"><h3 class=\"font-bold text-lg text-red-700 mb-3\">\u7406\u60f3\uff1a\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048<\/h3><p class=\"bg-white p-3 rounded border border-red-200 text-gray-700 mb-4\">\u300c\u5468\u308a\u306e\u8a55\u4fa1\u3068\u81ea\u5206\u306e\u73fe\u72b6\u3068\u306e\u30ae\u30e3\u30c3\u30d7\u306b\u3001**\u6094\u3057\u3055\u3084\u7121\u529b\u611f**\u3092\u611f\u3058\u3066\u3044\u3089\u3063\u3057\u3083\u308b\u3093\u3067\u3059\u306d\u3002\u300d<\/p><div class=\"grid grid-cols-2 gap-4 text-center mt-4\"><div><span class=\"text-3xl\">&#x1f9d8;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u7126\u70b9\u306e\u81ea\u5df1\u56de\u5e30<\/p><p class=\"text-sm text-gray-500\">\u4ed6\u8005\u3067\u306f\u306a\u304f\u300c\u81ea\u5206\u306e\u611f\u60c5\u300d\u306b\u7126\u70b9\u3092\u623b\u3057\u3001\u5185\u7701\u3092\u4fc3\u3059\u3002<\/p><\/div><div><span class=\"text-3xl\">&#x1fac2;<\/span><p class=\"font-semibold text-green-600 mt-2\">\u611f\u60c5\u306e\u53d7\u5bb9<\/p><p class=\"text-sm text-gray-500\">\u30cd\u30ac\u30c6\u30a3\u30d6\u306a\u611f\u60c5\u3092\u80af\u5b9a\u7684\u306b\u53d7\u3051\u6b62\u3081\u3001\u51b7\u9759\u306b\u306a\u308b\u624b\u52a9\u3051\u3092\u3059\u308b\u3002<\/p><\/div><\/div><\/div><\/div><\/section>\n            <\/div>\n            \n            <footer class=\"text-center mt-12 pt-8 border-t\">\n                <p class=\"font-semibold text-gray-700 mb-4\">\u3053\u308c\u306f\u5c0f\u624b\u5148\u306e\u30c6\u30af\u30cb\u30c3\u30af\u3067\u306f\u306a\u304f\u3001\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u306b\u5bc4\u308a\u6dfb\u3044\u3001\u4f34\u8d70\u3059\u308b\u305f\u3081\u306e\u672c\u8cea\u7684\u306a\u30b9\u30ad\u30eb\u3067\u3059\u3002<\/p>\n                <p class=\"text-sm text-gray-500\">\u00a9 2025 \u5922\u30ed\u30fc\u30d7\u30ec\u7814\u7a76\u5ba4<\/p>\n            <\/footer>\n\n        <\/main>\n    <\/div>\n\n    <script>\n        const moduleData = {\n            'module-1': {\n                parrot: { title: '\u300c\u30aa\u30a6\u30e0\u8fd4\u3057\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u4e0a\u53f8\u304c\u8a55\u4fa1\u305b\u305a\u3001\u5f8c\u8f29\u3082\u8a00\u3046\u3053\u3068\u3092\u805e\u304b\u306a\u3044\u3093\u3067\u3059\u306d\u2026\u300d', icon: '&#x1f914;', description: '\u76f8\u8ac7\u8005\u306e\u8a00\u8449\u3092\u6b63\u78ba\u306b\u7e70\u308a\u8fd4\u3059\u3053\u3068\u3067\u3001\u300c\u8a71\u3092\u8074\u3044\u3066\u3044\u308b\u300d\u3068\u3044\u3046\u30b5\u30a4\u30f3\u306f\u9001\u308c\u307e\u3059\u3002\u3057\u304b\u3057\u3001\u8a71\u306e\u8868\u9762\u7684\u306a\u4e8b\u5b9f\u78ba\u8a8d\u306b\u7559\u307e\u308a\u3001\u76f8\u8ac7\u8005\u304c\u62b1\u3048\u308b\u611f\u60c5\u306e\u6838\u5fc3\u306b\u89e6\u308c\u308b\u3053\u3068\u304c\u96e3\u3057\u304f\u3001\u4f1a\u8a71\u304c\u6df1\u307e\u308a\u306b\u304f\u3044\u50be\u5411\u304c\u3042\u308a\u307e\u3059\u3002', bgColor: 'bg-gray-100', borderColor: 'border-gray-300' },\n                summary: { title: '\u300c\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u9811\u5f35\u308a\u304c\u5831\u308f\u308c\u306a\u3044\u72b6\u6cc1\u306b\u3001\u5c11\u3057\u75b2\u308c\u3092\u611f\u3058\u3066\u3044\u3089\u3063\u3057\u3083\u308b\u3093\u3067\u3059\u306d\u300d', icon: '&#x1f91d;', description: '\u8a00\u8449\u306e\u88cf\u306b\u3042\u308b\u611f\u60c5\u3084\u72b6\u6cc1\u3092\u6c72\u307f\u53d6\u308a\u8981\u7d04\u3057\u3066\u8fd4\u3059\u3053\u3068\u3067\u3001\u76f8\u8ac7\u8005\u306f\u300c\u81ea\u5206\u306e\u6c17\u6301\u3061\u3092\u6df1\u304f\u7406\u89e3\u3057\u3066\u3082\u3089\u3048\u305f\u300d\u3068\u611f\u3058\u307e\u3059\u3002\u3053\u308c\u306b\u3088\u308a\u5f37\u3044\u4fe1\u983c\u95a2\u4fc2\u304c\u751f\u307e\u308c\u3001\u76f8\u8ac7\u8005\u81ea\u8eab\u3082\u81ea\u5206\u306e\u611f\u60c5\u3092\u6574\u7406\u3057\u3084\u3059\u304f\u306a\u308a\u307e\u3059\u3002', bgColor: 'bg-blue-100', borderColor: 'border-blue-300' }\n            },\n            'module-2': {\n                parrot: { title: '\u300c\u30aa\u30a6\u30e0\u8fd4\u3057\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u8272\u3005\u8a66\u3057\u3066\u3082\u6210\u679c\u304c\u51fa\u305a\u3001\u624d\u80fd\u304c\u306a\u3044\u3068\u611f\u3058\u3066\u3044\u308b\u3093\u3067\u3059\u306d\u3002\u300d', icon: '&#x1f914;', description: '\u76f8\u8ac7\u8005\u306e\u300c\u624d\u80fd\u304c\u306a\u3044\u300d\u3068\u3044\u3046\u81ea\u5df1\u5426\u5b9a\u7684\u306a\u8a00\u8449\u3092\u305d\u306e\u307e\u307e\u7e70\u308a\u8fd4\u3059\u3053\u3068\u3067\u3001\u305d\u306e\u8003\u3048\u3092\u5f37\u3081\u3066\u3057\u307e\u3046\u5371\u967a\u6027\u304c\u3042\u308a\u307e\u3059\u3002\u76f8\u8ac7\u8005\u306f\u300c\u3084\u3063\u3071\u308a\u305d\u3046\u304b\u300d\u3068\u611f\u3058\u3001\u601d\u8003\u304c\u505c\u6b62\u3057\u3066\u3057\u307e\u3046\u53ef\u80fd\u6027\u304c\u3042\u308a\u307e\u3059\u3002', bgColor: 'bg-gray-100', borderColor: 'border-gray-300' },\n                summary: { title: '\u300c\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u3053\u308c\u307e\u3067\u306e\u52aa\u529b\u304c\u7d50\u679c\u306b\u7d50\u3073\u3064\u304b\u305a\u3001\u81ea\u4fe1\u3092\u5931\u3044\u304b\u3051\u3066\u3044\u308b\u72b6\u6cc1\u306a\u3093\u3067\u3059\u306d\u3002\u300d', icon: '&#x1f331;', description: '\u300c\u624d\u80fd\u300d\u3068\u3044\u3046\u6f20\u7136\u3068\u3057\u305f\u8a71\u304b\u3089\u3001\u300c\u52aa\u529b\u3068\u7d50\u679c\u300d\u3068\u3044\u3046\u5177\u4f53\u7684\u306a\u30d7\u30ed\u30bb\u30b9\u306b\u7126\u70b9\u3092\u79fb\u3059\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u3053\u308c\u306b\u3088\u308a\u3001\u76f8\u8ac7\u8005\u306f\u81ea\u5206\u306e\u884c\u52d5\u3092\u5ba2\u89b3\u7684\u306b\u632f\u308a\u8fd4\u308a\u3001\u6b21\u306e\u5177\u4f53\u7684\u306a\u4e00\u6b69\u3092\u8003\u3048\u308b\u304d\u3063\u304b\u3051\u3092\u5f97\u3084\u3059\u304f\u306a\u308a\u307e\u3059\u3002', bgColor: 'bg-purple-100', borderColor: 'border-purple-300' }\n            },\n            'module-3': {\n                parrot: { title: '\u300c\u30aa\u30a6\u30e0\u8fd4\u3057\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u30ea\u30fc\u30c0\u30fc\u3092\u4efb\u3055\u308c\u3066\u3001\u65ad\u308b\u3079\u304d\u304b\u53d7\u3051\u308b\u3079\u304d\u304b\u60a9\u3093\u3067\u3044\u308b\u3093\u3067\u3059\u306d\u3002\u300d', icon: '&#x1f914;', description: '\u76f8\u8ac7\u8005\u306e\u8a00\u8449\u3092\u7e70\u308a\u8fd4\u3059\u3053\u3068\u3067\u3001\u60a9\u307f\u3092\u8a8d\u8b58\u3057\u3066\u3044\u308b\u3053\u3068\u306f\u4f1d\u308f\u308a\u307e\u3059\u3002\u3057\u304b\u3057\u3001\u300c\u3084\u308b\u304b\/\u3084\u3089\u306a\u3044\u304b\u300d\u3068\u3044\u3046\u8868\u9762\u7684\u306a\u4e8c\u8005\u629e\u4e00\u306e\u601d\u8003\u304b\u3089\u629c\u3051\u51fa\u3059\u624b\u52a9\u3051\u306b\u306f\u306a\u308a\u306b\u304f\u304f\u3001\u4f1a\u8a71\u304c\u5802\u3005\u5de1\u308a\u306b\u306a\u308b\u53ef\u80fd\u6027\u304c\u3042\u308a\u307e\u3059\u3002', bgColor: 'bg-gray-100', borderColor: 'border-gray-300' },\n                summary: { title: '\u300c\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u5927\u304d\u306a\u30c1\u30e3\u30f3\u30b9\u3060\u3068\u611f\u3058\u3064\u3064\u3082\u3001\u5931\u6557\u3078\u306e\u4e0d\u5b89\u304b\u3089\u4e00\u6b69\u8e0f\u307f\u51fa\u305b\u305a\u306b\u3044\u308b\u3093\u3067\u3059\u306d\u3002\u300d', icon: '&#x1f3af;', description: '\u300c\u65ad\u308b\u304b\/\u53d7\u3051\u308b\u304b\u300d\u3068\u3044\u3046\u884c\u52d5\u30ec\u30d9\u30eb\u306e\u60a9\u307f\u304b\u3089\u3001\u300c\u5931\u6557\u304c\u6016\u3044\u300d\u3068\u3044\u3046\u611f\u60c5\u30ec\u30d9\u30eb\u306e\u6838\u5fc3\u306b\u7126\u70b9\u3092\u5f53\u3066\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u3053\u308c\u306b\u3088\u308a\u3001\u76f8\u8ac7\u8005\u306f\u81ea\u8eab\u306e\u4e0d\u5b89\u3068\u5411\u304d\u5408\u3044\u3001\u300c\u3069\u3046\u3059\u308c\u3070\u4e0d\u5b89\u3092\u4e57\u308a\u8d8a\u3048\u3089\u308c\u308b\u304b\u300d\u3068\u3044\u3046\u5efa\u8a2d\u7684\u306a\u5bfe\u8a71\u3078\u3068\u9032\u3080\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002', bgColor: 'bg-green-100', borderColor: 'border-green-300' }\n            },\n            'module-4': {\n                parrot: { title: '\u300c\u30aa\u30a6\u30e0\u8fd4\u3057\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u4f55\u3092\u3084\u3063\u3066\u3082\u697d\u3057\u304f\u306a\u304f\u3066\u3001\u4ed5\u4e8b\u306b\u3082\u96c6\u4e2d\u3067\u304d\u306a\u3044\u3093\u3067\u3059\u306d\u3002\u300d', icon: '&#x1f914;', description: '\u4e8b\u5b9f\u3092\u305d\u306e\u307e\u307e\u7e70\u308a\u8fd4\u3059\u3060\u3051\u3067\u306f\u3001\u76f8\u8ac7\u8005\u306f\u300c\u305f\u3060\u75c7\u72b6\u3092\u78ba\u8a8d\u3055\u308c\u305f\u3060\u3051\u300d\u3068\u611f\u3058\u3001\u5171\u611f\u304c\u4f1d\u308f\u308a\u306b\u304f\u3044\u3053\u3068\u304c\u3042\u308a\u307e\u3059\u3002\u8a71\u304c\u305d\u308c\u4ee5\u4e0a\u5e83\u304c\u3089\u305a\u3001\u8868\u9762\u7684\u306a\u4f1a\u8a71\u3067\u7d42\u308f\u3063\u3066\u3057\u307e\u3046\u53ef\u80fd\u6027\u304c\u3042\u308a\u307e\u3059\u3002', bgColor: 'bg-gray-100', borderColor: 'border-gray-300' },\n                summary: { title: '\u300c\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u4ee5\u524d\u306f\u611f\u3058\u3066\u3044\u305f\u306f\u305a\u306e\u610f\u6b32\u3084\u5145\u5b9f\u611f\u304c\u5931\u308f\u308c\u3066\u3044\u308b\u3088\u3046\u3067\u3001\u3054\u81ea\u8eab\u3067\u3082\u6238\u60d1\u3063\u3066\u3044\u3089\u3063\u3057\u3083\u308b\u3093\u3067\u3059\u306d\u3002\u300d', icon: '&#x2600;&#xfe0f;', description: '\u300c\u697d\u3057\u304f\u306a\u3044\u300d\u3068\u3044\u3046\u6f20\u7136\u3068\u3057\u305f\u611f\u899a\u3092\u300c\u610f\u6b32\u3084\u5145\u5b9f\u611f\u306e\u55aa\u5931\u300d\u3068\u5177\u4f53\u7684\u306b\u8a00\u8a9e\u5316\u3059\u308b\u3053\u3068\u3067\u3001\u76f8\u8ac7\u8005\u306f\u81ea\u8eab\u306e\u72b6\u614b\u3092\u5ba2\u89b3\u7684\u306b\u7406\u89e3\u3057\u3084\u3059\u304f\u306a\u308a\u307e\u3059\u3002\u300c\u3053\u306e\u4eba\u306f\u81ea\u5206\u306e\u8f9b\u3055\u3092\u5206\u304b\u3063\u3066\u304f\u308c\u308b\u300d\u3068\u3044\u3046\u6df1\u3044\u5b89\u5fc3\u611f\u3068\u4fe1\u983c\u95a2\u4fc2\u306b\u3064\u306a\u304c\u308a\u307e\u3059\u3002', bgColor: 'bg-yellow-100', borderColor: 'border-yellow-300' }\n            },\n            'module-5': {\n                parrot: { title: '\u300c\u30aa\u30a6\u30e0\u8fd4\u3057\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u540c\u671f\u304c\u51fa\u4e16\u3057\u3066\u3001\u81ea\u5206\u3060\u3051\u53d6\u308a\u6b8b\u3055\u308c\u3066\u3044\u308b\u3088\u3046\u306b\u611f\u3058\u3066\u7126\u3063\u3066\u3044\u308b\u3093\u3067\u3059\u306d\u3002\u300d', icon: '&#x1f914;', description: '\u76f8\u8ac7\u8005\u306e\u8a00\u8449\u3092\u7e70\u308a\u8fd4\u3059\u3053\u3068\u3067\u3001\u610f\u8b58\u304c\u300c\u540c\u671f\u300d\u306b\u5411\u3044\u305f\u307e\u307e\u306b\u306a\u3063\u3066\u3057\u307e\u3044\u307e\u3059\u3002\u4ed6\u8005\u3068\u306e\u6bd4\u8f03\u304b\u3089\u629c\u3051\u51fa\u305b\u305a\u3001\u81ea\u5206\u81ea\u8eab\u306e\u8ab2\u984c\u3068\u5411\u304d\u5408\u3046\u304d\u3063\u304b\u3051\u3092\u63b4\u307f\u306b\u304f\u304f\u306a\u308a\u307e\u3059\u3002', bgColor: 'bg-gray-100', borderColor: 'border-gray-300' },\n                summary: { title: '\u300c\u8981\u7d04\u7684\u8a00\u3044\u63db\u3048\u300d\u3092\u9078\u629e\u3057\u307e\u3057\u305f', response: '\u300c\u5468\u308a\u306e\u8a55\u4fa1\u3068\u81ea\u5206\u306e\u73fe\u72b6\u3068\u306e\u30ae\u30e3\u30c3\u30d7\u306b\u3001\u6094\u3057\u3055\u3084\u7121\u529b\u611f\u3092\u611f\u3058\u3066\u3044\u3089\u3063\u3057\u3083\u308b\u3093\u3067\u3059\u306d\u3002\u300d', icon: '&#x1f9d8;', description: '\u6bd4\u8f03\u5bfe\u8c61\u3067\u3042\u308b\u300c\u540c\u671f\u300d\u304b\u3089\u3001\u76f8\u8ac7\u8005\u81ea\u8eab\u306e\u300c\u611f\u60c5\uff08\u6094\u3057\u3055\u3001\u7121\u529b\u611f\uff09\u300d\u3078\u3068\u7126\u70b9\u3092\u623b\u3059\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u3053\u308c\u306b\u3088\u308a\u3001\u76f8\u8ac7\u8005\u306f\u4ed6\u8005\u3067\u306f\u306a\u304f\u81ea\u5206\u81ea\u8eab\u3068\u5411\u304d\u5408\u3044\u3001\u305d\u306e\u611f\u60c5\u306e\u6839\u672c\u539f\u56e0\u3092\u63a2\u308b\u3068\u3044\u3046\u5185\u7701\u7684\u306a\u5bfe\u8a71\u3078\u3068\u9032\u3080\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002', bgColor: 'bg-red-100', borderColor: 'border-red-300' }\n            }\n        };\n\n        function showResult(module, type) {\n            const moduleId = module.id;\n            if (!moduleData[moduleId] || !moduleData[moduleId][type]) {\n                console.error(`Data not found for module: ${moduleId}, type: ${type}`);\n                return;\n            }\n            const data = moduleData[moduleId][type];\n            \n            const resultSection = module.querySelector('.result');\n            const summarySection = module.querySelector('.summary');\n            const resultContent = module.querySelector('.result-content');\n            const resultTitle = module.querySelector('.result-title');\n            const resultResponse = module.querySelector('.result-response');\n            const resultIcon = module.querySelector('.result-icon');\n            const resultDescription = module.querySelector('.result-description');\n\n            if (!resultSection || !summarySection || !resultContent || !resultTitle || !resultResponse || !resultIcon || !resultDescription) {\n                console.error(`One or more elements are missing in module: ${moduleId}`);\n                return;\n            }\n\n            resultContent.className = `result-content p-6 rounded-lg shadow-md ${data.bgColor} border ${data.borderColor}`;\n            resultTitle.textContent = data.title;\n            resultResponse.innerHTML = data.response.replace(\/\\*\\*(.*?)\\*\\*\/g, '<strong class=\"font-bold text-gray-800\">$1<\/strong>');\n            resultIcon.textContent = data.icon;\n            resultDescription.textContent = data.description;\n\n            const elementsToFade = [resultContent, summarySection];\n            elementsToFade.forEach(el => {\n                el.classList.remove('fade-in');\n                void el.offsetWidth;\n                el.classList.add('fade-in');\n            });\n            \n            resultSection.style.display = 'block';\n            summarySection.style.display = 'block';\n            \n            resultSection.scrollIntoView({ behavior: 'smooth', block: 'center' });\n        }\n\n        document.addEventListener('DOMContentLoaded', () => {\n            const modules = document.querySelectorAll('.interactive-module');\n            modules.forEach(module => {\n                const parrotBtn = module.querySelector('.parrotBtn');\n                const summaryBtn = module.querySelector('.summaryBtn');\n\n                if (parrotBtn && summaryBtn) {\n                    parrotBtn.addEventListener('click', () => showResult(module, 'parrot'));\n                    summaryBtn.addEventListener('click', () => showResult(module, 'summary'));\n                } else {\n                    console.error(`Buttons not found in module: ${module.id}`);\n                }\n            });\n        });\n    <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u306a\u9762\u8ac7\u30b9\u30ad\u30eb\u5b66\u7fd2\u30a2\u30d7\u30ea \u9762\u8ac7\u306e\u8cea\u3092\u5287\u7684\u306b\u5909\u3048\u308b\u300c\u8a00\u3044\u63db\u3048\u300d\u306e\u529b \u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u5b66\u7fd2 \u30b1\u30fc\u30b9\u30b9\u30bf\u30c7\u30a3 1\uff1a\u4eba\u9593\u95a2\u4fc2\u306e\u60a9\u307f \u300c\u4e0a\u53f8\u306f\u8a55\u4fa1\u3057\u3066\u304f\u308c\u306a\u3044\u3057\u3001\u5f8c\u8f29\u306f\u8a00\u3046\u3053\u3068\u805e\u304b\u306a\u3044\u3057\u3001\u3082\u3046\u3069\u3046\u3057\u305f\u3089\u3044\u3044\u304b\u5206\u304b\u3089\u306a [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"vkexunit_cta_each_option":"","footnotes":""},"class_list":["post-2343","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/career-c.sognoplanning.com\/index.php?rest_route=\/wp\/v2\/pages\/2343","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/career-c.sognoplanning.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/career-c.sognoplanning.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/career-c.sognoplanning.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/career-c.sognoplanning.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2343"}],"version-history":[{"count":1,"href":"https:\/\/career-c.sognoplanning.com\/index.php?rest_route=\/wp\/v2\/pages\/2343\/revisions"}],"predecessor-version":[{"id":2344,"href":"https:\/\/career-c.sognoplanning.com\/index.php?rest_route=\/wp\/v2\/pages\/2343\/revisions\/2344"}],"wp:attachment":[{"href":"https:\/\/career-c.sognoplanning.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2343"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}