@charset "UTF-8";
html {
  font-size: 62.5%;
  line-height: 1;
}
ul, li, dl, dt, dd {
  list-style: none;
  margin: 0;
  padding: 0;
}
body {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 1.4em;
  padding: 0;
  margin: 0;
  color: #170808;
  line-height: 1.8;
  font-weight: 400;
  background-color: #FCFCFC;
}
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
.mb10 {
  margin-bottom: 10px;
}
.mb20 {
  margin-bottom: 20px;
}
.mb30 {
  margin-bottom: 30px;
}
.mb40 {
  margin-bottom: 40px;
}
.mb50 {
  margin-bottom: 50px;
}
.center {
    text-align: center;
}
.pc {
  display: block !important;
}
.sp {
  display: none !important;
}
a {
  color: #FE47BE;
  text-decoration: underline;
}
a:hover {
  color: #CF399A;
}
a img:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha( opacity=80 )";
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
#top {
  text-align: center;
  background-image: url(../images/top_back.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding-top: 20px;
}
#top h1 {
  margin: 0;
  padding: 0;
  line-height: 0;
  /* [disabled]width: 80%; */
  text-align: center;
}
#top .inner {
  /* [disabled]display: flex; */
  padding-top: 20px;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  position: relative;
}
#top #top_nav {
  width: 100%;
  padding: 10px 0;
  position: fixed;
  top: 0px;
  margin: 0 auto;
  right: 0px;
  display: block;
  background-color: #F8F8F8;
  left: 0px;
  z-index: 99;
  -webkit-box-shadow: 0px 0px 4px hsla(0, 15%, 82%, 0.80);
  box-shadow: 0px 0px 4px hsla(0, 15%, 82%, 0.80);
}
#top #top_nav ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-start;
    margin: 0 auto;
    max-width: 1000px;
}
#top #top_nav li {
    width: 18%;
}
#top #top_nav li:nth-child(6), #top #top_nav li:last-child {
    border-bottom-width: 0;
    margin: 0;
    display: inline-block;
    width: 5%;
}
#top #top_nav li:nth-child(6) a {
  padding: 0 10px;
  font-size: 3rem;
  color: #00acee;
}
#top #top_nav li:last-child a {
  padding: 0 10px;
  font-size: 3rem;
  color: #3B5998;
}
#top #top_nav a {
    text-decoration: none;
    color: #170808;
    font-size: 1.8rem;
    line-height: 1.5;
    font-weight: bold;
    display: block;
}
#top #top_nav a:hover {
  color: #E247AD;
}
#top #top_nav a span {
  font-size: 1.4rem;
  display: block;
  line-height: 1;
  color: #E247AD;
}
.title {
  text-align: center;
  position: relative;
  display: block;
  margin: 1.5em auto;
  padding: 7px 10px;
  max-width: 800px;
  color: #170808;
  background-color: #F8F8F8;
  border: solid 4px #170808;
  box-sizing: border-box;
}
.title:before {
  content: "";
  position: absolute;
  bottom: -23px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #F8F8F8;
  z-index: 2;
}
.title:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #170808;
  z-index: 1;
  4
}
.inner {
  width: 95%;
  margin: 0 auto;
  max-width: 1000px;
}
section .inner {
  padding: 50px 0;
}
a i {
  padding: 0 3px;
}
#about {
    /* [disabled]color: #F8F8F8; */
    background-image: url(../images/about_bg.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    background-color: hsla(0,0%,100%,1.00);
    background-attachment: fixed;
}
#about .txt_box {
    text-align: center;
    background-color: hsla(0,0%,97%,0.60);
    padding: 15px;
    color: #170808;
    border-radius: 10px;
    line-height: 2;
    margin: 0 auto 50px;
    max-width: 800px;
}
.qa_wrap *, .qa_wrap *:after, .qa_wrap *:before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.qa_wrap dt {
    position: relative;
    margin: 0 0 1.5em 0;
    font-weight: bold;
    padding-left: 3rem;
    text-indent: -3rem;
}
.qa_wrap dd {
    position: relative;
    margin: 0 0 2em 0;
    padding: 0 0 1.5em 2em;
    border-bottom: 1px dotted #F8F8F8;
    /* [disabled]color: #E85298; */
}
.qa_wrap dt::before, .cp_qa dd::before {
    font-size: 1.2em;
    /* [disabled]margin: 0 0.5em 0 0; */
    color: #F8F8F8;
    /* [disabled]display: inline-block; */
    /* [disabled]width: 1.3em; */
    /* [disabled]height: 1.3em; */
    border-radius: 5px;
    line-height: 1.2em;
}
.qa_wrap dt::before {
    padding: 0.1rem 0.3rem;
    content: 'Q';
    background-color: #170808;
    margin-right: 1rem;
}
.youtube {
    position: relative;
    width: 100%;
    margin: 0 auto 50px;
    padding-top: 56.25%;
}
.youtube iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
#schedule ,#tour{
    background-color: #E147AE;
}
#schedule h2 {
  text-align: center;
}
#schedule .sch_wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: space-between;
}
#schedule .sch_box {
  width: 49%;
  background-color: #F8F8F8;
  margin-bottom: 20px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border: 3px solid #170808;
}
#schedule .sch_box h3 {
  background-color: #170808;
  color: #F8F8F8;
  margin: 0 auto;
  padding: 5px;
  text-align: center;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  font-size: 1.8rem;
}
#schedule .sch_box dl {
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
}
#cast .member_box dl {
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
}
#schedule .sch_box dl dt {
  background-color: #E147AD;
  color: #F8F8F8;
  width: 20%;
  text-align: center;
  border-radius: 5px;
  padding: 5px;
  margin-bottom: 10px;
  font-weight: bold;
}
#cast .member_box dl dt {
  background-color: #E147AD;
  color: #F8F8F8;
  width: 20%;
  text-align: center;
  border-radius: 5px;
  padding: 5px;
  margin-bottom: 10px;
  font-weight: bold;
}
#schedule .sch_box dl dd {
  width: 78%;
}
#cast .member_box dl dd {
  width: 78%;
}
#cast {
    background-color: #FFE102;
    /* [disabled]color: #F8F8F8; */
}
#cast .guest_box {
  text-align: center;
}
#cast .member {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-between;
    margin-bottom: 50px;
}
#cast .member .member_box {
    width: 49%;
    background-color: #F8F8F8;
    margin-bottom: 20px;
    border-top-left-radius: 15px;
    border: 3px solid #170808;
    border-top-right-radius: 15px;
}
#cast .member_box h3 {
    background-color: #170808;
    margin: 0 auto;
    padding: 5px;
    color: #F8F8F8;
    text-align: center;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    font-size: 1.8rem;
}
#about h2 ,#cast h2{
    color: #170808;
    display: inline-block;
    border-bottom: 4px solid #170808;
    text-align: center;
    margin-bottom: 30px;
}
#cast .cast_list {
    font-size: 1.6rem;
    text-align: center;
    margin: 0 auto 50px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
#cast .cast_list li {
    padding: 10px;
    display: inline-block;
    width: 33.3%;
}
#cast .cast_list li:first-child {
    width: 100%;
}
#ticket {
  background-color: #201212;
}
#ticket p {
  text-align: center;
  color: #F8F8F8;
}
#ticket .ticket_wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: space-between;
}
#ticket .ticket_box {
  width: 49%;
  background-color: #F8F8F8;
  margin-bottom: 20px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border: 3px solid #F8F8F8;
}
#ticket .ticket_box h3 {
  background-color: #E247AD;
  margin: 0 auto;
  padding: 5px;
  color: #F8F8F8;
  text-align: center;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  font-size: 1.8rem;
}
#ticket .ticket_box dl {
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
}
#ticket .ticket_box dl dt {
  background-color: #170808;
  color: #F8F8F8;
  width: 25%;
  border-radius: 5px;
  padding: 5px;
  text-align: center;
  margin-bottom: 10px;
  font-weight: bold;
}
#ticket .ticket_box dl dd {
  width: 72%;
}
#ticket .ticket_box .btn a {
  display: block;
  text-align: center;
  background-color: #ffe102;
  color: #170808;
  padding: 10px 5px;
  text-decoration: none;
  margin: 0 auto 10px;
  border-radius: 5px;
  width: 80%;
  -webkit-box-shadow: 0px 3px #B2980C;
  box-shadow: 0px 3px #B2980C;
}
#ticket .ticket_box .btn a:hover {
  background-color: #FFEC66;
}
#support {
    background-color: #fff;
}
#tour .tour_box {
    padding: 10px;
    background-color: #F8F8F8;
    text-align: center;
}
#tour .btn a  {
    display: block;
    text-align: center;
    background-color: #ffe102;
    padding: 20px 5px;
    color: #170808;
    margin: 0 auto 10px;
    border-radius: 5px;
    text-decoration: none;
    width: 80%;
    -webkit-box-shadow: 0px 3px #B2980C;
    box-shadow: 0px 3px #B2980C;
    max-width: 500px;
}
#tour .btn a:hover {
  background-color: #FFEC66;
}
#tour .tour_box table {
    width: 100%;
    margin: 0 auto 30px;
    max-width: 500px;
    border-collapse: collapse;
}
#tour .tour_box table th {
    text-align: left;
    vertical-align: middle;
    padding: 5px;
    border-bottom: 1px solid #6F6A6A;
    color: #E148AE;
}
#tour .tour_box table td {
    vertical-align: middle;
    padding: 5px;
    border-bottom: 1px solid #6F6A6A;
    text-align: left;
}
.foot_logo {
    text-align: center;
}
.foot_logo li {
    display: inline-block;
}
footer {
  font-size: 1.2rem;
  text-align: center;
  background-color: #FFE102;
}
footer p {
  padding: 10px;
  margin: 0;
}
#pagetop {
  position: fixed;
  right: 5px;
  bottom: 15px;
  font-size: 50px;
  margin: 0;
  line-height: 1;
}
@media screen and (max-width:768px) {
  .sp {
    display: block !important;
  }
  .pc {
    display: none !important;
  }
  #nav-toggle {
    display: block;
    overflow: hidden;
    float: none;
    width: 65px;
    height: 65px;
    position: absolute;
    right: 12px;
    top: 12px;
    z-index: 100;
    border-radius: 50%;
    border: 1px solid #231815;
    background-color: #F8F8F8;
  }
  #nav-toggle span {
    width: 34px;
    height: 4px;
    display: block;
    background-color: #231815;
    position: absolute;
    left: 50%;
    top: 49%;
    margin-left: -17px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  #nav-toggle .top {
    -webkit-transform: translateY(-11px);
    -ms-transform: translateY(-11px);
    transform: translateY(-11px);
  }
  #nav-toggle .bottom {
    -webkit-transform: translateY(11px);
    -ms-transform: translateY(11px);
    transform: translateY(11px);
  }
  .open #nav-toggle .middle {
    background: rgba(255, 255, 255, 0);
  }
  .open #nav-toggle .top {
    -webkit-transform: rotate(-45deg) translateY(0px);
    -ms-transform: rotate(-45deg) translateY(0px);
    transform: rotate(-45deg) translateY(0px);
    p
  }
  .open #nav-toggle .bottom {
    -webkit-transform: rotate(45deg) translateY(0px);
    -ms-transform: rotate(45deg) translateY(0px);
    transform: rotate(45deg) translateY(0px);
  }
#top #top_nav li:nth-child(6), #top #top_nav li:last-child{
    text-align: center;
    width: 20%;
    }
  #top #top_nav {
    width: 100%;
    position: fixed;
    border-width: 0;
    -webkit-box-shadow: 0px 0px 0px 0px;
    box-shadow: 0px 0px 0px 0px;
    margin: 0;
    padding: 0;
    /* [disabled]max-width: 768px; */
  }
  .nav_inner {
    position: relative;
    display: block;
    height: auto;
    clear: none;
    top: 0px;
    right: 0px;
    z-index: 100;
  }
  #top #top_nav ul {
    background-color: hsla(0, 0%, 97%, 0.90);
    position: absolute;
    /* 開いてないときは画面外に配置 */
    top: -540px;
    width: 100%;
    text-align: center;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    z-index: -1;
    display: block;
  }
  #top #top_nav.open ul {
    /* #global-nav top + #mobile-head height */
    -moz-transform: translateY(540px);
    -webkit-transform: translateY(540px);
    transform: translateY(540px);
    z-index: 99;
    padding: 90px 10px 10px;
    /* [disabled]flex-wrap: wrap;
*/
    display: block;
  }
  #top #top_nav li {
    width: 100%;
    margin-bottom: 5px;
    padding-bottom: 5px;
    border-bottom: 1px dotted #E247AD;
  }
  #top .inner {
    display: block;
    padding: 0;
    position: relative;
    width: auto;
  }
  .title {
    font-size: 2.2rem;
  }
#about {
    background-attachment: scroll;
    background-size: contain;
}
  #schedule .sch_box {
    width: 100%;
    margin-bottom: 20px;
  }
#cast .member .member_box {
    width: 100%;
    margin-bottom: 20px;
    flex-wrap: wrap;
  }
  #schedule .sch_box dl dt {
    width: 100%;
    padding: 0 5px;
    text-align: left;
    margin-bottom: 10px;
  }
#cast .member_box dl dt {
    width: 100%;
    padding: 0 5px;
    text-align: left;
    margin-bottom: 10px;
  }
  #schedule .sch_box dl dd {
    width: 100%;
    margin-bottom: 20px;
  }
#cast .member_box dl dd {
    width: 100%;
    margin-bottom: 20px;
  }
  #cast .cast_list li {
    width: 49%;
  }
  #ticket .ticket_box {
    width: 100%;
  }
  #ticket .ticket_box dl dt {
    width: 100%;
    padding: 0 5px;
    text-align: left;
  }
  #ticket .ticket_box dl dd {
    margin-bottom: 20px;
    width: 100%;
  }
  #ticket .ticket_box .btn a {
    margin-bottom: 30px;
  }
#about .txt_box {
    text-align: justify;
    background-color: hsla(0,0%,97%,0.60);
    border-radius: 10px;
}
}