@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic&display=swap");
.p-comic_bg {
  width: 100%;
  height: 100%;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
}
.p-comic_bg__particle {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

.p-comic {
  --color-comic-text: #3a3c42;
  display: block;
  position: relative;
  margin-top: -3rem;
  color: var(--color-comic-text);
}
.p-comic__header {
  display: block;
  position: relative;
  margin-bottom: 4.4rem;
}
@media screen and (max-width: 960px) {
  .p-comic__header {
    margin-bottom: 3.4rem;
  }
}
.p-comic__title {
  width: 73rem;
  display: block;
  position: relative;
  margin: 0 auto;
}
.p-comic__lead {
  display: block;
  position: relative;
  margin-top: 3rem;
  font-size: 1.8rem;
  line-height: 1.8;
  font-family: "Zen Maru Gothic", "Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  letter-spacing: 0;
  font-weight: 600;
  text-align: center;
}
.p-comic__inner {
  display: block;
  position: relative;
}
.p-comic__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem 2rem;
  position: relative;
}
@media screen and (min-width: 961px) and (min-width: 1800px) {
  .p-comic__list {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (max-width: 960px) {
  .p-comic__list {
    grid-template-columns: repeat(1, 1fr);
    gap: 0.5rem 2rem;
  }
}
@media screen and (max-width: 960px) and (min-width: 700px) {
  .p-comic__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
.p-comic__list-item {
  display: block;
  position: relative;
}