@charset "UTF-8";

body {
  min-width: 100%;
}
.inner {
  width: 100%;
  max-width: 100%;
  padding: 0 4.5vw;
}

/**********************************************************
 * header
 **********************************************************/
header {
  height: 0;
  padding: 0;
}
header nav {
  display: none;
}
header nav.active {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #f5b454;
  background-image: url("../img/bg_grid.svg");
}
header nav.active ul {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  flex-direction: column;
  align-items: center;
  gap: 10vw 0;
  width: 100%;
}
header nav li,
header nav li:last-child {
  border: none;
}
header nav a {
  width: 100%;
  height: auto;
}
header nav a .ja {
  font-size: 5vw;
}
header nav a .en {
  font-size: 3.75vw;
}
.menu_trigger {
  position: fixed;
  top: 0;
  right: 0;
}
.menu_trigger .menu_line {
  position: relative;
  width: 13.333vw;
  height: 13.333vw;
  background-color: #bc7719;
  cursor: pointer;
}
.menu_trigger .menu_line span {
  display: inline-block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 7.466vw;
  height: 0.5333vw;
  background: #fff;
  transition: all .4s;
}
.menu_trigger .menu_line span:nth-of-type(1) {
  top:4vw;
}
.menu_trigger .menu_line span:nth-of-type(2) {
  top:6.4vw;
}
.menu_trigger .menu_line span:nth-of-type(3) {
  bottom: 4vw;
}
.menu_trigger.active span:nth-of-type(1) {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
}
.menu_trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu_trigger.active span:nth-of-type(3) {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}

/**********************************************************
 * main
 **********************************************************/
main {
  margin-top: 0;
}

.title_section .align_center {
  margin-bottom: 1.8em;
  font-size: 5vw;
}
#about .title_section .align_center {
  padding: 0 .5em;
}
.title_section .large {
  font-size: .95em;
  line-height: 1.3;
}
#about .youtube {
  width: 100%;
  margin: 10vw auto 0;
}
p.title.titleAnnounce.dialog-button{
  padding: 15px 0;
}
#top .inner {
  padding: 0;
}

#about {
  padding: 10vw 0;
}
#about p {
  width: 100%;
  font-size: 4.375vw;
  line-height: 1.4;
}
#about h3 {
  font-size: 4.5vw;
}

#schedule {
  padding: 10vw 0;
}
#schedule .scene {
  flex-wrap: wrap;
  gap: 1vw;
  margin-bottom: 10vw;
}
#schedule .scene li {
  width: 45vw;
}
#schedule .img_date {
  width: 80vw;
  margin: 0 auto 10vw;
}
.part > li {
  padding: 10vw 0;
}
.part .title_part span {
  font-size: 5.625vw;
}
.part .title_content {
  font-size: 5vw;
}
.part .bg {
  margin-top: 8vw;
  padding: 8vw 5vw;
  border-radius: 5vw;
}
.part .cinema.bg {
  padding-top: 8vw;
}
.part .title_guest .align_center {
  font-size: 5vw;
}
.list_guest,
.list_guest2 {
  flex-wrap: wrap;
  gap: 8vw 0;
  width: 100%;
  margin: 5vw auto 0;
}
.list_guest li {
  width: 49%;
  text-align: center;
}
.list_guest li:first-child {
  width: 100%;
}
.list_guest li img {
  width: 39.07vw;
}
.list_guest li .name {
  font-size: 6vw;
}
.list_guest2 li {
  display: block;
  width: 100%;
  text-align: center;
}
.list_guest2 li .name {
  text-align: center;
}
.list_guest2 li p{
  margin-left:0;
  font-size: 3vw;
}
.part .img_cinema {
  margin: 0 auto;
}
.part .cinema dl {
  width: 100%;
  font-size: 5vw;
}
.part .cinema dl + dl {
  margin-top: .5em;
}
#schedule .cinema dt {
  display: block;
}
#schedule .cinema .story {
  width: 100%;
  margin: 8vw auto 0;
  padding: 5vw;
}
#schedule .cinema .story h5 {
  font-size: 6vw;
  margin-bottom: .8em;
}
#schedule .cinema .story p {
  font-size: 4.375vw;
  line-height: 1.4;
}

#ticket {
  padding: 10vw 0;
}
#ticket .price .type {
  font-size: 10vw;
}
#ticket .price .type span {
  display: block;
  line-height: 1.4;
}
#ticket .price .note {
  flex-direction: column;
  gap: 0;
  margin-top: 2em;
  font-size: 3.5vw;
}
#ticket .contact {
  margin-top: 10vw;
  padding-top: 10vw;
}
#ticket .contact .title_contact {
  font-size: 5vw;
}
#ticket .contact .name {
  font-size: 5vw;
}
#ticket .contact a,
#ticket .contact span {
  font-size: 5vw;
}
#ticket .agency {
  width: 100%;
  margin: 10vw auto 0;
  padding: 8vw 0;
}
#ticket .agency .title_agency {
  margin-bottom: 8vw;
}
#ticket .agency .title_agency .align_center {
  font-size: 5vw;
}
#ticket .list_agency {
  gap: 6vw 0;
  padding: 0 5vw;
}
#ticket .list_agency .name {
  font-size: 6vw;
}
#ticket .list_agency a,
#ticket .list_agency span {
  font-size: 5vw;
  word-break: break-all;
}
#ticket .list_agency .note {
  font-size: 4.375vw;
}
#ticket .img_cinema {
  margin: 5vw auto 0;
}

#performers {
  padding: 10vw 0;
}
#performers .note {
  width: 100%;
  font-size: 3.33vw;
}
#performers .list_performer {
  gap: 8vw 0;
  width: 100%;
  margin: 5vw auto 0;
}
#performers .list_performer img {
  width: 100%;
}
#performers .list_performer .name {
  font-size: 6vw;
  line-height: 1.3;
}
#performers .list_performer p {
  font-size: 4.375vw;
  line-height: 1.4;
}
#performers .list_performer a {
  margin: 1em 0 0 1em;
}

#description {
  padding: 10vw 0;
}
#description .box {
  width: 100%;
  padding: 6vw;
  border-image-width: 4vw 4vw;
}
#description .box .title_description {
  margin-bottom: 1.5em;
  font-size: 6vw;
}
#description .box p {
  font-size: 4.375vw;
  line-height: 1.4;
}

/**********************************************************
 * footer
 **********************************************************/
footer .organizer {
  padding: 8vw 0;
}
footer .organizer span {
  font-size: 4vw;
}
footer .copyright {
  padding: 10vw 0;
}
footer .copyright img {
  width: 30vw;
  margin: 0 5vw;
}


/* ダイアログ（モーダル） */
.dialog,
.dialog2 {
  margin: 5.33vw auto;
  width: 88%;
  padding: 9.6vw 0;
}
.close-button,
.close-button2 {
  width: 9.6vw;
  height: 9.6vw;
}
.dialogTitle {
  font-size: 6.4vw;
  line-height: 1.5;
}
.messageItem {
  flex-direction: column;
  gap: 5.33vw 5.33vw;
  padding: 5.33vw;
  border: 0.27vw solid #ffffff;
}
.messageItem .messageTitle {
  font-size: 4.27vw;
}
.messageItem + .messageItem {
  margin-top: 5.33vw;
}
.messageItem .dialogMessage {
  order: 2;
}
.messageItem.nozawa .dialogMessage,
.messageItem.ikeda .dialogMessage {
  width: 100%;
}
.messageItem .messagePhoto {
  order: 1;
}
.messageItem.nozawa .messagePhoto {
  width: 41.07vw;
}
.messageItem.ikeda .messagePhoto {
  width: 41.33vw;
}
.messageItem .dialogMessage .name,
.dialog .comment {
  font-size: 3.73vw;
}

.dialog2 .imgGoods {
  flex-direction: column;
  gap: 5.33vw 5.33vw;
  margin: 5.33vw 0;
}