/* =========================================
   1. 共通・ヘッダー
========================================= */

.site-name{
  font-size:22px;
  font-weight:700;
  letter-spacing:1px;
}

#header-container{
  position:sticky;
  top:0;
  z-index:9999;
}

/* 固定ページの日付非表示 */
.page .post-date{
  display:none !important;
}

/* ヘッダーメニュー（町会加入ボタン） */
#header-container .navi-in > ul li:last-child a{
  background:#2e7d32;
  color:#fff !important;
  padding:8px 14px;
  border-radius:8px;
  font-weight:700;
  box-shadow:0 2px 6px rgba(0,0,0,0.15);
  transition:all .2s;
}

#header-container .navi-in > ul li:last-child a:hover{
  background:#1b5e20;
}


/* =========================================
   2. トップページ
========================================= */

.home{
  background-color:#f8f9fb;
}

.home .entry-title{
  display:none;
}

.home #navi{
  display:none;
}

.home .wp-block-cover{
  max-width:100%;
  margin-left:0;
  margin-right:0;
}

.home .wp-block-cover .wp-block-cover__image-background{
  object-fit:cover;
  object-position:60% center;
}

.home .wp-block-cover .wp-block-cover__inner-container{
  text-align:center;
}

.home .wp-block-cover p{
  color:#fff;
}

.home .content-in{
  padding-top:0;
  max-width:1100px;
}


/* =========================================
   3. トップ導線ボタン
========================================= */

.z1-navgrid{
  display:grid;
  gap:16px;
  margin:18px 0;
  grid-template-columns:repeat(6,1fr);
}

.z1-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  border-radius:18px;
  padding:18px 10px;
  min-height:86px;
  font-weight:700;
  box-shadow:0 6px 0 rgba(0,0,0,.18);
}

.z1-main{
  font-size:22px;
  word-break:keep-all;
}

.z1-sub{
  font-size:14px;
}

.z1-gray{ background:#f2f2f2; }
.z1-local{ background:#8fb785; color:#fff; }
.z1-disaster{ background:#f4d7a5; }
.z1-join{ background:#2e7d32; color:#fff; }


/* =========================================
   4. 固定ページ共通
========================================= */

details{
  background:#fff;
  border-radius:12px;
  padding:14px;
}

summary{
  font-size:22px;
  font-weight:700;
}


/* =========================================
   5. お知らせカード
========================================= */

.z1-notice-card-scroll{
  overflow-x:auto;
}

.z1-notice-card-list{
  display:flex;
  gap:16px;
}

.z1-notice-card-item{
  flex:0 0 240px;
  background:#fff;
  border-radius:16px;
  overflow:hidden;
}

.z1-notice-card-thumb-wrap{
  position:relative;
}

.z1-notice-card-body{
  padding:12px;
}

/* 重要 */
.z1-notice-card-important-badge{
  position:absolute;
  top:12px;
  left:12px;
  background:#d93025;
  color:#fff;
  padding:8px 12px;
  border-radius:999px;
}

/* 期間前 */
.z1-notice-card-before-badge{
  position:absolute;
  top:12px;
  right:12px;
  background:#2196f3;
  color:#fff;
  padding:6px 10px;
  border-radius:999px;
}

/* まもなく終了 */
.z1-notice-card-ending-badge{
  position:absolute;
  top:12px;
  right:12px;
  background:#ff9800;
  color:#fff;
  padding:6px 10px;
  border-radius:6px;
  animation:z1-blink 1s infinite;
}

/* 終了 */
.z1-notice-card-status-stamp{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%) rotate(-18deg);
  z-index:4;
  display:inline-block;
  padding:12px 28px;
  border-radius:12px;
  font-size:28px;
  font-weight:900;
  letter-spacing:0.08em;
  color:#fff;
  border:3px solid #fff;
  box-shadow:0 4px 14px rgba(0,0,0,0.22);
  pointer-events:none;
  white-space:nowrap;
}

/* 開催中 */
.z1-notice-card-status-stamp.is-active{
  background:rgba(46, 125, 50, 0.82);
}

/* まもなく終了 */
.z1-notice-card-status-stamp.is-ending-soon{
  background:rgba(245, 124, 0, 0.84);
}

/* 終了しました */
.z1-notice-card-status-stamp.is-ended{
  background:rgba(60, 60, 60, 0.72);
}

/* =========================================
   6. 検索フォーム
========================================= */

.np-filter{
  margin-bottom:20px;
}

.np-btn{
  background:#4b7d4f;
  color:#fff;
}


/* =========================================
   7. 行事写真
========================================= */

.ep-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.ep-card{
  background:#fff;
  border-radius:20px;
}


/* =========================================
   8. 問い合わせ・戻るボタン
========================================= */

.z1-contact-card{
  background:#fff3e0;
  padding:40px;
}

.z1-contact-btn{
  background:#ff9800;
  color:#fff;
  padding:18px 42px;
}

.z1-back-link{
  background:#e53935;
  color:#fff;
}
/* =========================================
   9. スマホ調整
========================================= */
@media (max-width:768px){

  #header-container #navi .navi-in > ul{
    display:flex !important;
    flex-wrap:wrap;
    justify-content:space-between;
    gap:10px 12px;
  }

  #header-container #navi .navi-in > ul > li{
    width:auto !important;
    flex:0 0 auto;
  }

  #header-container #navi .navi-in > ul > li > a{
    font-size:13px;
    padding:6px 8px;
    white-space:nowrap;
  }

  /* 町会加入だけ1段使って横長にする */
  #header-container #navi .navi-in > ul > li:last-child{
    flex:0 0 100%;
    width:100% !important;
  }

  #header-container #navi .navi-in > ul > li:last-child > a{
    display:block;
    width:100%;
    text-align:center;
    white-space:nowrap;
    font-size:16px;
    padding:12px 14px;
    box-sizing:border-box;
  }

  /* グリッド */
  .z1-navgrid{
    grid-template-columns:repeat(2,1fr);
  }

  .ep-cards{
    grid-template-columns:1fr;
  }

  /* トップ導線ボタン */
  .z1-btn{
    flex-direction:row;
    align-items:center;
    justify-content:center;
  }

  .z1-main{
    white-space:nowrap;
    font-size:16px;
  }
}

/* アニメーション */
@keyframes z1-blink{
  0%,100%{opacity:1;}
  50%{opacity:0.4;}
}