/*	head
============================== */
/*nav_sp*/
#nav_sp {  margin-top: -2.5em;}

/*	footer
============================== */
#bn_sp { padding: 0 0 .5em 0;}

/*	contents
============================== */
#wrap { box-sizing: border-box; width: 90%; max-width: 1080px;  margin: 0 auto; padding: 1em 0;}
#wrap .c_h { font-size: 120%;}
#wrap .c_h::before { content: '─ ';}
#wrap .c_h::after { content: ' ─';}
#wrap .c_dt { font-size: 110%; color: rgba(98, 6, 6, 1); padding: .5em 0 0 0;}
#wrap .c_dt::before { content: '【';}
#wrap .c_dt::after { content: '】';}
#wrap .c_dd { padding: .5em 0 1.5em 1em; line-height: 170%;}
#wrap .sub_dl dt { color: rgba(129, 0, 22, 1); padding-bottom: .2em;}
#wrap .sub_dl dt::before { content: '─ ';}
#wrap .sub_dl dd { line-height: 160%; padding-bottom: 1em;}
#wrap .sub_dl li { list-style-type: disc; margin-left: 2.2em; font-size: 92%; color: rgba(90, 90, 90, 1); line-height: 160%;}
/*_btn*/
.btn_sp { text-align: center;}
.btn_sp a { position: relative; z-index: 100;}
.btn { display: inline-block; color: rgba(255, 255, 255, 1); background-color: rgba(200, 20, 50, 1); border-bottom: 3px solid rgba(54, 23, 21, .05); margin: 0 auto 1em auto;}
.btn:hover { margin-top: 1px; border-bottom: 2px solid rgba(54, 23, 21, .05);}
.btn .txt_all { display: block; padding: 1.2em 6em 1em 2em; font-size: 90%; font-weight: bold; font-weight: 700; letter-spacing: .05em; position: relative;}
.btn .txt_all0 { display: block; padding: 1.2em 2em 1em 2em; font-size: 90%; font-weight: bold; font-weight: 700; letter-spacing: .05em; position: relative;}
.btn .txt_all0::before { content: '\025b6 '; font-size: 50%; position: absolute; top: 40%; left: 1.5em;}
.btn .txt_all::before { content: '\025b6 '; font-size: 50%; position: absolute; top: 30%; left: 1.5em;}
.btn .txt_all::after { content: 'PDF'; display: block; padding: .35em .75em; position: absolute; top: 52%; right: 1em; -webkit-transform: translateY(-50%); transform: translateY(-50%); background: rgba(255, 255, 255, .9); font-weight: bold; font-weight: 700; color: rgba(200, 20, 50, 1); border-radius: 10px;}
/*movie*/
.movie_sp { width: 98%; margin: .5em auto;}
.movie_ssp { width: 80%; margin: .5em auto;}
.movie_sp .caption { text-align: center; padding: .25em 0; font-size: 90%; color: rgba(60, 60, 60, 1);}
.movie { width: 100%; height: 0; padding-top: 56.25%; position: relative; overflow: hidden; z-index: 100; background-color: rgba(0, 0, 0, 1);}
.movie iframe { position:absolute; left:0; top:0; width:100%; height:100%;}
.movie iframe, .movie video, .movie .fp-player, .movie .tbs-player, .movie object { width: 100%; height: 100%; position: absolute; left: 0; top: 0; border: 0;}
/*access*/
#gmap { box-sizing: border-box; width: 100%; height: 0; padding-top: 80%; overflow: hidden; margin: 0 auto 1em auto; border: 1px solid rgba(200, 20, 50, 1); position: relative;}
#gmap iframe { width: 100%; height: 100%; border: 0; position: absolute; left: 0; top: 0;}

/*seat*/
#seat_sp { box-sizing: border-box; width: 100%; margin: 0 auto 1em auto; border: 1px solid rgba(200, 20, 50, 1);}
#seat_sp .img { width: 100%; height: 0; padding-top: 144.444444444444444%; padding-top: -webkit-calc(2600 / 1800 * 100%); padding-top: calc(2600 / 1800 * 100%); background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain; position: relative;}
#seat_sp .img a { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0;}

/*floor*/
#floor_sp { box-sizing: border-box; width: 100%; margin: 0 auto 1em auto; border: 1px solid rgba(200, 20, 50, 1); padding: 0;}
#floor_sp .img { width: 95%; height: 0; padding-top: 123.91304347826087%; padding-top: -webkit-calc(900 / 690 * 95%); padding-top: calc(900 / 690 * 95%); background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain; margin: 0 auto;}
/*for_W640-*/
@media all and (min-width: 640px) {
#floor_sp #slide0, #floor_sp #slide2 { border-right: 1px dashed rgba(120, 120, 120, .25);}
#floor_sp #slide0, #floor_sp #slide1 { border-bottom: 1px dashed rgba(120, 120, 120, .25);}
}

/*qa*/
#qa_sp { box-sizing: border-box; width: 100%; margin: 0 auto 1em auto; border: 1px solid rgba(200, 20, 50, 1);}
#cat_list .c_ul { box-sizing: border-box; width: 100%; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between; padding: 1em;}
#cat_list .c_li { flex-basis: 48%; background: rgba(196, 196, 196, .15); border-radius: 30px; text-align: center; color: rgba(0, 0, 0, .6);}
#cat_list .c_li a { box-sizing: border-box; width: 100%; height: 100%; display: block; padding: .75em 0; border-radius: 30px;}
#cat_list .c_li a:hover { opacity: .8;}
#cat_list .c_li a span { font-size: 100%; font-weight: bold; font-weight: 700; color: rgba(0, 0, 0, .6);}
#n_theater #c_theater, #n_performance #c_performance { background: rgba(200, 20, 50, .15);}
#n_theater #c_theater a, #n_performance #c_performance a { cursor: default; pointer-events: none;}
#n_theater #c_theater a span, #n_performance #c_performance a span { color: rgba(129, 0, 22, 1);}
/*_accordion*/
.accordion { width: 100%; margin: 0 auto;}
.accordion .toggle { display: none;}
.accordion .option { position: relative; margin-bottom: 1em; border-bottom: dashed 1px rgba(200, 20, 50, 1);}
.accordion .option0 { border: 0; margin-bottom: .5em;}
.accordion .title, .accordion .cont { -webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translateZ(0); transition: all 0.3s;}
.accordion .title { padding: 1em 1em 1.5em 1em; display: block; color: rgba(200, 20, 50, 1); font-weight: 400; line-height: 150%;}
.accordion .title:hover { cursor: pointer;}
.accordion .title:after, .accordion .title:before { content: ""; position: absolute; right: 1.25em; top: 1.25em; width: 2px; height: 0.75em; background-color: rgba(200, 20, 50, 1); transition: all 0.3s;}
.accordion .title span { display: block; margin: 0 2em 0 1em; position: relative;}
.accordion .title span::before { content: '・'; position: absolute; top: 0; left: -1em;}
.accordion .title:after { transform: rotate(90deg);}
.accordion .cont { max-height: 0; overflow: hidden;}
.accordion .cont p { margin: 0; padding: 0 1em 1.5em 2em; font-size: 98%; line-height: 160%; letter-spacing: .05em;}
.accordion .cont p a { color: rgba(129, 0, 22, 1);}
.accordion .toggle:checked + .title + .cont { max-height: 400px; transition: all .8s;}
.accordion .toggle:checked + .title:before { transform: rotate(90deg) !important;}

/*archives*/
#archives_sp { box-sizing: border-box; width: 100%; margin: 0 auto 1em auto; border: 1px solid rgba(200, 20, 50, 1);}
#year_list { border-bottom: 1px dashed rgba(200, 20, 50, 1);}
#year_list .y_ul { box-sizing: border-box; width: 100%; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between; padding: 1em;}
#year_list .y_li { flex-basis: 18%; background: rgba(196, 196, 196, .15); border-radius: 30px; text-align: center; color: rgba(0, 0, 0, .6); margin-bottom: .5em;}
#year_list .y_li a { box-sizing: border-box; width: 100%; height: 100%; display: block; padding: .5em 0; border-radius: 30px;}
#year_list .y_li a:hover { opacity: .8;}
#year_list .y_li a span { font-size: 100%; font-weight: bold; font-weight: 700; color: rgba(0, 0, 0, .6);}
#year_list .y_li0 { flex-basis: 18%; background: rgba(196, 196, 196, 0); border-radius: 0; text-align: center; padding: .5em 0; color: rgba(0, 0, 0, .6);}
#year_list .y_li0 span { font-size: 75%; font-weight: 400; letter-spacing: .05em;}
#year_list .y_li0 span::before { content: '─';}
#n2021 #y2021, #n2020 #y2020, #n2019 #y2019, #n2018 #y2018, #n2017 #y2017, #n2016 #y2016, #n2015 #y2015, #n2014 #y2014, #n2013 #y2013, #n2012 #y2012, #n2011 #y2011, #n2010 #y2010, #n2009 #y2009, #n2008 #y2008 { background: rgba(200, 20, 50, .15);}
#n2021 #y2021 a, #n2020 #y2020 a, #n2019 #y2019 a, #n2018 #y2018 a, #n2017 #y2017 a, #n2016 #y2016 a, #n2015 #y2015 a, #n2014 #y2014 a, #n2013 #y2013 a, #n2012 #y2012 a, #n2011 #y2011 a, #n2010 #y2010 a, #n2009 #y2009 a, #n2008 #y2008 a { cursor: default; pointer-events: none;}
#n2021 #y2021 a span, #n2020 #y2020 a span, #n2019 #y2019 a span, #n2018 #y2018 a span, #n2017 #y2017 a span, #n2016 #y2016 a span, #n2015 #y2015 a span, #n2014 #y2014 a span, #n2013 #y2013 a span, #n2012 #y2012 a span, #n2011 #y2011 a span, #n2010 #y2010 a span, #n2009 #y2009 a span, #n2008 #y2008 a span { color: rgba(129, 0, 22, 1);}
#archive_list { box-sizing: border-box; width: 100%; padding: .5em 1em 1.5em 1em; margin: 0 auto;}
#archive_list li { padding-top: 1em;}
#archive_list li:before, #archive_list li:after { content: ""; content: none; display: table;}
#archive_list li:after { clear: both; }
#archive_list li::after { content: ""; display: block; clear: both;}
#archive_list li .aimgall { box-sizing: border-box; width: 25%; float: left; border: 1px solid rgba(112, 112, 112, .5); padding: .2em;}
#archive_list li .aimgall .aimgsp { width: 100%; height: 0; padding-top: 140%; background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain;}
#archive_list li .atxtsp { width: 72%; float: right;}
#archive_list li .atxtsp .atitle { color: rgba(200, 20, 50, 1); font-weight: bold; font-weight: 700; letter-spacing: .05em; line-height: 140%;}
#archive_list li .atxtsp .aperiod { font-size: 85%; letter-spacing: .05em; padding-top: 1em; line-height: 140%;}
/*for_W640-*/
@media all and (min-width: 640px) {
#archive_list ul { display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between;}
#archive_list li { flex-basis: 45%; margin: 0 1% 0 3.5%;}
#archive_list li .atxtsp .atitle { font-size: 80%;}
#archive_list li .atxtsp .aperiod { font-size: 65%; padding-top: .8em;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#archive_list li .atxtsp .atitle { font-size: 85%;}
#archive_list li .atxtsp .aperiod { font-size: 70%; padding-top: .8em;}
}
/*for_W1000-*/
@media all and (min-width: 1000px) {
#archive_list li .atxtsp .atitle { font-size: 100%;}
#archive_list li .atxtsp .aperiod { font-size: 85%; padding-top: 1em;}
}

/*barrier-free*/
#bf_sp { box-sizing: border-box; width: 100%; margin: 0 auto 1em auto; border: 1px solid rgba(200, 20, 50, 1); padding: 1em;}
#bf_sp .mg1ul { margin: 1em 0; text-align: center; font-size: 95%;}
#bf_sp .mg1ul a:hover {color: rgba(255, 55, 110, 1);}
#bf_sp .maru { max-width: 340px; display: block; padding: .75em 1em; background-color: rgba(200, 20, 50, .1); border-radius: 30px; font-weight: bold; font-weight: 700; color: rgba(129, 0, 22, 1); margin: .5em auto; font-size: 105%;}
#bf_sp .udl_red { border-bottom: 2px dashed rgba(200, 20, 50, 1); padding: 2em 0; margin-bottom: 2em;}
#bf_sp .c_dt { font-weight: bold; text-align: center;}
#bf_sp .c_dd { padding: .5em 0 1.5em 0; line-height: 170%;}
#bf_sp .c_dd .pdlr1 { padding: 0 1em;}
#bf_sp .c_dd .sub_dt { font-weight: bold; padding-bottom: .25em; color: rgba(119, 0, 12, 1);}
#bf_sp .c_dd a { color: rgba(0, 80, 255, 1); position: relative; z-index: 100;}
#bf_sp .c_dd li a { color: rgba(129, 0, 22, 1); position: relative; z-index: 100;}
#bf_sp .c_dd a:hover { color: rgba(255, 55, 110, 1);}
.bf_icon-sp { width: 50px; height: 50px; border-radius: 100px; position: relative; border: 2px dashed rgba(0, 80, 255, 1);}
.bf_icon { width: 46px; height: 46px; background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain; background-image: url(../bf/img/wheelchair_icon.png); position: absolute; top: 2px; left: 2px;}
.bt_bfindex a { display: inline-block; padding: 1em; margin: 0 auto 1em auto; background-color: rgba(200, 20, 50, 1); font-weight: bold; position: relative; z-index: 100; color: rgba(255, 255, 255, 1);}
.bt_bfindex a:hover { color: rgba(255, 240, 0, 1);}

.bf_pall .caption { text-align: center; padding: .25em 0; font-size: 90%; color: rgba(60, 60, 60, 1);}
.bf_pset { width: 100%; margin: 0 auto; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center;}
.bf_pset .bf_p-sp { width: 48%; flex-basis: 48%; margin: .5em .9% 0 .9%;}

.mimiset { display: inline-block; margin: .5em auto 0 auto;}
.mimiset:before, .mimiset:after { content: ""; content: none; display: table;}
.mimiset:after { clear: both; }
.mimiset::after { content: ""; display: block; clear: both;}
.mimi_p-sp { width: 32%; float: right;}
.mimi_p { width: 100%; height: 0; padding-top: 153.84615385%; padding-top: -webkit-calc(1000 / 650 * 100%); padding-top: calc(1000 / 650 * 100%); background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain;}
.mimi_p-txt { width: 67%; float: left; padding-top: 1em;}

.bf_cmb100-sp { width: 100%; margin: .5em auto 0 auto;}
.bf_cmb90-sp { width: 90%; margin: .5em auto 0 auto;}
.bf_cmb80-sp { width: 80%; margin: .5em auto 0 auto;}
.bf_cmb70-sp { width: 70%; margin: .5em auto 0 auto;}

.bf_cmb70 { width: 100%; height: 0; padding-top: 70%; padding-top: -webkit-calc(700 / 1000 * 100%); padding-top: calc(700 / 1000 * 100%); background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain;}
.bf_cmb72 { width: 100%; height: 0; padding-top: 72%; padding-top: -webkit-calc(720 / 1000 * 100%); padding-top: calc(720 / 1000 * 100%); background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain;}
.bf_cmb35 { width: 100%; height: 0; padding-top: 35.25264395%; padding-top: -webkit-calc(600 / 1702 * 100%); padding-top: calc(600 / 1702 * 100%); background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain;}

.bf_single { width: 60%; margin: .5em auto 0 auto;}
.bf_p { width: 100%; height: 0; padding-top: 100%; background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain;}

.more_info { box-sizing: border-box; width: 98%; margin: 1em auto; padding: 1em; background-color: rgba(129, 0, 22, .05); font-size: 95%; color: rgba(119, 0, 12, 1);}
.more_info dt { color: rgba(149, 20, 42, 1); font-size: 115%; font-weight: bold; text-align: center;}
.more_info dt::before { content: '《';}
.more_info dt::after { content: '》';}
.disc_ul { margin: .5em; font-size: 96%;}
.disc_ul li { list-style: disc; margin-left: 1em; text-align: left; line-height: 130%; padding-bottom: .5em;}
.more_info li { list-style: disc; margin-left: 1em; text-align: left; line-height: 140%; padding-bottom: .5em; color: rgba(119, 0, 12, 1);}
.more_info li ul li { list-style: circle; margin-left: 2em; text-align: left; color: rgba(100, 5, 60, 1); line-height: 150%; width: 90%;}
.kome0 { margin: 0 0 0 1.5em; font-size: 85%;}
.kome { margin: .5em 0 1em 0;}
.kome li { font-size: 85%; line-height: 140%;}
.kome li::before { content: '※ ';}
.telnb { color: rgba(0, 0, 0, 1); position: relative; z-index: 100; font-size: 110%; font-weight: bold;}
.more_info a { color: rgba(109, 0, 2, 1);}
.more_info .action_sp { box-sizing: border-box; width: 100%; margin: 0 auto; background-color: rgba(255, 255, 255, 1); padding: 1em;}
.more_info .action_sp a { color: rgba(0, 80, 255, 1); font-size: 110%; position: relative; z-index: 100;}
.bficon_set { display: inline-block; margin: 0 auto; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center;}
.bficon_set .bf_icon-sp { display: inline-block;}
.bficon_set .bf_icon-txt { display: inline-block; font-weight: bold; padding-left: 1em; font-size: 120%; color: rgba(0, 80, 255, 1);}
#bf_sp .btn { display: inline-block; color: rgba(255, 255, 255, 1); background-color: rgba(200, 20, 50, 1); border-bottom: 3px solid rgba(54, 23, 21, .05); margin: 0 auto 1em auto; font-size: 90%;}
#bf_sp .btn .txt_all { display: block; padding: 1em 6em .75em 2em;}
#bf_sp .btn .txt_all::after { content: 'PDF'; display: block; padding: .15em .55em;}
#bf_sp .tlt_tablr { width: 100%; margin: .5em auto; border-collapse: collapse;}
#bf_sp .tlt_tablr th, #bf_sp .tlt_tablr td { border: solid 1px rgba(200, 20, 50, .25); padding: 1em .25em; text-align: center; font-weight: bold; white-space: nowrap;}
#bf_sp .tlt_tablr th { background-color: rgba(200, 20, 50, .1); color: rgba(200, 20, 50, 1); font-size: 85%;}
#bf_sp .tlt_tablr td { font-size: 90%;}
/*for_W640-*/
@media all and (min-width: 640px) {
#bf_sp a { max-width: 480px;}
#bf_sp .c_dd { padding: .5em .5em 1.5em .5em; line-height: 170%;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#bf_sp .maru { max-width: 460px;}
.telnb { color: rgba(149, 20, 42, 1); font-size: 100%; cursor: default; pointer-events: none;}
#bf_sp .c_dd { padding: .5em 1em 1.5em 1em; line-height: 170%;}
#bf_sp .c_dd .pdlr1 { text-align: center;}
}
/*for_W1000-*/
@media all and (min-width: 1000px) {
#bf_sp .c_dd { padding: .5em 2em 1.5em 2em; line-height: 170%;}
}