{"id":25884,"date":"2025-03-03T09:46:27","date_gmt":"2025-03-03T00:46:27","guid":{"rendered":"http:\/\/www.tyosuke20xx.com\/blog\/?p=25884"},"modified":"2025-03-03T09:46:28","modified_gmt":"2025-03-03T00:46:28","slug":"gamestore","status":"publish","type":"post","link":"http:\/\/www.tyosuke20xx.com\/blog\/?p=25884","title":{"rendered":"Gamestore"},"content":{"rendered":"\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;html lang=\"ja\">\n&lt;head>\n  &lt;meta charset=\"UTF-8\">\n  &lt;title>GameStore Ultra - Upload &amp; Persist Data&lt;\/title>\n  &lt;meta name=\"description\" content=\"\u9ad8\u5ea6\u306a\u30a4\u30f3\u30bf\u30e9\u30af\u30b7\u30e7\u30f3\u3068\u6d17\u7df4\u3055\u308c\u305f\u30c7\u30b6\u30a4\u30f3\u3001\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u30c7\u30fc\u30bf\u306e\u4fdd\u6301\u6a5f\u80fd\u3092\u5b9f\u73fe\u3057\u305f\u30b2\u30fc\u30e0\u30b9\u30c8\u30a2\u30b5\u30a4\u30c8\u3002\">\n  &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  &lt;style>\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30b0\u30ed\u30fc\u30d0\u30eb\u30ea\u30bb\u30c3\u30c8\uff06\u5909\u6570\u8a2d\u5b9a\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    :root {\n      --primary: #ff6600;\n      --accent: #e55a00;\n      --secondary: #222;\n      --light: #fff;\n      --dark: #333;\n      --text: #333;\n      --shadow: 0 2px 8px rgba(0,0,0,0.15);\n    }\n    * { margin: 0; padding: 0; box-sizing: border-box; }\n    html { scroll-behavior: smooth; }\n    body { font-family: 'Helvetica Neue', Arial, sans-serif; background: #f8f8f8; color: var(--text); }\n    a { text-decoration: none; color: inherit; }\n    img { display: block; max-width: 100%; height: auto; }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30d8\u30c3\u30c0\u30fc\uff06\u30ca\u30d3\u30b2\u30fc\u30b7\u30e7\u30f3\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    header {\n      background: var(--secondary);\n      color: var(--light);\n      padding: 10px 20px;\n      position: sticky;\n      top: 0;\n      z-index: 1000;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      box-shadow: var(--shadow);\n    }\n    .logo { display: flex; align-items: center; gap: 10px; }\n    .logo img { width: 40px; height: 40px; }\n    .logo h1 { font-size: 24px; }\n    nav { background: var(--dark); }\n    .nav-container {\n      max-width: 1200px;\n      margin: auto;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 10px 20px;\n    }\n    .nav-menu { list-style: none; display: flex; gap: 20px; }\n    .nav-menu li { position: relative; }\n    .nav-menu li a {\n      color: var(--light);\n      padding: 8px 10px;\n      transition: background 0.3s;\n    }\n    .nav-menu li a:hover { background: #444; }\n    \/* \u30c9\u30ed\u30c3\u30d7\u30c0\u30a6\u30f3 *\/\n    .dropdown {\n      position: absolute;\n      top: 100%;\n      left: 0;\n      background: var(--dark);\n      display: none;\n      flex-direction: column;\n      min-width: 150px;\n    }\n    .dropdown li a { padding: 8px 10px; }\n    .nav-menu li:hover .dropdown { display: flex; }\n    \/* \u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u30ea\u30f3\u30af\uff08\u7ba1\u7406\u8005\u5411\u3051\uff09 *\/\n    .nav-menu li.upload-link { margin-left: auto; }\n    \/* \u30cf\u30f3\u30d0\u30fc\u30ac\u30fc\u30e1\u30cb\u30e5\u30fc\uff08\u30e2\u30d0\u30a4\u30eb\uff09 *\/\n    .hamburger {\n      display: none;\n      flex-direction: column;\n      gap: 4px;\n      cursor: pointer;\n    }\n    .hamburger span { width: 25px; height: 3px; background: var(--light); }\n    @media (max-width: 768px) {\n      .nav-menu { display: none; flex-direction: column; width: 100%; }\n      .nav-menu.active { display: flex; }\n      .hamburger { display: flex; }\n      .nav-container { flex-direction: column; align-items: flex-start; }\n    }\n    .search-container { position: relative; }\n    .search-container input&#91;type=\"text\"] {\n      padding: 6px 10px;\n      border: 1px solid #ccc;\n      border-radius: 4px;\n    }\n    .search-container button {\n      position: absolute;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      background: var(--primary);\n      border: none;\n      padding: 6px 10px;\n      border-radius: 0 4px 4px 0;\n      color: var(--light);\n      cursor: pointer;\n    }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30d2\u30fc\u30ed\u30fc\u30b9\u30e9\u30a4\u30c0\u30fc\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    .hero-slider {\n      position: relative;\n      overflow: hidden;\n      height: 600px;\n    }\n    .hero-slide {\n      position: absolute;\n      top: 0; left: 0;\n      width: 100%;\n      height: 100%;\n      background-size: cover;\n      background-position: center;\n      opacity: 0;\n      transition: opacity 1s ease;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n    .hero-slide.active { opacity: 1; position: relative; }\n    .hero-content {\n      background: rgba(0, 0, 0, 0.6);\n      padding: 20px 30px;\n      border-radius: 8px;\n      text-align: center;\n      color: var(--light);\n    }\n    .hero-content h2 { font-size: 48px; margin-bottom: 15px; }\n    .hero-content p { font-size: 20px; margin-bottom: 20px; }\n    .hero-content .btn {\n      background: var(--primary);\n      padding: 12px 24px;\n      border-radius: 4px;\n      transition: background 0.3s;\n    }\n    .hero-content .btn:hover { background: var(--accent); }\n    .hero-controls {\n      position: absolute;\n      bottom: 20px;\n      left: 50%;\n      transform: translateX(-50%);\n      display: flex;\n      gap: 8px;\n    }\n    .hero-control {\n      width: 12px;\n      height: 12px;\n      border-radius: 50%;\n      background: var(--light);\n      opacity: 0.5;\n      cursor: pointer;\n    }\n    .hero-control.active { opacity: 1; }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30b9\u30af\u30ed\u30fc\u30eb\u6642\u30d5\u30a7\u30fc\u30c9\u30a4\u30f3\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    .fade-in {\n      opacity: 0;\n      transform: translateY(20px);\n      transition: opacity 0.6s ease-out, transform 0.6s ease-out;\n    }\n    .fade-in.visible { opacity: 1; transform: none; }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30bb\u30af\u30b7\u30e7\u30f3\u5171\u901a\u30b9\u30bf\u30a4\u30eb\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    section {\n      padding: 60px 20px;\n      max-width: 1200px;\n      margin: auto;\n    }\n    .section-title {\n      font-size: 32px;\n      margin-bottom: 20px;\n      border-left: 5px solid var(--primary);\n      padding-left: 10px;\n    }\n    .section-description {\n      font-size: 18px;\n      margin-bottom: 30px;\n      color: #666;\n    }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30b2\u30fc\u30e0\u30ab\u30fc\u30c9\u30b0\u30ea\u30c3\u30c9\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    .game-grid {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n      gap: 20px;\n    }\n    .game-card {\n      background: var(--light);\n      border-radius: 8px;\n      box-shadow: var(--shadow);\n      overflow: hidden;\n      cursor: pointer;\n      position: relative;\n      transition: transform 0.3s;\n    }\n    .game-card:hover { transform: translateY(-5px); }\n    .game-card img {\n      width: 100%;\n      height: 180px;\n      object-fit: cover;\n    }\n    .game-card-content { padding: 15px; }\n    .game-card-content h3 { font-size: 22px; margin-bottom: 10px; }\n    .game-card-content p { font-size: 16px; color: #666; margin-bottom: 10px; }\n    .game-card-content .price { font-size: 20px; color: var(--primary); }\n    .card-overlay {\n      position: absolute;\n      top: 0; left: 0; right: 0; bottom: 0;\n      background: rgba(0,0,0,0.3);\n      opacity: 0;\n      transition: opacity 0.3s;\n    }\n    .game-card:hover .card-overlay { opacity: 1; }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30ab\u30c6\u30b4\u30ea\u30bb\u30af\u30b7\u30e7\u30f3\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    .categories {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n      gap: 20px;\n    }\n    .category-card {\n      position: relative;\n      border-radius: 8px;\n      overflow: hidden;\n      cursor: pointer;\n    }\n    .category-card img {\n      width: 100%;\n      height: 150px;\n      object-fit: cover;\n      filter: brightness(70%);\n      transition: filter 0.3s;\n    }\n    .category-card:hover img { filter: brightness(100%); }\n    .category-card span {\n      position: absolute;\n      bottom: 10px;\n      left: 10px;\n      background: rgba(0,0,0,0.5);\n      color: var(--light);\n      padding: 8px 12px;\n      border-radius: 4px;\n      font-size: 18px;\n    }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30e6\u30fc\u30b6\u30fc\u30ec\u30d3\u30e5\u30fc\u30fb\u30b9\u30e9\u30a4\u30c0\u30fc\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    .reviews-slider {\n      position: relative;\n      overflow: hidden;\n      padding: 20px 0;\n    }\n    .reviews-track {\n      display: flex;\n      gap: 20px;\n      transition: transform 0.5s ease-in-out;\n    }\n    .review-card {\n      background: var(--light);\n      border-radius: 8px;\n      box-shadow: var(--shadow);\n      padding: 20px;\n      min-width: 320px;\n    }\n    .review-card h4 { font-size: 20px; margin-bottom: 10px; }\n    .review-card .rating { margin-bottom: 10px; }\n    .review-card .rating span { color: gold; font-size: 22px; }\n    .review-card p { font-size: 16px; color: #444; }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30d6\u30ed\u30b0\u30bb\u30af\u30b7\u30e7\u30f3\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    .blog-grid {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n      gap: 20px;\n    }\n    .blog-card {\n      background: var(--light);\n      border-radius: 8px;\n      box-shadow: var(--shadow);\n      overflow: hidden;\n    }\n    .blog-card img {\n      width: 100%;\n      height: 200px;\n      object-fit: cover;\n    }\n    .blog-card-content { padding: 15px; }\n    .blog-card-content h3 { font-size: 22px; margin-bottom: 10px; }\n    .blog-card-content p { font-size: 16px; color: #666; margin-bottom: 10px; }\n    .blog-card-content .btn {\n      background: var(--primary);\n      padding: 8px 16px;\n      border-radius: 4px;\n      transition: background 0.3s;\n      font-size: 16px;\n    }\n    .blog-card-content .btn:hover { background: var(--accent); }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30e2\u30fc\u30c0\u30eb\uff08\u5546\u54c1\u8a73\u7d30\u3001\u30ed\u30b0\u30a4\u30f3\u3001\u767b\u9332\u3001\u30ab\u30fc\u30c8\u3001\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\uff09\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    .modal-overlay {\n      position: fixed;\n      top: 0; left: 0; right: 0; bottom: 0;\n      background: rgba(0,0,0,0.6);\n      display: none;\n      align-items: center;\n      justify-content: center;\n      z-index: 2000;\n    }\n    .modal-overlay.active { display: flex; }\n    .modal {\n      background: var(--light);\n      max-width: 600px;\n      width: 90%;\n      border-radius: 8px;\n      overflow: hidden;\n      animation: modalFade 0.3s;\n      position: relative;\n    }\n    @keyframes modalFade {\n      from { opacity: 0; transform: translateY(-20px); }\n      to { opacity: 1; transform: translateY(0); }\n    }\n    .modal-header, .modal-footer { padding: 15px; background: var(--dark); color: var(--light); }\n    .modal-body { padding: 20px; }\n    .modal-close {\n      position: absolute;\n      top: 15px;\n      right: 15px;\n      font-size: 24px;\n      cursor: pointer;\n      color: var(--light);\n    }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      Back-to-Top \u30dc\u30bf\u30f3\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    #backToTop {\n      position: fixed;\n      bottom: 40px;\n      right: 40px;\n      background: var(--primary);\n      color: var(--light);\n      padding: 12px;\n      border-radius: 50%;\n      display: none;\n      cursor: pointer;\n      box-shadow: var(--shadow);\n      transition: background 0.3s;\n      z-index: 1500;\n    }\n    #backToTop:hover { background: var(--accent); }\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u30d5\u30a3\u30eb\u30bf\u30fc\u30b5\u30a4\u30c9\u30d0\u30fc\uff08\u30c7\u30b9\u30af\u30c8\u30c3\u30d7\uff09\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    .filter-sidebar {\n      position: fixed;\n      top: 100px;\n      left: 20px;\n      width: 250px;\n      background: var(--light);\n      border: 1px solid #ccc;\n      border-radius: 8px;\n      padding: 20px;\n      box-shadow: var(--shadow);\n      z-index: 1200;\n    }\n    .filter-sidebar h3 { font-size: 20px; margin-bottom: 15px; }\n    .filter-sidebar label { display: block; margin-bottom: 8px; font-size: 16px; }\n    .filter-sidebar input, .filter-sidebar select {\n      width: 100%;\n      padding: 6px 8px;\n      margin-bottom: 12px;\n      border: 1px solid #ccc;\n      border-radius: 4px;\n    }\n    .filter-sidebar button {\n      width: 100%;\n      padding: 10px;\n      background: var(--primary);\n      border: none;\n      color: var(--light);\n      border-radius: 4px;\n      font-size: 16px;\n      transition: background 0.3s;\n      cursor: pointer;\n    }\n    .filter-sidebar button:hover { background: var(--accent); }\n    @media (max-width: 1024px) { .filter-sidebar { display: none; } }\n  &lt;\/style>\n&lt;\/head>\n&lt;body>\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30d8\u30c3\u30c0\u30fc\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;header>\n    &lt;div class=\"logo\">\n      &lt;img src=\"images\/logo.png\" alt=\"GameStore Logo\" loading=\"lazy\">\n      &lt;h1>GameStore Ultra&lt;\/h1>\n    &lt;\/div>\n    &lt;div class=\"hamburger\" id=\"hamburger\">\n      &lt;span>&lt;\/span>\n      &lt;span>&lt;\/span>\n      &lt;span>&lt;\/span>\n    &lt;\/div>\n  &lt;\/header>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30ca\u30d3\u30b2\u30fc\u30b7\u30e7\u30f3\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;nav>\n    &lt;div class=\"nav-container\">\n      &lt;ul class=\"nav-menu\" id=\"navMenu\">\n        &lt;li>&lt;a href=\"#\">\u30db\u30fc\u30e0&lt;\/a>&lt;\/li>\n        &lt;li>\n          &lt;a href=\"#\">\u65b0\u4f5c&lt;\/a>\n          &lt;ul class=\"dropdown\">\n            &lt;li>&lt;a href=\"#\">\u4eca\u9031\u306e\u65b0\u4f5c&lt;\/a>&lt;\/li>\n            &lt;li>&lt;a href=\"#\">\u4eca\u6708\u306e\u65b0\u4f5c&lt;\/a>&lt;\/li>\n          &lt;\/ul>\n        &lt;\/li>\n        &lt;li>\n          &lt;a href=\"#\">\u4eba\u6c17\u30bf\u30a4\u30c8\u30eb&lt;\/a>\n          &lt;ul class=\"dropdown\">\n            &lt;li>&lt;a href=\"#\">\u30e9\u30f3\u30ad\u30f3\u30b0&lt;\/a>&lt;\/li>\n            &lt;li>&lt;a href=\"#\">\u30ec\u30d3\u30e5\u30fc&lt;\/a>&lt;\/li>\n          &lt;\/ul>\n        &lt;\/li>\n        &lt;li>&lt;a href=\"#\">\u30bb\u30fc\u30eb&lt;\/a>&lt;\/li>\n        &lt;li>&lt;a href=\"#\">\u30d6\u30ed\u30b0&lt;\/a>&lt;\/li>\n        &lt;li class=\"upload-link\">&lt;a href=\"#\" id=\"uploadLink\">\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9&lt;\/a>&lt;\/li>\n      &lt;\/ul>\n      &lt;div class=\"search-container\">\n        &lt;input type=\"text\" placeholder=\"\u30b2\u30fc\u30e0\u3092\u691c\u7d22...\" id=\"searchInput\">\n        &lt;button id=\"searchButton\">\u691c\u7d22&lt;\/button>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/nav>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30d5\u30a3\u30eb\u30bf\u30fc\u30b5\u30a4\u30c9\u30d0\u30fc\uff08\u30c7\u30b9\u30af\u30c8\u30c3\u30d7\u7528\uff09\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;aside class=\"filter-sidebar\" id=\"filterSidebar\">\n    &lt;h3>\u30d5\u30a3\u30eb\u30bf\u30fc&lt;\/h3>\n    &lt;label for=\"filterGenre\">\u30b8\u30e3\u30f3\u30eb:&lt;\/label>\n    &lt;select id=\"filterGenre\">\n      &lt;option value=\"\">\u3059\u3079\u3066&lt;\/option>\n      &lt;option value=\"\u30a2\u30af\u30b7\u30e7\u30f3\">\u30a2\u30af\u30b7\u30e7\u30f3&lt;\/option>\n      &lt;option value=\"RPG\">RPG&lt;\/option>\n      &lt;option value=\"\u30b7\u30e5\u30fc\u30c6\u30a3\u30f3\u30b0\">\u30b7\u30e5\u30fc\u30c6\u30a3\u30f3\u30b0&lt;\/option>\n      &lt;option value=\"\u30d1\u30ba\u30eb\">\u30d1\u30ba\u30eb&lt;\/option>\n    &lt;\/select>\n    &lt;label for=\"filterPrice\">\u4fa1\u683c\u4e0a\u9650:&lt;\/label>\n    &lt;input type=\"number\" id=\"filterPrice\" placeholder=\"\u4f8b: 5000\">\n    &lt;button id=\"applyFilter\">\u30d5\u30a3\u30eb\u30bf\u30fc\u9069\u7528&lt;\/button>\n  &lt;\/aside>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30d2\u30fc\u30ed\u30fc\u30b9\u30e9\u30a4\u30c0\u30fc\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;div class=\"hero-slider\" id=\"heroSlider\">\n    &lt;div class=\"hero-slide active\" style=\"background-image: url('images\/hero1.jpg');\">\n      &lt;div class=\"hero-content\">\n        &lt;h2>\u6700\u65b0\u4f5c\u304c\u7d9a\u3005\u767b\u5834\uff01&lt;\/h2>\n        &lt;p>\u5192\u967a\u3001\u6226\u7565\u3001\u30a2\u30af\u30b7\u30e7\u30f3\u2026\u5168\u3066\u306e\u30b2\u30fc\u30e0\u304c\u3053\u3053\u306b\u3002&lt;\/p>\n        &lt;a href=\"#\" class=\"btn\">\u8a73\u3057\u304f\u898b\u308b&lt;\/a>\n      &lt;\/div>\n    &lt;\/div>\n    &lt;div class=\"hero-slide\" style=\"background-image: url('images\/hero2.jpg');\">\n      &lt;div class=\"hero-content\">\n        &lt;h2>\u30bb\u30fc\u30eb\u958b\u50ac\u4e2d\uff01&lt;\/h2>\n        &lt;p>\u671f\u9593\u9650\u5b9a\u3001\u6700\u592750%OFF\uff01&lt;\/p>\n        &lt;a href=\"#\" class=\"btn\">\u30bb\u30fc\u30eb\u3092\u898b\u308b&lt;\/a>\n      &lt;\/div>\n    &lt;\/div>\n    &lt;div class=\"hero-slide\" style=\"background-image: url('images\/hero3.jpg');\">\n      &lt;div class=\"hero-content\">\n        &lt;h2>\u30e6\u30fc\u30b6\u30fc\u30ec\u30d3\u30e5\u30fc\u3067\u9078\u3076&lt;\/h2>\n        &lt;p>\u5b9f\u969b\u306e\u8a55\u4fa1\u3092\u5143\u306b\u3001\u3042\u306a\u305f\u306b\u30d4\u30c3\u30bf\u30ea\u306e\u30b2\u30fc\u30e0\u3092\u898b\u3064\u3051\u3088\u3046\u3002&lt;\/p>\n        &lt;a href=\"#\" class=\"btn\">\u30ec\u30d3\u30e5\u30fc\u3092\u898b\u308b&lt;\/a>\n      &lt;\/div>\n    &lt;\/div>\n    &lt;div class=\"hero-controls\" id=\"heroControls\">&lt;\/div>\n  &lt;\/div>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u65b0\u4f5c\u30b2\u30fc\u30e0\u30bb\u30af\u30b7\u30e7\u30f3\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;section id=\"new-releases\" class=\"fade-in\">\n    &lt;h2 class=\"section-title\">\u65b0\u4f5c\u30b2\u30fc\u30e0&lt;\/h2>\n    &lt;p class=\"section-description\">\u6700\u65b0\u306e\u30b2\u30fc\u30e0\u30bf\u30a4\u30c8\u30eb\u3092\u30c1\u30a7\u30c3\u30af\uff01&lt;\/p>\n    &lt;div class=\"game-grid\" id=\"newReleasesGrid\">\n      &lt;div class=\"game-card\" data-title=\"\u65b0\u4f5c\u30b2\u30fc\u30e01\" data-genre=\"\u30a2\u30af\u30b7\u30e7\u30f3\" data-price=\"3500\u5186\" data-description=\"\u8feb\u529b\u306e\u30a2\u30af\u30b7\u30e7\u30f3\u3068\u6700\u65b0\u6280\u8853\u304c\u878d\u5408\u3057\u305f\u4f5c\u54c1\u3002\">\n        &lt;img src=\"images\/new1.jpg\" alt=\"\u65b0\u4f5c\u30b2\u30fc\u30e01\" loading=\"lazy\">\n        &lt;div class=\"game-card-content\">\n          &lt;h3>\u65b0\u4f5c\u30b2\u30fc\u30e01&lt;\/h3>\n          &lt;p>\u30b8\u30e3\u30f3\u30eb: \u30a2\u30af\u30b7\u30e7\u30f3&lt;\/p>\n          &lt;p class=\"price\">3500\u5186&lt;\/p>\n        &lt;\/div>\n        &lt;div class=\"card-overlay\">&lt;\/div>\n      &lt;\/div>\n      &lt;div class=\"game-card\" data-title=\"\u65b0\u4f5c\u30b2\u30fc\u30e02\" data-genre=\"RPG\" data-price=\"4200\u5186\" data-description=\"\u58ee\u5927\u306a\u7269\u8a9e\u3068\u7f8e\u3057\u3044\u4e16\u754c\u89b3\u304c\u9b45\u529b\u3002\">\n        &lt;img src=\"images\/new2.jpg\" alt=\"\u65b0\u4f5c\u30b2\u30fc\u30e02\" loading=\"lazy\">\n        &lt;div class=\"game-card-content\">\n          &lt;h3>\u65b0\u4f5c\u30b2\u30fc\u30e02&lt;\/h3>\n          &lt;p>\u30b8\u30e3\u30f3\u30eb: RPG&lt;\/p>\n          &lt;p class=\"price\">4200\u5186&lt;\/p>\n        &lt;\/div>\n        &lt;div class=\"card-overlay\">&lt;\/div>\n      &lt;\/div>\n      &lt;div class=\"game-card\" data-title=\"\u65b0\u4f5c\u30b2\u30fc\u30e03\" data-genre=\"\u30b7\u30e5\u30fc\u30c6\u30a3\u30f3\u30b0\" data-price=\"2900\u5186\" data-description=\"\u9ad8\u901f\u306a\u30a2\u30af\u30b7\u30e7\u30f3\u3068\u30ea\u30a2\u30eb\u306a\u30b0\u30e9\u30d5\u30a3\u30c3\u30af\u304c\u7279\u9577\u3002\">\n        &lt;img src=\"images\/new3.jpg\" alt=\"\u65b0\u4f5c\u30b2\u30fc\u30e03\" loading=\"lazy\">\n        &lt;div class=\"game-card-content\">\n          &lt;h3>\u65b0\u4f5c\u30b2\u30fc\u30e03&lt;\/h3>\n          &lt;p>\u30b8\u30e3\u30f3\u30eb: \u30b7\u30e5\u30fc\u30c6\u30a3\u30f3\u30b0&lt;\/p>\n          &lt;p class=\"price\">2900\u5186&lt;\/p>\n        &lt;\/div>\n        &lt;div class=\"card-overlay\">&lt;\/div>\n      &lt;\/div>\n      &lt;div class=\"game-card\" data-title=\"\u65b0\u4f5c\u30b2\u30fc\u30e04\" data-genre=\"\u30d1\u30ba\u30eb\" data-price=\"1500\u5186\" data-description=\"\u982d\u8133\u3092\u523a\u6fc0\u3059\u308b\u72ec\u81ea\u306e\u30d1\u30ba\u30eb\u4f53\u9a13\u3002\">\n        &lt;img src=\"images\/new4.jpg\" alt=\"\u65b0\u4f5c\u30b2\u30fc\u30e04\" loading=\"lazy\">\n        &lt;div class=\"game-card-content\">\n          &lt;h3>\u65b0\u4f5c\u30b2\u30fc\u30e04&lt;\/h3>\n          &lt;p>\u30b8\u30e3\u30f3\u30eb: \u30d1\u30ba\u30eb&lt;\/p>\n          &lt;p class=\"price\">1500\u5186&lt;\/p>\n        &lt;\/div>\n        &lt;div class=\"card-overlay\">&lt;\/div>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/section>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u6ce8\u76ee\u7279\u96c6\u30bb\u30af\u30b7\u30e7\u30f3\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;section id=\"featured\" class=\"fade-in\">\n    &lt;h2 class=\"section-title\">\u6ce8\u76ee\u306e\u7279\u96c6&lt;\/h2>\n    &lt;p class=\"section-description\">\u4eca\u9031\u306e\u6ce8\u76ee\u30bf\u30a4\u30c8\u30eb\u3084\u7279\u96c6\u8a18\u4e8b\u3092\u304a\u5c4a\u3051\u3057\u307e\u3059\u3002&lt;\/p>\n    &lt;div class=\"game-grid\">\n      &lt;div class=\"game-card\" data-title=\"\u7279\u96c6\u30bf\u30a4\u30c8\u30eb1\" data-genre=\"\u7279\u96c6\" data-price=\"\u8a18\u4e8b\u3092\u898b\u308b\" data-description=\"\u6700\u65b0\u30c8\u30ec\u30f3\u30c9\u3092\u5fb9\u5e95\u89e3\u8aac\u3002\">\n        &lt;img src=\"images\/featured1.jpg\" alt=\"\u7279\u96c61\" loading=\"lazy\">\n        &lt;div class=\"game-card-content\">\n          &lt;h3>\u7279\u96c6\u30bf\u30a4\u30c8\u30eb1&lt;\/h3>\n          &lt;p>\u671f\u9593\u9650\u5b9a\u7279\u96c6\uff1a\u6700\u65b0\u30c8\u30ec\u30f3\u30c9&lt;\/p>\n          &lt;p class=\"price\">\u7279\u96c6\u8a18\u4e8b\u3092\u898b\u308b&lt;\/p>\n        &lt;\/div>\n        &lt;div class=\"card-overlay\">&lt;\/div>\n      &lt;\/div>\n      &lt;div class=\"game-card\" data-title=\"\u7279\u96c6\u30bf\u30a4\u30c8\u30eb2\" data-genre=\"\u7279\u96c6\" data-price=\"\u8a18\u4e8b\u3092\u898b\u308b\" data-description=\"\u30a4\u30f3\u30c7\u30a3\u30fc\u30b2\u30fc\u30e0\u306e\u9769\u65b0\u3092\u8ffd\u3046\u3002\">\n        &lt;img src=\"images\/featured2.jpg\" alt=\"\u7279\u96c62\" loading=\"lazy\">\n        &lt;div class=\"game-card-content\">\n          &lt;h3>\u7279\u96c6\u30bf\u30a4\u30c8\u30eb2&lt;\/h3>\n          &lt;p>\u8a71\u984c\u306e\u30a4\u30f3\u30c7\u30a3\u30fc\u30b2\u30fc\u30e0\u7279\u96c6&lt;\/p>\n          &lt;p class=\"price\">\u7279\u96c6\u8a18\u4e8b\u3092\u898b\u308b&lt;\/p>\n        &lt;\/div>\n        &lt;div class=\"card-overlay\">&lt;\/div>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/section>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u6e08\u307f\u30b2\u30fc\u30e0\u8868\u793a\uff08\u7ba1\u7406\u8005\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u30c7\u30fc\u30bf\uff09\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;section id=\"my-uploads\" class=\"fade-in\">\n    &lt;h2 class=\"section-title\">\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u3057\u305f\u30b2\u30fc\u30e0&lt;\/h2>\n    &lt;p class=\"section-description\">\u7ba1\u7406\u8005\u304c\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u3057\u305f\u30b2\u30fc\u30e0\u30c7\u30fc\u30bf\u3067\u3059\u3002&lt;\/p>\n    &lt;div class=\"game-grid\" id=\"myUploadsGrid\">&lt;\/div>\n  &lt;\/section>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30b8\u30e3\u30f3\u30eb\u5225\u30bb\u30af\u30b7\u30e7\u30f3\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;section id=\"categories\" class=\"fade-in\">\n    &lt;h2 class=\"section-title\">\u30b8\u30e3\u30f3\u30eb\u5225&lt;\/h2>\n    &lt;p class=\"section-description\">\u304a\u6c17\u306b\u5165\u308a\u306e\u30b8\u30e3\u30f3\u30eb\u304b\u3089\u30b2\u30fc\u30e0\u3092\u63a2\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002&lt;\/p>\n    &lt;div class=\"categories\">\n      &lt;a href=\"#\" class=\"category-card\">\n        &lt;img src=\"images\/cat-action.jpg\" alt=\"\u30a2\u30af\u30b7\u30e7\u30f3\" loading=\"lazy\">\n        &lt;span>\u30a2\u30af\u30b7\u30e7\u30f3&lt;\/span>\n      &lt;\/a>\n      &lt;a href=\"#\" class=\"category-card\">\n        &lt;img src=\"images\/cat-rpg.jpg\" alt=\"RPG\" loading=\"lazy\">\n        &lt;span>RPG&lt;\/span>\n      &lt;\/a>\n      &lt;a href=\"#\" class=\"category-card\">\n        &lt;img src=\"images\/cat-shooting.jpg\" alt=\"\u30b7\u30e5\u30fc\u30c6\u30a3\u30f3\u30b0\" loading=\"lazy\">\n        &lt;span>\u30b7\u30e5\u30fc\u30c6\u30a3\u30f3\u30b0&lt;\/span>\n      &lt;\/a>\n      &lt;a href=\"#\" class=\"category-card\">\n        &lt;img src=\"images\/cat-puzzle.jpg\" alt=\"\u30d1\u30ba\u30eb\" loading=\"lazy\">\n        &lt;span>\u30d1\u30ba\u30eb&lt;\/span>\n      &lt;\/a>\n      &lt;a href=\"#\" class=\"category-card\">\n        &lt;img src=\"images\/cat-adventure.jpg\" alt=\"\u30a2\u30c9\u30d9\u30f3\u30c1\u30e3\u30fc\" loading=\"lazy\">\n        &lt;span>\u30a2\u30c9\u30d9\u30f3\u30c1\u30e3\u30fc&lt;\/span>\n      &lt;\/a>\n    &lt;\/div>\n  &lt;\/section>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30e6\u30fc\u30b6\u30fc\u30ec\u30d3\u30e5\u30fc\u30bb\u30af\u30b7\u30e7\u30f3\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;section id=\"reviews\" class=\"fade-in\">\n    &lt;h2 class=\"section-title\">\u30e6\u30fc\u30b6\u30fc\u30ec\u30d3\u30e5\u30fc&lt;\/h2>\n    &lt;p class=\"section-description\">\u5b9f\u969b\u306b\u30d7\u30ec\u30a4\u3057\u305f\u30e6\u30fc\u30b6\u30fc\u306e\u8a55\u4fa1\u3092\u30c1\u30a7\u30c3\u30af\uff01&lt;\/p>\n    &lt;div class=\"reviews-slider\">\n      &lt;div class=\"reviews-track\">\n        &lt;div class=\"review-card\">\n          &lt;h4>\u6700\u9ad8\u306e\u30a2\u30af\u30b7\u30e7\u30f3\u4f53\u9a13\uff01&lt;\/h4>\n          &lt;div class=\"rating\">&lt;span>\u2605\u2605\u2605\u2605\u2605&lt;\/span>&lt;\/div>\n          &lt;p>\u30a2\u30af\u30b7\u30e7\u30f3\u30b2\u30fc\u30e0\u306e\u6c7a\u5b9a\u7248\u3002\u30b0\u30e9\u30d5\u30a3\u30c3\u30af\u3082\u97f3\u697d\u3082\u6700\u9ad8\u3067\u3057\u305f\u3002&lt;\/p>\n        &lt;\/div>\n        &lt;div class=\"review-card\">\n          &lt;h4>\u58ee\u5927\u306a\u30b9\u30c8\u30fc\u30ea\u30fc\u306b\u5f15\u304d\u8fbc\u307e\u308c\u308b&lt;\/h4>\n          &lt;div class=\"rating\">&lt;span>\u2605\u2605\u2605\u2605\u2606&lt;\/span>&lt;\/div>\n          &lt;p>RPG\u306e\u4e16\u754c\u89b3\u304c\u7d20\u6674\u3089\u3057\u304f\u3001\u30b9\u30c8\u30fc\u30ea\u30fc\u306b\u306e\u3081\u308a\u8fbc\u307f\u307e\u3057\u305f\u3002&lt;\/p>\n        &lt;\/div>\n        &lt;div class=\"review-card\">\n          &lt;h4>\u30af\u30bb\u306b\u306a\u308b\u64cd\u4f5c\u611f\uff01&lt;\/h4>\n          &lt;div class=\"rating\">&lt;span>\u2605\u2605\u2605\u2605\u2605&lt;\/span>&lt;\/div>\n          &lt;p>\u30b7\u30e5\u30fc\u30c6\u30a3\u30f3\u30b0\u30b2\u30fc\u30e0\u3068\u3057\u3066\u975e\u5e38\u306b\u723d\u5feb\u306a\u64cd\u4f5c\u611f\u3067\u3001\u4f55\u5ea6\u3082\u6311\u6226\u3057\u307e\u3057\u305f\u3002&lt;\/p>\n        &lt;\/div>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/section>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30d6\u30ed\u30b0\u30bb\u30af\u30b7\u30e7\u30f3\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;section id=\"blog\" class=\"fade-in\">\n    &lt;h2 class=\"section-title\">\u6700\u65b0\u30d6\u30ed\u30b0&lt;\/h2>\n    &lt;p class=\"section-description\">\u30b2\u30fc\u30e0\u696d\u754c\u306e\u6700\u65b0\u60c5\u5831\u3084\u653b\u7565\u8a18\u4e8b\u3092\u304a\u5c4a\u3051\u3057\u307e\u3059\u3002&lt;\/p>\n    &lt;div class=\"blog-grid\">\n      &lt;div class=\"blog-card\">\n        &lt;img src=\"images\/blog1.jpg\" alt=\"\u30d6\u30ed\u30b0\u8a18\u4e8b1\" loading=\"lazy\">\n        &lt;div class=\"blog-card-content\">\n          &lt;h3>2025\u5e74\u306e\u6ce8\u76ee\u30b2\u30fc\u30e0\u30c8\u30ec\u30f3\u30c9&lt;\/h3>\n          &lt;p>\u4eca\u5e74\u6ce8\u76ee\u3059\u3079\u304d\u30b2\u30fc\u30e0\u306e\u50be\u5411\u3068\u4eca\u5f8c\u306e\u5c55\u671b\u306b\u3064\u3044\u3066\u89e3\u8aac\u3057\u307e\u3059\u3002&lt;\/p>\n          &lt;a href=\"#\" class=\"btn\">\u7d9a\u304d\u3092\u8aad\u3080&lt;\/a>\n        &lt;\/div>\n      &lt;\/div>\n      &lt;div class=\"blog-card\">\n        &lt;img src=\"images\/blog2.jpg\" alt=\"\u30d6\u30ed\u30b0\u8a18\u4e8b2\" loading=\"lazy\">\n        &lt;div class=\"blog-card-content\">\n          &lt;h3>\u30bb\u30fc\u30eb\u653b\u7565\uff1a\u304a\u5f97\u306b\u8cb7\u3046\u65b9\u6cd5&lt;\/h3>\n          &lt;p>\u8ce2\u304f\u8cb7\u3044\u7269\u3059\u308b\u305f\u3081\u306e\u88cf\u6280\u3084\u30dd\u30a4\u30f3\u30c8\u3092\u7d39\u4ecb\u3057\u307e\u3059\u3002&lt;\/p>\n          &lt;a href=\"#\" class=\"btn\">\u7d9a\u304d\u3092\u8aad\u3080&lt;\/a>\n        &lt;\/div>\n      &lt;\/div>\n      &lt;div class=\"blog-card\">\n        &lt;img src=\"images\/blog3.jpg\" alt=\"\u30d6\u30ed\u30b0\u8a18\u4e8b3\" loading=\"lazy\">\n        &lt;div class=\"blog-card-content\">\n          &lt;h3>\u30ec\u30d3\u30e5\u30fc\u3067\u9078\u3076\uff01\u304a\u3059\u3059\u3081\u30bf\u30a4\u30c8\u30eb&lt;\/h3>\n          &lt;p>\u5b9f\u969b\u306e\u30e6\u30fc\u30b6\u30fc\u30ec\u30d3\u30e5\u30fc\u3092\u3082\u3068\u306b\u3001\u4eba\u6c17\u30bf\u30a4\u30c8\u30eb\u3092\u30d4\u30c3\u30af\u30a2\u30c3\u30d7\u3002&lt;\/p>\n          &lt;a href=\"#\" class=\"btn\">\u7d9a\u304d\u3092\u8aad\u3080&lt;\/a>\n        &lt;\/div>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/section>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u5546\u54c1\u8a73\u7d30\u30e2\u30fc\u30c0\u30eb\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;div class=\"modal-overlay\" id=\"productModal\">\n    &lt;div class=\"modal\">\n      &lt;div class=\"modal-header\">\n        &lt;h2 id=\"modalTitle\">\u30b2\u30fc\u30e0\u8a73\u7d30&lt;\/h2>\n        &lt;span class=\"modal-close\" id=\"modalClose\">&amp;times;&lt;\/span>\n      &lt;\/div>\n      &lt;div class=\"modal-body\" id=\"modalBody\">\n        &lt;p id=\"modalDescription\">\u8a73\u7d30\u60c5\u5831\u304c\u3053\u3053\u306b\u8868\u793a\u3055\u308c\u307e\u3059\u3002&lt;\/p>\n        &lt;p>&lt;strong>\u30b8\u30e3\u30f3\u30eb:&lt;\/strong> &lt;span id=\"modalGenre\">&lt;\/span>&lt;\/p>\n        &lt;p>&lt;strong>\u4fa1\u683c:&lt;\/strong> &lt;span id=\"modalPrice\">&lt;\/span>&lt;\/p>\n      &lt;\/div>\n      &lt;div class=\"modal-footer\">\n        &lt;button class=\"btn\" id=\"modalBuyButton\">\u4eca\u3059\u3050\u8cfc\u5165&lt;\/button>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/div>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30ed\u30b0\u30a4\u30f3\u30e2\u30fc\u30c0\u30eb\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;div class=\"modal-overlay\" id=\"loginModal\">\n    &lt;div class=\"modal\">\n      &lt;div class=\"modal-header\">\n        &lt;h2>\u30ed\u30b0\u30a4\u30f3&lt;\/h2>\n        &lt;span class=\"modal-close\" id=\"loginClose\">&amp;times;&lt;\/span>\n      &lt;\/div>\n      &lt;div class=\"modal-body\">\n        &lt;form id=\"loginForm\">\n          &lt;label for=\"loginUsername\">\u30e6\u30fc\u30b6\u30fc\u540d:&lt;\/label>\n          &lt;input type=\"text\" id=\"loginUsername\" required>\n          &lt;label for=\"loginPassword\">\u30d1\u30b9\u30ef\u30fc\u30c9:&lt;\/label>\n          &lt;input type=\"password\" id=\"loginPassword\" required>\n          &lt;button class=\"btn\" type=\"submit\">\u30ed\u30b0\u30a4\u30f3&lt;\/button>\n        &lt;\/form>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/div>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u65b0\u898f\u767b\u9332\u30e2\u30fc\u30c0\u30eb\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;div class=\"modal-overlay\" id=\"registerModal\">\n    &lt;div class=\"modal\">\n      &lt;div class=\"modal-header\">\n        &lt;h2>\u65b0\u898f\u767b\u9332&lt;\/h2>\n        &lt;span class=\"modal-close\" id=\"registerClose\">&amp;times;&lt;\/span>\n      &lt;\/div>\n      &lt;div class=\"modal-body\">\n        &lt;form id=\"registerForm\">\n          &lt;label for=\"registerUsername\">\u30e6\u30fc\u30b6\u30fc\u540d:&lt;\/label>\n          &lt;input type=\"text\" id=\"registerUsername\" required>\n          &lt;label for=\"registerEmail\">\u30e1\u30fc\u30eb\u30a2\u30c9\u30ec\u30b9:&lt;\/label>\n          &lt;input type=\"email\" id=\"registerEmail\" required>\n          &lt;label for=\"registerPassword\">\u30d1\u30b9\u30ef\u30fc\u30c9:&lt;\/label>\n          &lt;input type=\"password\" id=\"registerPassword\" required>\n          &lt;button class=\"btn\" type=\"submit\">\u767b\u9332&lt;\/button>\n        &lt;\/form>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/div>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30ab\u30fc\u30c8\u30e2\u30fc\u30c0\u30eb\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;div class=\"modal-overlay\" id=\"cartModal\">\n    &lt;div class=\"modal\">\n      &lt;div class=\"modal-header\">\n        &lt;h2>\u30ab\u30fc\u30c8&lt;\/h2>\n        &lt;span class=\"modal-close\" id=\"cartClose\">&amp;times;&lt;\/span>\n      &lt;\/div>\n      &lt;div class=\"modal-body\" id=\"cartBody\">\n        &lt;p>\u30ab\u30fc\u30c8\u306b\u30a2\u30a4\u30c6\u30e0\u306f\u3042\u308a\u307e\u305b\u3093\u3002&lt;\/p>\n      &lt;\/div>\n      &lt;div class=\"modal-footer\">\n        &lt;button class=\"btn\" id=\"checkoutButton\">\u30c1\u30a7\u30c3\u30af\u30a2\u30a6\u30c8&lt;\/button>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/div>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u30e2\u30fc\u30c0\u30eb\uff08\u7ba1\u7406\u8005\u5411\u3051\uff09\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;div class=\"modal-overlay\" id=\"uploadModal\">\n    &lt;div class=\"modal\">\n      &lt;div class=\"modal-header\">\n        &lt;h2>\u30b2\u30fc\u30e0\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9&lt;\/h2>\n        &lt;span class=\"modal-close\" id=\"uploadClose\">&amp;times;&lt;\/span>\n      &lt;\/div>\n      &lt;div class=\"modal-body\">\n        &lt;form id=\"uploadForm\" enctype=\"multipart\/form-data\">\n          &lt;label for=\"uploadTitle\">\u30b2\u30fc\u30e0\u30bf\u30a4\u30c8\u30eb:&lt;\/label>\n          &lt;input type=\"text\" id=\"uploadTitle\" required>\n          &lt;label for=\"uploadGenre\">\u30b8\u30e3\u30f3\u30eb:&lt;\/label>\n          &lt;input type=\"text\" id=\"uploadGenre\" required>\n          &lt;label for=\"uploadPrice\">\u4fa1\u683c:&lt;\/label>\n          &lt;input type=\"number\" id=\"uploadPrice\" required>\n          &lt;label for=\"uploadDescription\">\u8aac\u660e:&lt;\/label>\n          &lt;textarea id=\"uploadDescription\" rows=\"4\" required>&lt;\/textarea>\n          &lt;label for=\"uploadFile\">\u753b\u50cf\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9:&lt;\/label>\n          &lt;input type=\"file\" id=\"uploadFile\" accept=\"image\/*\" required>\n          &lt;button class=\"btn\" type=\"submit\">\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9&lt;\/button>\n        &lt;\/form>\n      &lt;\/div>\n    &lt;\/div>\n  &lt;\/div>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       \u30d5\u30ed\u30fc\u30c6\u30a3\u30f3\u30b0\u30ab\u30fc\u30c8\u30dc\u30bf\u30f3\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;button id=\"cartButton\" style=\"position: fixed; bottom: 100px; right: 40px; background: var(--primary); color: var(--light); padding:12px; border:none; border-radius:50%; box-shadow: var(--shadow); cursor:pointer; z-index:1500;\">\n    \ud83d\uded2\n  &lt;\/button>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       Back-to-Top \u30dc\u30bf\u30f3\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;div id=\"backToTop\">&amp;#8679;&lt;\/div>\n\n  &lt;!--\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n       JavaScript\uff08\u5404\u7a2e\u6a5f\u80fd\u306e\u5b9f\u88c5\uff09\n  \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500-->\n  &lt;script>\n    \/\/ \u30cf\u30f3\u30d0\u30fc\u30ac\u30fc\u30e1\u30cb\u30e5\u30fc\u306e\u5207\u66ff\n    const hamburger = document.getElementById('hamburger');\n    const navMenu = document.getElementById('navMenu');\n    hamburger.addEventListener('click', () => {\n      navMenu.classList.toggle('active');\n    });\n\n    \/\/ \u30d2\u30fc\u30ed\u30fc\u30b9\u30e9\u30a4\u30c0\u30fc\uff08\u81ea\u52d5\u30fb\u624b\u52d5\u5207\u66ff\uff09\n    const slides = document.querySelectorAll('.hero-slide');\n    const heroControls = document.getElementById('heroControls');\n    let currentSlide = 0;\n    slides.forEach((_, index) => {\n      const dot = document.createElement('div');\n      dot.classList.add('hero-control');\n      if(index === 0) dot.classList.add('active');\n      dot.addEventListener('click', () => showSlide(index));\n      heroControls.appendChild(dot);\n    });\n    function showSlide(index) {\n      slides&#91;currentSlide].classList.remove('active');\n      heroControls.children&#91;currentSlide].classList.remove('active');\n      currentSlide = index;\n      slides&#91;currentSlide].classList.add('active');\n      heroControls.children&#91;currentSlide].classList.add('active');\n    }\n    setInterval(() => {\n      let next = (currentSlide + 1) % slides.length;\n      showSlide(next);\n    }, 5000);\n\n    \/\/ Back-to-Top \u30dc\u30bf\u30f3\u8868\u793a\n    const backToTop = document.getElementById('backToTop');\n    window.addEventListener('scroll', () => {\n      backToTop.style.display = window.scrollY > 300 ? 'block' : 'none';\n    });\n    backToTop.addEventListener('click', () => {\n      window.scrollTo({ top: 0, behavior: 'smooth' });\n    });\n\n    \/\/ IntersectionObserver \u306b\u3088\u308b\u30d5\u30a7\u30fc\u30c9\u30a4\u30f3\u52b9\u679c\n    const faders = document.querySelectorAll('.fade-in');\n    const appearOptions = { threshold: 0.1 };\n    const appearOnScroll = new IntersectionObserver((entries, observer) => {\n      entries.forEach(entry => {\n        if(entry.isIntersecting) {\n          entry.target.classList.add('visible');\n          observer.unobserve(entry.target);\n        }\n      });\n    }, appearOptions);\n    faders.forEach(fader => appearOnScroll.observe(fader));\n\n    \/\/ \u5546\u54c1\u8a73\u7d30\u30e2\u30fc\u30c0\u30eb\n    const gameCards = document.querySelectorAll('.game-card');\n    const productModal = document.getElementById('productModal');\n    const modalTitle = document.getElementById('modalTitle');\n    const modalDescription = document.getElementById('modalDescription');\n    const modalGenre = document.getElementById('modalGenre');\n    const modalPrice = document.getElementById('modalPrice');\n    const modalClose = document.getElementById('modalClose');\n    gameCards.forEach(card => {\n      card.addEventListener('click', () => {\n        modalTitle.textContent = card.getAttribute('data-title');\n        modalGenre.textContent = card.getAttribute('data-genre');\n        modalPrice.textContent = card.getAttribute('data-price');\n        modalDescription.textContent = card.getAttribute('data-description');\n        productModal.classList.add('active');\n      });\n    });\n    modalClose.addEventListener('click', () => productModal.classList.remove('active'));\n    productModal.addEventListener('click', (e) => { if(e.target === productModal) productModal.classList.remove('active'); });\n\n    \/\/ \u691c\u7d22\u30d5\u30a3\u30eb\u30bf\u30fc\n    const searchInput = document.getElementById('searchInput');\n    const searchButton = document.getElementById('searchButton');\n    searchButton.addEventListener('click', () => {\n      const query = searchInput.value.toLowerCase();\n      const cards = document.querySelectorAll('.game-card');\n      cards.forEach(card => {\n        const title = card.getAttribute('data-title').toLowerCase();\n        const genre = card.getAttribute('data-genre').toLowerCase();\n        card.style.display = (title.includes(query) || genre.includes(query)) ? 'block' : 'none';\n      });\n    });\n\n    \/\/ \u30d5\u30a3\u30eb\u30bf\u30fc\u30b5\u30a4\u30c9\u30d0\u30fc\u6a5f\u80fd\n    const filterGenre = document.getElementById('filterGenre');\n    const filterPrice = document.getElementById('filterPrice');\n    const applyFilter = document.getElementById('applyFilter');\n    applyFilter.addEventListener('click', () => {\n      const genreValue = filterGenre.value;\n      const priceValue = filterPrice.value;\n      const cards = document.querySelectorAll('.game-card');\n      cards.forEach(card => {\n        const cardGenre = card.getAttribute('data-genre');\n        const cardPrice = parseInt(card.getAttribute('data-price')) || 0;\n        let matchesGenre = genreValue === \"\" || cardGenre === genreValue;\n        let matchesPrice = !priceValue || (cardPrice &amp;&amp; cardPrice &lt;= parseInt(priceValue));\n        card.style.display = (matchesGenre &amp;&amp; matchesPrice) ? 'block' : 'none';\n      });\n    });\n\n    \/\/ \u30ed\u30b0\u30a4\u30f3\u30e2\u30fc\u30c0\u30eb\n    const loginModal = document.getElementById('loginModal');\n    const loginClose = document.getElementById('loginClose');\n    loginClose.addEventListener('click', () => loginModal.classList.remove('active'));\n    loginModal.addEventListener('click', (e) => { if(e.target === loginModal) loginModal.classList.remove('active'); });\n\n    \/\/ \u65b0\u898f\u767b\u9332\u30e2\u30fc\u30c0\u30eb\n    const registerModal = document.getElementById('registerModal');\n    const registerClose = document.getElementById('registerClose');\n    registerClose.addEventListener('click', () => registerModal.classList.remove('active'));\n    registerModal.addEventListener('click', (e) => { if(e.target === registerModal) registerModal.classList.remove('active'); });\n\n    \/\/ \u30ab\u30fc\u30c8\u30e2\u30fc\u30c0\u30eb\n    const cartModal = document.getElementById('cartModal');\n    const cartClose = document.getElementById('cartClose');\n    const cartButton = document.getElementById('cartButton');\n    cartButton.addEventListener('click', () => cartModal.classList.add('active'));\n    cartClose.addEventListener('click', () => cartModal.classList.remove('active'));\n    cartModal.addEventListener('click', (e) => { if(e.target === cartModal) cartModal.classList.remove('active'); });\n\n    \/\/ \u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u30e2\u30fc\u30c0\u30eb\uff08\u7ba1\u7406\u8005\u5411\u3051\uff09\n    const uploadModal = document.getElementById('uploadModal');\n    const uploadLink = document.getElementById('uploadLink');\n    const uploadClose = document.getElementById('uploadClose');\n    uploadLink.addEventListener('click', (e) => {\n      e.preventDefault();\n      uploadModal.classList.add('active');\n    });\n    uploadClose.addEventListener('click', () => uploadModal.classList.remove('active'));\n    uploadModal.addEventListener('click', (e) => { if(e.target === uploadModal) uploadModal.classList.remove('active'); });\n\n    \/\/ \u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u30d5\u30a9\u30fc\u30e0\u9001\u4fe1\uff08\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u30c7\u30fc\u30bf\u3092localStorage\u3078\u4fdd\u5b58\uff09\n    const uploadForm = document.getElementById('uploadForm');\n    uploadForm.addEventListener('submit', (e) => {\n      e.preventDefault();\n      const title = document.getElementById('uploadTitle').value;\n      const genre = document.getElementById('uploadGenre').value;\n      const price = document.getElementById('uploadPrice').value + \"\u5186\";\n      const description = document.getElementById('uploadDescription').value;\n      const fileInput = document.getElementById('uploadFile');\n      const file = fileInput.files&#91;0];\n      if(file) {\n        const reader = new FileReader();\n        reader.onload = function(event) {\n          const imageData = event.target.result;\n          const gameData = { title, genre, price, description, image: imageData };\n          let uploadedGames = JSON.parse(localStorage.getItem('uploadedGames')) || &#91;];\n          uploadedGames.push(gameData);\n          localStorage.setItem('uploadedGames', JSON.stringify(uploadedGames));\n          loadUploadedGames();\n          alert('\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u304c\u5b8c\u4e86\u3057\u307e\u3057\u305f\u3002');\n          uploadModal.classList.remove('active');\n          uploadForm.reset();\n        };\n        reader.readAsDataURL(file);\n      }\n    });\n\n    \/\/ \u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u6e08\u307f\u30b2\u30fc\u30e0\u3092\u8aad\u307f\u8fbc\u307f\u8868\u793a\u3059\u308b\uff08\u300c\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u3057\u305f\u30b2\u30fc\u30e0\u300d\u30bb\u30af\u30b7\u30e7\u30f3\uff09\n    function loadUploadedGames() {\n      const grid = document.getElementById('myUploadsGrid');\n      let uploadedGames = JSON.parse(localStorage.getItem('uploadedGames')) || &#91;];\n      grid.innerHTML = \"\";\n      uploadedGames.forEach(game => {\n        const card = document.createElement('div');\n        card.classList.add('game-card');\n        card.setAttribute('data-title', game.title);\n        card.setAttribute('data-genre', game.genre);\n        card.setAttribute('data-price', game.price);\n        card.setAttribute('data-description', game.description);\n        card.innerHTML = `\n          &lt;img src=\"${game.image}\" alt=\"${game.title}\" loading=\"lazy\">\n          &lt;div class=\"game-card-content\">\n            &lt;h3>${game.title}&lt;\/h3>\n            &lt;p>\u30b8\u30e3\u30f3\u30eb: ${game.genre}&lt;\/p>\n            &lt;p class=\"price\">${game.price}&lt;\/p>\n          &lt;\/div>\n          &lt;div class=\"card-overlay\">&lt;\/div>\n        `;\n        card.addEventListener('click', () => {\n          modalTitle.textContent = game.title;\n          modalGenre.textContent = game.genre;\n          modalPrice.textContent = game.price;\n          modalDescription.textContent = game.description;\n          productModal.classList.add('active');\n        });\n        grid.appendChild(card);\n      });\n    }\n    \/\/ \u30da\u30fc\u30b8\u8aad\u307f\u8fbc\u307f\u6642\u306b\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u6e08\u307f\u30b2\u30fc\u30e0\u3092\u8868\u793a\n    loadUploadedGames();\n  &lt;\/script>\n&lt;\/body>\n&lt;footer>\n  &lt;div class=\"footer-container\">\n    &lt;div class=\"footer-col\">\n      &lt;h4>\u4f1a\u793e\u60c5\u5831&lt;\/h4>\n      &lt;ul>\n        &lt;li>&lt;a href=\"#\">\u4f01\u696d\u7406\u5ff5&lt;\/a>&lt;\/li>\n        &lt;li>&lt;a href=\"#\">\u63a1\u7528\u60c5\u5831&lt;\/a>&lt;\/li>\n        &lt;li>&lt;a href=\"#\">\u30d7\u30ec\u30b9\u30ea\u30ea\u30fc\u30b9&lt;\/a>&lt;\/li>\n      &lt;\/ul>\n    &lt;\/div>\n    &lt;div class=\"footer-col\">\n      &lt;h4>\u30b5\u30dd\u30fc\u30c8&lt;\/h4>\n      &lt;ul>\n        &lt;li>&lt;a href=\"#\">\u304a\u554f\u3044\u5408\u308f\u305b&lt;\/a>&lt;\/li>\n        &lt;li>&lt;a href=\"#\">FAQ&lt;\/a>&lt;\/li>\n        &lt;li>&lt;a href=\"#\">\u5229\u7528\u898f\u7d04&lt;\/a>&lt;\/li>\n      &lt;\/ul>\n    &lt;\/div>\n    &lt;div class=\"footer-col\">\n      &lt;h4>\u30cb\u30e5\u30fc\u30b9\u30ec\u30bf\u30fc&lt;\/h4>\n      &lt;p>\u6700\u65b0\u60c5\u5831\u3092\u30e1\u30fc\u30eb\u3067\u53d7\u3051\u53d6\u308b&lt;\/p>\n      &lt;form class=\"subscribe-form\">\n        &lt;input type=\"email\" placeholder=\"\u30e1\u30fc\u30eb\u30a2\u30c9\u30ec\u30b9\" required>\n        &lt;button type=\"submit\">\u767b\u9332&lt;\/button>\n      &lt;\/form>\n    &lt;\/div>\n  &lt;\/div>\n  &lt;div class=\"footer-bottom\">&amp;copy; 2025 GameStore Ultra. All rights reserved.&lt;\/div>\n&lt;\/footer>\n&lt;\/html>\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"categories":[80],"tags":[3],"class_list":["post-25884","post","type-post","status-publish","format-standard","hentry","category-html","tag-programming"],"aioseo_notices":[],"jetpack_featured_media_url":"","_links":{"self":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/25884","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=25884"}],"version-history":[{"count":1,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/25884\/revisions"}],"predecessor-version":[{"id":25885,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/25884\/revisions\/25885"}],"wp:attachment":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=25884"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=25884"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=25884"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}