{"id":15378,"date":"2025-05-19T14:36:56","date_gmt":"2025-05-19T05:36:56","guid":{"rendered":"https:\/\/kameokadenshi.co.jp\/home\/?page_id=15378"},"modified":"2025-07-04T10:45:10","modified_gmt":"2025-07-04T01:45:10","slug":"product-picks","status":"publish","type":"page","link":"https:\/\/kameokadenshi.co.jp\/home\/product-picks\/","title":{"rendered":"CLA\u30b7\u30ea\u30fc\u30ba \u304a\u3059\u3059\u3081\u88fd\u54c1\u8a3a\u65ad"},"content":{"rendered":"\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

CLA\u30b7\u30ea\u30fc\u30ba \u304a\u3059\u3059\u3081\u88fd\u54c1\u8a3a\u65ad<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t
\u3044\u304f\u3064\u304b\u306e\u8cea\u554f\u306b\u56de\u7b54\u3044\u305f\u3060\u304f\u3053\u3068\u3067\u3042\u306a\u305f\u306b\u304a\u3059\u3059\u3081\u306e\u88fd\u54c1\u3092\u30d4\u30c3\u30af\u30a2\u30c3\u30d7\u3057\u307e\u3059!<\/pre>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n    \r\n    \r\n    \u88fd\u54c1\u8a3a\u65ad\u30a2\u30d7\u30ea<\/title>\r\n    <style>\r\n        \/* \u5168\u4f53\u306e\u30b3\u30f3\u30c6\u30ca *\/\r\n        #diagnosis-container {\r\n            width: 900px;\r\n            max-width: 95%; \/* \u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u5bfe\u5fdc *\/\r\n            margin: 20px auto; \/* \u4e2d\u592e\u5bc4\u305b *\/\r\n            font-family: 'Inter', sans-serif; \/* \u30d5\u30a9\u30f3\u30c8\u306e\u6307\u5b9a *\/\r\n            background-color: #f0f2f5; \/* \u80cc\u666f\u8272 *\/\r\n            padding: 20px;\r\n            border-radius: 10px;\r\n            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);\r\n        }\r\n\r\n        \/* \u30a2\u30b3\u30fc\u30c7\u30a3\u30aa\u30f3\u30a2\u30a4\u30c6\u30e0 *\/\r\n        .accordion-item {\r\n            margin-bottom: 10px;\r\n            border: 1px solid #e0e0e0;\r\n            border-radius: 8px;\r\n            overflow: hidden;\r\n            transition: all 0.3s ease;\r\n            background-color: #fff;\r\n            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\r\n            pointer-events: auto;\r\n        }\r\n\r\n        \/* \u30a2\u30af\u30c6\u30a3\u30d6\u306a\u30a2\u30b3\u30fc\u30c7\u30a3\u30aa\u30f3\u30a2\u30a4\u30c6\u30e0 *\/\r\n        .accordion-item.active {\r\n            box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);\r\n            border-color: #4CAF50;\r\n        }\r\n\r\n        \/* \u30a2\u30b3\u30fc\u30c7\u30a3\u30aa\u30f3\u30d8\u30c3\u30c0\u30fc\uff08\u8cea\u554f\u90e8\u5206\uff09 *\/\r\n        .accordion-header {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            width: 100%;\r\n            padding: 18px 20px;\r\n            background-color: #f8f8f8;\r\n            border: none;\r\n            text-align: left;\r\n            cursor: pointer;\r\n            font-size: 18px;\r\n            font-weight: 600;\r\n            color: #333;\r\n            transition: background-color 0.2s ease, color 0.2s ease;\r\n            border-bottom: 1px solid #eee;\r\n            border-radius: 8px 8px 0 0;\r\n        }\r\n\r\n        .accordion-header:hover {\r\n            background-color: #eef0f3;\r\n            color: #222;\r\n        }\r\n\r\n        .accordion-header:focus {\r\n            outline: none;\r\n            box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25);\r\n        }\r\n\r\n        \/* \u56de\u7b54\u30b9\u30c6\u30fc\u30bf\u30b9 *\/\r\n        .answer-status {\r\n            font-size: 0.85em;\r\n            color: #777;\r\n            margin-left: 20px;\r\n            font-style: italic;\r\n            font-weight: normal;\r\n        }\r\n\r\n        \/* \u30a2\u30b3\u30fc\u30c7\u30a3\u30aa\u30f3\u30d1\u30cd\u30eb\uff08\u9078\u629e\u80a2\u90e8\u5206\uff09 *\/\r\n        .accordion-panel {\r\n            padding: 15px 20px;\r\n            background-color: #fff;\r\n            display: none; \/* \u521d\u671f\u72b6\u614b\u306f\u975e\u8868\u793a *\/\r\n            opacity: 0;\r\n            height: 0;\r\n            overflow: hidden;\r\n            transition: opacity 0.3s ease, height 0.3s ease;\r\n            border-radius: 0 0 8px 8px;\r\n        }\r\n\r\n        \/* \u30d1\u30cd\u30eb\u8868\u793a\u6642 *\/\r\n        .accordion-panel.show {\r\n            display: block;\r\n            opacity: 1;\r\n            height: auto;\r\n        }\r\n\r\n        \/* \u9078\u629e\u80a2\u30b3\u30f3\u30c6\u30ca *\/\r\n        .options-container {\r\n            display: flex;\r\n            flex-wrap: wrap;\r\n            gap: 12px;\r\n            margin-bottom: 15px;\r\n            justify-content: center; \/* \u30dc\u30bf\u30f3\u3092\u4e2d\u592e\u5bc4\u305b *\/\r\n        }\r\n\r\n        \/* \u9078\u629e\u80a2\u30dc\u30bf\u30f3 *\/\r\n        .accordion-panel button[data-next] {\r\n            padding: 12px 25px;\r\n            border: none;\r\n            border-radius: 25px; \/* \u3088\u308a\u4e38\u304f *\/\r\n            background-color: #3936e2;\r\n            color: white;\r\n            cursor: pointer;\r\n            font-size: 16px;\r\n            font-weight: 500;\r\n            transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;\r\n            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\r\n            min-width: 120px; \/* \u6700\u5c0f\u5e45 *\/\r\n        }\r\n\r\n        .accordion-panel button[data-next]:hover {\r\n            background-color: #2a1ece;\r\n            box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);\r\n            transform: translateY(-2px);\r\n        }\r\n\r\n        .accordion-panel button[data-next]:active {\r\n            background-color: #1b0ed3;\r\n            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) inset;\r\n            transform: translateY(1px);\r\n        }\r\n\r\n        \/* \u300c\u4e00\u3064\u623b\u308b\u300d\u30dc\u30bf\u30f3 *\/\r\n        .reset-button {\r\n            margin-top: 10px;\r\n            padding: 10px 20px;\r\n            border: none;\r\n            border-radius: 20px;\r\n            background-color: #a9a9a9;\r\n            color: white;\r\n            cursor: pointer;\r\n            font-size: 14px;\r\n            transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;\r\n            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);\r\n        }\r\n\r\n        .reset-button:hover {\r\n            background-color: #909090;\r\n            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.12);\r\n            transform: translateY(-1px);\r\n        }\r\n\r\n        .reset-button:active {\r\n            background-color: #808080;\r\n            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15) inset;\r\n            transform: translateY(1px);\r\n        }\r\n\r\n        \/* \u300c\u3084\u308a\u76f4\u3059\u300d\u30dc\u30bf\u30f3 *\/\r\n        #reset-all-button {\r\n            display: block; \/* \u30d6\u30ed\u30c3\u30af\u8981\u7d20\u306b\u3057\u3066\u4e2d\u592e\u5bc4\u305b *\/\r\n            margin: 25px auto 0;\r\n            padding: 15px 30px;\r\n            border: none;\r\n            border-radius: 30px;\r\n            background-color: #969696; \/* \u9752\u7cfb\u306e\u8272 *\/\r\n            color: white;\r\n            cursor: pointer;\r\n            font-size: 18px;\r\n            font-weight: 600;\r\n            transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;\r\n            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);\r\n        }\r\n\r\n        #reset-all-button:hover {\r\n            background-color: #808080;\r\n            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);\r\n            transform: translateY(-3px);\r\n        }\r\n\r\n        #reset-all-button:active {\r\n            background-color: #585858;\r\n            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;\r\n            transform: translateY(1px);\r\n        }\r\n\r\n        \/* \u8a3a\u65ad\u7d50\u679c\u8868\u793a\u30a8\u30ea\u30a2 *\/\r\n        #result-area {\r\n            margin-top: 20px;\r\n            padding: 25px;\r\n            border: 1px solid #dcdcdc;\r\n            background-color: #f9f9f9;\r\n            border-radius: 8px;\r\n            font-size: 18px;\r\n            text-align: center;\r\n            display: flex;\r\n            flex-direction: column;\r\n            align-items: center;\r\n            line-height: 1.6;\r\n            color: #333;\r\n        }\r\n\r\n        \/* \u88fd\u54c1\u753b\u50cf *\/\r\n        .product-image {\r\n            max-width: 300px;\r\n            height: auto;\r\n            border-radius: 8px;\r\n            margin-bottom: 15px;\r\n            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\r\n        }\r\n\r\n        .product-images-container {\r\n            display: flex;\r\n            flex-wrap: wrap; \/* \u5c0f\u3055\u3044\u753b\u9762\u3067\u6298\u308a\u8fd4\u3059 *\/\r\n            justify-content: center;\r\n            gap: 15px; \/* \u753b\u50cf\u9593\u306e\u30b9\u30da\u30fc\u30b9 *\/\r\n            margin-bottom: 15px;\r\n        }\r\n\r\n        .action-button {\r\n            margin-top: 10px; \/* \u4e0a\u306e\u8981\u7d20\u3068\u306e\u9593\u9694 *\/\r\n            padding: 12px 25px;\r\n            border: none;\r\n            border-radius: 25px;\r\n            background-color: #3936e2; \/* \u9752\u7cfb\u306e\u8272 *\/\r\n            color: white;\r\n            cursor: pointer;\r\n            font-size: 16px;\r\n            font-weight: 500;\r\n            transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;\r\n            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\r\n            text-decoration: none; \/* a\u30bf\u30b0\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u4e0b\u7dda\u3092\u306a\u304f\u3059 *\/\r\n            display: inline-block; \/* \u30dc\u30bf\u30f3\u306e\u3088\u3046\u306b\u8868\u793a *\/\r\n            text-align: center;\r\n            line-height: 1.2; \/* \u30c6\u30ad\u30b9\u30c8\u306e\u5782\u76f4\u65b9\u5411\u306e\u30bb\u30f3\u30bf\u30ea\u30f3\u30b0 *\/\r\n             margin-left: 5px; \/* \u30dc\u30bf\u30f3\u9593\u306e\u30b9\u30da\u30fc\u30b9 *\/\r\n            margin-right: 5px; \/* \u30dc\u30bf\u30f3\u9593\u306e\u30b9\u30da\u30fc\u30b9 *\/\r\n        }\r\n\r\n        .action-button:hover {\r\n            background-color: #2a1ece;\r\n            color: #fff;\r\n            box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);\r\n            transform: translateY(-2px);\r\n        }\r\n\r\n        .action-button:active {\r\n            background-color: #1b0ed3;\r\n            color: white;\r\n            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) inset;\r\n            transform: translateY(1px);\r\n        }\r\n\r\n        \/* \u30e2\u30d0\u30a4\u30eb\u5bfe\u5fdc *\/\r\n        @media (max-width: 768px) {\r\n            #diagnosis-container {\r\n                width: 95%;\r\n                padding: 15px;\r\n            }\r\n\r\n            .accordion-header {\r\n                font-size: 16px;\r\n                padding: 15px;\r\n            }\r\n\r\n            .accordion-panel button[data-next] {\r\n                width: 100%; \/* \u30e2\u30d0\u30a4\u30eb\u3067\u306f\u30dc\u30bf\u30f3\u3092\u6a2a\u5e45\u3044\u3063\u3071\u3044\u306b *\/\r\n                min-width: unset;\r\n            }\r\n\r\n            #reset-all-button {\r\n                font-size: 16px;\r\n                padding: 12px 25px;\r\n            }\r\n\r\n            #result-area {\r\n                font-size: 16px;\r\n                padding: 20px;\r\n            }\r\n            \r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n    <div id=\"diagnosis-container\">\r\n        <div class=\"accordion-item\">\r\n            <button class=\"accordion-header\" aria-expanded=\"false\" aria-controls=\"question1-panel\">\r\n                Q1. \u30bf\u30f3\u30af\u306e\u7a2e\u985e\u306f\uff1f<span class=\"answer-status\">\u672a\u56de\u7b54<\/span>\r\n            <\/button>\r\n            <div id=\"question1-panel\" class=\"accordion-panel\">\r\n                <div class=\"options-container\">\r\n                    <button data-next=\"question2-panel\" data-answer=\"\u91d1\u5c5e\u88fd\" id=\"101\">\u91d1\u5c5e\u88fd<\/button>\r\n                    <button data-next=\"question3-panel\" data-answer=\"\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\" id=\"110\">\u6a39\u8102\u30fb\u30ac\u30e9\u30b9\u88fd<\/button>\r\n                <\/div>\r\n                <button class=\"reset-button\" data-question=\"Q1\">\u4e00\u3064\u623b\u308b<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"accordion-item\">\r\n            <button class=\"accordion-header\" aria-expanded=\"false\" aria-controls=\"question2-panel\">\r\n                Q2. \u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u306e\u7a93\u306f\u3042\u308a\u307e\u3059\u304b\uff1f<span class=\"answer-status\">\u672a\u56de\u7b54<\/span>\r\n            <\/button>\r\n            <div id=\"question2-panel\" class=\"accordion-panel\">\r\n                <div class=\"options-container\">\r\n                    <button data-next=\"result-panel\" data-answer=\"\u306f\u3044\" id=\"202\">\u306f\u3044<\/button>\r\n                    <button data-next=\"result-panel\" data-answer=\"\u3044\u3044\u3048\" id=\"220\">\u3044\u3044\u3048<\/button>\r\n                <\/div>\r\n                <button class=\"reset-button\" data-question=\"Q2\">\u4e00\u3064\u623b\u308b<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"accordion-item\">\r\n            <button class=\"accordion-header\" aria-expanded=\"false\" aria-controls=\"question3-panel\">\r\n                Q3. \u6db2\u91cf\u3092\u5e38\u306b\u76e3\u8996\u3055\u308c\u305f\u3044\u3067\u3059\u304b\uff1f<span class=\"answer-status\">\u672a\u56de\u7b54<\/span>\r\n            <\/button>\r\n            <div id=\"question3-panel\" class=\"accordion-panel\">\r\n                <div class=\"options-container\">\r\n                    <button data-next=\"question4-panel\" data-answer=\"\u306f\u3044\" id=\"303\">\u306f\u3044<\/button>\r\n                    <button data-next=\"result-panel\" data-answer=\"\u3044\u3044\u3048\" id=\"330\">\u3044\u3044\u3048<\/button>\r\n                <\/div>\r\n                <button class=\"reset-button\" data-question=\"Q3\">\u4e00\u3064\u623b\u308b<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"accordion-item\">\r\n            <button class=\"accordion-header\" aria-expanded=\"false\" aria-controls=\"question4-panel\">\r\n                Q4. \u6db2\u4f53\u306b\u5bfe\u3057\u3066\u975e\u63a5\u89e6\u3067\u306e\u691c\u77e5\u3092\u5e0c\u671b\u3057\u307e\u3059\u304b\uff1f<span class=\"answer-status\">\u672a\u56de\u7b54<\/span>\r\n            <\/button>\r\n            <div id=\"question4-panel\" class=\"accordion-panel\">\r\n                <div class=\"options-container\">\r\n                    <button data-next=\"question5-panel\" data-answer=\"\u975e\u63a5\u89e6\" id=\"404\">\u975e\u63a5\u89e6<\/button>\r\n                    <button data-next=\"question7-panel\" data-answer=\"\u63a5\u6db2\u30bf\u30a4\u30d7\" id=\"440\">\u63a5\u6db2\u30bf\u30a4\u30d7<\/button>\r\n                <\/div>\r\n                <button class=\"reset-button\" data-question=\"Q4\">\u4e00\u3064\u623b\u308b<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"accordion-item\">\r\n            <button class=\"accordion-header\" aria-expanded=\"false\" aria-controls=\"question5-panel\">\r\n                Q5. \u5236\u5fa1\u51fa\u529b\u306f\u5fc5\u8981\u3067\u3059\u304b\uff1f<span class=\"answer-status\">\u672a\u56de\u7b54<\/span>\r\n            <\/button>\r\n            <div id=\"question5-panel\" class=\"accordion-panel\">\r\n                <div class=\"options-container\">\r\n                    <button data-next=\"question6-panel\" data-answer=\"\u306f\u3044\" id=\"505\">\u306f\u3044<\/button>\r\n                    <button data-next=\"question6-panel\" data-answer=\"\u3044\u3044\u3048\" id=\"550\">\u3044\u3044\u3048<\/button>\r\n                <\/div>\r\n                <button class=\"reset-button\" data-question=\"Q5\">\u4e00\u3064\u623b\u308b<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"accordion-item\">\r\n            <button class=\"accordion-header\" aria-expanded=\"false\" aria-controls=\"question6-panel\">\r\n                Q6. \u30a2\u30ca\u30ed\u30b0\u51fa\u529b\u306e\u7a2e\u985e\u306f\uff1f<span class=\"answer-status\">\u672a\u56de\u7b54<\/span>\r\n            <\/button>\r\n            <div id=\"question6-panel\" class=\"accordion-panel\">\r\n                <div class=\"options-container\">\r\n                    <button data-next=\"question7-panel\" data-answer=\"\u96fb\u6d41\" id=\"606\">\u96fb\u6d41<\/button>\r\n                    <button data-next=\"question8-panel\" data-answer=\"\u96fb\u5727\" id=\"660\">\u96fb\u5727<\/button>\r\n                <\/div>\r\n                <button class=\"reset-button\" data-question=\"Q6\">\u4e00\u3064\u623b\u308b<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"accordion-item\">\r\n            <button class=\"accordion-header\" aria-expanded=\"false\" aria-controls=\"question7-panel\">\r\n                Q7-1. \u5fc5\u8981\u306a\u96fb\u6975\u306e\u30b5\u30a4\u30ba\u306f\uff1f<span class=\"answer-status\">\u672a\u56de\u7b54<\/span>\r\n            <\/button>\r\n            <div id=\"question7-panel\" class=\"accordion-panel\">\r\n                <div class=\"options-container\">\r\n                    <button data-next=\"result-panel\" data-answer=\"150mm\" id=\"707\">150mm<\/button>\r\n                    <button data-next=\"result-panel\" data-answer=\"250mm\" id=\"770\">250mm<\/button>\r\n                <\/div>\r\n                <button class=\"reset-button\" data-question=\"Q7\">\u4e00\u3064\u623b\u308b<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"accordion-item\">\r\n            <button class=\"accordion-header\" aria-expanded=\"false\" aria-controls=\"question8-panel\">\r\n                Q7-2. \u5fc5\u8981\u306a\u96fb\u6975\u306e\u30b5\u30a4\u30ba\u306f\uff1f<span class=\"answer-status\">\u672a\u56de\u7b54<\/span>\r\n            <\/button>\r\n            <div id=\"question8-panel\" class=\"accordion-panel\">\r\n                <div class=\"options-container\">\r\n                    <button data-next=\"result-panel\" data-answer=\"40mm\" id=\"808\">40mm<\/button>\r\n                    <button data-next=\"result-panel\" data-answer=\"150mm\" id=\"840\">150mm<\/button>\r\n                    <button data-next=\"result-panel\" data-answer=\"250mm\" id=\"880\">250mm<\/button>\r\n                <\/div>\r\n                <button class=\"reset-button\" data-question=\"Q8\">\u4e00\u3064\u623b\u308b<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"accordion-item\">\r\n            <button class=\"accordion-header\" aria-expanded=\"false\" aria-controls=\"result-panel\">\r\n                \u8a3a\u65ad\u7d50\u679c\r\n            <\/button>\r\n            <div id=\"result-panel\" class=\"accordion-panel\">\r\n                <div id=\"result-area\"><\/div>\r\n            <\/div>\r\n        <\/div>\r\n        <button id=\"reset-all-button\">\u3084\u308a\u76f4\u3059<\/button>\r\n    <\/div>\r\n\r\n    <script>\r\n    document.addEventListener('DOMContentLoaded', function() {\r\n        \/\/ DOM\u8981\u7d20\u306e\u53d6\u5f97\r\n        const diagnosisContainer = document.getElementById('diagnosis-container');\r\n        const accordionHeaders = diagnosisContainer.querySelectorAll('.accordion-header');\r\n        const accordionPanels = diagnosisContainer.querySelectorAll('.accordion-panel');\r\n        const answerStatuses = diagnosisContainer.querySelectorAll('.answer-status');\r\n        const accordionItems = diagnosisContainer.querySelectorAll('.accordion-item');\r\n        const resultPanel = document.getElementById('result-panel');\r\n        const resultArea = document.getElementById('result-area');\r\n        const resetButtons = diagnosisContainer.querySelectorAll('.reset-button');\r\n        const resetAllButton = document.getElementById('reset-all-button');\r\n\r\n        \/\/ \u30e6\u30fc\u30b6\u30fc\u306e\u56de\u7b54\u3092\u4fdd\u5b58\u3059\u308b\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u3068\u6570\u5024\u5408\u8a08\r\n        let answers = {};\r\n        let answerNumber = 0; \/\/ answerNumber\u3092\u3053\u3053\u3067\u521d\u671f\u5316\r\n        let answerHistory = []; \/\/ \u8cea\u554f\u30d1\u30cd\u30eb\u306e\u5c65\u6b74\u3092\u4fdd\u5b58\r\n\r\n        \/\/ --- \u30c7\u30fc\u30bf\u5b9a\u7fa9 ---\r\n\r\n        \/\/ \u8a3a\u65ad\u7d50\u679c\u3068\u5bfe\u5fdc\u3059\u308b\u88fd\u54c1\u60c5\u5831\r\n        const resultsMap = {\r\n          \"Z\": {\r\n            name: \"\u8981\u76f8\u8ac7\",\r\n            description: \"\u672c\u88fd\u54c1\u306f\u91d1\u5c5e\u88fd\u30bf\u30f3\u30af\u3067\u306f\u4f7f\u7528\u3044\u305f\u3060\u3051\u307e\u305b\u3093\u3002<br>\u6a39\u8102\u3084\u30ac\u30e9\u30b9\u88fd\u306e\u7a93\u304c\u3042\u308b\u5834\u5408\u306f\u3001\u7a93\u3092\u5229\u7528\u3059\u308b\u3053\u3068\u3067\u4f7f\u7528\u53ef\u80fd\u306a\u5834\u5408\u304c\u3054\u3056\u3044\u307e\u3059\u3002<br>\u8a73\u7d30\u3092\u304a\u4f3a\u3044\u3057\u305f\u3044\u305f\u3081\u3001\u4e00\u5ea6\u304a\u554f\u3044\u5408\u308f\u305b\u304f\u3060\u3055\u3044\u3002\",\r\n            images: []\r\n        },\r\n          \"Y\": {\r\n            name: \"\u8a72\u5f53\u306a\u3057\",\r\n            description: \"\u91d1\u5c5e\u88fd\u30bf\u30f3\u30af\u3067\u306f\u672c\u88fd\u54c1\u3092\u304a\u4f7f\u3044\u3044\u305f\u3060\u3051\u307e\u305b\u3093\u3002\",\r\n            images: []\r\n        },\r\n          \"X\": {\r\n            name: \"CLS\u30b7\u30ea\u30fc\u30ba\",\r\n            description: \"\u4e0a\u4e0b\u9650\u306e\u307f\u3092\u77e5\u308a\u305f\u3044\u5834\u5408\u306f\u3001CLS\u30b7\u30ea\u30fc\u30ba\u304c\u304a\u3059\u3059\u3081\u3067\u3059!<br><a href=\\\"https:\/\/kameokadenshi.co.jp\/home\/products\/level-switch\/\\\">\u8a73\u7d30\u306f\u3053\u3061\u3089<\/a>\",\r\n            images: [ \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30b9\u30a4\u30c3\u30c1cls-a01.png\" ]\r\n        },\r\n          \"A\": {\r\n            name: \"\u96fb\u6975:CLA-D18P150\u3000\u30a2\u30f3\u30d7:CLA-A03\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\u30cf\u309a\u30a4\u30d5\u309a\u578b\u96fb\u6975\u30bf\u30a4\u30d5\u309a\uff09cla-d18p150.jpg\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\uff14\u70b9\u51fa\u529b\u30bf\u30a4\u30d5\u309a\uff09cla-a03.jpg\"\r\n            ]\r\n        },\r\n          \"B\": {\r\n            name: \"\u96fb\u6975:CLA-D18P150\u3000\u30a2\u30f3\u30d7:CLA-A03-1\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\u30cf\u309a\u30a4\u30d5\u309a\u578b\u96fb\u6975\u30bf\u30a4\u30d5\u309a\uff09cla-d18p150.jpg\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\uff14\u70b9\u51fa\u529b\u30bf\u30a4\u30d5\u309a\uff09cla-a03.jpg\"\r\n            ]\r\n        },\r\n          \"C\": {\r\n            name: \"\u96fb\u6975:CLA-D18P150\u3000\u30a2\u30f3\u30d7:CLA-A04A\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\u30cf\u309a\u30a4\u30d5\u309a\u578b\u96fb\u6975\u30bf\u30a4\u30d5\u309a\uff09cla-d18p150.jpg\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2024\/02\/image0-2.png\"\r\n            ]\r\n        },\r\n          \"D\": {\r\n            name: \"\u96fb\u6975:CLA-D18P150\u3000\u30a2\u30f3\u30d7:CLA-A04V\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\u30cf\u309a\u30a4\u30d5\u309a\u578b\u96fb\u6975\u30bf\u30a4\u30d5\u309a\uff09cla-d18p150.jpg\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2024\/02\/image0-2.png\"\r\n            ]\r\n        },\r\n          \"E\": {\r\n            name: \"\u96fb\u6975:CLA-D30P150(-1)\u3000\u30a2\u30f3\u30d7:CLA-A03\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d30-1.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\uff14\u70b9\u51fa\u529b\u30bf\u30a4\u30d5\u309a\uff09cla-a03.jpg\"\r\n            ]\r\n        },\r\n          \"F\": {\r\n            name: \"\u96fb\u6975:CLA-D30P250(-1)\u3000\u30a2\u30f3\u30d7:CLA-A03\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d30-1.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\uff14\u70b9\u51fa\u529b\u30bf\u30a4\u30d5\u309a\uff09cla-a03.jpg\"\r\n            ]\r\n        },\r\n          \"G\": {\r\n            name: \"\u96fb\u6975:CLA-D10P40\u3000\u30a2\u30f3\u30d7:CLA-A02\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\u5fae\u5c0f\u5bb9\u91cf\u691c\u51fa\u4ed5\u69d8\uff09cla-a02.jpg\"\r\n            ]\r\n        },\r\n          \"H\": {\r\n            name: \"\u96fb\u6975:CLA-D30P150(-1) \u30a2\u30f3\u30d7:CLA-A03-1\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d30-1.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\uff14\u70b9\u51fa\u529b\u30bf\u30a4\u30d5\u309a\uff09cla-a03.jpg\"\r\n            ]\r\n        },\r\n          \"I\": {\r\n            name: \"\u96fb\u6975:CLA-D30P250(-1)\u3000\u30a2\u30f3\u30d7:CLA-A03-1\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d30-1.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2022\/06\/\u6db2\u9762\u30ec\u30d8\u3099\u30eb\u30bb\u30f3\u30b5\u30fc\uff08\uff14\u70b9\u51fa\u529b\u30bf\u30a4\u30d5\u309a\uff09cla-a03.jpg\"\r\n            ]\r\n        },\r\n          \"J\": {\r\n            name: \"\u96fb\u6975:CLA-D10P40\u3000\u30a2\u30f3\u30d7:CLA-A04A\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d10.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2024\/02\/image0-2.png\"\r\n            ]\r\n        },\r\n          \"K\": {\r\n            name: \"\u96fb\u6975:CLA-D30P150(-1)\u3000\u30a2\u30f3\u30d7:CLA-A04A\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d30-1.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2024\/02\/image0-2.png\"\r\n            ]\r\n        },\r\n          \"L\": {\r\n            name: \"\u96fb\u6975:CLA-D30P250(-1)\u3000\u30a2\u30f3\u30d7:CLA-A04A\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d30-1.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2024\/02\/image0-2.png\"\r\n            ]\r\n        },\r\n          \"M\": {\r\n            name: \"\u96fb\u6975:CLA-D10P40\u3000\u30a2\u30f3\u30d7:CLA-A04V\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d10.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2024\/02\/image0-2.png\"\r\n            ]\r\n        },\r\n          \"N\": {\r\n            name: \"\u96fb\u6975:CLA-D30P150(-1)\u3000\u30a2\u30f3\u30d7:CLA-A04V\",\r\n            description: \"\",\r\n            images: [ \r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d30-1.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2024\/02\/image0-2.png\" \r\n            ] \r\n        },\r\n          \"O\": {\r\n            name: \"\u96fb\u6975:CLA-D30P250(-1)\u3000\u30a2\u30f3\u30d7:CLA-A04V\",\r\n            description: \"\",\r\n            images: [\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2025\/05\/cla-d30-1.png\",\r\n                \"https:\/\/kameokadenshi.co.jp\/home\/wp-content\/uploads\/2024\/02\/image0-2.png\"\r\n            ]\r\n        }\r\n        };\r\n\r\n        \/\/ \u8cea\u554f\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u9077\u79fb\u30d5\u30ed\u30fc (HTML\u306edata-next\u5c5e\u6027\u3068\u4e00\u81f4)\r\n        \/\/ question6-panel \u306e\u30d5\u30ed\u30fc\u306f\u52d5\u7684\u306b\u8a2d\u5b9a\u3055\u308c\u308b\u305f\u3081\u3001\u3053\u3053\u3067\u306f\u95a2\u6570\u3092\u4fdd\u6301\r\n        const questionFlow = {\r\n            \"question1-panel\": { \"\u91d1\u5c5e\u88fd\": \"question2-panel\", \"\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\": \"question3-panel\" },\r\n            \"question2-panel\": { \"\u306f\u3044\": \"result-panel\", \"\u3044\u3044\u3048\": \"result-panel\" },\r\n            \"question3-panel\": { \"\u306f\u3044\": \"question4-panel\", \"\u3044\u3044\u3048\": \"result-panel\" },\r\n            \"question4-panel\": { \"\u975e\u63a5\u89e6\": \"question5-panel\", \"\u63a5\u6db2\u30bf\u30a4\u30d7\": \"question5-panel\" }, \/\/ HTML\u306edata-next\u306b\u5408\u308f\u305b\u308b\r\n            \"question5-panel\": { \"\u306f\u3044\": \"question6-panel\", \"\u3044\u3044\u3048\": \"question6-panel\" }, \/\/ HTML\u306edata-next\u306b\u5408\u308f\u305b\u308b\r\n            \"question6-panel\": nextPanelflow, \/\/ Q6\u306e\u9077\u79fb\u5148\u3092\u56fa\u5b9a\r\n            \"question7-panel\": { \"150mm\": \"result-panel\", \"250mm\": \"result-panel\" },\r\n            \"question8-panel\": { \"40mm\": \"result-panel\", \"150mm\": \"result-panel\", \"250mm\": \"result-panel\" }\r\n        };\r\n\r\n        const answercontents = {\r\n            \"Z\": {\r\n                answerProduct: \"\u7d50\u679c \u2192 \u8981\u76f8\u8ac7\" ,\r\n                comment: \"\u30bf\u30f3\u30af:\u91d1\u5c5e\u88fd\u3001\u7a93:\u3042\u308a\"\r\n            },\r\n            \"Y\": {\r\n                answerProduct: \"\u7d50\u679c \u2192 \u4f7f\u7528\u4e0d\u53ef\" ,\r\n                comment: \"\u30bf\u30f3\u30af:\u91d1\u5c5e\u88fd\u3001\u7a93:\u306a\u3057\"\r\n            },\r\n            \"X\": {\r\n                answerProduct: \"\u7d50\u679c \u2192 CLS\u30b7\u30ea\u30fc\u30ba\" ,\r\n                comment: \"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u4e0d\u8981\"\r\n            },\r\n            \"A\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D18P150\u3000\u30a2\u30f3\u30d7:CLA-A03\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u63a5\u6db2\u3001\u5236\u5fa1\u51fa\u529b:\u5fc5\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u6d41\"\r\n            },\r\n            \"B\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D18P150\u3000\u30a2\u30f3\u30d7:CLA-A03-1\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u63a5\u6db2\u3001\u5236\u5fa1\u51fa\u529b:\u5fc5\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u5727\"\r\n            },\r\n            \"C\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D18P150\u3000\u30a2\u30f3\u30d7:CLA-A04A\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u63a5\u6db2\u3001\u5236\u5fa1\u51fa\u529b:\u4e0d\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u6d41\"\r\n            },\r\n            \"D\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D18P150\u3000\u30a2\u30f3\u30d7:CLA-A04V\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u63a5\u6db2\u3001\u5236\u5fa1\u51fa\u529b:\u4e0d\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u5727\"\r\n            },\r\n            \"E\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D30P150(-1)\u3000\u30a2\u30f3\u30d7:CLA-A03\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u5fc5\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u6d41\u3001\u96fb\u6975\u30b5\u30a4\u30ba:150mm\"\r\n            },\r\n            \"F\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D30P250(-1)\u3000\u30a2\u30f3\u30d7:CLA-A03\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u5fc5\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u6d41\u3001\u96fb\u6975\u30b5\u30a4\u30ba:250mm\"\r\n            },\r\n            \"G\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D10P40\u3000\u30a2\u30f3\u30d7:CLA-A02\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u5fc5\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u5727\u3001\u96fb\u6975\u30b5\u30a4\u30ba:40mm\"\r\n            },\r\n            \"H\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D30P150(-1) \u30a2\u30f3\u30d7:CLA-A03-1\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u5fc5\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u5727\u3001\u96fb\u6975\u30b5\u30a4\u30ba:150mm\"\r\n            },\r\n            \"I\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D30P250(-1)\u3000\u30a2\u30f3\u30d7:CLA-A03-1\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u5fc5\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u5727\u3001\u96fb\u6975\u30b5\u30a4\u30ba:250mm\"\r\n            },\r\n            \"J\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D10P40\u3000\u30a2\u30f3\u30d7:CLA-A04A\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u4e0d\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u6d41\u3001\u96fb\u6975\u30b5\u30a4\u30ba:40mm\"\r\n            },\r\n            \"K\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D30P150(-1)\u3000\u30a2\u30f3\u30d7:CLA-A04A\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u4e0d\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u6d41\u3001\u96fb\u6975\u30b5\u30a4\u30ba:150mm\"\r\n            },\r\n            \"L\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D30P250(-1)\u3000\u30a2\u30f3\u30d7:CLA-A04A\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u4e0d\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u6d41\u3001\u96fb\u6975\u30b5\u30a4\u30ba:250mm\"\r\n            },\r\n            \"M\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D10P40\u3000\u30a2\u30f3\u30d7:CLA-A04V\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u4e0d\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u5727\u3001\u96fb\u6975\u30b5\u30a4\u30ba:40mm\"\r\n            },\r\n            \"N\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D30P150(-1)\u3000\u30a2\u30f3\u30d7:CLA-A04V\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u4e0d\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u5727\u3001\u96fb\u6975\u30b5\u30a4\u30ba:150mm\"\r\n            },\r\n            \"O\": {\r\n                answerProduct: \"\u96fb\u6975:CLA-D30P250(-1)\u3000\u30a2\u30f3\u30d7:CLA-A04V\",\r\n                comment:\"\u30bf\u30f3\u30af:\u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u3001\u5e38\u6642\u76e3\u8996:\u5fc5\u8981\u3001\u96fb\u6975:\u975e\u63a5\u89e6\u3001\u5236\u5fa1\u51fa\u529b:\u4e0d\u8981\u3001\u30a2\u30ca\u30ed\u30b0\u51fa\u529b:\u96fb\u5727\u3001\u96fb\u6975\u30b5\u30a4\u30ba:250mm\"\r\n            }\r\n        };\r\n\r\n        \/\/ --- \u95a2\u6570\u5b9a\u7fa9 ---\r\n\r\n        \/\/ \u30d5\u30ed\u30fc\u5909\u66f4\u30ed\u30b8\u30c3\u30af\r\n        function nextPanelflow(currentAnswerNumber){\r\n            console.log(\"nextPanelflow called with currentAnswerNumber:\", currentAnswerNumber);\r\n\r\n            \/\/ Q6\u306e\u56de\u7b54\u3092\u542b\u3080answerNumber\u306b\u57fa\u3065\u3044\u3066\u6b21\u306e\u30d1\u30cd\u30eb\u3092\u6c7a\u5b9a\r\n            \/\/ Q1->Q3->Q4(\u306f\u3044)->Q5(\u306f\u3044)\u306e\u30d1\u30b9\u3067Q6\u306b\u5230\u9054\u3057\u305f\u5834\u5408\u3001currentAnswerNumber\u306f1322 + Q6\u306e\u30dc\u30bf\u30f3ID\r\n            \/\/ \u4f8b: Q6\u3067\u300c\u96fb\u6d41\u300d(ID: 606)\u3092\u9078\u629e\u3057\u305f\u5834\u5408: 1322 + 606 = 1928\r\n            \/\/ \u4f8b: Q6\u3067\u300c\u96fb\u5727\u300d(ID: 660)\u3092\u9078\u629e\u3057\u305f\u5834\u5408: 1322 + 660 = 1982\r\n\r\n            \/\/ \u30e6\u30fc\u30b6\u30fc\u304c\u6307\u5b9a\u3057\u305f\u6761\u4ef6\u3092\u305d\u306e\u307e\u307e\u4f7f\u7528\u3057\u307e\u3059\u3002\r\n            \/\/ \u3053\u308c\u3089\u306e\u6761\u4ef6\u306fQ7\/Q8\u306e\u56de\u7b54\u3082\u542b\u307e\u308c\u305f\u6700\u7d42\u7684\u306aanswerNumber\u3092\u60f3\u5b9a\u3057\u3066\u3044\u308b\u305f\u3081\u3001\r\n            \/\/ Q6\u56de\u7b54\u6642\u70b9\u306ecurrentAnswerNumber\u3068\u306f\u4e00\u81f4\u3057\u306a\u3044\u53ef\u80fd\u6027\u304c\u3042\u308a\u307e\u3059\u3002\r\n            \/\/ \u305d\u306e\u5834\u5408\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u306ereturn\u6587\u304c\u5b9f\u884c\u3055\u308c\u307e\u3059\u3002\r\n            if (currentAnswerNumber === 1964) {\r\n                console.log(\"Condition 1964 met: returning result-panel for both.\");\r\n                return { \"\u96fb\u6d41\": \"result-panel\", \"\u96fb\u5727\": \"result-panel\" };\r\n            } else if (currentAnswerNumber === 2009) {\r\n                console.log(\"Condition 2009 met: returning result-panel for both.\");\r\n                return { \"\u96fb\u6d41\": \"result-panel\", \"\u96fb\u5727\": \"result-panel\" };\r\n            } else if (currentAnswerNumber === 2018) {\r\n                console.log(\"Condition 2018 met: returning result-panel for both.\");\r\n                return { \"\u96fb\u6d41\": \"result-panel\", \"\u96fb\u5727\": \"result-panel\" };\r\n            } else if (currentAnswerNumber === 2063) {\r\n                console.log(\"Condition 2063 met: returning result-panel for both.\");\r\n                return { \"\u96fb\u6d41\": \"result-panel\", \"\u96fb\u5727\": \"result-panel\" };\r\n            } else if (currentAnswerNumber === 1928) {\r\n                console.log(\"Condition 1928 met: returning Q7\/Q8 based on answer.\");\r\n                return { \"\u96fb\u6d41\": \"question7-panel\", \"\u96fb\u5727\": \"question8-panel\" };\r\n            }\r\n            \/\/ \u4e0a\u8a18\u306e\u3069\u306e\u6761\u4ef6\u3082\u6e80\u305f\u3055\u308c\u306a\u3044\u5834\u5408\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u9077\u79fb\u30eb\u30fc\u30eb\u3092\u8fd4\u3057\u307e\u3059\u3002\r\n            console.log(\"No specific condition met in nextPanelflow. Returning default Q7\/Q8 flow.\");\r\n            return { \"\u96fb\u6d41\": \"question8-panel\", \"\u96fb\u5727\": \"question8-panel\" };\r\n        }\r\n\r\n        \/**\r\n         * \u6307\u5b9a\u3055\u308c\u305f\u30d1\u30cd\u30eb\u3092\u8868\u793a\u3057\u3001\u4ed6\u306e\u30d1\u30cd\u30eb\u3092\u975e\u8868\u793a\u306b\u3057\u307e\u3059\u3002\r\n         * \u307e\u305f\u3001\u73fe\u5728\u8868\u793a\u3055\u308c\u3066\u3044\u308b\u30d1\u30cd\u30eb\u306e\u30d8\u30c3\u30c0\u30fc\u306e\u307f\u3092\u30af\u30ea\u30c3\u30af\u53ef\u80fd\u306b\u3057\u307e\u3059\u3002\r\n         * @param {string} panelId - \u8868\u793a\u3059\u308b\u30d1\u30cd\u30eb\u306eID\u3002\r\n         *\/\r\n        function displayPanel(panelId) {\r\n            console.log(\"--- displayPanel START ---\");\r\n            console.log(\"Attempting to display panel with ID:\", panelId);\r\n            const targetPanel = document.getElementById(panelId);\r\n            if (!targetPanel) {\r\n                console.error(\"Error: Target panel element not found for ID:\", panelId);\r\n                return; \/\/ \u30d1\u30cd\u30eb\u304c\u898b\u3064\u304b\u3089\u306a\u3044\u5834\u5408\u306f\u3053\u3053\u3067\u51e6\u7406\u3092\u7d42\u4e86\r\n            }\r\n\r\n            \/\/ answerHistory\u306b\u30d1\u30cd\u30ebID\u3092\u8ffd\u52a0 (\u7d50\u679c\u30d1\u30cd\u30eb\u306f\u9664\u304f)\r\n            \/\/ \u305f\u3060\u3057\u3001\u5c65\u6b74\u306e\u6700\u5f8c\u306e\u8981\u7d20\u3068\u540c\u3058\u5834\u5408\u306f\u8ffd\u52a0\u3057\u306a\u3044 (\u91cd\u8907\u9632\u6b62)\r\n            if (panelId !== \"result-panel\") {\r\n                if (answerHistory.length === 0 || answerHistory[answerHistory.length - 1] !== panelId) {\r\n                    answerHistory.push(panelId);\r\n                    console.log(\"answerHistory updated in displayPanel:\", answerHistory);\r\n                }\r\n            }\r\n\r\n            \/\/ \u5168\u3066\u306e\u30d1\u30cd\u30eb\u3092\u975e\u8868\u793a\u306b\u3057\u3001\u30d8\u30c3\u30c0\u30fc\u306e\u72b6\u614b\u3092\u30ea\u30bb\u30c3\u30c8\r\n            accordionPanels.forEach(panel => {\r\n                panel.classList.remove('show');\r\n                const header = diagnosisContainer.querySelector(`[aria-controls=\"${panel.id}\"]`);\r\n                if (header) {\r\n                    header.setAttribute('aria-expanded', 'false');\r\n                    header.closest('.accordion-item').classList.remove('active');\r\n                    \/\/ \u5168\u3066\u306e\u30d8\u30c3\u30c0\u30fc\u304b\u3089\u30af\u30ea\u30c3\u30af\u53ef\u80fd\u30af\u30e9\u30b9\u3092\u524a\u9664\r\n                    header.classList.remove('is-current-question');\r\n                }\r\n            });\r\n\r\n\r\n            \/\/ \u5bfe\u8c61\u306e\u30d1\u30cd\u30eb\u3092\u8868\u793a\u3057\u3001\u30d8\u30c3\u30c0\u30fc\u306e\u72b6\u614b\u3092\u66f4\u65b0\r\n            targetPanel.classList.add('show');\r\n            const targetHeader = diagnosisContainer.querySelector(`[aria-controls=\"${panelId}\"]`);\r\n            if (targetHeader) {\r\n                targetHeader.setAttribute('aria-expanded', 'true');\r\n                targetHeader.closest('.accordion-item').classList.add('active');\r\n                \/\/ \u73fe\u5728\u306e\u8cea\u554f\u306e\u30d8\u30c3\u30c0\u30fc\u306b\u30af\u30ea\u30c3\u30af\u53ef\u80fd\u30af\u30e9\u30b9\u3092\u8ffd\u52a0\r\n                targetHeader.classList.add('is-current-question');\r\n                \/\/ \u30a2\u30af\u30c6\u30a3\u30d6\u306a\u30a2\u30a4\u30c6\u30e0\u307e\u3067\u30b9\u30af\u30ed\u30fc\u30eb\r\n                targetHeader.closest('.accordion-item').scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n            }\r\n            console.log(\"Successfully displayed panel:\", panelId);\r\n            console.log(\"--- displayPanel END ---\");\r\n        }\r\n\r\n        \/**\r\n         * \u30e6\u30fc\u30b6\u30fc\u306e\u56de\u7b54\u3092\u51e6\u7406\u3057\u3001\u6b21\u306e\u8cea\u554f\u307e\u305f\u306f\u7d50\u679c\u3092\u6c7a\u5b9a\u3057\u307e\u3059\u3002\r\n         * @param {string} currentPanelId - \u56de\u7b54\u304c\u4e0e\u3048\u3089\u308c\u305f\u30d1\u30cd\u30eb\u306eID\u3002\r\n         * @param {string} selectedAnswer - \u9078\u629e\u3055\u308c\u305f\u56de\u7b54\u306e\u30c6\u30ad\u30b9\u30c8\u3002\r\n         * @param {string} buttonId - \u9078\u629e\u3055\u308c\u305f\u56de\u7b54\u30dc\u30bf\u30f3\u306eID\u3002\r\n         *\/\r\n        function processAnswer(currentPanelId, selectedAnswer, buttonId) {\r\n            console.log(\"--- processAnswer START ---\");\r\n            console.log(\"Current Panel ID:\", currentPanelId, \"Selected Answer:\", selectedAnswer, \"Button ID:\", buttonId);\r\n            console.log(\"answerNumber before processing:\", answerNumber);\r\n\r\n            \/\/ Check if this question was already answered\r\n            if (answers[currentPanelId]) {\r\n                console.log(`Question ${currentPanelId} was already answered. Old answer: ${answers[currentPanelId]}`);\r\n                \/\/ If so, subtract the old answer's ID from answerNumber\r\n                const oldAnswerText = answers[currentPanelId];\r\n                \/\/ Find the button ID for the old answer\r\n                const oldAnswerButton = document.getElementById(currentPanelId).querySelector(`button[data-answer=\"${oldAnswerText}\"]`);\r\n                if (oldAnswerButton && oldAnswerButton.id) {\r\n                    const oldIdAsNumber = parseInt(oldAnswerButton.id, 10);\r\n                    if (!isNaN(oldIdAsNumber)) {\r\n                        answerNumber -= oldIdAsNumber;\r\n                        console.log(`Subtracted old answer ID ${oldIdAsNumber}. answerNumber now: ${answerNumber}`);\r\n                    }\r\n                }\r\n            }\r\n\r\n            answers[currentPanelId] = selectedAnswer; \/\/ Save the new answer\r\n\r\n            \/\/ Add the new answer's ID to answerNumber\r\n            const idAsNumber = parseInt(buttonId, 10);\r\n            if (!isNaN(idAsNumber)) {\r\n                answerNumber += idAsNumber;\r\n                console.log(\"Updated answerNumber:\", answerNumber);\r\n            }\r\n\r\n            \/\/ \u30d8\u30c3\u30c0\u30fc\u306e\u56de\u7b54\u30b9\u30c6\u30fc\u30bf\u30b9\u3092\u66f4\u65b0\r\n            const headerButton = diagnosisContainer.querySelector(`[aria-controls=\"${currentPanelId}\"]`);\r\n            if (headerButton) {\r\n                const statusSpan = headerButton.querySelector('.answer-status');\r\n                if (statusSpan) {\r\n                    statusSpan.textContent = `: ${selectedAnswer}`;\r\n                    statusSpan.style.color = '#4CAF50'; \/\/ \u56de\u7b54\u6e08\u307f\u306f\u7dd1\u8272\r\n                }\r\n            }\r\n\r\n            let nextPanelId;\r\n            \/\/ Q6\u306e\u9077\u79fb\u306f\u52d5\u7684\u306b\u6c7a\u5b9a\u3055\u308c\u308b\u305f\u3081\u3001\u7279\u5225\u306b\u51e6\u7406\r\n            if (currentPanelId === \"question6-panel\") {\r\n                console.log(\"Current panel is Q6. Calling nextPanelflow with answerNumber:\", answerNumber);\r\n                const q6TransitionRules = questionFlow[\"question6-panel\"](answerNumber); \/\/ nextPanelflow\u95a2\u6570\u3092\u547c\u3073\u51fa\u3057\u3001\u9077\u79fb\u30eb\u30fc\u30eb\u3092\u53d6\u5f97\r\n                nextPanelId = q6TransitionRules[selectedAnswer]; \/\/ \u53d6\u5f97\u3057\u305f\u30eb\u30fc\u30eb\u306b\u57fa\u3065\u3044\u3066\u6b21\u306e\u30d1\u30cd\u30ebID\u3092\u6c7a\u5b9a\r\n            } else {\r\n                nextPanelId = questionFlow[currentPanelId][selectedAnswer];\r\n                console.log(\"General flow: nextPanelId from questionFlow:\", nextPanelId);\r\n            }\r\n\r\n            console.log(\"Final determined nextPanelId in processAnswer:\", nextPanelId);\r\n\r\n            \/\/ \u6b21\u306e\u30d1\u30cd\u30eb\u304c\u7d50\u679c\u30d1\u30cd\u30eb\u306e\u5834\u5408\u3001\u7d50\u679c\u3092\u8a08\u7b97\u3057\u3066\u8868\u793a\r\n            if (nextPanelId === \"result-panel\") {\r\n                console.log(\"Next panel is result-panel. Calling handleResult.\");\r\n                handleResult();\r\n            } else if (nextPanelId) { \/\/ nextPanelId\u304cundefined\u3084null\u3067\u306a\u3044\u3053\u3068\u3092\u78ba\u8a8d\u3057\u3066\u304b\u3089\u8868\u793a\u3092\u8a66\u307f\u308b\r\n                console.log(\"Calling displayPanel with:\", nextPanelId);\r\n                displayPanel(nextPanelId);\r\n            } else {\r\n                console.error(\"Error: nextPanelId is undefined or null. Cannot proceed to display panel.\");\r\n            }\r\n            console.log(\"--- processAnswer END ---\");\r\n        }\r\n\r\n        \/**\r\n         * \u53ce\u96c6\u3055\u308c\u305f\u56de\u7b54\u306b\u57fa\u3065\u3044\u3066\u6700\u7d42\u7684\u306a\u88fd\u54c1\u8a3a\u65ad\u7d50\u679c\u3092\u8a08\u7b97\u3057\u3001\u8868\u793a\u3057\u307e\u3059\u3002\r\n         *\/\r\n        function handleResult() {\r\n          \/\/ answerNumber \u306f\u3001\u56de\u7b54\u30dc\u30bf\u30f3\u304c\u30af\u30ea\u30c3\u30af\u3055\u308c\u308b\u305f\u3073\u306b\u52a0\u7b97\u3055\u308c\u308b\u30b0\u30ed\u30fc\u30d0\u30eb\u5909\u6570\uff08\u307e\u305f\u306f\u9069\u5207\u306a\u30b9\u30b3\u30fc\u30d7\u306e\u5909\u6570\uff09\u3068\r\n\r\n          const currentAnswerNumber = answerNumber;\r\n           console.log(\"handleResult called with answerNumber:\", currentAnswerNumber);\r\n\r\n           const answerNumberToResultKey = {\r\n              303: \"Z\", \/\/ \u8981\u76f8\u8ac7\r\n              321: \"Y\",  \/\/ \u8a72\u5f53\u306a\u3057\r\n              440: \"X\",  \/\/ CLA\u30b7\u30ea\u30fc\u30ba\r\n              1964: \"A\",\r\n              2018: \"B\",\r\n              2009: \"C\",\r\n              2063: \"D\",\r\n              2635: \"E\",\r\n              2698: \"F\",\r\n              2790: \"G\",\r\n              2822: \"H\",\r\n              2862: \"I\",\r\n              2781: \"J\",\r\n              2813: \"K\",\r\n              2853: \"L\",\r\n              2835: \"M\",\r\n              2867: \"N\",\r\n              2907: \"O\"\r\n          };\r\n\r\n          \/\/ answerNumber \u306b\u5bfe\u5fdc\u3059\u308b resultKey \u3092\u53d6\u5f97\r\n          const resultKey = answerNumberToResultKey[currentAnswerNumber];\r\n          console.log(\"Resolved resultKey:\", resultKey); \/\/ \u30c7\u30d0\u30c3\u30b0\u7528\r\n\r\n          const resultData = resultsMap[resultKey];\r\n          console.log(\"Resolved resultData:\", resultData); \/\/ \u30c7\u30d0\u30c3\u30b0\u7528\r\n\r\n          let resultHTML = \"\";\r\n\r\n          if (resultData) {\r\n                \/\/ images\u914d\u5217\u304c\u5b58\u5728\u3057\u3001\u304b\u3064\u8981\u7d20\u304c\u3042\u308b\u5834\u5408\u306e\u307fimg\u30bf\u30b0\u3092\u8ffd\u52a0\r\n                if (resultData.images && resultData.images.length > 0) {\r\n                   \/\/ \u753b\u50cf\u304c\u8907\u6570\u3042\u308b\u5834\u5408\u306f\u6a2a\u4e26\u3073\u30b3\u30f3\u30c6\u30ca\u3067\u56f2\u3080\r\n                    if (resultData.images.length > 1) {\r\n                        resultHTML += `<div class=\"product-images-container\">`;\r\n                      resultData.images.forEach(imageUrl => {\r\n                        resultHTML += `<img fetchpriority=\"high\" decoding=\"async\" src=\"${imageUrl}\" class=\"product-image\" alt=\"${resultData.name}\u306e\u753b\u50cf\" width=\"350\" height=\"240\">`;\r\n                    });\r\n                    resultHTML += `<\/div>`;\r\n                    } else {\r\n                        \/\/ \u753b\u50cf\u304c1\u679a\u306e\u5834\u5408\u306f\u305d\u306e\u307e\u307e\u8868\u793a\r\n                        resultHTML += `<img decoding=\"async\" src=\"${resultData.images[0]}\" class=\"product-image\" alt=\"${resultData.name}\u306e\u753b\u50cf\" width=\"350\" height=\"240\">`;\r\n                    }\r\n                }\r\n                \/\/ \u88fd\u54c1\u540d\u3092\u8868\u793a (name\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u7528)\r\n                resultHTML += `<p>\u88fd\u54c1\u540d: ${resultData.name}<\/p>`;\r\n                \/\/ description\u304c\u5b58\u5728\u3059\u308b\u5834\u5408\u306e\u307fp\u30bf\u30b0\u3092\u8ffd\u52a0 (description\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u7528)\r\n                if (resultData.description !== undefined) {\r\n                    resultHTML += `<br><br><p> ${resultData.description}<\/p>`;\r\n                }\r\n\r\n                resultHTML += `\r\n                    <p style=\"color: #5679b0;\">\u5fc5\u305a\u300c\u7d50\u679c\u3092\u30b3\u30d4\u30fc\u300d\u3092\u62bc\u3057\u3066\u304b\u3089\u554f\u3044\u5408\u308f\u305b\u30da\u30fc\u30b8\u3078\u79fb\u52d5\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\r\n                    <button id=\"copy-result-button\" class=\"action-button\">\r\n                        \u7d50\u679c\u3092\u30b3\u30d4\u30fc\r\n                    <\/button>\r\n                    <a href=\"https:\/\/kameokadenshi.co.jp\/home\/contact\/contact_product\/\" target=\"_blank\" class=\"action-button\">\r\n                      \u30c7\u30e2\u6a5f\u8cb8\u51fa\u306e\u76f8\u8ac7 \/ \u554f\u3044\u5408\u308f\u305b\u3092\u3059\u308b\r\n                    <\/a>\r\n                    <span id=\"copy-status-message\" class=\"ml-2 text-sm text-gray-600\"><\/span>\r\n                `;\r\n\r\n            } else {\r\n                \/\/ answerNumber \u306b\u5bfe\u5fdc\u3059\u308b\u7d50\u679c\u304c\u898b\u3064\u304b\u3089\u306a\u3044\u5834\u5408\r\n                resultHTML = \"\u8a3a\u65ad\u7d50\u679c\u304c\u898b\u3064\u304b\u308a\u307e\u305b\u3093\u3067\u3057\u305f\u3002\u56de\u7b54\u3092\u3084\u308a\u76f4\u3057\u3066\u304f\u3060\u3055\u3044\u3002\";\r\n                console.warn(\"No result found for answerNumber:\", currentAnswerNumber); \/\/ \u30c7\u30d0\u30c3\u30b0\u7528\u306b\u30b3\u30f3\u30bd\u30fc\u30eb\u306b\u51fa\u529b\r\n                console.log(\"resultDate\", resultData);\r\n            }\r\n            resultArea.innerHTML = resultHTML;\r\n            resultPanel.classList.add('show'); \/\/ \u7d50\u679c\u30d1\u30cd\u30eb\u3092\u8868\u793a\r\n            \/\/ \u7d50\u679c\u30d1\u30cd\u30eb\u3092\u542b\u3080accordion-item\u307e\u3067\u30b9\u30af\u30ed\u30fc\u30eb\r\n            const resultItemIndex = Array.from(accordionItems).findIndex(item => item.contains(resultPanel));\r\n            if (resultItemIndex !== -1) {\r\n                accordionItems[resultItemIndex].scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n            } else {\r\n                resultPanel.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n            }\r\n\r\n            const copyButton = document.getElementById('copy-result-button');\r\n            if (copyButton) {\r\n                copyButton.addEventListener('click', () => {\r\n                    const resultToCopy = answercontents[resultKey]; \/\/ answercontents\u304b\u3089\u30c7\u30fc\u30bf\u3092\u53d6\u5f97\r\n                    let copyText = \"\";\r\n                    if (resultToCopy) {\r\n                        \/\/ answerProduct\u3068comment\u3092\u7d50\u5408\u3057\u3066\u30b3\u30d4\u30fc\u30c6\u30ad\u30b9\u30c8\u3092\u4f5c\u6210\r\n                        copyText = `${resultToCopy.answerProduct || '\u4e0d\u660e\u306a\u88fd\u54c1'}\\n${resultToCopy.comment || '\u30b3\u30e1\u30f3\u30c8\u306a\u3057'}`;\r\n                    } else {\r\n                        \/\/ answercontents\u306b\u8a72\u5f53\u3059\u308b\u30ad\u30fc\u304c\u306a\u3044\u5834\u5408\u306e\u30d5\u30a9\u30fc\u30eb\u30d0\u30c3\u30af\r\n                        copyText = \"\u8a3a\u65ad\u7d50\u679c\u304c\u898b\u3064\u304b\u308a\u307e\u305b\u3093\u3067\u3057\u305f\u3002\";\r\n                    }\r\n\r\n                    \/\/ \u4e00\u6642\u7684\u306atextarea\u8981\u7d20\u3092\u4f5c\u6210\u3057\u3001\u30c6\u30ad\u30b9\u30c8\u3092\u30b3\u30d4\u30fc\r\n                    const tempTextArea = document.createElement('textarea');\r\n                    tempTextArea.value = copyText;\r\n                    document.body.appendChild(tempTextArea);\r\n\r\n                    \/\/ \u30c6\u30ad\u30b9\u30c8\u3092\u9078\u629e\r\n                    tempTextArea.select();\r\n                    tempTextArea.setSelectionRange(0, 99999); \/\/ \u30e2\u30d0\u30a4\u30eb\u30c7\u30d0\u30a4\u30b9\u5bfe\u5fdc\r\n\r\n                    \/\/ \u30af\u30ea\u30c3\u30d7\u30dc\u30fc\u30c9\u306b\u30b3\u30d4\u30fc\r\n                    try {\r\n                        document.execCommand('copy');\r\n                        const statusMessage = document.getElementById('copy-status-message');\r\n                        if (statusMessage) {\r\n                            statusMessage.textContent = '\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\uff01';\r\n                            setTimeout(() => {\r\n                                statusMessage.textContent = '';\r\n                            }, 2000); \/\/ 2\u79d2\u5f8c\u306b\u30e1\u30c3\u30bb\u30fc\u30b8\u3092\u30af\u30ea\u30a2\r\n                        }\r\n                    } catch (err) {\r\n                        console.error('Failed to copy text: ', err);\r\n                        const statusMessage = document.getElementById('copy-status-message');\r\n                        if (statusMessage) {\r\n                            statusMessage.textContent = '\u30b3\u30d4\u30fc\u306b\u5931\u6557\u3057\u307e\u3057\u305f\u3002';\r\n                        }\r\n                    } finally {\r\n                        \/\/ \u4e00\u6642\u7684\u306atextarea\u3092\u524a\u9664\r\n                        document.body.removeChild(tempTextArea);\r\n                    }\r\n            });\r\n          }\r\n        }\r\n\r\n\r\n        \/**\r\n         * \u7279\u5b9a\u306e\u8cea\u554f\u3068\u305d\u306e\u5f8c\u306e\u8cea\u554f\u306e\u56de\u7b54\u3092\u30ea\u30bb\u30c3\u30c8\u3057\u307e\u3059\u3002\r\n         * @param {string} questionId - \u30ea\u30bb\u30c3\u30c8\u3059\u308b\u8cea\u554f\u306eID (\u4f8b: \"Q1\")\u3002\r\n         *\/\r\n        function resetQuestion() {\r\n            \/\/ answerHistory\u304c\u7a7a\u306e\u5834\u5408\u3001\u6700\u521d\u306e\u8cea\u554f\u306b\u623b\u308b\r\n            if (answerHistory.length <= 1) {\r\n                resetAll(); \/\/ \u6700\u521d\u306e\u8cea\u554f\u306b\u623b\u308b\u5834\u5408\u306f\u5168\u3066\u30ea\u30bb\u30c3\u30c8\r\n                return;\r\n            }\r\n\r\n            \/\/ Get the ID of the panel we are currently leaving (the last one in history before pop)\r\n            const panelToLeaveId = answerHistory[answerHistory.length - 1]; \/\/ This is the panel currently displayed\r\n            console.log(\"Panel to leave (current view):\", panelToLeaveId);\r\n\r\n            \/\/ Decrement answerNumber for the panel we are leaving\r\n            if (answers[panelToLeaveId]) {\r\n                const answeredButton = document.getElementById(panelToLeaveId).querySelector(`button[data-answer=\"${answers[panelToLeaveId]}\"]`);\r\n                if (answeredButton && answeredButton.id) {\r\n                    const idAsNumber = parseInt(answeredButton.id, 10);\r\n                    if (!isNaN(idAsNumber)) {\r\n                        answerNumber -= idAsNumber;\r\n                        console.log(`Subtracted ${idAsNumber} for ${panelToLeaveId}. New answerNumber: ${answerNumber}`);\r\n                    }\r\n                }\r\n                delete answers[panelToLeaveId]; \/\/ Clear the answer for the panel we are leaving\r\n            }\r\n\r\n            \/\/ Now, remove the panel we just left from the history\r\n            answerHistory.pop();\r\n            console.log(\"answerHistory after popping panelToLeaveId:\", answerHistory);\r\n\r\n            \/\/ \u4e00\u3064\u524d\u306e\u30d1\u30cd\u30eb\u306eID\u3092\u53d6\u5f97\r\n            const prevPanelId = answerHistory[answerHistory.length - 1];\r\n            console.log(\"Previous panel to display:\", prevPanelId);\r\n\r\n            \/\/ Reset UI for the panel we just left (panelToLeaveId)\r\n            const headerButtonToLeave = diagnosisContainer.querySelector(`[aria-controls=\"${panelToLeaveId}\"]`);\r\n            if (headerButtonToLeave) {\r\n                const statusSpan = headerButtonToLeave.querySelector('.answer-status');\r\n                if (statusSpan) {\r\n                    statusSpan.textContent = '\u672a\u56de\u7b54';\r\n                    statusSpan.style.color = '#777';\r\n                }\r\n                headerButtonToLeave.setAttribute('aria-expanded', 'false');\r\n                headerButtonToLeave.closest('.accordion-item').classList.remove('active');\r\n                 \/\/ is-current-question \u30af\u30e9\u30b9\u3082\u524a\u9664\r\n                headerButtonToLeave.classList.remove('is-current-question');\r\n            }\r\n            document.getElementById(panelToLeaveId).classList.remove('show');\r\n\r\n\r\n            \/\/ Clear any answers for panels that are *after* prevPanelId in the HTML structure\r\n            \/\/ This handles cases where a user might have clicked a header to jump forward,\r\n            \/\/ then clicked \"\u4e00\u3064\u623b\u308b\". We need to clear all answers that are now \"future\".\r\n            let foundPrevPanelInLoop = false;\r\n\r\n            accordionPanels.forEach(panel => {\r\n                if (panel.id === prevPanelId) {\r\n                    foundPrevPanelInLoop = true;\r\n                    \/\/ prevPanelId\u81ea\u4f53\u306f\u3053\u3053\u3067\u306f\u30ea\u30bb\u30c3\u30c8\u3057\u306a\u3044\uff08\u65e2\u306b\u5c65\u6b74\u304b\u3089\u30dd\u30c3\u30d7\u3055\u308c\u3066\u3044\u308b\u305f\u3081\uff09\r\n                    \/\/ \u305f\u3060\u3057\u3001\u3082\u3057prevPanelId\u306eUI\u72b6\u614b\u3092\u30ea\u30bb\u30c3\u30c8\u3059\u308b\u5fc5\u8981\u304c\u3042\u308b\u306a\u3089\u3053\u3053\u3067\u884c\u3046\r\n                    \/\/ \u4f8b: prevPanelId\u306eheaderButton\u306eactive\u30af\u30e9\u30b9\u3092\u524a\u9664\u3059\u308b\u306a\u3069\r\n                    return;\r\n                }\r\n                if (foundPrevPanelInLoop) {\r\n                    \/\/ This panel is logically after prevPanelId\r\n                    if (answers[panel.id]) { \/\/ Only if there was an answer\r\n                        const answeredButton = panel.querySelector(`button[data-answer=\"${answers[panel.id]}\"]`);\r\n                        if (answeredButton && answeredButton.id) {\r\n                            const idAsNumber = parseInt(answeredButton.id, 10);\r\n                            if (!isNaN(idAsNumber)) {\r\n                                answerNumber -= idAsNumber;\r\n                                console.log(`Subtracted ${idAsNumber} for ${panel.id}. New answerNumber: ${answerNumber}`);\r\n                            }\r\n                        }\r\n\r\n                        delete answers[panel.id];\r\n                         }\r\n                    \/\/ Reset UI for these subsequent panels\r\n                    const headerButton = diagnosisContainer.querySelector(`[aria-controls=\"${panel.id}\"]`);\r\n                    if (headerButton) {\r\n                        const statusSpan = headerButton.querySelector('.answer-status');\r\n                        if (statusSpan) {\r\n                            statusSpan.textContent = '\u672a\u56de\u7b54';\r\n                            statusSpan.style.color = '#777';\r\n                        }\r\n                         \/\/ is-current-question \u30af\u30e9\u30b9\u3082\u524a\u9664\r\n                        headerButton.classList.remove('is-current-question');\r\n                    }\r\n                    panel.classList.remove('show'); \/\/ \u30d1\u30cd\u30eb\u3092\u975e\u8868\u793a\u306b\r\n                    if (headerButton) {\r\n                        headerButton.setAttribute('aria-expanded', 'false');\r\n                        headerButton.closest('.accordion-item').classList.remove('active');\r\n                    }\r\n                    panel.classList.remove('show');\r\n                }\r\n            });\r\n\r\n            \/\/ \u7d50\u679c\u30d1\u30cd\u30eb\u304c\u3082\u3057\u8868\u793a\u3055\u308c\u3066\u3044\u305f\u3089\u975e\u8868\u793a\u306b\u3057\u3001\u5185\u5bb9\u3092\u30af\u30ea\u30a2\r\n            resultPanel.classList.remove('show');\r\n            resultArea.innerHTML = '';\r\n\r\n            \/\/ \u4e00\u3064\u524d\u306e\u30d1\u30cd\u30eb\u3092\u8868\u793a\r\n            displayPanel(prevPanelId);\r\n        }\r\n        \/**\r\n         * \u5168\u3066\u306e\u8cea\u554f\u3092\u30ea\u30bb\u30c3\u30c8\u3057\u3001\u6700\u521d\u306b\u623b\u308a\u307e\u3059\u3002\r\n         *\/\r\n        function resetAll() {\r\n            answers = {}; \/\/ \u5168\u3066\u306e\u56de\u7b54\u3092\u30af\u30ea\u30a2\r\n            answerNumber = 0; \/\/ answerNumber\u3082\u30af\u30ea\u30a2\r\n            answerHistory = []; \/\/ \u5c65\u6b74\u3082\u30af\u30ea\u30a2\r\n\r\n            \/\/ \u5168\u3066\u306e\u30a2\u30b3\u30fc\u30c7\u30a3\u30aa\u30f3\u30a2\u30a4\u30c6\u30e0\u3092\u30ea\u30bb\u30c3\u30c8\r\n            accordionPanels.forEach(panel => {\r\n                panel.classList.remove('show');\r\n                const header = diagnosisContainer.querySelector(`[aria-controls=\"${panel.id}\"]`);\r\n                if (header) {\r\n                    header.setAttribute('aria-expanded', 'false');\r\n                    header.closest('.accordion-item').classList.remove('active');\r\n                    const statusSpan = header.querySelector('.answer-status');\r\n                    if (statusSpan) {\r\n                        statusSpan.textContent = '\u672a\u56de\u7b54';\r\n                        statusSpan.style.color = '#777';\r\n                    }\r\n                     \/\/ is-current-question \u30af\u30e9\u30b9\u3082\u524a\u9664\r\n                    header.classList.remove('is-current-question');\r\n                }\r\n            });\r\n\r\n            \/\/ \u7d50\u679c\u30d1\u30cd\u30eb\u3092\u975e\u8868\u793a\u306b\u3057\u3001\u5185\u5bb9\u3092\u30af\u30ea\u30a2\r\n            resultPanel.classList.remove('show');\r\n            resultArea.innerHTML = '';\r\n\r\n            \/\/ \u6700\u521d\u306e\u8cea\u554f\u3092\u8868\u793a\r\n            displayPanel('question1-panel');\r\n        }\r\n\r\n        \/\/ --- \u30a4\u30d9\u30f3\u30c8\u30ea\u30b9\u30ca\u30fc ---\r\n\r\n        \/\/ \u30a2\u30b3\u30fc\u30c7\u30a3\u30aa\u30f3\u30d8\u30c3\u30c0\u30fc\u306e\u30af\u30ea\u30c3\u30af\u30a4\u30d9\u30f3\u30c8\u30ea\u30b9\u30ca\u30fc\r\n        accordionHeaders.forEach(header => {\r\n            header.addEventListener('click', () => {\r\n                const panelId = header.getAttribute('aria-controls');\r\n                \/\/ \u30af\u30ea\u30c3\u30af\u3055\u308c\u305f\u30d8\u30c3\u30c0\u30fc\u304c\u73fe\u5728\u56de\u7b54\u4e2d\u306e\u8cea\u554f\u306e\u30d8\u30c3\u30c0\u30fc\u3067\u3042\u308b\u304b\u3092\u78ba\u8a8d\r\n                const isCurrentQuestionHeader = header.classList.contains('is-current-question');\r\n\r\n                if (isCurrentQuestionHeader) {\r\n                     \/\/ \u73fe\u5728\u958b\u3044\u3066\u3044\u308b\u30d1\u30cd\u30eb\u3092\u9589\u3058\u308b\u51e6\u7406\u306f\u3001\u57fa\u672c\u7684\u306b\u306f\u56de\u7b54\u9078\u629e\u6642\u3084\u300c\u4e00\u3064\u623b\u308b\u300d\u3067\u884c\u308f\u308c\u308b\u305f\u3081\u3001\r\n                     \/\/ \u3053\u3053\u3067\u306f\u30af\u30ea\u30c3\u30af\u3067\u9589\u3058\u308b\u52d5\u4f5c\u306f\u7121\u52b9\u5316\u3057\u307e\u3059\u3002\r\n                     \/\/ \u5e38\u306b\u30af\u30ea\u30c3\u30af\u3067\u958b\u304f\uff08\u307e\u305f\u306f\u65e2\u306b\u958b\u3044\u3066\u3044\u308b\u5834\u5408\u306f\u4f55\u3082\u3057\u306a\u3044\uff09\u52d5\u4f5c\u3068\u3057\u307e\u3059\u3002\r\n                     \/\/ \u305f\u3060\u3057\u3001\u3053\u308c\u306f\u300c\u4e00\u3064\u623b\u308b\u300d\u306e\u30ed\u30b8\u30c3\u30af\u3068\u7af6\u5408\u3059\u308b\u53ef\u80fd\u6027\u304c\u3042\u308b\u305f\u3081\u3001\r\n                     \/\/ \u57fa\u672c\u7684\u306b\u306f\u56de\u7b54\u30dc\u30bf\u30f3\u306b\u3088\u308b\u9077\u79fb\u3092\u4e3b\u3068\u3057\u3001\u30d8\u30c3\u30c0\u30fc\u306e\u30af\u30ea\u30c3\u30af\u306f\r\n                     \/\/ \u73fe\u5728\u306e\u8cea\u554f\u3078\u306e\u79fb\u52d5\u306e\u307f\u306b\u9650\u5b9a\u3059\u308b\u306e\u304c\u671b\u307e\u3057\u3044\u3067\u3059\u3002\r\n                     \/\/ \u3053\u3053\u3067\u306f\u30b7\u30f3\u30d7\u30eb\u306b\u3001\u8a31\u53ef\u3055\u308c\u305f\u30d8\u30c3\u30c0\u30fc\u306e\u30af\u30ea\u30c3\u30af\u3067\u30d1\u30cd\u30eb\u3092\u8868\u793a\u3057\u307e\u3059\u3002\r\n                     displayPanel(panelId);\r\n                } else {\r\n                    console.log(\"Clicked header is not the current question. Ignoring click.\");\r\n                }\r\n            });\r\n        });\r\n\r\n        \/\/ \u5404\u30d1\u30cd\u30eb\u5185\u306e\u9078\u629e\u80a2\u30dc\u30bf\u30f3\u306e\u30a4\u30d9\u30f3\u30c8\u30ea\u30b9\u30ca\u30fc\r\n        accordionPanels.forEach(panel => {\r\n            const optionButtons = panel.querySelectorAll('button[data-next]');\r\n            optionButtons.forEach(button => {\r\n                button.addEventListener('click', (event) => { \/\/ event \u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u3092\u53d7\u3051\u53d6\u308b\u3088\u3046\u306b\u4fee\u6b63\r\n                    \/\/ \u30af\u30ea\u30c3\u30af\u3055\u308c\u305f\u30dc\u30bf\u30f3\u306eID\u3092\u53d6\u5f97\u3057\u3001answerNumber\u306b\u52a0\u7b97\r\n                    const buttonId = event.target.id;\r\n                    \/\/ answerNumber\u306e\u52a0\u7b97\u306fprocessAnswer\u5185\u3067\u884c\u3046\u3088\u3046\u306b\u5909\u66f4\r\n                    \/\/ if (buttonId) {\r\n                    \/\/     const idAsNumber = parseInt(buttonId, 10);\r\n                    \/\/     if (!isNaN(idAsNumber)) {\r\n                    \/\/         answerNumber += idAsNumber;\r\n                    \/\/         console.log(\"answerNumber:\", answerNumber); \/\/ \u78ba\u8a8d\u306e\u305f\u3081\u306b\u30b3\u30f3\u30bd\u30fc\u30eb\u306b\u51fa\u529b\r\n                    \/\/     }\r\n                    \/\/ }\r\n\r\n                    const currentPanelId = panel.id;\r\n                    const selectedAnswer = button.dataset.answer;\r\n                    \/\/ buttonId\u3082processAnswer\u306b\u6e21\u3059\r\n                    processAnswer(currentPanelId, selectedAnswer, buttonId);\r\n                });\r\n            });\r\n        });\r\n\r\n        \/\/ \u300c\u4e00\u3064\u623b\u308b\u300d\u30dc\u30bf\u30f3\u306e\u30a4\u30d9\u30f3\u30c8\u30ea\u30b9\u30ca\u30fc\r\n        resetButtons.forEach(button => {\r\n            button.addEventListener('click', () => {\r\n                resetQuestion();\r\n            });\r\n        });\r\n\r\n        \/\/ \u300c\u3084\u308a\u76f4\u3059\u300d\u30dc\u30bf\u30f3\u306e\u30a4\u30d9\u30f3\u30c8\u30ea\u30b9\u30ca\u30fc\r\n        resetAllButton.addEventListener('click', resetAll);\r\n\r\n        \/\/ \u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306e\u521d\u671f\u5316: \u6700\u521d\u306e\u8cea\u554f\u3092\u8868\u793a\r\n        displayPanel('question1-panel');\r\n    });\r\n<\/script>\r\n\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ed4a162 elementor-widget elementor-widget-spacer\" data-id=\"ed4a162\" data-element_type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>CLA\u30b7\u30ea\u30fc\u30ba \u304a\u3059\u3059\u3081\u88fd\u54c1\u8a3a\u65ad \u3044\u304f\u3064\u304b\u306e\u8cea\u554f\u306b\u56de\u7b54\u3044\u305f\u3060\u304f\u3053\u3068\u3067\u3042\u306a\u305f\u306b\u304a\u3059\u3059\u3081\u306e\u88fd\u54c1\u3092\u30d4\u30c3\u30af\u30a2\u30c3\u30d7\u3057\u307e\u3059! \u88fd\u54c1\u8a3a\u65ad\u30a2\u30d7\u30ea Q1. \u30bf\u30f3\u30af\u306e\u7a2e\u985e\u306f\uff1f\u672a\u56de\u7b54 \u91d1\u5c5e\u88fd \u6a39\u8102\u30fb\u30ac\u30e9\u30b9\u88fd \u4e00\u3064\u623b\u308b Q2. \u6a39\u8102\uff65\u30ac\u30e9\u30b9\u88fd\u306e<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-15378","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/kameokadenshi.co.jp\/home\/wp-json\/wp\/v2\/pages\/15378","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kameokadenshi.co.jp\/home\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kameokadenshi.co.jp\/home\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kameokadenshi.co.jp\/home\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/kameokadenshi.co.jp\/home\/wp-json\/wp\/v2\/comments?post=15378"}],"version-history":[{"count":65,"href":"https:\/\/kameokadenshi.co.jp\/home\/wp-json\/wp\/v2\/pages\/15378\/revisions"}],"predecessor-version":[{"id":16287,"href":"https:\/\/kameokadenshi.co.jp\/home\/wp-json\/wp\/v2\/pages\/15378\/revisions\/16287"}],"wp:attachment":[{"href":"https:\/\/kameokadenshi.co.jp\/home\/wp-json\/wp\/v2\/media?parent=15378"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}