main {
  --yellow: #f9f100;
  --green: #33ae33;
  --orange: #e87722;

  --inner-size: 1620px;

  --ic-calendar: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 43 43"><defs><style>.cls-1{fill:%23fff}</style></defs><path class="cls-1" d="M36.88,3.08h-1.58v-1.58c0-.83-.67-1.5-1.5-1.5s-1.5.67-1.5,1.5v1.58H10.69v-1.58c0-.83-.67-1.5-1.5-1.5s-1.5.67-1.5,1.5v1.58h-1.58C2.74,3.08,0,5.82,0,9.19v27.69c0,3.37,2.74,6.12,6.12,6.12h30.77c3.37,0,6.12-2.74,6.12-6.12V9.19c0-3.37-2.74-6.12-6.12-6.12ZM6.12,6.08h30.77c1.72,0,3.12,1.4,3.12,3.12v1.58H3v-1.58c0-1.72,1.4-3.12,3.12-3.12ZM36.88,40H6.12c-1.72,0-3.12-1.4-3.12-3.12V13.77h37v23.12c0,1.72-1.4,3.12-3.12,3.12Z"/><path class="cls-1" d="M25.35,16.88c-1.27,0-2.31,1.03-2.31,2.31s1.03,2.31,2.31,2.31,2.31-1.03,2.31-2.31-1.03-2.31-2.31-2.31Z"/><circle class="cls-1" cx="33.04" cy="19.19" r="2.31"/><path class="cls-1" d="M25.35,24.58c-1.27,0-2.31,1.03-2.31,2.31s1.03,2.31,2.31,2.31,2.31-1.03,2.31-2.31-1.03-2.31-2.31-2.31Z"/><path class="cls-1" d="M33.04,24.58c-1.27,0-2.31,1.03-2.31,2.31s1.03,2.31,2.31,2.31,2.31-1.03,2.31-2.31-1.03-2.31-2.31-2.31Z"/><path class="cls-1" d="M9.96,24.58c-1.27,0-2.31,1.03-2.31,2.31s1.03,2.31,2.31,2.31,2.31-1.03,2.31-2.31-1.03-2.31-2.31-2.31Z"/><path class="cls-1" d="M17.65,24.58c-1.27,0-2.31,1.03-2.31,2.31s1.03,2.31,2.31,2.31,2.31-1.03,2.31-2.31-1.03-2.31-2.31-2.31Z"/><path class="cls-1" d="M9.96,32.27c-1.27,0-2.31,1.03-2.31,2.31s1.03,2.31,2.31,2.31,2.31-1.03,2.31-2.31-1.03-2.31-2.31-2.31Z"/><path class="cls-1" d="M17.65,32.27c-1.27,0-2.31,1.03-2.31,2.31s1.03,2.31,2.31,2.31,2.31-1.03,2.31-2.31-1.03-2.31-2.31-2.31Z"/><path class="cls-1" d="M25.35,32.27c-1.27,0-2.31,1.03-2.31,2.31s1.03,2.31,2.31,2.31,2.31-1.03,2.31-2.31-1.03-2.31-2.31-2.31Z"/></svg>');
  --ic-camera:url('data:image/svg+xml,<svg id="_レイヤー_1" data-name="レイヤー 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 44.6 35"><defs><style>.cls-1{fill:%23fff}</style></defs><path class="cls-1" d="M39.9,6.4h-5.9c-.34,0-.73-.2-1.04-.54l-2.6-4.1c-.04-.06-.08-.12-.13-.18-.88-1.02-2.06-1.58-3.33-1.58h-9.2c-1.27,0-2.45.56-3.33,1.59-.05.06-.09.11-.13.17l-2.6,4.11c-.24.26-.57.53-.94.53h-.1v-.9c0-.83-.67-1.5-1.5-1.5h-2.4c-.83,0-1.5.67-1.5,1.5v.9h-.5c-2.59,0-4.7,2.11-4.7,4.7v19.2c0,2.59,2.11,4.7,4.7,4.7h35.2c2.59,0,4.7-2.11,4.7-4.7V11.1c0-2.59-2.11-4.7-4.7-4.7ZM41.6,30.3c0,.94-.76,1.7-1.7,1.7H4.7c-.94,0-1.7-.76-1.7-1.7V11.1c0-.94.76-1.7,1.7-1.7h6c1.22,0,2.36-.57,3.29-1.66.05-.05.09-.11.13-.17l2.6-4.1c.21-.23.55-.47.99-.47h9.2c.44,0,.78.24.99.47l2.6,4.1c.04.06.08.12.13.17.9,1.05,2.14,1.66,3.39,1.66h5.9c.94,0,1.7.76,1.7,1.7v19.2Z"/><path class="cls-1" d="M22.3,9.6c-5.24,0-9.5,4.26-9.5,9.5s4.26,9.5,9.5,9.5,9.5-4.26,9.5-9.5-4.26-9.5-9.5-9.5ZM22.3,25.6c-3.58,0-6.5-2.92-6.5-6.5s2.92-6.5,6.5-6.5,6.5,2.92,6.5,6.5-2.92,6.5-6.5,6.5Z"/></svg>');
  --ic-outlink:url('data:image/svg+xml,<svg id="_編集モード" data-name="編集モード" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15 15"><defs><style>.cls-1 {fill: none;stroke: %23231815;stroke-miterlimit: 10;}</style></defs><polyline class="cls-1" points="4.8 .5 .5 .5 .5 14.5 14.5 14.5 14.5 9.5"/><g><line class="cls-1" x1="6.72" y1="8.28" x2="14.5" y2=".5"/><polyline class="cls-1" points="14.5 7.03 14.5 .5 7.97 .5"/></g></svg>');
}

main {
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  color: #333;
  font-weight: bold;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
	loading
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.loading {
  background: var(--yellow);
  position: fixed;
  z-index: 1000000;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  transition: 500ms;

  display: grid;
  place-content: center;
}

.is-loaded .loading {
  opacity: 0;
  visibility: hidden;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
	MV
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.mv {
  padding-top: 56px;
}

.mv_logo {
  max-width: min(1400px, 75%);
  margin-inline: auto;
}
@media (max-width: 767px) {
  .mv_logo {
    max-width: 90%;
  }
}

.mv_person {
  max-width: 1920px;
  margin-inline: auto;
  margin-top: max(-200px, -10vw);
  overflow: hidden;
}
.mv_person img {
  display: block;
  width: 100%;
  /* 謎の白線の対応 */
  margin-bottom: -1px;
}
@media (max-width: 767px) {
  .mv_person {
    margin-top: -13vw;
  }
}

.mv_intro {
  background: var(--yellow);
  font-size: var(--f36);
  font-weight: 900;
  padding-block: var(--s6);
}
.mv_intro h2 {
  font-size: inherit;
}
@media (max-width: 767px) {
  .mv_intro {
    font-size: var(--f24);
  }
}

/* MV アニメーション
━━━━━━━━━━━━━━━━━━━━━━━━━ */

.mv-anime-person {
  transition: 700ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
body:not(.is-loaded) .mv-anime-person {
  transform: translateY(100%);
}

.mv-anime-logo use {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;

  animation: fansoPopIn 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.mv-anime-logo use.mv-anime-logo_01 {
  animation-delay: 1500ms;
}
/* F */
.mv-anime-logo use.mv-anime-logo_02 {
  animation-delay: calc(1500ms + 100ms);
}
/* A */
.mv-anime-logo use.mv-anime-logo_03 {
  animation-delay: calc(1500ms + 200ms);
}
/* N */
.mv-anime-logo use.mv-anime-logo_04 {
  animation-delay: calc(1500ms + 300ms);
}
/* S */
.mv-anime-logo use.mv-anime-logo_05 {
  animation-delay: calc(1500ms + 400ms);
}
/* O */
.mv-anime-logo use.mv-anime-logo_06 {
  animation-delay: calc(1500ms + 500ms);
}
/* N */
.mv-anime-logo use.mv-anime-logo_07 {
  animation-delay: calc(1500ms + 600ms);
}
/* ! */
.mv-anime-logo use.mv-anime-logo_08 {
  animation-delay: calc(1500ms + 700ms);
}

@keyframes fansoPopIn {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.mv-anime-intro {
  transition: 700ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-delay: 200ms;
}
body:not(.is-loaded) .mv-anime-intro {
  transform: translateY(500%);
  opacity: 0;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
	about
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.about {
  padding-block: var(--s5) var(--s15);
  background: var(--yellow);
  position: relative;
}
@media (max-width: 767px) {
  .about {
    padding-block: var(--s5) 30vw;
  }
}

.about-intro {
  display: grid;
  grid-template-columns: 590fr 785fr;
  gap: var(--s10) var(--s15);
}
.about-intro_tit {
  background: #fff;
  display: grid;
  place-content: center;
  border-radius: 0 100px 0 100px;
  padding: var(--s5);
}
.about-intro_text {
  font-size: var(--f20);
  line-height: 2.4;
  padding-block: var(--s10);
}
/* .about-intro_text_pr {
  padding-right: 15%;
} */
@media (max-width: 1180px) {
  .about-intro {
    grid-template-columns: 1fr;
  }
  .about-intro_tit {
    border-radius: 0 60px 0 60px;
  }
}
@media (max-width: 767px) {
  .about-intro_tit {
    padding: var(--s10) var(--s5);
  }
  .about-intro_text {
    font-size: 16px;
    padding-block: 0;

  }
  .about-intro_text_pr {
    padding-right: 0;
  }
}

.about-elem {
  position: absolute;
  width: 10%;
  max-width: 220px;
  bottom: -15px;
  right: 4%;
}
@media (max-width: 767px) {
  .about-elem {
    width: 20%;
    max-width: 110px;
  }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
	event
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.event {
  padding-top: calc(var(--s10) + var(--s8));
  background: var(--green);
}
@media (max-width: 1180px) {
  .event {
    padding-inline: max((100vw - var(--inner-size))/2, var(--inner-side-m));
  }
}

.event-container {
  display: grid;
  gap: var(--s10) var(--s15);
  grid-template-columns: auto auto;
}
.event-container_title {
  background: #fff;
  border-radius: 0 100px 0 0;
  padding-block: var(--s10);
  padding-right: var(--s10);
  padding-left: max((100vw - var(--inner-size))/2, var(--inner-side-m));
  display: grid;
  place-content: center;
}
.event-container_content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--s9);
  padding-bottom: calc(var(--s10) + var(--s8));
  padding-right: max((100vw - var(--inner-size))/2, var(--inner-side-m));
}
@media (max-width: 1180px) {
  .event-container {
    grid-template-columns: 1fr;
  }
  .event-container_title {
    border-radius: 0 60px 0 60px;
    padding-left: 0;
    padding: var(--s10) var(--s5);
  }
  .event-container_content {
    padding-right: 0;
  }
}
@media (max-width: 767px) {
  .event-container_content {
    grid-template-columns: 1fr;
  }
}

.event-subtitle {
  color: #fff;
  font-size: 30px;
  text-align: center;
  margin-bottom: var(--s6);
}
.event-subtitle::before {
  content: "";
  display: inline-block;
  vertical-align: -0.15em;
  width: 1.2em;
  aspect-ratio: 1;
  margin-right: var(--s3);
  background: no-repeat center/100% auto;
}
.event-subtitle.-calendar::before {
  background-image: var(--ic-calendar);
}
.event-subtitle.-camera::before {
  background-image: var(--ic-camera);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
	information
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.information {
  background: var(--orange);
  padding-block: var(--s15);
}

.information-title {
  text-align: center;
}
.information-title {
  max-width: 70%;
  margin-inline: auto;
}

.infomation-list {
  margin-top: var(--s3);
  max-width: max-content;
  margin-inline: auto;
  font-size: var(--f24);
}
.infomation-list li {
  display: grid;
  grid-template-columns: 6em 1fr;
  color: #fff;
}
@media (max-width: 767px) {
  .infomation-list {
    font-size: 15px;
  }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
	links
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.links {
  padding-block: var(--s15);
}

.links-title {
  text-align: center;
}

.links-list {
  margin-top: var(--s15);
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--s8) var(--s5);
}
@media (max-width: 1180px) {
  .links-list {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 767px) {
  .links-list {
    grid-template-columns: repeat(2, 1fr);
  }
}


.links-card {
  transition: opacity var(--tt);
  font-family: var(--font-family-basic);
}
.links-card_img {
  border: 1px solid #ccc;
  overflow: hidden;
}
.links-card_img img {
  display: block;
  width: 100%;
  transition: transform var(--tt);
}
.links-card_tit {
  line-height: var(--line-height-min);
  margin-block: var(--s2) 4px;
  font-size: var(--f18);
  font-weight: bold;
  position: relative;
  padding-right: 1.2em;
}
.links-card_tit::after {
  content: "";
  position: absolute;
  right: 0;
  top: .2em;
  background: var(--ic-outlink) center/100% 100%;
  width: .9em;
  aspect-ratio: 1;
}
.links-card_tit small {
  font-size: 0.8em;
  display: inline-block;
}
.links-card_txt {
  font-size: var(--f14);
  color: var(--gray);
  font-weight: normal;
}
@media (hover: hover) {
  a.links-card:hover {
    opacity: 0.7;
  }
}
@media (max-width: 767px) {
  .links-card_tit {
    font-size: 12px;
  }
  .links-card_txt {
    font-size: 10px;
  }
}