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

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400&family=Noto+Serif+JP:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=The+Nautigal:wght@400;700&display=swap');
/* ======================================================================================

    reset

====================================================================================== */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, figure { margin: 0; padding: 0; border: 0; outline: 0; box-sizing: border-box;}
body, table, input, textarea, select, option { font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif; }
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } ol, ul { list-style: none; } blockquote, q { quotes: none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; }

img{vertical-align:middle; width:100%; height:auto;}

html,body{height: 100%;}

body{
position: relative;
font-size:16px;
font-family: 'Noto Sans JP', "sans-serif";
font-weight: 300;
background: #fff;
}

a,a img,a:hover img,li,li:hover,a::after,a:hover::after,a::before,a:hover::before,input,input:hover{-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;}

a:link {text-decoration:underline; color:#fff;}
a:visited {text-decoration:underline; color:#fff;}
a:hover{opacity: .8;}

a:hover img{opacity:0.8;;}

p{margin:0; padding:0;}

h1,h2,h3,h4,h5{font-weight:normal; margin:0; padding:0; position: relative; width: 100%;}

td,li,dt,dd{position: relative;}

/* ======================================================================================

    common

====================================================================================== */

.inner{margin:0 auto; position:relative; max-width:1340px; padding:0 20px;}

table{border-collapse:collapse; width:100%;}
td{padding: 5px; border: #fff solid 1px;}
td.title{width:20%;}
td.title2{width:30%;}


@media only screen and (max-width:840px) {
td.title{width: 10%;}
td.title2{width:20%;}
.SPblock{display: block;}
}



.ul_num li{ list-style: decimal; margin-left: 20px;}

.ul01 li{padding: 5px 0 5px 15px; position: relative;}
.ul01 li::before{position: absolute; content: ''; border-radius:100%; top: 1em; left: .5em; z-index: 2; width: 3px; height: 3px; background: rgba(95, 0, 0, 1);}

.ul_memo li{margin-left: 20px; font-size: 80%; padding: 5px 0; position: relative;}
.ul_memo li::before{content: '※'; position: absolute; top: 5px; left: -15px;}

.dl01 dt{margin: 20px 0 5px 0; color:#5d6a94; text-shadow: 1px 1px #fff, 2px 2px rgba(0, 0, 0, 0.2); font-size: 120%;}
.dl01 dd{margin:0 0 5px 5px;}

.box01{border:#ccc solid 1px; margin-bottom:20px; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; padding:15px; overflow:hidden; position: relative; background: #fff;}


/* == section == */

section{position:relative;}
section .inner{position:relative; padding-top: 60px; padding-bottom: 60px;}
article{margin-bottom: 40px; position: relative;}


/* == heading == */

.heading1{font-size:2rem; margin-bottom: 40px; font-weight: 100; color: #4F4F4F;}
.heading1 span.Sub{font-size:80%; display: block;}

.heading2{font-size:1.4rem; font-weight: 300; margin-bottom: 40px; color: #986185;}


span.headingDeco1{display: inline-block; position: relative; padding-left: 100px; padding-right: 100px;}
span.headingDeco1::before{content: ''; background: url("../img/icon.svg") center center no-repeat; background-size: 75px; top:50% ; left: 0; width: 100px; height: 100%; position: absolute; transform: translate(0,-50%) rotate(-90deg);}
span.headingDeco1::after{content: ''; background: url("../img/icon.svg") center center no-repeat; background-size: 75px; top:50% ; right: 0; width: 100px; height: 100%; position: absolute; transform: translate(0,-50%) rotate(90deg);}

span.headingDeco2{display: inline-block; position: relative;}
span.headingDeco2::before{content: ''; background: url("../img/bar_heading3.svg") center center no-repeat; background-size: 10px; top:0 ; left: -50px; width: 10px; height: 100%; position: absolute;}
span.headingDeco2::after{content: ''; background: url("../img/bar_heading3.svg") center center no-repeat; background-size: 10px; top:0 ; right: -50px; width: 10px; height: 100%; position: absolute;}

@media only screen and (max-width:840px) {
.heading1{font-size:1.2rem; margin-bottom: 40px;}
span.headingDeco1{padding-left: 50px; padding-right: 50px;}
span.headingDeco1::before{background-size: 45px; width: 50px;}
span.headingDeco1::after{background-size: 45px; width: 50px;}
}

.SiteDescription{text-align: center; padding: 10px 20px; font-size: 1.4rem; color: #fff100;}
.SiteDescription .SPblock{padding: 0 5px;}


#header{width: 100%; background: #fff; border-top: #ECC7D9 solid 5px;}
#header{text-align: center; color: #777777; font-weight: 400; padding: 5px 0; font-size: 1rem;}

section.MainVisual{background: #000;}
section.MainVisual .inner{padding-top: 0; padding-bottom: 0; overflow: hidden;}
section.MainVisual img{max-width: 500px;}
section.MainVisual h1{position: absolute; top: 50%; right: 40px; color: #fff; transform: translate(0,-50%) rotate(-10deg); text-align: center; width: 50%; font-family: 'The Nautigal', cursive; font-size: 8rem; text-shadow: 0 -20px 100px, 0 0 2px, 0 0 .5em #d200bc, 0 0 0.2em #d200bc, 0 0 0.1em #d200bc, 0 5px 3px #000;}
section.MainVisual h1 span.Sub{font-size: 2rem; display: block; font-family: 'Noto Sans JP', "sans-serif"; font-weight: 300;}

@media only screen and (max-width:840px) {
#header{font-size: .8rem;}
section.MainVisual img{max-width: 300px;}
section.MainVisual h1{font-size: 4rem;}
section.MainVisual h1 span.Sub{font-size: 1.2rem;}
}

@media only screen and (max-width:540px) {
section.MainVisual img{max-width: 200px;}
section.MainVisual h1{font-size: 3rem;}
section.MainVisual h1 span.Sub{font-size: 1rem;}
}


section.details1{text-align: center; letter-spacing: 2px;}
section.details1 .inner{padding-top: 150px;}
.hr1{position: relative; padding: 40px 0; border: 0;}
.hr1::after{position: absolute; width: 80%; top: 50%; left: 50%; transform: translate(-50%,-50%); border-bottom: #fff dotted 1px; height: 1px; content: "";}


section.details2{text-align: center; letter-spacing: 2px;}
section.details2 li{margin-bottom: 30px;}
section.details2 li:last-child{margin-bottom: 0px;}
section.details2 li span.Sub{display: block; font-size: 80%;}
/* == footer == */


#footer{background: #040000; position: relative;}
#footer .inner{padding-top: 10px; padding-bottom: 10px;}

#footer ul{display: flex; flex-wrap: wrap; justify-content: center;}
#footer li{margin: 0 20px; text-align: center;}

@media only screen and (max-width:840px) {
#footer li{margin-bottom: 10px; width: 100%;}
#footer li:last-child{margin-bottom: 0px;}
}

.copy{text-align:center; font-size:.7rem; color: #fff; background: rgba(0,0,0,.7);}


/* ======================================================================================

    form

====================================================================================== */


input,textarea {margin:0; padding:10px; width:100%; background:#fff; border:#999 solid 1px; border-radius:5px; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box;}

.textarea_h{min-height:250px;}

.bt_submit{height:70px; background:#b25d54; color:#FFF; font-size:18px; border-radius:50px;}
.bt_submit:hover{background:#963329;}

.none-border{border:#999 solid 0px;}

.checkbox-wrap{}
.label-checkbox input[type="checkbox"]{display: none;}
.label-checkbox{cursor: pointer;position: relative;}
.label-checkbox .lever{
  display: block;
  color: #979797;
  font-weight: normal;
  display: inline-block;
  padding: 8px 40px;
  border: 1px solid #979797;
  border-radius:20px;
  margin-right: 10px;
  margin-bottom: 10px;
  -webkit-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-checkbox .lever:before{
  content:'';
  position: absolute;
  left: 10px;
  top:-3px;
  border: 1px solid #979797;
  background: #fff;
  width: 20px;
  height: 20px;
  border-radius:100%;
  -webkit-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-checkbox:hover .lever:before{border-color: #c51315;}
.label-checkbox input[type="checkbox"]:checked + .lever{background: #c51315;color: #fff;}
.label-checkbox input[type="checkbox"]:checked + .lever{border-color:#c51315;}
.label-checkbox input[type="checkbox"]:checked + .lever:before{left:100%; margin-left: -44px; border-color: #fff;}

.radio-wrap{}
.label-radio input[type="radio"]{display: none;}
.label-radio{cursor: pointer; color: #828c9a; font-weight: normal;
  letter-spacing: 0;
  display: inline-block;
  position: relative;
  margin-right: 20px;
}
.label-radio .lever:before{
  content:'';
  border: 1px solid #ddd;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  display: inline-block;
  vertical-align: middle;
  border-radius:10px;
  -webkit-transition: all 800ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 800ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 800ms cubic-bezier(1, 0, 0, 1);
  transition: all 800ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-radio input[type="radio"]:checked + .lever:before{
  opacity: 0;
  background: #eee;
  border-color: #eee;
  transform:scale(2);
}
.label-radio .lever:after{
  content:'';
  opacity: 0;
  position: absolute;
  left: 8px;
  top: 0px;
  width:8px;
  height: 16px;
  border-right: 2px solid #ddd;
  border-bottom: 2px solid #ddd;
  transform:rotate(-200deg);
  -webkit-transition: all 400ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 400ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 400ms cubic-bezier(1, 0, 0, 1);
  transition: all 400ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-radio input[type="radio"]:checked + .lever:after{
  opacity: 1;
  position: absolute;
  left: 8px;
  top: 0px;
  width:8px;
  height: 16px;
  border-right: 2px solid #5bc0de;
  border-bottom: 2px solid #5bc0de;
  transform:rotate(40deg);
}



.formtitle{position:relative; padding:0 0 0 10px; font-size: 1.2rem; margin-bottom: 5px;}
.formtitle::after{position: absolute; z-index: 2; content: ''; border: 1px solid #fff; border-radius: 100%; top:.7em; left:0em; width:5px; height:5px;}
.formtitle span{background:rgba(200, 80, 0, 1); color:#fff; padding:2px 4px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; font-size:50%; margin-left:10px;}

.formarea{background: #FFFFFF; padding: 30px;}


/* ======================================================================================

    other

====================================================================================== */


@media only screen and (min-width:841px) {
	
.pc{display:block;}
.sp{display:none;}


.res10{width:10%;}
.res11{width:11%;}
.res12{width:12%;}
.res13{width:13%;}
.res14{width:14%;}
.res15{width:15%;}
.res16{width:16%;}
.res17{width:17%;}
.res18{width:18%;}
.res19{width:19%;}
.res20{width:20%;}
.res21{width:21%;}
.res22{width:22%;}
.res23{width:23%;}
.res24{width:24%;}
.res25{width:25%;}
.res26{width:26%;}
.res27{width:27%;}
.res28{width:28%;}
.res29{width:29%;}
.res30{width:30%;}
.res31{width:31%;}
.res32{width:32%;}
.res33{width:33%;}
.res34{width:34%;}
.res35{width:35%;}
.res36{width:36%;}
.res37{width:37%;}
.res38{width:38%;}
.res39{width:39%;}
.res40{width:40%;}
.res41{width:41%;}
.res42{width:42%;}
.res43{width:43%;}
.res44{width:44%;}
.res45{width:45%;}
.res46{width:46%;}
.res47{width:47%;}
.res48{width:48%;}
.res49{width:49%;}
.res50{width:50%;}
.res51{width:51%;}
.res52{width:52%;}
.res53{width:53%;}
.res54{width:54%;}
.res55{width:55%;}
.res56{width:56%;}
.res57{width:57%;}
.res58{width:58%;}
.res59{width:59%;}
.res60{width:60%;}
.res61{width:61%;}
.res62{width:62%;}
.res63{width:63%;}
.res65{width:65%;}
.res66{width:66%;}
.res67{width:67%;}
.res68{width:68%;}
.res69{width:69%;}
.res70{width:70%;}
.res71{width:71%;}
.res72{width:72%;}
.res73{width:73%;}
.res74{width:74%;}
.res75{width:75%;}
.res76{width:76%;}
.res77{width:77%;}
.res78{width:78%;}
.res79{width:79%;}
.res80{width:80%;}
.res81{width:81%;}
.res82{width:82%;}
.res83{width:83%;}
.res84{width:84%;}
.res85{width:85%;}
.res86{width:86%;}
.res87{width:87%;}
.res88{width:88%;}
.res89{width:89%;}
.res90{width:90%;}
}



@media only screen and (max-width:840px) {
	
.pc{display:none;}
.sp{display:block;}

.res10,.res11,.res12,.res13,.res14,.res15,.res16,.res17,.res18,.res19,.res20,.res21,.res22,.res23,.res24,.res25,.res26,.res27,.res28,.res29,.res30,.res31,.res32,.res33,.res34,.res35,.res36,.res37,.res38,.res39,.res40,.res41,.res42,.res43,.res44,.res45,.res46,.res47,.res48,.res49,.res50,.res51,.res52,.res53,.res54,.res55,.res56,.res57,.res58,.res59,.res60,.res61,.res62,.res63,.res64,.res65,.res66,.res67,.res68,.res69,.res70,.res71,.res72,.res73,.res74,.res75,.res76,.res77,.res78,.res79,.res80,.res81,.res82,.res83,.res84,.res85,.res86,.res87,.res88,.res89,.res90{width:100%; margin-bottom:10px;}

}



/*--------共通--------*/


.photo_l{float:left; margin:0 10px 10px 0;}
.photo_r{float:right; margin:0 0px 10px 10px;}

.box_l{float:left;}
.box_r{float:right;}
.box_c{margin:0 auto;}

.txt_r{text-align:right;}
.txt_l{text-align:left;}
.txt_c{text-align:center;}

.block{display:block;}
.overflow{overflow:hidden;}
.cl{clear:both;}

.img_b5 img{margin-bottom:5px;}
.img_b10 img{margin-bottom:10px;}

.w10{width:10%;}
.w15{width:15%;}
.w20{width:20%;}
.w25{width:25%;}
.w30{width:30%;}
.w35{width:35%;}
.w40{width:40%;}
.w45{width:45%;}
.w50{width:50%;}
.w55{width:55%;}
.w60{width:60%;}
.w65{width:65%;}
.w70{width:70%;}
.w75{width:75%;}
.w80{width:80%;}
.w85{width:85%;}
.w90{width:90%;}

.mt5{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt25{margin-top:25px !important;}
.mt30{margin-top:30px !important;}
.mt35{margin-top:35px !important;}
.mt40{margin-top:40px !important;}
.mt45{margin-top:45px !important;}
.mt50{margin-top:50px !important;}

.mb5{margin-bottom:5px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb25{margin-bottom:25px !important;}
.mb30{margin-bottom:30px !important;}
.mb35{margin-bottom:35px !important;}
.mb40{margin-bottom:40px !important;}
.mb45{margin-bottom:45px !important;}
.mb50{margin-bottom:50px !important;}

.mtb5{margin:5px 0 !important;}
.mtb10{margin:10px 0 !important;}
.mtb15{margin:15px 0 !important;}
.mtb20{margin:20px 0 !important;}

.ptb5{padding:5px 0 !important;}
.ptb10{padding:10px 0 !important;}
.ptb15{padding:15px 0 !important;}
.ptb20{padding:20px 0 !important;}

.mr3{margin-right:3px !important;}
.mr4{margin-right:4px !important;}
.mr5{margin-right:5px !important;}
.mr6{margin-right:6px !important;}
.mr7{margin-right:7px !important;}
.mr8{margin-right:8px !important;}
.mr9{margin-right:9px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}

.f70per{font-size:70%}
.f80per{font-size:80%}
.f90per{font-size:90%}
.f110per{font-size:110%}
.f120per{font-size:120%}
.f130per{font-size:130%}
.f140per{font-size:140%}
.f150per{font-size:150%}
.f160per{font-size:160%}
.f170per{font-size:170%}
.f180per{font-size:180%}




.memo{font-size:70%;}

.movie-wrap {position: relative; padding-bottom: 50%; padding-top: 30px; height: 0; overflow: hidden;}
.movie-wrap iframe {position: absolute; top: 0; left: 0; width:100%; height:100%;}

#page-top {position: fixed; bottom: 20px; right: 20px; z-index:20; opacity: 0.7;}
#page-top a{text-decoration:none; color: #fff; padding:15px 20px; text-align:center; display: block; border-radius: 5px; background:#666; font-size:12px;}
#page-top a:hover {text-decoration: none; background:#ccc;}

.TicketBtArea {position: fixed; bottom: 100px; left: 30px; z-index:30;}
.TicketBtArea a{text-decoration:none; color: #fff; text-align:center; display: inline-block; font-size:14px; position: relative; font-weight: 400;}
.TicketBtArea a::after{position: absolute; content: ""; top: 50%; left: 50%; transform: translate(-50%,-50%); background:#FF7108; width: 130px; height: 130px; border-radius: 100%; z-index: -1;}
.TicketBtArea a:hover{text-decoration: none; opacity: 1;}

@media only screen and (max-width:840px) {
#page-top {position:absolute; top: 0px; right: 20px;
filter:alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
}

#page-top a{padding:0px; background:transparent; font-size:1.6rem;}
#page-top a:hover {text-decoration: none; background:transparent;}


.TicketBtArea {position: fixed; bottom: 50px; left: 20px; z-index:30;}
.TicketBtArea a{font-size:12px;}
.TicketBtArea a::after{ width: 100px; height: 100px;}

}