<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>＃英検５級 アーカイブ - じゅにさん子育てブログ</title>
	<atom:link href="https://jouniorsankosodate.com/tag/%EF%BC%83%E8%8B%B1%E6%A4%9C%EF%BC%95%E7%B4%9A/feed/" rel="self" type="application/rss+xml" />
	<link>https://jouniorsankosodate.com/tag/＃英検５級/</link>
	<description>受験のその先へ｜子どもたちのより良い未来を育てる</description>
	<lastBuildDate>Tue, 05 May 2026 07:49:29 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.0</generator>

<image>
	<url>https://jouniorsankosodate.com/wp-content/uploads/2026/02/cropped-44f1f7a5e508593f7c057572c07f45a3-32x32.jpg</url>
	<title>＃英検５級 アーカイブ - じゅにさん子育てブログ</title>
	<link>https://jouniorsankosodate.com/tag/＃英検５級/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>英検５級 フラッシュ英単語 No.12｜前置詞（音声対応）</title>
		<link>https://jouniorsankosodate.com/n5-no12/</link>
					<comments>https://jouniorsankosodate.com/n5-no12/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Sat, 02 May 2026 08:20:32 +0000</pubDate>
				<category><![CDATA[🟧英検５級 英語シリーズ]]></category>
		<category><![CDATA[＃フラッシュ]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[#英単語]]></category>
		<category><![CDATA[＃英検]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=5327</guid>

					<description><![CDATA[<p>英検５級 フラッシュ英単語 No.12｜前置詞（音声対応） 英検５級 フラッシュ英単語 No.12 前置詞 日本語からスタート 🔊 音声ON — — 英語⇆日本語 ▶ 読み上げ わかった 👍 わからん！あとで復習 📌 🔀 [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/n5-no12/">英検５級 フラッシュ英単語 No.12｜前置詞（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>英検５級 フラッシュ英単語 No.12｜前置詞（音声対応）</title>

<style>
:root{
  --bg:#f7f7fb; --card:#ffffff; --ink:#111827; --muted:#6b7280;
  --accent:#6366f1; --accent-weak:#e0e7ff;
  --good:#22c55e; --review:#f59e0b;
  --shadow:0 6px 24px rgba(0,0,0,.08);
}
body{margin:0;background:var(--bg);}
.wrap{max-width:760px;margin:0 auto;padding:16px 16px 28px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial;color:var(--ink);}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 16px;flex-wrap:wrap;}
h1{font-size:18px;margin:0;font-weight:700;}
.badge{font-size:11px;color:var(--accent);background:var(--accent-weak);padding:3px 8px;border-radius:999px;}
.switches{display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:13px;}
.switches input{accent-color:var(--accent);}
.card-outer{position:relative;perspective:1200px;margin:12px 0 8px;}
.card{position:relative;width:100%;min-height:190px;background:var(--card);border-radius:18px;box-shadow:var(--shadow);cursor:pointer;transform-style:preserve-3d;transition:transform .5s ease;}
.card.flipped{transform:rotateY(180deg);}
.face{position:absolute;inset:0;border-radius:18px;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;padding:24px;text-align:center;}
.frontText{font-size:30px;font-weight:800;}
.backText{font-size:24px;font-weight:700;}
.card-face-back{transform:rotateY(180deg);}
.controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0;}
.btn{appearance:none;border:1px solid #e5e7eb;background:#fff;padding:11px 12px;border-radius:13px;font-size:14px;font-weight:700;line-height:1.2;cursor:pointer;color:var(--ink);}
.btn:hover{background:#eef2ff;}
.btn:active{transform:translateY(1px);}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn.good{background:var(--good);color:#fff;border-color:var(--good);}
.btn.review{background:var(--review);color:#fff;border-color:var(--review);}
.meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;color:var(--muted);font-size:13px;}
.progress{height:8px;background:var(--accent-weak);border-radius:999px;overflow:hidden;flex:1;}
.bar{height:100%;width:0;background:var(--accent);transition:.25s;}
.index{min-width:90px;text-align:right;}
.hint{margin-top:8px;color:var(--muted);font-size:12px;}
.result-box{display:none;background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:24px;text-align:center;margin-top:16px;}
.result-box h2{margin:0 0 10px;font-size:22px;}
.result-box p{color:#475569;font-weight:700;}
.series-nav-wrap{margin:32px 0 12px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}
.series-nav-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:700;border-radius:999px;padding:10px 18px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.08);transition:.2s;font-size:14px;}
.series-nav-btn.nav-back{color:#6366f1;border:2px solid #c7d2fe;}
.series-nav-btn.next{color:#4338ca;border:2px solid #c7d2fe;background:linear-gradient(135deg,#eef2ff,#e0e7ff);}
.series-nav-btn:hover{transform:translateY(-2px);}
@media (min-width:560px){.frontText{font-size:36px}.backText{font-size:26px}.card{min-height:220px}}
@media(max-width:480px){.controls{grid-template-columns:1fr}.series-nav-btn{width:100%;font-size:15px;padding:12px 18px}}
</style>
</head>

<body>
<div class="wrap" id="app" aria-live="polite">

<header>
  <h1>英検５級 フラッシュ英単語 <span class="badge">No.12 前置詞</span></h1>
  <div class="switches">
    <label><input type="checkbox" id="jpFirst"> 日本語からスタート</label>
    <label><input type="checkbox" id="speakOn"> 🔊 音声ON</label>
  </div>
</header>

<div id="studyArea">
  <div class="card-outer" aria-label="フラッシュカード" role="button" tabindex="0">
    <div class="card" id="card">
      <div class="face card-face-front"><div class="frontText" id="frontText">—</div></div>
      <div class="face card-face-back"><div class="backText" id="backText">—</div></div>
    </div>
  </div>

  <div class="controls">
    <button class="btn primary" id="flipBtn">英語⇆日本語</button>
    <button class="btn" id="speakBtn">▶ 読み上げ</button>
    <button class="btn good" id="knownBtn">わかった 👍</button>
    <button class="btn review" id="wrongBtn">わからん！あとで復習 📌</button>
    <button class="btn" id="shuffleBtn">🔀 シャッフル</button>
    <button class="btn" id="resetBtn">↩︎ はじめから</button>
  </div>

  <div class="meta">
    <div class="progress"><div class="bar" id="bar"></div></div>
    <div class="index"><span id="pos">1</span>/<span id="total">—</span></div>
  </div>

  <p class="hint">カードをタップして答えを確認。わかったら「わかった」、不安なら「あとで復習」を押してね。</p>
</div>

<div class="result-box" id="resultBox">
  <h2 id="resultTitle">おつかれさま！✨</h2>
  <p id="resultText"></p>
  <div class="controls">
    <button class="btn review" id="reviewBtn">復習する 🔁</button>
    <button class="btn" id="againBtn">もう一回やる</button>
  </div>
</div>

<div class="series-nav-wrap">
  <a href="https://jouniorsankosodate.com/eiken5-no11/" class="series-nav-btn nav-back">← 前のレッスンへ</a>
  <a href="https://jouniorsankosodate.com/category/learn/english-flash/" class="series-nav-btn nav-back">英単語フラッシュのカテゴリ一覧に戻る</a>
</div>

</div>

<script>
const ITEMS = [
  { word: "in", jp: "中に" },
  { word: "on", jp: "上に" },
  { word: "under", jp: "下に" },
  { word: "near", jp: "近くに" },
  { word: "by", jp: "そばに" },
  { word: "between", jp: "間に" },
  { word: "behind", jp: "後ろに" },
  { word: "in front of", jp: "前に" },
  { word: "to", jp: "〜へ" },
  { word: "from", jp: "〜から" },
  { word: "with", jp: "〜と一緒に／〜を使って" },
  { word: "for", jp: "〜のために" },
  { word: "at", jp: "〜で（場所・時）" },
  { word: "about", jp: "〜について" }
];

let _voice = null;

function pickVoice(){
  const voices = speechSynthesis.getVoices() || [];
  const femaleNames = ["Sonia","Serena","Susan","Kate","Libby","Maisie","Google UK English Female","Microsoft Sonia","Microsoft Libby","Microsoft Susan"];

  return voices.find(v => v.lang === "en-GB" && femaleNames.some(name => v.name.includes(name)))
  || voices.find(v => v.lang === "en-GB")
  || voices.find(v => (v.lang || "").startsWith("en"))
  || null;
}

(() => {
  const card = document.getElementById("card");
  const frontText = document.getElementById("frontText");
  const backText = document.getElementById("backText");
  const posEl = document.getElementById("pos");
  const totalEl = document.getElementById("total");
  const bar = document.getElementById("bar");
  const jpFirst = document.getElementById("jpFirst");
  const speakOnChk = document.getElementById("speakOn");
  const flipBtn = document.getElementById("flipBtn");
  const speakBtn = document.getElementById("speakBtn");
  const knownBtn = document.getElementById("knownBtn");
  const wrongBtn = document.getElementById("wrongBtn");
  const shuffleBtn = document.getElementById("shuffleBtn");
  const resetBtn = document.getElementById("resetBtn");
  const studyArea = document.getElementById("studyArea");
  const resultBox = document.getElementById("resultBox");
  const resultTitle = document.getElementById("resultTitle");
  const resultText = document.getElementById("resultText");
  const reviewBtn = document.getElementById("reviewBtn");
  const againBtn = document.getElementById("againBtn");

  let order = [...Array(ITEMS.length).keys()];
  let idx = 0;
  let isFlipped = false;
  let showJpFirst = false;
  let speakOn = false;
  let reviewList = [];

  totalEl.textContent = order.length;

  speechSynthesis.addEventListener("voiceschanged", () => {_voice = pickVoice();});

  function speak(text){
    try{
      if(!("speechSynthesis" in window)) return;
      if(!_voice) _voice = pickVoice();

      const u = new SpeechSynthesisUtterance(text.trim());
      if(_voice){
        u.voice = _voice;
        u.lang = _voice.lang || "en-GB";
      }else{
        u.lang = "en-GB";
      }

      u.rate = 0.9;
      u.pitch = 1.05;
      speechSynthesis.cancel();
      speechSynthesis.speak(u);
    }catch(e){}
  }

  function currentItem(){return ITEMS[order[idx]];}

  function render(){
    const it = currentItem();
    card.classList.remove("flipped");
    isFlipped = false;

    frontText.textContent = showJpFirst ? it.jp : it.word;
    backText.textContent = showJpFirst ? it.word : it.jp;

    posEl.textContent = idx + 1;
    totalEl.textContent = order.length;
    bar.style.width = `${((idx + 1) / order.length) * 100}%`;

    if(speakOn){speak(it.word);}
  }

  function flip(){
    isFlipped = !isFlipped;
    card.classList.toggle("flipped", isFlipped);
  }

  function nextCard(){
    if(idx >= order.length - 1){
      showResult();
      return;
    }
    idx++;
    render();
  }

  function showResult(){
    studyArea.style.display = "none";
    resultBox.style.display = "block";

    if(reviewList.length === 0){
      resultTitle.textContent = "ぜんぶできた！すごい！！🎉";
      resultText.textContent = "あとで復習する単語は 0こ です。";
      reviewBtn.style.display = "none";
    }else{
      resultTitle.textContent = "おつかれさま！✨";
      resultText.textContent = `あとで復習する単語は ${reviewList.length}こ あるよ。`;
      reviewBtn.style.display = "inline-block";
    }
  }

  function startStudy(newOrder){
    order = [...newOrder];
    idx = 0;
    studyArea.style.display = "block";
    resultBox.style.display = "none";
    render();
  }

  function resetAll(){
    reviewList = [];
    startStudy([...Array(ITEMS.length).keys()]);
  }

  function shuffleOrder(){
    for(let i = order.length - 1; i > 0; i--){
      const j = Math.floor(Math.random() * (i + 1));
      [order[i], order[j]] = [order[j], order[i]];
    }
    idx = 0;
    render();
  }

  card.addEventListener("click", flip);
  flipBtn.addEventListener("click", flip);
  speakBtn.addEventListener("click", () => speak(currentItem().word));
  knownBtn.addEventListener("click", nextCard);

  wrongBtn.addEventListener("click", () => {
    const currentIndex = order[idx];
    if(!reviewList.includes(currentIndex)){reviewList.push(currentIndex);}
    nextCard();
  });

  reviewBtn.addEventListener("click", () => {
    if(reviewList.length === 0) return;
    const list = [...reviewList];
    reviewList = [];
    startStudy(list);
  });

  againBtn.addEventListener("click", resetAll);
  shuffleBtn.addEventListener("click", shuffleOrder);
  resetBtn.addEventListener("click", resetAll);

  jpFirst.addEventListener("change", e => {
    showJpFirst = e.target.checked;
    render();
  });

  speakOnChk.addEventListener("change", e => {
    speakOn = e.target.checked;
    if(speakOn) speak(currentItem().word);
  });

  window.addEventListener("keydown", e => {
    if(e.key === " "){
      e.preventDefault();
      flip();
    }
  });

  render();
})();
</script>
</body>
</html>
<p>投稿 <a href="https://jouniorsankosodate.com/n5-no12/">英検５級 フラッシュ英単語 No.12｜前置詞（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/n5-no12/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>英検５級 フラッシュ英単語 No.11｜職業（音声対応）</title>
		<link>https://jouniorsankosodate.com/eiken5-no11/</link>
					<comments>https://jouniorsankosodate.com/eiken5-no11/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Sat, 02 May 2026 08:19:03 +0000</pubDate>
				<category><![CDATA[🟧英検５級 英語シリーズ]]></category>
		<category><![CDATA[＃フラッシュ]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[#英単語]]></category>
		<category><![CDATA[＃英検]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=5324</guid>

					<description><![CDATA[<p>英検５級 フラッシュ英単語 No.11｜職業・人を表すことば（音声対応） 英検５級 フラッシュ英単語 No.11 職業・人を表すことば 日本語からスタート 🔊 音声ON — — 英語⇆日本語 ▶ 読み上げ わかった 👍  [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no11/">英検５級 フラッシュ英単語 No.11｜職業（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>英検５級 フラッシュ英単語 No.11｜職業・人を表すことば（音声対応）</title>

<style>
:root{
  --bg:#f7f7fb; --card:#ffffff; --ink:#111827; --muted:#6b7280;
  --accent:#ec4899; --accent-weak:#fce7f3;
  --good:#22c55e; --review:#f59e0b;
  --shadow:0 6px 24px rgba(0,0,0,.08);
}
body{margin:0;background:var(--bg);}
.wrap{max-width:760px;margin:0 auto;padding:16px 16px 28px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial;color:var(--ink);}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 16px;flex-wrap:wrap;}
h1{font-size:18px;margin:0;font-weight:700;}
.badge{font-size:11px;color:var(--accent);background:var(--accent-weak);padding:3px 8px;border-radius:999px;}
.switches{display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:13px;}
.switches input{accent-color:var(--accent);}
.card-outer{position:relative;perspective:1200px;margin:12px 0 8px;}
.card{position:relative;width:100%;min-height:190px;background:var(--card);border-radius:18px;box-shadow:var(--shadow);cursor:pointer;transform-style:preserve-3d;transition:transform .5s ease;}
.card.flipped{transform:rotateY(180deg);}
.face{position:absolute;inset:0;border-radius:18px;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;padding:24px;text-align:center;}
.frontText{font-size:30px;font-weight:800;}
.backText{font-size:24px;font-weight:700;}
.card-face-back{transform:rotateY(180deg);}
.controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0;}
.btn{appearance:none;border:1px solid #e5e7eb;background:#fff;padding:11px 12px;border-radius:13px;font-size:14px;font-weight:700;line-height:1.2;cursor:pointer;color:var(--ink);}
.btn:hover{background:#fdf2f8;}
.btn:active{transform:translateY(1px);}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn.good{background:var(--good);color:#fff;border-color:var(--good);}
.btn.review{background:var(--review);color:#fff;border-color:var(--review);}
.meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;color:var(--muted);font-size:13px;}
.progress{height:8px;background:var(--accent-weak);border-radius:999px;overflow:hidden;flex:1;}
.bar{height:100%;width:0;background:var(--accent);transition:.25s;}
.index{min-width:90px;text-align:right;}
.hint{margin-top:8px;color:var(--muted);font-size:12px;}
.result-box{display:none;background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:24px;text-align:center;margin-top:16px;}
.result-box h2{margin:0 0 10px;font-size:22px;}
.result-box p{color:#475569;font-weight:700;}
.series-nav-wrap{margin:32px 0 12px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}
.series-nav-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:700;border-radius:999px;padding:10px 18px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.08);transition:.2s;font-size:14px;}
.series-nav-btn.nav-back{color:#ec4899;border:2px solid #fbcfe8;}
.series-nav-btn.next{color:#be185d;border:2px solid #fbcfe8;background:linear-gradient(135deg,#fdf2f8,#fce7f3);}
.series-nav-btn:hover{transform:translateY(-2px);}
@media (min-width:560px){.frontText{font-size:36px}.backText{font-size:26px}.card{min-height:220px}}
@media(max-width:480px){.controls{grid-template-columns:1fr}.series-nav-btn{width:100%;font-size:15px;padding:12px 18px}}
</style>
</head>

<body>
<div class="wrap" id="app" aria-live="polite">

<header>
  <h1>英検５級 フラッシュ英単語 <span class="badge">No.11 職業・人を表すことば</span></h1>
  <div class="switches">
    <label><input type="checkbox" id="jpFirst"> 日本語からスタート</label>
    <label><input type="checkbox" id="speakOn"> 🔊 音声ON</label>
  </div>
</header>

<div id="studyArea">
  <div class="card-outer" aria-label="フラッシュカード" role="button" tabindex="0">
    <div class="card" id="card">
      <div class="face card-face-front"><div class="frontText" id="frontText">—</div></div>
      <div class="face card-face-back"><div class="backText" id="backText">—</div></div>
    </div>
  </div>

  <div class="controls">
    <button class="btn primary" id="flipBtn">英語⇆日本語</button>
    <button class="btn" id="speakBtn">▶ 読み上げ</button>
    <button class="btn good" id="knownBtn">わかった 👍</button>
    <button class="btn review" id="wrongBtn">わからん！あとで復習 📌</button>
    <button class="btn" id="shuffleBtn">🔀 シャッフル</button>
    <button class="btn" id="resetBtn">↩︎ はじめから</button>
  </div>

  <div class="meta">
    <div class="progress"><div class="bar" id="bar"></div></div>
    <div class="index"><span id="pos">1</span>/<span id="total">—</span></div>
  </div>

  <p class="hint">カードをタップして答えを確認。わかったら「わかった」、不安なら「あとで復習」を押してね。</p>
</div>

<div class="result-box" id="resultBox">
  <h2 id="resultTitle">おつかれさま！✨</h2>
  <p id="resultText"></p>
  <div class="controls">
    <button class="btn review" id="reviewBtn">復習する 🔁</button>
    <button class="btn" id="againBtn">もう一回やる</button>
  </div>
</div>

<div class="series-nav-wrap">
  <a href="https://jouniorsankosodate.com/eiken5-no10/" class="series-nav-btn nav-back">← 前のレッスンへ</a>
  <a href="https://jouniorsankosodate.com/category/learn/english-flash/" class="series-nav-btn nav-back">英単語フラッシュのカテゴリ一覧に戻る</a>
  <a href="https://jouniorsankosodate.com/eiken5-no12/" class="series-nav-btn next">次のレッスンへ →</a>
</div>

</div>

<script>
const ITEMS = [
  { word: "teacher", jp: "先生" },
  { word: "doctor", jp: "医者" },
  { word: "nurse", jp: "看護師" },
  { word: "police officer", jp: "警察官" },
  { word: "firefighter", jp: "消防士" },
  { word: "cook", jp: "料理人" },
  { word: "driver", jp: "運転手" },
  { word: "farmer", jp: "農家" },
  { word: "shop clerk", jp: "店員" },
  { word: "student", jp: "生徒／学生" }
];

let _voice = null;

function pickVoice(){
  const voices = speechSynthesis.getVoices() || [];
  const femaleNames = ["Sonia","Serena","Susan","Kate","Libby","Maisie","Google UK English Female","Microsoft Sonia","Microsoft Libby","Microsoft Susan"];

  return voices.find(v => v.lang === "en-GB" && femaleNames.some(name => v.name.includes(name)))
  || voices.find(v => v.lang === "en-GB")
  || voices.find(v => (v.lang || "").startsWith("en"))
  || null;
}

(() => {
  const card = document.getElementById("card");
  const frontText = document.getElementById("frontText");
  const backText = document.getElementById("backText");
  const posEl = document.getElementById("pos");
  const totalEl = document.getElementById("total");
  const bar = document.getElementById("bar");
  const jpFirst = document.getElementById("jpFirst");
  const speakOnChk = document.getElementById("speakOn");
  const flipBtn = document.getElementById("flipBtn");
  const speakBtn = document.getElementById("speakBtn");
  const knownBtn = document.getElementById("knownBtn");
  const wrongBtn = document.getElementById("wrongBtn");
  const shuffleBtn = document.getElementById("shuffleBtn");
  const resetBtn = document.getElementById("resetBtn");
  const studyArea = document.getElementById("studyArea");
  const resultBox = document.getElementById("resultBox");
  const resultTitle = document.getElementById("resultTitle");
  const resultText = document.getElementById("resultText");
  const reviewBtn = document.getElementById("reviewBtn");
  const againBtn = document.getElementById("againBtn");

  let order = [...Array(ITEMS.length).keys()];
  let idx = 0;
  let isFlipped = false;
  let showJpFirst = false;
  let speakOn = false;
  let reviewList = [];

  totalEl.textContent = order.length;

  speechSynthesis.addEventListener("voiceschanged", () => {_voice = pickVoice();});

  function speak(text){
    try{
      if(!("speechSynthesis" in window)) return;
      if(!_voice) _voice = pickVoice();

      const u = new SpeechSynthesisUtterance(text.trim());
      if(_voice){
        u.voice = _voice;
        u.lang = _voice.lang || "en-GB";
      }else{
        u.lang = "en-GB";
      }

      u.rate = 0.9;
      u.pitch = 1.05;
      speechSynthesis.cancel();
      speechSynthesis.speak(u);
    }catch(e){}
  }

  function currentItem(){return ITEMS[order[idx]];}

  function render(){
    const it = currentItem();
    card.classList.remove("flipped");
    isFlipped = false;

    frontText.textContent = showJpFirst ? it.jp : it.word;
    backText.textContent = showJpFirst ? it.word : it.jp;

    posEl.textContent = idx + 1;
    totalEl.textContent = order.length;
    bar.style.width = `${((idx + 1) / order.length) * 100}%`;

    if(speakOn){speak(it.word);}
  }

  function flip(){
    isFlipped = !isFlipped;
    card.classList.toggle("flipped", isFlipped);
  }

  function nextCard(){
    if(idx >= order.length - 1){
      showResult();
      return;
    }
    idx++;
    render();
  }

  function showResult(){
    studyArea.style.display = "none";
    resultBox.style.display = "block";

    if(reviewList.length === 0){
      resultTitle.textContent = "ぜんぶできた！すごい！！🎉";
      resultText.textContent = "あとで復習する単語は 0こ です。";
      reviewBtn.style.display = "none";
    }else{
      resultTitle.textContent = "おつかれさま！✨";
      resultText.textContent = `あとで復習する単語は ${reviewList.length}こ あるよ。`;
      reviewBtn.style.display = "inline-block";
    }
  }

  function startStudy(newOrder){
    order = [...newOrder];
    idx = 0;
    studyArea.style.display = "block";
    resultBox.style.display = "none";
    render();
  }

  function resetAll(){
    reviewList = [];
    startStudy([...Array(ITEMS.length).keys()]);
  }

  function shuffleOrder(){
    for(let i = order.length - 1; i > 0; i--){
      const j = Math.floor(Math.random() * (i + 1));
      [order[i], order[j]] = [order[j], order[i]];
    }
    idx = 0;
    render();
  }

  card.addEventListener("click", flip);
  flipBtn.addEventListener("click", flip);
  speakBtn.addEventListener("click", () => speak(currentItem().word));
  knownBtn.addEventListener("click", nextCard);

  wrongBtn.addEventListener("click", () => {
    const currentIndex = order[idx];
    if(!reviewList.includes(currentIndex)){reviewList.push(currentIndex);}
    nextCard();
  });

  reviewBtn.addEventListener("click", () => {
    if(reviewList.length === 0) return;
    const list = [...reviewList];
    reviewList = [];
    startStudy(list);
  });

  againBtn.addEventListener("click", resetAll);
  shuffleBtn.addEventListener("click", shuffleOrder);
  resetBtn.addEventListener("click", resetAll);

  jpFirst.addEventListener("change", e => {
    showJpFirst = e.target.checked;
    render();
  });

  speakOnChk.addEventListener("change", e => {
    speakOn = e.target.checked;
    if(speakOn) speak(currentItem().word);
  });

  window.addEventListener("keydown", e => {
    if(e.key === " "){
      e.preventDefault();
      flip();
    }
  });

  render();
})();
</script>
</body>
</html>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no11/">英検５級 フラッシュ英単語 No.11｜職業（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/eiken5-no11/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>英検５級 フラッシュ英単語 No.10｜場所・建物（音声対応）</title>
		<link>https://jouniorsankosodate.com/eiken5-no10/</link>
					<comments>https://jouniorsankosodate.com/eiken5-no10/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Sat, 02 May 2026 08:17:31 +0000</pubDate>
				<category><![CDATA[🟧英検５級 英語シリーズ]]></category>
		<category><![CDATA[＃フラッシュ]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[#英単語]]></category>
		<category><![CDATA[＃英検]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=5322</guid>

					<description><![CDATA[<p>英検５級 フラッシュ英単語 No.10｜場所・建物（音声対応） 英検５級 フラッシュ英単語 No.10 場所・建物 日本語からスタート 🔊 音声ON — — 英語⇆日本語 ▶ 読み上げ わかった 👍 わからん！あとで復習 [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no10/">英検５級 フラッシュ英単語 No.10｜場所・建物（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>英検５級 フラッシュ英単語 No.10｜場所・建物（音声対応）</title>

<style>
:root{
  --bg:#f7f7fb; --card:#ffffff; --ink:#111827; --muted:#6b7280;
  --accent:#10b981; --accent-weak:#d1fae5;
  --good:#22c55e; --review:#f59e0b;
  --shadow:0 6px 24px rgba(0,0,0,.08);
}
body{margin:0;background:var(--bg);}
.wrap{max-width:760px;margin:0 auto;padding:16px 16px 28px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial;color:var(--ink);}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 16px;flex-wrap:wrap;}
h1{font-size:18px;margin:0;font-weight:700;}
.badge{font-size:11px;color:var(--accent);background:var(--accent-weak);padding:3px 8px;border-radius:999px;}
.switches{display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:13px;}
.switches input{accent-color:var(--accent);}
.card-outer{position:relative;perspective:1200px;margin:12px 0 8px;}
.card{position:relative;width:100%;min-height:190px;background:var(--card);border-radius:18px;box-shadow:var(--shadow);cursor:pointer;transform-style:preserve-3d;transition:transform .5s ease;}
.card.flipped{transform:rotateY(180deg);}
.face{position:absolute;inset:0;border-radius:18px;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;padding:24px;text-align:center;}
.frontText{font-size:30px;font-weight:800;}
.backText{font-size:24px;font-weight:700;}
.card-face-back{transform:rotateY(180deg);}
.controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0;}
.btn{appearance:none;border:1px solid #e5e7eb;background:#fff;padding:11px 12px;border-radius:13px;font-size:14px;font-weight:700;line-height:1.2;cursor:pointer;color:var(--ink);}
.btn:hover{background:#ecfdf5;}
.btn:active{transform:translateY(1px);}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn.good{background:var(--good);color:#fff;border-color:var(--good);}
.btn.review{background:var(--review);color:#fff;border-color:var(--review);}
.meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;color:var(--muted);font-size:13px;}
.progress{height:8px;background:var(--accent-weak);border-radius:999px;overflow:hidden;flex:1;}
.bar{height:100%;width:0;background:var(--accent);transition:.25s;}
.index{min-width:90px;text-align:right;}
.hint{margin-top:8px;color:var(--muted);font-size:12px;}
.result-box{display:none;background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:24px;text-align:center;margin-top:16px;}
.result-box h2{margin:0 0 10px;font-size:22px;}
.result-box p{color:#475569;font-weight:700;}
.series-nav-wrap{margin:32px 0 12px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}
.series-nav-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:700;border-radius:999px;padding:10px 18px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.08);transition:.2s;font-size:14px;}
.series-nav-btn.nav-back{color:#10b981;border:2px solid #a7f3d0;}
.series-nav-btn.next{color:#047857;border:2px solid #a7f3d0;background:linear-gradient(135deg,#ecfdf5,#d1fae5);}
.series-nav-btn:hover{transform:translateY(-2px);}
@media (min-width:560px){.frontText{font-size:36px}.backText{font-size:26px}.card{min-height:220px}}
@media(max-width:480px){.controls{grid-template-columns:1fr}.series-nav-btn{width:100%;font-size:15px;padding:12px 18px}}
</style>
</head>

<body>
<div class="wrap" id="app" aria-live="polite">

<header>
  <h1>英検５級 フラッシュ英単語 <span class="badge">No.10 場所・建物</span></h1>
  <div class="switches">
    <label><input type="checkbox" id="jpFirst"> 日本語からスタート</label>
    <label><input type="checkbox" id="speakOn"> 🔊 音声ON</label>
  </div>
</header>

<div id="studyArea">
  <div class="card-outer" aria-label="フラッシュカード" role="button" tabindex="0">
    <div class="card" id="card">
      <div class="face card-face-front"><div class="frontText" id="frontText">—</div></div>
      <div class="face card-face-back"><div class="backText" id="backText">—</div></div>
    </div>
  </div>

  <div class="controls">
    <button class="btn primary" id="flipBtn">英語⇆日本語</button>
    <button class="btn" id="speakBtn">▶ 読み上げ</button>
    <button class="btn good" id="knownBtn">わかった 👍</button>
    <button class="btn review" id="wrongBtn">わからん！あとで復習 📌</button>
    <button class="btn" id="shuffleBtn">🔀 シャッフル</button>
    <button class="btn" id="resetBtn">↩︎ はじめから</button>
  </div>

  <div class="meta">
    <div class="progress"><div class="bar" id="bar"></div></div>
    <div class="index"><span id="pos">1</span>/<span id="total">—</span></div>
  </div>

  <p class="hint">カードをタップして答えを確認。わかったら「わかった」、不安なら「あとで復習」を押してね。</p>
</div>

<div class="result-box" id="resultBox">
  <h2 id="resultTitle">おつかれさま！✨</h2>
  <p id="resultText"></p>
  <div class="controls">
    <button class="btn review" id="reviewBtn">復習する 🔁</button>
    <button class="btn" id="againBtn">もう一回やる</button>
  </div>
</div>

<div class="series-nav-wrap">
  <a href="https://jouniorsankosodate.com/eiken5-no9/" class="series-nav-btn nav-back">← 前のレッスンへ</a>
  <a href="https://jouniorsankosodate.com/category/learn/english-flash/" class="series-nav-btn nav-back">英単語フラッシュのカテゴリ一覧に戻る</a>
  <a href="https://jouniorsankosodate.com/eiken5-no11/" class="series-nav-btn next">次のレッスンへ →</a>
</div>

</div>

<script>
const ITEMS = [
  { word: "school", jp: "学校" },
  { word: "park", jp: "公園" },
  { word: "library", jp: "図書館" },
  { word: "station", jp: "駅" },
  { word: "hospital", jp: "病院" },
  { word: "store", jp: "店" },
  { word: "restaurant", jp: "レストラン" },
  { word: "house", jp: "家" },
  { word: "room", jp: "部屋" },
  { word: "city", jp: "都市／街" }
];

let _voice = null;

function pickVoice(){
  const voices = speechSynthesis.getVoices() || [];
  const femaleNames = ["Sonia","Serena","Susan","Kate","Libby","Maisie","Google UK English Female","Microsoft Sonia","Microsoft Libby","Microsoft Susan"];

  return voices.find(v => v.lang === "en-GB" && femaleNames.some(name => v.name.includes(name)))
  || voices.find(v => v.lang === "en-GB")
  || voices.find(v => (v.lang || "").startsWith("en"))
  || null;
}

(() => {
  const card = document.getElementById("card");
  const frontText = document.getElementById("frontText");
  const backText = document.getElementById("backText");
  const posEl = document.getElementById("pos");
  const totalEl = document.getElementById("total");
  const bar = document.getElementById("bar");
  const jpFirst = document.getElementById("jpFirst");
  const speakOnChk = document.getElementById("speakOn");
  const flipBtn = document.getElementById("flipBtn");
  const speakBtn = document.getElementById("speakBtn");
  const knownBtn = document.getElementById("knownBtn");
  const wrongBtn = document.getElementById("wrongBtn");
  const shuffleBtn = document.getElementById("shuffleBtn");
  const resetBtn = document.getElementById("resetBtn");
  const studyArea = document.getElementById("studyArea");
  const resultBox = document.getElementById("resultBox");
  const resultTitle = document.getElementById("resultTitle");
  const resultText = document.getElementById("resultText");
  const reviewBtn = document.getElementById("reviewBtn");
  const againBtn = document.getElementById("againBtn");

  let order = [...Array(ITEMS.length).keys()];
  let idx = 0;
  let isFlipped = false;
  let showJpFirst = false;
  let speakOn = false;
  let reviewList = [];

  totalEl.textContent = order.length;

  speechSynthesis.addEventListener("voiceschanged", () => {_voice = pickVoice();});

  function speak(text){
    try{
      if(!("speechSynthesis" in window)) return;
      if(!_voice) _voice = pickVoice();

      const u = new SpeechSynthesisUtterance(text.trim());
      if(_voice){
        u.voice = _voice;
        u.lang = _voice.lang || "en-GB";
      }else{
        u.lang = "en-GB";
      }

      u.rate = 0.9;
      u.pitch = 1.05;
      speechSynthesis.cancel();
      speechSynthesis.speak(u);
    }catch(e){}
  }

  function currentItem(){return ITEMS[order[idx]];}

  function render(){
    const it = currentItem();
    card.classList.remove("flipped");
    isFlipped = false;

    frontText.textContent = showJpFirst ? it.jp : it.word;
    backText.textContent = showJpFirst ? it.word : it.jp;

    posEl.textContent = idx + 1;
    totalEl.textContent = order.length;
    bar.style.width = `${((idx + 1) / order.length) * 100}%`;

    if(speakOn){speak(it.word);}
  }

  function flip(){
    isFlipped = !isFlipped;
    card.classList.toggle("flipped", isFlipped);
  }

  function nextCard(){
    if(idx >= order.length - 1){
      showResult();
      return;
    }
    idx++;
    render();
  }

  function showResult(){
    studyArea.style.display = "none";
    resultBox.style.display = "block";

    if(reviewList.length === 0){
      resultTitle.textContent = "ぜんぶできた！すごい！！🎉";
      resultText.textContent = "あとで復習する単語は 0こ です。";
      reviewBtn.style.display = "none";
    }else{
      resultTitle.textContent = "おつかれさま！✨";
      resultText.textContent = `あとで復習する単語は ${reviewList.length}こ あるよ。`;
      reviewBtn.style.display = "inline-block";
    }
  }

  function startStudy(newOrder){
    order = [...newOrder];
    idx = 0;
    studyArea.style.display = "block";
    resultBox.style.display = "none";
    render();
  }

  function resetAll(){
    reviewList = [];
    startStudy([...Array(ITEMS.length).keys()]);
  }

  function shuffleOrder(){
    for(let i = order.length - 1; i > 0; i--){
      const j = Math.floor(Math.random() * (i + 1));
      [order[i], order[j]] = [order[j], order[i]];
    }
    idx = 0;
    render();
  }

  card.addEventListener("click", flip);
  flipBtn.addEventListener("click", flip);
  speakBtn.addEventListener("click", () => speak(currentItem().word));
  knownBtn.addEventListener("click", nextCard);

  wrongBtn.addEventListener("click", () => {
    const currentIndex = order[idx];
    if(!reviewList.includes(currentIndex)){reviewList.push(currentIndex);}
    nextCard();
  });

  reviewBtn.addEventListener("click", () => {
    if(reviewList.length === 0) return;
    const list = [...reviewList];
    reviewList = [];
    startStudy(list);
  });

  againBtn.addEventListener("click", resetAll);
  shuffleBtn.addEventListener("click", shuffleOrder);
  resetBtn.addEventListener("click", resetAll);

  jpFirst.addEventListener("change", e => {
    showJpFirst = e.target.checked;
    render();
  });

  speakOnChk.addEventListener("change", e => {
    speakOn = e.target.checked;
    if(speakOn) speak(currentItem().word);
  });

  window.addEventListener("keydown", e => {
    if(e.key === " "){
      e.preventDefault();
      flip();
    }
  });

  render();
})();
</script>
</body>
</html>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no10/">英検５級 フラッシュ英単語 No.10｜場所・建物（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/eiken5-no10/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>英検５級 フラッシュ英単語 No.9｜時間・曜日（音声対応）</title>
		<link>https://jouniorsankosodate.com/eiken5-no9/</link>
					<comments>https://jouniorsankosodate.com/eiken5-no9/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Sat, 02 May 2026 08:15:58 +0000</pubDate>
				<category><![CDATA[🟧英検５級 英語シリーズ]]></category>
		<category><![CDATA[＃フラッシュ]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[#英単語]]></category>
		<category><![CDATA[＃英検]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=5319</guid>

					<description><![CDATA[<p>英検５級 フラッシュ英単語 No.9｜時間・曜日（音声対応） 英検５級 フラッシュ英単語 No.9 時間・曜日 日本語からスタート 🔊 音声ON — — 英語⇆日本語 ▶ 読み上げ わかった 👍 わからん！あとで復習 📌 [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no9/">英検５級 フラッシュ英単語 No.9｜時間・曜日（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>英検５級 フラッシュ英単語 No.9｜時間・曜日（音声対応）</title>

<style>
:root{
  --bg:#f7f7fb; --card:#ffffff; --ink:#111827; --muted:#6b7280;
  --accent:#f97316; --accent-weak:#ffedd5;
  --good:#22c55e; --review:#f59e0b;
  --shadow:0 6px 24px rgba(0,0,0,.08);
}
body{margin:0;background:var(--bg);}
.wrap{max-width:760px;margin:0 auto;padding:16px 16px 28px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial;color:var(--ink);}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 16px;flex-wrap:wrap;}
h1{font-size:18px;margin:0;font-weight:700;}
.badge{font-size:11px;color:var(--accent);background:var(--accent-weak);padding:3px 8px;border-radius:999px;}
.switches{display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:13px;}
.switches input{accent-color:var(--accent);}
.card-outer{position:relative;perspective:1200px;margin:12px 0 8px;}
.card{position:relative;width:100%;min-height:190px;background:var(--card);border-radius:18px;box-shadow:var(--shadow);cursor:pointer;transform-style:preserve-3d;transition:transform .5s ease;}
.card.flipped{transform:rotateY(180deg);}
.face{position:absolute;inset:0;border-radius:18px;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;padding:24px;text-align:center;}
.frontText{font-size:30px;font-weight:800;}
.backText{font-size:24px;font-weight:700;}
.card-face-back{transform:rotateY(180deg);}
.controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0;}
.btn{appearance:none;border:1px solid #e5e7eb;background:#fff;padding:11px 12px;border-radius:13px;font-size:14px;font-weight:700;line-height:1.2;cursor:pointer;color:var(--ink);}
.btn:hover{background:#fff7ed;}
.btn:active{transform:translateY(1px);}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn.good{background:var(--good);color:#fff;border-color:var(--good);}
.btn.review{background:var(--review);color:#fff;border-color:var(--review);}
.meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;color:var(--muted);font-size:13px;}
.progress{height:8px;background:var(--accent-weak);border-radius:999px;overflow:hidden;flex:1;}
.bar{height:100%;width:0;background:var(--accent);transition:.25s;}
.index{min-width:90px;text-align:right;}
.hint{margin-top:8px;color:var(--muted);font-size:12px;}
.result-box{display:none;background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:24px;text-align:center;margin-top:16px;}
.result-box h2{margin:0 0 10px;font-size:22px;}
.result-box p{color:#475569;font-weight:700;}
.series-nav-wrap{margin:32px 0 12px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}
.series-nav-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:700;border-radius:999px;padding:10px 18px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.08);transition:.2s;font-size:14px;}
.series-nav-btn.nav-back{color:#f97316;border:2px solid #fed7aa;}
.series-nav-btn.next{color:#ea580c;border:2px solid #fed7aa;background:linear-gradient(135deg,#fff7ed,#ffedd5);}
.series-nav-btn:hover{transform:translateY(-2px);}
@media (min-width:560px){.frontText{font-size:36px}.backText{font-size:26px}.card{min-height:220px}}
@media(max-width:480px){.controls{grid-template-columns:1fr}.series-nav-btn{width:100%;font-size:15px;padding:12px 18px}}
</style>
</head>

<body>
<div class="wrap" id="app" aria-live="polite">

<header>
  <h1>英検５級 フラッシュ英単語 <span class="badge">No.9 時間・曜日</span></h1>
  <div class="switches">
    <label><input type="checkbox" id="jpFirst"> 日本語からスタート</label>
    <label><input type="checkbox" id="speakOn"> 🔊 音声ON</label>
  </div>
</header>

<div id="studyArea">
  <div class="card-outer" aria-label="フラッシュカード" role="button" tabindex="0">
    <div class="card" id="card">
      <div class="face card-face-front"><div class="frontText" id="frontText">—</div></div>
      <div class="face card-face-back"><div class="backText" id="backText">—</div></div>
    </div>
  </div>

  <div class="controls">
    <button class="btn primary" id="flipBtn">英語⇆日本語</button>
    <button class="btn" id="speakBtn">▶ 読み上げ</button>
    <button class="btn good" id="knownBtn">わかった 👍</button>
    <button class="btn review" id="wrongBtn">わからん！あとで復習 📌</button>
    <button class="btn" id="shuffleBtn">🔀 シャッフル</button>
    <button class="btn" id="resetBtn">↩︎ はじめから</button>
  </div>

  <div class="meta">
    <div class="progress"><div class="bar" id="bar"></div></div>
    <div class="index"><span id="pos">1</span>/<span id="total">—</span></div>
  </div>

  <p class="hint">カードをタップして答えを確認。わかったら「わかった」、不安なら「あとで復習」を押してね。</p>
</div>

<div class="result-box" id="resultBox">
  <h2 id="resultTitle">おつかれさま！✨</h2>
  <p id="resultText"></p>
  <div class="controls">
    <button class="btn review" id="reviewBtn">復習する 🔁</button>
    <button class="btn" id="againBtn">もう一回やる</button>
  </div>
</div>

<div class="series-nav-wrap">
  <a href="https://jouniorsankosodate.com/eiken5-no8/" class="series-nav-btn nav-back">← 前のレッスンへ</a>
  <a href="https://jouniorsankosodate.com/category/learn/english-flash/" class="series-nav-btn nav-back">英単語フラッシュのカテゴリ一覧に戻る</a>
  <a href="https://jouniorsankosodate.com/eiken5-no10/" class="series-nav-btn next">次のレッスンへ →</a>
</div>

</div>

<script>
const ITEMS = [
  { word: "Sunday", jp: "日曜日" },
  { word: "Monday", jp: "月曜日" },
  { word: "Tuesday", jp: "火曜日" },
  { word: "Wednesday", jp: "水曜日" },
  { word: "Thursday", jp: "木曜日" },
  { word: "Friday", jp: "金曜日" },
  { word: "Saturday", jp: "土曜日" },
  { word: "today", jp: "今日" },
  { word: "tomorrow", jp: "明日" },
  { word: "yesterday", jp: "昨日" },
  { word: "morning", jp: "朝／午前" },
  { word: "afternoon", jp: "午後" },
  { word: "evening", jp: "夕方／晩" },
  { word: "night", jp: "夜" },
  { word: "time", jp: "時間" },
  { word: "hour", jp: "1時間" },
  { word: "minute", jp: "分" },
  { word: "o'clock", jp: "〜時" }
];

let _voice = null;

function pickVoice(){
  const voices = speechSynthesis.getVoices() || [];
  const femaleNames = ["Sonia","Serena","Susan","Kate","Libby","Maisie","Google UK English Female","Microsoft Sonia","Microsoft Libby","Microsoft Susan"];

  return voices.find(v => v.lang === "en-GB" && femaleNames.some(name => v.name.includes(name)))
  || voices.find(v => v.lang === "en-GB")
  || voices.find(v => (v.lang || "").startsWith("en"))
  || null;
}

(() => {
  const card = document.getElementById("card");
  const frontText = document.getElementById("frontText");
  const backText = document.getElementById("backText");
  const posEl = document.getElementById("pos");
  const totalEl = document.getElementById("total");
  const bar = document.getElementById("bar");
  const jpFirst = document.getElementById("jpFirst");
  const speakOnChk = document.getElementById("speakOn");
  const flipBtn = document.getElementById("flipBtn");
  const speakBtn = document.getElementById("speakBtn");
  const knownBtn = document.getElementById("knownBtn");
  const wrongBtn = document.getElementById("wrongBtn");
  const shuffleBtn = document.getElementById("shuffleBtn");
  const resetBtn = document.getElementById("resetBtn");
  const studyArea = document.getElementById("studyArea");
  const resultBox = document.getElementById("resultBox");
  const resultTitle = document.getElementById("resultTitle");
  const resultText = document.getElementById("resultText");
  const reviewBtn = document.getElementById("reviewBtn");
  const againBtn = document.getElementById("againBtn");

  let order = [...Array(ITEMS.length).keys()];
  let idx = 0;
  let isFlipped = false;
  let showJpFirst = false;
  let speakOn = false;
  let reviewList = [];

  totalEl.textContent = order.length;

  speechSynthesis.addEventListener("voiceschanged", () => {_voice = pickVoice();});

  function speak(text){
    try{
      if(!("speechSynthesis" in window)) return;
      if(!_voice) _voice = pickVoice();

      const u = new SpeechSynthesisUtterance(text.trim());
      if(_voice){
        u.voice = _voice;
        u.lang = _voice.lang || "en-GB";
      }else{
        u.lang = "en-GB";
      }

      u.rate = 0.9;
      u.pitch = 1.05;
      speechSynthesis.cancel();
      speechSynthesis.speak(u);
    }catch(e){}
  }

  function currentItem(){return ITEMS[order[idx]];}

  function render(){
    const it = currentItem();
    card.classList.remove("flipped");
    isFlipped = false;

    frontText.textContent = showJpFirst ? it.jp : it.word;
    backText.textContent = showJpFirst ? it.word : it.jp;

    posEl.textContent = idx + 1;
    totalEl.textContent = order.length;
    bar.style.width = `${((idx + 1) / order.length) * 100}%`;

    if(speakOn){speak(it.word);}
  }

  function flip(){
    isFlipped = !isFlipped;
    card.classList.toggle("flipped", isFlipped);
  }

  function nextCard(){
    if(idx >= order.length - 1){
      showResult();
      return;
    }
    idx++;
    render();
  }

  function showResult(){
    studyArea.style.display = "none";
    resultBox.style.display = "block";

    if(reviewList.length === 0){
      resultTitle.textContent = "ぜんぶできた！すごい！！🎉";
      resultText.textContent = "あとで復習する単語は 0こ です。";
      reviewBtn.style.display = "none";
    }else{
      resultTitle.textContent = "おつかれさま！✨";
      resultText.textContent = `あとで復習する単語は ${reviewList.length}こ あるよ。`;
      reviewBtn.style.display = "inline-block";
    }
  }

  function startStudy(newOrder){
    order = [...newOrder];
    idx = 0;
    studyArea.style.display = "block";
    resultBox.style.display = "none";
    render();
  }

  function resetAll(){
    reviewList = [];
    startStudy([...Array(ITEMS.length).keys()]);
  }

  function shuffleOrder(){
    for(let i = order.length - 1; i > 0; i--){
      const j = Math.floor(Math.random() * (i + 1));
      [order[i], order[j]] = [order[j], order[i]];
    }
    idx = 0;
    render();
  }

  card.addEventListener("click", flip);
  flipBtn.addEventListener("click", flip);
  speakBtn.addEventListener("click", () => speak(currentItem().word));
  knownBtn.addEventListener("click", nextCard);

  wrongBtn.addEventListener("click", () => {
    const currentIndex = order[idx];
    if(!reviewList.includes(currentIndex)){reviewList.push(currentIndex);}
    nextCard();
  });

  reviewBtn.addEventListener("click", () => {
    if(reviewList.length === 0) return;
    const list = [...reviewList];
    reviewList = [];
    startStudy(list);
  });

  againBtn.addEventListener("click", resetAll);
  shuffleBtn.addEventListener("click", shuffleOrder);
  resetBtn.addEventListener("click", resetAll);

  jpFirst.addEventListener("change", e => {
    showJpFirst = e.target.checked;
    render();
  });

  speakOnChk.addEventListener("change", e => {
    speakOn = e.target.checked;
    if(speakOn) speak(currentItem().word);
  });

  window.addEventListener("keydown", e => {
    if(e.key === " "){
      e.preventDefault();
      flip();
    }
  });

  render();
})();
</script>
</body>
</html>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no9/">英検５級 フラッシュ英単語 No.9｜時間・曜日（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/eiken5-no9/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>英検５級 フラッシュ英単語 No.8｜教科・学校生活（音声対応）</title>
		<link>https://jouniorsankosodate.com/eiken5-no8/</link>
					<comments>https://jouniorsankosodate.com/eiken5-no8/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Sat, 02 May 2026 08:14:49 +0000</pubDate>
				<category><![CDATA[🟧英検５級 英語シリーズ]]></category>
		<category><![CDATA[＃フラッシュ]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[#英単語]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=5317</guid>

					<description><![CDATA[<p>英検５級 フラッシュ英単語 No.8｜教科・学校生活（音声対応） 英検５級 フラッシュ英単語 No.8 教科・学校生活 日本語からスタート 🔊 音声ON — — 英語⇆日本語 ▶ 読み上げ わかった 👍 わからん！あとで [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no8/">英検５級 フラッシュ英単語 No.8｜教科・学校生活（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>英検５級 フラッシュ英単語 No.8｜教科・学校生活（音声対応）</title>

<style>
:root{
  --bg:#f7f7fb; --card:#ffffff; --ink:#111827; --muted:#6b7280;
  --accent:#3b82f6; --accent-weak:#dbeafe;
  --good:#22c55e; --review:#f59e0b;
  --shadow:0 6px 24px rgba(0,0,0,.08);
}
body{margin:0;background:var(--bg);}
.wrap{max-width:760px;margin:0 auto;padding:16px 16px 28px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial;color:var(--ink);}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 16px;flex-wrap:wrap;}
h1{font-size:18px;margin:0;font-weight:700;}
.badge{font-size:11px;color:var(--accent);background:var(--accent-weak);padding:3px 8px;border-radius:999px;}
.switches{display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:13px;}
.switches input{accent-color:var(--accent);}
.card-outer{position:relative;perspective:1200px;margin:12px 0 8px;}
.card{position:relative;width:100%;min-height:190px;background:var(--card);border-radius:18px;box-shadow:var(--shadow);cursor:pointer;transform-style:preserve-3d;transition:transform .5s ease;}
.card.flipped{transform:rotateY(180deg);}
.face{position:absolute;inset:0;border-radius:18px;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;padding:24px;text-align:center;}
.frontText{font-size:30px;font-weight:800;}
.backText{font-size:24px;font-weight:700;}
.card-face-back{transform:rotateY(180deg);}
.controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0;}
.btn{appearance:none;border:1px solid #e5e7eb;background:#fff;padding:11px 12px;border-radius:13px;font-size:14px;font-weight:700;line-height:1.2;cursor:pointer;color:var(--ink);}
.btn:hover{background:#eff6ff;}
.btn:active{transform:translateY(1px);}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn.good{background:var(--good);color:#fff;border-color:var(--good);}
.btn.review{background:var(--review);color:#fff;border-color:var(--review);}
.meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;color:var(--muted);font-size:13px;}
.progress{height:8px;background:var(--accent-weak);border-radius:999px;overflow:hidden;flex:1;}
.bar{height:100%;width:0;background:var(--accent);transition:.25s;}
.index{min-width:90px;text-align:right;}
.hint{margin-top:8px;color:var(--muted);font-size:12px;}
.result-box{display:none;background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:24px;text-align:center;margin-top:16px;}
.result-box h2{margin:0 0 10px;font-size:22px;}
.result-box p{color:#475569;font-weight:700;}
.series-nav-wrap{margin:32px 0 12px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}
.series-nav-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:700;border-radius:999px;padding:10px 18px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.08);transition:.2s;font-size:14px;}
.series-nav-btn.nav-back{color:#3b82f6;border:2px solid #bfdbfe;}
.series-nav-btn.next{color:#1d4ed8;border:2px solid #bfdbfe;background:linear-gradient(135deg,#eff6ff,#dbeafe);}
.series-nav-btn:hover{transform:translateY(-2px);}
@media (min-width:560px){.frontText{font-size:36px}.backText{font-size:26px}.card{min-height:220px}}
@media(max-width:480px){.controls{grid-template-columns:1fr}.series-nav-btn{width:100%;font-size:15px;padding:12px 18px}}
</style>
</head>

<body>
<div class="wrap" id="app" aria-live="polite">

<header>
  <h1>英検５級 フラッシュ英単語 <span class="badge">No.8 教科・学校生活</span></h1>
  <div class="switches">
    <label><input type="checkbox" id="jpFirst"> 日本語からスタート</label>
    <label><input type="checkbox" id="speakOn"> 🔊 音声ON</label>
  </div>
</header>

<div id="studyArea">
  <div class="card-outer" aria-label="フラッシュカード" role="button" tabindex="0">
    <div class="card" id="card">
      <div class="face card-face-front"><div class="frontText" id="frontText">—</div></div>
      <div class="face card-face-back"><div class="backText" id="backText">—</div></div>
    </div>
  </div>

  <div class="controls">
    <button class="btn primary" id="flipBtn">英語⇆日本語</button>
    <button class="btn" id="speakBtn">▶ 読み上げ</button>
    <button class="btn good" id="knownBtn">わかった 👍</button>
    <button class="btn review" id="wrongBtn">わからん！あとで復習 📌</button>
    <button class="btn" id="shuffleBtn">🔀 シャッフル</button>
    <button class="btn" id="resetBtn">↩︎ はじめから</button>
  </div>

  <div class="meta">
    <div class="progress"><div class="bar" id="bar"></div></div>
    <div class="index"><span id="pos">1</span>/<span id="total">—</span></div>
  </div>

  <p class="hint">カードをタップして答えを確認。わかったら「わかった」、不安なら「あとで復習」を押してね。</p>
</div>

<div class="result-box" id="resultBox">
  <h2 id="resultTitle">おつかれさま！✨</h2>
  <p id="resultText"></p>
  <div class="controls">
    <button class="btn review" id="reviewBtn">復習する 🔁</button>
    <button class="btn" id="againBtn">もう一回やる</button>
  </div>
</div>

<div class="series-nav-wrap">
  <a href="https://jouniorsankosodate.com/eiken5-no7/" class="series-nav-btn nav-back">← 前のレッスンへ</a>
  <a href="https://jouniorsankosodate.com/category/learn/english-flash/" class="series-nav-btn nav-back">英単語フラッシュのカテゴリ一覧に戻る</a>
  <a href="https://jouniorsankosodate.com/eiken5-no9/" class="series-nav-btn next">次のレッスンへ →</a>
</div>

</div>

<script>
const ITEMS = [
  { word: "English", jp: "英語" },
  { word: "math", jp: "算数" },
  { word: "science", jp: "理科" },
  { word: "music", jp: "音楽" },
  { word: "P.E.", jp: "体育" },
  { word: "art", jp: "図工／美術" },
  { word: "Japanese", jp: "国語" },
  { word: "class", jp: "授業／クラス" },
  { word: "lesson", jp: "レッスン／授業" },
  { word: "homework", jp: "宿題" },
  { word: "test", jp: "テスト" },
  { word: "question", jp: "質問／問題" },
  { word: "answer", jp: "答え" },
  { word: "notebook", jp: "ノート" },
  { word: "dictionary", jp: "辞書" }
];

let _voice = null;

function pickVoice(){
  const voices = speechSynthesis.getVoices() || [];
  const femaleNames = ["Sonia","Serena","Susan","Kate","Libby","Maisie","Google UK English Female","Microsoft Sonia","Microsoft Libby","Microsoft Susan"];

  return voices.find(v => v.lang === "en-GB" && femaleNames.some(name => v.name.includes(name)))
  || voices.find(v => v.lang === "en-GB")
  || voices.find(v => (v.lang || "").startsWith("en"))
  || null;
}

(() => {
  const card = document.getElementById("card");
  const frontText = document.getElementById("frontText");
  const backText = document.getElementById("backText");
  const posEl = document.getElementById("pos");
  const totalEl = document.getElementById("total");
  const bar = document.getElementById("bar");
  const jpFirst = document.getElementById("jpFirst");
  const speakOnChk = document.getElementById("speakOn");
  const flipBtn = document.getElementById("flipBtn");
  const speakBtn = document.getElementById("speakBtn");
  const knownBtn = document.getElementById("knownBtn");
  const wrongBtn = document.getElementById("wrongBtn");
  const shuffleBtn = document.getElementById("shuffleBtn");
  const resetBtn = document.getElementById("resetBtn");
  const studyArea = document.getElementById("studyArea");
  const resultBox = document.getElementById("resultBox");
  const resultTitle = document.getElementById("resultTitle");
  const resultText = document.getElementById("resultText");
  const reviewBtn = document.getElementById("reviewBtn");
  const againBtn = document.getElementById("againBtn");

  let order = [...Array(ITEMS.length).keys()];
  let idx = 0;
  let isFlipped = false;
  let showJpFirst = false;
  let speakOn = false;
  let reviewList = [];

  totalEl.textContent = order.length;

  speechSynthesis.addEventListener("voiceschanged", () => {_voice = pickVoice();});

  function speak(text){
    try{
      if(!("speechSynthesis" in window)) return;
      if(!_voice) _voice = pickVoice();

      const u = new SpeechSynthesisUtterance(text.trim());
      if(_voice){
        u.voice = _voice;
        u.lang = _voice.lang || "en-GB";
      }else{
        u.lang = "en-GB";
      }

      u.rate = 0.9;
      u.pitch = 1.05;
      speechSynthesis.cancel();
      speechSynthesis.speak(u);
    }catch(e){}
  }

  function currentItem(){return ITEMS[order[idx]];}

  function render(){
    const it = currentItem();
    card.classList.remove("flipped");
    isFlipped = false;

    frontText.textContent = showJpFirst ? it.jp : it.word;
    backText.textContent = showJpFirst ? it.word : it.jp;

    posEl.textContent = idx + 1;
    totalEl.textContent = order.length;
    bar.style.width = `${((idx + 1) / order.length) * 100}%`;

    if(speakOn){speak(it.word);}
  }

  function flip(){
    isFlipped = !isFlipped;
    card.classList.toggle("flipped", isFlipped);
  }

  function nextCard(){
    if(idx >= order.length - 1){
      showResult();
      return;
    }
    idx++;
    render();
  }

  function showResult(){
    studyArea.style.display = "none";
    resultBox.style.display = "block";

    if(reviewList.length === 0){
      resultTitle.textContent = "ぜんぶできた！すごい！！🎉";
      resultText.textContent = "あとで復習する単語は 0こ です。";
      reviewBtn.style.display = "none";
    }else{
      resultTitle.textContent = "おつかれさま！✨";
      resultText.textContent = `あとで復習する単語は ${reviewList.length}こ あるよ。`;
      reviewBtn.style.display = "inline-block";
    }
  }

  function startStudy(newOrder){
    order = [...newOrder];
    idx = 0;
    studyArea.style.display = "block";
    resultBox.style.display = "none";
    render();
  }

  function resetAll(){
    reviewList = [];
    startStudy([...Array(ITEMS.length).keys()]);
  }

  function shuffleOrder(){
    for(let i = order.length - 1; i > 0; i--){
      const j = Math.floor(Math.random() * (i + 1));
      [order[i], order[j]] = [order[j], order[i]];
    }
    idx = 0;
    render();
  }

  card.addEventListener("click", flip);
  flipBtn.addEventListener("click", flip);
  speakBtn.addEventListener("click", () => speak(currentItem().word));
  knownBtn.addEventListener("click", nextCard);

  wrongBtn.addEventListener("click", () => {
    const currentIndex = order[idx];
    if(!reviewList.includes(currentIndex)){reviewList.push(currentIndex);}
    nextCard();
  });

  reviewBtn.addEventListener("click", () => {
    if(reviewList.length === 0) return;
    const list = [...reviewList];
    reviewList = [];
    startStudy(list);
  });

  againBtn.addEventListener("click", resetAll);
  shuffleBtn.addEventListener("click", shuffleOrder);
  resetBtn.addEventListener("click", resetAll);

  jpFirst.addEventListener("change", e => {
    showJpFirst = e.target.checked;
    render();
  });

  speakOnChk.addEventListener("change", e => {
    speakOn = e.target.checked;
    if(speakOn) speak(currentItem().word);
  });

  window.addEventListener("keydown", e => {
    if(e.key === " "){
      e.preventDefault();
      flip();
    }
  });

  render();
})();
</script>
</body>
</html>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no8/">英検５級 フラッシュ英単語 No.8｜教科・学校生活（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/eiken5-no8/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>英検５級 フラッシュ英単語 No.7｜季節・天気（音声対応）</title>
		<link>https://jouniorsankosodate.com/eiken5-no7/</link>
					<comments>https://jouniorsankosodate.com/eiken5-no7/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Sat, 02 May 2026 08:14:11 +0000</pubDate>
				<category><![CDATA[🟧英検５級 英語シリーズ]]></category>
		<category><![CDATA[＃フラッシュ]]></category>
		<category><![CDATA[＃暗記]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[#英単語]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=5315</guid>

					<description><![CDATA[<p>英検５級 フラッシュ英単語 No.7｜季節・天気（音声対応） 英検５級 フラッシュ英単語 No.7 季節・天気 日本語からスタート 🔊 音声ON — — 英語⇆日本語 ▶ 読み上げ わかった 👍 わからん！あとで復習 📌 [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no7/">英検５級 フラッシュ英単語 No.7｜季節・天気（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>英検５級 フラッシュ英単語 No.7｜季節・天気（音声対応）</title>

<style>
:root{
  --bg:#f7f7fb; --card:#ffffff; --ink:#111827; --muted:#6b7280;
  --accent:#14b8a6; --accent-weak:#ccfbf1;
  --good:#22c55e; --review:#f59e0b;
  --shadow:0 6px 24px rgba(0,0,0,.08);
}
body{margin:0;background:var(--bg);}
.wrap{max-width:760px;margin:0 auto;padding:16px 16px 28px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial;color:var(--ink);}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 16px;flex-wrap:wrap;}
h1{font-size:18px;margin:0;font-weight:700;}
.badge{font-size:11px;color:var(--accent);background:var(--accent-weak);padding:3px 8px;border-radius:999px;}
.switches{display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:13px;}
.switches input{accent-color:var(--accent);}
.card-outer{position:relative;perspective:1200px;margin:12px 0 8px;}
.card{position:relative;width:100%;min-height:190px;background:var(--card);border-radius:18px;box-shadow:var(--shadow);cursor:pointer;transform-style:preserve-3d;transition:transform .5s ease;}
.card.flipped{transform:rotateY(180deg);}
.face{position:absolute;inset:0;border-radius:18px;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;padding:24px;text-align:center;}
.frontText{font-size:30px;font-weight:800;}
.backText{font-size:24px;font-weight:700;}
.card-face-back{transform:rotateY(180deg);}
.controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0;}
.btn{appearance:none;border:1px solid #e5e7eb;background:#fff;padding:11px 12px;border-radius:13px;font-size:14px;font-weight:700;line-height:1.2;cursor:pointer;color:var(--ink);}
.btn:hover{background:#f0fdfa;}
.btn:active{transform:translateY(1px);}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn.good{background:var(--good);color:#fff;border-color:var(--good);}
.btn.review{background:var(--review);color:#fff;border-color:var(--review);}
.meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;color:var(--muted);font-size:13px;}
.progress{height:8px;background:var(--accent-weak);border-radius:999px;overflow:hidden;flex:1;}
.bar{height:100%;width:0;background:var(--accent);transition:.25s;}
.index{min-width:90px;text-align:right;}
.hint{margin-top:8px;color:var(--muted);font-size:12px;}
.result-box{display:none;background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:24px;text-align:center;margin-top:16px;}
.result-box h2{margin:0 0 10px;font-size:22px;}
.result-box p{color:#475569;font-weight:700;}
.series-nav-wrap{margin:32px 0 12px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}
.series-nav-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:700;border-radius:999px;padding:10px 18px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.08);transition:.2s;font-size:14px;}
.series-nav-btn.nav-back{color:#14b8a6;border:2px solid #99f6e4;}
.series-nav-btn.next{color:#0f766e;border:2px solid #99f6e4;background:linear-gradient(135deg,#f0fdfa,#ccfbf1);}
.series-nav-btn:hover{transform:translateY(-2px);}
@media (min-width:560px){.frontText{font-size:36px}.backText{font-size:26px}.card{min-height:220px}}
@media(max-width:480px){.controls{grid-template-columns:1fr}.series-nav-btn{width:100%;font-size:15px;padding:12px 18px}}
</style>
</head>

<body>
<div class="wrap" id="app" aria-live="polite">

<header>
  <h1>英検５級 フラッシュ英単語 <span class="badge">No.7 季節・天気</span></h1>
  <div class="switches">
    <label><input type="checkbox" id="jpFirst"> 日本語からスタート</label>
    <label><input type="checkbox" id="speakOn"> 🔊 音声ON</label>
  </div>
</header>

<div id="studyArea">
  <div class="card-outer" aria-label="フラッシュカード" role="button" tabindex="0">
    <div class="card" id="card">
      <div class="face card-face-front"><div class="frontText" id="frontText">—</div></div>
      <div class="face card-face-back"><div class="backText" id="backText">—</div></div>
    </div>
  </div>

  <div class="controls">
    <button class="btn primary" id="flipBtn">英語⇆日本語</button>
    <button class="btn" id="speakBtn">▶ 読み上げ</button>
    <button class="btn good" id="knownBtn">わかった 👍</button>
    <button class="btn review" id="wrongBtn">わからん！あとで復習 📌</button>
    <button class="btn" id="shuffleBtn">🔀 シャッフル</button>
    <button class="btn" id="resetBtn">↩︎ はじめから</button>
  </div>

  <div class="meta">
    <div class="progress"><div class="bar" id="bar"></div></div>
    <div class="index"><span id="pos">1</span>/<span id="total">—</span></div>
  </div>

  <p class="hint">カードをタップして答えを確認。わかったら「わかった」、不安なら「あとで復習」を押してね。</p>
</div>

<div class="result-box" id="resultBox">
  <h2 id="resultTitle">おつかれさま！✨</h2>
  <p id="resultText"></p>
  <div class="controls">
    <button class="btn review" id="reviewBtn">復習する 🔁</button>
    <button class="btn" id="againBtn">もう一回やる</button>
  </div>
</div>

<div class="series-nav-wrap">
  <a href="https://jouniorsankosodate.com/eiken5-no6/" class="series-nav-btn nav-back">← 前のレッスンへ</a>
  <a href="https://jouniorsankosodate.com/category/learn/english-flash/" class="series-nav-btn nav-back">英単語フラッシュのカテゴリ一覧に戻る</a>
  <a href="https://jouniorsankosodate.com/eiken5-no8/" class="series-nav-btn next">次のレッスンへ →</a>
</div>

</div>

<script>
const ITEMS = [
  { word: "spring", jp: "春" },
  { word: "summer", jp: "夏" },
  { word: "fall", jp: "秋" },
  { word: "winter", jp: "冬" },
  { word: "season", jp: "季節" },
  { word: "weather", jp: "天気" },
  { word: "sunny", jp: "晴れた" },
  { word: "rainy", jp: "雨の" },
  { word: "cloudy", jp: "くもりの" },
  { word: "snowy", jp: "雪の" },
  { word: "hot", jp: "暑い" },
  { word: "cold", jp: "寒い" },
  { word: "warm", jp: "暖かい" },
  { word: "cool", jp: "涼しい" }
];

let _voice = null;

function pickVoice(){
  const voices = speechSynthesis.getVoices() || [];
  const femaleNames = ["Sonia","Serena","Susan","Kate","Libby","Maisie","Google UK English Female","Microsoft Sonia","Microsoft Libby","Microsoft Susan"];

  return voices.find(v => v.lang === "en-GB" && femaleNames.some(name => v.name.includes(name)))
  || voices.find(v => v.lang === "en-GB")
  || voices.find(v => (v.lang || "").startsWith("en"))
  || null;
}

(() => {
  const card = document.getElementById("card");
  const frontText = document.getElementById("frontText");
  const backText = document.getElementById("backText");
  const posEl = document.getElementById("pos");
  const totalEl = document.getElementById("total");
  const bar = document.getElementById("bar");
  const jpFirst = document.getElementById("jpFirst");
  const speakOnChk = document.getElementById("speakOn");
  const flipBtn = document.getElementById("flipBtn");
  const speakBtn = document.getElementById("speakBtn");
  const knownBtn = document.getElementById("knownBtn");
  const wrongBtn = document.getElementById("wrongBtn");
  const shuffleBtn = document.getElementById("shuffleBtn");
  const resetBtn = document.getElementById("resetBtn");
  const studyArea = document.getElementById("studyArea");
  const resultBox = document.getElementById("resultBox");
  const resultTitle = document.getElementById("resultTitle");
  const resultText = document.getElementById("resultText");
  const reviewBtn = document.getElementById("reviewBtn");
  const againBtn = document.getElementById("againBtn");

  let order = [...Array(ITEMS.length).keys()];
  let idx = 0;
  let isFlipped = false;
  let showJpFirst = false;
  let speakOn = false;
  let reviewList = [];

  totalEl.textContent = order.length;

  speechSynthesis.addEventListener("voiceschanged", () => {_voice = pickVoice();});

  function speak(text){
    try{
      if(!("speechSynthesis" in window)) return;
      if(!_voice) _voice = pickVoice();

      const u = new SpeechSynthesisUtterance(text.trim());
      if(_voice){
        u.voice = _voice;
        u.lang = _voice.lang || "en-GB";
      }else{
        u.lang = "en-GB";
      }

      u.rate = 0.9;
      u.pitch = 1.05;
      speechSynthesis.cancel();
      speechSynthesis.speak(u);
    }catch(e){}
  }

  function currentItem(){return ITEMS[order[idx]];}

  function render(){
    const it = currentItem();
    card.classList.remove("flipped");
    isFlipped = false;

    frontText.textContent = showJpFirst ? it.jp : it.word;
    backText.textContent = showJpFirst ? it.word : it.jp;

    posEl.textContent = idx + 1;
    totalEl.textContent = order.length;
    bar.style.width = `${((idx + 1) / order.length) * 100}%`;

    if(speakOn){speak(it.word);}
  }

  function flip(){
    isFlipped = !isFlipped;
    card.classList.toggle("flipped", isFlipped);
  }

  function nextCard(){
    if(idx >= order.length - 1){
      showResult();
      return;
    }
    idx++;
    render();
  }

  function showResult(){
    studyArea.style.display = "none";
    resultBox.style.display = "block";

    if(reviewList.length === 0){
      resultTitle.textContent = "ぜんぶできた！すごい！！🎉";
      resultText.textContent = "あとで復習する単語は 0こ です。";
      reviewBtn.style.display = "none";
    }else{
      resultTitle.textContent = "おつかれさま！✨";
      resultText.textContent = `あとで復習する単語は ${reviewList.length}こ あるよ。`;
      reviewBtn.style.display = "inline-block";
    }
  }

  function startStudy(newOrder){
    order = [...newOrder];
    idx = 0;
    studyArea.style.display = "block";
    resultBox.style.display = "none";
    render();
  }

  function resetAll(){
    reviewList = [];
    startStudy([...Array(ITEMS.length).keys()]);
  }

  function shuffleOrder(){
    for(let i = order.length - 1; i > 0; i--){
      const j = Math.floor(Math.random() * (i + 1));
      [order[i], order[j]] = [order[j], order[i]];
    }
    idx = 0;
    render();
  }

  card.addEventListener("click", flip);
  flipBtn.addEventListener("click", flip);
  speakBtn.addEventListener("click", () => speak(currentItem().word));
  knownBtn.addEventListener("click", nextCard);

  wrongBtn.addEventListener("click", () => {
    const currentIndex = order[idx];
    if(!reviewList.includes(currentIndex)){reviewList.push(currentIndex);}
    nextCard();
  });

  reviewBtn.addEventListener("click", () => {
    if(reviewList.length === 0) return;
    const list = [...reviewList];
    reviewList = [];
    startStudy(list);
  });

  againBtn.addEventListener("click", resetAll);
  shuffleBtn.addEventListener("click", shuffleOrder);
  resetBtn.addEventListener("click", resetAll);

  jpFirst.addEventListener("change", e => {
    showJpFirst = e.target.checked;
    render();
  });

  speakOnChk.addEventListener("change", e => {
    speakOn = e.target.checked;
    if(speakOn) speak(currentItem().word);
  });

  window.addEventListener("keydown", e => {
    if(e.key === " "){
      e.preventDefault();
      flip();
    }
  });

  render();
})();
</script>
</body>
</html>
<p>投稿 <a href="https://jouniorsankosodate.com/eiken5-no7/">英検５級 フラッシュ英単語 No.7｜季節・天気（音声対応）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/eiken5-no7/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>🐙【タコタの英文ルール 完全理解⑦】複数形はこれだけ！s・es・ies＋特別ルールをやさしく解説</title>
		<link>https://jouniorsankosodate.com/%f0%9f%90%99%e3%80%90%e3%82%bf%e3%82%b3%e3%82%bf%e3%81%ae%e8%8b%b1%e6%96%87%e3%83%ab%e3%83%bc%e3%83%ab-%e5%ae%8c%e5%85%a8%e7%90%86%e8%a7%a3%e2%91%a6%e3%80%91%e8%a4%87%e6%95%b0%e5%bd%a2%e3%81%af/</link>
					<comments>https://jouniorsankosodate.com/%f0%9f%90%99%e3%80%90%e3%82%bf%e3%82%b3%e3%82%bf%e3%81%ae%e8%8b%b1%e6%96%87%e3%83%ab%e3%83%bc%e3%83%ab-%e5%ae%8c%e5%85%a8%e7%90%86%e8%a7%a3%e2%91%a6%e3%80%91%e8%a4%87%e6%95%b0%e5%bd%a2%e3%81%af/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Tue, 07 Apr 2026 14:08:46 +0000</pubDate>
				<category><![CDATA[🐙タコタの英文ルール📖]]></category>
		<category><![CDATA[＃わかりやすい]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[＃英検]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<category><![CDATA[#英語学習]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=4652</guid>

					<description><![CDATA[<p>🐙 ひとつの場合 ✔ （a/i/u/e/o　以外） → a（a dog） ✔ （a/i/u/e/o）→ an（an apple） 英語で「2つ以上あるよ！」って言いたいときは👇👉 単語を複数形にするだけ！ たとえば👇 🐙 [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/%f0%9f%90%99%e3%80%90%e3%82%bf%e3%82%b3%e3%82%bf%e3%81%ae%e8%8b%b1%e6%96%87%e3%83%ab%e3%83%bc%e3%83%ab-%e5%ae%8c%e5%85%a8%e7%90%86%e8%a7%a3%e2%91%a6%e3%80%91%e8%a4%87%e6%95%b0%e5%bd%a2%e3%81%af/">🐙【タコタの英文ルール 完全理解⑦】複数形はこれだけ！s・es・ies＋特別ルールをやさしく解説</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph"></p>



<div style="background:#e8f6ff;padding:12px;border-radius:12px;margin:10px 0;">
🐙 ひとつの場合<br>
✔ （a/i/u/e/o　以外） → a（a dog）<br>
✔ （a/i/u/e/o）→ an（an apple）
</div>



<figure class="wp-block-image size-full is-resized"><img fetchpriority="high" decoding="async" width="1000" height="667" src="https://jouniorsankosodate.com/wp-content/uploads/2026/04/139432c3-cc23-44b2-af7f-ceffc1fac83b.jpg" alt="" class="wp-image-5270" style="aspect-ratio:1.4992888417882142;width:621px;height:auto" srcset="https://jouniorsankosodate.com/wp-content/uploads/2026/04/139432c3-cc23-44b2-af7f-ceffc1fac83b.jpg 1000w, https://jouniorsankosodate.com/wp-content/uploads/2026/04/139432c3-cc23-44b2-af7f-ceffc1fac83b-300x200.jpg 300w, https://jouniorsankosodate.com/wp-content/uploads/2026/04/139432c3-cc23-44b2-af7f-ceffc1fac83b-768x512.jpg 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></figure>



<p class="wp-block-paragraph">英語で「2つ以上あるよ！」って言いたいときは👇<br>👉 <strong>単語を複数形にする</strong>だけ！</p>



<p class="wp-block-paragraph">たとえば👇</p>



<ul class="wp-block-list">
<li>dog → dogs</li>



<li>cat → cats</li>
</ul>



<h2 class="wp-block-heading"><span id="toc1">🐙これだけ覚えておけばOK！</span></h2>



<figure class="wp-block-image size-full is-resized"><img decoding="async" width="1000" height="667" src="https://jouniorsankosodate.com/wp-content/uploads/2026/04/b6eef12aa1e03835e6c20a35812d9e98.jpg" alt="" class="wp-image-4655" style="aspect-ratio:1.5;width:695px;height:auto" srcset="https://jouniorsankosodate.com/wp-content/uploads/2026/04/b6eef12aa1e03835e6c20a35812d9e98.jpg 1000w, https://jouniorsankosodate.com/wp-content/uploads/2026/04/b6eef12aa1e03835e6c20a35812d9e98-300x200.jpg 300w, https://jouniorsankosodate.com/wp-content/uploads/2026/04/b6eef12aa1e03835e6c20a35812d9e98-768x512.jpg 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></figure>



<p class="wp-block-paragraph">👉 複数形はこの3つ👇</p>



<p class="wp-block-paragraph">✔ そのまま <strong>s</strong><br>👉 dog → dogs</p>



<p class="wp-block-paragraph">✔ s・sh・ch・x・o は <strong>es</strong><br>👉 box → boxes</p>



<p class="wp-block-paragraph">✔ 子音 + y は <strong>ies</strong><br>👉 baby → babies</p>



<h2 class="wp-block-heading"><span id="toc2">🐙ポイント</span></h2>



<p class="wp-block-paragraph"><span class="fz-24px">👉 <strong>ほぼ動詞のs</strong></span><span class="fz-24px"><strong>がつく</strong></span><span class="fz-24px"><strong>ルールと同じ！</strong></span></p>



<h2 class="wp-block-heading"><span id="toc3">🐙おさらい（動詞のとき）</span></h2>



<p class="wp-block-paragraph">👉 he / she / it のとき</p>



<ul class="wp-block-list">
<li>pla<span class="bold-red">y</span> → plays</li>



<li>wat<span class="bold-red">ch</span> → watches</li>



<li>stu<span class="bold-red">dy</span> → studies</li>
</ul>



<p class="wp-block-paragraph">👉 ルール同じ</p>



<h2 class="wp-block-heading"><span id="toc4">🐙でも注意！</span></h2>



<p class="wp-block-paragraph">👉 ちがうやつもいる</p>



<ul class="wp-block-list">
<li>child → children</li>



<li>foot → feet</li>



<li>man → men</li>
</ul>



<p class="wp-block-paragraph"><span class="fz-24px">👉 これは<strong>特別ルール（そのまま覚える）</strong></span></p>



<h2 class="wp-block-heading"><span id="toc5">🐙よくあるミス</span></h2>



<p class="wp-block-paragraph">❌ boxs<br>⭕ boxes</p>



<p class="wp-block-paragraph">❌ babys<br>⭕ babies</p>



<p class="wp-block-paragraph">❌ childs<br>⭕ children</p>



<h2 class="wp-block-heading"><span id="toc6">🐙まとめ</span></h2>



<p class="wp-block-paragraph">👉 まずはこれ👇</p>



<p class="wp-block-paragraph"><strong>s・es・iesだけ覚えればOK！</strong></p>



<p class="wp-block-paragraph">👉 特別ルールはあとからで大丈夫✨</p>



<h2 class="wp-block-heading"><span id="toc7">🐙タコタのひとこと</span></h2>



<p class="wp-block-paragraph">👉<strong><span class="fz-24px">「2つ以上＝s！」</span></strong></p>



<p class="wp-block-paragraph">これだけ意識できたら、もうバッチリ🐙✨</p>



<style>
.tacota-plural-quiz{
  max-width: 860px;
  margin: 20px auto;
  padding: 18px 14px 24px;
  border-radius: 20px;
  background: linear-gradient(180deg,#fff8f0,#fff0f7);
  box-shadow: 0 8px 20px rgba(0,0,0,.08);
  text-align: center;
  font-family: Arial, sans-serif;
}

.tacota-plural-quiz h2{
  margin: 0 0 8px;
  font-size: 28px;
  color:#ff6fae;
}

.tpq-sub{
  margin: 0 0 14px;
  font-size: 17px;
  font-weight: 700;
  color:#666;
}

.tpq-progress{
  margin: 6px 0 10px;
  font-size: 16px;
  font-weight: 900;
  color:#666;
}

.tpq-question{
  font-size: 28px;
  font-weight: 900;
  margin: 14px 0 18px;
  color:#333;
  line-height: 1.5;
}

.tpq-choices{
  display: grid;
  gap: 12px;
  max-width: 520px;
  margin: 0 auto 14px;
}

.tpq-btn{
  border: none;
  border-radius: 16px;
  padding: 14px 16px;
  font-size: 24px;
  font-weight: 900;
  cursor: pointer;
  background: #ffe082;
  color:#333;
  box-shadow: 0 3px 0 rgba(0,0,0,.08);
}

.tpq-btn:disabled{
  opacity:.78;
  cursor:not-allowed;
}

.tpq-btn.correct{
  background:#b8f2d6;
}

.tpq-btn.wrong{
  background:#ffd0d0;
}

.tpq-result{
  min-height: 38px;
  margin-top: 10px;
  font-size: 24px;
  font-weight: 900;
}

.tpq-explain{
  min-height: 34px;
  margin-top: 6px;
  font-size: 18px;
  font-weight: 800;
  color:#555;
  line-height: 1.6;
}

.tpq-controls{
  margin-top: 14px;
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}

.tpq-cute{
  margin: 4px;
  padding: 12px 18px;
  font-size: 18px;
  border:none;
  border-radius:999px;
  font-weight:900;
  cursor:pointer;
  box-shadow: 0 3px 0 rgba(0,0,0,.08);
}

.tpq-next{ background:#9de2ff; }
.tpq-restart{ background:#ffb6d9; }

.tpq-score{
  margin-top:14px;
  font-size:20px;
  font-weight:900;
  color:#0f6f6f;
}

@media (max-width:640px){
  .tacota-plural-quiz h2{ font-size:24px; }
  .tpq-question{ font-size:24px; }
  .tpq-btn{ font-size:21px; }
  .tpq-result{ font-size:22px; }
  .tpq-explain{ font-size:17px; }
  .tpq-cute{ font-size:16px; padding:10px 14px; }
}
</style>

<div class="tacota-plural-quiz" id="tacotaPluralQuiz">
  <h2><span id="toc8">🐙 複数形3択クイズ</span></h2>
  <p class="tpq-sub">s・es・ies と、children などの特別ルールをチェックしよう！</p>

  <div class="tpq-progress" id="tpqProgress">1 / 13</div>
  <div class="tpq-question" id="tpqQuestion">dog の複数形はどれ？</div>

  <div class="tpq-choices" id="tpqChoices"></div>

  <div class="tpq-result" id="tpqResult"></div>
  <div class="tpq-explain" id="tpqExplain"></div>

  <div class="tpq-controls">
    <button class="tpq-cute tpq-next" id="tpqNextBtn" disabled>👉 次へ</button>
    <button class="tpq-cute tpq-restart" id="tpqRestartBtn">🔁 もう一度</button>
  </div>

  <div class="tpq-score" id="tpqScore">せいかい：0</div>
</div>

<script>
(() => {
  const quizzes = [
    {
      q:"dog の複数形はどれ？",
      choices:["dogs","doges","dogies"],
      answer:"dogs",
      tip:"ふつうはそのまま s をつけるよ。"
    },
    {
      q:"box の複数形はどれ？",
      choices:["boxs","boxes","boxies"],
      answer:"boxes",
      tip:"x で終わるときは es をつけるよ。"
    },
    {
      q:"baby の複数形はどれ？",
      choices:["babys","babies","babyes"],
      answer:"babies",
      tip:"子音 + y は ies に変えるよ。"
    },
    {
      q:"child の複数形はどれ？",
      choices:["childs","children","childes"],
      answer:"children",
      tip:"child → children は特別ルール。"
    },
    {
      q:"foot の複数形はどれ？",
      choices:["foots","feets","feet"],
      answer:"feet",
      tip:"foot → feet も特別ルールだよ。"
    },
    {
      q:"man の複数形はどれ？",
      choices:["mans","men","manes"],
      answer:"men",
      tip:"man → men はそのまま覚えよう。"
    },
    {
      q:"woman の複数形はどれ？",
      choices:["womans","womens","women"],
      answer:"women",
      tip:"woman → women も特別ルール。"
    },
    {
      q:"tooth の複数形はどれ？",
      choices:["tooths","teeth","toothes"],
      answer:"teeth",
      tip:"tooth → teeth はよく出るよ。"
    },
    {
      q:"mouse の複数形はどれ？",
      choices:["mouses","mice","mousees"],
      answer:"mice",
      tip:"mouse → mice も特別ルールだよ。"
    },
    {
      q:"person の複数形はどれ？",
      choices:["persons","people","peoples"],
      answer:"people",
      tip:"person → people はセットで覚えよう。"
    },
    {
      q:"bus の複数形はどれ？",
      choices:["buss","buses","busies"],
      answer:"buses",
      tip:"s で終わるときは es をつけるよ。"
    },
    {
      q:"watch の複数形はどれ？",
      choices:["watchs","watches","watchies"],
      answer:"watches",
      tip:"ch で終わるときは es をつけるよ。"
    },
    {
      q:"toy の複数形はどれ？",
      choices:["toies","toys","toyes"],
      answer:"toys",
      tip:"母音 + y はそのまま s をつけるよ。"
    }
  ];

  const questionEl = document.getElementById("tpqQuestion");
  const choicesEl = document.getElementById("tpqChoices");
  const resultEl = document.getElementById("tpqResult");
  const explainEl = document.getElementById("tpqExplain");
  const progressEl = document.getElementById("tpqProgress");
  const scoreEl = document.getElementById("tpqScore");
  const nextBtn = document.getElementById("tpqNextBtn");
  const restartBtn = document.getElementById("tpqRestartBtn");

  let current = 0;
  let score = 0;
  let answered = false;

  function render(){
    const item = quizzes[current];
    questionEl.textContent = item.q;
    progressEl.textContent = `${current + 1} / ${quizzes.length}`;
    resultEl.textContent = "";
    explainEl.textContent = "";
    nextBtn.disabled = true;
    answered = false;

    choicesEl.innerHTML = "";
    item.choices.forEach(choice => {
      const btn = document.createElement("button");
      btn.className = "tpq-btn";
      btn.type = "button";
      btn.textContent = choice;
      btn.addEventListener("click", () => selectAnswer(choice, btn));
      choicesEl.appendChild(btn);
    });

    if(current === quizzes.length - 1){
      nextBtn.textContent = "🏁 結果を見る";
    } else {
      nextBtn.textContent = "👉 次へ";
    }

    scoreEl.textContent = `せいかい：${score}`;
  }

  function selectAnswer(choice, btn){
    if(answered) return;
    answered = true;

    const item = quizzes[current];
    const buttons = Array.from(choicesEl.querySelectorAll(".tpq-btn"));

    buttons.forEach(b => {
      b.disabled = true;
      if(b.textContent === item.answer){
        b.classList.add("correct");
      }
    });

    if(choice === item.answer){
      btn.classList.add("correct");
      resultEl.textContent = "⭕ せいかい！";
      explainEl.textContent = item.tip;
      score++;
      scoreEl.textContent = `せいかい：${score}`;
    } else {
      btn.classList.add("wrong");
      resultEl.textContent = "❌ ざんねん！";
      explainEl.textContent = `正解は「${item.answer}」だよ。${item.tip}`;
    }

    nextBtn.disabled = false;
  }

  function showFinal(){
    questionEl.textContent = "おしまい！";
    progressEl.textContent = `${quizzes.length} / ${quizzes.length}`;
    choicesEl.innerHTML = "";
    resultEl.textContent = `🎉 ${quizzes.length}もん中 ${score}もん正解！`;
    explainEl.textContent = "もう一度やってみよう！";
    nextBtn.disabled = true;
  }

  nextBtn.addEventListener("click", () => {
    current++;
    if(current >= quizzes.length){
      showFinal();
      return;
    }
    render();
  });

  restartBtn.addEventListener("click", () => {
    current = 0;
    score = 0;
    render();
  });

  render();
})();
</script>



<!-- =========================================
🐙 シリーズナビ（前・次・一覧）
========================================= -->
<div class="takota-series-nav">

  <!-- 前へ -->
  <a class="nav-btn prev" href="https://jouniorsankosodate.com/%f0%9f%90%99%e3%80%90%e3%82%bf%e3%82%b3%e3%82%bf%e3%81%ae%e8%8b%b1%e6%96%87%e3%83%ab%e3%83%bc%e3%83%ab-%e5%ae%8c%e5%85%a8%e7%90%86%e8%a7%a3%e2%91%a5%e3%80%91%e5%91%bd%e4%bb%a4%e6%96%87%e3%81%be/">
    ⬅ 前のレッスン
  </a>

  <!-- 一覧 -->
  <a class="nav-btn list" href="https://jouniorsankosodate.com/rule/">
    📚 一覧に戻る
  </a>

  <!-- 次へ -->
  <a class="nav-btn next" href="https://jouniorsankosodate.com/%f0%9f%90%99%e3%80%90%e3%82%bf%e3%82%b3%e3%82%bf%e3%81%ae%e8%8b%b1%e6%96%87%e3%83%ab%e3%83%bc%e3%83%ab-%e5%ae%8c%e5%85%a8%e7%90%86%e8%a7%a3%e2%91%a7%e3%80%91%e4%bb%a3%e5%90%8d%e8%a9%9e%ef%bc%88i-me/">
    次のレッスン ➡
  </a>

</div>

<style>
.takota-series-nav{
  display:flex;
  gap:10px;
  margin:30px 0;
  flex-wrap:wrap;
}

.nav-btn{
  flex:1;
  text-align:center;
  padding:12px;
  border-radius:14px;
  font-weight:bold;
  text-decoration:none;
  font-size:14px;
  transition:.2s;
  box-shadow:0 4px 8px rgba(0,0,0,0.08);
}

/* 前 */
.nav-btn.prev{
  background:#e0f2fe;
  color:#0369a1;
}

/* 一覧 */
.nav-btn.list{
  background:#fff7ed;
  color:#c2410c;
}

/* 次 */
.nav-btn.next{
  background:#ffe4e6;
  color:#be123c;
}

.nav-btn:hover{
  transform:translateY(-2px);
}
</style>
<p>投稿 <a href="https://jouniorsankosodate.com/%f0%9f%90%99%e3%80%90%e3%82%bf%e3%82%b3%e3%82%bf%e3%81%ae%e8%8b%b1%e6%96%87%e3%83%ab%e3%83%bc%e3%83%ab-%e5%ae%8c%e5%85%a8%e7%90%86%e8%a7%a3%e2%91%a6%e3%80%91%e8%a4%87%e6%95%b0%e5%bd%a2%e3%81%af/">🐙【タコタの英文ルール 完全理解⑦】複数形はこれだけ！s・es・ies＋特別ルールをやさしく解説</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/%f0%9f%90%99%e3%80%90%e3%82%bf%e3%82%b3%e3%82%bf%e3%81%ae%e8%8b%b1%e6%96%87%e3%83%ab%e3%83%bc%e3%83%ab-%e5%ae%8c%e5%85%a8%e7%90%86%e8%a7%a3%e2%91%a6%e3%80%91%e8%a4%87%e6%95%b0%e5%bd%a2%e3%81%af/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>🐙タコタ式スペル練習② 行動・生活（20語）</title>
		<link>https://jouniorsankosodate.com/takota-spell-2-action-life/</link>
					<comments>https://jouniorsankosodate.com/takota-spell-2-action-life/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Thu, 06 Nov 2025 03:19:18 +0000</pubDate>
				<category><![CDATA[🐙英単語スペル練習]]></category>
		<category><![CDATA[🟦 英検3級 英語シリーズ]]></category>
		<category><![CDATA[🟩 英検4級 英語シリーズ]]></category>
		<category><![CDATA[#スペル練習]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[#英作文]]></category>
		<category><![CDATA[#英単語スペル練習]]></category>
		<category><![CDATA[#英単語学習]]></category>
		<category><![CDATA[#英検3級]]></category>
		<category><![CDATA[＃英検４級]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<category><![CDATA[#英語学習アプリ]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=1773</guid>

					<description><![CDATA[<p>英語学習シリーズ： 📗5級フラッシュ 📘4級フラッシュ 🏫中学英単語 🐙タコタ式スペル練習 💬タコタ英語レッスン タコタ式スペル練習② 行動・生活（20語） go, play, study など “毎日の行動”を表す基本 [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/takota-spell-2-action-life/">🐙タコタ式スペル練習② 行動・生活（20語）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<!-- 🔗 英語学習シリーズ 回遊ナビ（パンくず風） -->
<style>
.series-nav-wrap{
  max-width:920px;margin:18px auto 14px;padding:8px 10px;
  background:#f8fafc;border-radius:999px;
  box-shadow:0 2px 6px rgba(0,0,0,.04);
  font-size:12px;color:#475569;
}
.series-nav-label{
  font-weight:700;margin-right:6px;
  display:inline-flex;align-items:center;gap:4px;
}
.series-nav-label::before{content:"🚩";}
.series-nav-links{
  display:inline-flex;flex-wrap:wrap;gap:6px;
}
.series-nav-link{
  padding:4px 10px;border-radius:999px;
  background:#e5e7eb;text-decoration:none;
  color:#334155;display:inline-flex;align-items:center;gap:4px;
  transition:all .2s ease;
}
.series-nav-link span{font-size:14px;}
.series-nav-link:hover,
.series-nav-link:focus-visible{
  background:#dbeafe;color:#1f2937;
}
.series-nav-link.is-current{
  background:#bfdbfe;font-weight:700;color:#111827;
}
@media(max-width:480px){
  .series-nav-wrap{border-radius:16px;font-size:11px;}
}

/* 🔙 戻るボタン共通 */
.series-back-wrap{margin:18px 0 8px;text-align:center;}
.series-back-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border-radius:999px;
  background:linear-gradient(135deg,#e0f2fe,#cffafe);
  color:#0f172a;font-weight:700;font-size:14px;text-decoration:none;
  box-shadow:0 3px 8px rgba(0,0,0,.08);
  transition:all .28s cubic-bezier(.22,.61,.36,1);
}
.series-back-btn span{font-size:18px;}
.series-back-btn:hover,
.series-back-btn:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 8px 14px rgba(0,0,0,.12);
  background:linear-gradient(135deg,#dbeafe,#bae6fd);
}
@media(max-width:480px){
  .series-back-btn{width:100%;font-size:15px;padding:12px 18px;}
}

/* ⏮⏭ レッスン前後ナビ */
.lesson-nav{
  display:flex;justify-content:center;gap:10px;
  margin:26px 0 6px;flex-wrap:wrap;
}
.lesson-nav a{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border-radius:999px;
  background:#06b6d4;color:#fff;font-weight:700;
  text-decoration:none;font-size:14px;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
  transition:.2s;
}
.lesson-nav a:hover{transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,.18);}
</style>

<div class="series-nav-wrap">
  <span class="series-nav-label">英語学習シリーズ：</span>
  <div class="series-nav-links">
    <a class="series-nav-link" href="https://jouniorsankosodate.com/eiken5-flash/"><span>📗</span>5級フラッシュ</a>
    <a class="series-nav-link" href="https://jouniorsankosodate.com/eiken4-series/"><span>📘</span>4級フラッシュ</a>
    <a class="series-nav-link" href="https://jouniorsankosodate.com/junior-flash-list/"><span>🏫</span>中学英単語</a>
    <a class="series-nav-link is-current" href="https://jouniorsankosodate.com/takota-spell/"><span>🐙</span>タコタ式スペル練習</a>
    <a class="series-nav-link" href="https://jouniorsankosodate.com/takota-lesson/"><span>💬</span>タコタ英語レッスン</a>
  </div>
</div>

<!-- 💚 タイトル・説明 -->
<div class="takota-desc" style="max-width:820px;margin:0 auto 18px;padding:16px 18px;background:#f0fdf4;border:2px solid #86efac;border-radius:14px;">
  <div style="display:flex;align-items:center;gap:10px;margin-bottom:8px;">
    <img decoding="async" src="https://jouniorsankosodate.com/wp-content/uploads/2025/11/5dca7321798b10fda919243235cffbda.jpg" alt="タコタ" style="width:58px;height:auto;border-radius:50%;">
    <h2 style="font-weight:900;font-size:1.4em;margin:0;">タコタ式スペル練習② 行動・生活（20語）</h2>
  </div>
  <p style="margin:0;line-height:1.8;font-size:15px;">
    go, play, study など “毎日の行動”を表す基本動詞20語。<br>
    「自分の一日」「週末の過ごし方」を書ける力をタコタと一緒に育てよう🐙🚶
  </p>
</div>

<!-- 🎧 タコタ音声 -->
<script>
let TAKOTA_VOICE=null;
function pickTakotaVoice(){
  const v=speechSynthesis.getVoices()||[];
  const pref=["en-US","en-GB","en-AU","en-CA","en-IN"];
  return v.find(x=>pref.includes(x.lang))
      || v.find(x=>(x.lang||"").startsWith("en"))
      || null;
}
if("speechSynthesis"in window){
  speechSynthesis.addEventListener("voiceschanged",()=>{TAKOTA_VOICE=pickTakotaVoice();});
}
function speakTakota(t){
  if(!("speechSynthesis"in window))return;
  if(!TAKOTA_VOICE)TAKOTA_VOICE=pickTakotaVoice();
  const u=new SpeechSynthesisUtterance(t);
  if(TAKOTA_VOICE){u.voice=TAKOTA_VOICE;u.lang=TAKOTA_VOICE.lang||"en-US";}
  else u.lang="en-US";
  u.rate=0.95;u.pitch=1.0;
  speechSynthesis.cancel();speechSynthesis.speak(u);
}
</script>

<!-- 🐙 スペル練習② 本体 -->
<div class="takota-strict" id="takotaStrict2">
  <style>
    .takota-strict{--ink:#111;--muted:#667;--bg:#f6f7fb;--card:#fff;--accent:#06b6d4;--ok:#16a34a;--ng:#ef4444}
    .takota-strict{max-width:820px;margin:16px auto;padding:16px;background:var(--bg);border-radius:16px;color:var(--ink);}
    .tk-card{background:var(--card);border-radius:16px;padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.06);}
    .tk-head{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;}
    .tk-title{font-size:clamp(18px,2.6vw,22px);font-weight:900;margin:0;}
    .tk-problem{font-size:clamp(20px,2.8vw,24px);font-weight:900;margin:6px 0 0;}
    .tk-wordprev{font-size:clamp(18px,2.6vw,22px);margin-top:6px;font-weight:800;opacity:.95;}
    .tk-ime{font-size:13px;color:#b91c1c;display:none;margin-top:6px;}
    .tk-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
    .tk-slots{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0;}
    .tk-slot{width:46px;height:54px;border:2px solid #e5e7eb;border-radius:12px;
      display:grid;place-items:center;font-size:24px;font-weight:800;}
    .tk-slot.filled{border-color:#cbd5e1;background:#ffffff;}
    .tk-slot.error{border-color:var(--ng);animation:shake .18s linear 0s 2;}
    @keyframes shake{
      0%,100%{transform:translateX(0);}
      25%{transform:translateX(-2px);}
      50%{transform:translateX(2px);}
      75%{transform:translateX(-2px);}
    }
    .tk-keys{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0;}
    .tk-key{padding:10px 12px;border-radius:10px;border:1px solid #e5e7eb;
      background:#fff;font-weight:800;cursor:pointer;}
    .tk-key[disabled]{opacity:.5;cursor:not-allowed;}
    .tk-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;}
    .tk-btn{padding:10px 14px;border-radius:12px;border:0;
      background:var(--accent);color:#fff;font-weight:800;cursor:pointer;}
    .tk-btn.ghost{background:#fff;color:#111;border:1px solid #e5e7eb;}
    .tk-btn.warn{background:#f59e0b;}
    .tk-btn.ok{background:var(--ok);}
    .tk-msg{font-weight:800;margin:8px 0;}
    .tk-msg.ok{color:var(--ok);}
    .tk-msg.ng{color:var(--ng);}
    .tk-progress{height:8px;background:#e5e7eb;border-radius:999px;
      overflow:hidden;margin-top:10px;}
    .tk-bar{height:100%;width:0;background:var(--accent);}
    .tk-mini{font-size:12px;color:var(--muted);}
  </style>

  <div class="tk-card">
    <div class="tk-head">
      <div>
        <div class="tk-title">タコタ式スペル練習② 行動・生活</div>
        <div class="tk-problem" id="tkProblem2">問題：—</div>
        <div class="tk-wordprev" id="tkWordPrev2"></div>
        <div class="tk-ime" id="tkImeWarn2">※ 日本語入力かも。キーボードを<strong>半角英数</strong>にしてね。</div>
      </div>
      <div class="tk-row">
        <button class="tk-btn ghost" id="speakBtn2">🔊 読む</button>
        <button class="tk-btn ghost" id="revealBtn2">🙈 隠す</button>
        <button class="tk-btn ghost" id="hintBtn2">ヒント</button>
        <button class="tk-btn warn" id="resetBtn2">リセット</button>
        <button class="tk-btn" id="restartBtn2" style="background:#334155">はじめから</button>
      </div>
    </div>

    <div class="tk-slots" id="slots2"></div>
    <div class="tk-keys" id="keys2"></div>

    <div class="tk-btns">
      <button class="tk-btn ghost" id="skipBtn2">スキップ</button>
      <button class="tk-btn ok" id="nextBtn2" disabled>つぎへ</button>
    </div>

    <div class="tk-msg" id="tkMsg2"></div>
    <div class="tk-progress"><div class="tk-bar" id="bar2"></div></div>
    <div class="tk-mini"><span id="count2">0</span> / <span id="total2">0</span></div>
  </div>
</div>

<script>
(() => {
  const WORDS = [
    {word:"go",jp:"行く"},{word:"come",jp:"来る"},{word:"play",jp:"遊ぶ／（スポーツを）する"},
    {word:"study",jp:"勉強する"},{word:"make",jp:"作る"},{word:"take",jp:"取る／連れていく"},
    {word:"do",jp:"する"},{word:"have",jp:"持っている／食べる"},{word:"eat",jp:"食べる"},
    {word:"drink",jp:"飲む"},{word:"read",jp:"読む"},{word:"watch",jp:"見る"},
    {word:"listen",jp:"聞く"},{word:"write",jp:"書く"},{word:"open",jp:"開ける"},
    {word:"close",jp:"閉める"},{word:"start",jp:"始める"},{word:"finish",jp:"終える"},
    {word:"visit",jp:"訪れる"},{word:"work",jp:"働く／作動する"}
  ];
  const REVEAL=true; const KEY='takota_strict_set2_v2';
  const speak = speakTakota;

  const $=id=>document.getElementById(id);
  const tkProblem=$('tkProblem2'),tkWordPrev=$('tkWordPrev2'),tkImeWarn=$('tkImeWarn2');
  const slotsEl=$('slots2'),keysEl=$('keys2');
  const hintBtn=$('hintBtn2'),resetBtn=$('resetBtn2'),restartBtn=$('restartBtn2');
  const nextBtn=$('nextBtn2'),skipBtn=$('skipBtn2'),speakBtn=$('speakBtn2'),revealBtn=$('revealBtn2');
  const tkMsg=$('tkMsg2'),bar=$('bar2'),count=$('count2'),total=$('total2');

  let state;try{state=JSON.parse(localStorage.getItem(KEY))||{i:0,reveal:REVEAL}}catch(_){state={i:0,reveal:REVEAL}}
  if(state.i>=WORDS.length)state.i=0;
  let cur=null,idx=0,locked=[],inputs=[];

  function prog(solved=false){
    total.textContent=WORDS.length;
    if(solved&&state.i===WORDS.length-1){
      count.textContent=WORDS.length;bar.style.width='100%';return;
    }
    count.textContent=Math.min(state.i+1,WORDS.length);
    bar.style.width=Math.round((state.i/WORDS.length)*100)+'%';
  }
  function slots(w){
    slotsEl.innerHTML='';inputs=[];
    locked=Array.from({length:w.length},()=> '');
    for(let i=0;i<w.length;i++){
      const el=document.createElement('div');
      el.className='tk-slot';el.textContent='•';
      el.addEventListener('click',()=>{idx=i;active();});
      slotsEl.appendChild(el);inputs.push(el);
    }
    idx=0;active();
  }
  function active(){
    inputs.forEach((el,i)=>{el.style.outline=(i===idx)?'3px solid rgba(14,165,233,.35)':'none';});
  }
  function keys(w){
    keysEl.innerHTML='';
    [...new Set(w.toLowerCase().split(''))].sort().forEach(ch=>{
      const b=document.createElement('button');
      b.className='tk-key';b.textContent=ch;
      b.addEventListener('click',()=>put(ch));
      keysEl.appendChild(b);
    });
  }
  function preview(){
    if(state.reveal){tkWordPrev.textContent=cur.word;revealBtn.textContent='🙈 隠す';}
    else{tkWordPrev.textContent='•'.repeat(cur.word.length);revealBtn.textContent='👁 単語表示';}
  }
  function show(i){
    cur=WORDS[i];
    tkProblem.textContent='問題：'+cur.jp;
    tkMsg.textContent='';
    slots(cur.word);keys(cur.word);preview();
    nextBtn.disabled=true;prog(false);
  }
  function done(){
    if(locked.join('')===cur.word.toLowerCase()){
      tkMsg.textContent='🎉 正解！ Good job!';
      tkMsg.className='tk-msg ok';
      nextBtn.disabled=false;prog(true);return true;
    }
    return false;
  }
  function put(chRaw){
    const t=cur.word.toLowerCase();
    if(idx>=t.length)return;
    const ch=(chRaw||'').toLowerCase();
    const exp=t[idx];
    if(ch===exp){
      locked[idx]=exp;
      inputs[idx].textContent=exp;
      inputs[idx].classList.add('filled');
      idx=Math.min(idx+1,t.length-1);
      active();tkImeWarn.style.display='none';
      done();
    }else{
      inputs[idx].classList.add('error');
      setTimeout(()=>inputs[idx].classList.remove('error'),220);
      tkMsg.textContent='❌ ちがうよ';
      tkMsg.className='tk-msg ng';
    }
  }
  document.addEventListener('keydown',e=>{
    if(!cur)return;
    const k=e.key;
    if(k==='Backspace'){
      if(locked[idx]){
        locked[idx]='';
        inputs[idx].textContent='•';
        inputs[idx].classList.remove('filled');
        tkMsg.textContent='';
      }else if(idx>0){
        idx--;active();
        locked[idx]='';
        inputs[idx].textContent='•';
        inputs[idx].classList.remove('filled');
      }
      e.preventDefault();return;
    }
    if(k.length===1){
      if(!/[a-zA-Z]/.test(k)){
        tkImeWarn.style.display='block';return;
      }
      tkImeWarn.style.display='none';
      put(k);e.preventDefault();return;
    }
    if(k==='Enter'&&!nextBtn.disabled){next();}
  });
  function reset(){slots(cur.word);tkMsg.textContent='';nextBtn.disabled=true;}
  function restart(){state.i=0;save();show(state.i);}
  function hint(){
    const t=cur.word.toLowerCase();
    const n=t.length>=6?2:1;
    for(let i=0;i<n;i++){
      if(!locked[i]){idx=i;active();put(t[i]);}
    }
  }
  function skip(){show(state.i);save();}
  function next(){
    state.i++;save();
    if(state.i>=WORDS.length){
      tkMsg.textContent='🎉 全問クリア！おめでとう！';
      tkMsg.className='tk-msg ok';
      nextBtn.disabled=true;
      count.textContent=WORDS.length;
      bar.style.width='100%';return;
    }
    show(state.i);
  }
  function save(){localStorage.setItem(KEY,JSON.stringify(state));}

  hintBtn.addEventListener('click',hint);
  resetBtn.addEventListener('click',reset);
  restartBtn.addEventListener('click',restart);
  skipBtn.addEventListener('click',skip);
  nextBtn.addEventListener('click',next);
  speakBtn.addEventListener('click',()=>speak(cur.word));
  revealBtn.addEventListener('click',()=>{
    state.reveal=!state.reveal;save();preview();
  });

  show(state.i);
})();
</script>

<!-- ⏮⏭ 前後レッスンナビ＋一覧 -->
<div class="lesson-nav">
  <a href="https://jouniorsankosodate.com/takota-spell-1-feelings-thoughts/">← レッスン① 感情・思考へ</a>
  <a href="https://jouniorsankosodate.com/takota-spell-3-school-family/">▶ レッスン③ 学校・友達へ</a>
</div>
<div class="series-back-wrap">
  <a class="series-back-btn" href="https://jouniorsankosodate.com/takota-spell/">
    <span>🐙</span>タコタ式スペル練習 一覧にもどる
  </a>
</div>

<p>投稿 <a href="https://jouniorsankosodate.com/takota-spell-2-action-life/">🐙タコタ式スペル練習② 行動・生活（20語）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/takota-spell-2-action-life/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>🐙 タコタ式スペル練習⑤ つなぎ・前置詞・形容詞（20語）</title>
		<link>https://jouniorsankosodate.com/takota-spell-5-link-prep-adj/</link>
					<comments>https://jouniorsankosodate.com/takota-spell-5-link-prep-adj/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Thu, 06 Nov 2025 03:18:58 +0000</pubDate>
				<category><![CDATA[🐙英単語スペル練習]]></category>
		<category><![CDATA[🟦 英検3級 英語シリーズ]]></category>
		<category><![CDATA[🟩 英検4級 英語シリーズ]]></category>
		<category><![CDATA[#スペル練習]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[#英作文]]></category>
		<category><![CDATA[#英単語スペル練習]]></category>
		<category><![CDATA[#英単語学習]]></category>
		<category><![CDATA[#英検3級]]></category>
		<category><![CDATA[＃英検４級]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<category><![CDATA[#英語学習アプリ]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=1776</guid>

					<description><![CDATA[<p>英語学習シリーズ： 📗5級フラッシュ 📘4級フラッシュ 🏫中学英単語 🐙タコタ式スペル練習 💬タコタ英語レッスン タコタ式スペル練習⑤ つなぎ・前置詞・形容詞（20語） 文と文をつなぐ語・前置詞・よく使う形容詞20語。  [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/takota-spell-5-link-prep-adj/">🐙 タコタ式スペル練習⑤ つなぎ・前置詞・形容詞（20語）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<!-- 🐙タコタ式スペル練習⑤ つなぎ・前置詞・形容詞（20語） -->

<!-- 🔗 英語学習シリーズ 回遊ナビ（パンくず風） -->
<!-- 🧩 タコタ式共通ボタンスタイル -->
<style>
.tk-btn{
  appearance:none;
  border:none;
  border-radius:999px;
  padding:10px 16px;
  font-weight:700;
  font-size:14px;
  cursor:pointer;
  background:#fff;
  color:#111;
  transition:all .25s ease;
  box-shadow:0 2px 6px rgba(0,0,0,.05);
}
.tk-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 10px rgba(0,0,0,.08);
}
.tk-btn.ghost{
  background:#fff;
  border:1px solid #e5e7eb;
}
.tk-btn.warn{
  background:#fee2e2;
  color:#991b1b;
}
.tk-btn.ok{
  background:#16a34a;
  color:#fff;
}
.tk-btn:disabled{
  opacity:0.5;
  cursor:not-allowed;
}
</style>

<style>
.series-nav-wrap{
  max-width:920px;margin:18px auto 14px;padding:8px 10px;
  background:#f8fafc;border-radius:999px;
  box-shadow:0 2px 6px rgba(0,0,0,.04);
  font-size:12px;color:#475569;
}
.series-nav-label{font-weight:700;margin-right:6px;display:inline-flex;align-items:center;gap:4px;}
.series-nav-label::before{content:"🚩";}
.series-nav-links{display:inline-flex;flex-wrap:wrap;gap:6px;}
.series-nav-link{
  padding:4px 10px;border-radius:999px;background:#e5e7eb;text-decoration:none;
  color:#334155;display:inline-flex;align-items:center;gap:4px;transition:all .2s ease;
}
.series-nav-link span{font-size:14px;}
.series-nav-link:hover,.series-nav-link:focus-visible{background:#dbeafe;color:#1f2937;}
.series-nav-link.is-current{background:#bfdbfe;font-weight:700;color:#111827;}
@media(max-width:480px){.series-nav-wrap{border-radius:16px;font-size:11px;}}

/* 🔙 戻るボタン共通 */
.series-back-wrap{margin:18px 0 8px;text-align:center;}
.series-back-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border-radius:999px;
  background:linear-gradient(135deg,#e0f2fe,#cffafe);
  color:#0f172a;font-weight:700;font-size:14px;text-decoration:none;
  box-shadow:0 3px 8px rgba(0,0,0,.08);
  transition:all .28s cubic-bezier(.22,.61,.36,1);
}
.series-back-btn span{font-size:18px;}
.series-back-btn:hover,.series-back-btn:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 8px 14px rgba(0,0,0,.12);
  background:linear-gradient(135deg,#dbeafe,#bae6fd);
}
@media(max-width:480px){.series-back-btn{width:100%;font-size:15px;padding:12px 18px;}}

/* ⏮⏭ レッスン前後ナビ */
.lesson-nav{display:flex;justify-content:center;gap:10px;margin:26px 0 6px;flex-wrap:wrap;}
.lesson-nav a{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border-radius:999px;
  background:#06b6d4;color:#fff;font-weight:700;text-decoration:none;font-size:14px;
  box-shadow:0 2px 8px rgba(0,0,0,.15);transition:.2s;
}
.lesson-nav a:hover{transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,.18);}
</style>

<div class="series-nav-wrap">
  <span class="series-nav-label">英語学習シリーズ：</span>
  <div class="series-nav-links">
    <a class="series-nav-link" href="https://jouniorsankosodate.com/eiken5-flash/"><span>📗</span>5級フラッシュ</a>
    <a class="series-nav-link" href="https://jouniorsankosodate.com/eiken4-series/"><span>📘</span>4級フラッシュ</a>
    <a class="series-nav-link" href="https://jouniorsankosodate.com/junior-flash-list/"><span>🏫</span>中学英単語</a>
    <a class="series-nav-link is-current" href="https://jouniorsankosodate.com/takota-spell/"><span>🐙</span>タコタ式スペル練習</a>
    <a class="series-nav-link" href="https://jouniorsankosodate.com/takota-lesson/"><span>💬</span>タコタ英語レッスン</a>
  </div>
</div>

<!-- 💚 タイトル・説明 -->
<div class="takota-desc" style="max-width:820px;margin:0 auto 18px;padding:16px 18px;background:#f0fdf4;border:2px solid #86efac;border-radius:14px;">
  <div style="display:flex;align-items:center;gap:10px;margin-bottom:8px;">
    <img decoding="async" src="https://jouniorsankosodate.com/wp-content/uploads/2025/11/5dca7321798b10fda919243235cffbda.jpg" alt="タコタ" style="width:58px;height:auto;border-radius:50%;">
    <h2 style="font-weight:900;font-size:1.4em;margin:0;">タコタ式スペル練習⑤ つなぎ・前置詞・形容詞（20語）</h2>
  </div>
  <p style="margin:0;line-height:1.8;font-size:15px;">
    文と文をつなぐ語・前置詞・よく使う形容詞20語。<br>
    because, with, important など、英検3級の英作文で「文をふくらませる」カギになる語をおさえよう✏️
  </p>
</div>

<!-- 🎧 タコタ音声（共通ロジック） -->
<script>
let TAKOTA_VOICE=null;
function pickTakotaVoice(){
  const v=speechSynthesis.getVoices()||[];
  const pref=["en-US","en-GB","en-AU","en-CA","en-IN"];
  return v.find(x=>pref.includes(x.lang))
      || v.find(x=>(x.lang||"").startsWith("en"))
      || null;
}
if("speechSynthesis"in window){
  speechSynthesis.addEventListener("voiceschanged",()=>{TAKOTA_VOICE=pickTakotaVoice();});
}
function speakTakota(t){
  if(!("speechSynthesis"in window))return;
  if(!TAKOTA_VOICE)TAKOTA_VOICE=pickTakotaVoice();
  const u=new SpeechSynthesisUtterance(t);
  if(TAKOTA_VOICE){u.voice=TAKOTA_VOICE;u.lang=TAKOTA_VOICE.lang||"en-US";}
  else u.lang="en-US";
  u.rate=0.95;u.pitch=1.0;
  speechSynthesis.cancel();speechSynthesis.speak(u);
}
</script>

<!-- 🐙 スペル練習⑤ 本体 -->
<script>
(() => {
  const WORDS = [
    {word:"because",jp:"〜だから"},{word:"and",jp:"そして"},{word:"but",jp:"しかし"},
    {word:"so",jp:"だから／それで"},{word:"then",jp:"それから"},{word:"in",jp:"〜の中に／で"},
    {word:"on",jp:"〜の上に／で"},{word:"at",jp:"〜で（場所・時刻）"},{word:"to",jp:"〜へ／〜に"},
    {word:"from",jp:"〜から"},{word:"for",jp:"〜のために"},{word:"with",jp:"〜といっしょに"},
    {word:"about",jp:"〜について"},{word:"by",jp:"〜で（手段）／そばに"},{word:"happy",jp:"うれしい"},
    {word:"busy",jp:"いそがしい"},{word:"fun",jp:"楽しい（名詞/形容）"},{word:"interesting",jp:"おもしろい"},
    {word:"favorite",jp:"いちばん好きな"},{word:"important",jp:"大切な"}
  ];
  const REVEAL=true;const KEY='takota_strict_set5_v1';
  const speak=speakTakota;

  const $=id=>document.getElementById(id);
  document.write(`
  <div class="takota-strict" id="takotaStrict5" style="max-width:820px;margin:16px auto;padding:16px;background:#f6f7fb;border-radius:16px;color:#111;">
    <div class="tk-card" style="background:#fff;border-radius:16px;padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.06);">
      <div class="tk-head" style="display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;">
        <div>
          <div class="tk-title" style="font-weight:900;font-size:22px;">タコタ式スペル練習⑤ つなぎ・前置詞・形容詞</div>
          <div class="tk-problem" id="tkProblem5" style="font-weight:900;font-size:24px;">問題：—</div>
          <div class="tk-wordprev" id="tkWordPrev5" style="font-weight:800;font-size:22px;opacity:.95;"></div>
          <div class="tk-ime" id="tkImeWarn5" style="font-size:13px;color:#b91c1c;display:none;margin-top:6px;">※日本語入力かも。<strong>半角英数</strong>にしてね。</div>
        </div>
        <div class="tk-row" style="display:flex;gap:10px;flex-wrap:wrap;">
          <button class="tk-btn ghost" id="speakBtn5">🔊読む</button>
          <button class="tk-btn ghost" id="revealBtn5">🙈隠す</button>
          <button class="tk-btn ghost" id="hintBtn5">ヒント</button>
          <button class="tk-btn warn" id="resetBtn5">リセット</button>
          <button class="tk-btn" id="restartBtn5" style="background:#334155;color:#fff;">はじめから</button>
        </div>
      </div>
      <div class="tk-slots" id="slots5" style="display:flex;gap:10px;flex-wrap:wrap;margin:14px 0;"></div>
      <div class="tk-keys" id="keys5" style="display:flex;flex-wrap:wrap;gap:8px;margin:8px 0;"></div>
      <div class="tk-btns" style="display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;">
        <button class="tk-btn ghost" id="skipBtn5">スキップ</button>
        <button class="tk-btn ok" id="nextBtn5" style="background:#16a34a;" disabled>つぎへ</button>
      </div>
      <div class="tk-msg" id="tkMsg5" style="font-weight:800;margin:8px 0;"></div>
      <div class="tk-progress" style="height:8px;background:#e5e7eb;border-radius:999px;overflow:hidden;margin-top:10px;">
        <div class="tk-bar" id="bar5" style="height:100%;width:0;background:#06b6d4;"></div>
      </div>
      <div class="tk-mini" style="font-size:12px;color:#667;"> <span id="count5">0</span> / <span id="total5">0</span> </div>
    </div>
  </div>`);

  let state;try{state=JSON.parse(localStorage.getItem(KEY))||{i:0,reveal:REVEAL}}catch(_){state={i:0,reveal:REVEAL}}
  if(state.i>=WORDS.length)state.i=0;
  let cur=null,idx=0,locked=[],inputs=[];

  function prog(solved=false){
    const c=$("count5"),t=$("total5"),b=$("bar5");
    t.textContent=WORDS.length;
    if(solved&&state.i===WORDS.length-1){c.textContent=WORDS.length;b.style.width='100%';return;}
    c.textContent=Math.min(state.i+1,WORDS.length);
    b.style.width=Math.round((state.i/WORDS.length)*100)+'%';
  }
  function slots(w){
    const s=$("slots5");s.innerHTML='';inputs=[];
    locked=Array.from({length:w.length},()=>'');
    for(let i=0;i<w.length;i++){
      const el=document.createElement("div");
      el.className="tk-slot";
      el.style.cssText="width:46px;height:54px;border:2px solid #e5e7eb;border-radius:12px;display:grid;place-items:center;font-size:24px;font-weight:800;";
      el.textContent='•';
      el.addEventListener('click',()=>{idx=i;active();});
      s.appendChild(el);inputs.push(el);
    }
    idx=0;active();
  }
  function active(){
    inputs.forEach((el,i)=>{el.style.outline=(i===idx)?'3px solid rgba(14,165,233,.35)':'none';});
  }
  function keys(w){
    const k=$("keys5");k.innerHTML='';
    [...new Set(w.toLowerCase().split(''))].sort().forEach(ch=>{
      const b=document.createElement("button");
      b.className="tk-key";b.textContent=ch;
      b.style.cssText="padding:10px 12px;border-radius:10px;border:1px solid #e5e7eb;background:#fff;font-weight:800;cursor:pointer;";
      b.addEventListener('click',()=>put(ch));
      k.appendChild(b);
    });
  }
  function preview(){
    const w=$("tkWordPrev5"),r=$("revealBtn5");
    if(state.reveal){w.textContent=cur.word;r.textContent='🙈隠す';}
    else{w.textContent='•'.repeat(cur.word.length);r.textContent='👁単語表示';}
  }
  function show(i){
    cur=WORDS[i];
    $("tkProblem5").textContent='問題：'+cur.jp;
    $("tkMsg5").textContent='';
    slots(cur.word);keys(cur.word);preview();
    $("nextBtn5").disabled=true;
    prog(false);
  }
  function done(){
    if(locked.join('')===cur.word.toLowerCase()){
      $("tkMsg5").textContent='🎉 正解！Good job!';
      $("tkMsg5").style.color='#16a34a';
      $("nextBtn5").disabled=false;
      prog(true);
      return true;
    }
    return false;
  }
  function put(chRaw){
    const t=cur.word.toLowerCase();
    if(idx>=t.length)return;
    const ch=(chRaw||'').toLowerCase();
    const exp=t[idx];
    if(ch===exp){
      locked[idx]=exp;
      inputs[idx].textContent=exp;
      inputs[idx].classList.add('filled');
      idx=Math.min(idx+1,t.length-1);
      active();
      done();
    }else{
      inputs[idx].style.borderColor='#ef4444';
      setTimeout(()=>inputs[idx].style.borderColor='#e5e7eb',220);
      $("tkMsg5").textContent='❌ちがうよ';
      $("tkMsg5").style.color='#ef4444';
    }
  }
  document.addEventListener("keydown",e=>{
    if(!cur)return;
    const k=e.key;
    if(k==='Backspace'){
      if(locked[idx]){
        locked[idx]='';inputs[idx].textContent='•';
      }else if(idx>0){
        idx--;active();locked[idx]='';inputs[idx].textContent='•';
      }
      e.preventDefault();return;
    }
    if(k.length===1){
      if(!/[a-zA-Z]/.test(k))return;
      put(k);e.preventDefault();return;
    }
    if(k==='Enter'&&!$("nextBtn5").disabled){next();}
  });
  function next(){
    state.i++;save();
    if(state.i>=WORDS.length){
      $("tkMsg5").textContent='🎉 全問クリア！おめでとう！';
      $("tkMsg5").style.color='#16a34a';
      $("nextBtn5").disabled=true;
      return;
    }
    show(state.i);
  }
  function save(){localStorage.setItem(KEY,JSON.stringify(state));}

  $("hintBtn5").addEventListener("click",()=>{
    const t=cur.word.toLowerCase();
    const n=t.length>=6?2:1;
    for(let i=0;i<n;i++){
      if(!locked[i]){idx=i;put(t[i]);}
    }
  });
  $("resetBtn5").addEventListener("click",()=>{slots(cur.word);$("tkMsg5").textContent='';$("nextBtn5").disabled=true;});
  $("restartBtn5").addEventListener("click",()=>{state.i=0;save();show(state.i);});
  $("skipBtn5").addEventListener("click",()=>show(state.i));
  $("nextBtn5").addEventListener("click",next);
  $("speakBtn5").addEventListener("click",()=>speak(cur.word));
  $("revealBtn5").addEventListener("click",()=>{state.reveal=!state.reveal;save();preview();});

  show(state.i);
})();
</script>

<!-- ⏮⏭ 前レッスン＋一覧 -->
<div class="lesson-nav">
  <a href="https://jouniorsankosodate.com/takota-spell-4-time-frequency/">← レッスン④ 時間・頻度・季節へ</a>
  <a href="https://jouniorsankosodate.com/takota-spell/">🐙 全セット一覧を見る</a>
</div>
<div class="series-back-wrap">
  <a class="series-back-btn" href="https://jouniorsankosodate.com/takota-spell/">
    <span>🐙</span>タコタ式スペル練習 一覧にもどる
  </a>
</div>

<p>投稿 <a href="https://jouniorsankosodate.com/takota-spell-5-link-prep-adj/">🐙 タコタ式スペル練習⑤ つなぎ・前置詞・形容詞（20語）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/takota-spell-5-link-prep-adj/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>🐙 タコタ式スペル練習④ 時間・頻度・季節（20語）</title>
		<link>https://jouniorsankosodate.com/takota-spell-4-time-frequency/</link>
					<comments>https://jouniorsankosodate.com/takota-spell-4-time-frequency/#respond</comments>
		
		<dc:creator><![CDATA[じゅにさん]]></dc:creator>
		<pubDate>Thu, 06 Nov 2025 03:18:55 +0000</pubDate>
				<category><![CDATA[🐙英単語スペル練習]]></category>
		<category><![CDATA[🟦 英検3級 英語シリーズ]]></category>
		<category><![CDATA[🟩 英検4級 英語シリーズ]]></category>
		<category><![CDATA[#スペル練習]]></category>
		<category><![CDATA[＃無料アプリ]]></category>
		<category><![CDATA[#英作文]]></category>
		<category><![CDATA[#英単語スペル練習]]></category>
		<category><![CDATA[#英単語学習]]></category>
		<category><![CDATA[#英検3級]]></category>
		<category><![CDATA[＃英検４級]]></category>
		<category><![CDATA[＃英検５級]]></category>
		<category><![CDATA[#英語学習アプリ]]></category>
		<guid isPermaLink="false">https://jouniorsankosodate.com/?p=1775</guid>

					<description><![CDATA[<p>英語学習シリーズ： 📗5級フラッシュ 📘4級フラッシュ 🏫中学英単語 🐙タコタ式スペル練習 💬タコタ英語レッスン タコタ式スペル練習④ 時間・頻度・季節（20語） 朝・夜・週末・季節など、時間や頻度をあらわす20語。 「 [&#8230;]</p>
<p>投稿 <a href="https://jouniorsankosodate.com/takota-spell-4-time-frequency/">🐙 タコタ式スペル練習④ 時間・頻度・季節（20語）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></description>
										<content:encoded><![CDATA[
<!-- 🔗 英語学習シリーズ 回遊ナビ（パンくず風） -->
<!-- 🧩 タコタ式共通ボタンスタイル -->
<style>
.tk-btn{
  appearance:none;
  border:none;
  border-radius:999px;
  padding:10px 16px;
  font-weight:700;
  font-size:14px;
  cursor:pointer;
  background:#fff;
  color:#111;
  transition:all .25s ease;
  box-shadow:0 2px 6px rgba(0,0,0,.05);
}
.tk-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 10px rgba(0,0,0,.08);
}
.tk-btn.ghost{
  background:#fff;
  border:1px solid #e5e7eb;
}
.tk-btn.warn{
  background:#fee2e2;
  color:#991b1b;
}
.tk-btn.ok{
  background:#16a34a;
  color:#fff;
}
.tk-btn:disabled{
  opacity:0.5;
  cursor:not-allowed;
}
</style>

<style>
.series-nav-wrap{
  max-width:920px;margin:18px auto 14px;padding:8px 10px;
  background:#f8fafc;border-radius:999px;
  box-shadow:0 2px 6px rgba(0,0,0,.04);
  font-size:12px;color:#475569;
}
.series-nav-label{font-weight:700;margin-right:6px;display:inline-flex;align-items:center;gap:4px;}
.series-nav-label::before{content:"🚩";}
.series-nav-links{display:inline-flex;flex-wrap:wrap;gap:6px;}
.series-nav-link{
  padding:4px 10px;border-radius:999px;background:#e5e7eb;text-decoration:none;
  color:#334155;display:inline-flex;align-items:center;gap:4px;transition:all .2s ease;
}
.series-nav-link span{font-size:14px;}
.series-nav-link:hover,.series-nav-link:focus-visible{background:#dbeafe;color:#1f2937;}
.series-nav-link.is-current{background:#bfdbfe;font-weight:700;color:#111827;}
@media(max-width:480px){.series-nav-wrap{border-radius:16px;font-size:11px;}}

/* 🔙 戻るボタン共通 */
.series-back-wrap{margin:18px 0 8px;text-align:center;}
.series-back-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border-radius:999px;
  background:linear-gradient(135deg,#e0f2fe,#cffafe);
  color:#0f172a;font-weight:700;font-size:14px;text-decoration:none;
  box-shadow:0 3px 8px rgba(0,0,0,.08);
  transition:all .28s cubic-bezier(.22,.61,.36,1);
}
.series-back-btn span{font-size:18px;}
.series-back-btn:hover,.series-back-btn:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 8px 14px rgba(0,0,0,.12);
  background:linear-gradient(135deg,#dbeafe,#bae6fd);
}
@media(max-width:480px){.series-back-btn{width:100%;font-size:15px;padding:12px 18px;}}

/* ⏮⏭ レッスン前後ナビ */
.lesson-nav{display:flex;justify-content:center;gap:10px;margin:26px 0 6px;flex-wrap:wrap;}
.lesson-nav a{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border-radius:999px;
  background:#06b6d4;color:#fff;font-weight:700;text-decoration:none;font-size:14px;
  box-shadow:0 2px 8px rgba(0,0,0,.15);transition:.2s;
}
.lesson-nav a:hover{transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,.18);}
</style>

<div class="series-nav-wrap">
  <span class="series-nav-label">英語学習シリーズ：</span>
  <div class="series-nav-links">
    <a class="series-nav-link" href="https://jouniorsankosodate.com/eiken5-flash/"><span>📗</span>5級フラッシュ</a>
    <a class="series-nav-link" href="https://jouniorsankosodate.com/eiken4-series/"><span>📘</span>4級フラッシュ</a>
    <a class="series-nav-link" href="https://jouniorsankosodate.com/junior-flash-list/"><span>🏫</span>中学英単語</a>
    <a class="series-nav-link is-current" href="https://jouniorsankosodate.com/takota-spell/"><span>🐙</span>タコタ式スペル練習</a>
    <a class="series-nav-link" href="https://jouniorsankosodate.com/takota-lesson/"><span>💬</span>タコタ英語レッスン</a>
  </div>
</div>

<!-- 💚 タイトル・説明 -->
<div class="takota-desc" style="max-width:820px;margin:0 auto 18px;padding:16px 18px;background:#f0fdf4;border:2px solid #86efac;border-radius:14px;">
  <div style="display:flex;align-items:center;gap:10px;margin-bottom:8px;">
    <img decoding="async" src="https://jouniorsankosodate.com/wp-content/uploads/2025/11/5dca7321798b10fda919243235cffbda.jpg" alt="タコタ" style="width:58px;height:auto;border-radius:50%;">
    <h2 style="font-weight:900;font-size:1.4em;margin:0;">タコタ式スペル練習④ 時間・頻度・季節（20語）</h2>
  </div>
  <p style="margin:0;line-height:1.8;font-size:15px;">
    朝・夜・週末・季節など、時間や頻度をあらわす20語。<br>
    「いつ？」「どれくらい？」を英語で言えるようにしよう🕒🌸☀️🍁❄️
  </p>
</div>

<!-- 🎧 タコタ音声 -->
<script>
let TAKOTA_VOICE=null;
function pickTakotaVoice(){
  const v=speechSynthesis.getVoices()||[];
  const pref=["en-US","en-GB","en-AU","en-CA","en-IN"];
  return v.find(x=>pref.includes(x.lang))
      || v.find(x=>(x.lang||"").startsWith("en"))
      || null;
}
if("speechSynthesis"in window){
  speechSynthesis.addEventListener("voiceschanged",()=>{TAKOTA_VOICE=pickTakotaVoice();});
}
function speakTakota(t){
  if(!("speechSynthesis"in window))return;
  if(!TAKOTA_VOICE)TAKOTA_VOICE=pickTakotaVoice();
  const u=new SpeechSynthesisUtterance(t);
  if(TAKOTA_VOICE){u.voice=TAKOTA_VOICE;u.lang=TAKOTA_VOICE.lang||"en-US";}
  else u.lang="en-US";
  u.rate=0.95;u.pitch=1.0;
  speechSynthesis.cancel();speechSynthesis.speak(u);
}
</script>

<!-- 🐙 スペル練習④ 本体 -->
<script>
(() => {
  const WORDS = [
    {word:"morning",jp:"朝"},{word:"afternoon",jp:"午後"},{word:"evening",jp:"夕方／夜"},
    {word:"night",jp:"夜"},{word:"weekend",jp:"週末"},{word:"holiday",jp:"休日"},
    {word:"vacation",jp:"休暇"},{word:"spring",jp:"春"},{word:"summer",jp:"夏"},
    {word:"fall",jp:"秋"},{word:"winter",jp:"冬"},{word:"today",jp:"今日"},
    {word:"tomorrow",jp:"明日"},{word:"yesterday",jp:"昨日"},{word:"always",jp:"いつも"},
    {word:"usually",jp:"ふつうは"},{word:"often",jp:"よく"},{word:"sometimes",jp:"ときどき"},
    {word:"before",jp:"〜の前に"},{word:"after",jp:"〜の後で"}
  ];
  const REVEAL=true;const KEY='takota_strict_set4_v1';
  const speak=speakTakota;

  const $=id=>document.getElementById(id);
  document.write(`
  <div class="takota-strict" id="takotaStrict4" style="max-width:820px;margin:16px auto;padding:16px;background:#f6f7fb;border-radius:16px;color:#111;">
    <div class="tk-card" style="background:#fff;border-radius:16px;padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.06);">
      <div class="tk-head" style="display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;">
        <div>
          <div class="tk-title" style="font-weight:900;font-size:22px;">タコタ式スペル練習④ 時間・頻度・季節</div>
          <div class="tk-problem" id="tkProblem4" style="font-weight:900;font-size:24px;">問題：—</div>
          <div class="tk-wordprev" id="tkWordPrev4" style="font-weight:800;font-size:22px;opacity:.95;"></div>
          <div class="tk-ime" id="tkImeWarn4" style="font-size:13px;color:#b91c1c;display:none;margin-top:6px;">※日本語入力かも。<strong>半角英数</strong>にしてね。</div>
        </div>
        <div class="tk-row" style="display:flex;gap:10px;flex-wrap:wrap;">
          <button class="tk-btn ghost" id="speakBtn4">🔊読む</button>
          <button class="tk-btn ghost" id="revealBtn4">🙈隠す</button>
          <button class="tk-btn ghost" id="hintBtn4">ヒント</button>
          <button class="tk-btn warn" id="resetBtn4">リセット</button>
          <button class="tk-btn" id="restartBtn4" style="background:#334155;color:#fff;">はじめから</button>
        </div>
      </div>
      <div class="tk-slots" id="slots4" style="display:flex;gap:10px;flex-wrap:wrap;margin:14px 0;"></div>
      <div class="tk-keys" id="keys4" style="display:flex;flex-wrap:wrap;gap:8px;margin:8px 0;"></div>
      <div class="tk-btns" style="display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;">
        <button class="tk-btn ghost" id="skipBtn4">スキップ</button>
        <button class="tk-btn ok" id="nextBtn4" style="background:#16a34a;" disabled>つぎへ</button>
      </div>
      <div class="tk-msg" id="tkMsg4" style="font-weight:800;margin:8px 0;"></div>
      <div class="tk-progress" style="height:8px;background:#e5e7eb;border-radius:999px;overflow:hidden;margin-top:10px;">
        <div class="tk-bar" id="bar4" style="height:100%;width:0;background:#06b6d4;"></div>
      </div>
      <div class="tk-mini" style="font-size:12px;color:#667;"> <span id="count4">0</span> / <span id="total4">0</span> </div>
    </div>
  </div>`);

  // ②③と同じロジック
  let state;try{state=JSON.parse(localStorage.getItem(KEY))||{i:0,reveal:REVEAL}}catch(_){state={i:0,reveal:REVEAL}}
  if(state.i>=WORDS.length)state.i=0;
  let cur=null,idx=0,locked=[],inputs=[];

  function prog(solved=false){const c=$("count4"),t=$("total4"),b=$("bar4");
    t.textContent=WORDS.length;if(solved&&state.i===WORDS.length-1){c.textContent=WORDS.length;b.style.width='100%';return;}
    c.textContent=Math.min(state.i+1,WORDS.length);b.style.width=Math.round((state.i/WORDS.length)*100)+'%';}
  function slots(w){const s=$("slots4");s.innerHTML='';inputs=[];locked=Array.from({length:w.length},()=>'');
    for(let i=0;i<w.length;i++){const el=document.createElement("div");el.className="tk-slot";
      el.style.cssText="width:46px;height:54px;border:2px solid #e5e7eb;border-radius:12px;display:grid;place-items:center;font-size:24px;font-weight:800;";
      el.textContent='•';el.addEventListener('click',()=>{idx=i;active();});s.appendChild(el);inputs.push(el);}
    idx=0;active();}
  function active(){inputs.forEach((el,i)=>{el.style.outline=(i===idx)?'3px solid rgba(14,165,233,.35)':'none';});}
  function keys(w){const k=$("keys4");k.innerHTML='';[...new Set(w.toLowerCase().split(''))].sort().forEach(ch=>{
    const b=document.createElement("button");b.className="tk-key";b.textContent=ch;b.style.cssText="padding:10px 12px;border-radius:10px;border:1px solid #e5e7eb;background:#fff;font-weight:800;cursor:pointer;";
    b.addEventListener('click',()=>put(ch));k.appendChild(b);});}
  function preview(){const w=$("tkWordPrev4"),r=$("revealBtn4");if(state.reveal){w.textContent=cur.word;r.textContent='🙈隠す';}
    else{w.textContent='•'.repeat(cur.word.length);r.textContent='👁単語表示';}}
  function show(i){cur=WORDS[i];$("tkProblem4").textContent='問題：'+cur.jp;$("tkMsg4").textContent='';
    slots(cur.word);keys(cur.word);preview();$("nextBtn4").disabled=true;prog(false);}
  function done(){if(locked.join('')===cur.word.toLowerCase()){$("tkMsg4").textContent='🎉 正解！Good job!';$("tkMsg4").style.color='#16a34a';$("nextBtn4").disabled=false;prog(true);return true}return false;}
  function put(chRaw){const t=cur.word.toLowerCase();if(idx>=t.length)return;const ch=(chRaw||'').toLowerCase();const exp=t[idx];
    if(ch===exp){locked[idx]=exp;inputs[idx].textContent=exp;inputs[idx].classList.add('filled');idx=Math.min(idx+1,t.length-1);active();done();}
    else{inputs[idx].style.borderColor='#ef4444';setTimeout(()=>inputs[idx].style.borderColor='#e5e7eb',220);$("tkMsg4").textContent='❌ちがうよ';$("tkMsg4").style.color='#ef4444';}}
  document.addEventListener("keydown",e=>{if(!cur)return;const k=e.key;
    if(k==='Backspace'){if(locked[idx]){locked[idx]='';inputs[idx].textContent='•';}
      else if(idx>0){idx--;active();locked[idx]='';inputs[idx].textContent='•';}
      e.preventDefault();return;}
    if(k.length===1){if(!/[a-zA-Z]/.test(k))return;put(k);e.preventDefault();return;}
    if(k==='Enter'&&!$("nextBtn4").disabled){next();}});
  function next(){state.i++;save();if(state.i>=WORDS.length){$("tkMsg4").textContent='🎉 全問クリア！おめでとう！';$("tkMsg4").style.color='#16a34a';$("nextBtn4").disabled=true;return;}show(state.i);}
  function save(){localStorage.setItem(KEY,JSON.stringify(state));}
  $("hintBtn4").addEventListener("click",()=>{const t=cur.word.toLowerCase();const n=t.length>=6?2:1;for(let i=0;i<n;i++){if(!locked[i]){idx=i;put(t[i]);}}});
  $("resetBtn4").addEventListener("click",()=>{slots(cur.word);$("tkMsg4").textContent='';$("nextBtn4").disabled=true;});
  $("restartBtn4").addEventListener("click",()=>{state.i=0;save();show(state.i);});
  $("skipBtn4").addEventListener("click",()=>show(state.i));
  $("nextBtn4").addEventListener("click",next);
  $("speakBtn4").addEventListener("click",()=>speak(cur.word));
  $("revealBtn4").addEventListener("click",()=>{state.reveal=!state.reveal;save();preview();});
  show(state.i);
})();
</script>

<!-- ⏮⏭ 前後レッスンナビ＋一覧 -->
<div class="lesson-nav">
  <a href="https://jouniorsankosodate.com/takota-spell-3-school-family/">← レッスン③ 学校・友達へ</a>
  <a href="https://jouniorsankosodate.com/takota-spell-5-link-prep-adj/">▶ レッスン⑤ つなぎ・前置詞へ</a>
</div>
<div class="series-back-wrap">
  <a class="series-back-btn" href="https://jouniorsankosodate.com/takota-spell/">
    <span>🐙</span>タコタ式スペル練習 一覧にもどる
  </a>
</div>

<p>投稿 <a href="https://jouniorsankosodate.com/takota-spell-4-time-frequency/">🐙 タコタ式スペル練習④ 時間・頻度・季節（20語）</a> は <a href="https://jouniorsankosodate.com">じゅにさん子育てブログ</a> に最初に表示されました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://jouniorsankosodate.com/takota-spell-4-time-frequency/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
