@charset "shift_jis";
/* --------------------------
    all
-------------------------- */
#event .img-block {
    max-width: 1600px;
}

.img-box {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

/* デフォルト画像のスタイル */
.default-image {
  display: block;
  width: 100%;
  height: auto;
  transition: opacity 0.3s ease;
}

/* ホバー画像のスタイル（初期状態では非表示） */
.hover-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* ホバー時のスタイル切り替え */
.img-box:hover .default-image {
  opacity: 0;
}

.img-box:hover .hover-image {
  opacity: 1;
}

#event .comment-box {
    margin: 0 auto;
    font-size: 2em;
}

@media screen and (max-width: 980px) {
    .img4 .img-box, .img4 .inner{
        width: 50%;
    }
}

        
/* --------------------------
    PC用スタイル
-------------------------- */
@media screen and (min-width: 780px) {}
/* --------------------------
    スマホ用スタイル
-------------------------- */
@media screen and (max-width: 499px) {
#event .comment-box {
    font-size: 1.5em;
}
}
