/* =============================
   Blog Modern Design
   添付DOMをもとにしたモダンなブログデザイン
================================ */

:root {
  --blog-bg: #f9fafb;
  --blog-card: #ffffff;
  --blog-ink: #111827;
  --blog-muted: #6b7280;
  --blog-brand: #CE2746;
  --blog-brand-dark: #b71f39;
  --blog-radius: 12px;
}

/* ページ全体の背景 - svセクションは除外 */
body.blog-page .subcts-bg,
body.post-type-archive-news {
  background: var(--blog-bg) !important;
}

/* svセクションとsubmenuセクションは背景を白に */
body.blog-page .sv,
body.blog-page .submenu {
  background: #ffffff !important;
}

/* ブログブロック全体 */
body.blog-page .ultp-block-wrapper,
body.post-type-archive-news .ultp-block-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

/* コンテナ */
body.blog-page .container,
body.blog-page #content,
body.post-type-archive-news .container,
body.post-type-archive-news #content {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

@media (max-width: 767px) {
  body.blog-page .container,
  body.blog-page #content,
  body.post-type-archive-news .container,
  body.post-type-archive-news #content {
    padding: 16px !important;
  }
}

/* ページヘッダー（パンくずとタイトル） - svセクションのpaddingをリセット */
body.blog-page .sv ,
body.post-type-archive-news .sv {
  padding: 0 !important;
}

body.blog-page .sv h1,
body.blog-page .sv .entry-title,
body.blog-page .subcts-inner > .entry-title,
body.blog-page .entry-title,
body.post-type-archive-news .entry-title {
  font-size: clamp(32px, 4vw, 48px) !important;
  margin: 0 0 24px !important;
  color: var(--blog-ink) !important;
  font-weight: 700 !important;
}

/* パンくず */
body.blog-page .breadcrumbs ,
body.post-type-archive-news .breadcrumbs {
  color: var(--blog-muted) !important;
  font-size: 14px !important;
  margin-bottom: 8px !important;
}

body.blog-page .breadcrumbs a ,
body.post-type-archive-news .breadcrumbs a {
  color: inherit !important;
  text-decoration: none !important;
}

body.blog-page .breadcrumbs a:hover ,
body.post-type-archive-news .breadcrumbs a:hover {
  color: var(--blog-brand) !important;
}

/* フィルターコントロール */
body.blog-page .wp-block-ultimate-post-advanced-filter ,
body.post-type-archive-news .wp-block-ultimate-post-advanced-filter {
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;
  background: #fff !important;
  padding: 16px !important;
  border-radius: var(--blog-radius) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05) !important;
  margin-bottom: 18px !important;
}

body.blog-page .ultp-filter-navigation,
body.blog-page .ultp-block-wrapper > div:first-child ,
body.post-type-archive-news .ultp-block-wrapper > div:first-child {
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;
  background: #fff !important;
  padding: 16px !important;
  border-radius: var(--blog-radius) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05) !important;
  margin-bottom: 18px !important;
}

/* フィルターボタン（pills風） */
body.blog-page .ultp-filter-select__parent,
body.blog-page .ultp-filter-button ,
body.post-type-archive-news .ultp-filter-button {
  border: 1px solid #d1d5db !important;
  background: #fff !important;
  color: var(--blog-ink) !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: background .2s, color .2s, border-color .2s !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  box-shadow: none !important;
}

body.blog-page .ultp-filter-select__parent-inner,
body.blog-page .ultp-filter-button ,
body.post-type-archive-news .ultp-filter-button {
  color: var(--blog-ink) !important;
}

body.blog-page .ultp-filter-select__parent:hover,
body.blog-page .ultp-filter-button:hover,
body.blog-page .ultp-filter-button-active ,
body.post-type-archive-news .ultp-filter-button-active {
  background: var(--blog-brand-dark) !important;
  border-color: var(--blog-brand-dark) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}

body.blog-page .ultp-filter-select__parent:hover .ultp-filter-select__parent-inner,
body.blog-page .ultp-filter-button:hover,
body.blog-page .ultp-filter-button-active ,
body.post-type-archive-news .ultp-filter-button-active {
  color: #fff !important;
}

body.blog-page .ultp-filter-select__parent:hover .ultp-filter-select-field-icon svg,
body.blog-page .ultp-filter-button:hover svg ,
body.post-type-archive-news .ultp-filter-button:hover svg {
  fill: #fff !important;
}

body.blog-page .ultp-filter-select-field-icon svg ,
body.post-type-archive-news .ultp-filter-select-field-icon svg {
  fill: var(--blog-ink) !important;
}

/* グリッドレイアウト */
body.blog-page .ultp-block-row ,
body.post-type-archive-news .ultp-block-row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
  margin: 18px 0 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media (min-width: 600px) {
  body.blog-page .ultp-block-row ,
body.post-type-archive-news .ultp-block-row {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (min-width: 980px) {
  body.blog-page .ultp-block-row ,
body.post-type-archive-news .ultp-block-row {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* カード全体 */
body.blog-page .ultp-block-item ,
body.post-type-archive-news .ultp-block-item {
  position: relative !important;
  overflow: hidden !important;
  border-radius: calc(var(--blog-radius) + 4px) !important;
  border: 1px solid #e5e7eb !important;
  background: var(--blog-card) !important;
  transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s, border-color .2s !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.blog-page .ultp-block-item:hover ,
body.post-type-archive-news .ultp-block-item:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.07) !important;
  border-color: #d1d5db !important;
}

/* グラデーションボーダーを削除 */
body.blog-page .ultp-block-content-overlay ,
body.post-type-archive-news .ultp-block-content-overlay {
  background-image: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* サムネイル画像 */
body.blog-page .ultp-block-image ,
body.post-type-archive-news .ultp-block-image {
  aspect-ratio: 4/3 !important;
  width: 100% !important;
  background: #f1f5f9 !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  min-height: 280px !important;
  max-width: 100% !important;
}

body.blog-page .ultp-block-image img ,
body.post-type-archive-news .ultp-block-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  filter: none !important;
  border-radius: 0 !important;
  max-width: 100% !important;
}

@media (max-width: 767px) {
  body.blog-page .ultp-block-image ,
body.post-type-archive-news .ultp-block-image {
    min-height: 200px !important;
  }
}

body.blog-page .ultp-block-item:hover .ultp-block-image img ,
body.post-type-archive-news .ultp-block-item:hover .ultp-block-image img {
  filter: none !important;
}

/* カードのコンテンツエリア */
body.blog-page .ultp-block-content-inner ,
body.post-type-archive-news .ultp-block-content-inner {
  padding: 24px 24px 28px !important;
  display: grid !important;
  gap: 14px !important;
  flex: 1 !important;
  background: transparent !important;
  min-height: 200px !important;
}

/* メタボックス（カテゴリ+日付を囲む） */
body.blog-page .ultp-block-content-inner > div:first-child ,
body.post-type-archive-news .ultp-block-content-inner > div:first-child {
  display: flex !important;
  gap: 8px !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  margin-bottom: 4px !important;
}

/* カテゴリバッジ */
body.blog-page .ultp-category-grid ,
body.post-type-archive-news .ultp-category-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: center !important;
  margin: 0 !important;
}

body.blog-page .ultp-category-grid a ,
body.post-type-archive-news .ultp-category-grid a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  background: var(--blog-brand-dark) !important;
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  font-size: 12px !important;
  text-decoration: none !important;
  border: none !important;
}

body.blog-page .ultp-category-grid a:hover ,
body.post-type-archive-news .ultp-category-grid a:hover {
  background: var(--blog-brand) !important;
  color: #fff !important;
}

/* 日付表示（カテゴリと同じ行） */
body.blog-page .ultp-block-content-inner .ultp-block-meta ,
body.post-type-archive-news .ultp-block-content-inner .ultp-block-meta {
  display: inline-flex !important;
  gap: 4px !important;
  align-items: center !important;
  font-size: 12px !important;
  color: var(--blog-muted) !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
}

body.blog-page .ultp-block-content-inner .ultp-block-meta span ,
body.post-type-archive-news .ultp-block-content-inner .ultp-block-meta span {
  display: inline-flex !important;
  gap: 4px !important;
  align-items: center !important;
}

body.blog-page .ultp-block-content-inner .ultp-block-meta svg ,
body.post-type-archive-news .ultp-block-content-inner .ultp-block-meta svg {
  width: 14px !important;
  height: 14px !important;
  fill: var(--blog-muted) !important;
}

/* タイトル */
body.blog-page .ultp-block-title ,
body.post-type-archive-news .ultp-block-title {
  font-size: clamp(16px, 2.3vw, 20px) !important;
  margin: 0 !important;
  line-height: 1.4 !important;
  padding: 0 !important;
}

body.blog-page .ultp-block-title a ,
body.post-type-archive-news .ultp-block-title a {
  color: var(--blog-ink) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

body.blog-page .ultp-block-title a:hover ,
body.post-type-archive-news .ultp-block-title a:hover {
  color: var(--blog-brand) !important;
}

/* 抜粋 */
body.blog-page .ultp-block-excerpt ,
body.post-type-archive-news .ultp-block-excerpt {
  color: var(--blog-muted) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

/* フッター部分のメタ情報（著者情報など） */
body.blog-page .ultp-block-item > .ultp-block-meta,
body.blog-page .ultp-block-wrapper .ultp-block-item .ultp-block-meta:not(.ultp-block-content-inner .ultp-block-meta) ,
body.post-type-archive-news .ultp-block-wrapper .ultp-block-item .ultp-block-meta:not(.ultp-block-content-inner .ultp-block-meta) {
  display: flex !important;
  gap: 8px !important;
  align-items: center !important;
  font-size: 12px !important;
  color: var(--blog-muted) !important;
  border: none !important;
  padding: 16px 24px 24px !important;
  margin: 0 !important;
  margin-top: auto !important;
}

body.blog-page .ultp-block-item > .ultp-block-meta span,
body.blog-page .ultp-block-item > .ultp-block-meta span a ,
body.post-type-archive-news .ultp-block-item > .ultp-block-meta span a {
  color: var(--blog-muted) !important;
  font-size: 13px !important;
  text-decoration: none !important;
}

body.blog-page .ultp-block-item > .ultp-block-meta svg ,
body.post-type-archive-news .ultp-block-item > .ultp-block-meta svg {
  fill: var(--blog-muted) !important;
  width: 16px !important;
  height: 16px !important;
}

/* ページネーション */
body.blog-page .ultp-pagination-wrap ,
body.post-type-archive-news .ultp-pagination-wrap {
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  padding: 18px 0 8px !important;
  margin-top: 18px !important;
}

body.blog-page .ultp-pagination ,
body.post-type-archive-news .ultp-pagination {
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  align-items: center !important;
}

body.blog-page .ultp-pagination li ,
body.post-type-archive-news .ultp-pagination li {
  list-style: none !important;
  margin: 0 !important;
}

body.blog-page .ultp-pagination li a,
body.blog-page .ultp-pagination li span ,
body.post-type-archive-news .ultp-pagination li span {
  border: 1px solid #e5e7eb !important;
  background: #fff !important;
  color: var(--blog-ink) !important;
  padding: 8px 12px !important;
  border-radius: 10px !important;
  cursor: pointer !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 44px !important;
  height: 44px !important;
  transition: background .2s, color .2s, border-color .2s !important;
  box-shadow: none !important;
}

body.blog-page .ultp-pagination li a:hover ,
body.post-type-archive-news .ultp-pagination li a:hover {
  border-color: var(--blog-brand-dark) !important;
  color: var(--blog-brand-dark) !important;
  background: #fff !important;
  transform: none !important;
  box-shadow: none !important;
}

body.blog-page .ultp-pagination li.pagination-active a ,
body.post-type-archive-news .ultp-pagination li.pagination-active a {
  background: var(--blog-brand-dark) !important;
  color: #fff !important;
  border-color: var(--blog-brand-dark) !important;
  box-shadow: none !important;
}

body.blog-page .ultp-pagination svg ,
body.post-type-archive-news .ultp-pagination svg {
  fill: currentColor !important;
  width: 16px !important;
  height: 16px !important;
}

/* ドロップダウンメニュー */
body.blog-page .ultp-filter-select__dropdown ,
body.post-type-archive-news .ultp-filter-select__dropdown {
  border-radius: 12px !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  background-color: #ffffff !important;
  margin-top: 8px !important;
}

body.blog-page .ultp-filter-select__dropdown-inner ,
body.post-type-archive-news .ultp-filter-select__dropdown-inner {
  padding: 8px 16px !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
  color: var(--blog-ink) !important;
}

body.blog-page .ultp-filter-select__dropdown-inner:hover ,
body.post-type-archive-news .ultp-filter-select__dropdown-inner:hover {
  background: var(--blog-brand-dark) !important;
  color: #ffffff !important;
}

/* 検索ボックス */
body.blog-page .ultp-filter-select-search ,
body.post-type-archive-news .ultp-filter-select-search {
  border-radius: 8px !important;
  border: 1px solid #e5e7eb !important;
  padding: 8px 12px !important;
  transition: all 0.3s ease !important;
  background: #f8f9fa !important;
}

body.blog-page .ultp-filter-select-search:focus ,
body.post-type-archive-news .ultp-filter-select-search:focus {
  border-color: var(--blog-brand-dark) !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(183, 31, 57, 0.1) !important;
}

/* クリアボタン */
body.blog-page .ultp-clear-button ,
body.post-type-archive-news .ultp-clear-button {
  border: 1px solid #e5e7eb !important;
  background: #fff !important;
  color: var(--blog-ink) !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: background .2s, color .2s, border-color .2s !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  box-shadow: none !important;
}

body.blog-page .ultp-clear-button:hover ,
body.post-type-archive-news .ultp-clear-button:hover {
  background: var(--blog-brand-dark) !important;
  border-color: var(--blog-brand-dark) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}

/* 選択されたフィルタータグ */
body.blog-page .ultp-selected-filter ,
body.post-type-archive-news .ultp-selected-filter {
  border: 1px solid #d1d5db !important;
  background: #fff !important;
  color: var(--blog-ink) !important;
  padding: 6px 12px !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: background .2s, color .2s, border-color .2s !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  box-shadow: none !important;
}

body.blog-page .ultp-selected-filter:hover ,
body.post-type-archive-news .ultp-selected-filter:hover {
  background: var(--blog-brand-dark) !important;
  border-color: var(--blog-brand-dark) !important;
  color: #fff !important;
  box-shadow: none !important;
}

body.blog-page .ultp-selected-filter-text ,
body.post-type-archive-news .ultp-selected-filter-text {
  color: inherit !important;
  font-weight: 500 !important;
}

body.blog-page .ultp-selected-filter-icon svg ,
body.post-type-archive-news .ultp-selected-filter-icon svg {
  fill: currentColor !important;
}

/* レスポンシブ対応 */
@media (max-width: 767px) {
  body.blog-page .ultp-filter-select__parent,
  body.blog-page .ultp-filter-button ,
body.post-type-archive-news .ultp-filter-button {
    padding: 7px 10px !important;
    font-size: 13px !important;
  }

  body.blog-page .ultp-pagination li a,
  body.blog-page .ultp-pagination li span ,
body.post-type-archive-news .ultp-pagination li span {
    min-width: 40px !important;
    height: 40px !important;
    padding: 6px 10px !important;
  }
}