@charset "UTF-8";

/* Utility Class */
.tL {text-align:left !important;}
.tR {text-align:right !important;}
.tC {text-align:center !important;}
.fL {float:left !important;}
.fR {float:right !important;}
.mb00 {margin-bottom:0 !important;}
.mb05 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}
.mb40 {margin-bottom:40px !important;}
.fz10 {font-size:10px !important;}
.fz12 {font-size:12px !important;}
.fz14 {font-size:14px !important;}
.fz16 {font-size:16px !important;}
.fz18 {font-size:18px !important;}
.fz20 {font-size:20px !important;}
.fwB {font-weight:bold !important;}
.red {color:#d00 !important;}

img {max-width: 100%;}

/* マテリアルアイコン */
/* Material icons setting */
.material-icons {
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 24px;  /* Preferred icon size */
	display: inline-block;
	line-height: 1;
	text-transform: none;
	letter-spacing: normal;
	word-wrap: normal;
	white-space: nowrap;
	direction: ltr;
  
	/* Support for all WebKit browsers. */
	-webkit-font-smoothing: antialiased;
	/* Support for Safari and Chrome. */
	text-rendering: optimizeLegibility;
  
	/* Support for Firefox. */
	-moz-osx-font-smoothing: grayscale;
  
	/* Support for IE. */
	font-feature-settings: 'liga';
  }
/* Rules for sizing the icon. */
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }

/* Rules for using icons as black on a light background. */
.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }

/* Rules for using icons as white on a dark background. */
.material-icons.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }

/* 注釈のインデント */
.note li {
	text-indent: -1.0em;
	padding-left: 1.0em;
}

/* オレンジボタン */
.btn_orange:link {
	color: #fff;
	background-color: #ffa000;
	display: block;
	padding: 0.9em 1.1em;
	border-radius: 4px;
	box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.24);
	text-align: center;
	-webkit-transition:	all 0.3s ease;
	transition:all 0.3s ease;
}
.btn_orange:visited {
	color: #fff;
}
.btn_orange:hover {
	opacity: 0.7;
	text-decoration: none;
}

/* グレイボタン */
.btn_nosale {
	color: #fff;
	background-color: #bdbdbd;
	display: block;
	padding: 1.0em 1.0em;
	border-radius: 4px;
	box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.24);
	text-align: center;
}
@media screen and (max-width: 640px) {
	.btn_orange,
	.btn_nosale {
		display: block;
		width: auto;
	}
}

/* =============================================================================
   コンテンツ
   ========================================================================== */
.contentsBody{
	background-color:#eee;
}
.titleWrap {
	background-color:#ffffff;
}
	.titleWrap-inner {
		width: 1200px;
		margin:30px auto;
		padding-bottom: 0.3em;
		overflow: hidden;
		border-bottom: 1px dotted #bdbdbd;
	}
		.titleWrap h1.heading01 {
			font-size: 20px;
		}

	@media screen and (max-width: 640px) {
		.titleWrap-inner  {
			width: auto;
			margin: 0.5em;
		}
		.titleWrap h1.heading01 {
			font-size: 16px;
		}
	}


/* メインヴィジュアル */
.mainvisual {
	text-align:center;
}

/* ナビゲーション 
======================================== */
nav .ankerlink {
	overflow-x: auto;
    white-space: nowrap;
	-webkit-overflow-scrolling: touch;
	background-color: rgba(97, 97, 97, 0.897);
	text-align: center;	
}
	.ankerlink li {
		display: inline-block;
	}
		.ankerlink li a {
			color: #fff;
			font-size: 16px;
			padding: 1.0em;
			display: block;
		}
		.ankerlink li a:hover {
			text-decoration: underline;
		}

/* ナビゲーションを固定 for jQuery */
.is-fixed {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
}
@media screen and (max-width: 640px) {
	.ankerlink li a {
		font-size: 14px;
	}
}

/* カラム 
======================================== */
.columnWrapper {
	width: 1200px;
	margin: 0 auto;
	padding: 32px 0 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
	/* メインカラム */
	.main-column {
		width: 825px;
	}
		.main-column .block {
			margin-bottom: 64px;
		}
			.main-column .block .heading {
				background-color: #212121;
				padding: 0.8em;
				font-size: 20px;
				color: #fff;
				line-height: 1.0em;
			}
			.block .block_inner {
				padding: 16px;
			}
	/* サブカラム */
	.sub-column {
		width: 343px;
	}	
		.sub-column .block {
			margin-bottom: 32px;
		}

@media screen and (max-width: 640px) {
	.columnWrapper {
		width: auto;
		margin: 0 auto;
		padding: 16px;
		display: block;
	}
		.main-column,
		.sub-column {
			width: auto;
		}
		.main-column .block,
		.sub-column .block {
			margin-bottom: 30px;
		}
}

article {background-color: #fff;}		

/* =============================================================================
   Banner
   ========================================================================== */
.banner-list li:not(:last-child) {
	margin-bottom: 1.5em;
}
.banner-list li a {
	line-height: 1.5em;
	color: #333;
	text-decoration: underline;
}

.main-column .banner-list {
	text-align: center;/* メインカラムのバナーは中央よせ */
}

/* =============================================================================
   NEWS
   ========================================================================== */
.news-list .block_inner  {
	display: block;
	padding: 0 16px;
}
/* タイトル */
.news-list .news_title {
	font-size: 18px;
	font-weight: bold;
}
.news-list .material-icons.red {
	display: none;
}
/* 最新ニュース */
.news-list .news_title.lastest {
	text-indent: -18px;
	padding-left: 35px;
}
	/* [NEW]Web icon */
	.news-list .news_title.lastest .material-icons.red {
		display: inline-block;
		color: #e53935;
		vertical-align: middle;
		margin-right: 5px;
		font-size: 30px;
	}

.news-list .block_inner>li {
	border-bottom: 1px dotted #bdbdbd;
	padding: 1.0em 0;
}
.news-list .block_inner>li:last-child {
	border-bottom: none;
}

/* NEWSのチケット販売情報 */
.news-list .news_ticket {
	display: table;
	margin-top: 1.0em;
	width: 793px;
}
	.news_ticket dt {
		display: table-cell;
		font-size: 20px;
		text-align: center;
		width: 300px;
		padding: 1.0em;
		box-sizing: border-box;
		line-height: 1.0em;
		vertical-align: middle;
	}
	.news_ticket dt span {
			font-size: 14px;
			margin-left: 0.5em;
		}
	.news_ticket dd {
		display: table-cell;
		vertical-align: middle;
		padding: 1.0em;
	}
		.news_ticket dd .period {
			font-size: 18px;
			margin-bottom: 0.2em;
		}
		.news_ticket .note strong.important {color: #e53935;}

		/* 色数が増える可能性があるので、色のCSSを分けクラス名を color-red としました */
		.news-list .news_ticket.color-red dt {
			background-color: #d81b60;
			color: #fff;
		}
		.news_ticket.color-red dd {
			background-color: #fdf3f7;
			/* color:; */
		}

@media screen and (max-width: 640px) {
	.news-list .news_title {
		font-size: 16px;
	}
	.material-icons {
		font-size: 20px;
	}
	/* NEWSのチケット販売情報 */
	.news-list .news_ticket {
		margin-top: 1.0em;
		width: auto;
		display: block;
	}
		.news-list .news_ticket dt,
		.news-list .news_ticket dd {
			display: block;
			text-align: center;
		}
		.news-list .news_ticket dt {
			font-size: 18px;
			width: auto;
			padding: 0.4em 0;
		}
		.news_ticket dt span {
			font-size: 14px;
		}
}


/* =============================================================================
   先行・一般発売
   ========================================================================== */
.sales-type {
	display: table;
	margin-bottom: 1.0em;
}
	.sales-type dt,
	.sales-type dd {
		display: table-cell;
		vertical-align: middle;
		background-color: #fff;
		padding: 1.0em;
	}
	.sales-type dt {
		color: #fff;
		text-align: center;
		box-sizing: border-box;
		font-size: 20px;
		font-weight: bold;
		line-height: 1.0em;
	}
		.sales-type dt .period {
			font-size: 13px;
			font-weight: normal;
		}

/* フォント大 */
.sales-type dd .largefont {font-size: 18px;}

/* width */
.sales-type {width: 825px;}
.sales-type dt {width: 315px;}
.sales-type dd:last-child {width: 140px;}

/* カラー */
.sales-type dt.red-title {background-color: #d2203a;}
.sales-type dt.blue-title {background-color: #2b529d;}
.sales-type dt.green-title {background-color: #1d8b2f;}
.sales-type dt.tealgreen-title {background-color: #0097a7;}

@media screen and (max-width: 640px) {
	.sales-type,
	.sales-type dt,
	.sales-type dd,
	.sales-type dd:last-child {
		display: block;
		width: auto;
	}
	.sales-type dt {
		padding: 0.8em 0.2em;
	}
	.sales-type dd .fontlarge {
		margin-bottom: 0.3em;
	}
	.sales-type dd:last-child {
		padding: 0 2.0em 1.0em;
	}
}


/* =============================================================================
   注意事項
   ========================================================================== */
/* .attention {} */


/* =============================================================================
   ケータイ電子チケットエントリー方法
   ========================================================================== */
/* .eticket-entry {} */
.heading-accordion {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	background-color: #212121;
	font-size: 20px;
	color: #fff;	
	cursor: pointer;
}
	.eticket-entry .heading-accordion .note {
		color: #ffeb3b;
		font-size: 13px;
		margin-left: 1.0em;
	}
	.heading-accordion .heading-text {
		padding: 0.8em;
		width: calc(100% - 46px);/* toggleアイコンの幅（46px）を差分した値 */
		border-right: 1px solid #fff;
		line-height: 1.4em;
	}
	.heading-accordion .icon-toggle {
		padding: 0.8em;
		line-height: 1.0em;
		/* width: 46px; */
	}

.heading-accordion .material-icons.remove {display: none;}
.heading-accordion.active .material-icons.add {display: none;}
.heading-accordion.active .material-icons.remove {display: inline;}

.eticket-entry .accordionTarget {display: none;}

.eticket-entry p {
	padding-bottom:8px;
}
.eticket-entry h3 {
	font-size:16px;
	border-bottom:1px dotted #999;
	padding:12px 0 8px 6px;
	margin-bottom:8px;
}
.eticket-entry dl:not(:last-child) {
	margin-bottom:12px;
}
	.eticket-entry dt {
		font-size:18px;
		background-color:#323232;
		color:#fff;
		border-radius:3px;
		padding:8px;
		margin:0 0 8px 0;
	}
	.eticket-entry .note {
		margin-bottom: 1.0em;
	}
	.eticket-entry .note li {
		text-indent: -1.0em;
		padding-left: 1.0em;
		margin-bottom: 0.5em;
	}

@media screen and (max-width: 640px) {
	.eticket-entry .heading-accordion .note {
		display: block;
		line-height: 1.5em;
		text-indent: -1.0em;
		padding-left: 1.0em;
		margin-left: 0;
		margin-bottom: 0;
	}
	.eticket-entry .heading .heading-text {
		padding: 0.5em;
		border-right: 1px solid #fff;
	}
	.eticket-entry .heading .icon-toggle {
		border-left: none;
		padding: 0.5em;
	}
}


/* =============================================================================
   公演概要
   ========================================================================== */
/* .performance-detail {} */
.performance-detail .performance-title {
	font-size: 30px;
	font-weight: bold;
	margin-bottom: 0.4em;
	line-height: 1.5em;
}
.performance-detail .performance-catch {
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 1.0em;
	color: #d12926;
	line-height: 1.5em;
}
.performance-detail .performance-lead:not(:last-child) {
	margin-bottom: 4.0em;
}
.performance-detail .performance-lead p:not(:last-child) {
	margin-bottom: 1.0em;
}

/* ムービー */
.performance-detail .movie-title {
	text-align: center;
	margin-bottom: 0.5em;
	font-size: 18px;
}
.performance-detail .movie {
	text-align:center;
}
.performance-detail .movie iframe {
	width:640px;
	height:360px;
}

@media screen and (max-width: 640px) {
	.performance-detail .performance-title {
		font-size: 24px;
	}
	.performance-detail .performance-catch {
		font-size: 20px;
	}
	.performance-detail .performance-lead {
		margin-bottom: 2.0em;
	}
	/* ムービー */
	.performance-detail .movie-title {
		font-size: 16px;
	}
		.performance-detail .movie {
		position:relative;
		width:100%;
		height: 0;
		padding-top:56.25%;
	}
	.performance-detail .movie iframe {
		position:absolute;
		top:0;
		right:0;
		width:100%;
		height:100%;
	}
}



/* =============================================================================
   出演
   ========================================================================== */
/* .performer {} */



/* =============================================================================
   料金
   ========================================================================== */
/* .fee {} */
.fee .price {
	font-size: 16px;
	margin-bottom: 0.5em;
}
/* 注釈 */
.fee .note:not(:last-child) {
	font-size: 12px;
	margin-bottom: 2.0em;
}
	.fee .note .linespacing {
		margin-bottom: 1.0em;
	}
	.fee .note .emphasize {
		color: #d00;
		font-weight: bold;
	}


/* =============================================================================
   公演一覧
   ========================================================================== */
/* .performance-schedule {} */
/* スマホ用のアコーディオン見出しを隠す */
.performance-schedule .heading-accordion {
	display: none;
} 
.performance-schedule .performance-list>li {
	border-bottom: 4px solid #eee;
	padding: 8px 0;
}
.performance-schedule .heading-accordion .heading-text {
	line-height: 1.0em;	
}
/* 公演終了 */
.performance-schedule .performance-list>li.end {
	color: #9e9e9e;
	background-color: #f5f5f5;
}
.performance-schedule .performance-list>li.end .open-start,
.performance-schedule .performance-list>li.end .sales-status {
	display: none;
}

dl.performance-detail {
	display: table;
	width: 825px;
}
dl.performance-detail>dt {
	display: table-cell;
	width: 151px;
	text-align: center;
	border-right: 1px solid #e0e0e0;
	line-height: 1.0;
	vertical-align: middle;
}
dl.performance-detail>dt+dd {
	display: table-cell;
	vertical-align: middle;
}



dl.performance-detail dt .type {
	background-color: #e53935;
	color: #fff;
	padding: 0.3em 0.6em;
	line-height:1.0em;
	display: inline-block;
	font-size: 11px;
	margin-bottom:0.5em;
}
dl.performance-detail dt .date {
	font-weight: bold;
	font-size: 20px;
	margin-bottom:0.3em;
}
dl.performance-detail dt .week {
	font-size: 12px;
}
dl.performance-detail .detail_inner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 1.0em;
}

dl.performance-detail .open-start {
	width: 90px;
}
dl.performance-detail .place {
	width: 437px;
	font-size: 18px;	
	line-height: 1.4em;
}
dl.performance-detail .sales-status {
	width: 120px;
	text-align: center;
}
	dl.performance-detail .sales-status dt {
		border: 1px solid #a0a0a3;
		padding: 0.3em 0.3em;
		line-height: 1.0em;
		margin-bottom: 0.2em;
	}
	/* 発売中 */
	dl.performance-detail .sales-status dd.nowonsale {
		color: #e91e63;
		font-weight: bold;
		font-size: 14px;
	}



@media screen and (max-width: 640px) {
	.performance-schedule .heading-accordion {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		background-color: #212121;
		font-size: 20px;
		color: #fff;	
		cursor: pointer;
	}
	.performance-schedule .heading-accordion .icon-toggle {
		line-height: 0.0;
	}
	dl.performance-detail {
		width: 100%;
	}
	.widely dl.performance-detail>dt {
		width: 151px;
		/* 'YY/MM/DD(6ケタ)表示、「ファイナル公演」などタグがあるときのスマホの横幅 */
	}
	.normally dl.performance-detail>dt {
		width: 90px;
	}
	dl.performance-detail .detail_inner {
		display: block;
		padding: 0 1.0em;
	}
	dl.performance-detail .open-start {
		width: auto;
		margin-bottom: 0.3em;
	}
	dl.performance-detail .open-start li {
		display: inline-block;
	}
	dl.performance-detail .place {
		width: auto;
	}
	dl.performance-detail .sales-status {
		width: auto;
		text-align: left;
		line-height: 1.0em;
		margin-top: 0.5em;
	}
	dl.performance-detail .sales-status dt {
		font-size: 12px;
	}
	dl.performance-detail .sales-status dt,
	dl.performance-detail .sales-status dd {
		display: inline-block;
	}
}



/* =============================================================================
　お気に入り登録
========================================================================== */
/* .favorite {} */

.sub-column article h2 {
	font-size: 20px;
	padding: 0.5em 0.8em;
	border-bottom: 2px solid #212121;
}
.sub-column .block .block_inner {
	display: block;
	padding: 14px;
}

/* Disc情報 */
.disc-info .disc_image {
	text-align: center;
	margin-bottom: 14px;
}
.disc-info dt {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0.2em;
}

/* プロフィール */
/* .profile {} */
	.profile .profile_name{
		font-size: 18px;
		font-weight: bold;
		margin-bottom: 0.2em;
	}

/* ファンクラブ入会 */
/* .fanclub-info {} */
.fanclub-info .fc_title {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0.2em;
}
.fanclub-info .fc_image {
	text-align: center;
	margin-bottom: 14px;
}

.btn-block {
	margin-top: 14px;
	padding: 0 16px;
}
	/* ボタン */
	.btn_gray:link {
		display: block;
		color: #333;
		background-color: #f5f5f5;
		border-radius: 4px;
		font-size: 14px;
		font-weight: bold;
		padding: 1.0em;
		box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.24);
		text-align: center;
		-webkit-transition:	all 0.3s ease;
		transition:all 0.3s ease;
	}
	.btn_gray:visited {
		color: #333;
	}
	.btn_gray:hover {
		opacity: 0.6;
		text-decoration: none;
	}

/* =============================================================================
   PC/SP 表示出し分け
   ========================================================================== */
.pc_inline {display:inline;}
.pc_block {display:block;}
.sp_inline,.sp_block{display:none;}

@media screen and (max-width: 640px) {
	.pc_inline,.pc_block {display:none;}
	.sp_inline {display:inline;}
	.sp_block {display:block;}
}


