@charset "utf-8";

/* =base
------------------------------------------------------------------------------------------*/

* { box-sizing: border-box;}
body {
	text-align: center;
	color: #fff;
	background-color:#000;
	font-family: "メイリオ","Meiryo","MS PGothic","Osaka",Arial,sans-serif;
	font-size: 16px;
	line-height: 1.5em;
	 background-image:url(../images/cancel_bg.jpg); background-size:100%; background-attachment:fixed; background-position:bottom center; background-repeat:no-repeat;
}
html { height:100%;}

a {color: #c00;text-decoration: none; outline:none;}
a:hover {color: #c00;text-decoration: underline;}
a:hover img{opacity:0.8;filter: alpha(opacity=80);}


.pc{ display: initial;}
.sp{ display:none;}

@media only screen and (max-width: 639px){
body{  font-size:14px; line-height:1.5em; background-image:none;}

.pc{ display:none}
.sp{ display:block;}

.sp_bg{background-image:url(../images/cancel_bg.jpg); background-size:100%;background-position:bottom center;  width:100%; 
    height: 100vh; background-repeat:no-repeat;position: fixed;
    top: 0;
    left: 0;transform: translate3d(0, 0, 0); z-index:1;
}

main{ position:relative; z-index:20;}
}

#js_fade2 {position : fixed;top : 0;left : 0;width: 100%; height : 100%;background-color: #fff;background-image : url( ../images/loading.gif );background-repeat : no-repeat; background-position : 50% 50%; z-index:100;}

.stxt{ font-size:0.75em;}

/* =header
-----------------------------------------------------------------------------------------*/
header{}
header h1{ }

@media only screen and (max-width: 639px){

}

/* =ページトップ
------------------------------------------------------------------------------------------*/
.page_top{text-align: right;margin: 0;  width:80px;  text-align:center;position:fixed; right:30px; bottom:40px;  z-index:10}
.page_top a{background-color:#c00; display:block;border-radius: 50%;height:80px; width:80px; line-height:80px; color:#fff; font-family: 'Oswald';font-size:12px;}
.page_top a:hover{background-color:#a00; text-decoration:none; }


@media only screen and (max-width: 639px){
.page_top{ display:none;}
}

/* =foot
-----------------------------------------------------------------------------------------*/
footer{ width:100%; padding:2vw 3vw 4vw; background-color:rgba(0,0,0,0.5);}

footer .bnr{ float:left;}
footer .bnr li{ float:left; padding-right:1vw;}

footer .foot_txt{ padding-right:100px;}
footer .foot_txt img{ width:100%;}
footer .foot_txt{ display:table; float:right;}
footer .foot_txt .copy,
footer .foot_txt .insta,
footer .foot_txt .hip{ display:table-cell; vertical-align: bottom;}

footer .foot_txt .insta{ width:50px;}
footer .foot_txt .copy{ padding-right:10px; text-align:right; font-weight:bold; font-size:14px; line-height:1.5em; vertical-align:top;}
footer .foot_txt .hip{ width:90px;}

.sharearea{margin:20px auto 0;text-align:left; background:rgba(255,255,255,0.5); width:230px;  font-family:'Oswald'; }
.sharearea h3{ float: left;  font-weight:bold; font-size:20px; line-height:70px; padding-right:15px;}
.sharearea ul{padding:0;}
.sharearea li {float:left;margin-right:5px;}
.sharearea li a{display: block;overflow: hidden;width: 70px;height:71px; background-size:100%; background-repeat:no-repeat; }
.sharearea li a span{ display:none;}
.sharearea li a:hover{ opacity:0.8;}
.sharearea li.fb a{ background-image:url(../images/icon_fb.png); }
.sharearea li.twt a{ background-image: url(../images/icon_tw.png);}


@media only screen and (max-width: 639px){
footer{ position:relative; z-index:10; }
footer .foot_txt{ display:inherit; float:none; padding:0;}
footer .foot_txt .copy{line-height: 1.4em;   font-size: 12px;  display: inherit; text-align: left; padding:0;}
footer .foot_txt .insta { width: 50px; display: inherit; float: left;}
footer .foot_txt .hip { width: 90px; display: inherit; float: inherit; margin:0 auto;}

}

/* =main
-----------------------------------------------------------------------------------------*/
h1.mainlogo{ text-align:center; padding-top:4vw; margin-bottom:40px;}
h1.mainlogo img{ width:60%;}

.cancel_txt{ text-align:left; max-width:1000px; width:94%; margin:0 auto; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;line-height:1.7em;}

.cancel_txt .band_message{ border-top:1px solid #ccc; border-bottom:1px solid #ccc; padding:30px 0 20px 0; }
.cancel_txt .band_message h2{ font-weight:bold; margin-bottom:1em; text-align:center; font-size:20px; line-height:1.4em;}
.cancel_txt .band_message .sign{ text-align:right; margin-bottom:1.5em;}



@media only screen and (max-width: 639px){
.cancel_txt .band_message h2{  font-size:18px; line-height:1.4em;}
}

.ticket{ background-color:rgba(255,255,255,1); color:#000;  padding:2vw 0 10px; text-align:left;}
.ticket_wrap{ width:1000px; margin:0 auto;}

.ticket h2{ font-size:40px; line-height:1em; font-weight:bold; margin-bottom:30px; text-align:center;font-family:'Oswald';}

.ticket .return_lead{text-align:center; border-top:1px solid #ccc; padding:25px 0; font-size:18px; line-height:1.5em;font-family:'Oswald';}
.ticket .return_lead strong{ display:block; font-size:36px; line-height:1.5em; margin-bottom:0.5em;}
.ticket .return_lead strong span{ font-size:50px;}

/*---チケットリンク---*/
.ticket_btn{ padding-bottom:20px;}
.ticket_btn h2{ margin-bottom:1.5vw;}
.ticket_btn a{ display:block; color:#333; font-weight:bold; font-size:14px; border:6px solid #ccc; border-radius:10px; padding:8px 0;font-family:'Oswald';}
.ticket_btn a:hover{ text-decoration:none;}
.ticket_btn a:hover img{ opacity:1;}
.ticket_btn dl{ float:left; width:19.2%; background-color:#FFF; margin:0 0.4% 0.8vw; box-sizing: border-box; padding:0px; border-radius:10px; text-align:center;}
.ticket_btn dt img{ max-width:70%;}
.ticket_btn dl:hover{ opacity:0.7;}
.ticket_btn dd{ font-size:12px;}
.ticket_btn .phone{ float:left; width:23%;margin:0 1% 1.52vw; box-sizing: border-box; padding:0 10px; text-align:left; font-size:12px; line-height:1.4em;}

.ticket_detail{ background-color:#eee; padding:35px 0 30px; margin-bottom:5px; line-height:1.7em;}
.ticket_detail h3{ font-size:36px; line-height:1.2em; font-weight:bold; margin-bottom:15px;}
.ticket_detail h3 span{ font-size:28px;}

.ticket_detail p.lead{ font-weight:bold; line-height:1.8em; font-size:16px; border-top:1px solid #bbb; padding-top:15px;}



@media only screen and (max-width: 639px){
h1.mainlogo{ top:0; height: inherit; width:100%; padding:8vw 4% 0; position:relative;  text-align:center; z-index:10; margin-bottom:20px;}
h1.mainlogo img{ height: inherit; width:100%}
.date .date_txt{ width:100%; margin:0 auto 5px; }
.date .date_txt img{ width:92%;}


.ticket{ background-color:rgba(255,255,255,1); color:#000; margin-top:0; padding:0 0 5px 0;}
.ticket h2{ font-size:18px; line-height:1.4em; font-weight:bold; margin-bottom:0; width:100%; margin:0 auto; padding-bottom:10px;}


.ticket .return_lead{ padding:10px 0; font-size:14px; line-height:1.5em;}
.ticket .return_lead strong{ display:block; font-size:18px; line-height:1.5em; margin-bottom:0.5em;}
.ticket .return_lead strong span{ font-size:30px;}


.ticket_wrap{ width:94%; margin:0 auto;}
.ticket_wrap.lead_txt{ padding:10px 0; font-size:12px; line-height:1.6em;}
.ticket_wrap.lead_txt strong{ font-size:14px; line-height:2em;}

.ticket_detail{ padding:15px 0;}

.ticket_detail h3{ font-size:18px; line-height:1.4em; font-weight:bold; margin-bottom:5px;}
.ticket_detail p.lead{ line-height:1.5em; font-size:14px; padding-top:10px;}
.ticket_detail h3 span{ font-size:12px;display: block; line-height: 1.6em;}

.ticket_btn dl{ width:100%; margin:0 0 3px;}
.ticket_btn dl:nth-child(-n+2){ width:100%;}	
.ticket_btn a{  padding:2px 5px; display:table; width:100%; border-width:4px; border-radius:5px;}
.ticket_btn dt{ display:table-cell; vertical-align:middle; width:60px; height:40px;}
.ticket_btn dt img{ width:auto; max-width:100%; max-height:40px;}
.ticket_btn dd{ display:table-cell; vertical-align:middle; font-size:14px;}




}


/* english
------------------------------------------------------ */
#english{ background-color:rgba(0,0,0,0.7);}
.en_wrap{ width:1000px; margin:0 auto; text-align:left; padding:50px 0;}
.en_wrap h2{ font-weight:bold; font-size:24px; line-height:1.7em; text-align:center; margin-bottom:1em; font-family:'Oswald'; letter-spacing:0.1em;}
.en_wrap h2 strong{ display:block; font-size:80px; line-height:1.1em;}
.en_wrap h2 span{ font-size:40px;}

.en_wrap .e_txt{ text-align:center; margin-top:42px; font-size: 20px;}
.en_wrap .sign{ text-align:right; margin-bottom:1.5em;}

.en_wrap .en_lead{ border-top:1px solid #fff; padding:35px 0; border-bottom:1px solid #fff;font-family:'Oswald'; font-size:36px; line-height:1.4em; letter-spacing:0.05em;text-align:center; margin-bottom:25px;}
.en_wrap .en_lead h3{ margin-bottom:25px;}
.en_wrap .en_lead h3 a{ background-color:#fff; color:#000; display: inline-block; padding:4px 20px; line-height:1em; font-size:24px; font-weight:bold; position:relative; top:-3px; margin-left:5px;}
.en_wrap .en_lead h3 a:hover{  background-color:#ddd; text-decoration:none;}
.en_wrap .en_lead span{ font-size:0.6em;}
.en_wrap .en_lead h3 span{ font-size:1em;}

.en_wrap .en_lead .en_date{ text-align:center; margin-bottom:10px;}
.en_wrap .en_lead .en_date img{ max-width:750px;}

.en_wrap .en_lead li{ font-size:30px;}
.en_wrap .en_lead li strong{ font-size:44px;}

.en_wrap .en_lead li.soldout{ color:#C00; font-size:24px; width: 778px; margin: 0 auto; text-align: left;}
.en_wrap .en_lead li.soldout strong{ font-size:38px;}
.en_wrap .en_lead li.soldout:after{ content:"SOLD OUT"; display:block; background-color:#C00; color:#fff; float: right; width: 6em; font-size: 0.7em; line-height: 1.7em; text-align:center; margin-top:1em;}

.en_wrap .en_price{ border:1px solid #fff; font-family:'Oswald'; margin-bottom:20px;}
.en_wrap .en_price h3{ background-color:#fff; color:#000; text-align:center; font-size:36px; font-weight:bold; line-height:1em; padding:10px 0;}
.en_wrap .en_price .price_wrap{ padding:20px 30px; font-family:Arial,Helvetica,sans-serif !important; font-size:18px; line-height:1.4em; }
.en_wrap .en_price .price_wrap dl{ border-bottom:1px dotted #ccc; padding-bottom:10px; margin-bottom:10px;font-size:30px; line-height:1.4em;}
.en_wrap .en_price .price_wrap dt{ float:left;}
.en_wrap .en_price .price_wrap dd{ padding-left:4em;}

.en_wrap .en_price .price_wrap dl.soldout { color:#e00; font-size:28px;}
.en_wrap .en_price .price_wrap dl.soldout .del{color:#c00; text-decoration:line-through;}
.en_wrap .en_price .price_wrap dl.soldout .del span{color:#fff; font-size:28px!important;}
.en_wrap .en_price .price_wrap dl.soldout .del span span{ font-size:14px!important;}

.en_wrap .en_price .price_wrap span{ font-size:16px;}
.en_wrap .en_price .notes{ font-size:14px; line-height:1.4em; margin:0;}

.en_wrap .en_tickets{font-family:'Oswald'; }
.en_wrap .en_tickets h4{ font-size:30px; line-height:1.3em;  text-align:center; font-weight:bold; margin-bottom:10px;}

.en_wrap .en_tickets .ticket_wrap{ background-color:#fff; color:#000; padding:10px 20px; margin-bottom:15px;}
.en_wrap .en_tickets .ticket_wrap .en_date{ text-align:center; font-weight:bold; font-size:30px; line-height:1.4em;border-bottom:1px solid #999; border-top:1px solid #999; padding:15px 0; margin-bottom:15px; }
.en_wrap .en_tickets .ticket_wrap .en_date span{ font-size:24px;}

#english .en_ticket_btn{ border:2px solid #cc0000; color:#cc0000; text-align:center; font-size: 20px; padding: 10px 19px; display: block; margin-top: 15px; font-weight:bold;}
#english .en_ticket_btn:hover{ text-decoration:none; border-color: #f00; color:#f00;}

#english .en_cancel_lead{ text-align:center; font-weight:bold; font-size:36px; color:#c00;}

@media only screen and (max-width: 639px){
.en_wrap{ width:94%;padding:20px 0;}
.en_wrap h2{ font-size:16px; line-height:1.7em;}
.en_wrap h2 strong{ font-size:50px; line-height:1.1em;}
.en_wrap h2 span{ font-size:24px;}

.en_wrap .mt_txt{ margin-top:-20px;}
.en_wrap .e_txt{ text-align:center; margin-top:18px; font-size: 16px; line-height:1.4em;}

.en_wrap .en_lead{padding:15px 0; font-size:16px; line-height:1.4em; letter-spacing:0; margin-bottom:15px; text-align:left;}
.en_wrap .en_lead h3{ font-size:24px; line-height:1em; position:relative; margin-bottom:10px; text-align:center;}
.en_wrap .en_lead h3 span{ font-size:0.6em;}
.en_wrap .en_lead h3 a{ display: block; padding:4px 20px; line-height:1em; font-size:16px;  position: absolute; top:0; right:0; margin-left:0; }
.en_wrap .en_lead strong{ display:block; font-size:28px; line-height:1em; padding-top:10px;}

.en_wrap .en_price{  margin-bottom:15px;}
.en_wrap .en_price .price_wrap{ padding:15px; letter-spacing:0;}
.en_wrap .en_price .price_wrap dl{ border-bottom:1px dotted #ccc; padding-bottom:10px; margin-bottom:10px;font-size:16px; line-height:1.4em;}

.en_wrap .en_price .price_wrap dl.soldout { color:#e00; font-size:16px;}
.en_wrap .en_price .price_wrap dl.soldout .del{color:#c00; text-decoration:line-through;}
.en_wrap .en_price .price_wrap dl.soldout .del span{color:#fff; font-size:16px!important;}
.en_wrap .en_price .price_wrap dl.soldout .del span span{ font-size:11px!important; line-height:1.5em;}

.en_wrap .en_price .notes{ font-size:12px; line-height:1.4em; margin:0;}

.en_wrap .en_tickets .ticket_wrap{ padding:10px 10px; margin-bottom:10px;}
.en_wrap .en_tickets .ticket_wrap .en_date{font-size:18px; line-height:1.2em;border-bottom:1px solid #999; border-top:1px solid #999; padding:10px 0; margin-bottom:10px; }
.en_wrap .en_tickets .ticket_wrap .en_date span{ font-size:0.6em;}

.en_wrap .en_lead .en_date { margin-bottom:0;}
.en_wrap .en_lead .en_date img{ width:100%;}

.en_wrap .en_price h3{ font-size:18px; line-height:1.4em;}

#english .en_ticket_btn{ margin-top:10px;}
}


/* border
------------------------------------------------------ */
.l-border { pointer-events: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100000;}
.l-border__elm { position: absolute; background-color: #fff;}
.l-border__elm--bottom, .l-border__elm--top { height: 1vw; right: 0; left: 0;}
.l-border__elm--left, .l-border__elm--right { width: 1vw; top: 0; bottom: 0;}
.l-border__elm--top { top: 0;}
.l-border__elm--right { right: 0;}
.l-border__elm--bottom { bottom: 0;}
.l-border__elm--left { left: 0;}


@media only screen and (max-width: 639px){
.l-border{ display:none;}
}

/* youtube
------------------------------------------------------ */
.youtube{
position:relative;
width:90%; margin:0 auto;
padding-top:56.25%;
}
.youtube iframe{
position:absolute;
top:0;
right:0;
width:100%;
height:100%;
}


/* =video
------------------------------------------------------ */
video#bgvid {
  position: fixed; left: 0; top: 0;min-width:100%; min-height:100%;
  z-index: -100;
  opacity:0.5;
}


@media only screen and (max-width: 639px){
video#bgvid { display:none;}
}

/* =clearfix
------------------------------------------------------------------------------------------*/
.clearfix:after{clear:both;display:block;height:0;line-height:0;visibility:hidden;font-size:0.1em;content:".";}




/* youtube */

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box;}
/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{outline:none;}
   /* #cboxContent{margin-bottom:60px; overflow:visible;}*/
    #cboxContent{margin-right:60px; overflow:visible; margin-bottom:0;}
        .cboxIframe{background:#000;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#000;}
        #cboxLoadingGraphic{background:url(../images/loading_b.gif) no-repeat center center;}
        #cboxLoadingOverlay{background:#000;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}
        #cboxSlideshow, #cboxClose{text-indent:-9999px; width:40px; height:100%; position:absolute; top:0;background:url(../images/controls2.png) no-repeat 0 0;}
		
        #cboxClose{background-position:7px 0; right:-50px; border:0; outline:none;}
        #cboxClose:hover{background-position:-40px 0;}


@media screen and (max-width: 768px) {
#cboxContent{ margin-right:0; margin-bottom:50px;}
#cboxClose{ right:0; top:inherit; bottom:-35px; height: 22px;}
}

#popuptext{padding:40px; background-color:#000;color:#fff; font-size:16px; line-height:1.7em; text-align:left; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
@media screen and (max-width: 768px) {
#popuptext{ padding:10px;}
}