/*
WordPress のクラシックエディタで付与される class に対するスタイル
*/

/* 右寄せ */
.alignright {
  float: right;
}
p:has(.alignright)::after {
  content: "";
  display: block;
  clear: both;
}

/* 左寄せ */
.alignleft {
  float: left;
}
p:has(.alignleft)::after {
  content: "";
  display: block;
  clear: both;
}

/* 中央寄せ */
.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* キャプション付き画 */
.wp-caption {
  display: inline-block;
  max-width: 100%; /* 画像幅に合わせて制限 */
}

/* フル幅 (alignwide や alignfull) */
.alignwide {
  width: 100%; /* もしくはテーマに合わせて調整 */
}
.alignfull {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

/*
  投稿(post) のギャラリー用
  外部ファイル化が必要か
*/
.gallery {
  display: grid;
  gap: 1rem;
}
/* middleサイズ */
.gallery.gallery-columns-1 {
  grid-template-columns: repeat(1, 1fr);
}
.gallery.gallery-columns-2 {
  grid-template-columns: repeat(2, 1fr);
}
.gallery.gallery-columns-3 {
  grid-template-columns: repeat(3, 1fr);
}
.gallery.gallery-columns-4 {
  grid-template-columns: repeat(4, 1fr);
}
.gallery.gallery-columns-5 {
  grid-template-columns: repeat(5, 1fr);
}
.gallery.gallery-columns-6 {
  grid-template-columns: repeat(6, 1fr);
}
.gallery.gallery-columns-7 {
  grid-template-columns: repeat(7, 1fr);
}
.gallery.gallery-columns-8 {
  grid-template-columns: repeat(8, 1fr);
}
.gallery.gallery-columns-9 {
  grid-template-columns: repeat(9, 1fr);
}

/* thumbnail サイズの場合 */
.gallery-size-thumbnail.gallery-columns-3,
.gallery-size-thumbnail.gallery-columns-4,
.gallery-size-thumbnail.gallery-columns-5,
.gallery-size-thumbnail.gallery-columns-6,
.gallery-size-thumbnail.gallery-columns-7,
.gallery-size-thumbnail.gallery-columns-8,
.gallery-size-thumbnail.gallery-columns-9 {
  gap: 0;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 578px) {
  /* .gallery-size-thumbnail.gallery-columns-3, */
  .gallery-size-thumbnail.gallery-columns-4,
  .gallery-size-thumbnail.gallery-columns-5,
  .gallery-size-thumbnail.gallery-columns-6,
  .gallery-size-thumbnail.gallery-columns-7,
  .gallery-size-thumbnail.gallery-columns-8,
  .gallery-size-thumbnail.gallery-columns-9 {
    grid-template-columns: repeat(1, 1fr);
  }
}

/* medium サイズの場合 */
.gallery-size-medium.gallery-columns-2,
.gallery-size-medium.gallery-columns-3,
.gallery-size-medium.gallery-columns-4,
.gallery-size-medium.gallery-columns-5,
.gallery-size-medium.gallery-columns-6,
.gallery-size-medium.gallery-columns-7,
.gallery-size-medium.gallery-columns-8,
.gallery-size-medium.gallery-columns-9 {
  grid-template-columns: repeat(1, 1fr);
}

@media screen and (min-width: 768px) {
  .gallery-size-medium.gallery-columns-2,
  .gallery-size-medium.gallery-columns-3,
  .gallery-size-medium.gallery-columns-4,
  .gallery-size-medium.gallery-columns-5,
  .gallery-size-medium.gallery-columns-6,
  .gallery-size-medium.gallery-columns-7,
  .gallery-size-medium.gallery-columns-8,
  .gallery-size-medium.gallery-columns-9 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (min-width: 1024px) {
  .gallery.gallery-columns-2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .gallery.gallery-columns-3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .gallery.gallery-columns-4 {
    grid-template-columns: repeat(4, 1fr);
  }
  .gallery.gallery-columns-5 {
    grid-template-columns: repeat(5, 1fr);
  }
  .gallery.gallery-columns-6 {
    grid-template-columns: repeat(6, 1fr);
  }
  .gallery.gallery-columns-7 {
    grid-template-columns: repeat(7, 1fr);
  }
  .gallery.gallery-columns-8 {
    grid-template-columns: repeat(8, 1fr);
  }
  .gallery.gallery-columns-9 {
    grid-template-columns: repeat(9, 1fr);
  }
}

.gallery > .gallery-item a,
.gallery > .gallery-item img {
  /* display: block;
  width: 100%; */
}
.gallery > .gallery-item img {
  object-fit: contain;
  object-position: center;
}