/* top.css  ※トップページ固有だけ置く */

/* ===== 広報みさき（トップ特有の見せ方） ===== */
.mini-new{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:center;
}
.badge-new{ width:42px; height:auto; display:inline-block; }

.misaki-head{
  width:100%;
  margin:0;
  padding: 12px 10px;
  background: var(--misaki-head);
  color:#fff;
  border-radius: var(--radius);
}
.misaki-head span{
  display:block;
  margin-top: 6px;
  font-size: 12px;
  opacity:.95;
}

/* allpage側の .misaki-list は縦積みなので、トップでは横＋NEWを並べたい */
.misaki-list a{
  flex-direction: row;
  gap: 8px;
}
.misaki-list a small{
  display: inline-block;
}

/* もっと見る/折りたたみ（トップ専用UI） */
.misaki-more-btn,
.misaki-less-btn{
  width: 100%;
  max-width: 240px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.2);
  background:#fff;
  cursor:pointer;
  font-weight:800;
}

/* ===== Center: ヒーロー（トップ専用） ===== */
.hero-grid{
  width:100%;
  display:grid;
  grid-template-columns: 320px 1fr;
  gap: 14px;
  align-items:start;
}
.hero-img img{
  width:320px;
  height:208px;
  object-fit:cover;
  border-radius: 8px;
}
.hero-text img{ max-width: 240px; height:auto; }
.lead{ font-size: 18px; font-weight: 900; margin: 0; }
.desc{ margin:0; line-height:1.75; }

/* ===== トピックス（トップ専用） ===== */
.topic-photo img{
  width:320px;
  height:208px;
  object-fit:cover;
  border-radius: 8px;
}
.text-slideshow{
  font-size: 22px;
  font-weight: 900;
  color:#0033cc;
  transition: opacity .25s ease;
}
#topicSlideshow{ transition: opacity .25s ease; }
.is-anim{ opacity: .2; }

.topic-actions{
  display:grid;
  gap: 12px;
  justify-items:center;
}
.img-btn{
  position:relative;
  width: 280px;
  border-radius: 12px;
  overflow:hidden;
  display:block;
}
.img-btn img{ width:100%; display:block; }
.img-btn img:nth-child(2){
  position:absolute; inset:0;
  opacity:0; transition: opacity .2s ease;
}
.img-btn:hover img:nth-child(2){ opacity:1; }

.small{ margin:0; font-size: 12px; color:#333; }

/* ===== 更新記録（トップ専用） ===== */
.update-textarea{
  width:100%;
  max-width: 680px;
  font-size: 12px;
  line-height: 1.6;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid #ddd;
  background: #f7f7f7;
  resize: vertical;
}

/* ===== トップのレイアウト崩れ防止（共通と同じ980px基準） ===== */
@media (max-width: 980px){
  .hero-grid{ grid-template-columns: 1fr; }
  .hero-img img{ width:100%; height:auto; }
  .topic-photo img{ width:100%; height:auto; }
}