{"id":12236,"date":"2026-06-11T05:02:25","date_gmt":"2026-06-10T20:02:25","guid":{"rendered":"https:\/\/chicodori.net\/?p=12236"},"modified":"2026-06-11T05:06:24","modified_gmt":"2026-06-10T20:06:24","slug":"%e6%95%85%e4%ba%8b%e6%88%90%e8%aa%9e%e5%8d%9a%e5%a3%ab","status":"publish","type":"post","link":"https:\/\/chicodori.net\/?p=12236","title":{"rendered":"\u6545\u4e8b\u6210\u8a9e\u535a\u58eb"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">\u6545\u4e8b\u6210\u8a9e\u3068\u610f\u5473\u3092\u30014\u629e\u30b2\u30fc\u30e0\u3067\u697d\u3057\u304f\u30de\u30b9\u30bf\u30fc\u3057\u3088\u3046\uff01<\/p>\n\n\n\n<div class=\"wp-block-word-balloon-word-balloon-block\"><div class=\"w_b_box w_b_w100 w_b_flex w_b_div\"><div class=\"w_b_wrap w_b_wrap_talk w_b_L w_b_flex w_b_div\" style=\"\"><div class=\"w_b_ava_box w_b_relative w_b_ava_L w_b_f_n w_b_div\"><div class=\"w_b_icon_wrap w_b_relative w_b_div\"><div class=\"w_b_ava_wrap w_b_direction_L w_b_mp0 w_b_div\"><div class=\"w_b_ava_effect w_b_relative w_b_oh w_b_radius w_b_size_M w_b_div\" style=\"\">\n<img decoding=\"async\" src=\"https:\/\/chicodori.net\/wp-content\/uploads\/2022\/05\/chico.jpg\" width=\"96\" height=\"96\" alt=\"\" class=\"w_b_ava_img w_b_w100 w_b_h100  w_b_mp0 w_b_img\" style=\"\" \/>\n<\/div><\/div><\/div><\/div><div class=\"w_b_bal_box w_b_bal_L w_b_relative w_b_direction_L w_b_w100 w_b_div\"><div class=\"w_b_space w_b_mp0 w_b_div\"><svg version=\"1.1\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" width=\"1\" height=\"38\" viewBox=\"0 0 1 1\" fill=\"transparent\" stroke=\"transparent\" stroke-miterlimit=\"10\" class=\"w_b_db w_b_mp0\"><polygon fill=\"transparent\" stroke=\"transparent\" points=\"0,1 0,1 0,1 0,1 \"\/><\/svg><\/div><div class=\"w_b_bal_outer w_b_flex w_b_mp0 w_b_relative w_b_div\" style=\"\"><div class=\"w_b_bal_wrap w_b_bal_wrap_L w_b_div\"><div class=\"w_b_bal w_b_relative w_b_talk w_b_talk_L w_b_shadow_L w_b_ta_L w_b_div\"><div class=\"w_b_quote w_b_div\"><p>\u7531\u6765\u307e\u3067\u77e5\u308c\u3070\u3001\u3082\u3063\u3068\u5fd8\u308c\u306a\u3044\uff01<\/p><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u25a0\u3069\u3093\u306a\u30b2\u30fc\u30e0\uff1f<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>\u6545\u4e8b\u6210\u8a9e\u2192\u610f\u5473<\/strong>\u3001\u307e\u305f\u306f<strong>\u610f\u5473\u2192\u6545\u4e8b\u6210\u8a9e<\/strong>\u30924\u629e\u304b\u3089\u9078\u3076\u30b2\u30fc\u30e0\u3067\u3059\u3002<br>\u30d2\u30f3\u30c8\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u6545\u4e8b\u6210\u8a9e\u306e\u7531\u6765\u3082\u898b\u308b\u3053\u3068\u304c\u3067\u304d\u3001\u8a00\u8449\u306e\u610f\u5473\u3092\u7406\u89e3\u3057\u306a\u304c\u3089\u81ea\u7136\u306b\u899a\u3048\u3089\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u25a0\u3055\u3042\u3001\u3084\u3063\u3066\u307f\u3088\u3046\uff01<\/h3>\n\n\n<div class=\"ifw_wrap ifw_center\"><button class=\"ifw_btn\" data-postid=\"12236\" data-buttoncount=\"1\">\u3053\u308c\u597d\u304d<span class=\"material-symbols-rounded\">favorite<\/span><span class=\"ifw_count\" id=\"ifw_count_12236_1\">0<\/span><\/button><div class=\"ifw_message_wrap ifw_top_left\" id=\"ifw_message_12236_1\"><div class=\"ifw_message\"><div class=\"ifw_text\"><p class=\"ifw_processing\">\u9001\u4fe1\u4e2d\u3067\u3059<\/p><\/div><\/div><div class=\"ifw_arrow\"><\/div><\/div><div class=\"ifw_message_wrap ifw_top_left ifw_thanks\" id=\"ifw_thanks_12236_1\"><div class=\"ifw_close\" data-id=\"12236_1\">\u00d7<\/div><div class=\"ifw_message\"><div class=\"ifw_image\"><img decoding=\"async\" src=\"\" id=\"ifw_image_12236_1\"><\/div><div class=\"ifw_text\" id=\"ifw_showmessage_12236_1\"><\/div><\/div><div class=\"ifw_arrow\"><\/div><\/div><\/div>\n\n\n\n<style data-wp-block-html=\"css\">\n.koji-game,\n.koji-game *{\n  box-sizing:border-box;\n}\n\n.koji-game{\n  max-width:900px;\n  margin:30px auto;\n  padding:24px;\n  background:#fff8e8;\n  border:4px solid #ffd36e;\n  border-radius:28px;\n  box-shadow:0 8px 0 #f1b84b;\n  color:#4a3428;\n  text-align:center;\n  font-family:\"Hiragino Maru Gothic ProN\",\"Yu Gothic\",sans-serif;\n  position:relative;\n  overflow:hidden;\n}\n\n.koji-game h2{\n  margin:0 0 14px;\n  font-size:32px;\n  color:#ff8a3d;\n}\n\n.mode-box{\n  display:flex;\n  justify-content:center;\n  gap:12px;\n  flex-wrap:wrap;\n  margin-bottom:16px;\n}\n\n.mode-btn{\n  padding:12px 20px;\n  border-radius:18px;\n  border:3px solid #8bd3ff;\n  background:#fff;\n  box-shadow:0 5px 0 #55aee0;\n  font-size:18px;\n  font-weight:bold;\n  cursor:pointer;\n}\n\n.mode-btn.active{\n  background:#fff3c4;\n  border-color:#ffbf5a;\n  box-shadow:0 5px 0 #f1b84b;\n}\n\n.score{\n  margin:10px 0;\n  font-weight:bold;\n}\n\n.question-card{\n  margin:18px auto;\n  padding:20px;\n  background:#fffef7;\n  border:4px solid #ffbf5a;\n  border-radius:24px;\n  box-shadow:0 6px 0 #f1b84b;\n}\n\n.question-label{\n  font-size:18px;\n  font-weight:bold;\n  color:#8a5a2b;\n  margin-bottom:12px;\n}\n\n.vertical-text{\n  writing-mode:vertical-rl;\n  text-orientation:upright;\n  margin:0 auto;\n  height:260px;\n  width:320px;\n  padding:16px;\n  line-height:1.8;\n  font-size:34px;\n  font-weight:bold;\n  color:#ff7a3d;\n  text-align:left;\n  overflow-wrap:anywhere;\n}\n\n.question-yomi{\n  margin-top:12px;\n  font-size:18px;\n  font-weight:bold;\n  color:#6b7280;\n}\n\n.choices{\n  display:grid;\n  grid-template-columns:repeat(4,1fr);\n  gap:12px;\n  margin-top:18px;\n  align-items:stretch;\n}\n\n.choice{\n  min-height:230px;\n  padding:10px;\n  border-radius:18px;\n  border:3px solid #8bd3ff;\n  background:#fff;\n  box-shadow:0 5px 0 #55aee0;\n  cursor:pointer;\n  display:flex;\n  justify-content:center;\n  align-items:center;\n}\n\n.choice .vertical-text{\n  width:100%;\n  height:200px;\n  padding:8px;\n  font-size:20px;\n  line-height:1.65;\n  color:#4a3428;\n}\n\n.choice:hover{\n  transform:translateY(-2px);\n}\n\n.choice.correct{\n  background:#d9f99d;\n  border-color:#84cc16;\n  box-shadow:0 5px 0 #65a30d;\n}\n\n.choice.wrong{\n  background:#fecaca;\n  border-color:#ef4444;\n  box-shadow:0 5px 0 #dc2626;\n}\n\n.hint-btn{\n  margin-top:18px;\n  padding:10px 18px;\n  border-radius:16px;\n  border:3px solid #ffbf5a;\n  background:#fff3c4;\n  color:#7a5734;\n  font-size:17px;\n  font-weight:bold;\n  cursor:pointer;\n}\n\n.hint-box{\n  display:none;\n  margin-top:14px;\n  padding:16px;\n  background:#fffdf7;\n  border:3px solid #ffd36e;\n  border-radius:18px;\n  text-align:left;\n  line-height:1.7;\n}\n\n.hint-box.show{\n  display:block;\n}\n\n.result{\n  margin-top:18px;\n  min-height:36px;\n  font-size:26px;\n  font-weight:bold;\n}\n\n.restart{\n  margin-top:18px;\n  padding:13px 28px;\n  border:none;\n  border-radius:18px;\n  background:#ffb84d;\n  color:#fff;\n  font-size:22px;\n  font-weight:bold;\n  box-shadow:0 5px 0 #d98b16;\n  cursor:pointer;\n}\n\n.correct-overlay{\n  position:absolute;\n  inset:0;\n  z-index:20;\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  flex-direction:column;\n  background:rgba(255,248,232,.9);\n  color:#ff7a3d;\n  font-weight:bold;\n  animation:overlayPop .45s ease;\n}\n\n.correct-mark{\n  font-size:84px;\n  line-height:1;\n}\n\n.correct-text{\n  margin-top:8px;\n  font-size:52px;\n}\n\n@keyframes overlayPop{\n  0%{transform:scale(.75);opacity:0;}\n  70%{transform:scale(1.06);opacity:1;}\n  100%{transform:scale(1);opacity:1;}\n}\n\n@media(max-width:700px){\n  .choices{\n    grid-template-columns:repeat(2,1fr);\n  }\n}\n\n@media(max-width:520px){\n  .koji-game{\n    padding:16px;\n  }\n\n  .koji-game h2{\n    font-size:26px;\n  }\n\n  .vertical-text{\n    width:260px;\n    height:240px;\n    font-size:28px;\n  }\n\n  .choice{\n    min-height:210px;\n  }\n\n  .choice .vertical-text{\n    height:180px;\n    font-size:18px;\n  }\n\n  .correct-mark{\n    font-size:70px;\n  }\n\n  .correct-text{\n    font-size:42px;\n  }\n}\n<\/style>\n\n<script data-wp-block-html=\"js\">\ndocument.addEventListener(\"DOMContentLoaded\",()=>{\n\n\n  const DATA=[\n    {\n      term:\"\u77db\u76fe\",\n      yomi:\"\u3080\u3058\u3085\u3093\",\n      meaning:\"\u3064\u3058\u3064\u307e\u304c\u5408\u308f\u306a\u3044\u3053\u3068\u3002\",\n      origin:\"\u3069\u3093\u306a\u76fe\u3082\u7a81\u304d\u901a\u3059\u77db\u3068\u3001\u3069\u3093\u306a\u77db\u3082\u9632\u3050\u76fe\u3092\u540c\u6642\u306b\u58f2\u3063\u3066\u3044\u305f\u5546\u4eba\u306e\u8a71\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u5b8c\u74a7\",\n      yomi:\"\u304b\u3093\u307a\u304d\",\n      meaning:\"\u50b7\u304c\u306a\u304f\u3001\u5b8c\u5168\u3067\u3042\u308b\u3053\u3068\u3002\",\n      origin:\"\u50b7\u306e\u306a\u3044\u7389\u3092\u3001\u7121\u4e8b\u306b\u6301\u3061\u5e30\u3063\u305f\u3068\u3044\u3046\u4e2d\u56fd\u306e\u6545\u4e8b\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u767b\u7adc\u9580\",\n      yomi:\"\u3068\u3046\u308a\u3085\u3046\u3082\u3093\",\n      meaning:\"\u51fa\u4e16\u3084\u6210\u529f\u306e\u305f\u3081\u306e\u95a2\u9580\u3002\",\n      origin:\"\u7adc\u9580\u3068\u3044\u3046\u6025\u6d41\u3092\u767b\u308a\u304d\u3063\u305f\u9b5a\u306f\u7adc\u306b\u306a\u308b\u3001\u3068\u3044\u3046\u4f1d\u8aac\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u4e94\u5341\u6b69\u767e\u6b69\",\n      yomi:\"\u3054\u3058\u3063\u307d\u3072\u3083\u3063\u307d\",\n      meaning:\"\u5c11\u3057\u306e\u9055\u3044\u306f\u3042\u3063\u3066\u3082\u3001\u672c\u8cea\u7684\u306b\u306f\u540c\u3058\u3053\u3068\u3002\",\n      origin:\"\u4e94\u5341\u6b69\u9003\u3052\u305f\u8005\u304c\u3001\u767e\u6b69\u9003\u3052\u305f\u8005\u3092\u7b11\u3063\u305f\u3068\u3044\u3046\u8a71\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u6f01\u592b\u306e\u5229\",\n      yomi:\"\u304e\u3087\u3075\u306e\u308a\",\n      meaning:\"\u4e89\u3063\u3066\u3044\u308b\u8005\u305f\u3061\u306e\u3059\u304d\u306b\u3001\u7b2c\u4e09\u8005\u304c\u5229\u76ca\u3092\u5f97\u308b\u3053\u3068\u3002\",\n      origin:\"\u30b7\u30ae\u3068\u30cf\u30de\u30b0\u30ea\u304c\u4e89\u3063\u3066\u3044\u308b\u9593\u306b\u3001\u6f01\u5e2b\u304c\u4e21\u65b9\u3092\u6355\u307e\u3048\u305f\u8a71\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u671d\u4e09\u66ae\u56db\",\n      yomi:\"\u3061\u3087\u3046\u3055\u3093\u307c\u3057\",\n      meaning:\"\u76ee\u5148\u306e\u9055\u3044\u306b\u6c17\u3092\u53d6\u3089\u308c\u3001\u7d50\u679c\u304c\u540c\u3058\u3053\u3068\u306b\u6c17\u3065\u304b\u306a\u3044\u3053\u3068\u3002\",\n      origin:\"\u30b5\u30eb\u306b\u671d\u4e09\u3064\u5915\u65b9\u56db\u3064\u306e\u3048\u3055\u3092\u3084\u308b\u3068\u8a00\u3046\u3068\u6012\u308a\u3001\u671d\u56db\u3064\u5915\u65b9\u4e09\u3064\u306b\u3059\u308b\u3068\u559c\u3093\u3060\u8a71\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u753b\u7adc\u70b9\u775b\",\n      yomi:\"\u304c\u308a\u3087\u3046\u3066\u3093\u305b\u3044\",\n      meaning:\"\u6700\u5f8c\u306b\u5927\u5207\u306a\u4ed5\u4e0a\u3052\u3092\u3059\u308b\u3053\u3068\u3002\",\n      origin:\"\u58c1\u306b\u63cf\u3044\u305f\u7adc\u306b\u6700\u5f8c\u306b\u77b3\u3092\u5165\u308c\u305f\u3089\u3001\u7adc\u304c\u7a7a\u3078\u98db\u3073\u53bb\u3063\u305f\u3068\u3044\u3046\u8a71\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u63a8\u6572\",\n      yomi:\"\u3059\u3044\u3053\u3046\",\n      meaning:\"\u6587\u7ae0\u3084\u8a69\u3092\u4f55\u5ea6\u3082\u8003\u3048\u3066\u7df4\u308a\u76f4\u3059\u3053\u3068\u3002\",\n      origin:\"\u8a69\u306e\u8a00\u8449\u3092\u300e\u63a8\u3059\u300f\u306b\u3059\u308b\u304b\u300e\u6572\u304f\u300f\u306b\u3059\u308b\u304b\u8ff7\u3063\u305f\u3068\u3044\u3046\u6545\u4e8b\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u86c7\u8db3\",\n      yomi:\"\u3060\u305d\u304f\",\n      meaning:\"\u4f59\u8a08\u306a\u3082\u306e\u3002\u306a\u304f\u3066\u3082\u3088\u3044\u3082\u306e\u3002\",\n      origin:\"\u30d8\u30d3\u306e\u7d75\u3092\u65e9\u304f\u63cf\u304f\u7af6\u4e89\u3067\u3001\u4f59\u8a08\u306a\u8db3\u3092\u63cf\u304d\u8db3\u3057\u3066\u8ca0\u3051\u305f\u8a71\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u864e\u306e\u5a01\u3092\u501f\u308b\u72d0\",\n      yomi:\"\u3068\u3089\u306e\u3044\u3092\u304b\u308b\u304d\u3064\u306d\",\n      meaning:\"\u4ed6\u4eba\u306e\u529b\u3092\u501f\u308a\u3066\u3044\u3070\u308b\u3053\u3068\u3002\",\n      origin:\"\u30ad\u30c4\u30cd\u304c\u30c8\u30e9\u306e\u529b\u3092\u5229\u7528\u3057\u3066\u3001\u307b\u304b\u306e\u52d5\u7269\u3092\u304a\u3069\u3057\u305f\u3068\u3044\u3046\u8a71\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u80cc\u6c34\u306e\u9663\",\n      yomi:\"\u306f\u3044\u3059\u3044\u306e\u3058\u3093\",\n      meaning:\"\u4e00\u6b69\u3082\u9000\u3051\u306a\u3044\u72b6\u614b\u3067\u3001\u5168\u529b\u3067\u53d6\u308a\u7d44\u3080\u3053\u3068\u3002\",\n      origin:\"\u5ddd\u3092\u80cc\u306b\u3057\u3066\u9663\u3092\u3057\u304d\u3001\u9003\u3052\u3089\u308c\u306a\u3044\u72b6\u6cc1\u3067\u6226\u3063\u305f\u3053\u3068\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u5727\u5dfb\",\n      yomi:\"\u3042\u3063\u304b\u3093\",\n      meaning:\"\u307b\u304b\u3068\u6bd4\u3079\u3066\u3001\u7279\u306b\u3059\u3050\u308c\u3066\u3044\u308b\u3053\u3068\u3002\",\n      origin:\"\u6614\u306e\u8a66\u9a13\u3067\u3001\u6700\u3082\u3059\u3050\u308c\u305f\u7b54\u6848\u3092\u4e00\u756a\u4e0a\u306b\u7f6e\u3044\u305f\u3053\u3068\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u6012\u9aea\u5929\u3092\u3064\u304f\",\n      yomi:\"\u3069\u306f\u3064\u3066\u3093\u3092\u3064\u304f\",\n      meaning:\"\u305f\u3044\u3078\u3093\u6012\u3063\u3066\u3044\u308b\u3053\u3068\u3002\",\n      origin:\"\u6fc0\u3057\u3044\u6012\u308a\u3067\u9aea\u306e\u6bdb\u304c\u9006\u7acb\u3061\u3001\u5929\u3092\u3064\u304f\u307b\u3069\u3060\u3063\u305f\u3068\u3044\u3046\u8868\u73fe\u304c\u7531\u6765\u3002\"\n    },\n    {\n      term:\"\u65ad\u8178\",\n      yomi:\"\u3060\u3093\u3061\u3087\u3046\",\n      meaning:\"\u305f\u3044\u3078\u3093\u60b2\u3057\u3044\u3053\u3068\u3002\",\n      origin:\"\u5b50\u3092\u5931\u3063\u305f\u89aa\u30b6\u30eb\u304c\u3001\u60b2\u3057\u307f\u306e\u3042\u307e\u308a\u8178\u304c\u5207\u308c\u305f\u3068\u3044\u3046\u8a71\u304c\u7531\u6765\u3002\"\n    }\n  ];\n\n  const app=document.getElementById(\"koji-game\");\n  if(!app)return;\n\n  app.innerHTML=`\n    <div class=\"koji-game\">\n      <h2>\u6545\u4e8b\u6210\u8a9e\u535a\u58eb<\/h2>\n\n      <div class=\"mode-box\">\n        <button class=\"mode-btn active\" data-mode=\"termToMeaning\">\u6545\u4e8b\u6210\u8a9e \u2192 \u610f\u5473<\/button>\n        <button class=\"mode-btn\" data-mode=\"meaningToTerm\">\u610f\u5473 \u2192 \u6545\u4e8b\u6210\u8a9e<\/button>\n      <\/div>\n\n      <div class=\"score\" id=\"score\"><\/div>\n\n      <div class=\"question-card\">\n        <div class=\"question-label\" id=\"questionLabel\"><\/div>\n        <div class=\"vertical-text\" id=\"questionMain\"><\/div>\n        <div class=\"question-yomi\" id=\"questionYomi\"><\/div>\n      <\/div>\n\n      <div class=\"choices\" id=\"choices\"><\/div>\n\n      <button class=\"hint-btn\" id=\"hintBtn\">\ud83d\udca1 \u30d2\u30f3\u30c8\u3092\u898b\u308b<\/button>\n      <div class=\"hint-box\" id=\"hintBox\"><\/div>\n\n      <div class=\"result\" id=\"result\"><\/div>\n    <\/div>\n  `;\n\n  const gameBox=document.querySelector(\".koji-game\");\n  const modeBtns=document.querySelectorAll(\".mode-btn\");\n  const score=document.getElementById(\"score\");\n  const questionLabel=document.getElementById(\"questionLabel\");\n  const questionMain=document.getElementById(\"questionMain\");\n  const questionYomi=document.getElementById(\"questionYomi\");\n  const choices=document.getElementById(\"choices\");\n  const hintBtn=document.getElementById(\"hintBtn\");\n  const hintBox=document.getElementById(\"hintBox\");\n  const result=document.getElementById(\"result\");\n\n  let mode=\"termToMeaning\";\n  let list=[];\n  let current=0;\n  let correct=0;\n  let currentItem=null;\n  const total=10;\n\n  modeBtns.forEach(btn=>{\n    btn.onclick=()=>{\n      modeBtns.forEach(b=>b.classList.remove(\"active\"));\n      btn.classList.add(\"active\");\n      mode=btn.dataset.mode;\n      start();\n    };\n  });\n\n  hintBtn.onclick=()=>{\n    hintBox.classList.toggle(\"show\");\n  };\n\n  function setVerticalText(el,text){\n    el.textContent=text;\n  }\n\n  function shuffle(arr){\n    const a=[...arr];\n    for(let i=a.length-1;i>0;i--){\n      const j=Math.floor(Math.random()*(i+1));\n      [a[i],a[j]]=[a[j],a[i]];\n    }\n    return a;\n  }\n\n  function start(){\n    list=shuffle(DATA).slice(0,total);\n    current=0;\n    correct=0;\n\n    hintBtn.style.display=\"inline-block\";\n    hintBox.style.display=\"\";\n    nextQuestion();\n  }\n\n  function nextQuestion(){\n    removeOverlay();\n    result.textContent=\"\";\n    hintBox.classList.remove(\"show\");\n\n    if(current>=total){\n      finish();\n      return;\n    }\n\n    currentItem=list[current];\n    score.textContent=`${current+1}\u3082\u3093\u3081 \/ ${total}\u3082\u3093`;\n\n    hintBox.innerHTML=`\n      <strong>\ud83d\udca1 \u7531\u6765<\/strong><br>\n      ${currentItem.origin}\n    `;\n\n    if(mode===\"termToMeaning\"){\n      questionLabel.textContent=\"\u3053\u306e\u6545\u4e8b\u6210\u8a9e\u306e\u610f\u5473\u306f\uff1f\";\n      setVerticalText(questionMain,currentItem.term);\n      questionYomi.textContent=`\uff08${currentItem.yomi}\uff09`;\n      renderChoices(\"meaning\");\n    }else{\n      questionLabel.textContent=\"\u3053\u306e\u610f\u5473\u306b\u5408\u3046\u6545\u4e8b\u6210\u8a9e\u306f\uff1f\";\n      setVerticalText(questionMain,currentItem.meaning);\n      questionYomi.textContent=\"\";\n      renderChoices(\"term\");\n    }\n  }\n\n  function renderChoices(type){\n    choices.innerHTML=\"\";\n\n    const correctValue=type===\"meaning\" ? currentItem.meaning : currentItem.term;\n\n    const wrongPool=DATA\n      .filter(item=>item.term!==currentItem.term)\n      .map(item=>type===\"meaning\" ? item.meaning : item.term);\n\n    const options=shuffle([\n      correctValue,\n      ...shuffle(wrongPool).slice(0,3)\n    ]);\n\n    options.forEach(option=>{\n      const btn=document.createElement(\"button\");\n      btn.className=\"choice\";\n\n      const inner=document.createElement(\"div\");\n      inner.className=\"vertical-text\";\n      inner.textContent=option;\n\n      btn.appendChild(inner);\n      btn.onclick=()=>judge(option,correctValue,btn);\n\n      choices.appendChild(btn);\n    });\n  }\n\n  function judge(answer,correctValue,btn){\n    const all=document.querySelectorAll(\".choice\");\n    all.forEach(b=>b.disabled=true);\n\n    if(answer===correctValue){\n      btn.classList.add(\"correct\");\n      correct++;\n      showOverlay(\"\u305b\u3044\u304b\u3044\uff01\");\n    }else{\n      btn.classList.add(\"wrong\");\n      result.textContent=\"\u3053\u305f\u3048\u3092\u78ba\u8a8d\u3057\u3088\u3046\";\n\n      all.forEach(b=>{\n        if(b.textContent===correctValue){\n          b.classList.add(\"correct\");\n        }\n      });\n    }\n\n    setTimeout(()=>{\n      current++;\n      nextQuestion();\n    },900);\n  }\n\n  function showOverlay(text){\n    removeOverlay();\n\n    const overlay=document.createElement(\"div\");\n    overlay.className=\"correct-overlay\";\n    overlay.innerHTML=`\n      <div class=\"correct-mark\">\ud83d\udcae<\/div>\n      <div class=\"correct-text\">${text}<\/div>\n    `;\n\n    gameBox.appendChild(overlay);\n  }\n\n  function removeOverlay(){\n    const old=document.querySelector(\".correct-overlay\");\n    if(old)old.remove();\n  }\n\n  function finish(){\n    score.textContent=\"\";\n    questionLabel.textContent=\"\u3051\u3063\u304b\";\n    questionMain.textContent=`${correct} \/ ${total}`;\n    questionYomi.textContent=\"\";\n\n    choices.innerHTML=`\n      <button class=\"restart\" id=\"restartBtn\">\u3082\u3046\u3044\u3061\u3069<\/button>\n    `;\n\n    hintBtn.style.display=\"none\";\n    hintBox.style.display=\"none\";\n\n    if(correct===total){\n      result.textContent=\"\u3059\u3054\u3044\uff01\u305c\u3093\u3076\u305b\u3044\u304b\u3044\uff01\";\n    }else if(correct>=7){\n      result.textContent=\"\u3088\u304f\u3067\u304d\u307e\u3057\u305f\uff01\";\n    }else{\n      result.textContent=\"\u3082\u3046\u3044\u3061\u3069 \u3084\u3063\u3066\u307f\u3088\u3046\uff01\";\n    }\n\n    document.getElementById(\"restartBtn\").onclick=start;\n  }\n\n  start();\n\n});\n<\/script>\n\n<div id=\"koji-game\"><\/div>\n\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-image is-resized\"><img decoding=\"async\" src=\"https:\/\/chicodori.net\/wp-content\/uploads\/2021\/06\/kodawari.png\" alt=\"\" style=\"width:197px;height:auto\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\ud83d\udcd6 <strong>\u5b66\u7fd2\u3057\u305f\u3044\u30e2\u30fc\u30c9\u3092\u9078\u3079\u308b<\/strong><br>\u300c\u6545\u4e8b\u6210\u8a9e\u2192\u610f\u5473\u300d\u3068\u300c\u610f\u5473\u2192\u6545\u4e8b\u6210\u8a9e\u300d\u306e2\u3064\u306e\u30e2\u30fc\u30c9\u304b\u3089\u3001\u81ea\u5206\u304c\u7df4\u7fd2\u3057\u305f\u3044\u5185\u5bb9\u3092\u9078\u3093\u3067\u53d6\u308a\u7d44\u3081\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\ud83d\udcd6 <strong>\u30c6\u30f3\u30dd\u3088\u304f\u904a\u3079\u308b<\/strong><br>\u6b63\u89e3\u3059\u308b\u3068\u81ea\u52d5\u3067\u6b21\u306e\u554f\u984c\u3078\u9032\u3080\u306e\u3067\u3001\u30b2\u30fc\u30e0\u611f\u899a\u3067\u3069\u3093\u3069\u3093\u6311\u6226\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\ud83d\udcd6 <strong>\u7531\u6765\u307e\u3067\u77e5\u3063\u3066\u899a\u3048\u3089\u308c\u308b<\/strong><br>\u30d2\u30f3\u30c8\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u6545\u4e8b\u6210\u8a9e\u306e\u7531\u6765\u3092\u78ba\u8a8d\u3067\u304d\u307e\u3059\u3002\u610f\u5473\u3060\u3051\u3067\u306a\u304f\u3001\u8a00\u8449\u304c\u751f\u307e\u308c\u305f\u80cc\u666f\u3082\u77e5\u308b\u3053\u3068\u3067\u3001\u3088\u308a\u6df1\u304f\u8a18\u61b6\u306b\u6b8b\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u25a0\u3053\u306e\u529b\u3001\u3069\u3093\u306a\u3068\u304d\u306b\u5f79\u7acb\u3064\uff1f<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u2728 <strong>\u56fd\u8a9e\u306e\u30c6\u30b9\u30c8\u3084\u8aad\u66f8\u3092\u3059\u308b\u3068\u304d<\/strong><br>\u6545\u4e8b\u6210\u8a9e\u306e\u610f\u5473\u304c\u308f\u304b\u308b\u3088\u3046\u306b\u306a\u308a\u3001\u6587\u7ae0\u306e\u5185\u5bb9\u3084\u7b46\u8005\u306e\u4f1d\u3048\u305f\u3044\u3053\u3068\u3092\u7406\u89e3\u3057\u3084\u3059\u304f\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2728 <strong>\u4f5c\u6587\u3084\u30b9\u30d4\u30fc\u30c1\u3092\u66f8\u304f\u3068\u304d<\/strong><br>\u6545\u4e8b\u6210\u8a9e\u3092\u4f7f\u3063\u3066\u3001\u81ea\u5206\u306e\u8003\u3048\u3084\u6c17\u6301\u3061\u3092\u3001\u77ed\u304f\u5370\u8c61\u7684\u306b\u8868\u73fe\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2728 <strong>\u4e2d\u5b66\u6821\u30fb\u9ad8\u6821\u306e\u56fd\u8a9e\u3092\u5b66\u3076\u3068\u304d<\/strong><br>\u6545\u4e8b\u6210\u8a9e\u306f\u5b9a\u671f\u30c6\u30b9\u30c8\u3084\u5165\u8a66\u3067\u3082\u3088\u304f\u51fa\u984c\u3055\u308c\u307e\u3059\u3002\u610f\u5473\u3060\u3051\u3067\u306a\u304f\u7531\u6765\u3082\u77e5\u308b\u3053\u3068\u3067\u3001\u5fd8\u308c\u306b\u304f\u3044\u77e5\u8b58\u3068\u3057\u3066\u8eab\u306b\u3064\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u4fdd\u8b77\u8005\u3001\u5148\u751f\u65b9\u3078<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u6545\u4e8b\u6210\u8a9e\u306f\u3001\u610f\u5473\u3060\u3051\u3092\u6697\u8a18\u3057\u3088\u3046\u3068\u3059\u308b\u3068\u5fd8\u308c\u3084\u3059\u304f\u3001\u300c\u96e3\u3057\u3044\u8a00\u8449\u300d\u3068\u611f\u3058\u3066\u3057\u307e\u3046\u5b50\u3069\u3082\u3082\u5c11\u306a\u304f\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u30b2\u30fc\u30e0\u3067\u306f\u3001**\u300c\u6545\u4e8b\u6210\u8a9e\u2192\u610f\u5473\u300d\u300c\u610f\u5473\u2192\u6545\u4e8b\u6210\u8a9e\u300d**\u306e\u4e21\u65b9\u304b\u3089\u7e70\u308a\u8fd4\u3057\u5b66\u7fd2\u3067\u304d\u308b\u3060\u3051\u3067\u306a\u304f\u3001<strong>\u30d2\u30f3\u30c8\u30dc\u30bf\u30f3\u3067\u7531\u6765\u3082\u78ba\u8a8d<\/strong>\u3067\u304d\u308b\u3088\u3046\u306b\u3057\u307e\u3057\u305f\u3002\u8a00\u8449\u304c\u751f\u307e\u308c\u305f\u80cc\u666f\u3092\u77e5\u308b\u3053\u3068\u3067\u3001\u300c\u306a\u308b\u307b\u3069\uff01\u300d\u3068\u3044\u3046\u7d0d\u5f97\u611f\u304c\u751f\u307e\u308c\u3001\u8a18\u61b6\u306b\u6b8b\u308a\u3084\u3059\u304f\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30b2\u30fc\u30e0\u611f\u899a\u3067\u4f55\u5ea6\u3082\u6311\u6226\u3057\u306a\u304c\u3089\u3001\u8a9e\u5f59\u529b\u30fb\u8aad\u89e3\u529b\u30fb\u8868\u73fe\u529b\u3092\u697d\u3057\u304f\u80b2\u3066\u3066\u3044\u305f\u3060\u3051\u308c\u3070\u5e78\u3044\u3067\u3059\u3002<\/p>\n\n\n\n<div style=\"height:422px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u6545\u4e8b\u6210\u8a9e\u3068\u610f\u5473\u3092\u30014\u629e\u30b2\u30fc\u30e0\u3067\u697d\u3057\u304f\u30de\u30b9\u30bf\u30fc\u3057\u3088\u3046\uff01 \u25a0\u3069\u3093\u306a\u30b2\u30fc\u30e0&#46;&#46;&#46;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[22,6],"tags":[46,129,292,377,1925],"class_list":["post-12236","post","type-post","status-publish","format-standard","hentry","category-22","category-6","tag-46","tag-129","tag-292","tag-377","tag-1925"],"_links":{"self":[{"href":"https:\/\/chicodori.net\/index.php?rest_route=\/wp\/v2\/posts\/12236","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/chicodori.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/chicodori.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/chicodori.net\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/chicodori.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=12236"}],"version-history":[{"count":2,"href":"https:\/\/chicodori.net\/index.php?rest_route=\/wp\/v2\/posts\/12236\/revisions"}],"predecessor-version":[{"id":12239,"href":"https:\/\/chicodori.net\/index.php?rest_route=\/wp\/v2\/posts\/12236\/revisions\/12239"}],"wp:attachment":[{"href":"https:\/\/chicodori.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=12236"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/chicodori.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=12236"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/chicodori.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=12236"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}