@charset "utf-8";

.container {
  padding: 8vh 0;
  width: min(95vw, 1000px);
}

/* ¥Á¥ã¥×¥¿©`¥Ø¥Ã¥À©` */
.chapter-head__image{
  height: 560px;
  object-fit: cover;
  object-position: top 20% left 0px;
}
.chapter-head__ttl{
  position: relative;
  top: -45px;
  height: 90px;
  padding: 2%;
  color: var(--ac-color);
  background-color: #fff;
  border: 2px solid var(--ac-color);
  display: flex;
  align-items: center;
  width: fit-content;
}
.chapter-head__ttl::after {
  content: '¨‹';
  position: absolute;
  width: 10px;
  height: 20px;
  top: -11px;
  left: -1px;
  transform: skew(-30deg, 0deg);
}
.chapter-head__column {
  white-space: pre-wrap;
  width: min(90vw, 800px);
  margin: 0 auto 80px auto;
}
.person-list.--column {
  width: 100%;
  margin: 0 auto 160px auto;
}
.person-list.--column .person-list__item {
  font-size: 2.0rem;
  font-weight: 500;
  width: fit-content;
  margin-bottom: 8px;
  padding-right: 2em;
}
@media screen and (max-width: 767px),print {
.chapter-head__image{
  height: 300px;
  object-position: top 50% right 42%;
}
.chapter-head__column {
  margin: 0 auto 40px auto;
}
.chapter-head__ttl{
  width: 95vw;
  position: relative;
  top: -45px;
  left: 0;
  height: 80px;
  padding: 2% 5%;
}
.chapter-head__ttl::after {
  top: -8px;
  left: -3px;
}
.person-list.--column {
  grid-template-columns: 1fr;
  width: 70vw;
  gap: 4%;
}
.person-list.--column .person-list__item {
  font-size: 1.4rem;
  width: 70vw;
}
}

/* ¥»¥¯¥·¥ç¥ó */
.column-section {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}
.column-section + .column-section {
  margin-top: 50px;
}
/* ×ó‚Ȥ¬Ð´Õæ */
.--reverse > .column-section__article {
  order: 2;
}
/* ºá¤ËŽÚ¤¬¤ë */
.--spread > .column-section__article {
  grid-column: span 2;
}
.column-section__article {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.column-section__article > .--movie {
  min-height: 540px;
}
.column-section__ttl {
  color: var(--ac-color);
  font-size: 3.0rem;
  font-weight: bold;
  display: flex;
  flex-direction: column;
}
.column-section__ttl::after {
  content: "";
  border: 1px solid var(--ac-color);
  margin-top: 4px;
}
.modal__item {
  border: 0.5px solid var(--text-color2);
}
.modal__item > .modal__image {
  width: max(100%, 479x);
  height: auto;
  aspect-ratio: 1 / 1;
  max-height: fit-content;
  object-fit: cover;
  position: relative;
}
.--bottom {
  object-position: bottom;
}
.--top {
  object-position: top;
}
.modal__caption {
  font-size: 1.4rem;
}
/* дÕæ2ö */
.photo-2box {
  gap: 1%;
}
.--spread > .photo-2box {
  grid-column: span 2;
}
/* ×îáá¤Î¥È¥Ô¥Ã¥¯¥¹ */
.--topic {
  background: #fff;
  width: min(95vw, 1300px);
  margin: 40px auto 0 auto;
}
.--topic > .column-section {
  width: min(90vw, 1000px);
  margin: 0 auto;
  padding: 5vh 0;
}
.--topic .column-section__ttl {
  grid-column: span 2;
  color: var(--text-color);
  display: flex;
  flex-direction: row;
}
.--topic .column-section__ttl::after {
  content: "";
  border: none;
}
.--topic .column-section__ttl::before {
  content: "";
  border: 5px solid var(--ac-color);
  margin-right: 1em;
}
.--column1-7 .modal__image {
  width: 100%;
  height: 240px;
  aspect-ratio: inherit;
  max-height: fit-content;
  object-fit: contain;
  position: relative;
}
.next-chapter {
  width: min(60vw, 260px);
  margin: 160px auto 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.next-chapter > .btn {
  width: min(60vw, 260px);
  height: 60px;
  padding: 0;
}
.next-chapter > .--navigate {
  padding-left: 3em;
}
.btn > a {
  width: min(60vw, 260px);
  height: 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2% 3%;
}


@media screen and (max-width: 767px),print {
.container {
  width: 85vw;
}
.column-section {
  grid-template-columns: 1fr;
  gap: 20px;
}
.modal__imagebox {
  width: 70vw;
  margin: 0 auto;
}
/* ×ó‚Ȥ¬Ð´Õæ */
.--reverse > .column-section__article {
  order: 0;
}
.column-section__article {
  gap: 20px;
}
.column-section__article > .--movie {
  min-height: 200px;
}
.column-section__ttl {
  font-size: 2.0rem;
}
.modal__image {
  margin: 0;
}
.modal__caption {
  font-size: 1.2rem;
}
/* дÕæ2ö */
.photo-2box {
  grid-template-columns: 1fr;
}
/* ×îáá¤Î¥È¥Ô¥Ã¥¯¥¹ */
.--topic {
  background: #fff;
  width: 95vw;
  margin: 0 auto;
}
.--topic > .column-section.--reverse {
  width: 80vw;
  margin: 0 auto;
  padding: 5% 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.--column1-7 {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.next-chapter {
  width: 90vw;
  padding: 0;
}
.next-chapter > .btn {
  width: 90vw;
  height: 60px;
  padding: 0;
  padding-left: 3em;
}
.next-chapter > .--navigate {
  padding-left: 3em;
}
.btn > a {
  width: 90vw;
}
}