@charset "utf-8";


/* = toppage
------------------------------------------------------------------------------------------*/
/*動画配置用*/
#bgOverlayContainer {position: fixed;left: 0; top: 0;width: 100%;height: 100%;z-index: 2;}

.fp-section{ z-index:2;}

/*パターン配置用*/
.overlayPattern { background-image: url(../images/overlay.png);}
#tubular-container{ opacity:0.9; position:absolute!important;}

#top_wrap{position:aboslute;text-align:left; z-index:5; width:100%;}

.mainimg{min-width: 1000px!important;/* max-width:1800px;*/min-height: 594px!important;position: absolute; left:50%;zoom: 1;}
.top_shadow{position: absolute; zoom: 1; bottom:0; left:0; height:55%; width:100%;z-index: 2}

/* logo area */
#logo_area{ position:absolute; z-index:15; left:0; top :3% ; padding-top:40px;}
#logo_area h1{ line-height:0;}
#logo_area h1 img{ width:90%; padding-left:5%; max-width:770px;}

/* toplink */
#top_link{ position:absolute; z-index:15; bottom:4vh; left:0;}
#top_link img{ width:100%; padding-left:5%;}

/* top right */
#top_right{ position:absolute; z-index:15; right:0%;  top :40px;}

.top_band_bg{position: absolute; zoom: 1; right:0; z-index:1; width:100%;}

.top_bands{ position:relative; z-index:3;line-height:0; font-size:0; text-align:right;}
.top_tour{ position:relative;z-index:3; }
.top_credit{ position:relative;z-index:3; }

.top_bands img{ height:calc(100vh - 50px); }
.topbands1{  margin-top:1%; float:right; }
.top_tour img{ height:93.2642487046%; margin-left:9%;}
.top_credit img{ height:50.9433962264%;margin-left:9%;}

.top_oa{max-height: 3.5%!important;
max-width: 90%; height:auto; width:auto;
margin-top: 0.8%;}

@media screen and (orientation: portrait){
#bgOverlayContainer{ z-index:1;}


#logo_area{ position:relative; z-index:15; left:0; top :0 ; padding-top:60px; width:100%!important; }

#top_link{ position:absolute; z-index:15;left: 5%; width: 90%!important; bottom:20px;}
#top_link img{ width:100%; padding-left:0;}
#top_right{ position:relative; z-index:15; width:90%; margin:0 auto; display:none;}

.top_bands{margin-right:0!important; margin-bottom:3%;}
.topbands1{  margin-top:0; float:right; }
.top_tour{ position:relative;z-index:3;}
.top_credit{ position:relative;z-index:3; }

.top_bands img{margin-left:0; width:90%;}
.top_tour img{ margin-left:0; width:100%; margin-bottom:1%;}
.top_credit img{ margin-left:0; width:100%;}

.top_band_bg{ display:none;}
.top_shadow{ display:none;}
}

/* =news CSS
------------------------------------------------------------------------------------------*/

/* = section2
------------------------------------------------------------------------------------------*/
#section2{background-color: rgba(0,0,0,0.5);}

/* = section3
------------------------------------------------------------------------------------------*/
#section3{background-color: rgba(0,0,0,0.5); font-size:100%;}

h2.bandstit{ margin:0; line-height:0; font:0; background-color:#000; width:100%;}
h2.bandstit img{ width:100%;}

.bands_nav{margin:0 auto; padding-top:20px}
.bands { line-height:0; font:0;}
.bands img{ width:100%;}
.bands li{ float:left; width:50%; overflow:hidden}

.bands ul:after{clear:both;display:block;height:0;line-height:0;visibility:hidden;font-size:0.1em;content:".";}

.bands_main{ float:left; width:75.08%}
.bands_oa{ float:right; width:24.92%}


@media screen and (orientation: portrait){#section3 img{ width:90%; height:auto;}}

.artist_atl{ background-image:url(../images/artist_atl.jpg);
 background-position: center center;
 background-repeat: no-repeat;
background-size: cover;}

.artist_oor{ background-image:url(../images/artist_oor.jpg);
 background-position: center center;
 background-repeat: no-repeat;
background-size: cover;}

.artist_pvs{ background-image:url(../images/artist_pvs.jpg);
 background-position: center center;
 background-repeat: no-repeat;
background-size: cover;}

.artist_fatn{ background-image:url(../images/artist_fatn.jpg);
 background-position: center center;
 background-repeat: no-repeat;
background-size: cover;}

#section3 .slide{ position:relative;}
#section3 dl{ width:90%; position:absolute; bottom:5%; left:5%;}
#section3 dt{ float: left; width:15%;}
#section3 dt img{ width:100%;}
#section3 dd{ float:right; width:80%; text-align:left; line-height:1.7em;background-color: rgba(0,0,0,0.6); padding:1% 2%;}

#section3 .artist_oor dt{ width:30%;}
#section3 .artist_oor dd{ width:65%}

#section3 .artist_atl dt{ width:30%;}
#section3 .artist_atl dd{ width:65%}

#section3 .artist_pvs dl{ top:10%; bottom:none;}
#section3 .artist_pvs dt{ width:25%;}
#section3 .artist_pvs dd{ width:70%}

#section3 .artist_oa { line-height:0; font-size:0;}
#section3 .artist_oa h3{ width:40%; margin:0 auto 20px auto;}
#section3 .artist_oa ul{ width:80%; margin:0 auto;}
#section3 .artist_oa li{ float:left;width:50%; margin-bottom:1px;}
#section3 .artist_oa img{ width:100%;}

#section3 .officialweb{ margin:1% 0 0 0; }
#section3 .officialweb a{ width:15em;
	border:1px solid #FC0;
	padding:0.6% 0;
	display:block;
	color:#FC0;
	text-align:center;
}
#section3 .officialweb a:hover{ text-decoration:none; background-color:#FC0; color:#FFF;}

/* = section4
------------------------------------------------------------------------------------------*/
#section4{background-color: rgba(0,0,0,0.5);}

.ticket_wrap{ width:70%; margin:0 auto; line-height:1.5em; text-align:left;}

@media screen and (max-width: 1300px){.ticket_wrap{ width:80%; }}
@media screen and (max-width: 1000px){.ticket_wrap{ width:90%; }}


.ticket_l{ float:left; width:56%;}

.ticket_l dl{ margin-bottom:1%; clear:both;background-color: rgba(0,0,0,0.7); padding:2.5% 3%;}
.ticket_l dl:after{clear:both;display:block;height:0;line-height:0;visibility:hidden;font-size:0.1em;content:".";}

.ticket_l dt{ float:left; background-color:#cc0000; padding:5% 4%; color:#fff; font-weight:bolder;}
.ticket_l dd{ padding-left:5.5em; font-size:1.1em; line-height:1em}
.ticket_l dd span{ font-size:0.6em;}



.ticket_r{ float:right; width:38%; background-color:#fff;background-color: rgba(255,255,255,0.95); padding:1.5vh 2%; color:#333;}

.ticketprice{ margin-bottom:2%;}
.ticketprice span{ font-size:0.6em;}

.ticketprice .onlytokyo{ }

.ticketprice dl{ border-bottom:1px dotted #999999; padding-bottom:1%; margin-bottom:1%;}
.ticketprice dt{ float:left;}
.ticketprice dd{ float:right;}
.ticketprice dl:after{clear:both;display:block;height:0;line-height:0;visibility:hidden;font-size:0.1em;content:".";}

.ticket_r .notes{ font-size:11px; line-height:1.5em;}
.ticket_r .notes strong{ font-size:14px; font-weight:normal; margin-bottom:5px; display:block;}

.ticketlink{ text-align:center; background-color:#c00; padding:2% 1%; font-weight:bolder; margin-bottom:1%; color:#fff;}
.ticketlink h2{font-weight: bolder;border-bottom: 1px solid #ccc;color: #fff; margin-bottom:5px;}
.ticketlink span{ font-size:0.6em;}
.ticketlink .alert{ font-size:12px; line-height:1.5em; text-align:left; font-weight:normal; padding:5px 10px; margin:0;}

.ticketlink.sub h2{ margin-bottom:0%; font-size:0.9em;}
.ticketlink.sub p{ font-size:0.7em; margin:0;}

.ticketlink table{  width:100%;  border-collapse: collapse; font-size:12px; line-height:16px;}

.ticketlink td{ width:33%; padding:10px 0; vertical-align:bottom; text-align:center;}
.ticketlink td.lt{ }
.ticketlink td.rt{ border-left:1px solid #ffdb49; }
.ticketlink td a{ display:block; color:#333;}
.ticketlink td img{ margin-bottom:10px;}

.linkbtn{ padding:0 5%; margin-bottom:2%;}
.linkbtn a{ color:#fff;background-color: #000; display:block; padding:3%;}
.linkbtn a:hover{ text-decoration:none; background-color:#333;}

.foot_credit{ position:absolute; bottom:1%; right:3%; text-align:right;}
.foot_credit p{ color:#fff; font-size:14px;}


@media screen and (orientation: portrait){
.ticket_l{ float:none; width:100%; font-size:16px!important;}
.ticket_l dd{ padding-left:5em; font-size:1.5em; line-height:1.5em;}
.ticket_r{ float:none; width:96%; font-size:16px!important}
}

#hip_select{padding:20px; background-color:#fff;}
#hip_select h2{ font-size:24px; color:#333; margin-bottom:20px;}
#hip_select li a{ display:block; border:1px solid #aaa; padding:20px 0; margin-bottom:10px;font-size:20px; background-color:#f9f9f9;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px; 
}
#hip_select li a:hover{ text-decoration:none; background-color:#ddd;
  -moz-transition: .2s;
  -webkit-transition: .2s;
  -o-transition: .2s;
  -ms-transition: .2s;
  transition: .2s;}

.goods_txt{ font-size:14px; line-height:1.5em; background-color:#000; padding:1vh 1.5% 1.5vh; clear:both;}
.goods_txt h3{ font-weight:bolder; margin-bottom:0.5em; border-bottom:1px solid #c00; padding-bottom:0.5em;}
.goods_txt .notes{ font-size:12px; line-height:1.5em; margin-bottom:0;}
.goods_txt p{ margin-bottom:10px;}

.goods_l{ float: left; width:43%;}
.goods_r{ float:right; width:53%; line-height:1.5em;}

/* = intro
------------------------------------------------------------------------------------------*/
.playguide_link{ font-size:12px;padding:1% 2%;}
.playguide_link li{ float:left; width:49%; margin:0.5%}
.playguide_link li a{ display:block; background-color:#000; color:#FFF;}
.playguide_link li a:hover{
	background-color:#333;
	text-decoration:none;
}

.playguide_code{ font-size:10px; text-align:left; line-height:1.5em; padding:1% 3% 0 3%;}
.playguide_code dl{ float:left;}
.playguide_code dl.pia{ width:30%;}
.playguide_code dl.lawson{ width:70%;}
.playguide_code dt{ }
.playguide_code dd{}

.soldout{ font-size:1em!important; padding-left:6em!important; color:#bbb;}
.sold_icon{background-color:#C00; padding:0 10px;font-family: 'Roboto Condensed'; color:#FFF;}

/*
@media screen and (min-height: 1000px) {
.prof_txt{	width:44%;	position:absolute; right:50%; padding-right:3%; color:#FFF;top:inherit!important;bottom:7%!important;}
}
*/

/* = ticket

/**** Isotope Filtering ****/
.isotope-item {z-index: 2;  }
.isotope-hidden.isotope-item { pointer-events: none; z-index: 1;}

/**** Isotope CSS3 transitions ****/
.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}


/*lightbox*/

#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;}
        .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;}




/* .stageBase
--------------------------- */
.stageBase {width: 100%;position: relative;overflow: hidden;}
.stageBase .fieldWrap {padding: 100px 0 0 0;text-align: center;}
#stage1 {background:#fff;}
#stage2 {background:#eee;}
#stage3 {background:#ddd;}
#stage4 {background:#ccc;}
#stage5 {background:#bbb;}


/* .stageSlide
--------------------------- */
.stageSlide {position: relative;overflow: hidden;visibility: hidden;}
.stageSlide .slideWrap {top: 0;left: 0;position: absolute;overflow: hidden;}
.stageSlide .slideWrap:before,
.stageSlide .slideWrap:after {content: " ";display: table;}
.stageSlide .slideWrap:after {clear: both;}
.stageSlide .slideWrap {*zoom: 1;}

.stageSlide .slidePanel {float: left;overflow: hidden;}
.stageSlide .sdPrev,
.stageSlide .sdNext {margin-top: -25px;top: 50%;width: 50px;height: 50px;display: block;position: absolute;z-index: 99;}
.stageSlide .sdPrev {left: 80px;background: transparent url(../img/slide_prev.png) no-repeat left top;}
.stageSlide .sdNext {right: 80px;background: transparent url(../img/slide_next.png) no-repeat left top;}

.stageSlide .slideNav {bottom: 70px;left: 0;width: 100%;height: 15px;text-align: center;position: absolute;z-index: 98;}
.stageSlide .slideNav a {margin: 0 5px;width: 15px;height: 15px;background: transparent url(../img/nav.png) no-repeat center center;display: inline-block;overflow: hidden;}
.stageSlide .slideNav a.pnActive {background: transparent url(../img/nav_acv.png) no-repeat center center;}

/* #pageNav
--------------------------- */
#pageNav {top: 0;right: 25px;width: 15px;text-align: center;position: fixed;z-index: 2;}
#pageNav ul {width: 15px;display: block;}
#pageNav ul li {padding-bottom: 5px;width: 15px;height: 15px;display: block;overflow: hidden;}
#pageNav ul li a {width: 15px;height: 15px;background: transparent url(../img/nav.png) no-repeat center center;display: block;}
#pageNav ul li.activeStage a {background: transparent url(../img/nav_acv.png) no-repeat center center;}

/* #pageDown
--------------------------- */
#pageDown {bottom: 0;left: 0;width: 100%;height: 40px;text-align: center;position: fixed;overflow: hidden;z-index: 3;}
#pageDown a {margin: 0 auto;width: 30px;height: 30px;background: transparent url(../img/next_arw.png) no-repeat center center;display: block;}