{"id":47,"date":"2025-07-24T15:32:50","date_gmt":"2025-07-24T06:32:50","guid":{"rendered":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/?page_id=47"},"modified":"2026-03-29T20:32:11","modified_gmt":"2026-03-29T11:32:11","slug":"calendar","status":"publish","type":"page","link":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/ja\/calendar\/","title":{"rendered":"\u30ab\u30ec\u30f3\u30c0\u30fc"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"47\" class=\"elementor elementor-47\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c61a3c8 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"c61a3c8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ac66bd7 elementor-widget elementor-widget-spacer\" data-id=\"ac66bd7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cad8d74 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"cad8d74\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-20d2689 elementor-widget elementor-widget-image\" data-id=\"20d2689\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"2000\" height=\"119\" src=\"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-content\/uploads\/2025\/12\/6e51567eb27be36381af87b0c79ffbfc.png\" class=\"attachment-full size-full wp-image-1039\" alt=\"\" srcset=\"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-content\/uploads\/2025\/12\/6e51567eb27be36381af87b0c79ffbfc.png 2000w, https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-content\/uploads\/2025\/12\/6e51567eb27be36381af87b0c79ffbfc-300x18.png 300w, https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-content\/uploads\/2025\/12\/6e51567eb27be36381af87b0c79ffbfc-1024x61.png 1024w, https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-content\/uploads\/2025\/12\/6e51567eb27be36381af87b0c79ffbfc-768x46.png 768w, https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-content\/uploads\/2025\/12\/6e51567eb27be36381af87b0c79ffbfc-1536x91.png 1536w\" sizes=\"(max-width: 2000px) 100vw, 2000px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-83754fe elementor-widget elementor-widget-spacer\" data-id=\"83754fe\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b35231e e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"b35231e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-5de9b78 e-grid e-con-full wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-child\" data-id=\"5de9b78\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-90233b5 elementor-widget__width-initial elementor-widget elementor-widget-html\" data-id=\"90233b5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Kiwi+Maru:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n\r\n<div class=\"cal-card\">\r\n  <div class=\"cal-header\">\r\n    <button class=\"cal-btn btn-prev\" id=\"prevMonth\">&lt; \u524d\u306e\u6708<\/button>\r\n    <div class=\"cal-title\" id=\"monthDisplay\"><\/div>\r\n    <button class=\"cal-btn btn-next\" id=\"nextMonth\">\u6b21\u306e\u6708 &gt;<\/button>\r\n  <\/div>\r\n  \r\n  <div class=\"cal-grid\" id=\"calendarGrid\"><\/div>\r\n<\/div>\r\n\r\n<div id=\"eventModal\" class=\"modal-overlay\">\r\n  <div class=\"modal-content\">\r\n    <div class=\"modal-header\">\r\n      <span id=\"modalDate\" class=\"modal-date\"><\/span>\r\n      <button id=\"closeModal\" class=\"modal-close\">&times;<\/button>\r\n    <\/div>\r\n    <div class=\"modal-body\">\r\n      <div id=\"modalImageArea\" style=\"display:none; margin-bottom:15px; text-align:center;\">\r\n        <img decoding=\"async\" id=\"modalImg\" src=\"\" alt=\"event-image\" style=\"max-width:100%; height:auto; border-radius:10px;\">\r\n      <\/div>\r\n      <div id=\"modalBodyText\" style=\"white-space: pre-wrap;\"><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\n  :root {\r\n    --bg-color: #fdfaf5;\r\n    --border-color: #e0e0e0; \r\n    --text-main: #666;\r\n    --accent-color: #c08c5d; \r\n    --holiday-text: #e67e22; \r\n    --event-bg: #f0f0f0;    \r\n  }\r\n\r\n  \/* \u57fa\u672c\u306e\u898b\u305f\u76ee\u8a2d\u5b9a\uff08\u524d\u56de\u3068\u540c\u3058\uff09 *\/\r\n  .cal-card { background: #fff; border: 1px solid var(--border-color); border-radius: 12px; padding: 20px; font-family: \"Kiwi Maru\", serif; color: var(--text-main); max-width: 900px; margin: 0 auto; box-sizing: border-box; }\r\n  .cal-header { display: flex !important; justify-content: center; align-items: center; position: relative; margin-bottom: 20px; height: 40px; }\r\n  .cal-title { font-size: 20px; font-weight: bold; color: #888; }\r\n  .cal-btn { position: absolute; background: #f5f0e6; border: none; padding: 6px 15px; border-radius: 20px; color: #888; cursor: pointer; font-size: 17px; font-family: \"Kiwi Maru\", serif; }\r\n  .btn-prev { left: 0; }\r\n  .btn-next { right: 0; }\r\n  .cal-grid { display: grid !important; grid-template-columns: repeat(7, 1fr) !important; border-top: 1px solid var(--border-color) !important; border-left: 1px solid var(--border-color) !important; }\r\n  .day-name, .cal-cell { border-right: 1px solid var(--border-color) !important; border-bottom: 1px solid var(--border-color) !important; }\r\n  .day-name { text-align: center; font-weight: bold; padding: 12px 0; font-size: 14px; background-color: #fafafa; }\r\n  .sun { color: #d9534f; }\r\n  .sat { color: #4a90e2; }\r\n  .cal-cell { min-height: 100px; padding: 8px; display: flex !important; flex-direction: column; align-items: flex-start; }\r\n  .date-num { font-size: 18px; width: 30px; height: 30px; text-align: center; line-height: 26px; }\r\n  .today .date-num { background: var(--accent-color); color: #fff; border-radius: 50%; }\r\n\r\n  .label { display: block; width: 95%; margin: auto auto; text-align: center; font-size: 17px; padding: 4px 0; border-radius: 15px; cursor: default; }\r\n  .label-closed { color: var(--holiday-text); font-weight: bold; }\r\n  .label-event { background: var(--event-bg); color: #888; transition: 0.2s; cursor: pointer; }\r\n  .label-event:hover { background: var(--accent-color); color: #fff; }\r\n\r\n  \/* \u30dd\u30c3\u30d7\u30a2\u30c3\u30d7\u306eCSS *\/\r\n  .modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 100000; justify-content: center; align-items: center; backdrop-filter: blur(2px); }\r\n  .modal-content { background: #fff; width: 90%; max-width: 450px; padding: 25px; border-radius: 20px; box-shadow: 0 10px 25px rgba(0,0,0,0.2); font-family: \"Kiwi Maru\", serif; position: relative; animation: modalFadeIn 0.3s ease; }\r\n  @keyframes modalFadeIn { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } }\r\n  .modal-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eee; margin-bottom: 15px; padding-bottom: 10px; }\r\n  .modal-date { font-weight: bold; color: var(--accent-color); font-size: 18px; }\r\n  .modal-close {\r\n      background: none;\r\n   border: none;\r\n   font-size: 28px;\r\n   cursor: pointer;\r\n   color: #999;\r\n   line-height: 1;\r\n   \r\n   \/* \u2605\u4ee5\u4e0b\u306e5\u884c\u3092\u8ffd\u52a0\u3059\u308b\u3068\u3001\u30db\u30d0\u30fc\u6642\u306e\u80cc\u666f\u304c\u7dba\u9e97\u306b\u306a\u308a\u307e\u3059 *\/\r\n   width: 40px;           \/* \u30dc\u30bf\u30f3\u306e\u6a2a\u5e45 *\/\r\n   height: 40px;          \/* \u30dc\u30bf\u30f3\u306e\u9ad8\u3055 *\/\r\n   display: flex;         \/* \u4e2d\u592e\u5bc4\u305b\u7528 *\/\r\n   align-items: center;   \/* \u4e2d\u592e\u5bc4\u305b\u7528 *\/\r\n   justify-content: center; \/* \u4e2d\u592e\u5bc4\u305b\u7528 *\/\r\n   transition: 0.2s;      \/* \u5909\u5316\u3092\u306a\u3081\u3089\u304b\u306b *\/\r\n   border-radius: 10%;    \/* \u2605\u3053\u3053\u304c\u300c\u4e38\u307f\u300d\u3067\u3059\u300250%\u3067\u6b63\u5186\u306b\u306a\u308a\u307e\u3059 *\/\r\n }\r\n\r\n \/* \u2605\u30db\u30d0\u30fc\u6642\u306e\u30b9\u30bf\u30a4\u30eb\u3092\u660e\u793a\u7684\u306b\u8ffd\u52a0 *\/\r\n .modal-close:hover {\r\n   background-color: #c85a3c; \/* \u30db\u30d0\u30fc\u6642\u306e\u80cc\u666f\u8272\uff08\u8584\u3044\u30b0\u30ec\u30fc\uff09 *\/\r\n   color: #ffffff;               \/* \u30db\u30d0\u30fc\u6642\u306e\u00d7\u5370\u306e\u8272\uff08\u6fc3\u3044\u30b0\u30ec\u30fc\uff09 *\/\r\n   border-radius: 10%;        \/* \u2605\u30db\u30d0\u30fc\u6642\u3082\u4e38\u307f\u3092\u7dad\u6301\uff08\u56db\u89d2\u304f\u3057\u305f\u3044\u306a\u3089 0px\uff09 *\/}\r\n  .modal-body { color: #555; line-height: 1.6; font-size: 16px; }\r\n<\/style>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n  const csvUrl = 'https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vRUdjwDqUGWGVI6yWkrbOZCK-ac5Or8YR_pvKk31lecJEslZ8tvXbH2nrA1IJ_7n3gqClkOb1s-1skC\/pub?gid=0&single=true&output=csv';\r\n\r\n  let eventData = {};\r\n  let closedDays = [];\r\n  let displayDate = new Date();\r\n\r\n  \/\/ \u30e2\u30fc\u30c0\u30eb\u8981\u7d20\u306e\u53d6\u5f97\r\n  const modal = document.getElementById('eventModal');\r\n  const modalDate = document.getElementById('modalDate');\r\n  const modalBodyText = document.getElementById('modalBodyText');\r\n  const modalImageArea = document.getElementById('modalImageArea');\r\n  const modalImg = document.getElementById('modalImg');\r\n  const closeModal = document.getElementById('closeModal');\r\n\r\n  closeModal.onclick = () => { modal.style.display = 'none'; };\r\n  window.onclick = (e) => { if (e.target == modal) modal.style.display = 'none'; };\r\n\r\n  async function loadSheetData() {\r\n    try {\r\n      const response = await fetch(csvUrl);\r\n      const csvText = await response.text();\r\n      const rows = csvText.split(\/\\r?\\n\/).slice(1);\r\n      \r\n      eventData = {}; \r\n      closedDays = [];\r\n      \r\n      rows.forEach(row => {\r\n        const columns = row.split(',');\r\n        if (columns.length < 2) return;\r\n        const dateRaw = columns[0].trim();\r\n        const type = columns[1].trim();\r\n        \r\n        \/\/ E\u5217\uff08\u30a4\u30f3\u30c7\u30c3\u30af\u30b94\uff09: \u8aac\u660e\r\n        \/\/ F\u5217\uff08\u30a4\u30f3\u30c7\u30c3\u30af\u30b95\uff09: \u753b\u50cfURL\r\n        const description = columns[4] ? columns[4].trim().replace(\/^\"|\"$\/g, '') : '\u8a73\u7d30\u306f\u3042\u308a\u307e\u305b\u3093\u3002';\r\n        const imageUrl = columns[5] ? columns[5].trim().replace(\/^\"|\"$\/g, '') : '';\r\n        \r\n        const d = new Date(dateRaw);\r\n        if (isNaN(d.getTime())) return;\r\n        const formattedDate = d.getFullYear() + '-' + String(d.getMonth() + 1).padStart(2, '0') + '-' + String(d.getDate()).padStart(2, '0');\r\n        \r\n        if (type === '\u30a4\u30d9\u30f3\u30c8') { \r\n          eventData[formattedDate] = { \r\n            desc: description,\r\n            img: imageUrl\r\n          }; \r\n        } else if (type === '\u4f11\u9928\u65e5') { \r\n          closedDays.push(formattedDate); \r\n        }\r\n      });\r\n      renderCalendar(displayDate);\r\n    } catch (e) {\r\n      console.error('Data Fetch Error:', e);\r\n      renderCalendar(displayDate);\r\n    }\r\n  }\r\n\r\n  function renderCalendar(date) {\r\n    const grid = document.getElementById('calendarGrid');\r\n    const title = document.getElementById('monthDisplay');\r\n    if(!grid || !title) return;\r\n    grid.innerHTML = '';\r\n    const year = date.getFullYear();\r\n    const month = date.getMonth();\r\n    title.innerText = `${year}\u5e74${month + 1}\u6708`;\r\n\r\n    const dayNames = ['\u6708', '\u706b', '\u6c34', '\u6728', '\u91d1', '\u571f', '\u65e5'];\r\n    dayNames.forEach((name, i) => {\r\n      const cls = i === 5 ? 'sat' : (i === 6 ? 'sun' : '');\r\n      grid.innerHTML += `<div class=\"day-name ${cls}\">${name}<\/div>`;\r\n    });\r\n\r\n    let firstDay = new Date(year, month, 1).getDay();\r\n    let shift = (firstDay === 0) ? 6 : firstDay - 1;\r\n    const daysInMonth = new Date(year, month + 1, 0).getDate();\r\n\r\n    for (let i = 0; i < shift; i++) { grid.innerHTML += '<div class=\"cal-cell\"><\/div>'; }\r\n\r\n    const today = new Date();\r\n    const todayStr = today.getFullYear() + '-' + String(today.getMonth() + 1).padStart(2, '0') + '-' + String(today.getDate()).padStart(2, '0');\r\n\r\n    for (let d = 1; d <= daysInMonth; d++) {\r\n      const dateStr = year + '-' + String(month + 1).padStart(2, '0') + '-' + String(d).padStart(2, '0');\r\n      let content = '';\r\n      if (eventData[dateStr]) {\r\n        content = `<div class=\"label label-event\" onclick=\"showEvent('${dateStr}')\">\u30a4\u30d9\u30f3\u30c8<\/div>`;\r\n      } else if (closedDays.includes(dateStr)) {\r\n        content = `<span class=\"label label-closed\">\u4f11\u9928\u65e5<\/span>`;\r\n      }\r\n      const isToday = (dateStr === todayStr);\r\n      grid.innerHTML += `<div class=\"cal-cell ${isToday ? 'today' : ''}\"><span class=\"date-num\">${d}<\/span>${content}<\/div>`;\r\n    }\r\n  }\r\n\r\n  \/\/ \u30dd\u30c3\u30d7\u30a2\u30c3\u30d7\u3092\u8868\u793a\u3059\u308b\u95a2\u6570\r\n  window.showEvent = function(dateKey) {\r\n    const info = eventData[dateKey];\r\n    if (!info) return;\r\n    \r\n    const d = new Date(dateKey);\r\n    modalDate.innerText = `${d.getMonth() + 1}\u6708${d.getDate()}\u65e5\u306e\u30a4\u30d9\u30f3\u30c8`;\r\n    modalBodyText.innerText = info.desc;\r\n\r\n    \/\/ \u2605\u753b\u50cf\u306e\u6709\u7121\u3092\u5224\u5b9a\r\n    if (info.img && info.img.startsWith('http')) {\r\n      modalImg.src = info.img;\r\n      modalImageArea.style.display = 'block';\r\n    } else {\r\n      modalImageArea.style.display = 'none';\r\n    }\r\n\r\n    modal.style.display = 'flex';\r\n  };\r\n\r\n  document.getElementById('prevMonth').onclick = () => { displayDate.setMonth(displayDate.getMonth() - 1); renderCalendar(displayDate); };\r\n  document.getElementById('nextMonth').onclick = () => { displayDate.setMonth(displayDate.getMonth() + 1); renderCalendar(displayDate); };\r\n\r\n  loadSheetData();\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0800d6f elementor-widget elementor-widget-text-editor\" data-id=\"0800d6f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p style=\"text-align: left;\">\u958b\u50ac\u4e2d\u306e\u30a4\u30d9\u30f3\u30c8<\/p><p style=\"text-align: left;\">\u30fb\u306a\u3057<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7cae939 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"7cae939\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7cd8faf elementor-widget elementor-widget-spacer\" data-id=\"7cd8faf\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-452c6d7 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"452c6d7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a4e418f elementor-widget elementor-widget-html\" data-id=\"a4e418f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"slide-box\">\r\n  <div class=\"slide-label\">\u672c\u65e5\u306e\u958b\u9928\u6642\u9593<\/div>\r\n  <div class=\"slide-content\" id=\"today-hours\">\r\n    \u8aad\u307f\u8fbc\u307f\u4e2d...\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\n\/* Kiwi Maru\u306e\u8aad\u307f\u8fbc\u307f *\/\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Kiwi+Maru:wght@400;500&display=swap');\r\n\r\n\/* --- \u57fa\u672c\u8a2d\u5b9a\uff08PC\u30fb\u5171\u901a\uff09 --- *\/\r\n.slide-box {\r\n  --terracotta-color: #c85a3c;\r\n  position: fixed;\r\n  top: 150px; \/* PC\u3067\u306e\u4f4d\u7f6e *\/\r\n  right: -170px; \r\n  width: 225px; \r\n  background-color: #ffffff;\r\n  border: 2px solid var(--terracotta-color);\r\n  border-radius: 15px 0 0 15px; \r\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\r\n  z-index: 99999;\r\n  transition: right 0.4s cubic-bezier(0.25, 1, 0.5, 1);\r\n  font-family: \"Kiwi Maru\", serif;\r\n  font-weight: 500; \r\n  overflow: hidden; \r\n  display: flex;\r\n}\r\n\r\n\/* \u30bf\u30d6\u30ec\u30c3\u30c8\u7528\u306e\u4f4d\u7f6e\u8abf\u6574\uff081024px\u4ee5\u4e0b\uff09 *\/\r\n@media (max-width: 1024px) {\r\n  .slide-box {\r\n    top: 250px; \r\n  }\r\n}\r\n\r\n\/* \u30b9\u30de\u30db\u7528\u306e\u4f4d\u7f6e\u8abf\u6574\uff08767px\u4ee5\u4e0b\uff09 *\/\r\n@media (max-width: 767px) {\r\n  .slide-box {\r\n    top: 250px; \r\n    width: 210px; \r\n    right: -155px; \r\n  }\r\n  .slide-label {\r\n    font-size: 18px; \r\n    padding: 10px 8px;\r\n  }\r\n  .slide-content {\r\n    font-size: 16px; \r\n  }\r\n}\r\n\r\n.slide-box.is-active { right: 0; }\r\n\r\n.slide-label {\r\n  background-color: var(--terracotta-color);\r\n  color: #fff;\r\n  padding: 15px 10px;\r\n  cursor: pointer;\r\n  text-align: center;\r\n  writing-mode: vertical-rl;\r\n  flex-shrink: 0;\r\n  font-size: 20px;\r\n  letter-spacing: 2px;\r\n}\r\n\r\n.slide-content {\r\n  padding: 20px 10px;\r\n  color: #333;\r\n  font-size: 18px;\r\n  text-align: center;\r\n  flex-grow: 1;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  line-height: 1.4;\r\n  background: #fff;\r\n}\r\n\r\n\/* \u30ab\u30c3\u30b3\u5185\u306e\u88dc\u8db3\u30c6\u30ad\u30b9\u30c8\u7528 *\/\r\n.small-text {\r\n  font-size: 13px;\r\n  margin-top: 5px;\r\n  color: #666;\r\n  font-weight: 500;\r\n  display: block; \r\n  width: 100%;\r\n  white-space: nowrap; \r\n}\r\n<\/style>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n  const slideBox = document.querySelector('.slide-box');\r\n  const hoursDisplay = document.getElementById('today-hours');\r\n  \/\/ \u30b9\u30d7\u30ec\u30c3\u30c9\u30b7\u30fc\u30c8\u306eCSV URL\r\n  const csvUrl = 'https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vRUdjwDqUGWGVI6yWkrbOZCK-ac5Or8YR_pvKk31lecJEslZ8tvXbH2nrA1IJ_7n3gqClkOb1s-1skC\/pub?gid=0&single=true&output=csv';\r\n\r\n  slideBox.addEventListener('mouseenter', () => slideBox.classList.add('is-active'));\r\n  slideBox.addEventListener('mouseleave', () => slideBox.classList.remove('is-active'));\r\n\r\n  async function updateTodayHours() {\r\n    try {\r\n      const response = await fetch(csvUrl);\r\n      const csvText = await response.text();\r\n      \/\/ \u7a7a\u884c\u3092\u9664\u5916\u3057\u3066\u53d6\u5f97\r\n      const rows = csvText.split(\/\\r?\\n\/).filter(row => row.trim() !== \"\").slice(1);\r\n      \r\n      \/\/ \u65e5\u672c\u6642\u9593\u306e\u4eca\u65e5\u3092\u53d6\u5f97\r\n      const now = new Date();\r\n      const todayStr = now.getFullYear() + '-' + String(now.getMonth() + 1).padStart(2, '0') + '-' + String(now.getDate()).padStart(2, '0');\r\n\r\n      \/\/ \u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u8868\u793a\uff08\u30c7\u30fc\u30bf\u304c\u898b\u3064\u304b\u3089\u306a\u3044\u5834\u5408\uff09\r\n      let hoursHtml = \"10:00\u301c17:00<br><span class='small-text'>\uff08\u6700\u7d42\u5165\u992816:30\uff09<\/span>\"; \r\n\r\n      for (const row of rows) {\r\n        const cols = row.split(',');\r\n        if (cols.length < 1) continue;\r\n        \r\n        \/\/ A\u5217\u306e\u65e5\u4ed8\u3092\u5224\u5b9a\r\n        const dateRaw = new Date(cols[0].trim());\r\n        if (isNaN(dateRaw.getTime())) continue;\r\n        const rowDateStr = dateRaw.getFullYear() + '-' + String(dateRaw.getMonth() + 1).padStart(2, '0') + '-' + String(dateRaw.getDate()).padStart(2, '0');\r\n\r\n        if (rowDateStr === todayStr) {\r\n          \/\/ D\u5217\uff08\u30a4\u30f3\u30c7\u30c3\u30af\u30b93\uff09\u306b\u30c7\u30fc\u30bf\u304c\u3042\u308b\u304b\r\n          if (cols[3] && cols[3].trim() !== \"\") {\r\n            \/\/ \u30bb\u30eb\u5185\u306e\u6539\u884c\u30b3\u30fc\u30c9\u3092\u524a\u9664\r\n            let val = cols[3].trim().replace(\/\\r?\\n\/g, \"\"); \r\n            \r\n            if (val === \"\u4f11\u9928\" || val === \"\u4f11\u9928\u65e5\") {\r\n              hoursHtml = \"<span style='color:#e67e22;'>\u672c\u65e5\u306f<br>\u4f11\u9928\u65e5\u3067\u3059<\/span>\";\r\n            } else {\r\n              \/\/ \u30ab\u30c3\u30b3\u3067\u5206\u5272\u3057\u30662\u884c\u306b\u3059\u308b\u51e6\u7406\uff08\u534a\u89d2\u30fb\u5168\u89d2\u5bfe\u5fdc\uff09\r\n              const splitChar = val.includes('(') ? '(' : (val.includes('\uff08') ? '\uff08' : null);\r\n              \r\n              if (splitChar) {\r\n                const parts = val.split(splitChar);\r\n                const mainTime = parts[0].trim();\r\n                const subText = parts[1].replace(')', '').replace('\uff09', '').trim(); \r\n                hoursHtml = `${mainTime}<br><span class='small-text'>\uff08${subText}\uff09<\/span>`;\r\n              } else {\r\n                hoursHtml = val;\r\n              }\r\n            }\r\n          }\r\n          break;\r\n        }\r\n      }\r\n      hoursDisplay.innerHTML = hoursHtml;\r\n    } catch (e) {\r\n      console.error(\"Fetch Error:\", e);\r\n      \/\/ \u30a8\u30e9\u30fc\u6642\u3082\u30c7\u30d5\u30a9\u30eb\u30c8\u3092\u8868\u793a\r\n      hoursDisplay.innerHTML = \"10:00\u301c17:00<br><span class='small-text'>\uff08\u6700\u7d42\u5165\u992816:30\uff09<\/span>\";\r\n    }\r\n  }\r\n  updateTodayHours();\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>&lt; \u524d\u306e\u6708 \u6b21\u306e\u6708 &gt; &times; \u958b\u50ac\u4e2d\u306e\u30a4\u30d9\u30f3\u30c8 \u30fb\u306a\u3057 \u672c\u65e5\u306e\u958b\u9928\u6642\u9593 \u8aad\u307f\u8fbc\u307f\u4e2d&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-47","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-json\/wp\/v2\/pages\/47","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-json\/wp\/v2\/comments?post=47"}],"version-history":[{"count":80,"href":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-json\/wp\/v2\/pages\/47\/revisions"}],"predecessor-version":[{"id":2101,"href":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-json\/wp\/v2\/pages\/47\/revisions\/2101"}],"wp:attachment":[{"href":"https:\/\/www.teshiotown.hokkaido.jp\/teshioriver-museum\/wp-json\/wp\/v2\/media?parent=47"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}