News | 蒲田めい公式ウェブサイチE/title> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/responsive.css"> <link rel="stylesheet" href="css/animations.css"> <link rel="stylesheet" href="css/enhanced-scroll.css?v=1"> <link rel="stylesheet" href="css/mobile.css?v=1778950000"> <script src="https://cdn.jsdelivr.net/npm/dompurify@3.2.4/dist/purify.min.js"></script> <script src="/js/seo-loader.js"></script> <meta property="og:type" content="website"> <meta property="og:url" content="https://kamatamei-official.jp/news-detail.html"> <meta name="twitter:card" content="summary_large_image"> <meta property="og:title" content="蒲田めい | Singer Songwriter - Official Website"> <meta property="og:site_name" content="蒲田めい | Singer Songwriter - Official Website"> <meta name="twitter:title" content="蒲田めい | Singer Songwriter - Official Website"> <meta property="og:description" content="シンガーソングライター蒲田めい公式ウェブサイト。神奈川を中心に活動中。最新ライブスケジュール、楽曲情報、ミュージックビデオ、ギャラリーなどをお届けします。"> <meta name="twitter:description" content="シンガーソングライター蒲田めい公式ウェブサイト。神奈川を中心に活動中。最新ライブスケジュール、楽曲情報、ミュージックビデオ、ギャラリーなどをお届けします。"> <meta name="keywords" content="蒲田めい, Mei Kamata, シンガーソングライター, Singer Songwriter, ライブ, 音楽, 神奈川, 鎌倉FM, MUSIC GIRL V"> <link rel="manifest" href="/manifest.json"> <link rel="apple-touch-icon" href="/favicon.png"> <meta name="theme-color" content="#d4af37"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> <meta name="apple-mobile-web-app-title" content="蒲田めい"> </head> <body class="news-detail-page">  <header class="header"> <div class="header-inner container-wide"> <a href="index.html" class="logo">蒲田めい</a> <nav class="nav"> <ul class="nav-list"> <li><a href="profile.html" class="nav-link">Profile</a></li> <li><a href="news.html" class="nav-link">News</a></li> <li><a href="live.html" class="nav-link">Live</a></li> <li><a href="music.html" class="nav-link">Music</a></li> <li><a href="video.html" class="nav-link">Video</a></li> <li><a href="news/goods.html" class="nav-link">Goods</a></li> <li><a href="shops.html" class="nav-link">Shops</a></li> <li><a href="gallery.html" class="nav-link">Gallery</a></li> <li><a href="contact.html" class="nav-link">Contact</a></li> </ul> </nav> <button class="menu-toggle" aria-label="メニューを開ぁE> <span></span> <span></span> <span></span> </button> </div> </header> <div class="menu-overlay"> <nav> <ul class="nav-list"> <li><a href="profile.html" class="nav-link">Profile</a></li> <li><a href="news.html" class="nav-link active">News</a></li> <li><a href="live.html" class="nav-link">Live</a></li> <li><a href="music.html" class="nav-link">Music</a></li> <li><a href="video.html" class="nav-link">Video</a></li> <li><a href="news/goods.html" class="nav-link">Goods</a></li> <li><a href="shops.html" class="nav-link">Shops</a></li> <li><a href="gallery.html" class="nav-link">Gallery</a></li> <li><a href="contact.html" class="nav-link">Contact</a></li> </ul> </nav> </div>  <section class="page-hero bg-wood"> <div class="container"> <h1 class="page-hero-title fade-in">News</h1> <p class="page-hero-subtitle fade-in delay-2">最新惁E��</p> </div> </section>  <section class="section bg-paper"> <div class="container">  <div id="newsLoading" style="text-align: center; padding: 60px 20px;"> <p>読み込み中...</p> </div>  <article id="newsArticle" style="display: none; max-width: 800px; margin: 0 auto;"> <div style="margin-bottom: 20px;"> <time id="newsDate" class="news-article-date"></time> <span id="newsCategory" class="news-category"></span> </div> <h1 id="newsTitle" style="font-size: 2rem; margin-bottom: 30px; font-family: var(--font-heading);"></h1> <div id="newsContent" style="line-height: 1.9; margin-bottom: 40px;">  </div>  <div style="margin: 40px 0; padding: 20px 0; border-top: 1px solid var(--color-border);"> <h3 style="font-size: 1.1rem; margin-bottom: 15px;">シェア</h3> <div style="display: flex; gap: 10px;"> <a href="#" id="twitterShare" class="btn btn-outline" target="_blank" rel="noopener"> Twitter </a> <a href="#" id="facebookShare" class="btn btn-outline" target="_blank" rel="noopener"> Facebook </a> </div> </div> <div style="text-align: center; margin-top: 40px;"> <a href="news.html" class="btn btn-primary">一覧に戻めE/a> </div> </article>  <div id="newsNotFound" style="display: none; text-align: center; padding: 60px 20px;"> <h2 style="font-size: 1.5rem; margin-bottom: 20px;">記事が見つかりませんでした</h2> <p style="margin-bottom: 30px; color: var(--color-secondary);"> お探し�Eニュースは削除されたか、URLが間違ってぁE��可能性があります、E </p> <a href="news.html" class="btn btn-primary">ニュース一覧に戻めE/a> </div> </div> </section>  <footer class="footer"> <div class="footer-content"> <h2 class="footer-artist-name">蒲田めい</h2> <div class="footer-social"> <a href="#" aria-label="Twitter"> <svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24"> <path d="M23 3a10.9 10.9 0 01-3.14 1.53 4.48 4.48 0 00-7.86 3v1A10.66 10.66 0 013 4s-4 9 5 13a11.64 11.64 0 01-7 2c9 5 20 0 20-11.5a4.5 4.5 0 00-.08-.83A7.72 7.72 0 0023 3z"> </path> </svg> </a> <a href="#" aria-label="Instagram"> <svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24"> <rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect> <path d="M16 11.37A4 4 0 1112.63 8 4 4 0 0116 11.37z"></path> <line x1="17.5" y1="6.5" x2="17.51" y2="6.5"></line> </svg> </a> <a href="#" aria-label="YouTube"> <svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24"> <path d="M22.54 6.42a2.78 2.78 0 00-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 00-1.94 2A29 29 0 001 11.75a29 29 0 00.46 5.33A2.78 2.78 0 003.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 001.94-2 29 29 0 00.46-5.25 29 29 0 00-.46-5.33z"> </path> <polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"></polygon> </svg> </a> <a href="#" aria-label="Spotify"> <svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="10"></circle> <path d="M15.5 11.5c-2.5-1.5-6.5-1.6-8.8-.9-.4.1-.7-.1-.8-.4-.1-.4.1-.7.4-.8 2.7-.8 7.1-.7 9.9.9.3.2.4.6.2.9-.3.3-.6.4-.9.3z"> </path> </svg> </a> </div> <nav class="footer-links"> <a href="profile.html" class="footer-link">Profile</a> <a href="news.html" class="footer-link">News</a> <a href="live.html" class="footer-link">Live</a> <a href="music.html" class="footer-link">Music</a> <a href="video.html" class="footer-link">Video</a> <a href="news/goods.html" class="footer-link">Goods</a> <a href="shops.html" class="footer-link">Shops</a> <a href="gallery.html" class="footer-link">Gallery</a> <a href="contact.html" class="footer-link">Contact</a> </nav> <div class="footer-copyright"> © 2026 蒲田めい. All Rights Reserved. </div> </div> </footer> <script src="js/main.js"></script> <script> console.log('news-detail.html: スクリプト開姁E); // URLパラメータからIDを取征E function getNewsIdFromUrl() { const params = new URLSearchParams(window.location.search); return params.get('id'); } // LocalStorageからニュースを取征E function getNewsById(newsId) { try { const adminData = localStorage.getItem('adminData'); if (!adminData) { console.warn('LocalStorageにadminDataが見つかりません'); return null; } const data = JSON.parse(adminData); const allNews = data.news || []; return allNews.find(item => item.id === newsId); } catch (e) { console.error('ニュース取得エラー:', e); return null; } } // ニュース詳細を表示 function displayNewsDetail() { const newsId = getNewsIdFromUrl(); console.log('ニュースID:', newsId); const newsLoading = document.getElementById('newsLoading'); const newsArticle = document.getElementById('newsArticle'); const newsNotFound = document.getElementById('newsNotFound'); if (!newsId) { console.error('ニュースIDが指定されてぁE��せん'); newsLoading.style.display = 'none'; newsNotFound.style.display = 'block'; return; } const newsItem = getNewsById(newsId); if (!newsItem) { console.error('ニュースが見つかりません:', newsId); newsLoading.style.display = 'none'; newsNotFound.style.display = 'block'; return; } console.log('ニュースを表示:', newsItem); // 日付�EフォーマッチE const date = new Date(newsItem.publishDate); const dateStr = date.toLocaleDateString('ja-JP', { year: 'numeric', month: '2-digit', day: '2-digit' }).replace(/\//g, '.'); // ペ�Eジタイトル document.getElementById('pageTitle').textContent = `${newsItem.title} | 蒲田めい`; // 記事情報を表示 document.getElementById('newsDate').textContent = dateStr; document.getElementById('newsCategory').textContent = newsItem.category; document.getElementById('newsTitle').textContent = newsItem.title; // XSS対策: DOMPurifyでサニタイズしてからinnerHTML const __raw = newsItem.content || ''; const __safe = (window.DOMPurify && window.DOMPurify.sanitize) ? window.DOMPurify.sanitize(__raw, { ADD_ATTR: ['target', 'rel'] }) : __raw.replace(/<script[\s\S]*?<\/script>/gi, '').replace(/ on\w+="[^"]*"/gi, '').replace(/ on\w+='[^']*'/gi, '').replace(/javascript:/gi, ''); document.getElementById('newsContent').innerHTML = __safe; // シェアボタンのURL設宁E const currentUrl = encodeURIComponent(window.location.href); const title = encodeURIComponent(newsItem.title); document.getElementById('twitterShare').href = `https://twitter.com/intent/tweet?url=${currentUrl}&text=${title}`; document.getElementById('facebookShare').href = `https://www.facebook.com/sharer/sharer.php?u=${currentUrl}`; // 表示刁E��替ぁE newsLoading.style.display = 'none'; newsArticle.style.display = 'block'; } // ペ�Eジ読み込み時に実衁E document.addEventListener('DOMContentLoaded', displayNewsDetail); </script> <script src="js/enhanced-scroll.js?v=1"></script> <script> if ("serviceWorker" in navigator) { window.addEventListener("load", function() { navigator.serviceWorker.register("/sw.js") .catch(function(e) { console.warn("SW:", e); }); }); } </script> </body> </html>