@charset "UTF-8";
/* CSS Document */

.page.blue h1 {
  background: url(../img/line_blue.png) repeat-x left bottom / auto 11px;
}

.page.purple h1 {
  background: url(../img/line_purple.png) repeat-x left bottom / auto 11px;
}

.page h1 {
  padding: 0 0 1em;
  margin-bottom: 1em;
  font-size: 180%;
  font-weight: normal;
}

.blue h2:not([class]) {
  border-bottom: 2px solid #274da7;
}

.purple .contents_wrap h2:not([class]) {
  border-bottom: 2px solid #9f2560;
}

.page h2:not([class]) {
  font-size: 125%;
  padding-bottom: 1em;
  margin-bottom: 2em;
  font-weight: normal;
}

.page h3:not([class]) {
  font-size: 105%;
  padding-bottom: 1em;
  margin-bottom: 2em;
  font-weight: normal;
  position: relative;
}

.page h3:not([class])::after {
  content: "";
  width: 2em;
  height: 2px;
  bottom: 0;
  left: 0;
  position: absolute;
}

.blue h3::after {
  background-color: #274da7;
}

.purple h3::after,
.purple h3::before {
  background-color: #9f2560;
}

.purple .pu_h3 {
  color: #9f2560;
}

.page .containar p:not([class]) {
  width: 92%;
  margin: 0 auto 2em;
}

.page a {
  text-decoration: underline;
  display: inline-block;
  margin: 0 .3em;
}

.ul_disc,
.ul_notice {
  margin-bottom: 2em;
}

.blue .ul_disc li {
  color: #274da7;
}

.purple .ul_disc li {
  color: #9f2560;
}

.ul_disc li {
  list-style-type: disc;
  padding-left: .2em;
  margin-left: 1.2em;
}

.page .containar .ul_notice {
  color: #b30000;
}

.ul_notice li::before {
  content: "※";
  display: inline-block;
  padding-right: .4em;
}

.page .containar ul span {
  color: #222;
}

.page .containar dl:not([class]) {
  margin-bottom: 2em;
}

.page .containar dt {
  padding: .5em 4%;
}

.page .containar dd {
  padding: .5em 4%;
}

.page .containar dd div {
  margin-bottom: 1em;
}

.link_list a {
  color: #222;
  text-decoration: underline;
  display: inline;
}

.blue .link_list li::before {
  content: url(../img/arw_blue.png);
}

.purple .link_list li::before {
  content: url(../img/arw_purple02.png);
}

.link_list li::before {
  padding-right: .3em;
}

.page.blue .for_detail a,
.page.blue .for_detail02 a {
  background-image: url(../img/arw_blue.png);
  color: #274da7;
  text-decoration: none;
}

.page.purple .for_detail a,
.page.purple .for_detail02 a {
  background-image: url(../img/arw_purple02.png);
  color: #9f2560;
  text-decoration: none;
}

.page .for_detail a {
  background-size: .8em;
}

.page .table_scroll {
  overflow-x: auto;
  white-space: nowrap;
  width: 100%;
  margin-bottom: 2em;
}

.page table {
  width: 100%;
}

.page th {
  background-color: #e9e9e9;
  font-weight: normal;
  padding: .5em;
}

.page td {
  padding: .5em;
  border-bottom: 1px solid #e9e9e9;
  vertical-align: middle;
}

.page th:not(:last-child),
.page td:not(:last-child) {
  border-right: 2px solid #fff;
}

.table_slide {
    text-align: right;
}

.table_slide::before,
.table_slide::after {
  content: "";
  background: url(../img/arw_black.png) no-repeat right center / 13px;
  width: 13px;
  height: 1em;
  display: inline-block;
}

.table_slide::before {
  transform: scale(-1, 1);
  padding-right: .5em;
}

.table_slide::after {
  padding-left: .5em;
}

.inte {
    text-align: right;
}

.overview {
  margin-bottom: 2em;
}

.overview img {
  display: block;
  width: 75%;
  margin: 0 auto;
  border-radius: 10px;
}

.page dt {
  background-color: #e9e9e9;
}

.outline {
  border: 1px solid #e9e9e9;
  border-radius: 10px;
  padding: 1.5em 4%;
  margin-bottom: 2em;
}

.page .outline p:not([class]) {
  margin: 0;
  width: 100%;
}

.sns_share {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 4em auto 0;
  width: 65%;
  min-width: 280px;
}

.page .sns_share dt {
  background-color: transparent;
  text-align: center;
  width: 100%;
}

.page .sns_share dd {
  width: 32%;
  text-align: center;
}

.page .sns_share .share_fb {
  padding: 0;
}

.page .sns_share .share_twi,
.page .sns_share .share_line {
  padding: 5px 0 0;
}

/* purple用スタイル */
.ticket_guide {
  display: flex;
  flex-wrap: wrap;
  font-size: 70%;
  width: 92%;
  margin: 0 auto 3em;
}

.ticket_guide01 {
  background: url(../img/ticket_guide01_ico.png);
}
.ticket_guide02 {
  background: url(../img/ticket_guide02_ico.png);
}
.ticket_guide03 {
  background: url(../img/ticket_guide03_ico.png);
}
.ticket_guide04 {
  background: url(../img/ticket_guide04_ico.png);
}
.ticket_guide05 {
  background: url(../img/ticket_guide05_ico.png);
}

.ticket_guide li {
  width:8em;
  border: 1px solid #707070;
  border-radius: 5px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 4em 0 .5em;
  margin: 0 1em 1em 0;
  background-position: 50% .5em;
  background-repeat: no-repeat;
  background-size: 3em auto;
}

.perform_info {
  width: 92%;
  margin: 0 auto 3em;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.perform_flyer,
.perform_info figure {
  width: 90%;
  max-width: 400px;
  margin: 0 auto 2em;
  position: relative;
}

.perform_info figure {
    display: flex;
    flex-direction: column;
    order: 1;
}

.perform_flyer img,
.perform_info figure img {
  position: relative;
  border-radius: 5px;
  display: block;
  z-index: 1;
  width: 100%;
  flex-shrink: 0;
}

.perform_info figcaption {
  padding-bottom: .5em;
  order: 1;
}

.perform_flyer figcaption {
  margin-top: .7em;
}

/*
.perform_flyer::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: #9f2560;
  display: inline-block;
  width: 100%;
  padding-top: 141%;
  border-radius: 5px;
}
*/

.platform_dtl {
  display: flex;
  flex-wrap: wrap;
  font-size: 90%;
  width: 100%;
}

div.platform_dtl {
  display: block;
}

.page .platform_dtl dt {
  background-color: transparent;
  width: 7em;
  font-weight: bold;
  padding: .5em;
}

.page .platform_dtl dd {
  width: calc(100% - 7.1em);
  padding: .5em;
}

.contents_wrap .outline h2 {
  font-size: 105%;
  font-weight: bold;
  padding: .3em 0 0 2.3em;
  margin-bottom: 1em;
  background-repeat: no-repeat;
  background-size: 1.8em;
  background-position: left top;
  border-bottom: none;
}

/* レコメンド */
.page .recommend {
  margin-top: 4em;
  padding-top: 6em;
  background: url(../img/line_purple.png) no-repeat top center / auto 11px;
}

.recommend_pu {
  margin-bottom: 3em;
}

.recommend_pu .event_box {
  width: 100%;
  padding: 0 4%;
  margin-bottom: 1em;
  white-space: normal;
  line-height: 1.6;
  font-size: 90%;
}

.recommend_pu .event_box a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-decoration: none;
}

.event_box img {
  width: 69vw;
  border-radius: 25px 0 25px 0;
  margin: 0 auto 10px;
  flex-shrink: 0;
  height: 45vw;
  object-fit: cover;
  object-position: top;
  font-family: 'object-fit: cover;';
}

#event_slide .carousel__prevButton {
  background-image: url(../img/recommend_pu_prev.png);
}
#event_slide .carousel__nextButton {
  background-image: url(../img/recommend_pu_next.png);
}

#event_slide .carousel__prevButton,
#event_slide .carousel__nextButton {
  top: 23vw;
  width: 1.8em;
  height: 1.8em;
  border-radius: 50%;
  text-indent: 5em;
  white-space: nowrap;
  border: 1px solid #222;
  background-color: #fff;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto .8em;
}

#event_slide .carousel__prevButton:disabled,
#event_slide .carousel__nextButton:disabled {
  opacity: .1;
}

#event_slide .carousel__pager button {
  width: .5em;
  height: .5em;
  border-radius: 50%;
  text-indent: 2em;
  white-space: nowrap;
  overflow: hidden;
  background-color: #9f2560;
  border-color: #9f2560;
}

#event_slide .carousel__pager button:not([disabled]) {
  border: 1px solid #222;
  background-color: #fff;
  opacity: 1;
}

.recommend_search_wrap {
  background-color: #f3f0e4;
  background-image: linear-gradient(45deg, #fff 10px, transparent 0), linear-gradient(-45deg, #fff 10px, transparent 0), linear-gradient(135deg, #fff 10px, transparent 0), linear-gradient(-135deg, #fff 10px, transparent 0);
  padding: 1.5em 4%;
}

.recommend_search {
  background-color: #fff;
  padding: 2em 4% 3em;
}

.recommend_search_h2 {
  font-weight: normal;
  font-size: 150%;
  text-align: center;
  color: #9f2560;
  letter-spacing: .2em;
  margin-bottom: 1em;
}

.recommend_search_h3 {
  font-size: 80%;
  margin: 3em 0 1em;
}

.recommend_search form > div{
  height: 3em;
  background-color: #f0f0f0;
  border-radius: 1.5em;
  /* overflow: hidden; */
  padding: 0 2px 0 .5em;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 90%;
}

.recommend_search input[type="text"],
.recommend_search .vdp-datepicker {
  background-color: transparent;
  border: 1px solid #f0f0f0;
  height: 85%;
  width: calc(100% - 6.7em);
  padding: 0;
}

.vdp-datepicker input[type="text"] {
    width: 100%;
    height: 2.8em;
}


.recommend_search input[type="submit"] {
  height: calc(3em - 4px);
  border: none;
  background: url(../img/search_purple.png) no-repeat 1em center / 1em #9f2560;
  border-radius: 1.5em;
  color: #fff;
  font-size: 100%;
  padding: 0 1em 0 2em;
  overflow: hidden;
  width: 5.5em;
  margin: 2px 0;
}

.recom_genre {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.recom_genre li {
  width: 48%;
  margin-bottom: .5em;
}

.recom_genre a {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 80%;
  font-weight: bold;
  text-decoration: none;
  color: #9f2560;
  border: 1px solid #707070;
  border-radius: 5px;
  min-height: 3.5em;
  margin: 0;
}

/* dl内Youtube用 */
.page dd .movie_wrap {
  width: 100%;
  padding-top: 56%;
  position: relative;
}

.page dd .movie_wrap iframe {
  border: none;
  position: absolute;
  top:0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}


/*----------------------------------------------------
 tab表示
------------------------------------------------------*/
@media screen and (min-width:768px) {
  .sns_share {
    flex-wrap: nowrap;
    justify-content: flex-end;
    width: 100%;
  }

  .page .sns_share dt {
    width: 15em;
    text-align: right;
    padding: 5px 1em 0
  }

  .page .sns_share dd {
    width: 90px;
  }

  .ticket_guide {
    width: 100%;
  }

  .recommend {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 2em;
  }

  .recommend > div {
    width: 48%;
  }

  .recommend_pu {
    margin-bottom: 0;
  }

  #event_slide .carousel__prevButton,
  #event_slide .carousel__nextButton,
  #event_slide .carousel__pager {
    display: none;
  }

  #event_slide .event_grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .recommend_pu .event_box {
    width: 48%;
    padding: 0;
    margin-bottom: 2em;
  }

  .event_box img {
    height: 14vw
  }

  .search_list .event_box img {
    height: 20vw
  }

  .menu .event_box img {
    height: 25vw;
  }

}

/*----------------------------------------------------
 pc_min表示
------------------------------------------------------*/
@media screen and (min-width:1024px), print {
  .page .containar p:not([class]) {
    width: 100%
  }

  .overview {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-shrink: 0;
  }

  .page .overview p:not([class]) {
    min-width: calc(100% - 460px);
    /* width: calc(65% - 60px); */
    margin: 0;
  }

  .overview img {
    width: 35%;
    max-width: 400px;
    margin: 0;
  }

  .page .containar dl:not([class]) {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .page .containar dl:not([class]) dt {
    float: left;
    clear: left;
    width: 9.5em;
    padding: .5em 1em;
    margin-bottom: 2px;
  }

  .page .containar dl:not([class]) dd {
    width: calc(100% - 9.5em);
    margin-bottom: 2px;
    padding: .5em 1em;
  }

  .page .table_scroll {
    /* overflow-x: inherit; */
    /* white-space: inherit; */
  }

  /* purple用スタイル */
  .perform_info {
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
  }

  .perform_flyer,
  .perform_info figure {
    width: 35%;
    margin: 0;
    margin-right: 1em;
  }

  .perform_info figure {
    order: 0;
  }

  .perform_info > .platform_dtl {
    width: calc(65% - 60px);
  }

  .recommend > div {
    width: 45%;
  }

  .recommend_search_wrap {
    padding: 1.5em;
  }

  .recom_genre li {
    width: 32%;
  }

  .recommend_pu .event_box {
    width: 46%;
  }

  .event_box img {
    height: 11vw;
  }

  .search_list .event_box img {
    height: 16vw
  }

  .menu .event_box img {
    height: 14vw;
  }
}

/*----------------------------------------------------
 pc表示
------------------------------------------------------*/
@media screen and (min-width:1250px) {
  .event_box img {
    height: 140px;
  }

  .search_list .event_box img {
    height: 200px;
  }

  .menu .event_box img {
    height: 180px;
  }
}