{"id":2,"date":"2025-07-29T05:55:44","date_gmt":"2025-07-29T05:55:44","guid":{"rendered":"http:\/\/ai.yoshidabankin.site\/?page_id=2"},"modified":"2025-08-16T01:30:13","modified_gmt":"2025-08-15T16:30:13","slug":"sample-page","status":"publish","type":"page","link":"https:\/\/ai.yoshidabankin.site\/?page_id=2","title":{"rendered":"\u7ba1\u7406"},"content":{"rendered":"\n<p class=\"\/*  * \u5168\u4f53\u8a2d\u5b9a  * \u5b87\u5b99\u3068\u9ad8\u7d1a\u611f\u3092\u30a4\u30e1\u30fc\u30b8\u3057\u305f\u30b9\u30bf\u30a4\u30eb  *\/ body {     margin: 0;     font-family: 'Times New Roman', Times, serif; \/* \u9ad8\u7d1a\u611f\u306e\u3042\u308b\u30d5\u30a9\u30f3\u30c8 *\/     background-color: #0d0d1e; \/* \u6df1\u3044\u5b87\u5b99\u3092\u30a4\u30e1\u30fc\u30b8\u3057\u305f\u80cc\u666f\u8272 *\/     color: #f0f8ff; \/* \u67d4\u3089\u304b\u3044\u661f\u306e\u5149\u306e\u3088\u3046\u306a\u8272 *\/     display: flex;     flex-direction: column;     justify-content: center;     align-items: center;     height: 100vh;     overflow: hidden; \/* \u80cc\u666f\u304c\u52d5\u304f\u306e\u3067\u30b9\u30af\u30ed\u30fc\u30eb\u3092\u975e\u8868\u793a\u306b *\/     position: relative; }  \/*  * \u80cc\u666f\u306e\u661f\u3005\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3  *\/ body::before {     content: '';     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100%;     background: radial-gradient(circle, #5a4b7f 1px, transparent 1px) 0 0 \/ 20px 20px,                 radial-gradient(circle, #f0f8ff 1px, transparent 1px) 10px 10px \/ 20px 20px;     animation: move-bg 60s linear infinite;     opacity: 0.3;     z-index: -1; }  @keyframes move-bg {     from { background-position: 0 0, 10px 10px; }     to { background-position: -200px -200px, -190px -190px; } }  \/*  * \u30b3\u30f3\u30c6\u30ca  * \u5149\u6ca2\u611f\u3068\u7acb\u4f53\u611f\u3092\u6301\u305f\u305b\u308b  *\/ .container {     background: rgba(255, 255, 255, 0.05); \/* \u534a\u900f\u660e\u3067\u5965\u884c\u304d\u3092\u51fa\u3059 *\/     backdrop-filter: blur(10px); \/* \u307c\u304b\u3057\u52b9\u679c\u3067\u9ad8\u7d1a\u611f\u3092\u6f14\u51fa *\/     border: 1px solid rgba(255, 255, 255, 0.2);     padding: 40px;     border-radius: 15px;     box-shadow: 0 0 30px rgba(187, 134, 252, 0.5), 0 0 60px rgba(187, 134, 252, 0.2);     width: 90%;     max-width: 500px;     transition: transform 0.3s ease-in-out; }  .container:hover {     transform: translateY(-5px) scale(1.02); }  \/*  * \u30e1\u30a4\u30f3\u306e\u898b\u51fa\u3057  * \u6d17\u7df4\u3055\u308c\u305f\u30c7\u30b6\u30a4\u30f3  *\/ h1 {     font-family: 'Helvetica Neue', Arial, sans-serif; \/* \u30bf\u30a4\u30c8\u30eb\u306f\u30e2\u30c0\u30f3\u306a\u30d5\u30a9\u30f3\u30c8\u306b *\/     font-size: 2.2rem;     margin-bottom: 20px;     letter-spacing: 0.1em;     color: #BB86FC;     text-shadow: 0 0 10px #BB86FC, 0 0 20px #BB86FC; }  \/*  * \u30e1\u30c3\u30bb\u30fc\u30b8\u8868\u793a\u30a8\u30ea\u30a2  *\/ #status {     font-size: 1.2rem;     height: 50px;     display: flex;     align-items: center;     justify-content: center;     margin-bottom: 30px;     color: #f0f8ff;     font-style: italic;     transition: color 0.5s ease-in-out; }  \/*  * \u60c5\u5831\u30dc\u30c3\u30af\u30b9  *\/ .info-box {     background: rgba(255, 255, 255, 0.05);     border: 1px solid rgba(255, 255, 255, 0.1);     border-radius: 10px;     padding: 20px;     margin-bottom: 20px;     text-align: left; }  .info-box p {     margin: 5px 0; }  .info-box strong {     color: #BB86FC;     font-weight: bold; }  \/*  * \u30dc\u30bf\u30f3  * \u8f1d\u304d\u3092\u653e\u3064\u30c7\u30b6\u30a4\u30f3  *\/ button {     padding: 12px 25px;     font-size: 1rem;     font-weight: bold;     color: #121212;     background: #BB86FC;     border: none;     border-radius: 8px;     cursor: pointer;     transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;     box-shadow: 0 0 10px rgba(187, 134, 252, 0.5); }  button:hover {     background-color: #9A66DE;     transform: translateY(-2px);     box-shadow: 0 0 15px rgba(187, 134, 252, 0.8); }  button:disabled {     background-color: #424242;     color: #888;     cursor: not-allowed;     box-shadow: none; }\"><\/p>\n\n\n\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>\u30dc\u30a4\u30b9\u30b3\u30de\u30f3\u30c9\u8d77\u52d5\u30a2\u30d7\u30ea<\/title>\n    <style>\n        \/*\n         * \u5168\u4f53\u8a2d\u5b9a\n         * \u5b87\u5b99\u3068\u9ad8\u7d1a\u611f\u3092\u30a4\u30e1\u30fc\u30b8\u3057\u305f\u30b9\u30bf\u30a4\u30eb\n         *\/\n        body {\n            margin: 0;\n            font-family: 'Times New Roman', Times, serif; \/* \u9ad8\u7d1a\u611f\u306e\u3042\u308b\u30d5\u30a9\u30f3\u30c8 *\/\n            background-color: #0d0d1e; \/* \u6df1\u3044\u5b87\u5b99\u3092\u30a4\u30e1\u30fc\u30b8\u3057\u305f\u80cc\u666f\u8272 *\/\n            color: #f0f8ff; \/* \u67d4\u3089\u304b\u3044\u661f\u306e\u5149\u306e\u3088\u3046\u306a\u8272 *\/\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n            align-items: center;\n            height: 100vh;\n            overflow: hidden; \/* \u80cc\u666f\u304c\u52d5\u304f\u306e\u3067\u30b9\u30af\u30ed\u30fc\u30eb\u3092\u975e\u8868\u793a\u306b *\/\n            position: relative;\n        }\n\n        \/*\n         * \u80cc\u666f\u306e\u661f\u3005\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\n         *\/\n        body::before {\n            content: '';\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            background: radial-gradient(circle, #5a4b7f 1px, transparent 1px) 0 0 \/ 20px 20px,\n                        radial-gradient(circle, #f0f8ff 1px, transparent 1px) 10px 10px \/ 20px 20px;\n            animation: move-bg 60s linear infinite;\n            opacity: 0.3;\n            z-index: -1;\n        }\n\n        @keyframes move-bg {\n            from { background-position: 0 0, 10px 10px; }\n            to { background-position: -200px -200px, -190px -190px; }\n        }\n\n        \/*\n         * \u30b3\u30f3\u30c6\u30ca\n         * \u5149\u6ca2\u611f\u3068\u7acb\u4f53\u611f\u3092\u6301\u305f\u305b\u308b\n         *\/\n        .container {\n            background: rgba(255, 255, 255, 0.05); \/* \u534a\u900f\u660e\u3067\u5965\u884c\u304d\u3092\u51fa\u3059 *\/\n            backdrop-filter: blur(10px); \/* \u307c\u304b\u3057\u52b9\u679c\u3067\u9ad8\u7d1a\u611f\u3092\u6f14\u51fa *\/\n            border: 1px solid rgba(255, 255, 255, 0.2);\n            padding: 40px;\n            border-radius: 15px;\n            box-shadow: 0 0 30px rgba(187, 134, 252, 0.5), 0 0 60px rgba(187, 134, 252, 0.2);\n            width: 90%;\n            max-width: 500px;\n            transition: transform 0.3s ease-in-out;\n        }\n\n        .container:hover {\n            transform: translateY(-5px) scale(1.02);\n        }\n\n        \/*\n         * \u30e1\u30a4\u30f3\u306e\u898b\u51fa\u3057\n         * \u6d17\u7df4\u3055\u308c\u305f\u30c7\u30b6\u30a4\u30f3\n         *\/\n        h1 {\n            font-family: 'Helvetica Neue', Arial, sans-serif; \/* \u30bf\u30a4\u30c8\u30eb\u306f\u30e2\u30c0\u30f3\u306a\u30d5\u30a9\u30f3\u30c8\u306b *\/\n            font-size: 2.2rem;\n            margin-bottom: 20px;\n            letter-spacing: 0.1em;\n            color: #BB86FC;\n            text-shadow: 0 0 10px #BB86FC, 0 0 20px #BB86FC;\n        }\n\n        \/*\n         * \u30e1\u30c3\u30bb\u30fc\u30b8\u8868\u793a\u30a8\u30ea\u30a2\n         *\/\n        #status {\n            font-size: 1.2rem;\n            height: 50px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            margin-bottom: 30px;\n            color: #f0f8ff;\n            font-style: italic;\n            transition: color 0.5s ease-in-out;\n        }\n\n        \/*\n         * \u60c5\u5831\u30dc\u30c3\u30af\u30b9\n         *\/\n        .info-box {\n            background: rgba(255, 255, 255, 0.05);\n            border: 1px solid rgba(255, 255, 255, 0.1);\n            border-radius: 10px;\n            padding: 20px;\n            margin-bottom: 20px;\n            text-align: left;\n        }\n\n        .info-box p {\n            margin: 5px 0;\n        }\n\n        .info-box strong {\n            color: #BB86FC;\n            font-weight: bold;\n        }\n\n        \/*\n         * \u30dc\u30bf\u30f3\n         * \u8f1d\u304d\u3092\u653e\u3064\u30c7\u30b6\u30a4\u30f3\n         *\/\n        button {\n            padding: 12px 25px;\n            font-size: 1rem;\n            font-weight: bold;\n            color: #121212;\n            background: #BB86FC;\n            border: none;\n            border-radius: 8px;\n            cursor: pointer;\n            transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;\n            box-shadow: 0 0 10px rgba(187, 134, 252, 0.5);\n        }\n\n        button:hover {\n            background-color: #9A66DE;\n            transform: translateY(-2px);\n            box-shadow: 0 0 15px rgba(187, 134, 252, 0.8);\n        }\n\n        button:disabled {\n            background-color: #424242;\n            color: #888;\n            cursor: not-allowed;\n            box-shadow: none;\n        }\n    <\/style>\n<\/head>\n<body>\n\n    <div class=\"container\">\n        <h1>\u30dc\u30a4\u30b9\u30b3\u30de\u30f3\u30c9\u8d77\u52d5\u30a2\u30d7\u30ea<\/h1>\n        <div id=\"status\">\u30de\u30a4\u30af\u306e\u8a31\u53ef\u3092\u304a\u9858\u3044\u3057\u307e\u3059&#8230;<\/div>\n        <div class=\"info-box\">\n            <p><strong>\u30de\u30a4\u30af\u306e\u72b6\u614b:<\/strong> <span id=\"mic-status\">&#8212;<\/span><\/p>\n            <p><strong>\u6700\u5f8c\u306b\u8a8d\u8b58\u3057\u305f\u8a00\u8449:<\/strong> <span id=\"last-word\">&#8212;<\/span><\/p>\n            <p><strong>\u8d77\u52d5\u307e\u3067:<\/strong> <span id=\"countdown\">&#8212;<\/span><\/p>\n        <\/div>\n        <button id=\"toggleBtn\">\u30dc\u30a4\u30b9\u30b3\u30de\u30f3\u30c9\u3092\u958b\u59cb<\/button>\n    <\/div>\n\n    <script>\n        \/\/ \u97f3\u58f0\u8a8d\u8b58\u306e\u521d\u671f\u5316\n        const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;\n        if (!SpeechRecognition) {\n            const statusDiv = document.getElementById('status');\n            statusDiv.textContent = \"\u304a\u4f7f\u3044\u306e\u30d6\u30e9\u30a6\u30b6\u306f\u97f3\u58f0\u8a8d\u8b58\u3092\u30b5\u30dd\u30fc\u30c8\u3057\u3066\u3044\u307e\u305b\u3093\u3002Chrome\u307e\u305f\u306fEdge\u3092\u3054\u5229\u7528\u304f\u3060\u3055\u3044\u3002\";\n            document.getElementById('toggleBtn').disabled = true;\n        }\n\n        let isListening = false;\n        const recognition = new SpeechRecognition();\n        const statusDiv = document.getElementById('status');\n        const micStatusSpan = document.getElementById('mic-status');\n        const lastWordSpan = document.getElementById('last-word');\n        const countdownSpan = document.getElementById('countdown');\n        const toggleBtn = document.getElementById('toggleBtn');\n        let countdownInterval = null;\n\n        \/\/ \u97f3\u58f0\u8a8d\u8b58\u306e\u8a2d\u5b9a\n        recognition.lang = 'ja-JP';\n        recognition.interimResults = false;\n        recognition.continuous = true;\n\n        \/\/ \u97f3\u58f0\u8a8d\u8b58\u304c\u958b\u59cb\u3055\u308c\u305f\u3068\u304d\u306e\u51e6\u7406\n        recognition.onstart = () => {\n            isListening = true;\n            statusDiv.textContent = \"\u8a8d\u8b58\u4e2d...\";\n            micStatusSpan.textContent = \"\u8a8d\u8b58\u4e2d\";\n            toggleBtn.textContent = \"\u30dc\u30a4\u30b9\u30b3\u30de\u30f3\u30c9\u3092\u505c\u6b62\";\n            toggleBtn.style.backgroundColor = '#CF6679';\n        };\n\n        \/\/ \u97f3\u58f0\u8a8d\u8b58\u304c\u7d42\u4e86\u3057\u305f\u3068\u304d\u306e\u51e6\u7406\n        recognition.onend = () => {\n            isListening = false;\n            statusDiv.textContent = \"\u505c\u6b62\u3057\u307e\u3057\u305f\u3002\";\n            micStatusSpan.textContent = \"\u505c\u6b62\u4e2d\";\n            toggleBtn.textContent = \"\u30dc\u30a4\u30b9\u30b3\u30de\u30f3\u30c9\u3092\u958b\u59cb\";\n            toggleBtn.style.backgroundColor = '#BB86FC';\n            clearInterval(countdownInterval);\n            countdownSpan.textContent = \"---\";\n        };\n\n        \/\/ \u97f3\u58f0\u304c\u8a8d\u8b58\u3055\u308c\u305f\u3068\u304d\u306e\u51e6\u7406\n        recognition.onresult = (event) => {\n            const result = event.results[event.results.length - 1][0];\n            const transcript = result.transcript.trim();\n\n            lastWordSpan.textContent = `\u300c${transcript}\u300d`;\n\n            \/\/ \u7279\u5b9a\u306e\u30ad\u30fc\u30ef\u30fc\u30c9\u3092\u691c\u51fa\n            if (transcript.includes('\u30b8\u30a7\u30df\u30cb') || transcript.includes('YB')) {\n                statusDiv.textContent = `\u30b3\u30de\u30f3\u30c9\u3092\u8a8d\u8b58\u3057\u307e\u3057\u305f\uff01Gemini\u30a2\u30d7\u30ea\u3092\u8d77\u52d5\u3057\u307e\u3059...`;\n                \/\/ \u97f3\u58f0\u8a8d\u8b58\u3092\u505c\u6b62\n                recognition.stop();\n                let count = 3;\n                countdownSpan.textContent = `${count}\u79d2`;\n\n                countdownInterval = setInterval(() => {\n                    count--;\n                    countdownSpan.textContent = `${count}\u79d2`;\n                    if (count <= 0) {\n                        clearInterval(countdownInterval);\n                        window.location.href = \"https:\/\/gemini.google.com\/app\";\n                    }\n                }, 1000);\n            }\n        };\n\n        \/\/ \u30a8\u30e9\u30fc\u767a\u751f\u6642\u306e\u51e6\u7406\n        recognition.onerror = (event) => {\n            console.error('\u8a8d\u8b58\u30a8\u30e9\u30fc:', event.error);\n            statusDiv.textContent = `\u30a8\u30e9\u30fc\u304c\u767a\u751f\u3057\u307e\u3057\u305f: ${event.error}`;\n            micStatusSpan.textContent = \"\u30a8\u30e9\u30fc\";\n            clearInterval(countdownInterval);\n            countdownSpan.textContent = \"---\";\n        };\n\n        \/\/ \u30dc\u30bf\u30f3\u30af\u30ea\u30c3\u30af\u6642\u306e\u51e6\u7406\n        toggleBtn.addEventListener('click', () => {\n            if (isListening) {\n                recognition.stop();\n            } else {\n                try {\n                    recognition.start();\n                } catch (e) {\n                    console.error('\u8a8d\u8b58\u958b\u59cb\u30a8\u30e9\u30fc:', e);\n                    statusDiv.textContent = \"\u30de\u30a4\u30af\u306e\u4f7f\u7528\u304c\u62d2\u5426\u3055\u308c\u307e\u3057\u305f\u3002\u30d6\u30e9\u30a6\u30b6\u306e\u8a2d\u5b9a\u3092\u3054\u78ba\u8a8d\u304f\u3060\u3055\u3044\u3002\";\n                }\n            }\n        });\n\n        \/\/ \u30da\u30fc\u30b8\u8aad\u307f\u8fbc\u307f\u6642\u306b\u81ea\u52d5\u3067\u8a8d\u8b58\u3092\u958b\u59cb\n        window.addEventListener('load', () => {\n            try {\n                recognition.start();\n            } catch (e) {\n                console.error('\u81ea\u52d5\u958b\u59cb\u30a8\u30e9\u30fc:', e);\n                statusDiv.textContent = \"\u30de\u30a4\u30af\u306e\u4f7f\u7528\u304c\u62d2\u5426\u3055\u308c\u307e\u3057\u305f\u3002\u30d6\u30e9\u30a6\u30b6\u306e\u8a2d\u5b9a\u3092\u3054\u78ba\u8a8d\u304f\u3060\u3055\u3044\u3002\";\n            }\n        });\n    <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>\u30dc\u30a4\u30b9\u30b3\u30de\u30f3\u30c9\u8d77\u52d5\u30a2\u30d7\u30ea \u30dc\u30a4\u30b9\u30b3\u30de\u30f3\u30c9\u8d77\u52d5\u30a2\u30d7\u30ea \u30de\u30a4\u30af\u306e\u8a31\u53ef\u3092\u304a\u9858\u3044\u3057\u307e\u3059&#8230; \u30de\u30a4\u30af\u306e\u72b6\u614b: &#8212; \u6700\u5f8c\u306b\u8a8d\u8b58\u3057\u305f\u8a00\u8449: &#8212; \u8d77\u52d5\u307e\u3067: &#8212; \u30dc\u30a4\u30b9\u30b3\u30de\u30f3\u30c9\u3092\u958b\u59cb<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"","meta":{"footnotes":""},"class_list":["post-2","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ai.yoshidabankin.site\/index.php?rest_route=\/wp\/v2\/pages\/2","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ai.yoshidabankin.site\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ai.yoshidabankin.site\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ai.yoshidabankin.site\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ai.yoshidabankin.site\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2"}],"version-history":[{"count":5,"href":"https:\/\/ai.yoshidabankin.site\/index.php?rest_route=\/wp\/v2\/pages\/2\/revisions"}],"predecessor-version":[{"id":13,"href":"https:\/\/ai.yoshidabankin.site\/index.php?rest_route=\/wp\/v2\/pages\/2\/revisions\/13"}],"wp:attachment":[{"href":"https:\/\/ai.yoshidabankin.site\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}