/*
	Theme Name: diver_child
	Template: diver
	Description:  Diverの子テーマです。
	Theme URI: http://tan-taka.com/diver/
	Author: Takato Takagi
 */

/* カスタマイズする場合にはこれより下に追記してください  */

/* タイトル下のナビを横並び＆中央寄せ */
.header-widget-area .widget_nav_menu ul,
.widget-area .widget_nav_menu ul,
.widget_nav_menu > div > ul,
.widget_nav_menu ul,
.widget_nav_menu ul.menu {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  list-style: none;
  margin: 8px 0 12px;
  padding: 0;
}
.widget_nav_menu li { margin: 0 !important; }
.widget_nav_menu a {
  display: block;
  padding: 8px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 9999px;
  text-decoration: none;
}
.widget_nav_menu a:hover { background: #eef8f0; border-color: #cde7d0; }

@supports not (display: flex) {
  .widget_nav_menu { text-align: center; }
  .widget_nav_menu ul { display: block; }
  .widget_nav_menu li { display: inline-block; margin: 0 8px 10px; }
}
/* --- タイトル下メニュー（ナビゲーションメニュー・ウィジェット）最終調整 --- */

/* UL を横並び＆中央寄せ（すべての出力パターンをカバー） */
.header-widget-area .widget_nav_menu ul,
.widget-area .widget_nav_menu ul,
.widget_nav_menu > div > ul,
.widget_nav_menu ul,
.widget_nav_menu ul.menu {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 14px;       /* 縦×横の間隔 */
  list-style: none;
  margin: 10px 0 16px;
  padding: 0;
}

/* LI とリンクの体裁 */
.widget_nav_menu li { margin: 0 !important; }
.widget_nav_menu a {
  display: block;
  padding: 8px 14px;
  border: 1px solid #e5e7eb;
  border-radius: 9999px;     /* pill型 */
  text-decoration: none;
  background: #fff;
  line-height: 1.0;
}

/* ホバー／現在地（current） */
.widget_nav_menu a:hover {
  background: #eef8f0;
  border-color: #cde7d0;
}
.widget_nav_menu .current-menu-item > a,
.widget_nav_menu .current_page_item > a {
  background: #e6f4ea;
  border-color: #9ad0a4;
  color: #215f2f;
}

/* スマホ微調整 */
@media (max-width: 480px){
  .widget_nav_menu a { padding: 10px 12px; }
  .widget_nav_menu ul { gap: 10px; }
}

/* ==== ブログ一覧デザイン（2025-11用追加） ==== */
.post-list { display:grid; gap:20px; }
.post-card { display:grid; grid-template-columns: 200px 1fr; gap:16px; align-items:start; border:1px solid #eee; border-radius:12px; padding:16px; }
.post-card__thumb img { width:100%; height:auto; border-radius:10px; }
.post-card__title { font-size:1.1rem; margin:0 0 .3rem; }
.post-card__meta { font-size:.85rem; opacity:.75; margin-bottom:.5rem; display:flex; gap:.6rem; flex-wrap:wrap; }
.post-card__more { display:inline-block; margin-top:.4rem; border:1px solid #66966a; padding:.35rem .7rem; border-radius:999px; }
@media (max-width: 768px){
  .post-card { grid-template-columns: 1fr; }
}

/* ==== プロフィールページ用 ==== */
.profile-avatar { width:140px; aspect-ratio:1/1; border-radius:50%; object-fit:cover; display:block; margin:0 auto 12px; }
.timeline { border-left:3px solid #e6efe7; padding-left:16px; }
.timeline li { margin:0 0 .6rem; }

/* ==== お問い合わせフォーム用 ==== */
.wpcf7-form p { margin-bottom: .8rem; }
.wpcf7 input, .wpcf7 textarea {
  width:100%; border:1px solid #ddd; border-radius:10px; padding:.6rem .8rem;
}
.wpcf7 input[type=submit]{
  width:auto; border:1px solid #66966a; border-radius:999px; padding:.5rem 1.1rem; cursor:pointer;
}

/* ==== トップページ微調整 ==== */
.site-header + .mv,
.global-nav + .mv { margin-top: 12px; }
.intro { max-width: 760px; margin: 0 auto 20px; line-height: 1.9; font-size: clamp(16px, 2.2vw, 18px); }
.category-cards { display:grid; grid-template-columns: repeat(2,1fr); gap:16px; }
@media (max-width: 768px){
  .category-cards { grid-template-columns: 1fr; }
}

/* ===== ブログ一覧 読みやすさ調整 ===== */

/* 一覧カード全体の余白と境界線 */
.archive .post,
.blog .post {
  padding: 18px 16px;
  border-bottom: 1px solid #f0e0cf;
}

/* タイトルを少し大きく＆行間 */
.archive .post .post-title,
.blog .post .post-title {
  font-size: 1.05rem;
  line-height: 1.6;
  margin-bottom: 4px;
}

/* 日付・カテゴリの視認性UP */
.archive .post .post-meta,
.blog .post .post-meta {
  font-size: 0.8rem;
  opacity: 0.8;
}

/* 抜粋の行間を少し広く */
.archive .post .post-excerpt,
.blog .post .post-excerpt {
  line-height: 1.8;
  font-size: 0.9rem;
}

/* NO IMAGEエリアを少し小さくして圧迫感減らす */
.archive .post .post-thumb,
.blog .post .post-thumb {
  max-width: 120px;
}

/* スマホ時：縦並びで詰まりすぎないよう調整 */
@media (max-width: 768px) {
  .archive .post,
  .blog .post {
    padding: 14px 10px;
  }
}

/* ==== TOP カテゴリ誘導 ==== */
.top-cat-wrap {
  max-width: 900px;
  margin: 10px auto 26px;
  padding: 0 16px;
}

/* 大きい2つの入口 */
.top-cat-main-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 12px;
}
.top-cat-main {
  flex: 1 1 260px;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  background: #fff;
  text-decoration: none;
  color: #333;
  font-size: 0.9rem;
}
.top-cat-main strong {
  display: block;
  margin-bottom: 3px;
  font-size: 0.95rem;
}

/* 体験記＆再生ノートの細分カード */
.top-cat-title {
  font-size: 0.9rem;
  font-weight: 600;
  margin: 6px 0 4px;
}
.top-cat-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.top-cat-card {
  flex: 1 1 160px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
  background: #fff;
  text-decoration: none;
  color: #555;
  font-size: 0.8rem;
}
.top-cat-card .label {
  font-weight: 600;
  margin-bottom: 2px;
}
@media (max-width: 768px){
  .top-cat-wrap {
    padding: 0 12px 18px;
  }
}