{"id":25931,"date":"2025-03-29T17:24:47","date_gmt":"2025-03-29T08:24:47","guid":{"rendered":"http:\/\/www.tyosuke20xx.com\/blog\/?p=25931"},"modified":"2025-03-29T17:24:49","modified_gmt":"2025-03-29T08:24:49","slug":"sns","status":"publish","type":"post","link":"http:\/\/www.tyosuke20xx.com\/blog\/?p=25931","title":{"rendered":"SNS"},"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>\u7a76\u6975SNS<\/title>\n    <style>\n        * {\n            box-sizing: border-box;\n            margin: 0;\n            padding: 0;\n        }\n        body {\n            font-family: 'Segoe UI', Arial, sans-serif;\n            background-color: #f0f2f5;\n            color: #1c1e21;\n            line-height: 1.5;\n            transition: background-color 0.3s, color 0.3s;\n        }\n        body.dark-mode {\n            background-color: #18191a;\n            color: #e4e6eb;\n        }\n        .header {\n            background-color: #1877f2;\n            color: white;\n            padding: 10px 20px;\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            position: sticky;\n            top: 0;\n            z-index: 100;\n            box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n        }\n        .header input {\n            padding: 10px 15px;\n            border: none;\n            border-radius: 25px;\n            width: 350px;\n            font-size: 14px;\n            background-color: #ffffff;\n        }\n        .nav {\n            display: flex;\n            align-items: center;\n        }\n        .nav a, .nav button {\n            color: white;\n            margin-left: 25px;\n            text-decoration: none;\n            font-weight: 500;\n            background: none;\n            border: none;\n            cursor: pointer;\n            position: relative;\n        }\n        .nav a:hover::after, .nav button:hover::after {\n            content: '';\n            position: absolute;\n            width: 50%;\n            height: 2px;\n            background-color: white;\n            bottom: -5px;\n            left: 25%;\n        }\n        .container {\n            display: flex;\n            max-width: 1400px;\n            margin: 20px auto;\n            gap: 25px;\n        }\n        .sidebar-left {\n            width: 25%;\n            padding: 15px;\n            position: sticky;\n            top: 70px;\n            height: fit-content;\n        }\n        .sidebar-card {\n            background-color: white;\n            border-radius: 10px;\n            padding: 20px;\n            box-shadow: 0 2px 6px rgba(0,0,0,0.05);\n            margin-bottom: 20px;\n        }\n        body.dark-mode .sidebar-card {\n            background-color: #242526;\n        }\n        .profile-pic {\n            width: 60px;\n            height: 60px;\n            border-radius: 50%;\n            background-color: #ddd;\n            margin: 0 auto 15px;\n        }\n        .badge {\n            display: inline-block;\n            background-color: #1877f2;\n            color: white;\n            padding: 2px 8px;\n            border-radius: 12px;\n            font-size: 12px;\n            margin-left: 5px;\n        }\n        .sidebar-left a {\n            display: block;\n            color: #1877f2;\n            text-decoration: none;\n            margin: 12px 0;\n            font-size: 15px;\n        }\n        .main-content {\n            width: 50%;\n        }\n        .sidebar-right {\n            width: 25%;\n            padding: 15px;\n            position: sticky;\n            top: 70px;\n            height: fit-content;\n        }\n        .post-box {\n            background-color: white;\n            padding: 20px;\n            border-radius: 10px;\n            box-shadow: 0 2px 6px rgba(0,0,0,0.05);\n            margin-bottom: 25px;\n        }\n        body.dark-mode .post-box {\n            background-color: #242526;\n        }\n        .post-input {\n            width: 100%;\n            padding: 12px 15px;\n            border: none;\n            border-radius: 25px;\n            background-color: #f0f2f5;\n            resize: none;\n            font-size: 16px;\n            outline: none;\n        }\n        body.dark-mode .post-input {\n            background-color: #3a3b3c;\n            color: #e4e6eb;\n        }\n        .post-actions {\n            display: flex;\n            justify-content: space-between;\n            margin-top: 15px;\n            flex-wrap: wrap;\n            gap: 10px;\n        }\n        .post-actions button {\n            background-color: #e4e6eb;\n            color: #050505;\n            border: none;\n            padding: 8px 15px;\n            border-radius: 6px;\n            cursor: pointer;\n            font-weight: 500;\n            transition: background-color 0.2s;\n        }\n        body.dark-mode .post-actions button {\n            background-color: #3a3b3c;\n            color: #e4e6eb;\n        }\n        .post-actions button:hover {\n            background-color: #d8dade;\n        }\n        body.dark-mode .post-actions button:hover {\n            background-color: #4a4b4c;\n        }\n        .post-actions .submit-btn {\n            background-color: #1877f2;\n            color: white;\n        }\n        .post {\n            background-color: white;\n            padding: 20px;\n            border-radius: 10px;\n            margin-bottom: 25px;\n            box-shadow: 0 2px 6px rgba(0,0,0,0.05);\n            position: relative;\n        }\n        body.dark-mode .post {\n            background-color: #242526;\n        }\n        .post-header {\n            display: flex;\n            align-items: center;\n            margin-bottom: 15px;\n        }\n        .post-header .profile-pic {\n            width: 40px;\n            height: 40px;\n            margin-right: 12px;\n        }\n        .post-header h3 {\n            margin: 0;\n            font-size: 16px;\n            font-weight: 600;\n        }\n        .post-header small {\n            color: #65676b;\n            font-size: 12px;\n        }\n        body.dark-mode .post-header small {\n            color: #b0b3b8;\n        }\n        .post-options {\n            position: absolute;\n            top: 10px;\n            right: 10px;\n            cursor: pointer;\n            color: #65676b;\n        }\n        .post-options:hover .options-menu {\n            display: block;\n        }\n        .options-menu {\n            display: none;\n            position: absolute;\n            top: 20px;\n            right: 0;\n            background-color: white;\n            border-radius: 8px;\n            box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n            padding: 10px;\n            z-index: 10;\n        }\n        body.dark-mode .options-menu {\n            background-color: #3a3b3c;\n        }\n        .options-menu a {\n            display: block;\n            color: #050505;\n            text-decoration: none;\n            padding: 5px 10px;\n        }\n        body.dark-mode .options-menu a {\n            color: #e4e6eb;\n        }\n        .post-image {\n            width: 100%;\n            height: 300px;\n            background-color: #ddd;\n            border-radius: 8px;\n            margin: 15px 0;\n        }\n        .reactions {\n            position: relative;\n            display: inline-block;\n        }\n        .reactions:hover .reaction-menu {\n            display: flex;\n        }\n        .reaction-menu {\n            display: none;\n            position: absolute;\n            top: -45px;\n            left: 0;\n            background-color: white;\n            padding: 8px;\n            border-radius: 25px;\n            box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n            gap: 8px;\n            z-index: 10;\n        }\n        body.dark-mode .reaction-menu {\n            background-color: #3a3b3c;\n        }\n        .reaction {\n            font-size: 22px;\n            cursor: pointer;\n            transition: transform 0.2s;\n        }\n        .reaction:hover {\n            transform: scale(1.2);\n        }\n        .reaction-stats {\n            margin-top: 5px;\n            font-size: 14px;\n            color: #65676b;\n        }\n        body.dark-mode .reaction-stats {\n            color: #b0b3b8;\n        }\n        .post-actions-bar {\n            display: flex;\n            justify-content: space-around;\n            padding: 10px 0;\n            border-top: 1px solid #e4e6eb;\n            border-bottom: 1px solid #e4e6eb;\n            color: #65676b;\n            font-size: 14px;\n        }\n        body.dark-mode .post-actions-bar {\n            border-color: #3a3b3c;\n            color: #b0b3b8;\n        }\n        .post-actions-bar span {\n            cursor: pointer;\n            padding: 5px 10px;\n            border-radius: 5px;\n        }\n        .post-actions-bar span:hover {\n            background-color: #f2f3f5;\n        }\n        body.dark-mode .post-actions-bar span:hover {\n            background-color: #3a3b3c;\n        }\n        .comment-section {\n            margin-top: 15px;\n        }\n        .comment {\n            display: flex;\n            align-items: flex-start;\n            margin-top: 12px;\n        }\n        .comment .profile-pic {\n            width: 32px;\n            height: 32px;\n            margin-right: 10px;\n        }\n        .comment-text {\n            background-color: #f2f3f5;\n            padding: 8px 12px;\n            border-radius: 18px;\n            font-size: 14px;\n        }\n        body.dark-mode .comment-text {\n            background-color: #3a3b3c;\n            color: #e4e6eb;\n        }\n        .comment-input {\n            width: 100%;\n            padding: 10px 15px;\n            border: none;\n            border-radius: 25px;\n            background-color: #f0f2f5;\n            font-size: 14px;\n            margin-top: 10px;\n        }\n        body.dark-mode .comment-input {\n            background-color: #3a3b3c;\n            color: #e4e6eb;\n        }\n        .chat-window {\n            background-color: white;\n            border-radius: 10px;\n            padding: 15px;\n            box-shadow: 0 2px 6px rgba(0,0,0,0.05);\n        }\n        body.dark-mode .chat-window {\n            background-color: #242526;\n        }\n        .chat-message {\n            margin: 10px 0;\n        }\n        .chat-message.sent .comment-text {\n            background-color: #1877f2;\n            color: white;\n            margin-left: auto;\n        }\n        .notification-popup {\n            position: fixed;\n            bottom: 20px;\n            right: 20px;\n            background-color: white;\n            padding: 15px;\n            border-radius: 8px;\n            box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n            z-index: 200;\n        }\n        body.dark-mode .notification-popup {\n            background-color: #242526;\n        }\n        .modal {\n            display: none;\n            position: fixed;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            background-color: rgba(0,0,0,0.5);\n            justify-content: center;\n            align-items: center;\n            z-index: 200;\n        }\n        .modal-content {\n            background-color: white;\n            padding: 25px;\n            border-radius: 10px;\n            width: 600px;\n            max-height: 80vh;\n            overflow-y: auto;\n            box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n        }\n        body.dark-mode .modal-content {\n            background-color: #242526;\n        }\n        .footer {\n            background-color: white;\n            padding: 20px;\n            text-align: center;\n            color: #65676b;\n            border-top: 1px solid #e4e6eb;\n            font-size: 13px;\n        }\n        body.dark-mode .footer {\n            background-color: #18191a;\n            color: #b0b3b8;\n            border-color: #3a3b3c;\n        }\n        .footer a {\n            color: #65676b;\n            text-decoration: none;\n            margin: 0 10px;\n        }\n        body.dark-mode .footer a {\n            color: #b0b3b8;\n        }\n        .mobile-menu {\n            display: none;\n            position: fixed;\n            top: 60px;\n            left: 0;\n            width: 100%;\n            background-color: #1877f2;\n            padding: 15px;\n            z-index: 99;\n        }\n        .mobile-menu a {\n            color: white;\n            display: block;\n            margin: 10px 0;\n            text-decoration: none;\n        }\n        @media (max-width: 900px) {\n            .container {\n                flex-direction: column;\n                margin: 10px;\n            }\n            .sidebar-left, .main-content, .sidebar-right {\n                width: 100%;\n                position: static;\n            }\n            .header input {\n                width: 150px;\n            }\n            .nav {\n                display: none;\n            }\n            .mobile-menu {\n                display: block;\n            }\n        }\n    <\/style>\n<\/head>\n<body>\n    <!-- \u30d8\u30c3\u30c0\u30fc -->\n    <div class=\"header\">\n        <h1>\u7a76\u6975SNS<\/h1>\n        <input type=\"text\" placeholder=\"\u53cb\u9054\u3001\u6295\u7a3f\u3001\u30b0\u30eb\u30fc\u30d7\u3092\u691c\u7d22\">\n        <div class=\"nav\">\n            <a href=\"#\">\u30db\u30fc\u30e0<\/a>\n            <a href=\"#\">\u53cb\u9054<\/a>\n            <a href=\"#\">\u30e1\u30c3\u30bb\u30fc\u30b8<\/a>\n            <a href=\"#\">\u901a\u77e5<\/a>\n            <a href=\"#\">\u30d7\u30ed\u30d5\u30a3\u30fc\u30eb<\/a>\n            <button onclick=\"document.body.classList.toggle('dark-mode')\">\u30c0\u30fc\u30af\u30e2\u30fc\u30c9<\/button>\n        <\/div>\n    <\/div>\n    <div class=\"mobile-menu\">\n        <a href=\"#\">\u30db\u30fc\u30e0<\/a>\n        <a href=\"#\">\u53cb\u9054<\/a>\n        <a href=\"#\">\u30e1\u30c3\u30bb\u30fc\u30b8<\/a>\n        <a href=\"#\">\u901a\u77e5<\/a>\n        <a href=\"#\">\u30d7\u30ed\u30d5\u30a3\u30fc\u30eb<\/a>\n        <a href=\"#\" onclick=\"document.body.classList.toggle('dark-mode')\">\u30c0\u30fc\u30af\u30e2\u30fc\u30c9<\/a>\n    <\/div>\n\n    <!-- \u30e1\u30a4\u30f3\u30b3\u30f3\u30c6\u30f3\u30c4 -->\n    <div class=\"container\">\n        <!-- \u5de6\u30b5\u30a4\u30c9\u30d0\u30fc -->\n        <div class=\"sidebar-left\">\n            <div class=\"sidebar-card\">\n                <div class=\"profile-pic\"><\/div>\n                <h3>\u30e6\u30fc\u30b6\u30fc\u540d <span class=\"badge\">\u8a8d\u8a3c\u6e08\u307f<\/span><\/h3>\n                <a href=\"#\">\u30d7\u30ed\u30d5\u30a3\u30fc\u30eb\u3092\u898b\u308b<\/a>\n                <a href=\"#\">\u53cb\u9054 (128)<\/a>\n                <a href=\"#\">\u30d5\u30a9\u30ed\u30ef\u30fc (350)<\/a>\n            <\/div>\n            <div class=\"sidebar-card\">\n                <h4>\u30e1\u30cb\u30e5\u30fc<\/h4>\n                <a href=\"#\">\u30b0\u30eb\u30fc\u30d7<\/a>\n                <a href=\"#\">\u30a4\u30d9\u30f3\u30c8<\/a>\n                <a href=\"#\">\u30de\u30fc\u30b1\u30c3\u30c8\u30d7\u30ec\u30a4\u30b9<\/a>\n                <a href=\"#\">\u8a2d\u5b9a<\/a>\n            <\/div>\n        <\/div>\n\n        <!-- \u4e2d\u592e\uff08\u6295\u7a3f\u30a8\u30ea\u30a2\uff09 -->\n        <div class=\"main-content\">\n            <!-- \u6295\u7a3f\u5165\u529b\u30a8\u30ea\u30a2 -->\n            <div class=\"post-box\">\n                <textarea class=\"post-input\" rows=\"3\" placeholder=\"\u4f55\u3092\u601d\u3063\u3066\u308b\uff1f\"><\/textarea>\n                <div class=\"post-actions\">\n                    <button>\u5199\u771f\/\u52d5\u753b<\/button>\n                    <button>\u30bf\u30b0\u53cb\u9054<\/button>\n                    <button>\u30e9\u30a4\u30d6\u914d\u4fe1<\/button>\n                    <button>\u30a4\u30d9\u30f3\u30c8\u4f5c\u6210<\/button>\n                    <button class=\"submit-btn\" onclick=\"document.getElementById('postModal').style.display='flex'\">\u6295\u7a3f<\/button>\n                <\/div>\n            <\/div>\n\n            <!-- \u6295\u7a3f1 -->\n            <div class=\"post\">\n                <div class=\"post-header\">\n                    <div class=\"profile-pic\"><\/div>\n                    <div>\n                        <h3>\u5c71\u7530\u592a\u90ce <span class=\"badge\">\u7ba1\u7406\u8005<\/span><\/h3>\n                        <small>2025\u5e743\u670829\u65e5 10:30 \u30fb \u516c\u958b<\/small>\n                    <\/div>\n                    <div class=\"post-options\">\u22ef\n                        <div class=\"options-menu\">\n                            <a href=\"#\">\u7de8\u96c6<\/a>\n                            <a href=\"#\">\u524a\u9664<\/a>\n                            <a href=\"#\">\u975e\u8868\u793a<\/a>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <p>\u65b0\u3057\u3044\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u9032\u6357\u5831\u544a\uff01\u30c1\u30fc\u30e0\u3067\u9811\u5f35\u3063\u3066\u307e\u3059\u3002<\/p>\n                <div class=\"post-image\"><\/div>\n                <div class=\"reactions\">\n                    <div class=\"reaction-stats\">\ud83d\udc4d 12 \u2764\ufe0f 5 \ud83d\ude02 3 \ud83d\ude2e 2<\/div>\n                    <div class=\"reaction-menu\">\n                        <span class=\"reaction\">\ud83d\udc4d<\/span>\n                        <span class=\"reaction\">\u2764\ufe0f<\/span>\n                        <span class=\"reaction\">\ud83d\ude02<\/span>\n                        <span class=\"reaction\">Grav\ud83d\ude2e<\/span>\n                        <span class=\"reaction\">\ud83d\ude22<\/span>\n                    <\/div>\n                <\/div>\n                <div class=\"post-actions-bar\">\n                    <span>\u30ea\u30a2\u30af\u30b7\u30e7\u30f3<\/span>\n                    <span>\u30b3\u30e1\u30f3\u30c8<\/span>\n                    <span>\u30b7\u30a7\u30a2<\/span>\n                <\/div>\n                <div class=\"comment-section\">\n                    <div class=\"comment\">\n                        <div class=\"profile-pic\"><\/div>\n                        <div class=\"comment-text\"><strong>\u4f50\u85e4\u82b1\u5b50<\/strong>: \u3059\u3054\u3044\u9032\u6357\u3060\u306d\uff01<\/div>\n                    <\/div>\n                    <div class=\"comment\">\n                        <div class=\"profile-pic\"><\/div>\n                        <div class=\"comment-text\"><strong>\u9234\u6728\u6b21\u90ce<\/strong>: \u304a\u75b2\u308c\u69d8\uff01<\/div>\n                    <\/div>\n                    <input type=\"text\" class=\"comment-input\" placeholder=\"\u30b3\u30e1\u30f3\u30c8\u3092\u5165\u529b...\">\n                <\/div>\n            <\/div>\n\n            <!-- \u6295\u7a3f2 -->\n            <div class=\"post\">\n                <div class=\"post-header\">\n                    <div class=\"profile-pic\"><\/div>\n                    <div>\n                        <h3>\u7530\u4e2d\u512a\u5b50<\/h3>\n                        <small>2025\u5e743\u670829\u65e5 09:15 \u30fb \u53cb\u9054\u306e\u307f<\/small>\n                    <\/div>\n                    <div class=\"post-options\">\u22ef\n                        <div class=\"options-menu\">\n                            <a href=\"#\">\u7de8\u96c6<\/a>\n                            <a href=\"#\">\u524a\u9664<\/a>\n                            <a href=\"#\">\u975e\u8868\u793a<\/a>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <p>\u9031\u672b\u306e\u6e29\u6cc9\u65c5\u884c\u304c\u697d\u3057\u307f\u3059\u304e\u308b\uff01<\/p>\n                <div class=\"reactions\">\n                    <div class=\"reaction-stats\">\ud83d\udc4d 8 \u2764\ufe0f 6 \ud83d\ude22 1<\/div>\n                    <div class=\"reaction-menu\">\n                        <span class=\"reaction\">\ud83d\udc4d<\/span>\n                        <span class=\"reaction\">\u2764\ufe0f<\/span>\n                        <span class=\"reaction\">\ud83d\ude02<\/span>\n                        <span class=\"reaction\">\ud83d\ude2e<\/span>\n                        <span class=\"reaction\">\ud83d\ude22<\/span>\n                    <\/div>\n                <\/div>\n                <div class=\"post-actions-bar\">\n                    <span>\u30ea\u30a2\u30af\u30b7\u30e7\u30f3<\/span>\n                    <span>\u30b3\u30e1\u30f3\u30c8<\/span>\n                    <span>\u30b7\u30a7\u30a2<\/span>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- \u53f3\u30b5\u30a4\u30c9\u30d0\u30fc -->\n        <div class=\"sidebar-right\">\n            <div class=\"sidebar-card\">\n                <h4>\u53cb\u9054\u30ea\u30b9\u30c8<\/h4>\n                <p><strong>\u4f50\u85e4\u82b1\u5b50<\/strong> - \u30aa\u30f3\u30e9\u30a4\u30f3<\/p>\n                <p><strong>\u9234\u6728\u6b21\u90ce<\/strong> - 5\u5206\u524d<\/p>\n                <p><strong>\u9ad8\u6a4b\u5065\u592a<\/strong> - \u30aa\u30d5\u30e9\u30a4\u30f3<\/p>\n            <\/div>\n            <div class=\"sidebar-card\">\n                <h4>\u30b0\u30eb\u30fc\u30d7<\/h4>\n                <p><a href=\"#\">\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u30c1\u30fc\u30e0<\/a> - 15\u4eba<\/p>\n                <p><a href=\"#\">\u6e29\u6cc9\u65c5\u884c\u30af\u30e9\u30d6<\/a> - 32\u4eba<\/p>\n            <\/div>\n            <div class=\"chat-window\">\n                <h4>\u30c1\u30e3\u30c3\u30c8 - \u4f50\u85e4\u82b1\u5b50<\/h4>\n                <div class=\"chat-message\">\n                    <div class=\"comment-text\">\u304a\u306f\u3088\u3046\uff01\u9031\u672b\u306e\u4e88\u5b9a\u306f\uff1f<\/div>\n                <\/div>\n                <div class=\"chat-message sent\">\n                    <div class=\"comment-text\">\u304a\u306f\u3088\u3046\uff01\u6e29\u6cc9\u884c\u304f\u3088\uff01<\/div>\n                <\/div>\n                <input type=\"text\" class=\"comment-input\" placeholder=\"\u30e1\u30c3\u30bb\u30fc\u30b8\u3092\u5165\u529b...\">\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- \u6295\u7a3f\u30e2\u30fc\u30c0\u30eb -->\n    <div id=\"postModal\" class=\"modal\">\n        <div class=\"modal-content\">\n            <h3>\u6295\u7a3f\u3092\u4f5c\u6210<\/h3>\n            <textarea rows=\"6\" placeholder=\"\u8a73\u7d30\u3092\u66f8\u3044\u3066\u306d\" style=\"width: 100%; padding: 10px;\"><\/textarea>\n            <div style=\"margin: 15px 0;\">\n                <label>\u516c\u958b\u7bc4\u56f2: <\/label>\n                <select style=\"padding: 5px;\">\n                    <option>\u516c\u958b<\/option>\n                    <option>\u53cb\u9054\u306e\u307f<\/option>\n                    <option>\u81ea\u5206\u306e\u307f<\/option>\n                <\/select>\n            <\/div>\n            <div class=\"post-actions\">\n                <button onclick=\"document.getElementById('postModal').style.display='none'\">\u30ad\u30e3\u30f3\u30bb\u30eb<\/button>\n                <button class=\"submit-btn\">\u6295\u7a3f<\/button>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- \u901a\u77e5\u30dd\u30c3\u30d7\u30a2\u30c3\u30d7 -->\n    <div class=\"notification-popup\">\n        <p><strong>\u4f50\u85e4\u82b1\u5b50<\/strong>\u304c\u3042\u306a\u305f\u306e\u6295\u7a3f\u306b\u30ea\u30a2\u30af\u30b7\u30e7\u30f3\u3057\u307e\u3057\u305f\u3002<\/p>\n    <\/div>\n\n    <!-- \u30d5\u30c3\u30bf\u30fc -->\n    <div class=\"footer\">\n        <p>\u00a9 2025 \u7a76\u6975SNS. All rights reserved.<\/p>\n        <p><a href=\"#\">\u30d7\u30e9\u30a4\u30d0\u30b7\u30fc<\/a> | <a href=\"#\">\u5229\u7528\u898f\u7d04<\/a> | <a href=\"#\">\u30b5\u30dd\u30fc\u30c8<\/a> | <a href=\"#\">\u8a00\u8a9e<\/a><\/p>\n    <\/div>\n\n    <script>\n        \/\/ \u7c21\u6613\u7684\u306a\u901a\u77e5\u30dd\u30c3\u30d7\u30a2\u30c3\u30d7\u306e\u8868\u793a\u5236\u5fa1\uff08\u30b5\u30f3\u30d7\u30eb\uff09\n        setTimeout(() => {\n            document.querySelector('.notification-popup').style.display = 'block';\n            setTimeout(() => {\n                document.querySelector('.notification-popup').style.display = 'none';\n            }, 3000);\n        }, 2000);\n    <\/script>\n<\/body>\n<\/html><\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"categories":[87],"tags":[3],"class_list":["post-25931","post","type-post","status-publish","format-standard","hentry","category-web","tag-programming"],"aioseo_notices":[],"jetpack_featured_media_url":"","_links":{"self":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/25931","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=25931"}],"version-history":[{"count":2,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/25931\/revisions"}],"predecessor-version":[{"id":25933,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/25931\/revisions\/25933"}],"wp:attachment":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=25931"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=25931"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=25931"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}