@charset "utf-8";

/* 	basic setting
---------------------------------------------------------- */

body {
	font-size: 14px;
	font-family:'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
	color: #000;
}

/* a */
a {
	overflow:hidden;
	text-decoration:none;
}
a:link {
	color: #000;
	text-decoration: none;
}
a:visited {
	color: #000;
	text-decoration: none;
}
a:hover {
	color: #000;
	text-decoration: underline; transition:text-decoration 0.3s;
}

.sp-show, .sp-hide {}

.print_show { display:none !important;}

@media (min-width: 768px) {
/* PC用 */
	.sp-show { display:none !important;} /* 表示OFF */
}
@media (max-width: 767px) {
/* tablet用 */
	.sp-hide { display:none !important;} /* 表示OFF */
	
	.sp-show img { width:100%; height:auto;}	
}


/* container */
@media (min-width: 768px) {
/* PC用 */
	body { background:#ffffff;}
	.wrapper { clear:both; width:1000px; margin:0 auto; position:relative;}
	header .wrapper, footer .wrapper { position:relative;}
}
@media (max-width: 767px) {
/* tablet用 */
	.wrapper { clear:both; width:94%; margin:0 3%; position:relative; overflow:hidden;}
}


/* .header 
-------------------------------------------------- */
.header { text-align:center;}
.header .sub { height:25px; background:#d3ced1;}

@media (min-width: 768px) {
/* PC用 */
	.header { padding:32px 0 0; background:#000 url(/img/common/bg_pattern_01.jpg) center top repeat;}
	.header h1 { width:386px; margin:0 auto; padding:0 0 27px; text-align:center;}
	.header h1 img { width:100%; height:auto;}
	
	nav { height:50px; background:#000 url(/img/common/bg_pattern_01.jpg) center -95px repeat;}
	nav ul { position:relative; display:table; width:1000px; height:50px; margin:0 auto;}
	nav ul li { display:table-cell; padding:0px 2em 0; vertical-align:middle;}
	
	nav.fixed { position: fixed; left: 0; top: 0; width:100%; background:#000 url(/img/common/bg_pattern_01.jpg) center -95px repeat; z-index:2001;}
	
	nav ul li a {
	  position: relative;
	  display: inline-block;
	  padding: .5em;
	  text-decoration: none;
	}
	nav ul li > span a::after {
	  content: '';
	  position: absolute;
	  bottom: 0;
	  left: 0;
	  width: 100%;
	  height: 1px;
	  -webkit-transform: scaleX(0);
	  -ms-transform: scaleX(0);
	  transform: scaleX(0);
	  background-color: #d51e75;
	  -webkit-transition: all .3s ease;
	  transition: all .3s ease;
	}
	nav ul li > span a:hover::after {
	  -webkit-transform: scaleX(1);
	  -ms-transform: scaleX(1);
	  transform: scaleX(1);
	}
	
	
	nav ul li.toggle div { 
		position:absolute;
		left:0; top:50px; z-index:1000; visibility:hidden;		
		transform: rotateX(-90deg); 
		transform-origin: 50% 0; 
		transition: .3s; font-size:15px;
	}
	nav ul li.toggle div a {
		display:inline-block; padding:16px 34px; font-weight:bold; background:#e1b5ca;
	}
		nav ul li.toggle div a img { margin-right:4px;}
	nav ul li.toggle div a:hover {
		background:#cd83a6;
	}
		nav ul li.toggle:hover div { visibility:visible; transform: rotateX(0);}
	
	.header_sub { height:20px; margin-bottom:50px; background:#d3ced1;}
	.header_sub li { display:table-cell; margin-right:16px; padding:2px 0 0 14px; font-size:10px; line-height:18px; color:#747474; background:url(/img/common/bg_li_04.png) left center no-repeat;}
	.header_sub li a { padding-right:8px; color:#747474;}
	.header_sub .home { padding-left:16px; background:url(/img/common/icn_home_01.png) left center no-repeat;}

}
@media (max-width: 767px) {
/* tablet用 */
	.header { margin-bottom:30px;}
	.header .inner { position:relative; height:54px; text-align:center; background:#000 url(/img/common/bg_pattern_01.jpg) center top repeat;}
	.header h1 { width:62%; max-width:378px ; margin:0 auto; padding-right:54px; line-height:50px; text-align:center;}
	.header h1 img { margin:0 auto; vertical-align:middle; }
	.header .btn_menu { width:54px; height:54px; position:absolute; right:0; top:0; z-index:1000;}
	
	.header .menu { display:none; border-bottom:1px solid #ccc;}
	.icn_open { position:absolute; right:16px; top:43px;}
	.header .menu h2 { margin:0 auto; padding:14px 0; border-bottom:1px solid #000;}
	.header .menu h2 img { width:120px;}
	
	.header .menu_main {}
	.header .menu_main li { border-bottom:1px solid #000;}
	.header .menu_main li a { display:block; padding:15px 0; text-align:center; font-size:15px;}
	
	.header .menu_sub {}
	.header .menu_sub li { background:#e7e7e7; border-bottom:1px solid #dfdfdf;}
	.header .menu_sub li a { display:block; padding:10px 0; text-align:center; font-size:13px;}
	
	.header .btn_close { padding:18px 0;}
	.header .btn_close img { width:/*22.6%*/ 84px; text-align:center;}
	
	.header .btn_menu:hover,
	.header .btn_close:hover { cursor:pointer;}
}

/* footer
-------------------------------------------------- */
footer { clear:both;}

.footer_sub { background:#d3ced1; text-align:center;}
.footer_sub span { font-size:12px;}
.footer_sub span a { display:inline-block; padding:0.7em 1.2em; color:#d51f76; background:#fff; border-radius:17px;}

.copy { text-align:center; color:#000;}

.backtotop { position:fixed; right:3%; bottom:15px; display:none;
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
	transition:all 0.3s;
}
.backtotop:hover { cursor:pointer;
	filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
	transition:all 0.3s;
}

@media (min-width: 768px) {
/* PC用 */
	.footer_main { padding:31px 0; background:#000 url(/img/common/bg_pattern_01.jpg) center center repeat; color:#fff; text-align:center;}
	.footer_main span { padding:0 15px;}
		.footer_main span:first-child { padding:0 12px;}
	.footer_main a { color:#fff;}
	.footer_main p { line-height:32px;}
	.footer_main img { width:32px; height:auto;}
	
	.footer_sub { padding:25px 0 22px;}
	.footer_sub span { margin:0 0 15px 1.2em;}
	
	.copy { padding:8px 0 30px; font-size:12px;}
}

@media (max-width: 767px) {
/* tablet用 */
	.footer_sub { padding:15px 0 4px;}
	.footer_sub span { margin:0 0 0 1em;}
	.footer_sub span:first-child { margin-left:0;}
	.footer_sub span a { margin-bottom:12px;}
	
	.copy { padding:12px 0 20px; font-size:10px;}
	.backtotop img { width:40px; height:auto;}
}


/* lower page
-------------------------------------------------- */
.ttl_common { position:relative; text-align:center;}
.ttl_common span { position:relative; padding:0 24px; background:#fff; z-index:21;}
.ttl_common:before {
	content:'';
	position:absolute; top:12px; left:0; width:100%; height:1px; background-color:#000; z-index:1;
}

@media (min-width: 641px) {
/* PC用 */
	.ttl_common { margin-bottom:30px;}
}

@media (max-width: 640px) {
/* SP用 */
	.ttl_common { margin-bottom:20px;}
}

/* mauseon で濃くなる */
.over { 
	filter:alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
	transition:all 0.3s;
}
.over:hover {
	filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
	transition:all 0.3s;
}

/* mauseon で薄くなる */
.over2 { 
	filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
	transition:all 0.3s;
}
.over2:hover {
	filter:alpha(opacity=0.7);
    -moz-opacity: 0.7;
    opacity: 0.7;
	transition:all 0.3s;
}


/* 　18期アッパー公演チケット
-------------------------------------------------- */
#example_selector {
	display: none;
}
#mfp_reserve_wrapper {
	margin-bottom: 30px;
}
#mfp_reserve_wrapper th,
#mfp_reserve_wrapper td {
	padding: 5px 5px;
	text-align: center;
}