{"id":53,"date":"2026-04-15T14:25:39","date_gmt":"2026-04-15T05:25:39","guid":{"rendered":"http:\/\/sonobehp.fun\/?page_id=53"},"modified":"2026-04-15T16:18:45","modified_gmt":"2026-04-15T07:18:45","slug":"%e3%81%8a%e7%9f%a5%e3%82%89%e3%81%9b","status":"publish","type":"page","link":"http:\/\/sonobehp.fun\/?page_id=53","title":{"rendered":"\u304a\u77e5\u3089\u305b"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"53\" class=\"elementor elementor-53\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fde037f e-flex e-con-boxed e-con e-parent\" data-id=\"fde037f\" 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-ad6e317 elementor-widget elementor-widget-html\" data-id=\"ad6e317\" 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=Noto+Serif+JP:wght@200;300;400&family=Noto+Sans+JP:wght@300;400;500&family=EB+Garamond:ital,wght@0,400;1,300;1,400&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n\/* === WordPress\u4f59\u5206\u306a\u8981\u7d20\u3092\u975e\u8868\u793a === *\/\r\n.page-title, .entry-title, h1.page-title,\r\n.elementor-page-title, .wp-block-post-title,\r\n.site-title, .wp-site-title { display: none !important; }\r\n.elementor-widget-container { padding: 0 !important; margin: 0 !important; }\r\n\r\n\/* === \u5168\u5e45\u8868\u793a \u5f37\u5236 === *\/\r\n.elementor-widget-wrap,\r\n.elementor-widget-container,\r\n.elementor-section-wrap,\r\n.elementor-container,\r\n.e-con, .e-con-inner,\r\n.entry-content, .post-content,\r\n#content, #main, #page,\r\n.site-content, .content-area {\r\n  max-width: 100% !important;\r\n  width: 100% !important;\r\n  padding: 0 !important;\r\n  margin: 0 !important;\r\n}\r\nbody { overflow-x: hidden; }\r\n\r\n\/* === \u30ea\u30bb\u30c3\u30c8 & \u57fa\u672c === *\/\r\n*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }\r\nhtml { font-size: 16px; scroll-behavior: smooth; }\r\n\r\n:root {\r\n  --white: #ffffff;\r\n  --off-white: #f9f7f4;\r\n  --warm-gray: #f0ede8;\r\n  --border: #e0dbd4;\r\n  --text-dark: #1c1c1c;\r\n  --text-mid: #555;\r\n  --text-light: #999;\r\n  --accent: #5a7a62;\r\n  --accent-light: #e8f0ea;\r\n  --nav-height: 72px;\r\n}\r\n\r\nbody {\r\n  font-family: 'Noto Sans JP', sans-serif;\r\n  color: var(--text-dark);\r\n  background: var(--white);\r\n  -webkit-font-smoothing: antialiased;\r\n}\r\na { text-decoration: none; color: inherit; }\r\n\r\n\/* === \u30d8\u30c3\u30c0\u30fc === *\/\r\nheader {\r\n  position: fixed;\r\n  top: 0; left: 0; right: 0;\r\n  z-index: 200;\r\n  height: var(--nav-height);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 0 40px;\r\n  background: rgba(255,255,255,0.96);\r\n  backdrop-filter: blur(8px);\r\n  border-bottom: 1px solid var(--border);\r\n}\r\n.logo { display: flex; align-items: center; gap: 14px; cursor: pointer; }\r\n.logo-mark { height: 40px; width: 40px; max-width: 40px; max-height: 40px; flex-shrink: 0; object-fit: contain; }\r\n.logo-text { line-height: 1.3; }\r\n.logo-ja { font-family: 'Noto Serif JP', serif; font-size: 17px; font-weight: 300; letter-spacing: 0.08em; color: var(--text-dark); }\r\n.logo-en { font-size: 9px; letter-spacing: 0.22em; color: var(--text-light); text-transform: uppercase; }\r\nnav ul { list-style: none; display: flex; align-items: center; gap: 0; }\r\nnav ul li > a { display: block; padding: 0 14px; font-size: 12px; font-weight: 400; letter-spacing: 0.05em; color: var(--text-dark); line-height: var(--nav-height); transition: color 0.25s; }\r\nnav ul li > a:hover { color: var(--accent); }\r\n.nav-reserve { margin-left: 12px; background: var(--accent); color: var(--white) !important; padding: 0 20px !important; height: 40px !important; line-height: 40px !important; font-size: 12px !important; letter-spacing: 0.1em !important; transition: background 0.3s !important; }\r\n.nav-reserve:hover { background: #4a6852 !important; }\r\n\r\n\/* === \u30da\u30fc\u30b8\u30d2\u30fc\u30ed\u30fc === *\/\r\n.page-hero {\r\n  margin-top: var(--nav-height);\r\n  padding: 80px 80px 60px;\r\n  border-bottom: 1px solid var(--border);\r\n  background: var(--off-white);\r\n  display: flex;\r\n  align-items: flex-end;\r\n  justify-content: space-between;\r\n}\r\n.page-hero-en { font-family: 'EB Garamond', serif; font-style: italic; font-size: 13px; letter-spacing: 0.2em; color: var(--text-light); margin-bottom: 16px; }\r\n.page-hero-ja { font-family: 'Noto Serif JP', serif; font-size: clamp(28px, 3vw, 40px); font-weight: 200; letter-spacing: 0.06em; color: var(--text-dark); line-height: 1.4; }\r\n.breadcrumb { font-size: 11px; letter-spacing: 0.1em; color: var(--text-light); display: flex; align-items: center; gap: 8px; }\r\n.breadcrumb a { color: var(--text-light); transition: color 0.2s; }\r\n.breadcrumb a:hover { color: var(--accent); }\r\n\r\n\/* === \u30d5\u30a3\u30eb\u30bf\u30fc\u30bf\u30d6 === *\/\r\n.filter-bar {\r\n  padding: 0 80px;\r\n  border-bottom: 1px solid var(--border);\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0;\r\n  overflow-x: auto;\r\n}\r\n.filter-btn { padding: 20px 24px; font-size: 12px; letter-spacing: 0.12em; color: var(--text-light); background: none; border: none; border-bottom: 2px solid transparent; cursor: pointer; white-space: nowrap; transition: color 0.25s, border-color 0.25s; font-family: inherit; }\r\n.filter-btn:hover { color: var(--accent); }\r\n.filter-btn.active { color: var(--accent); border-bottom-color: var(--accent); }\r\n\r\n\/* === \u30cb\u30e5\u30fc\u30b9\u30ea\u30b9\u30c8 === *\/\r\n.news-container { max-width: 900px; margin: 0 auto; padding: 64px 40px 100px; }\r\n\r\n.news-list { list-style: none; margin-top: 40px; }\r\n.news-item {\r\n  display: grid;\r\n  grid-template-columns: 110px 90px 1fr 24px;\r\n  align-items: center;\r\n  gap: 0 28px;\r\n  padding: 22px 0;\r\n  border-bottom: 1px solid var(--border);\r\n  cursor: pointer;\r\n  transition: background 0.2s, padding-left 0.2s;\r\n  text-decoration: none;\r\n  color: inherit;\r\n}\r\n.news-item:first-child { border-top: 1px solid var(--border); }\r\n.news-item:hover { background: var(--off-white); padding-left: 12px; }\r\n.news-date { font-family: 'EB Garamond', serif; font-size: 14px; letter-spacing: 0.06em; color: var(--text-light); }\r\n.news-cat { display: inline-block; padding: 3px 10px; font-size: 10px; letter-spacing: 0.12em; border: 1px solid var(--accent); color: var(--accent); white-space: nowrap; }\r\n.news-cat.urgent { border-color: #b05a3a; color: #b05a3a; }\r\n.news-cat.recruit { border-color: #6b7faa; color: #6b7faa; }\r\n.news-cat.facility { border-color: #8a7a62; color: #8a7a62; }\r\n.news-title-text { font-family: 'Noto Serif JP', serif; font-size: 14px; font-weight: 300; line-height: 1.7; color: var(--text-dark); }\r\n.news-arrow { font-size: 16px; color: var(--border); transition: color 0.2s, transform 0.2s; }\r\n.news-item:hover .news-arrow { color: var(--accent); transform: translateX(4px); }\r\n\r\n\/* === \u30ed\u30fc\u30c7\u30a3\u30f3\u30b0 === *\/\r\n.loading {\r\n  text-align: center;\r\n  padding: 60px 0;\r\n  color: var(--text-light);\r\n  font-size: 13px;\r\n  letter-spacing: 0.1em;\r\n}\r\n.loading::after {\r\n  content: '';\r\n  display: block;\r\n  width: 32px;\r\n  height: 32px;\r\n  border: 2px solid var(--border);\r\n  border-top-color: var(--accent);\r\n  border-radius: 50%;\r\n  margin: 16px auto 0;\r\n  animation: spin 0.8s linear infinite;\r\n}\r\n@keyframes spin { to { transform: rotate(360deg); } }\r\n\r\n.no-posts { text-align: center; padding: 60px 0; color: var(--text-light); font-size: 13px; letter-spacing: 0.1em; }\r\n\r\n\/* === \u30da\u30fc\u30b8\u30cd\u30fc\u30b7\u30e7\u30f3 === *\/\r\n.pagination { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 60px; }\r\n.page-btn { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 13px; font-family: 'EB Garamond', serif; letter-spacing: 0.05em; color: var(--text-mid); border: 1px solid var(--border); cursor: pointer; transition: all 0.2s; background: var(--white); }\r\n.page-btn:hover, .page-btn.active { background: var(--accent); color: var(--white); border-color: var(--accent); }\r\n.page-btn.arrow { font-size: 16px; color: var(--text-light); border: none; }\r\n.page-btn.arrow:hover { color: var(--accent); background: none; }\r\n.page-btn:disabled { opacity: 0.3; cursor: default; }\r\n.page-btn:disabled:hover { background: var(--white); color: var(--text-mid); border-color: var(--border); }\r\n\r\n\/* === \u30d5\u30c3\u30bf\u30fc === *\/\r\nfooter { background: var(--text-dark); padding: 56px 80px 36px; }\r\n.footer-top { display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 48px; padding-bottom: 48px; border-bottom: 1px solid rgba(255,255,255,0.1); }\r\n.footer-logo-ja { font-family: 'Noto Serif JP', serif; font-size: 18px; font-weight: 300; color: var(--white); margin-bottom: 6px; letter-spacing: 0.08em; }\r\n.footer-logo-en { font-size: 9px; letter-spacing: 0.25em; color: rgba(255,255,255,0.3); text-transform: uppercase; }\r\n.footer-address { font-size: 12px; line-height: 2; color: rgba(255,255,255,0.4); margin-top: 20px; }\r\n.footer-col-title { font-size: 10px; letter-spacing: 0.22em; color: rgba(255,255,255,0.35); text-transform: uppercase; margin-bottom: 20px; }\r\n.footer-col ul { list-style: none; }\r\n.footer-col ul li { margin-bottom: 12px; }\r\n.footer-col ul a { font-size: 12px; color: rgba(255,255,255,0.5); letter-spacing: 0.04em; transition: color 0.2s; }\r\n.footer-col ul a:hover { color: var(--white); }\r\n.footer-bottom { padding-top: 28px; display: flex; justify-content: space-between; align-items: center; }\r\n.footer-copy { font-size: 10px; letter-spacing: 0.12em; color: rgba(255,255,255,0.25); }\r\n\r\n\/* === \u30ec\u30b9\u30dd\u30f3\u30b7\u30d6 === *\/\r\n@media (max-width: 768px) {\r\n  .page-hero { padding: 60px 24px 40px; flex-direction: column; gap: 20px; }\r\n  .filter-bar { padding: 0 24px; }\r\n  .news-container { padding: 40px 24px 60px; }\r\n  .news-item { grid-template-columns: 85px 65px 1fr 20px; gap: 0 10px; }\r\n  .footer-top { grid-template-columns: 1fr; gap: 32px; }\r\n  footer { padding: 40px 24px 24px; }\r\n  header { padding: 0 20px; }\r\n  nav { display: none; }\r\n}\r\n<\/style>\r\n\r\n\r\n\r\n<!-- \u2500\u2500\u2500 PAGE HERO \u2500\u2500\u2500 -->\r\n<div class=\"page-hero\">\r\n  <div class=\"page-hero-left\">\r\n    <div class=\"page-hero-en\">News \u00b7 Information<\/div>\r\n    <div class=\"page-hero-ja\">\u304a\u77e5\u3089\u305b<\/div>\r\n  <\/div>\r\n  <div class=\"breadcrumb\">\r\n    <a href=\"http:\/\/sonobehp.fun\/?page_id=12\">\u30db\u30fc\u30e0<\/a>\r\n    <span>\u203a<\/span>\r\n    <span>\u304a\u77e5\u3089\u305b<\/span>\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- \u2500\u2500\u2500 FILTER BAR \u2500\u2500\u2500 -->\r\n<div class=\"filter-bar\">\r\n  <button class=\"filter-btn active\" onclick=\"filterPosts('all', this)\">\u3059\u3079\u3066<\/button>\r\n  <button class=\"filter-btn\" onclick=\"filterPosts('\u91cd\u8981', this)\">\u91cd\u8981<\/button>\r\n  <button class=\"filter-btn\" onclick=\"filterPosts('\u304a\u77e5\u3089\u305b', this)\">\u304a\u77e5\u3089\u305b<\/button>\r\n  <button class=\"filter-btn\" onclick=\"filterPosts('\u8a2d\u5099', this)\">\u8a2d\u5099\u30fb\u74b0\u5883<\/button>\r\n  <button class=\"filter-btn\" onclick=\"filterPosts('\u63a1\u7528', this)\">\u63a1\u7528\u60c5\u5831<\/button>\r\n<\/div>\r\n\r\n<!-- \u2500\u2500\u2500 NEWS LIST \u2500\u2500\u2500 -->\r\n<div class=\"news-container\">\r\n  <div id=\"news-loading\" class=\"loading\">\u8aad\u307f\u8fbc\u307f\u4e2d<\/div>\r\n  <ul class=\"news-list\" id=\"news-list\"><\/ul>\r\n  <div class=\"pagination\" id=\"pagination\"><\/div>\r\n<\/div>\r\n\r\n\r\n\r\n<script>\r\nconst SITE_URL = 'http:\/\/sonobehp.fun';\r\n\/\/ WAF\u5bfe\u7b56\uff1a\u5225\u5f62\u5f0f\u306eREST API\u30a8\u30f3\u30c9\u30dd\u30a4\u30f3\u30c8\u3092\u4f7f\u7528\r\nconst API_BASE = SITE_URL + '\/?rest_route=\/wp\/v2';\r\nconst PER_PAGE = 10;\r\nlet currentPage = 1;\r\nlet currentFilter = 'all';\r\nlet totalPages = 1;\r\n\r\n\/\/ \u30ab\u30c6\u30b4\u30ea\u306b\u5fdc\u3058\u305f\u30b9\u30bf\u30a4\u30eb\r\nfunction getCatStyle(catName) {\r\n  if (!catName) return '';\r\n  if (catName.includes('\u91cd\u8981')) return 'urgent';\r\n  if (catName.includes('\u63a1\u7528')) return 'recruit';\r\n  if (catName.includes('\u8a2d\u5099')) return 'facility';\r\n  return '';\r\n}\r\n\r\n\/\/ \u65e5\u4ed8\u30d5\u30a9\u30fc\u30de\u30c3\u30c8\r\nfunction formatDate(dateStr) {\r\n  const d = new Date(dateStr);\r\n  const y = d.getFullYear();\r\n  const m = String(d.getMonth() + 1).padStart(2, '0');\r\n  const day = String(d.getDate()).padStart(2, '0');\r\n  return `${y}.${m}.${day}`;\r\n}\r\n\r\n\/\/ \u6295\u7a3f\u3092\u53d6\u5f97\u3057\u3066\u8868\u793a\r\nasync function fetchPosts(page, filter) {\r\n  const loading = document.getElementById('news-loading');\r\n  const list = document.getElementById('news-list');\r\n  const pagination = document.getElementById('pagination');\r\n\r\n  loading.style.display = 'block';\r\n  list.innerHTML = '';\r\n  pagination.innerHTML = '';\r\n\r\n  try {\r\n    \/\/ \u30ab\u30c6\u30b4\u30ea\u30d5\u30a3\u30eb\u30bf\u30fc\u7528\u306b\u30ab\u30c6\u30b4\u30ea\u4e00\u89a7\u3092\u53d6\u5f97\r\n    let catParam = '';\r\n    if (filter !== 'all') {\r\n      const catRes = await fetch(`${API_BASE}\/categories&search=${encodeURIComponent(filter)}&per_page=5`);\r\n      const cats = await catRes.json();\r\n      if (cats.length > 0) {\r\n        catParam = `&categories=${cats[0].id}`;\r\n      }\r\n    }\r\n\r\n    \/\/ \u6295\u7a3f\u53d6\u5f97\r\n    const res = await fetch(\r\n      `${API_BASE}\/posts&per_page=${PER_PAGE}&page=${page}&_embed=1${catParam}`\r\n    );\r\n\r\n    totalPages = parseInt(res.headers.get('X-WP-TotalPages') || '1');\r\n    const posts = await res.json();\r\n\r\n    loading.style.display = 'none';\r\n\r\n    if (!posts.length) {\r\n      list.innerHTML = '<div class=\"no-posts\">\u6295\u7a3f\u306f\u3042\u308a\u307e\u305b\u3093<\/div>';\r\n      return;\r\n    }\r\n\r\n    posts.forEach(post => {\r\n      \/\/ \u30ab\u30c6\u30b4\u30ea\u540d\u53d6\u5f97\r\n      const cats = post._embedded?.['wp:term']?.[0] || [];\r\n      const catName = cats.length ? cats[0].name : '\u304a\u77e5\u3089\u305b';\r\n      const catStyle = getCatStyle(catName);\r\n      const date = formatDate(post.date);\r\n      const title = post.title.rendered.replace(\/<[^>]+>\/g, '');\r\n      const url = post.link;\r\n\r\n      const li = document.createElement('li');\r\n      li.innerHTML = `\r\n        <a class=\"news-item\" href=\"${url}\">\r\n          <div class=\"news-date\">${date}<\/div>\r\n          <span class=\"news-cat ${catStyle}\">${catName}<\/span>\r\n          <div class=\"news-title-text\">${title}<\/div>\r\n          <div class=\"news-arrow\">\u2192<\/div>\r\n        <\/a>`;\r\n      list.appendChild(li);\r\n    });\r\n\r\n    \/\/ \u30da\u30fc\u30b8\u30cd\u30fc\u30b7\u30e7\u30f3\r\n    renderPagination(page, totalPages);\r\n\r\n  } catch (e) {\r\n    loading.style.display = 'none';\r\n    list.innerHTML = '<div class=\"no-posts\">\u6295\u7a3f\u306e\u8aad\u307f\u8fbc\u307f\u306b\u5931\u6557\u3057\u307e\u3057\u305f<\/div>';\r\n    console.error(e);\r\n  }\r\n}\r\n\r\n\/\/ \u30da\u30fc\u30b8\u30cd\u30fc\u30b7\u30e7\u30f3\u63cf\u753b\r\nfunction renderPagination(current, total) {\r\n  const pagination = document.getElementById('pagination');\r\n  if (total <= 1) return;\r\n\r\n  let html = `<button class=\"page-btn arrow\" onclick=\"changePage(${current - 1})\" ${current === 1 ? 'disabled' : ''}>\u2190<\/button>`;\r\n  for (let i = 1; i <= total; i++) {\r\n    html += `<button class=\"page-btn ${i === current ? 'active' : ''}\" onclick=\"changePage(${i})\">${i}<\/button>`;\r\n  }\r\n  html += `<button class=\"page-btn arrow\" onclick=\"changePage(${current + 1})\" ${current === total ? 'disabled' : ''}>\u2192<\/button>`;\r\n  pagination.innerHTML = html;\r\n}\r\n\r\nfunction changePage(page) {\r\n  if (page < 1 || page > totalPages) return;\r\n  currentPage = page;\r\n  fetchPosts(currentPage, currentFilter);\r\n  window.scrollTo({ top: 0, behavior: 'smooth' });\r\n}\r\n\r\nfunction filterPosts(filter, btn) {\r\n  document.querySelectorAll('.filter-btn').forEach(b => b.classList.remove('active'));\r\n  btn.classList.add('active');\r\n  currentFilter = filter;\r\n  currentPage = 1;\r\n  fetchPosts(currentPage, currentFilter);\r\n}\r\n\r\n\/\/ \u521d\u56de\u8aad\u307f\u8fbc\u307f\r\nfetchPosts(1, 'all');\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>News \u00b7 Information \u304a\u77e5\u3089\u305b \u30db\u30fc\u30e0 \u203a \u304a\u77e5\u3089\u305b \u3059\u3079\u3066 \u91cd\u8981 \u304a\u77e5\u3089\u305b \u8a2d\u5099\u30fb\u74b0\u5883 \u63a1\u7528\u60c5\u5831 \u8aad\u307f\u8fbc\u307f\u4e2d<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-53","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/sonobehp.fun\/index.php?rest_route=\/wp\/v2\/pages\/53","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/sonobehp.fun\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/sonobehp.fun\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/sonobehp.fun\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/sonobehp.fun\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=53"}],"version-history":[{"count":28,"href":"http:\/\/sonobehp.fun\/index.php?rest_route=\/wp\/v2\/pages\/53\/revisions"}],"predecessor-version":[{"id":122,"href":"http:\/\/sonobehp.fun\/index.php?rest_route=\/wp\/v2\/pages\/53\/revisions\/122"}],"wp:attachment":[{"href":"http:\/\/sonobehp.fun\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=53"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}