@charset "utf-8";
/* CSS Document */
body { font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif}

/* 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;
}

/* .wrapper
-------------------------------------------------- */
.wrapper { position:relative; margin:0 auto; color:#fff;}

@media (min-width: 769px) {
/* PC用 */
	.wrapper { width:1000px;}
	
	.sp-show { display:none !important;} /* 表示OFF */
}
@media (max-width: 768px) {
/* tablet用 */
	body { background:#001b6a;}
	.wrapper { margin:0 3%;}
	
	.sp-hide { display:none !important;} /* 表示OFF */
}

@media (min-width: 641px) {
/* PC用 & tablet用 */
	.fl { display:inline; float:left;}
	.fr { display:inline; float:right;}
}

.backtotop { position:fixed; right:3%; bottom:18px; display:none; z-index:301;}



/* header
-------------------------------------------------- */
header { width:100%; background:#000;}

@media (min-width: 769px) {
/* PC用 */
	header { position:fixed; height:110px; z-index:7001;
		-moz-transition: height 0.3s ease;
		-o-transition: height 0.3s ease;
		-webkit-transition: height 0.3s ease;
		transition: height 0.3s ease;}
	header .wrapper { position:fixed; top:0; left:50%; height:110px; margin-left:-500px; z-index:10002; background:#000;
		-moz-transition: height 0.3s ease;
		-o-transition: height 0.3s ease;
		-webkit-transition: height 0.3s ease;
		transition: height 0.3s ease;
	}
	header h1 { position:absolute; right:0; top:3px; display:block; font-size:10px; font-weight:normal;
		-moz-transition: height 0.3s ease;
		-o-transition: height 0.3s ease;
		-webkit-transition: height 0.3s ease;
		transition: height 0.3s ease;
		
		margin-bottom:50px;
	}
	header p { float:left; padding:19px 0 0 28px;
		-moz-transition: height 0.6s ease;
		-o-transition: height 0.6s ease;
		-webkit-transition: height 0.6s ease;
		transition: height 0.6s ease;}
		header p img { height:80px; width:auto; 
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			-webkit-transition: all 0.3s ease;
			transition: all 0.3s ease;}
	
	nav ul { margin:0 0 0 181px; padding:42px 0 0 0;
		-moz-transition: height 0.45s ease;
		-o-transition: height 0.45s ease;
		-webkit-transition: height 0.45s ease;
		transition: height 0.45s ease;}
	nav ul li { float:left; margin-right:75px; padding-top:7px;}
	nav ul li a { padding-bottom:2px;}
	
	header.fixed { height:57px;}
	header.fixed .wrapper { height:57px;}
	header.fixed h1 { display:none;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;}
	header.fixed p { padding:7px 0 0 28px; transition: all 0.3s ease;}
		header.fixed p img { height:42px; width:auto; 
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			-webkit-transition: all 0.3s ease;
			transition: all 0.3s ease;}
	header.fixed nav ul { margin:0 0 0 181px; padding:11px 0 0 0;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			-webkit-transition: all 0.3s ease;
			transition: all 0.3s ease;}
		header.fixed nav ul li {
			-moz-transition: all 0.2s ease;
			-o-transition: all 0.2s ease;
			-webkit-transition: all 0.2s ease;
			transition: all 0.2s ease;}
			
	nav .tw,
	header.fixed nav .tw { margin-right:0; padding:0 0 0 12px;}
	header nav .tw img, 
	header.fixed nav .tw img { height:34px; width:auto; 
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
		
}

@media (max-width: 768px) {
/* tablet用 */
	header { position:fixed; height:137px; z-index:1001; -moz-transition: height 0.3s ease;
		-o-transition: height 0.3s ease;
		-webkit-transition: height 0.3s ease;
		transition: height 0.3s ease;}
	
	header h1 { display:none;}
	header p { padding:10px 0 0px; text-align:center;}
	
	nav ul { display:table; width:100%; padding:0 0; box-sizing:border-box;}
	nav ul li { display:table-cell; width:20%; text-align:center;}
		nav ul li a { display:block; padding:12px 0; background-position:center 13px !important; background-size:auto 16px !important;}
		nav ul li img { height:16px; width:auto;}
	
	nav .tw { position:absolute; right:2.5%; top:10px;}
	
	header.fixed { position:fixed; height:48px; -moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;}
	header.fixed nav { height:48px;}
	header.fixed p,
	header.fixed .tw { display:none;}
}


@media (min-width: 641px) {
/* PC用 & tablet用*/
	.youtube { margin:0 35px;}
	.youtube .fl { float: left;}
	.youtube .fr { float: right;}
	.youtube iframe { margin:0 auto; padding-top:120px; text-align:center; width:440px; height:248px;}
}
@media (max-width: 640px) {
/* SP用 */
	.youtube .fl, .youtube .fr { float: none; width: 100%;}
	.youtube iframe { margin:0 auto; padding-top:60px; width:100% !important; height:260px; text-align:center;}
}

.ytp-title-text { display:none !important;}



/* footer
-------------------------------------------------- */
.footer { clear:both; text-align:center; color:#fff;}
@media (min-width: 769px) {
/* PC用 */
	.footer { padding:104px 0 34px; background:#001b6a url(../img/bg_footer.png) left bottom repeat-x;}
}
@media (max-width: 768px) {
/* tablet用 */
	.footer { font-size:11px; line-height:50px; background:#001b6a url(../img/bg_footer.png) left bottom repeat-x; background-size:140% auto;}
}



/* article
-------------------------------------------------- */
article { background:#001b6a url(../img/bg_mv_01.jpg) center 0 no-repeat;}
article h2 { width:100%; text-align:center; background:url(../img/bg_h2_02.png) center top repeat;}

.mv h1/*, .mv h2*/ { display:none;}

@media (min-width: 769px) {
/* PC用 */
	article { padding-bottom:114px; background-position: center 110px;}
	
	.mv { margin-bottom:195px; padding-top:189px;}
	.mv h1 { position:relative; z-index:101;}
	.mv p { position:absolute; top:0px; right:-30px; z-index:31;}
	
	.bx01 { padding-top:67px;}
	
	article h2 span { display:block; width:962px; margin:0 auto; background:url(../img/bg_h2_01.png) center top no-repeat;}
	
	#artists h2,
	#about h2,
	#news h2,
	#ticket h2,
	#goods h2 { margin-bottom:20px;}
	.soon { text-align:center;}
	
	
}
@media (max-width: 768px) {
/* tablet用 */
	article { background-size:130% auto; background-position: center 137px;}
	article.fixed { -moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;}
	article img { width:100%; height:auto;}
	
	article .bx01 { padding-bottom:50px;}

	article .soon { width:50%; margin:0 auto 60px;}
	
	.mv { padding:157px 0 60px;}	
	.mv h1 { position:relative; width:45%; height:atuo; z-index:101;}
	.mv p { position:absolute; top:0px; right:-30px; width:56%; height:auto; z-index:31;}
	
	.bx01 { padding-top:67px;}
	
	article h2 { margin:0 auto 25px; background-size:160% auto;}
	article h2 span { display:block; width:100%;  margin:0 auto; background:url(../img/bg_h2_01.png) center top no-repeat; background-size:120% auto;}
	article h2 span img { width:50%; height:auto; text-align:center;}
	
	#artists h2 { margin-bottom:33px;}
	#about h2 { margin-bottom:18px;}
	#news h2 { margin-bottom:50px;}
	#ticket h2 { margin-bottom:80px;}
	#goods h2 { margin-bottom:18px;}
	.soon { text-align:center;}
}


/* #artists 
-------------------------------------------------- */
.andmore { text-align:left; margin-bottom:18px;}
/*.andmore img { filter:alpha(opacity=0.7);
    -moz-opacity: 0.7;
    opacity: 0.7;
	transition:all 0.3s;}*/

@media (min-width: 769px) {
/* PC用 */	
	#artists .ul01 { margin-bottom:38px;}
	#artists .ul01 li { position:relative; float:left; height:386px; margin:0 20px 0 0; z-index:1;}
		#artists .ul01 li:last-child { margin-right:0;}
	#artists .ul01 li span { position:absolute; bottom:0; left:0; z-index:11;}
	
	#artists .ul02 { margin-bottom:30px;}
	#artists .ul02 li { float:left;}
	
	#artists .ul03 { margin-bottom:30px;}
	#artists .ul03 li { float:left; margin-right:14px;}
	#artists .ul03 li:last-child { margin-right:0;}
	#artists .ul03 li span { display:block; padding:7px 0 0; font-size:12px; text-align:center;}
}
@media (max-width: 768px) {
/* tablet用 */
	#artists .ul01 {}
	#artists .ul01 li { position:relative; float:left; width:48.5%; margin:0 3% 24px 0; z-index:1;}
		#artists .ul01 li:nth-child(2n) { margin-right:0;}
	#artists .ul01 li span { display:block; position:relative; width:75%; margin-top:-0.4em; z-index:11;}
	
	#artists .ul02 { margin-bottom:14px;}
	#artists .ul02 li { float:left; width:33.33333%; margin:0 0 18px;}
	
	.andmore { text-align:left;}
	.andmore img { width:45%;}
	
	#artists .ul03 { margin-bottom:14px;}
	#artists .ul03 li { float:left; width:31.33333%; margin:0 3% 18px 0; padding:0 1.5%; box-sizing:border-box; text-align:center;}
	#artists .ul03 li:nth-child(3n) { margin-right:0;}
	#artists .ul03 li span { display:block; padding:7px 0 0; font-size:12px;}
}


/* #about
-------------------------------------------------- */

@media (min-width: 769px) {
/* PC用 */
	#about { height:938px; background:url(../img/bg_about_01.jpg) center 58px no-repeat; background-size:100% auto;}
	#about h3 { padding:30px 0 50px; text-align:center;}
	#about p { margin-bottom:1.2em; text-align:center; font-size:24px; line-height:1.67;}
}
@media (max-width: 768px) {
/* tablet用 */
	#about { text-align:center; line-height:1.67;}
	#about h3 { margin-bottom:1.2em; color:#fff100; font-size:16px;}
	#about p { margin-bottom:1.2em; font-size:14px;}
}


/* #news
-------------------------------------------------- */
.news-list { border-top:1px solid #b08b90;}
.news-list li { border-bottom:1px solid #b08b90; line-height: 1.5;}
.news-list li .date { color:#fff100;}

.news-list a { color:#fff; text-decoration:underline;}
.news-list a:hover { text-decoration:none;}
@media (min-width: 769px) {
/* PC用 */
	.news-list { margin-bottom:120px;}
	.news-list li { display:table; padding:10px 3px; width:994px;}
	.news-list li span { display:table-cell;}
	.news-list li .date { width:14.2%;}
	.news-list li .ttl { width:85%;}
}
@media (max-width: 768px) {
/* tablet用 */
	.news-list { margin-bottom:60px;}
	.news-list li { padding:6px 3px; width:100%; font-size:14px; line-height:1.4;}
	.news-list li span { display:block;}
}


/* #ticket
-------------------------------------------------- */
#ticket {}
#ticket h3 {}
#ticket p {}

.inner-ticket h3 { color:#ed7994;}
@media (min-width: 769px) {
/* PC用 */
	.ttl-ticket { margin-bottom:58px;}
	
	#ticket { line-height:1.5;}
	#ticket h3 { font-size:24px; margin-bottom:8px;}
	#ticket p { margin-bottom:1.8em; font-size:18px;}
	#ticket .sub { padding:1.5em 0 3em; font-size:14px;}
	
	.btn_tk_01 { margin-bottom:1.8em; padding:0; text-align:left;}
	.btn_tk_01 a { display:block; width:308px; height:90px; padding:0; vertical-align:top; background:url(../img/btn_tk_01_on.png) left top no-repeat; }
	
	.inner-ticket h3 { font-size:30px; margin-bottom:15px;}
	#ticket .inner-ticket p { font-size:14px;}
	
	#ticket .inner-ticket div span { display:block; float:left; width:236px; height:58px; padding:0; vertical-align:top;}
	#ticket .inner-ticket div span:first-child { margin-right:17px;}
	
	.btn_tk_02 { background:url(../img/btn_tk_02_on.png) left top no-repeat;}
	.btn_tk_03 { background:url(../img/btn_tk_03_on.png) left top no-repeat;}
	
	.btn_tk_01 a img,
	.btn_tk_02 a img,
	.btn_tk_03 a img { transition:all 0.3s;}
	.btn_tk_01 a img:hover,
	.btn_tk_02 a:hover,
	.btn_tk_03 a:hover { transition:all 0.3s;
			filter:alpha(opacity=0);
			-moz-opacity: 0;
			opacity: 0;
		}
	
	#ticket .inner-ticket iframe { width:490px; height:220px;}
}
@media (max-width: 768px) {
/* tablet用 */
	.ttl-ticket { margin-bottom:50px;}
	
	#ticket { line-height:1.5;}
	#ticket h3 { font-size:16px; margin-bottom:4px;}
	#ticket p { margin-bottom:1.5em; font-size:14px;}
	#ticket .sub { padding:1.5em 0 3em; font-size:12px;}
	
	.btn_tk_01 { margin:0 auto; padding-bottom:1.8em; text-align:left;}
	.btn_tk_01 a { display:block; width:308px; height:90px; margin:0 auto; padding:0; vertical-align:top; background:url(../img/btn_tk_01_on.png) left top no-repeat;}
	
	.inner-ticket .fl { padding-bottom:18px;}
	.inner-ticket h3 { font-size:22px; margin-bottom:15px;}
	#ticket .inner-ticket p { font-size:14px;}
	
	#ticket .inner-ticket div span { display:block; float:left; width:48.5%; height:auto; padding:0; vertical-align:top; background-size:100% auto;}
	#ticket .inner-ticket div span:first-child { margin-right:3%;}
	
	.btn_tk_02 { background:url(../img/btn_tk_02_on.png) left top no-repeat;}
	.btn_tk_03 { background:url(../img/btn_tk_03_on.png) left top no-repeat;}
	
	.btn_tk_01 a img,
	.btn_tk_02 a img,
	.btn_tk_03 a img { transition:all 0.3s;}
	.btn_tk_01 a img:hover,
	.btn_tk_02 a:hover,
	.btn_tk_03 a:hover { transition:all 0.3s;
			filter:alpha(opacity=0);
			-moz-opacity: 0;
			opacity: 0;
		}
	
	#ticket .inner-ticket .fr { float:none; width:100%;}
	#ticket .inner-ticket iframe { width:100%; height:250px;}

}


/* #goods
-------------------------------------------------- */
@media (min-width: 769px) {
/* PC用 */
	#goods  { margin-bottom:60px;}
	#goods .ul01 { margin:40px 0 30px;}
	#goods .ul01 li { position:relative; float:left; margin:0 20px 30px 0; z-index:1;}
		#goods .ul01 li:nth-child(4n) { margin-right:0;}
	#goods .ul01 li span { position:absolute; bottom:0; left:0; z-index:11;}
}
@media (max-width: 768px) {
/* tablet用 */
	#goods { margin-bottom:40px;}
	#goods .ul01 {}
	#goods .ul01 li { position:relative; float:left; width:48.5%; margin:0 3% 20px 0; z-index:1;}
		#goods .ul01 li:nth-child(2n) { margin-right:0;}
	#goods .ul01 li span { display:block; position:relative; width:75%; margin-top:-0.4em; z-index:11;}
}

/* #twitter / and more...
-------------------------------------------------- */
.bnr_kenpro { text-align:center;}
@media (min-width: 769px) {
/* PC用 */
	.twitter_window { width:462px; margin:0 auto 75px;}
}
@media (max-width: 768px) {
/* tablet用 */
	.twitter_window { width:94%; margin:0 3% 30px;}
	.bnr_kenpro { width:50%; margin:0 auto 45px;}
}