@charset "UTF-8";
/* =========================================================
   トップページ・お知らせ（管理画面で生成するページ）用の追加スタイル
   既存の contents.css / user.css の後に読み込みます。
========================================================= */

.sj-visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---------- メインビジュアル（KV） ---------- */
#row01img { background: #141414; }
.sj-kv { position: relative; max-width: 2400px; margin: 0 auto; }
.sj-kv-slide img { display: block; width: 100%; height: auto; }
.sj-kv-slide a { display: block; }
/* スライダー起動前は1枚目だけ表示（ちらつき防止） */
.sj-kv:not(.slick-initialized) .sj-kv-slide + .sj-kv-slide { display: none; }

.sj-kv.slick-dotted { margin-bottom: 0; }
.sj-kv .slick-dots { bottom: 10px; }
.sj-kv .slick-dots li { margin: 0 2px; }
.sj-kv .slick-dots li button:before { color: #fff; opacity: .6; font-size: 10px; text-shadow: 0 0 3px rgba(0,0,0,.6); }
.sj-kv .slick-dots li.slick-active button:before { color: #fff; opacity: 1; }
.sj-kv .slick-prev, .sj-kv .slick-next { z-index: 2; width: 40px; height: 40px; }
.sj-kv .slick-prev { left: 15px; }
.sj-kv .slick-next { right: 15px; }
.sj-kv .slick-prev:before, .sj-kv .slick-next:before { font-size: 36px; text-shadow: 0 0 6px rgba(0,0,0,.5); }
@media (max-width: 700px) {
  .sj-kv .slick-prev, .sj-kv .slick-next { display: none !important; }
  .sj-kv .slick-dots { bottom: 4px; }
}

/* 動画スライド */
.sj-kv-play {
  position: relative; display: block; width: 100%;
  padding: 0; border: 0; background: none; cursor: pointer;
}
.sj-kv-playicon {
  position: absolute; left: 50%; top: 50%;
  width: 78px; height: 78px; margin: -39px 0 0 -39px;
  border-radius: 50%; background: rgba(0,0,0,.55);
  box-shadow: 0 0 0 3px rgba(255,255,255,.85);
  transition: transform .2s, background .2s;
}
.sj-kv-playicon:after {
  content: ""; position: absolute; left: 31px; top: 23px;
  border-style: solid; border-width: 16px 0 16px 26px;
  border-color: transparent transparent transparent #fff;
}
.sj-kv-play:hover .sj-kv-playicon,
.sj-kv-play:focus-visible .sj-kv-playicon { transform: scale(1.08); background: rgba(160,0,0,.8); }
@media (max-width: 700px) {
  .sj-kv-playicon { width: 54px; height: 54px; margin: -27px 0 0 -27px; }
  .sj-kv-playicon:after { left: 21px; top: 16px; border-width: 11px 0 11px 18px; }
}
.sj-kv-frame { position: relative; width: 100%; aspect-ratio: 16 / 9; max-height: 80vh; background: #000; }
.sj-kv-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- お知らせ本文 ---------- */
.postbody img { max-width: 100%; height: auto; }
.postbody img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.postbody a img { cursor: zoom-in; }
.sj-news-side .list-group-item small { color: #888; }

/* 画像の拡大表示 */
.sj-lightbox {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.85); cursor: zoom-out; padding: 20px;
}
.sj-lightbox img { max-width: 100%; max-height: 100%; box-shadow: 0 0 30px rgba(0,0,0,.6); }
.sj-lightbox button {
  position: absolute; top: 10px; right: 14px;
  border: 0; background: none; color: #fff; font-size: 36px; line-height: 1; cursor: pointer;
}

/* ---------- 管理画面のプレビュー表示 ---------- */
.sj-preview-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999;
  padding: 10px 16px; background: #b5121b; color: #fff;
  font-size: 14px; font-weight: 700; text-align: center;
}
.sj-preview-bar a { color: #fff; text-decoration: underline; }