{"id":12188,"date":"2026-04-22T12:32:54","date_gmt":"2026-04-22T03:32:54","guid":{"rendered":"https:\/\/rakkokeyword.com\/techo\/?p=12188"},"modified":"2026-04-22T12:32:55","modified_gmt":"2026-04-22T03:32:55","slug":"tool-correlation-chart","status":"publish","type":"post","link":"https:\/\/rakkokeyword.com\/techo\/tool-correlation-chart\/","title":{"rendered":"\u76f8\u95a2\u56f3\u30e1\u30fc\u30ab\u30fc"},"content":{"rendered":"<div id=\"sgb-css-id-1\">\n<div id=\"cg_maker_app\" class=\"cg_maker_container\">\n    <style>\n        \/* CSS Reset & Base *\/\n        .cg_maker_container * { box-sizing: border-box; font-family: sans-serif; }\n        .cg_maker_container {\n            width: 100%;\n            display: flex;\n            flex-direction: column;\n            background-color: #ffffff;\n            color: #333333;\n            font-size: 14px;\n            position: relative;\n            overflow: hidden;\n            min-height: 600px;\n        }\n        .cg_maker_container p { margin: 0 0 10px 0; font-weight: bold; }\n        .cg_maker_btn {\n            background-color: #13284B;\n            color: #ffffff;\n            border: none;\n            padding: 8px 16px;\n            cursor: pointer;\n            border-radius: 4px;\n            height: 40px;\n            font-size: 14px;\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n        }\n        .cg_maker_btn:hover { background-color: #1a3a6c; }\n        .cg_maker_btn_secondary { background-color: #f0f0f0; color: #333; border: 1px solid #ccc; }\n        .cg_maker_btn_secondary:hover { background-color: #e0e0e0; }\n        \n        \/* Layout *\/\n        .cg_maker_toolbar {\n            display: flex;\n            flex-wrap: wrap;\n            gap: 15px; \/* \u30b0\u30eb\u30fc\u30d7\u9593\u306e\u4f59\u767d *\/\n            padding: 15px;\n            background-color: #f8f8f8;\n            border-bottom: 1px solid #ddd;\n            justify-content: space-between;\n        }\n        \n        \/* \u30c4\u30fc\u30eb\u30d0\u30fc\u306e\u30dc\u30bf\u30f3\u30b0\u30eb\u30fc\u30d7\u7528CSS *\/\n        .cg_maker_toolbar_group {\n            display: flex;\n            flex-wrap: wrap;\n            gap: 8px; \/* \u30b0\u30eb\u30fc\u30d7\u5185\u30dc\u30bf\u30f3\u306e\u4f59\u767d *\/\n            align-items: center;\n        }\n        .cg_maker_toolbar_group:last-child {\n            width: 100%; \/* PC\u3067\u3082\u6a2a\u5e45\u3044\u3063\u3071\u3044\u306e\u30a8\u30ea\u30a2\u3092\u78ba\u4fdd *\/\n        }\n        .cg_maker_toolbar_group:last-child button {\n            width: 100%; \/* \u30dc\u30bf\u30f3\u81ea\u4f53\u3092\u6a2a\u5e45\u3044\u3063\u3071\u3044\u306b\u5e83\u3052\u308b *\/\n        }\n        @media (max-width: 720px) {\n            .cg_maker_toolbar { \n                flex-direction: column; \n                gap: 15px; \n            }\n            .cg_maker_toolbar_group { \n                justify-content: flex-start; \/* \u30b9\u30de\u30db\u6642\u306f\u5de6\u5bc4\u305b\u3067\u6574\u9813 *\/\n            }\n        }\n        .cg_maker_main {\n            display: flex;\n            flex-direction: column; \/* row\u304b\u3089column(\u7e26\u4e26\u3073)\u306b\u5909\u66f4\u3057\u3066\u63cf\u753b\u30a8\u30ea\u30a2\u3092\u4e0b\u3078 *\/\n            flex-grow: 1;\n            min-height: 600px; \/* \u5168\u4f53\u306e\u6700\u4f4e\u9ad8\u3055\u3092\u78ba\u4fdd *\/\n        }\n        \n        \/* Sidebar (Inputs & Settings) -> \u4e0a\u90e8\u306e\u6a2a\u4e26\u3073\u30a8\u30ea\u30a2\u306b\u5909\u66f4 *\/\n        .cg_maker_sidebar {\n            width: 100%; \/* \u6a2a\u5e45\u3044\u3063\u3071\u3044\u306b\u5e83\u3052\u308b *\/\n            padding: 15px;\n            background-color: #fafafa;\n            border-bottom: 1px solid #ddd; \/* \u533a\u5207\u308a\u7dda\u3092\u53f3\u304b\u3089\u4e0b\u3078\u5909\u66f4 *\/\n            display: flex; \/* \u30d1\u30cd\u30eb\u3092\u6a2a\u4e26\u3073\u306b\u3059\u308b *\/\n            flex-wrap: wrap;\n            gap: 20px;\n            align-items: flex-start;\n        }\n        .cg_maker_panel { \n            flex: 1; \/* \u6a2a\u5e45\u3092\u5747\u7b49\u306b\u5206\u3051\u308b *\/\n            min-width: 250px; \/* \u7e2e\u307f\u3059\u304e\u9632\u6b62 *\/\n            margin-bottom: 0; \n            padding-bottom: 0; \n            border-bottom: none; \n            border-right: 1px dashed #ccc; \/* \u30d1\u30cd\u30eb\u3068\u30d1\u30cd\u30eb\u306e\u9593\u306b\u533a\u5207\u308a\u7dda\u3092\u5f15\u304f *\/\n            padding-right: 20px;\n        }\n        .cg_maker_panel:last-child {\n            border-right: none;\n            padding-right: 0;\n        }\n\n        @media (max-width: 720px) {\n            .cg_maker_sidebar { \n                flex-direction: column; \/* \u30b9\u30de\u30db\u3067\u306f\u7e26\u4e26\u3073\u306b\u623b\u3059 *\/\n            }\n            .cg_maker_panel {\n                border-right: none;\n                border-bottom: 1px dashed #ccc;\n                padding-right: 0;\n                padding-bottom: 15px;\n                margin-bottom: 0;\n                width: 100%;\n            }\n            .cg_maker_panel:last-child {\n                border-bottom: none;\n                padding-bottom: 0;\n            }\n        }\n        \n        \/* Canvas *\/\n        .cg_maker_canvas_wrapper {\n            flex-grow: 1;\n            min-height: 500px; \/* \u63cf\u753b\u30a8\u30ea\u30a2\u304c\u6f70\u308c\u306a\u3044\u3088\u3046\u6700\u4f4e\u9ad8\u3055\u3092\u6307\u5b9a *\/\n            position: relative;\n            overflow: hidden;\n            background-color: #ffffff;\n            background-image: linear-gradient(#f0f0f0 1px, transparent 1px), linear-gradient(90deg, #f0f0f0 1px, transparent 1px);\n            background-size: 20px 20px;\n            cursor: grab;\n        }\n        .cg_maker_canvas_wrapper:active { cursor: grabbing; }\n        \n        \/* \u4ee5\u4e0b\u306e .cg_maker_svg \u3092\u4e38\u3054\u3068\u5dee\u3057\u66ff\u3048\u3066\u304f\u3060\u3055\u3044 *\/\n        .cg_maker_svg { \n            position: absolute; \/* \u89aa\u8981\u7d20\u306b\u5bfe\u3057\u3066\u7d76\u5bfe\u914d\u7f6e\u306b\u3059\u308b *\/\n            top: 0;\n            left: 0;\n            width: 100%; \n            height: 100%; \n            display: block;\n        }\n        \n        \/* SVG Elements *\/\n        .cg_node { cursor: pointer; }\n        .cg_node circle, .cg_node rect { stroke: #333; stroke-width: 2; transition: stroke-width 0.2s; }\n        .cg_node.selected circle, .cg_node.selected rect { stroke-width: 4; stroke: #13284B; }\n        .cg_node text { font-size: 14px; text-anchor: middle; dominant-baseline: central; fill: #333; pointer-events: none; }\n        .cg_edge line, .cg_edge path { stroke: #666; stroke-width: 2; }\n        .cg_edge text { font-size: 12px; fill: #666; text-anchor: middle; background: white; pointer-events: none; }\n        .cg_edge.dashed line, .cg_edge.dashed path { stroke-dasharray: 5, 5; }\n\n        \/* Modal *\/\n        .cg_maker_modal_overlay {\n            position: absolute; top: 0; left: 0; width: 100%; height: 100%;\n            background: rgba(0,0,0,0.6); display: flex; justify-content: center; align-items: center; z-index: 1000;\n        }\n        .cg_maker_modal {\n            background: #fff; padding: 25px; border-radius: 8px; max-width: 400px; width: 90%; text-align: center;\n        }\n        .cg_maker_modal_hidden { display: none !important; }\n        .cg_maker_grid { display: flex; flex-direction: column; gap: 10px; margin-top: 15px; }\n    <\/style>\n\n    <div id=\"cg_maker_modal\" class=\"cg_maker_modal_overlay\">\n        <div class=\"cg_maker_modal\">\n            <p style=\"font-size: 18px;\">\u76f8\u95a2\u56f3\u30e1\u30fc\u30ab\u30fc\u3078\u3088\u3046\u3053\u305d<\/p>\n            <span style=\"font-size: 12px; color: #666;\">\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3092\u9078\u3093\u3067\u4f5c\u6210\u3092\u958b\u59cb\u3057\u3066\u304f\u3060\u3055\u3044<\/span>\n<div class=\"cg_maker_grid\">\n                <button class=\"cg_maker_btn cg_maker_btn_secondary\" onclick=\"cg_maker_loadTemplate('blank')\">\u767d\u7d19\u304b\u3089\u4f5c\u308b<\/button>\n                <button class=\"cg_maker_btn cg_maker_btn_secondary\" onclick=\"cg_maker_loadTemplate('comic')\">\u30c9\u30e9\u30de\u30fb\u30a2\u30cb\u30e1\u30fb\u6f2b\u753b<\/button>\n                <button class=\"cg_maker_btn cg_maker_btn_secondary\" onclick=\"cg_maker_loadTemplate('company')\">\u4f1a\u793e\u7d44\u7e54\u56f3<\/button>\n            <\/div>\n        <\/div>\n    <\/div>\n\n<div class=\"cg_maker_toolbar\">\n        <div class=\"cg_maker_toolbar_group\">\n            <button class=\"cg_maker_btn\" onclick=\"cg_maker_addNode()\">+ \u4eba\u7269\u30fb\u7d44\u7e54\u8ffd\u52a0<\/button>\n            <button class=\"cg_maker_btn cg_maker_btn_secondary\" id=\"cg_maker_edge_btn\" onclick=\"cg_maker_toggleEdgeMode()\">\u7dda\u3067\u3064\u306a\u3050 (OFF)<\/button>\n           <button class=\"cg_maker_btn cg_maker_btn_secondary\" id=\"cg_maker_delete_btn\" onclick=\"cg_maker_toggleDeleteMode()\">\u7dda\u3092\u6d88\u3059 (OFF)<\/button>\n            <button class=\"cg_maker_btn cg_maker_btn_secondary\" onclick=\"cg_maker_undo()\">\u623b\u308b (Undo)<\/button>\n            <button class=\"cg_maker_btn cg_maker_btn_secondary\" onclick=\"cg_maker_autoLayout()\">\u6574\u5217<\/button>\n        <\/div>\n        \n        <div class=\"cg_maker_toolbar_group\">\n            <button class=\"cg_maker_btn cg_maker_btn_secondary\" onclick=\"cg_maker_saveProject()\">\u4e00\u6642\u4fdd\u5b58<\/button>\n            <button class=\"cg_maker_btn cg_maker_btn_secondary\" onclick=\"cg_maker_loadProject()\">\u8aad\u8fbc<\/button>\n        <\/div>\n\n        <div class=\"cg_maker_toolbar_group\">\n            <button class=\"cg_maker_btn\" onclick=\"cg_maker_exportImage()\">\u753b\u50cf\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9<\/button>\n        <\/div>\n    <\/div>\n\n    <div class=\"cg_maker_main\">\n        <div class=\"cg_maker_sidebar\">\n            <div class=\"cg_maker_panel\" id=\"cg_maker_edit_panel\" style=\"display:none;\">\n                <p>\u9078\u629e\u4e2d\u306e\u9805\u76ee\u7de8\u96c6<\/p>\n                <input type=\"text\" id=\"cg_maker_edit_text\" class=\"cg_maker_input\" placeholder=\"\u540d\u524d \/ \u30e9\u30d9\u30eb\" oninput=\"cg_maker_updateSelected()\">\n                \n                <div id=\"cg_maker_node_options\">\n                    <select id=\"cg_maker_edit_shape\" class=\"cg_maker_input\" onchange=\"cg_maker_updateSelected()\">\n                        <option value=\"circle\">\u4e38 (\u4eba\u7269)<\/option>\n                        <option value=\"rect\">\u56db\u89d2 (\u7d44\u7e54)<\/option>\n                    <\/select>\n                    <select id=\"cg_maker_edit_color\" class=\"cg_maker_input\" onchange=\"cg_maker_updateSelected()\">\n                        <option value=\"#ffffff\">\u767d (\u30c7\u30d5\u30a9\u30eb\u30c8)<\/option>\n                        <option value=\"#f8d7da\">\u8d64\u7cfb<\/option>\n                        <option value=\"#d1ecf1\">\u9752\u7cfb<\/option>\n                        <option value=\"#d4edda\">\u7dd1\u7cfb<\/option>\n                        <option value=\"#fff3cd\">\u9ec4\u7cfb<\/option>\n                    <\/select>\n                    <p style=\"font-size: 12px; margin-top: 10px;\">\u753b\u50cf\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9 (\u30a2\u30a4\u30b3\u30f3\u5316)<\/p>\n                    <input type=\"file\" id=\"cg_maker_edit_image\" class=\"cg_maker_input\" accept=\"image\/*\" onchange=\"cg_maker_uploadImage(event)\">\n                <\/div>\n\n                <div id=\"cg_maker_edge_options\" style=\"display:none;\">\n                    <select id=\"cg_maker_edit_line\" class=\"cg_maker_input\" onchange=\"cg_maker_updateSelected()\">\n                        <option value=\"solid\">\u5b9f\u7dda<\/option>\n                        <option value=\"dashed\">\u70b9\u7dda<\/option>\n                        <option value=\"arrow\">\u77e2\u5370<\/option>\n                    <\/select>\n                <\/div>\n                <button class=\"cg_maker_btn cg_maker_btn_secondary\" style=\"width:100%; color:red;\" onclick=\"cg_maker_deleteSelected()\">\u524a\u9664<\/button>\n            <\/div>\n\n            <div class=\"cg_maker_panel\">\n                <p>\u95a2\u4fc2\u3092\u8ffd\u52a0\u3059\u308b<\/p>\n                <span style=\"font-size: 11px; color: #666;\">\u4f8b: \u592a\u90ce,\u82b1\u5b50,\u89aa\u53cb (\u30ab\u30f3\u30de\u533a\u5207\u308a\u30671\u884c1\u95a2\u4fc2)<\/span>\n                <textarea id=\"cg_maker_bulk_input\" class=\"cg_maker_textarea\" placeholder=\"\u4eba\u7269A,\u4eba\u7269B,\u95a2\u4fc2\u6027\"><\/textarea>\n                <button class=\"cg_maker_btn\" style=\"width:100%; margin-top:5px;\" onclick=\"cg_maker_generateFromText()\">\u95a2\u4fc2\u8ffd\u52a0<\/button>\n            <\/div>\n\n            <div class=\"cg_maker_panel\">\n                <p>\u30a8\u30af\u30b9\u30dd\u30fc\u30c8\u8a2d\u5b9a<\/p>\n                <select id=\"cg_maker_export_ratio\" class=\"cg_maker_input\">\n                    <option value=\"auto\">\u305d\u306e\u307e\u307e (\u81ea\u52d5)<\/option>\n                    <option value=\"16:9\">X\/Twitter (16:9)<\/option>\n                    <option value=\"1:1\">Instagram (1:1)<\/option>\n                <\/select>\n                <label style=\"font-size:12px;\"><input type=\"checkbox\" id=\"cg_maker_export_transparent\"> \u80cc\u666f\u3092\u900f\u904e\u3059\u308b<\/label>\n            <\/div>\n        <\/div>\n\n        <div class=\"cg_maker_canvas_wrapper\" id=\"cg_maker_canvas_wrapper\">\n            <svg id=\"cg_maker_svg\" class=\"cg_maker_svg\">\n                <defs id=\"cg_maker_defs\">\n                    <marker id=\"cg_maker_arrow\" markerWidth=\"10\" markerHeight=\"10\" refX=\"25\" refY=\"3\" orient=\"auto\" markerUnits=\"strokeWidth\">\n                        <path d=\"M0,0 L0,6 L9,3 z\" fill=\"#666\" \/>\n                    <\/marker>\n                <\/defs>\n                <g id=\"cg_maker_transform_group\" transform=\"translate(0,0) scale(1)\">\n                    <g id=\"cg_maker_edges_group\" \/>\n                    <g id=\"cg_maker_nodes_group\" \/>\n                <\/g>\n            <\/svg>\n        <\/div>\n    <\/div>\n<\/div>\n    <script>\n        \/** State Management *\/\n        let cg_nodes = [];\n        let cg_edges = [];\n        let cg_history = [];\n        let cg_selectedNodeId = null;\n        let cg_selectedEdgeId = null;\n        \n        let cg_edgeMode = false;\n        let cg_edgeSourceNode = null;\n        let cg_deleteMode = false;\n\n        \/** Viewport Management *\/\n        let cg_panX = 0, cg_panY = 0, cg_scale = 1;\n        let cg_isPanning = false, cg_startX = 0, cg_startY = 0;\n\n        \/** DOM Elements *\/\n        const cg_svg = document.getElementById('cg_maker_svg');\n        const cg_transformGroup = document.getElementById('cg_maker_transform_group');\n        const cg_nodesGroup = document.getElementById('cg_maker_nodes_group');\n        const cg_edgesGroup = document.getElementById('cg_maker_edges_group');\n        const cg_defs = document.getElementById('cg_maker_defs');\n\n        \/\/ Security: HTML Escape\n        function cg_maker_escapeHtml(str) {\n            if (!str) return '';\n            return String(str).replace(\/[&<>\"'`]\/g, function(match) {\n                switch(match) {\n                    case '&': return '&' + 'amp;';\n                    case '<': return '<' + 'lt;';\n                    case '>': return '>' + 'gt;';\n                    case '\"': return '&' + 'quot;';\n                    case \"'\": return '&' + '#39;';\n                    case '`': return '&' + '#x60;';\n                }\n            });\n        }\n\n        \/\/ Initialize \/ DOMContentLoaded\n        document.addEventListener('DOMContentLoaded', () => {\n            cg_maker_saveState(); \/\/ Initial empty state\n            cg_svg.addEventListener('mousedown', cg_onBgDown);\n            cg_svg.addEventListener('mousemove', cg_onBgMove);\n            cg_svg.addEventListener('mouseup', cg_onBgUp);\n            cg_svg.addEventListener('mouseleave', cg_onBgUp);\n            cg_svg.addEventListener('wheel', cg_onWheel);\n            \n            \/\/ Touch support for Mobile\n            cg_svg.addEventListener('touchstart', cg_onTouchStart, {passive: false});\n            cg_svg.addEventListener('touchmove', cg_onTouchMove, {passive: false});\n            cg_svg.addEventListener('touchend', cg_onTouchEnd);\n        });\n\n        function cg_maker_loadTemplate(type) {\n            document.getElementById('cg_maker_modal').classList.add('cg_maker_modal_hidden');\n            cg_nodes = []; cg_edges = []; cg_panX = 0; cg_panY = 0; cg_scale = 1;\n            cg_updateTransform();\n            \n            let cw = document.getElementById('cg_maker_canvas_wrapper').clientWidth \/ 2;\n            let ch = document.getElementById('cg_maker_canvas_wrapper').clientHeight \/ 2;\n\n            if(type === 'comic') {\n                \/\/ \u6f2b\u753b\u98a8\uff1a5\u3064\u306e\u30ce\u30fc\u30c9\u3068\u8907\u96d1\u306a\u95a2\u4fc2\u7dda\uff08\u77e2\u5370\u3084\u70b9\u7dda\u3092\u6d3b\u7528\uff09\n                cg_addNodeData('\u4e3b\u4eba\u516c', cw, ch + 50, 'circle', '#f8d7da'); \/\/ 0\n                cg_addNodeData('\u89aa\u53cb', cw - 120, ch + 80, 'circle', '#d4edda'); \/\/ 1\n                cg_addNodeData('\u30d2\u30ed\u30a4\u30f3', cw + 120, ch + 80, 'circle', '#fff3cd'); \/\/ 2\n                cg_addNodeData('\u30e9\u30a4\u30d0\u30eb', cw - 100, ch - 50, 'circle', '#d1ecf1'); \/\/ 3\n                cg_addNodeData('\u60aa\u306e\u7d44\u7e54', cw + 100, ch - 80, 'rect', '#ffffff'); \/\/ 4 (\u7d44\u7e54\u306f\u56db\u89d2)\n                \n                cg_addEdgeData(cg_nodes[0].id, cg_nodes[1].id, '\u4fe1\u983c', 'solid');\n                cg_addEdgeData(cg_nodes[0].id, cg_nodes[2].id, '\u4e21\u60f3\u3044\uff1f', 'dashed');\n                cg_addEdgeData(cg_nodes[0].id, cg_nodes[3].id, '\u5bbf\u6575', 'solid');\n                cg_addEdgeData(cg_nodes[0].id, cg_nodes[4].id, '\u6575\u5bfe', 'arrow');\n                cg_addEdgeData(cg_nodes[4].id, cg_nodes[3].id, '\u88cf\u3067\u64cd\u308b', 'dashed');\n                \n            } else if (type === 'company') {\n                \/\/ \u4f1a\u793e\u7d44\u7e54\u56f3\uff1a\u90e8\u7f72\uff08\u56db\u89d2\uff09\u3068\u4eba\u7269\uff08\u4e38\uff09\u3092\u533a\u5225\n                cg_addNodeData('\u793e\u9577', cw, ch - 120, 'circle', '#fff3cd'); \/\/ 0\n                cg_addNodeData('\u55b6\u696d\u90e8', cw - 120, ch - 20, 'rect', '#f8d7da'); \/\/ 1\n                cg_addNodeData('\u958b\u767a\u90e8', cw + 120, ch - 20, 'rect', '#d1ecf1'); \/\/ 2\n                cg_addNodeData('\u55b6\u696d\u90e8\u9577', cw - 120, ch + 80, 'circle', '#ffffff'); \/\/ 3\n                cg_addNodeData('\u958b\u767a\u90e8\u9577', cw + 120, ch + 80, 'circle', '#ffffff'); \/\/ 4\n                \n                cg_addEdgeData(cg_nodes[0].id, cg_nodes[1].id, '\u7ba1\u8f44', 'arrow');\n                cg_addEdgeData(cg_nodes[0].id, cg_nodes[2].id, '\u7ba1\u8f44', 'arrow');\n                cg_addEdgeData(cg_nodes[1].id, cg_nodes[3].id, '\u6240\u5c5e', 'solid');\n                cg_addEdgeData(cg_nodes[2].id, cg_nodes[4].id, '\u6240\u5c5e', 'solid');\n                cg_addEdgeData(cg_nodes[3].id, cg_nodes[4].id, '\u9023\u643a', 'dashed');\n                \n            }\n            cg_maker_render();\n            cg_maker_saveState();\n        }\n\n        \/** Data Manipulation *\/\n        function cg_generateId() { return 'id_' + Math.random().toString(36).substr(2, 9); }\n\n        function cg_addNodeData(text, x, y, shape, color, image = null) {\n            const node = { id: cg_generateId(), text: text, x: x, y: y, shape: shape, color: color, image: image };\n            cg_nodes.push(node);\n            return node;\n        }\n\n        function cg_addEdgeData(sourceId, targetId, text, type) {\n            const edge = { id: cg_generateId(), sourceId: sourceId, targetId: targetId, text: text, type: type };\n            cg_edges.push(edge);\n            return edge;\n        }\n\n        function cg_maker_addNode() {\n            let cw = document.getElementById('cg_maker_canvas_wrapper').clientWidth \/ 2;\n            let ch = document.getElementById('cg_maker_canvas_wrapper').clientHeight \/ 2;\n            \/\/ Adjust for pan and zoom\n            let rx = (cw - cg_panX) \/ cg_scale;\n            let ry = (ch - cg_panY) \/ cg_scale;\n            cg_addNodeData('\u540d\u79f0\u672a\u8a2d\u5b9a', rx + (Math.random()*40-20), ry + (Math.random()*40-20), 'circle', '#ffffff');\n            cg_maker_render();\n            cg_maker_saveState();\n        }\n\n        function cg_maker_toggleEdgeMode() {\n            cg_edgeMode = !cg_edgeMode;\n            cg_edgeSourceNode = null;\n\n            \/\/ \u6d88\u3059\u30e2\u30fc\u30c9\u3092\u5f37\u5236\u7684\u306bOFF\u306b\u3059\u308b\n            cg_deleteMode = false;\n            const delBtn = document.getElementById('cg_maker_delete_btn');\n            if(delBtn) {\n                delBtn.textContent = '\u6d88\u3059 (OFF)';\n                delBtn.style.backgroundColor = '#f0f0f0';\n                delBtn.style.color = '#333';\n            }\n            const btn = document.getElementById('cg_maker_edge_btn');\n            if (cg_edgeMode) {\n                btn.textContent = '\u7dda\u3067\u3064\u306a\u3050 (ON: 2\u3064\u9078\u629e)';\n                btn.style.backgroundColor = '#d1ecf1';\n                btn.style.color = '#13284B';\n            } else {\n                btn.textContent = '\u7dda\u3067\u3064\u306a\u3050 (OFF)';\n                btn.style.backgroundColor = '#f0f0f0';\n                btn.style.color = '#333';\n            }\n            cg_maker_deselectAll();\n        }\n        function cg_maker_toggleDeleteMode() {\n            cg_deleteMode = !cg_deleteMode;\n\n            \/\/ \u7dda\u3067\u3064\u306a\u3050\u30e2\u30fc\u30c9\u3092\u5f37\u5236\u7684\u306bOFF\u306b\u3059\u308b\n            cg_edgeMode = false;\n            cg_edgeSourceNode = null;\n            const edgeBtn = document.getElementById('cg_maker_edge_btn');\n            if(edgeBtn) {\n                edgeBtn.textContent = '\u7dda\u3067\u3064\u306a\u3050 (OFF)';\n                edgeBtn.style.backgroundColor = '#f0f0f0';\n                edgeBtn.style.color = '#333';\n            }\n\n            const btn = document.getElementById('cg_maker_delete_btn');\n            if (cg_deleteMode) {\n                btn.textContent = '\u7dda\u3092\u6d88\u3059 (ON: \u7dda\u3092\u30af\u30ea\u30c3\u30af)';\n                btn.style.backgroundColor = '#f8d7da';\n                btn.style.color = '#721c24'; \/\/ \u524a\u9664\u30e2\u30fc\u30c9\u3068\u308f\u304b\u308a\u3084\u3059\u3044\u3088\u3046\u306b\u8d64\u7cfb\u306b\u3059\u308b\n            } else {\n                btn.textContent = '\u7dda\u3092\u6d88\u3059 (OFF)';\n                btn.style.backgroundColor = '#f0f0f0';\n                btn.style.color = '#333';\n            }\n            cg_maker_deselectAll();\n        }\n        \/** Rendering *\/\n        function cg_maker_render() {\n            cg_nodesGroup.innerHTML = '';\n            cg_edgesGroup.innerHTML = '';\n\n            \/\/ Draw Edges\n            cg_edges.forEach(edge => {\n                const source = cg_nodes.find(n => n.id === edge.sourceId);\n                const target = cg_nodes.find(n => n.id === edge.targetId);\n                if (!source || !target) return;\n\n                const g = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'g');\n                g.classList.add('cg_edge');\n                g.setAttribute('data-id', edge.id);\n                g.onclick = (e) => cg_maker_selectEdge(e, edge.id);\n\n                const line = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'line');\n                line.setAttribute('x1', source.x);\n                line.setAttribute('y1', source.y);\n                line.setAttribute('x2', target.x);\n                line.setAttribute('y2', target.y);\n                \n                \/\/ --- \u4fee\u6b63\u30dd\u30a4\u30f3\u30c8\uff1a\u30a4\u30f3\u30e9\u30a4\u30f3\u5c5e\u6027\u3067\u30c7\u30b6\u30a4\u30f3\u3092\u6307\u5b9a ---\n                line.setAttribute('stroke', cg_selectedEdgeId === edge.id ? '#13284B' : '#666');\n                line.setAttribute('stroke-width', cg_selectedEdgeId === edge.id ? '4' : '2');\n                if (edge.type === 'dashed') {\n                    line.setAttribute('stroke-dasharray', '5, 5');\n                }\n                if (edge.type === 'arrow') {\n                    line.setAttribute('marker-end', 'url(#cg_maker_arrow)');\n                }\n                \/\/ ------------------------------------------------\n\n                g.appendChild(line);\n\n                if (edge.text) {\n                    const midX = (source.x + target.x) \/ 2;\n                    const midY = (source.y + target.y) \/ 2;\n                    const text = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'text');\n                    text.setAttribute('x', midX);\n                    text.setAttribute('y', midY - 5);\n                    text.setAttribute('fill', '#666'); \/\/ \u30a4\u30f3\u30e9\u30a4\u30f3\u3067\u6307\u5b9a\n                    text.setAttribute('font-size', '12px'); \/\/ \u30a4\u30f3\u30e9\u30a4\u30f3\u3067\u6307\u5b9a\n                    text.setAttribute('text-anchor', 'middle'); \/\/ \u30a4\u30f3\u30e9\u30a4\u30f3\u3067\u6307\u5b9a\n                    text.textContent = cg_maker_escapeHtml(edge.text);\n                    g.appendChild(text);\n                }\n                cg_edgesGroup.appendChild(g);\n            });\n\n            \/\/ Draw Nodes\n            cg_nodes.forEach(node => {\n                const g = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'g');\n                g.classList.add('cg_node');\n                g.setAttribute('transform', `translate(${node.x}, ${node.y})`);\n                g.setAttribute('data-id', node.id);\n                \n                g.onmousedown = (e) => cg_onNodeDown(e, node.id);\n                g.ontouchstart = (e) => cg_onNodeDown(e, node.id);\n\n                let shapeEl;\n                if (node.shape === 'rect') {\n                    shapeEl = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'rect');\n                    shapeEl.setAttribute('width', 80);\n                    shapeEl.setAttribute('height', 50);\n                    shapeEl.setAttribute('x', -40);\n                    shapeEl.setAttribute('y', -25);\n                    shapeEl.setAttribute('rx', 5);\n                } else {\n                    shapeEl = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'circle');\n                    shapeEl.setAttribute('r', 30);\n                }\n                \n                shapeEl.setAttribute('fill', node.color);\n\n                \/\/ --- \u4fee\u6b63\u30dd\u30a4\u30f3\u30c8\uff1a\u30a4\u30f3\u30e9\u30a4\u30f3\u5c5e\u6027\u3067\u67a0\u7dda\u3092\u6307\u5b9a ---\n                shapeEl.setAttribute('stroke', cg_selectedNodeId === node.id ? '#13284B' : '#333');\n                shapeEl.setAttribute('stroke-width', cg_selectedNodeId === node.id ? '4' : '2');\n                \/\/ ----------------------------------------------\n\n                g.appendChild(shapeEl);\n\n                if (node.image) {\n                    const patternId = 'pat_' + node.id;\n                    const pattern = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'pattern');\n                    pattern.setAttribute('id', patternId);\n                    pattern.setAttribute('patternUnits', 'objectBoundingBox');\n                    pattern.setAttribute('width', '1');\n                    pattern.setAttribute('height', '1');\n                    \n                    const imgEl = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'image');\n                    imgEl.setAttribute('href', node.image);\n                    \n                    if(node.shape === 'circle'){\n                         imgEl.setAttribute('width', '60');\n                         imgEl.setAttribute('height', '60');\n                    } else {\n                         imgEl.setAttribute('width', '80');\n                         imgEl.setAttribute('height', '50');\n                         imgEl.setAttribute('preserveAspectRatio', 'xMidYMid slice');\n                    }\n                    pattern.appendChild(imgEl);\n                    cg_defs.appendChild(pattern);\n                    shapeEl.setAttribute('fill', `url(#${patternId})`);\n                }\n\n                const text = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'text');\n                text.setAttribute('y', node.image ? (node.shape === 'circle' ? 45 : 35) : 0);\n                \n                \/\/ --- \u4fee\u6b63\u30dd\u30a4\u30f3\u30c8\uff1a\u30a4\u30f3\u30e9\u30a4\u30f3\u3067\u30c6\u30ad\u30b9\u30c8\u306e\u30c7\u30b6\u30a4\u30f3\u3092\u6307\u5b9a ---\n                text.setAttribute('fill', '#333');\n                text.setAttribute('font-size', '14px');\n                text.setAttribute('text-anchor', 'middle');\n                text.setAttribute('dominant-baseline', 'central');\n                text.style.pointerEvents = 'none'; \/\/ \u30c6\u30ad\u30b9\u30c8\u304c\u30af\u30ea\u30c3\u30af\u3092\u90aa\u9b54\u3057\u306a\u3044\u3088\u3046\u306b\n                \/\/ ------------------------------------------------------\n\n                text.textContent = cg_maker_escapeHtml(node.text);\n                g.appendChild(text);\n\n                cg_nodesGroup.appendChild(g);\n            });\n        }\n\n        \/** Interaction (Drag & Drop, Select) *\/\n        let cg_draggingNode = null;\n\n        function cg_maker_selectNode(id) {\n            cg_selectedNodeId = id;\n            cg_selectedEdgeId = null;\n            document.getElementById('cg_maker_edit_panel').style.display = 'block';\n            document.getElementById('cg_maker_node_options').style.display = 'block';\n            document.getElementById('cg_maker_edge_options').style.display = 'none';\n            \n            const node = cg_nodes.find(n => n.id === id);\n            document.getElementById('cg_maker_edit_text').value = node.text;\n            document.getElementById('cg_maker_edit_shape').value = node.shape;\n            document.getElementById('cg_maker_edit_color').value = node.color;\n            cg_maker_render();\n        }\n\n        function cg_maker_selectEdge(e, id) {\n            e.stopPropagation();\n            if(cg_edgeMode) return;\n\n            if(cg_deleteMode) {\n                cg_edges = cg_edges.filter(edge => edge.id !== id);\n                cg_maker_render();\n                cg_maker_saveState();\n                return;\n            }\n\n            cg_selectedEdgeId = id;\n            cg_selectedNodeId = null;\n            document.getElementById('cg_maker_edit_panel').style.display = 'block';\n            document.getElementById('cg_maker_node_options').style.display = 'none';\n            document.getElementById('cg_maker_edge_options').style.display = 'block';\n            \n            const edge = cg_edges.find(e => e.id === id);\n            document.getElementById('cg_maker_edit_text').value = edge.text;\n            document.getElementById('cg_maker_edit_line').value = edge.type;\n            cg_maker_render();\n        }\n\n        function cg_maker_deselectAll() {\n            cg_selectedNodeId = null;\n            cg_selectedEdgeId = null;\n            document.getElementById('cg_maker_edit_panel').style.display = 'none';\n            cg_maker_render();\n        }\n\n        function cg_onNodeDown(e, id) {\n            e.stopPropagation();\n            if (e.type === 'touchstart') e.preventDefault();\n\n            if (cg_deleteMode) {\n                return; \/\/ \u7dda\u3092\u6d88\u3059\u30e2\u30fc\u30c9\u4e2d\u306f\u3001\u4eba\u7269\u30fb\u7d44\u7e54\u3092\u30af\u30ea\u30c3\u30af\u3057\u3066\u3082\u7121\u8996\u3059\u308b\n            }\n\n            if (cg_edgeMode) {\n                if (!cg_edgeSourceNode) {\n                    cg_edgeSourceNode = id;\n                } else if (cg_edgeSourceNode !== id) {\n                    cg_addEdgeData(cg_edgeSourceNode, id, '', 'solid');\n                    cg_edgeSourceNode = null;\n                    cg_maker_saveState();\n                    cg_maker_render();\n                }\n                return;\n            }\n\n            cg_maker_selectNode(id);\n            cg_draggingNode = cg_nodes.find(n => n.id === id);\n        }\n\n        \/\/ Background Pan Events\n        function cg_getEventPos(e) {\n            return e.touches ? { x: e.touches[0].clientX, y: e.touches[0].clientY } : { x: e.clientX, y: e.clientY };\n        }\n\n        function cg_onBgDown(e) {\n            if(e.target === cg_svg || e.target.tagName === 'svg') {\n                cg_maker_deselectAll();\n                cg_isPanning = true;\n                const pos = cg_getEventPos(e);\n                cg_startX = pos.x - cg_panX;\n                cg_startY = pos.y - cg_panY;\n            }\n        }\n\n        function cg_onBgMove(e) {\n            const pos = cg_getEventPos(e);\n            if (cg_draggingNode) {\n                \/\/ Convert screen pos to SVG pos\n                const rect = cg_svg.getBoundingClientRect();\n                cg_draggingNode.x = (pos.x - rect.left - cg_panX) \/ cg_scale;\n                cg_draggingNode.y = (pos.y - rect.top - cg_panY) \/ cg_scale;\n                cg_maker_render();\n            } else if (cg_isPanning) {\n                cg_panX = pos.x - cg_startX;\n                cg_panY = pos.y - cg_startY;\n                cg_updateTransform();\n            }\n        }\n\n        function cg_onBgUp(e) {\n            if (cg_draggingNode) {\n                cg_draggingNode = null;\n                cg_maker_saveState();\n            }\n            cg_isPanning = false;\n        }\n\n        function cg_onWheel(e) {\n            e.preventDefault();\n            const zoomAmount = e.deltaY > 0 ? 0.9 : 1.1;\n            cg_scale *= zoomAmount;\n            cg_scale = Math.max(0.2, Math.min(cg_scale, 3)); \/\/ Limit zoom\n            cg_updateTransform();\n        }\n\n        \/\/ Touch wrappers\n        function cg_onTouchStart(e) { if(e.touches.length === 1) cg_onBgDown(e); }\n        function cg_onTouchMove(e) { if(e.touches.length === 1) { e.preventDefault(); cg_onBgMove(e); } }\n        function cg_onTouchEnd(e) { cg_onBgUp(e); }\n\n        function cg_updateTransform() {\n            cg_transformGroup.setAttribute('transform', `translate(${cg_panX},${cg_panY}) scale(${cg_scale})`);\n        }\n\n        \/** Editor Panel Actions *\/\n        function cg_maker_updateSelected() {\n            const text = document.getElementById('cg_maker_edit_text').value;\n            if (cg_selectedNodeId) {\n                const node = cg_nodes.find(n => n.id === cg_selectedNodeId);\n                node.text = text;\n                node.shape = document.getElementById('cg_maker_edit_shape').value;\n                node.color = document.getElementById('cg_maker_edit_color').value;\n            } else if (cg_selectedEdgeId) {\n                const edge = cg_edges.find(e => e.id === cg_selectedEdgeId);\n                edge.text = text;\n                edge.type = document.getElementById('cg_maker_edit_line').value;\n            }\n            cg_maker_render();\n            \/\/ Don't save state on every keystroke to avoid history bloat\n        }\n\n        function cg_maker_deleteSelected() {\n            if (cg_selectedNodeId) {\n                cg_nodes = cg_nodes.filter(n => n.id !== cg_selectedNodeId);\n                cg_edges = cg_edges.filter(e => e.sourceId !== cg_selectedNodeId && e.targetId !== cg_selectedNodeId);\n            } else if (cg_selectedEdgeId) {\n                cg_edges = cg_edges.filter(e => e.id !== cg_selectedEdgeId);\n            }\n            cg_maker_deselectAll();\n            cg_maker_saveState();\n        }\n\n        \/\/ File Upload and Crop to DataURL (To prevent Canvas Taint & simplify)\n        function cg_maker_uploadImage(e) {\n            const file = e.target.files[0];\n            if (!file || !cg_selectedNodeId) return;\n            \n            const reader = new FileReader();\n            reader.onload = function(event) {\n                const img = new Image();\n                img.onload = function() {\n                    \/\/ Create squared cropped data URL\n                    const canvas = document.createElement('canvas');\n                    const size = Math.min(img.width, img.height);\n                    canvas.width = size;\n                    canvas.height = size;\n                    const ctx = canvas.getContext('2d');\n                    const sx = (img.width - size) \/ 2;\n                    const sy = (img.height - size) \/ 2;\n                    ctx.drawImage(img, sx, sy, size, size, 0, 0, size, size);\n                    \n                    const dataUrl = canvas.toDataURL('image\/png');\n                    const node = cg_nodes.find(n => n.id === cg_selectedNodeId);\n                    node.image = dataUrl;\n                    \n                    \/\/ Reset input\n                    document.getElementById('cg_maker_edit_image').value = '';\n                    cg_maker_render();\n                    cg_maker_saveState();\n                };\n                img.src = event.target.result;\n            };\n            reader.readAsDataURL(file);\n        }\n\n        \/** Text to Graph Generation (Circular Layout) *\/\n        function cg_maker_generateFromText() {\n            const text = document.getElementById('cg_maker_bulk_input').value;\n            if(!text.trim()) return;\n            \n            const lines = text.split('\\n');\n            if(lines.length > 50) { alert('\u51e6\u7406\u8ca0\u8377\u8efd\u6e1b\u306e\u305f\u308150\u884c\u4ee5\u5185\u3067\u5165\u529b\u3057\u3066\u304f\u3060\u3055\u3044\u3002'); return; }\n\n            const nameMap = {};\n            \/\/ \u5909\u66f4\u70b9\u2460\uff1a\u65e2\u5b58\u306e\u30ce\u30fc\u30c9\u3092\u540d\u524d\uff08text\uff09\u3092\u30ad\u30fc\u306b\u3057\u3066\u30de\u30c3\u30d7\u306b\u767b\u9332\uff08\u4e0a\u66f8\u304d\u305b\u305a\u7dad\u6301\u3059\u308b\uff09\n            cg_nodes.forEach(node => {\n                nameMap[node.text] = node;\n            });\n\n            const newNodes = []; \/\/ \u4eca\u56de\u65b0\u3057\u304f\u8ffd\u52a0\u3059\u308b\u30ce\u30fc\u30c9\u3060\u3051\u3092\u307e\u3068\u3081\u308b\u914d\u5217\n            \n            lines.forEach(line => {\n                const parts = line.split(',');\n                if(parts.length >= 2) {\n                    const a = parts[0].trim();\n                    const b = parts[1].trim();\n                    const rel = parts[2] ? parts[2].trim() : '';\n                    \n                    \/\/ a\u304c\u5b58\u5728\u3057\u306a\u3051\u308c\u3070\u65b0\u898f\u4f5c\u6210\uff08\u3059\u3067\u306b\u30ad\u30e3\u30f3\u30d0\u30b9\u306b\u3042\u308c\u3070\u305d\u308c\u3092\u4f7f\u3046\uff09\n                    if(a && !nameMap[a]) { \n                        const node = cg_addNodeData(a, 0, 0, 'circle', '#ffffff');\n                        nameMap[a] = node; \n                        newNodes.push(node);\n                    }\n                    \/\/ b\u304c\u5b58\u5728\u3057\u306a\u3051\u308c\u3070\u65b0\u898f\u4f5c\u6210\n                    if(b && !nameMap[b]) { \n                        const node = cg_addNodeData(b, 0, 0, 'circle', '#ffffff');\n                        nameMap[b] = node; \n                        newNodes.push(node);\n                    }\n                    \/\/ 2\u3064\u3092\u7dda\u3067\u3064\u306a\u3050\n                    if(a && b) { \n                        cg_addEdgeData(nameMap[a].id, nameMap[b].id, rel, 'solid'); \n                    }\n                }\n            });\n\n            \/\/ \u5909\u66f4\u70b9\u2461\uff1a\u4eca\u56de\u300c\u65b0\u3057\u304f\u8ffd\u52a0\u3055\u308c\u305f\u30ce\u30fc\u30c9\u300d\u3060\u3051\u3092\u3001\u753b\u9762\u306e\u4e2d\u592e\u4ed8\u8fd1\u306b\u5186\u72b6\u306b\u914d\u7f6e\u3059\u308b\n            if (newNodes.length > 0) {\n                const radius = Math.max(100, newNodes.length * 20);\n                let cw = document.getElementById('cg_maker_canvas_wrapper').clientWidth \/ 2;\n                let ch = document.getElementById('cg_maker_canvas_wrapper').clientHeight \/ 2;\n                \n                \/\/ \u73fe\u5728\u306e\u30d1\u30f3\uff08\u30b9\u30af\u30ed\u30fc\u30eb\u4f4d\u7f6e\uff09\u3084\u30ba\u30fc\u30e0\u306b\u5408\u308f\u305b\u3066\u4e2d\u592e\u3092\u8a08\u7b97\n                let rx = (cw - cg_panX) \/ cg_scale;\n                let ry = (ch - cg_panY) \/ cg_scale;\n\n                newNodes.forEach((node, i) => {\n                    const angle = (i \/ newNodes.length) * 2 * Math.PI;\n                    node.x = rx + radius * Math.cos(angle);\n                    node.y = ry + radius * Math.sin(angle);\n                });\n            }\n\n            \/\/ \u9023\u7d9a\u3067\u8ffd\u52a0\u3057\u3084\u3059\u3044\u3088\u3046\u3001\u51e6\u7406\u5b8c\u4e86\u5f8c\u306b\u30c6\u30ad\u30b9\u30c8\u5165\u529b\u6b04\u3092\u7a7a\u306b\u3059\u308b\n            document.getElementById('cg_maker_bulk_input').value = '';\n\n            cg_maker_render();\n            cg_maker_saveState();\n        }\n\n        \/** Auto Layout (Grid Align) *\/\n        function cg_maker_autoLayout() {\n            const gridSize = 50;\n            cg_nodes.forEach(node => {\n                node.x = Math.round(node.x \/ gridSize) * gridSize;\n                node.y = Math.round(node.y \/ gridSize) * gridSize;\n            });\n            cg_maker_render();\n            cg_maker_saveState();\n        }\n\n        \/** History (Undo) *\/\n        function cg_maker_saveState() {\n            if(cg_history.length > 10) cg_history.shift(); \/\/ Max 10 steps to save memory\n            cg_history.push(JSON.stringify({nodes: cg_nodes, edges: cg_edges}));\n        }\n\n        function cg_maker_undo() {\n            if (cg_history.length > 1) {\n                cg_history.pop(); \/\/ Remove current state\n                const prevState = JSON.parse(cg_history[cg_history.length - 1]);\n                cg_nodes = prevState.nodes;\n                cg_edges = prevState.edges;\n                cg_maker_deselectAll(); \/\/ renders too\n            }\n        }\n\n        \/** Save & Load Project *\/\n        function cg_maker_saveProject() {\n            const data = JSON.stringify({nodes: cg_nodes, edges: cg_edges});\n            localStorage.setItem('cg_maker_project', data);\n            alert('\u30d6\u30e9\u30a6\u30b6\u306b\u4e00\u6642\u4fdd\u5b58\u3057\u307e\u3057\u305f\u3002');\n        }\n\n        function cg_maker_loadProject() {\n            const data = localStorage.getItem('cg_maker_project');\n            if (data) {\n                const parsed = JSON.parse(data);\n                cg_nodes = parsed.nodes || [];\n                cg_edges = parsed.edges || [];\n                cg_panX = 0; cg_panY = 0; cg_scale = 1; cg_updateTransform();\n                cg_maker_render();\n                cg_maker_saveState();\n            } else {\n                alert('\u4fdd\u5b58\u3055\u308c\u305f\u30c7\u30fc\u30bf\u304c\u3042\u308a\u307e\u305b\u3093\u3002');\n            }\n        }\n\n        \/** Export Image via SVG -> Canvas Native Flow *\/\n        function cg_maker_exportImage() {\n            cg_maker_deselectAll(); \/\/ \u9078\u629e\u30cf\u30a4\u30e9\u30a4\u30c8\u3092\u6d88\u3059\n            \n            const ratio = document.getElementById('cg_maker_export_ratio').value;\n            const isTransparent = document.getElementById('cg_maker_export_transparent').checked;\n            \n            if(cg_nodes.length === 0) { alert('\u51fa\u529b\u3059\u308b\u30ce\u30fc\u30c9\u304c\u3042\u308a\u307e\u305b\u3093'); return; }\n\n            \/\/ 1. \u5168\u30ce\u30fc\u30c9\u3092\u56f2\u3080\u5883\u754c\u7dda\u3092\u8a08\u7b97\n            let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;\n            cg_nodes.forEach(n => {\n                minX = Math.min(minX, n.x - 60); minY = Math.min(minY, n.y - 60);\n                maxX = Math.max(maxX, n.x + 60); maxY = Math.max(maxY, n.y + 60);\n            });\n            \n            let width = maxX - minX;\n            let height = maxY - minY;\n\n            \/\/ 2. SNS\u7528\u306e\u30a2\u30b9\u30da\u30af\u30c8\u6bd4\u8abf\u6574\n            if (ratio === '16:9') {\n                const targetHeight = width * (9\/16);\n                if(targetHeight > height) {\n                    const diff = targetHeight - height;\n                    minY -= diff\/2; height = targetHeight;\n                } else {\n                    const targetWidth = height * (16\/9);\n                    const diff = targetWidth - width;\n                    minX -= diff\/2; width = targetWidth;\n                }\n            } else if (ratio === '1:1') {\n                const size = Math.max(width, height);\n                minX -= (size - width) \/ 2;\n                minY -= (size - height) \/ 2;\n                width = size; height = size;\n            }\n\n            \/\/ 3. SVG\u306e\u8907\u88fd\u3068CSS\u306e\u6ce8\u5165\uff08\u3053\u3053\u304c\u91cd\u8981\uff01\uff09\n            const cloneSvg = cg_svg.cloneNode(true);\n            \n            \/\/ \u30c4\u30fc\u30eb\u5185\u306e\u5168\u30b9\u30bf\u30a4\u30eb\u3092\u53d6\u5f97\u3057\u3066SVG\u5185\u306b\u9589\u3058\u8fbc\u3081\u308b\n            const styleElement = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'style');\n            const originalStyle = document.querySelector('#cg_maker_app style');\n            if (originalStyle) {\n                styleElement.textContent = originalStyle.textContent;\n                cloneSvg.insertBefore(styleElement, cloneSvg.firstChild);\n            }\n\n            cloneSvg.setAttribute('width', width);\n            cloneSvg.setAttribute('height', height);\n            cloneSvg.setAttribute('viewBox', `${minX} ${minY} ${width} ${height}`);\n            \n            \/\/ \u30ba\u30fc\u30e0\/\u30d1\u30f3\u306e\u30ea\u30bb\u30c3\u30c8\n            const transformGroup = cloneSvg.querySelector('#cg_maker_transform_group');\n            if(transformGroup) transformGroup.setAttribute('transform', 'translate(0,0) scale(1)');\n\n            \/\/ 4. \u753b\u50cf\u5316\u51e6\u7406\n            const serializer = new XMLSerializer();\n            const svgString = serializer.serializeToString(cloneSvg);\n            \n            const canvas = document.createElement('canvas');\n            canvas.width = width;\n            canvas.height = height;\n            const ctx = canvas.getContext('2d');\n            \n            \/\/ \u80cc\u666f\u306e\u63cf\u753b\n            if(!isTransparent) {\n                ctx.fillStyle = '#ffffff';\n                ctx.fillRect(0, 0, width, height);\n                \/\/ \u30b0\u30ea\u30c3\u30c9\u7dda\u306e\u63cf\u753b\uff08\u753b\u50cf\u306b\u3082\u65b9\u773c\u3092\u5165\u308c\u308b\u5834\u5408\uff09\n                ctx.strokeStyle = '#f0f0f0';\n                ctx.lineWidth = 1;\n                for(let x = (minX % 20); x < width; x += 20) { ctx.beginPath(); ctx.moveTo(x,0); ctx.lineTo(x,height); ctx.stroke(); }\n                for(let y = (minY % 20); y < height; y += 20) { ctx.beginPath(); ctx.moveTo(0,y); ctx.lineTo(width,y); ctx.stroke(); }\n            }\n\n            const img = new Image();\n            const svgBlob = new Blob([svgString], {type: 'image\/svg+xml;charset=utf-8'});\n            const url = URL.createObjectURL(svgBlob);\n            \n            img.onload = function() {\n                ctx.drawImage(img, 0, 0);\n                URL.revokeObjectURL(url);\n                \n                const a = document.createElement('a');\n                a.download = 'correlation_graph.png';\n                a.href = canvas.toDataURL('image\/png');\n                a.click();\n            };\n            img.src = url;\n        }\n    <\/script>\n<\/div>\n\n\n<p>\u4eba\u7269\u76f8\u95a2\u56f3\u3092\u4f5c\u6210\u3067\u304d\u308b\u7121\u6599\u306eWeb\u30c4\u30fc\u30eb\u3067\u3059\u3002\u66f8\u304d\u65b9\u304c\u5206\u304b\u3089\u306a\u3044\u65b9\u3067\u3082\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3092\u9078\u3079\u308b\u306e\u3067\u3001\u30a2\u30d7\u30ea\u4e0d\u8981\u30fb\u30d6\u30e9\u30a6\u30b6\u4e0a\u3067\u7c21\u5358\u306b\u95a2\u4fc2\u56f3\u3092\u4f5c\u6210\u3057\u3066\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-0\">\u3053\u306e\u30c4\u30fc\u30eb\u3067\u3067\u304d\u308b\u3053\u3068<\/h2>\n\n\n\n<p>\u5f53\u76f8\u95a2\u56f3\u30e1\u30fc\u30ab\u30fc\u306b\u306f\u3001\u521d\u5fc3\u8005\u304b\u3089\u3053\u3060\u308f\u308a\u6d3e\u307e\u3067\u4fbf\u5229\u306b\u4f7f\u3048\u308b\u4ee5\u4e0b\u306e\u6a5f\u80fd\u304c\u5099\u308f\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u304b\u3089\u4e00\u767a\u4f5c\u6210<\/strong>\uff1a\u30c9\u30e9\u30de\u3084\u30a2\u30cb\u30e1\u98a8\u3001\u4f1a\u793e\u7d44\u7e54\u56f3\u306a\u3069\u3001\u3088\u304f\u4f7f\u308f\u308c\u308b\u578b\uff08\u3072\u306a\u5f62\uff09\u3092\u6700\u521d\u304b\u3089\u7528\u610f\u3057\u3066\u3044\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u30c9\u30e9\u30c3\u30b0\uff06\u30c9\u30ed\u30c3\u30d7\u306e\u76f4\u611f\u64cd\u4f5c<\/strong>\uff1a\u4eba\u7269\u3084\u7d44\u7e54\u3092\u8868\u3059\u56f3\u5f62\u3092\u30de\u30a6\u30b9\u3084\u6307\u3067\u81ea\u7531\u306b\u52d5\u304b\u3057\u3001\u597d\u304d\u306a\u4f4d\u7f6e\u306b\u914d\u7f6e\u3067\u304d\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u63a8\u3057\u306e\u753b\u50cf\u3067\u30a2\u30a4\u30b3\u30f3\u4f5c\u6210<\/strong>\uff1a\u304a\u624b\u6301\u3061\u306e\u753b\u50cf\u3092\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u3059\u308b\u3068\u3001\u81ea\u52d5\u3067\u4e38\u3084\u56db\u89d2\u306b\u5207\u308a\u629c\u304b\u308c\u3001\u56f3\u5f62\u306e\u30a2\u30a4\u30b3\u30f3\u3068\u3057\u3066\u4f7f\u7528\u3067\u304d\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u30c6\u30ad\u30b9\u30c8\u5165\u529b\u3067\u81ea\u52d5\u30ec\u30a4\u30a2\u30a6\u30c8\u751f\u6210<\/strong>\uff1a\u300c\u4eba\u7269A,\u4eba\u7269B,\u95a2\u4fc2\u6027\u300d\u306e\u3088\u3046\u306b\u6587\u5b57\u3092\u5165\u529b\u3059\u308b\u3060\u3051\u3067\u3001\u30b7\u30b9\u30c6\u30e0\u304c\u81ea\u52d5\u7684\u306b\u56f3\u5f62\u3068\u7dda\u3092\u751f\u6210\u3057\u3001\u5186\u72b6\u306b\u898b\u3084\u3059\u304f\u914d\u7f6e\u3057\u307e\u3059\u3002\u56f3\u5f62\u64cd\u4f5c\u304c\u82e6\u624b\u306a\u65b9\u306b\u304a\u3059\u3059\u3081\u3067\u3059\u3002<\/li>\n\n\n\n<li><strong>SNS\u5411\u3051\u306e\u30b5\u30a4\u30ba\u81ea\u52d5\u6700\u9069\u5316\uff08\u30a8\u30af\u30b9\u30dd\u30fc\u30c8\uff09<\/strong>\uff1a\u4f5c\u6210\u3057\u305f\u76f8\u95a2\u56f3\u306f\u3001X\uff08\u65e7Twitter\uff09\u5411\u3051\u306e16:9\u3084\u3001Instagram\u5411\u3051\u306e1:1\u30b5\u30a4\u30ba\u306b\u5408\u308f\u305b\u3066\u81ea\u52d5\u8abf\u6574\u3057\u3001\u80cc\u666f\u900f\u904e\u306e\u753b\u50cf\uff08PNG\uff09\u3068\u3057\u3066\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3067\u304d\u307e\u3059\u3002<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-1\">\u76f8\u95a2\u56f3\u30e1\u30fc\u30ab\u30fc\u306e\u57fa\u672c\u7684\u306a\u4f7f\u3044\u65b9<\/h2>\n\n\n\n<p>\u76f8\u95a2\u56f3\u30e1\u30fc\u30ab\u30fc\u306e\u4f7f\u3044\u65b9\u306f\u975e\u5e38\u306b\u30b7\u30f3\u30d7\u30eb\u3067\u3059\u3002\u4ee5\u4e0b\u306e\u624b\u9806\u3067\u76f8\u95a2\u56f3\u3092\u4f5c\u6210\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<ol start=\"1\" class=\"wp-block-list\">\n<li><strong>\u30d9\u30fc\u30b9\u3092\u9078\u3076<\/strong>\uff1a\u30a2\u30af\u30bb\u30b9\u6642\u306b\u8868\u793a\u3055\u308c\u308b\u753b\u9762\u304b\u3089\u300c\u767d\u7d19\u304b\u3089\u4f5c\u308b\u300d\u300c\u30c9\u30e9\u30de\u30fb\u30a2\u30cb\u30e1\u30fb\u6f2b\u753b\u300d\u300c\u4f1a\u793e\u7d44\u7e54\u56f3\u300d\u306e\u3044\u305a\u308c\u304b\u3092\u9078\u629e\u3057\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u4eba\u7269\u30fb\u7d44\u7e54\u3092\u8ffd\u52a0\u3059\u308b<\/strong>\uff1a\u4e0a\u90e8\u306e\u300c+ \u4eba\u7269\u30fb\u7d44\u7e54\u8ffd\u52a0\u300d\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u3001\u753b\u9762\u306b\u56f3\u5f62\u304c\u8ffd\u52a0\u3055\u308c\u307e\u3059\u3002\u56f3\u5f62\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u3001\u753b\u9762\u6a2a\uff08\u307e\u305f\u306f\u4e0a\u90e8\uff09\u306e\u30d1\u30cd\u30eb\u3067\u300c\u540d\u524d\u300d\u300c\u5f62\uff08\u4e38\u30fb\u56db\u89d2\uff09\u300d\u300c\u8272\u300d\u3092\u5909\u66f4\u3057\u305f\u308a\u3001\u300c\u753b\u50cf\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u300d\u3092\u884c\u3046\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u7dda\u3067\u3064\u306a\u3050\u30fb\u95a2\u4fc2\u6027\u3092\u66f8\u304f<\/strong>\uff1a\u300c\u7dda\u3067\u3064\u306a\u3050\u300d\u30dc\u30bf\u30f3\u3092\u62bc\u3057\uff08ON\u72b6\u614b\u306b\u3057\u307e\u3059\uff09\u3001\u3064\u306a\u304e\u305f\u30442\u3064\u306e\u56f3\u5f62\u3092\u9806\u756a\u306b\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u7dda\u304c\u5f15\u304b\u308c\u307e\u3059\u3002\u5f15\u304b\u308c\u305f\u7dda\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u3001\u7dda\u306e\u7a2e\u985e\uff08\u5b9f\u7dda\u30fb\u70b9\u7dda\u30fb\u77e2\u5370\uff09\u3092\u5909\u66f4\u3057\u305f\u308a\u3001\u7dda\u306e\u4e0a\u306b\u300c\u89aa\u53cb\u300d\u300c\u5bfe\u7acb\u300d\u306a\u3069\u306e\u30c6\u30ad\u30b9\u30c8\u30e9\u30d9\u30eb\u3092\u8ffd\u52a0\u3067\u304d\u307e\u3059\u3002\u4e0d\u8981\u306a\u7dda\u306f\u300c\u7dda\u3092\u6d88\u3059\u300d\u30e2\u30fc\u30c9\u3067\u30af\u30ea\u30c3\u30af\u3059\u308b\u304b\u3001\u56f3\u5f62\u3092\u9078\u629e\u3057\u3066\u300c\u524a\u9664\u300d\u30dc\u30bf\u30f3\u3067\u6d88\u53bb\u3057\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u4fdd\u5b58\u30fb\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3059\u308b<\/strong>\uff1a\u5b8c\u6210\u3057\u305f\u3089\u300c\u753b\u50cf\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u300d\u30dc\u30bf\u30f3\u3092\u62bc\u3057\u3066\u753b\u50cf\u3092\u4fdd\u5b58\u3057\u307e\u3059\u3002\u4f5c\u696d\u3092\u4e2d\u65ad\u3059\u308b\u5834\u5408\u306f\u300c\u4e00\u6642\u4fdd\u5b58\u300d\u3092\u62bc\u3059\u3053\u3068\u3067\u3001\u304a\u4f7f\u3044\u306e\u30d6\u30e9\u30a6\u30b6\u306b\u30c7\u30fc\u30bf\u3092\u8a18\u9332\u3057\u3001\u5f8c\u304b\u3089\u300c\u8aad\u8fbc\u300d\u3067\u518d\u958b\u3067\u304d\u307e\u3059\u3002<\/li>\n<\/ol>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-2\">\u76f8\u95a2\u56f3\u306e\u304d\u308c\u3044\u306a\u4f5c\u308a\u65b9\u30fb\u66f8\u304d\u65b9\u306e\u30b3\u30c4<\/h2>\n\n\n\n<p>\u300c\u76f8\u95a2\u56f3\u306e\u4f5c\u308a\u65b9\u304c\u308f\u304b\u3089\u306a\u3044\u300d\u300c\u3054\u3061\u3083\u3054\u3061\u3083\u3057\u3066\u3057\u307e\u3046\u300d\u3068\u3044\u3046\u65b9\u306f\u3001\u4ee5\u4e0b\u306e\u30dd\u30a4\u30f3\u30c8\u3092\u610f\u8b58\u3057\u3066\u4f5c\u6210\u3057\u3066\u307f\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>\u4e3b\u4eba\u516c\u3084\u4e2d\u5fc3\u4eba\u7269\u3092\u771f\u3093\u4e2d\u306b\u7f6e\u304f<\/strong>\uff1a\u6700\u3082\u95a2\u4fc2\u6027\u304c\u591a\u3044\u30ad\u30fc\u30d1\u30fc\u30bd\u30f3\u3092\u4e2d\u592e\u306b\u914d\u7f6e\u3057\u3001\u305d\u3053\u304b\u3089\u653e\u5c04\u72b6\u306b\u4ed6\u306e\u4eba\u7269\u3092\u914d\u7f6e\u3059\u308b\u3068\u30d0\u30e9\u30f3\u30b9\u304c\u826f\u304f\u306a\u308a\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u8272\u306e\u30eb\u30fc\u30eb\u3092\u6c7a\u3081\u308b<\/strong>\uff1a\u300c\u5473\u65b9\u306f\u9752\u7cfb\u300d\u300c\u6575\u306f\u8d64\u7cfb\u300d\u300c\u5bb6\u65cf\u306f\u7dd1\u7cfb\u300d\u306a\u3069\u3001\u6240\u5c5e\u3084\u5c5e\u6027\u3054\u3068\u306b\u56f3\u5f62\u306e\u8272\u3092\u7d71\u4e00\u3059\u308b\u3068\u3001\u8996\u899a\u7684\u306b\u95a2\u4fc2\u6027\u3092\u628a\u63e1\u3057\u3084\u3059\u304f\u306a\u308a\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u6574\u5217\u6a5f\u80fd\u3092\u6d3b\u7528\u3059\u308b<\/strong>\uff1a\u4e0a\u90e8\u30e1\u30cb\u30e5\u30fc\u306e\u300c\u6574\u5217\u300d\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u3001\u56f3\u5f62\u304c\u30b0\u30ea\u30c3\u30c9\uff08\u65b9\u773c\uff09\u306b\u5408\u308f\u305b\u3066\u7b49\u9593\u9694\u306b\u914d\u7f6e\u3055\u308c\u3001\u30d7\u30ed\u304c\u4f5c\u3063\u305f\u3088\u3046\u306a\u7f8e\u3057\u3044\u4ed5\u4e0a\u304c\u308a\u306b\u306a\u308a\u307e\u3059\u3002<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-3\">\u3053\u306e\u30c4\u30fc\u30eb\u306b\u95a2\u3059\u308b\u57fa\u790e\u77e5\u8b58<\/h2>\n\n\n\n<p>\u76f8\u95a2\u56f3\uff08\u95a2\u4fc2\u56f3\uff09\u3092\u69cb\u6210\u3059\u308b\u8981\u7d20\u306b\u306f\u3001\u3044\u304f\u3064\u304b\u57fa\u672c\u7684\u306a\u7528\u8a9e\u3084\u5f79\u5272\u304c\u3042\u308a\u307e\u3059\u3002\u3053\u308c\u3089\u3092\u77e5\u3063\u3066\u304a\u304f\u3068\u3001\u3088\u308a\u30b9\u30e0\u30fc\u30ba\u306b\u60c5\u5831\u3092\u6574\u7406\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>\u30ce\u30fc\u30c9\uff08\u56f3\u5f62\u30fb\u70b9\uff09<\/strong>\uff1a\u4eba\u7269\u3001\u30ad\u30e3\u30e9\u30af\u30bf\u30fc\u3001\u7d44\u7e54\u3001\u90e8\u7f72\u306a\u3069\u3092\u8868\u3059\u8981\u7d20\u3067\u3059\u3002\u4e00\u822c\u7684\u306b\u3001\u500b\u4eba\u3092\u8868\u3059\u5834\u5408\u306f\u300c\u4e38\uff08\u30b5\u30fc\u30af\u30eb\uff09\u300d\u3001\u7d44\u7e54\u3084\u96c6\u56e3\u3092\u8868\u3059\u5834\u5408\u306f\u300c\u56db\u89d2\uff08\u77e9\u5f62\uff09\u300d\u304c\u4f7f\u308f\u308c\u308b\u3053\u3068\u304c\u591a\u3044\u3067\u3059\u3002<\/li>\n\n\n\n<li><strong>\u30a8\u30c3\u30b8\uff08\u7dda\uff09<\/strong>\uff1a\u30ce\u30fc\u30c9\u3068\u30ce\u30fc\u30c9\u3092\u7d50\u3073\u3001\u95a2\u4fc2\u6027\u3092\u8868\u3059\u8981\u7d20\u3067\u3059\u3002\u53cc\u65b9\u5411\u306e\u30d5\u30e9\u30c3\u30c8\u306a\u95a2\u4fc2\uff08\u89aa\u53cb\u30fb\u540c\u671f\u306a\u3069\uff09\u306f\u300c\u5b9f\u7dda\u300d\u3001\u4e00\u65b9\u901a\u884c\u306e\u611f\u60c5\u3084\u6307\u793a\u7cfb\u7d71\uff08\u7247\u601d\u3044\u30fb\u4e0a\u53f8\u304b\u3089\u90e8\u4e0b\u306a\u3069\uff09\u306f\u300c\u77e2\u5370\u300d\u3001\u4e0d\u78ba\u5b9a\u306a\u95a2\u4fc2\u3084\u9593\u63a5\u7684\u306a\u95a2\u308f\u308a\u306f\u300c\u70b9\u7dda\u300d\u3067\u8868\u73fe\u3059\u308b\u306e\u304c\u4e00\u822c\u7684\u3067\u3059\u3002<\/li>\n\n\n\n<li><strong>\u95a2\u4fc2\u6027\u30e9\u30d9\u30eb<\/strong>\uff1a\u30a8\u30c3\u30b8\uff08\u7dda\uff09\u306e\u4e0a\u306b\u8a18\u8f09\u3059\u308b\u77ed\u3044\u30c6\u30ad\u30b9\u30c8\u3067\u3059\u3002\u9577\u6587\u3092\u907f\u3051\u3001\u300c\u4fe1\u983c\u300d\u300c\u6575\u5bfe\u300d\u300c\u696d\u52d9\u63d0\u643a\u300d\u306a\u3069\u30012\u301c4\u6587\u5b57\u7a0b\u5ea6\u306e\u7aef\u7684\u306a\u8a00\u8449\u3092\u9078\u3076\u3068\u56f3\u5168\u4f53\u304c\u3059\u3063\u304d\u308a\u3068\u898b\u3048\u307e\u3059\u3002<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-4\">\u76f8\u95a2\u56f3\u30e1\u30fc\u30ab\u30fc\u304c\u5f79\u7acb\u3064\u3068\u304d\u306f\u3069\u3093\u306a\u3068\u304d\uff1f<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>\u30c9\u30e9\u30de\u3084\u30a2\u30cb\u30e1\u3001\u63a8\u3057\u306e\u95a2\u4fc2\u6027\u3092\u307e\u3068\u3081\u305f\u3044\u3068\u304d<\/strong>\uff1a\u8907\u96d1\u306a\u4eba\u9593\u95a2\u4fc2\u304c\u767b\u5834\u3059\u308b\u4f5c\u54c1\u306e\u8003\u5bdf\u3084\u3001\u30a2\u30a4\u30c9\u30eb\u30b0\u30eb\u30fc\u30d7\u306e\u30e1\u30f3\u30d0\u30fc\u540c\u58eb\u306e\u76f8\u95a2\u56f3\u3092\u4f5c\u6210\u3057\u3001SNS\u3067\u30d5\u30a1\u30f3\u540c\u58eb\u3067\u30b7\u30a7\u30a2\u3057\u3066\u697d\u3057\u3080\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u5c0f\u8aac\u3084\u6f2b\u753b\u306a\u3069\u306e\u5275\u4f5c\u6d3b\u52d5\u3092\u3059\u308b\u3068\u304d<\/strong>\uff1a\u7269\u8a9e\u306e\u30d7\u30ed\u30c3\u30c8\u4f5c\u6210\u6bb5\u968e\u3067\u3001\u767b\u5834\u4eba\u7269\u306e\u76f8\u95a2\u56f3\u3092\u6574\u7406\u3057\u3066\u304a\u304f\u3053\u3068\u3067\u3001\u8a2d\u5b9a\u306e\u77db\u76fe\u3092\u9632\u304e\u3001\u30b9\u30c8\u30fc\u30ea\u30fc\u306b\u6df1\u307f\u3092\u6301\u305f\u305b\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u793e\u5185\u306e\u7d44\u7e54\u56f3\u3084\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u4f53\u5236\u56f3\u3092\u4f5c\u308b\u3068\u304d<\/strong>\uff1a\u65b0\u5165\u793e\u54e1\u5411\u3051\u306e\u8cc7\u6599\u3084\u3001\u793e\u5916\u5411\u3051\u306b\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u6307\u63ee\u547d\u4ee4\u7cfb\u7d71\u3092\u8aac\u660e\u3059\u308b\u305f\u3081\u306e\u4f53\u5236\u56f3\u3092\u3001\u5c02\u7528\u30bd\u30d5\u30c8\u3092\u4f7f\u308f\u305a\u306b\u7d20\u65e9\u304f\u4f5c\u6210\u3067\u304d\u307e\u3059\u3002<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>\u76f8\u95a2\u56f3\u30e1\u30fc\u30ab\u30fc\u3078\u3088\u3046\u3053\u305d \u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3092\u9078\u3093\u3067\u4f5c\u6210\u3092\u958b\u59cb\u3057\u3066\u304f\u3060\u3055\u3044 \u767d\u7d19\u304b\u3089\u4f5c\u308b \u30c9\u30e9\u30de\u30fb\u30a2\u30cb\u30e1\u30fb\u6f2b\u753b \u4f1a\u793e\u7d44\u7e54\u56f3 + \u4eba\u7269\u30fb\u7d44\u7e54\u8ffd\u52a0 \u7dda\u3067\u3064\u306a\u3050 (OFF) \u7dda\u3092\u6d88\u3059 (OFF) \u623b\u308b (Undo) \u6574\u5217 \u4e00\u6642\u4fdd\u5b58  &#8230; <\/p>\n","protected":false},"author":4,"featured_media":12273,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13,39,38],"tags":[],"class_list":{"0":"post-12188","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-tool","8":"category-life","9":"category-sns","10":"entry"},"_links":{"self":[{"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/posts\/12188","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/comments?post=12188"}],"version-history":[{"count":24,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/posts\/12188\/revisions"}],"predecessor-version":[{"id":12275,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/posts\/12188\/revisions\/12275"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/media\/12273"}],"wp:attachment":[{"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/media?parent=12188"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/categories?post=12188"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/tags?post=12188"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}