{"id":4699,"date":"2026-08-05T07:30:46","date_gmt":"2026-08-04T22:30:46","guid":{"rendered":"https:\/\/nansiki.net\/2018\/?p=4699"},"modified":"2026-10-06T16:46:05","modified_gmt":"2026-10-06T07:46:05","slug":"%e7%a4%be%e4%bc%9a_%e5%9c%b0%e7%90%86_%e6%97%a5%e6%9c%ac%e3%81%a8%e4%b8%96%e7%95%8c%e3%81%ae%e8%aa%bf%e6%9f%bb","status":"publish","type":"post","link":"https:\/\/nansiki.net\/2018\/archives\/4699","title":{"rendered":"\u793e\u4f1a_\u5730\u7406_\u65e5\u672c\u3068\u4e16\u754c\u306e\u8abf\u67fb"},"content":{"rendered":"<div class=\"veu_autoEyeCatchBox\"><img loading=\"lazy\" decoding=\"async\" width=\"784\" height=\"572\" src=\"https:\/\/nansiki.net\/2018\/wp-content\/uploads\/2022\/02\/kuizu.jpg\" class=\"attachment-large size-large wp-post-image\" alt=\"\u30af\u30a4\u30ba\" srcset=\"https:\/\/nansiki.net\/2018\/wp-content\/uploads\/2022\/02\/kuizu.jpg 784w, https:\/\/nansiki.net\/2018\/wp-content\/uploads\/2022\/02\/kuizu-300x219.jpg 300w, https:\/\/nansiki.net\/2018\/wp-content\/uploads\/2022\/02\/kuizu-768x560.jpg 768w\" sizes=\"auto, (max-width: 784px) 100vw, 784px\" \/><\/div>\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>\u793e\u4f1a_\u5730\u7406_\u65e5\u672c\u3068\u4e16\u754c\u306e\u8abf\u67fb<\/title>\n    <style>\n        \/* \u4e88\u671f\u305b\u306c\u7dd1\u8272\u306e\u80cc\u666f\u3084\u89aa\u8981\u7d20\u306e\u5e72\u6e09\u3092\u5f37\u5236\u30ea\u30bb\u30c3\u30c8 *\/\n        body *, .quiz-wrapper * {\n            background-color: transparent\\9;\n        }\n\n        :root {\n            --bg-color: #f7f9fb;\n            --card-bg: #ffffff;\n            --text-color: #333333;\n            --primary-color: #4a90e2;\n            --primary-hover: #357abd;\n            --border-color: #e1ecf7;\n            --success-color: #28a745;\n            --danger-color: #dc3545;\n            --warning-color: #ffc107;\n        }\n\n        body {\n            font-family: 'Helvetica Neue', Arial, sans-serif;\n            background-color: var(--bg-color) !important;\n            color: var(--text-color);\n            margin: 0;\n            padding: 40px 20px;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            min-height: 100vh;\n            box-sizing: border-box;\n        }\n\n        \/* \u72ec\u7acb\u3057\u305f\u30e9\u30c3\u30d1\u30fc\u3067\u5468\u56f2\u306e\u74b0\u5883\u304b\u3089\u5b8c\u5168\u306b\u9694\u96e2 *\/\n        .quiz-app-container {\n            width: 100%;\n            max-width: 760px;\n            background: var(--card-bg) !important;\n            border-radius: 16px;\n            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);\n            padding: 40px;\n            box-sizing: border-box;\n            display: flex;\n            flex-direction: column;\n            gap: 28px;\n            position: relative;\n            z-index: 10;\n        }\n\n        \/* \u30d1\u30f3\u304f\u305a\u30ea\u30b9\u30c8 *\/\n        .breadcrumb-container {\n            font-size: 13px;\n            color: #666;\n            background: #f8fafc !important;\n            padding: 12px 16px;\n            border-radius: 8px;\n            border: 1px solid #edf2f7;\n        }\n\n        \/* \u6295\u7a3f\u30bf\u30a4\u30c8\u30eb\u30fb\u30e1\u30bf\u60c5\u5831 *\/\n        .post-header {\n            border-bottom: 2px solid #f0f4f8;\n            padding-bottom: 24px;\n        }\n\n        .post-title {\n            font-size: 24px;\n            color: var(--primary-color);\n            font-weight: bold;\n            margin: 0 0 12px 0;\n        }\n\n        .post-meta {\n            display: flex;\n            gap: 20px;\n            font-size: 13px;\n            color: #777777;\n            align-items: center;\n            flex-wrap: wrap;\n        }\n\n        \/* \u5185\u5074\u306e\u30ab\u30fc\u30c9\uff08\u3086\u3063\u305f\u308a\u3068\u3057\u305f\u4f59\u767d\uff09 *\/\n        .inner-card {\n            background: #ffffff !important;\n            border: 1px solid #eef2f5;\n            border-radius: 12px;\n            padding: 32px;\n            box-shadow: 0 2px 10px rgba(0,0,0,0.02);\n        }\n\n        \/* \u30b9\u30bf\u30fc\u30c8\u753b\u9762\u5c02\u7528\u30b9\u30bf\u30a4\u30eb *\/\n        .start-heading {\n            text-align: center;\n            font-size: 20px;\n            font-weight: bold;\n            color: #333333;\n            margin-bottom: 24px;\n        }\n\n        .rule-box {\n            background-color: #f8fafc !important;\n            border-radius: 10px;\n            padding: 20px 24px;\n            margin-bottom: 28px;\n            border: 1px solid #edf2f7;\n        }\n\n        .rule-title {\n            font-weight: bold;\n            color: #444444;\n            margin-bottom: 10px;\n            font-size: 14px;\n        }\n\n        .rule-box ul {\n            margin: 0;\n            padding-left: 20px;\n            color: #444444;\n            line-height: 2.0;\n            font-size: 14px;\n        }\n\n        .btn {\n            background-color: var(--primary-color) !important;\n            color: white;\n            border: none;\n            padding: 16px 0;\n            width: 100%;\n            font-size: 16px;\n            font-weight: bold;\n            border-radius: 10px;\n            cursor: pointer;\n            transition: background-color 0.2s, box-shadow 0.2s;\n            display: block;\n            text-align: center;\n            box-shadow: 0 4px 12px rgba(74, 144, 226, 0.3);\n        }\n\n        .btn:hover {\n            background-color: var(--primary-hover) !important;\n        }\n\n        .screen {\n            display: none;\n        }\n\n        .screen.active {\n            display: block;\n        }\n\n        \/* \u30af\u30a4\u30ba\u753b\u9762\u7528\u30b9\u30bf\u30a4\u30eb *\/\n        .quiz-header {\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            margin-bottom: 24px;\n            font-size: 14px;\n            color: #777777;\n            border-bottom: 2px solid #f0f4f8;\n            padding-bottom: 16px;\n        }\n\n        .timer {\n            font-weight: bold;\n            color: var(--danger-color);\n            font-size: 16px;\n        }\n\n        .question-box {\n            font-size: 20px;\n            font-weight: bold;\n            color: #333333;\n            margin-bottom: 28px;\n            line-height: 1.6;\n        }\n\n        .options-group {\n            display: flex;\n            flex-direction: column;\n            gap: 14px;\n            margin-bottom: 28px;\n        }\n\n        .option-label {\n            display: flex;\n            align-items: center;\n            padding: 16px 20px;\n            border: 2px solid var(--border-color);\n            border-radius: 10px;\n            cursor: pointer;\n            transition: all 0.2s;\n            background: #f9fbfd !important;\n            font-size: 16px;\n        }\n\n        .option-label:hover {\n            background: #f0f4f8 !important;\n            border-color: var(--primary-color);\n        }\n\n        .option-label input {\n            margin-right: 16px;\n            transform: scale(1.3);\n        }\n\n        .option-label.selected {\n            border-color: var(--primary-color);\n            background: #eef5ff !important;\n            font-weight: bold;\n        }\n\n        .nav-buttons {\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            margin-top: 28px;\n            border-top: 1px solid #eeeeee;\n            padding-top: 20px;\n        }\n\n        .nav-btn {\n            background-color: #6c757d !important;\n            color: white;\n            border: none;\n            padding: 10px 20px;\n            border-radius: 8px;\n            cursor: pointer;\n            font-size: 14px;\n        }\n\n        .nav-btn:hover {\n            background-color: #5a6268 !important;\n        }\n\n        .nav-btn:disabled {\n            background-color: #d6d8db !important;\n            cursor: not-allowed;\n        }\n\n        .flag-btn {\n            background-color: #ffc107 !important;\n            color: #333;\n            border: none;\n            padding: 8px 14px;\n            border-radius: 8px;\n            cursor: pointer;\n            font-weight: bold;\n            font-size: 13px;\n        }\n\n        .flag-btn.active {\n            background-color: #e0a800 !important;\n            box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);\n        }\n\n        \/* \u554f\u984c\u756a\u53f7\u30d1\u30ec\u30c3\u30c8 *\/\n        .palette-container {\n            margin-top: 28px;\n            border-top: 1px solid #eeeeee;\n            padding-top: 20px;\n        }\n\n        .palette-title {\n            font-size: 14px;\n            font-weight: bold;\n            margin-bottom: 10px;\n            color: #555555;\n        }\n\n        .palette-grid {\n            display: grid;\n            grid-template-columns: repeat(10, 1fr);\n            gap: 8px;\n        }\n\n        .palette-item {\n            aspect-ratio: 1;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            font-size: 13px;\n            border: 1px solid var(--border-color);\n            border-radius: 6px;\n            background: #fff !important;\n            cursor: pointer;\n            font-weight: bold;\n        }\n\n        .palette-item.answered {\n            background-color: #d1e7dd !important;\n            border-color: #badbcc;\n            color: #0f5132;\n        }\n\n        .palette-item.flagged {\n            border-color: var(--warning-color);\n            position: relative;\n        }\n        .palette-item.flagged::after {\n            content: '\u2605';\n            position: absolute;\n            top: -4px;\n            right: -2px;\n            font-size: 9px;\n            color: #d39e00;\n        }\n\n        .palette-item.current {\n            border-color: var(--primary-color);\n            box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.3);\n        }\n\n        \/* \u7d50\u679c\u753b\u9762\u30b9\u30bf\u30a4\u30eb *\/\n        .result-summary {\n            text-align: center;\n            margin-bottom: 24px;\n            background: #f8f9fa !important;\n            padding: 20px;\n            border-radius: 12px;\n        }\n\n        .score-display {\n            font-size: 32px;\n            font-weight: bold;\n            color: var(--primary-color);\n            margin: 8px 0;\n        }\n\n        .filter-tabs {\n            display: flex;\n            gap: 10px;\n            margin-bottom: 20px;\n            justify-content: center;\n            flex-wrap: wrap;\n        }\n\n        .filter-tab {\n            padding: 8px 16px;\n            border: 1px solid var(--border-color);\n            background: #fff !important;\n            border-radius: 20px;\n            cursor: pointer;\n            font-size: 13px;\n        }\n\n        .filter-tab.active {\n            background: var(--primary-color) !important;\n            color: white;\n            border-color: var(--primary-color);\n        }\n\n        .result-item {\n            border: 1px solid var(--border-color);\n            border-radius: 10px;\n            padding: 18px;\n            margin-bottom: 16px;\n            background: #fff !important;\n        }\n\n        .result-item.correct {\n            border-left: 6px solid var(--success-color);\n        }\n\n        .result-item.incorrect {\n            border-left: 6px solid var(--danger-color);\n        }\n\n        .explanation {\n            background: #fdfdfe !important;\n            border: 1px solid #e2e8f0;\n            padding: 12px 14px;\n            border-radius: 8px;\n            margin-top: 12px;\n            font-size: 14px;\n            color: #4a5568;\n            line-height: 1.6;\n        }\n    <\/style>\n<\/head>\n<body>\n\n<div class=\"quiz-app-container\">\n    <!-- \u4e0a\u90e8\u30d1\u30f3\u304f\u305a\u30ea\u30b9\u30c8 -->\n    <div class=\"breadcrumb-container\">\n        &#x1f3e0; \u30cd\u30b9\u30b3\u30e0\u4e2d\u91ce\u6559\u5ba4\u3063\u3066\u3069\u3093\u306a\u587e\uff1f\u4f1d\u3048\u305f\u3044\u3053\u30685\u9078 \/ \u30af\u30a4\u30ba \/ \u793e\u4f1a_\u5730\u7406_\u65e5\u672c\u3068\u4e16\u754c\u306e\u8abf\u67fb\n    <\/div>\n\n    <!-- \u6295\u7a3f\u30bf\u30a4\u30c8\u30eb\u3068\u30e1\u30bf\u60c5\u5831 -->\n    <div class=\"post-header\">\n        <h1 class=\"post-title\">\u793e\u4f1a_\u5730\u7406_\u65e5\u672c\u3068\u4e16\u754c\u306e\u8abf\u67fb<\/h1>\n        <div class=\"post-meta\">\n            <span>&#x1f4c5; 2026\u5e7410\u67085\u65e5<\/span>\n            <span>&#x1f552; 2026\u5e7410\u67085\u65e5<\/span>\n            <span>&#x1f464; \u30cd\u30b9\u30b3\u30e0\u4e2d\u91ce\u6559\u5ba4<\/span>\n        <\/div>\n    <\/div>\n\n    <!-- \u30b9\u30bf\u30fc\u30c8\u753b\u9762 -->\n    <div id=\"start-screen\" class=\"screen active\">\n        <div class=\"inner-card\">\n            <div style=\"text-align: center; margin-bottom: 20px;\">\n                <h2 style=\"color: var(--primary-color); font-size: 20px; margin-bottom: 6px;\">\u4e2d\u5b66\u793e\u4f1a \u5730\u7406 \u4e00\u554f\u4e00\u7b54<\/h2>\n                <p style=\"color: #666666; font-size: 13px; margin: 0;\">\u7b2c22\u56de \u4eba\u3005\u306e\u751f\u6d3b\u3068\u74b0\u5883\uff08\u516880\u554f\u3088\u308a\u30e9\u30f3\u30c0\u30e020\u554f\u51fa\u984c\uff09<\/p>\n            <\/div>\n\n            <div class=\"start-heading\">\n                \u30c6\u30b9\u30c8\u3092\u59cb\u3081\u308b\u6e96\u5099\u306f\u3044\u3044\u3067\u3059\u304b\uff1f\n            <\/div>\n\n            <div class=\"rule-box\">\n                <div class=\"rule-title\">\u3010\u30c6\u30b9\u30c8\u306e\u30eb\u30fc\u30eb\u3011<\/div>\n                <ul>\n                    <li>\u516880\u554f\u306e\u30c7\u30fc\u30bf\u30d9\u30fc\u30b9\u304b\u3089\u3001\u30e9\u30f3\u30c0\u30e0\u306b20\u554f\u51fa\u984c\u3055\u308c\u307e\u3059\u3002<\/li>\n                    <li>\u5236\u9650\u6642\u9593\u306f<strong>10\u5206<\/strong>\u3067\u3059\uff08\u6642\u9593\u5207\u308c\u3067\u81ea\u52d5\u63a1\u70b9\u3055\u308c\u307e\u3059\uff09\u3002<\/li>\n                    <li>\u9078\u629e\u80a2\u306f\u3059\u3079\u30663\u629e\u4ee5\u4e0a\u3067\u3059\u3002\u3058\u3063\u304f\u308a\u8003\u3048\u3066\u89e3\u7b54\u3057\u307e\u3057\u3087\u3046\u3002<\/li>\n                    <li>\u308f\u304b\u3089\u306a\u3044\u554f\u984c\u306f\u300c\u2606 \u898b\u76f4\u3057\u30c1\u30a7\u30c3\u30af\u300d\u3092\u3064\u3051\u3066\u5f8c\u304b\u3089\u898b\u76f4\u305b\u307e\u3059\u3002<\/li>\n                <\/ul>\n            <\/div>\n\n            <button class=\"btn\" id=\"start-btn\">\u30c6\u30b9\u30c8\u30b9\u30bf\u30fc\u30c8<\/button>\n        <\/div>\n    <\/div>\n\n    <!-- \u30af\u30a4\u30ba\u753b\u9762 -->\n    <div id=\"quiz-screen\" class=\"screen\">\n        <div class=\"quiz-header\">\n            <div>\u554f <span id=\"current-q-num\">1<\/span> \/ 20<\/div>\n            <div class=\"timer\">\u6b8b\u308a\u6642\u9593: <span id=\"time-left\">10:00<\/span><\/div>\n            <button class=\"flag-btn\" id=\"flag-btn\">\u2606 \u898b\u76f4\u3057\u30c1\u30a7\u30c3\u30af<\/button>\n        <\/div>\n\n        <div class=\"question-box\" id=\"question-text\">\n            \u3053\u3053\u306b\u554f\u984c\u6587\u304c\u8868\u793a\u3055\u308c\u307e\u3059\u3002\n        <\/div>\n\n        <div class=\"options-group\" id=\"options-container\">\n            <!-- \u9078\u629e\u80a2\u304c\u3053\u3053\u306b\u52d5\u7684\u306b\u751f\u6210\u3055\u308c\u307e\u3059 -->\n        <\/div>\n\n        <div class=\"nav-buttons\">\n            <button class=\"nav-btn\" id=\"prev-btn\">\u524d\u306e\u554f\u984c<\/button>\n            <button class=\"nav-btn\" id=\"next-btn\">\u6b21\u306e\u554f\u984c<\/button>\n        <\/div>\n\n        <div class=\"palette-container\">\n            <div class=\"palette-title\">\u554f\u984c\u756a\u53f7\u30d1\u30ec\u30c3\u30c8\uff08\u30af\u30ea\u30c3\u30af\u3067\u79fb\u52d5\uff09<\/div>\n            <div class=\"palette-grid\" id=\"palette-grid\">\n                <!-- \u30d1\u30ec\u30c3\u30c8\u30dc\u30bf\u30f3\u304c\u3053\u3053\u306b\u751f\u6210\u3055\u308c\u307e\u3059 -->\n            <\/div>\n        <\/div>\n        \n        <button class=\"btn\" id=\"submit-btn\" style=\"margin-top: 28px; background-color: var(--success-color) !important; box-shadow: 0 4px 12px rgba(40, 167, 69, 0.3);\">\u30c6\u30b9\u30c8\u3092\u7d42\u4e86\u3057\u3066\u63a1\u70b9\u3059\u308b<\/button>\n    <\/div>\n\n    <!-- \u7d50\u679c\u753b\u9762 -->\n    <div id=\"result-screen\" class=\"screen\">\n        <h2 style=\"color: var(--primary-color); text-align: center; margin-bottom: 20px; font-size: 22px;\">\u30c6\u30b9\u30c8\u7d50\u679c<\/h2>\n        <div class=\"result-summary\">\n            <div>\u3042\u306a\u305f\u306e\u5f97\u70b9<\/div>\n            <div class=\"score-display\"><span id=\"final-score\">0<\/span>\u70b9 \/ 100\u70b9<\/div>\n            <div style=\"font-size: 14px; color: #666;\">\u6240\u8981\u6642\u9593: <span id=\"time-spent\">0\u52060\u79d2<\/span><\/div>\n        <\/div>\n\n        <div class=\"filter-tabs\">\n            <button class=\"filter-tab active\" data-filter=\"all\">\u3059\u3079\u3066\u8868\u793a<\/button>\n            <button class=\"filter-tab\" data-filter=\"incorrect\">\u00d7 \u4e0d\u6b63\u89e3\u306e\u307f<\/button>\n            <button class=\"filter-tab\" data-filter=\"flagged\">\u2606 \u898b\u76f4\u3057\u30c1\u30a7\u30c3\u30af\u306e\u307f<\/button>\n        <\/div>\n\n        <div id=\"result-list\">\n            <!-- \u7d50\u679c\u306e\u8a73\u7d30\u30ea\u30b9\u30c8\u304c\u3053\u3053\u306b\u633f\u5165\u3055\u308c\u307e\u3059 -->\n        <\/div>\n\n        <button class=\"btn\" id=\"retry-btn\">\u3082\u3046\u4e00\u5ea6\u6311\u6226\u3059\u308b<\/button>\n    <\/div>\n<\/div>\n\n<script>\n(function() {\n    \/\/ \u5168\u554f\u984c\u30c7\u30fc\u30bf\u30b9\u30c8\u30c3\u30af\uff08\u5730\u7406\u4e00\u554f\u4e00\u7b54\uff09\n    const allQuestionsData = [\n        { q: \"\u9244\u4ee5\u5916\u306e\u91d1\u5c5e\u5de5\u696d\u3092\u7dcf\u79f0\u3057\u3066\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u975e\u9244\u91d1\u5c5e\u5de5\u696d\", \"\u8efd\u91d1\u5c5e\u5de5\u696d\", \"\u91cd\u5316\u5b66\u5de5\u696d\"], answer: \"\u975e\u9244\u91d1\u5c5e\u5de5\u696d\", exp: \"\u9244\u92fc\u696d\u4ee5\u5916\u306e\u9285\u30fb\u30a2\u30eb\u30df\u30cb\u30a6\u30e0\u30fb\u4e9c\u925b\u306a\u3069\u306e\u91d1\u5c5e\u3092\u52a0\u5de5\u30fb\u7cbe\u932c\u3059\u308b\u7523\u696d\u3092\u300c\u975e\u9244\u91d1\u5c5e\u5de5\u696d\u300d\u3068\u3044\u3044\u307e\u3059\u3002\" },\n        { q: \"\u5bb6\u5ead\u5916\u3067\u3042\u308b\u30ec\u30b9\u30c8\u30e9\u30f3\u3084\u98df\u5802\u306a\u3069\u3067\u98df\u4e8b\u3092\u63d0\u4f9b\u3059\u308b\u7523\u696d\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u5916\u98df\u7523\u696d\", \"\u30b5\u30fc\u30d3\u30b9\u7523\u696d\", \"\u6d41\u901a\u7523\u696d\"], answer: \"\u5916\u98df\u7523\u696d\", exp: \"\u5916\u98df\u7523\u696d\u306f\u3001\u8abf\u7406\u3055\u308c\u305f\u98df\u4e8b\u3092\u5bb6\u5ead\u5916\u3067\u63d0\u4f9b\u3059\u308b\u98f2\u98df\u5e97\u306e\u7dcf\u79f0\u3067\u3059\u3002\" },\n        { q: \"\u5357\u4e5d\u5dde\u3084\u5c71\u9670\u3001\u6771\u5317\u3001\u5317\u6d77\u9053\u306e\u5c71\u9593\u90e8\u3084\u96e2\u5cf6\u306a\u3069\u3067\u3001\u304d\u308f\u3081\u3066\u4eba\u53e3\u5bc6\u5ea6\u304c\u4f4e\u304f\u306a\u308a\u3001\u793e\u4f1a\u751f\u6d3b\u304c\u56f0\u96e3\u3068\u306a\u3063\u3066\u304d\u3066\u3044\u308b\u73fe\u8c61\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u904e\u758e\", \"\u904e\u5bc6\", \"\u90fd\u5e02\u5316\"], answer: \"\u904e\u758e\", exp: \"\u4eba\u53e3\u304c\u6e1b\u5c11\u3057\u3066\u5730\u57df\u793e\u4f1a\u306e\u7dad\u6301\u304c\u96e3\u3057\u304f\u306a\u308b\u73fe\u8c61\u3092\u300c\u904e\u758e\u300d\u3068\u3044\u3044\u307e\u3059\u3002\u53cd\u5bfe\u306b\u5927\u90fd\u5e02\u3078\u306e\u4eba\u53e3\u96c6\u4e2d\u306f\u300c\u904e\u5bc6\u300d\u3067\u3059\u3002\" },\n        { q: \"\u5730\u8868\u304c\u3001\u98a8\u96e8\u3084\u6e29\u5ea6\u5909\u5316\u3001\u5730\u4e0b\u6c34\u306a\u3069\u306e\u5f71\u97ff\u3067\u3082\u308d\u304f\u306a\u3063\u305f\u308a\u304f\u305a\u308c\u305f\u308a\u3059\u308b\u73fe\u8c61\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u98a8\u5316\", \"\u4fb5\u98df\", \"\u904b\u642c\"], answer: \"\u98a8\u5316\", exp: \"\u5ca9\u77f3\u304c\u592a\u967d\u71b1\u3001\u6c34\u5206\u3001\u5927\u6c17\u3001\u751f\u7269\u306a\u3069\u306e\u50cd\u304d\u306b\u3088\u3063\u3066\u7834\u58ca\u3055\u308c\u3001\u3082\u308d\u304f\u306a\u308b\u73fe\u8c61\u3092\u98a8\u5316\u3068\u3044\u3044\u307e\u3059\u3002\" },\n        { q: \"\u3058\u3083\u304c\u3044\u3082\u306e\u751f\u7523\u9ad8\u304c\u5168\u56fd\u4e00\u306e\u90fd\u9053\u5e9c\u770c\u540d\u3092\u7b54\u3048\u3088\u3002\", options: [\"\u5317\u6d77\u9053\", \"\u9752\u68ee\u770c\", \"\u9577\u91ce\u770c\"], answer: \"\u5317\u6d77\u9053\", exp: \"\u5317\u6d77\u9053\u306f\u51b7\u6dbc\u306a\u6c17\u5019\u3092\u3044\u304b\u3057\u3066\u3001\u3058\u3083\u304c\u3044\u3082\u3084\u305f\u307e\u306d\u304e\u3001\u3066\u3093\u3055\u3044\u306a\u3069\u306e\u751f\u7523\u304c\u5168\u56fd1\u4f4d\u3067\u3059\u3002\" },\n        { q: \"\u6d77\u6c34\u304c\u4e00\u5b9a\u306e\u65b9\u5411\u306b\u5411\u304b\u3063\u3066\u6d41\u308c\u3066\u3044\u304f\u52d5\u304d\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u6d77\u6d41\", \"\u6f6e\u6c50\", \"\u6ce2\u6d6a\"], answer: \"\u6d77\u6d41\", exp: \"\u5730\u7403\u898f\u6a21\u306e\u98a8\u3084\u6c34\u6e29\u30fb\u5869\u5206\u6fc3\u5ea6\u306e\u9055\u3044\u306b\u3088\u3063\u3066\u3001\u6d77\u306e\u6c34\u304c\u4e00\u5b9a\u65b9\u5411\u3078\u5e2f\u72b6\u306b\u6d41\u308c\u308b\u73fe\u8c61\u3092\u6d77\u6d41\uff08\u6696\u6d41\u30fb\u5bd2\u6d41\uff09\u3068\u3044\u3044\u307e\u3059\u3002\" },\n        { q: \"\u65e5\u672c\u306e\u4eba\u53e3\u306b\u304a\u3051\u308b\u7279\u5fb4\u3068\u3057\u3066\u6b63\u3057\u3044\u3082\u306e\u30921\u3064\u9078\u3073\u306a\u3055\u3044\u3002\", options: [\"\u9ad8\u9f62\u5316\u304c\u9032\u3093\u3067\u3044\u308b\", \"\u51fa\u751f\u7387\u304c\u6975\u3081\u3066\u9ad8\u3044\", \"\u4eba\u53e3\u30d4\u30e9\u30df\u30c3\u30c9\u304c\u30d4\u30e9\u30df\u30c3\u30c9\u578b\u3067\u3042\u308b\"], answer: \"\u9ad8\u9f62\u5316\u304c\u9032\u3093\u3067\u3044\u308b\", exp: \"\u65e5\u672c\u306f\u4e16\u754c\u3067\u3082\u30c8\u30c3\u30d7\u30af\u30e9\u30b9\u306e\u8d85\u9ad8\u9f62\u793e\u4f1a\u3067\u3042\u308a\u3001\u51fa\u751f\u7387\u4f4e\u4e0b\u3068\u5e73\u5747\u5bff\u547d\u5ef6\u4f38\u306b\u3088\u308a\u300c\u3064\u307c\u578b\u300d\u306e\u4eba\u53e3\u30d4\u30e9\u30df\u30c3\u30c9\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u3002\" },\n        { q: \"\u304d\u3085\u3046\u308a\u306e\u751f\u7523\u9ad8\u304c\u5168\u56fd\u4e00\u306e\u90fd\u9053\u5e9c\u770c\u540d\u3092\u7b54\u3048\u3088\u3002\", options: [\"\u5bae\u5d0e\u770c\", \"\u5317\u6d77\u9053\", \"\u9ad8\u77e5\u770c\"], answer: \"\u5bae\u5d0e\u770c\", exp: \"\u5bae\u5d0e\u770c\u3084\u7fa4\u99ac\u770c\u306a\u3069\u306f\u6e29\u6696\u306a\u6c17\u5019\u3084\u4fc3\u6210\u683d\u57f9\u3092\u3044\u304b\u3057\u3066\u3001\u304d\u3085\u3046\u308a\u3084\u30d4\u30fc\u30de\u30f3\u306a\u3069\u306e\u5712\u82b8\u8fb2\u696d\u304c\u76db\u3093\u3067\u3059\u3002\" },\n        { q: \"\u5316\u5b66\u80a5\u6599\u3084\u8fb2\u85ac\u3092\u4f7f\u308f\u305a\u3001\u5806\u80a5\u306a\u3069\u306e\u6709\u6a5f\u7269\u3092\u4f7f\u3063\u3066\u884c\u3046\u8fb2\u696d\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u6709\u6a5f\u8fb2\u696d\", \"\u8fd1\u90ca\u8fb2\u696d\", \"\u4fc3\u6210\u683d\u57f9\"], answer: \"\u6709\u6a5f\u8fb2\u696d\", exp: \"\u74b0\u5883\u3078\u306e\u8ca0\u8377\u3092\u6e1b\u3089\u3057\u3001\u5b89\u5168\u306a\u8fb2\u4f5c\u7269\u3092\u80b2\u3066\u308b\u305f\u3081\u306b\u5316\u5b66\u5408\u6210\u80a5\u6599\u3084\u8fb2\u85ac\u3092\u907f\u3051\u308b\u8fb2\u696d\u3092\u6709\u6a5f\u8fb2\u696d\uff08\u30aa\u30fc\u30ac\u30cb\u30c3\u30af\uff09\u3068\u547c\u3073\u307e\u3059\u3002\" },\n        { q: \"\u65e5\u672c\u306b\u304a\u3044\u3066\u3001\u5916\u56fd\u3078\u65c5\u884c\u3059\u308b\u4eba\u3068\u5916\u56fd\u304b\u3089\u3084\u3063\u3066\u304f\u308b\u4eba\u3068\u3067\u306f\u3069\u3061\u3089\u304c\u591a\u3044\u304b\u3002\", options: [\"\u5916\u56fd\u304b\u3089\u3084\u3063\u3066\u304f\u308b\u4eba\", \"\u5916\u56fd\u3078\u65c5\u884c\u3059\u308b\u4eba\", \"\u307b\u307c\u540c\u3058\"], answer: \"\u5916\u56fd\u304b\u3089\u3084\u3063\u3066\u304f\u308b\u4eba\", exp: \"\u8fd1\u5e74\u306f\u30a4\u30f3\u30d0\u30a6\u30f3\u30c9\uff08\u8a2a\u65e5\u5916\u56fd\u4eba\u89b3\u5149\u5ba2\uff09\u306e\u5897\u52a0\u306b\u3088\u308a\u3001\u65e5\u672c\u3092\u8a2a\u308c\u308b\u5916\u56fd\u4eba\u306e\u307b\u3046\u304c\u591a\u304f\u306a\u3063\u3066\u3044\u307e\u3059\u3002\" },\n        { q: \"\u6cb3\u5ddd\u3084\u6d77\u3001\u6c37\u3001\u98a8\u306a\u3069\u306b\u3088\u308a\u3001\u5730\u8868\u3092\u524a\u308b\u4f5c\u7528\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u4fb5\u98df\", \"\u5806\u7a4d\", \"\u98a8\u5316\"], answer: \"\u4fb5\u98df\", exp: \"\u6d41\u6c34\u3084\u6c37\u6cb3\u3001\u98a8\u306a\u3069\u306e\u5916\u529b\u306b\u3088\u3063\u3066\u3001\u5730\u8868\u306e\u5ca9\u77f3\u3084\u571f\u7802\u304c\u524a\u308a\u53d6\u3089\u308c\u308b\u73fe\u8c61\u3092\u4fb5\u98df\u3068\u3044\u3044\u307e\u3059\u3002\" },\n        { q: \"\u5730\u76e4\u306e\u6c88\u964d\u306b\u3088\u3063\u3066\u3067\u304d\u305f\u3001\u7d30\u9577\u304f\u5165\u308a\u7d44\u3093\u3060\u8907\u96d1\u306a\u51fa\u5165\u308a\u306e\u6d77\u5cb8\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u30ea\u30a2\u30b9\u6d77\u5cb8\", \"\u7802\u6d5c\u6d77\u5cb8\", \"\u6d77\u5cb8\u5e73\u91ce\"], answer: \"\u30ea\u30a2\u30b9\u6d77\u5cb8\", exp: \"\u5c71\u5730\u304c\u6d77\u306b\u6c88\u3093\u3067\u8c37\u9593\u304c\u6c34\u306b\u6d78\u304b\u3063\u305f\u7d50\u679c\u3067\u304d\u308b\u3001\u6d77\u5cb8\u7dda\u304c\u5165\u308a\u7d44\u3093\u3060\u5730\u5f62\u3092\u30ea\u30a2\u30b9\u6d77\u5cb8\u3068\u3044\u3044\u307e\u3059\u3002\" },\n        { q: \"\u9060\u6d0b\u6f01\u696d\u30fb\u6c96\u5408\u6f01\u696d\u30fb\u6cbf\u5cb8\u6f01\u696d\u306e\u3046\u3061\u3001\u65e5\u672c\u306e\u6f01\u696d\u306b\u304a\u3044\u3066\u6700\u3082\u6f01\u7372\u9ad8\u306e\u591a\u3044\u3082\u306e\u306f\u4f55\u304b\u3002\", options: [\"\u6c96\u5408\u6f01\u696d\", \"\u9060\u6d0b\u6f01\u696d\", \"\u6cbf\u5cb8\u6f01\u696d\"], answer: \"\u6c96\u5408\u6f01\u696d\", exp: \"\u65e5\u672c\u306e\u5468\u8fba\u6d77\u57df\u3067\u884c\u308f\u308c\u308b\u300c\u6c96\u5408\u6f01\u696d\u300d\u304c\u3001\u65e5\u672c\u306e\u7dcf\u6f01\u7372\u91cf\u306e\u5927\u90e8\u5206\u3092\u5360\u3081\u3066\u3044\u307e\u3059\u3002\" },\n        { q: \"\u4e16\u754c\u6700\u5927\u7d1a\u306e\u67cf\u5d0e\u5208\u7fbd\u539f\u5b50\u529b\u767a\u96fb\u6240\u304c\u5efa\u8a2d\u3055\u308c\u305f\u306e\u306f\u65b0\u6f5f\u770c\u306e\u4f55\u5e02\u304b\u3002\", options: [\"\u67cf\u5d0e\u5e02\", \"\u65b0\u6f5f\u5e02\", \"\u9577\u5ca1\u5e02\"], answer: \"\u67cf\u5d0e\u5e02\", exp: \"\u65b0\u6f5f\u770c\u67cf\u5d0e\u5e02\u304a\u3088\u3073\u5208\u7fbd\u6751\u306b\u307e\u305f\u304c\u3063\u3066\u4e16\u754c\u6700\u5927\u7d1a\u306e\u539f\u5b50\u529b\u767a\u96fb\u6240\u304c\u5b58\u5728\u3057\u307e\u3059\u3002\" },\n        { q: \"\u65e5\u672c\u3067\u3001\u6625\u304b\u3089\u590f\u3078\u306e\u304b\u308f\u308a\u3081\u306b\u964d\u308b\u9577\u96e8\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u6885\u96e8\", \"\u79cb\u96e8\", \"\u53f0\u98a8\"], answer: \"\u6885\u96e8\", exp: \"\u30a2\u30b8\u30a2\u306e\u30e2\u30f3\u30b9\u30fc\u30f3\u6c17\u5019\u306e\u5f71\u97ff\u3067\u3001\u521d\u590f\u306b\u65e5\u672c\u4ed8\u8fd1\u306b\u505c\u6ede\u3059\u308b\u524d\u7dda\uff08\u6885\u96e8\u524d\u7dda\uff09\u306b\u3088\u3063\u3066\u3082\u305f\u3089\u3055\u308c\u308b\u9577\u96e8\u3092\u6885\u96e8\u3068\u3044\u3044\u307e\u3059\u3002\" },\n        { q: \"\u98df\u7528\u306e\u306b\u308f\u3068\u308a\uff08\u30d6\u30ed\u30a4\u30e9\u30fc\uff09\u3092\u6700\u3082\u591a\u304f\u98fc\u80b2\u3057\u3066\u3044\u308b\u90fd\u9053\u5e9c\u770c\u540d\u3092\u7b54\u3048\u3088\u3002\", options: [\"\u5bae\u5d0e\u770c\", \"\u9e7f\u5150\u5cf6\u770c\", \"\u8328\u57ce\u770c\"], answer: \"\u5bae\u5d0e\u770c\", exp: \"\u5bae\u5d0e\u770c\u306f\u30d6\u30ed\u30a4\u30e9\u30fc\u3084\u8c5a\u306e\u98fc\u80b2\u982d\u6570\u304c\u5168\u56fd\u30c8\u30c3\u30d7\u30af\u30e9\u30b9\u306e\u755c\u7523\u770c\u3067\u3059\u3002\" },\n        { q: \"\u5730\u65b9\u304b\u3089\u5927\u90fd\u5e02\u3078\u79fb\u52d5\u3057\u305f\u8005\u304c\u751f\u307e\u308c\u305f\u6545\u90f7\u306b\u3082\u3069\u308b\u73fe\u8c61\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"U\u30bf\u30fc\u30f3\u73fe\u8c61\", \"J\u30bf\u30fc\u30f3\u73fe\u8c61\", \"I\u30bf\u30fc\u30f3\u73fe\u8c61\"], answer: \"U\u30bf\u30fc\u30f3\u73fe\u8c61\", exp: \"\u5730\u65b9\u51fa\u8eab\u8005\u304c\u9032\u5b66\u3084\u5c31\u8077\u3067\u90fd\u4f1a\u306b\u51fa\u305f\u3042\u3068\u3001\u6545\u90f7\u306b\u623b\u3063\u3066\u66ae\u3089\u3059\u3088\u3046\u306b\u306a\u308b\u3053\u3068\u3092U\u30bf\u30fc\u30f3\u73fe\u8c61\u3068\u547c\u3073\u307e\u3059\u3002\" },\n        { q: \"\u4e16\u754c\u306e\u4eba\u53e3\u306e\u304a\u3088\u305d60%\u304c\u96c6\u307e\u3063\u3066\u3044\u308b\u5927\u9678\u30fb\u5730\u57df\u306f\u3069\u3053\u304b\u3002\", options: [\"\u30a2\u30b8\u30a2\", \"\u30a2\u30d5\u30ea\u30ab\", \"\u30e8\u30fc\u30ed\u30c3\u30d1\"], answer: \"\u30a2\u30b8\u30a2\", exp: \"\u4e16\u754c\u306e\u4eba\u53e3\u306e\u7d046\u5272\u304c\u30a2\u30b8\u30a2\u5dde\u306b\u96c6\u4e2d\u3057\u3066\u3044\u307e\u3059\u3002\" },\n        { q: \"\u77f3\u6cb9\u3084\u5929\u7136\u30ac\u30b9\u306a\u3069\u306e\u5316\u77f3\u71c3\u6599\u304b\u3089\u3064\u304f\u3089\u308c\u308b\u5408\u6210\u7e4a\u7dad\u3092\u4f55\u3068\u3044\u3046\u304b\u3002\", options: [\"\u5316\u5b66\u7e4a\u7dad\", \"\u5929\u7136\u7e4a\u7dad\", \"\u690d\u7269\u7e4a\u7dad\"], answer: \"\u5316\u5b66\u7e4a\u7dad\", exp: \"\u30ca\u30a4\u30ed\u30f3\u3001\u30dd\u30ea\u30a8\u30b9\u30c6\u30eb\u306a\u3069\u306e\u77f3\u6cb9\u5316\u5b66\u88fd\u54c1\u304b\u3089\u5408\u6210\u3055\u308c\u308b\u7e4a\u7dad\u3092\u5316\u5b66\u7e4a\u7dad\u3068\u3044\u3044\u307e\u3059\u3002\" },\n        { q: \"\u65e5\u672c\u306e\u98df\u6599\u81ea\u7d66\u7387\u306f\u3001\u4e3b\u8981\u306a\u5148\u9032\u56fd\u3068\u6bd4\u8f03\u3057\u3066\u3069\u306e\u3088\u3046\u306a\u72b6\u614b\u306b\u3042\u308b\u304b\u3002\", options: [\"\u4f4e\u3044\", \"\u9ad8\u3044\", \"\u540c\u3058\u304f\u3089\u3044\"], answer: \"\u4f4e\u3044\", exp: \"\u65e5\u672c\u306e\u30ab\u30ed\u30ea\u30fc\u30d9\u30fc\u30b9\u306e\u98df\u6599\u81ea\u7d66\u7387\u306f\u7d044\u5272\u3067\u3042\u308a\u3001\u4e3b\u8981\u306a\u5148\u9032\u56fd\u306e\u4e2d\u3067\u3082\u4f4e\u3044\u6c34\u6e96\u306b\u3042\u308a\u307e\u3059\u3002\" }\n    ];\n\n    let selectedQuestions = [];\n    let userAnswers = {};\n    let flaggedQuestions = {};\n    let timerInterval = null;\n    let timeLeft = 600;\n    let currentQuestionIndex = 0;\n    let startTime = 0;\n\n    const startScreen = document.getElementById('start-screen');\n    const quizScreen = document.getElementById('quiz-screen');\n    const resultScreen = document.getElementById('result-screen');\n    const startBtn = document.getElementById('start-btn');\n    const prevBtn = document.getElementById('prev-btn');\n    const nextBtn = document.getElementById('next-btn');\n    const submitBtn = document.getElementById('submit-btn');\n    const retryBtn = document.getElementById('retry-btn');\n    const flagBtn = document.getElementById('flag-btn');\n    const questionText = document.getElementById('question-text');\n    const optionsContainer = document.getElementById('options-container');\n    const currentQNum = document.getElementById('current-q-num');\n    const timeLeftDisplay = document.getElementById('time-left');\n    const paletteGrid = document.getElementById('palette-grid');\n    const resultList = document.getElementById('result-list');\n    const finalScoreDisplay = document.getElementById('final-score');\n    const timeSpentDisplay = document.getElementById('time-spent');\n\n    startBtn.addEventListener('click', startQuiz);\n    prevBtn.addEventListener('click', () => changeQuestion(-1));\n    nextBtn.addEventListener('click', () => changeQuestion(1));\n    submitBtn.addEventListener('click', confirmSubmit);\n    retryBtn.addEventListener('click', resetQuiz);\n    flagBtn.addEventListener('click', toggleFlag);\n\n    document.querySelectorAll('.filter-tab').forEach(tab => {\n        tab.addEventListener('click', (e) => {\n            document.querySelectorAll('.filter-tab').forEach(t => t.classList.remove('active'));\n            e.target.classList.add('active');\n            renderResultList(e.target.dataset.filter);\n        });\n    });\n\n    function shuffleArray(array) {\n        let arr = [...array];\n        for (let i = arr.length - 1; i > 0; i--) {\n            const j = Math.floor(Math.random() * (i + 1));\n            [arr[i], arr[j]] = [arr[j], arr[i]];\n        }\n        return arr;\n    }\n\n    function startQuiz() {\n        const shuffled = shuffleArray(allQuestionsData);\n        selectedQuestions = shuffled.slice(0, 20);\n\n        userAnswers = {};\n        flaggedQuestions = {};\n        currentQuestionIndex = 0;\n        timeLeft = 600;\n        startTime = Date.now();\n\n        startScreen.classList.remove('active');\n        quizScreen.classList.add('active');\n\n        initPalette();\n        loadQuestion(0);\n        startTimer();\n    }\n\n    function startTimer() {\n        clearInterval(timerInterval);\n        timerInterval = setInterval(() => {\n            timeLeft--;\n            let m = Math.floor(timeLeft \/ 60);\n            let s = timeLeft % 60;\n            timeLeftDisplay.textContent = `${m}:${s < 10 ? '0' : ''}${s}`;\n\n            if (timeLeft <= 0) {\n                clearInterval(timerInterval);\n                alert('\u5236\u9650\u6642\u9593\u306b\u306a\u308a\u307e\u3057\u305f\u3002\u81ea\u52d5\u7684\u306b\u63a1\u70b9\u3057\u307e\u3059\u3002');\n                finishQuiz();\n            }\n        }, 1000);\n    }\n\n    function initPalette() {\n        paletteGrid.innerHTML = '';\n        for (let i = 0; i < 20; i++) {\n            const item = document.createElement('div');\n            item.className = 'palette-item';\n            item.textContent = i + 1;\n            item.addEventListener('click', () => {\n                currentQuestionIndex = i;\n                loadQuestion(i);\n            });\n            paletteGrid.appendChild(item);\n        }\n    }\n\n    function updatePalette() {\n        const items = paletteGrid.children;\n        for (let i = 0; i < items.length; i++) {\n            items[i].className = 'palette-item';\n            if (userAnswers[i] !== undefined) {\n                items[i].classList.add('answered');\n            }\n            if (flaggedQuestions[i]) {\n                items[i].classList.add('flagged');\n            }\n            if (i === currentQuestionIndex) {\n                items[i].classList.add('current');\n            }\n        }\n    }\n\n    function loadQuestion(index) {\n        currentQuestionIndex = index;\n        const qData = selectedQuestions[index];\n\n        currentQNum.textContent = index + 1;\n        questionText.textContent = qData.q;\n\n        if (flaggedQuestions[index]) {\n            flagBtn.classList.add('active');\n            flagBtn.textContent = '\u2605 \u30c1\u30a7\u30c3\u30af\u4e2d';\n        } else {\n            flagBtn.classList.remove('active');\n            flagBtn.textContent = '\u2606 \u898b\u76f4\u3057\u30c1\u30a7\u30c3\u30af';\n        }\n\n        optionsContainer.innerHTML = '';\n        const shuffledOptions = shuffleArray(qData.options);\n\n        shuffledOptions.forEach(opt => {\n            const label = document.createElement('label');\n            label.className = 'option-label';\n            \n            const radio = document.createElement('input');\n            radio.type = 'radio';\n            radio.name = 'quiz-option';\n            radio.value = opt;\n\n            if (userAnswers[index] === opt) {\n                radio.checked = true;\n                label.classList.add('selected');\n            }\n\n            radio.addEventListener('change', () => {\n                userAnswers[index] = opt;\n                document.querySelectorAll('.option-label').forEach(l => l.classList.remove('selected'));\n                label.classList.add('selected');\n                updatePalette();\n            });\n\n            label.appendChild(radio);\n            label.appendChild(document.createTextNode(opt));\n            optionsContainer.appendChild(label);\n        });\n\n        prevBtn.disabled = index === 0;\n        updatePalette();\n    }\n\n    function changeQuestion(direction) {\n        const newIndex = currentQuestionIndex + direction;\n        if (newIndex >= 0 && newIndex < 20) {\n            loadQuestion(newIndex);\n        }\n    }\n\n    function toggleFlag() {\n        flaggedQuestions[currentQuestionIndex] = !flaggedQuestions[currentQuestionIndex];\n        loadQuestion(currentQuestionIndex);\n    }\n\n    function confirmSubmit() {\n        const answeredCount = Object.keys(userAnswers).length;\n        if (answeredCount < 20) {\n            if (!confirm(`\u307e\u3060\u672a\u56de\u7b54\u306e\u554f\u984c\u304c ${20 - answeredCount} \u554f\u3042\u308a\u307e\u3059\u3002\u63a1\u70b9\u753b\u9762\u306b\u9032\u307f\u307e\u3059\u304b\uff1f`)) {\n                return;\n            }\n        }\n        finishQuiz();\n    }\n\n    function finishQuiz() {\n        clearInterval(timerInterval);\n\n        let score = 0;\n        selectedQuestions.forEach((q, idx) => {\n            if (userAnswers[idx] === q.answer) {\n                score += 5;\n            }\n        });\n\n        const timeSpentSec = Math.floor((Date.now() - startTime) \/ 1000);\n        const m = Math.floor(timeSpentSec \/ 60);\n        const s = timeSpentSec % 60;\n\n        finalScoreDisplay.textContent = score;\n        timeSpentDisplay.textContent = `${m}\u5206${s}\u79d2`;\n\n        startScreen.classList.remove('active');\n        quizScreen.classList.remove('active');\n        resultScreen.classList.add('active');\n\n        renderResultList('all');\n    }\n\n    function renderResultList(filter) {\n        resultList.innerHTML = '';\n        selectedQuestions.forEach((q, idx) => {\n            const userAns = userAnswers[idx];\n            const isCorrect = userAns === q.answer;\n            const isFlagged = flaggedQuestions[idx];\n\n            if (filter === 'incorrect' && isCorrect) return;\n            if (filter === 'flagged' && !isFlagged) return;\n\n            const item = document.createElement('div');\n            item.className = `result-item ${isCorrect ? 'correct' : 'incorrect'}`;\n\n            item.innerHTML = `\n                <div style=\"font-weight: bold; margin-bottom: 8px;\">\n                    \u554f ${idx + 1}\uff1a${q.q} ${isFlagged ? '<span style=\"color:#d39e00;\">\u2605\u898b\u76f4\u3057\u30c1\u30a7\u30c3\u30af\u6e08<\/span>' : ''}\n                <\/div>\n                <div style=\"font-size: 14px; margin-bottom: 6px;\">\n                    \u3042\u306a\u305f\u306e\u7b54\u3048: <span style=\"font-weight: bold; color: ${isCorrect ? 'var(--success-color)' : 'var(--danger-color)'};\">${userAns !== undefined ? userAns : '\u672a\u56de\u7b54'}<\/span>\n                <\/div>\n                <div style=\"font-size: 14px; margin-bottom: 12px;\">\n                    \u6b63\u89e3: <span style=\"font-weight: bold; color: var(--success-color);\">${q.answer}<\/span>\n                <\/div>\n                <div class=\"explanation\">\n                    <strong>\u3010\u89e3\u8aac\u3011<\/strong> ${q.exp}\n                <\/div>\n            `;\n            resultList.appendChild(item);\n        });\n    }\n\n    function resetQuiz() {\n        resultScreen.classList.remove('active');\n        startScreen.classList.add('active');\n    }\n})();\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>\u793e\u4f1a_\u5730\u7406_\u65e5\u672c\u3068\u4e16\u754c\u306e\u8abf\u67fb &#x1f3e0; \u30cd\u30b9\u30b3\u30e0\u4e2d\u91ce\u6559\u5ba4\u3063\u3066\u3069\u3093\u306a\u587e\uff1f\u4f1d\u3048\u305f\u3044\u3053\u30685\u9078 \/ \u30af\u30a4\u30ba \/ \u793e\u4f1a_\u5730\u7406_\u65e5\u672c\u3068\u4e16\u754c\u306e\u8abf\u67fb \u793e\u4f1a_\u5730\u7406_\u65e5\u672c\u3068\u4e16\u754c\u306e\u8abf\u67fb &#x1f4c5; 2026\u5e7410\u67085\u65e5 &# [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":2120,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"sns_share_botton_hide":"","vkExUnit_sns_title":"","_vk_print_noindex":"","sitemap_hide":"","vkExUnit_EyeCatch_disable":"","_veu_custom_css":"","veu_display_promotion_alert":"","vkexunit_cta_each_option":"","_lightning_design_setting":{"layout":"col-one-no-subsection","site_body_padding":"true"},"footnotes":""},"categories":[308],"tags":[],"class_list":["post-4699","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-308"],"acf":[],"veu_head_title_object":{"title":"","add_site_title":""},"_links":{"self":[{"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/posts\/4699","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/comments?post=4699"}],"version-history":[{"count":7,"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/posts\/4699\/revisions"}],"predecessor-version":[{"id":4711,"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/posts\/4699\/revisions\/4711"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/media\/2120"}],"wp:attachment":[{"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/media?parent=4699"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/categories?post=4699"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nansiki.net\/2018\/wp-json\/wp\/v2\/tags?post=4699"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}