

@charset "UTF-8";

/* =============================================

Page Common CSS

================================================ */

/* Reset */
#contents h1,h2,h3,h4,h5,h6,p,blockquote,ul,ol,dl,li,dt,dd,form {margin:0px;padding:0px;}
#contents li,dt,dd {list-style:none;}
#contents img {border:none;}

/* Utility Class */
#contents .tL {text-align:left !important;}
#contents .tR {text-align:right !important;}
#contents .tC {text-align:center !important;}
#contents .fL {float:left !important;}
#contents .fR {float:right !important;}
#contents .mb00 {margin-bottom:0 !important;}
#contents .mb05 {margin-bottom:5px !important;}
#contents .mb10 {margin-bottom:10px !important;}
#contents .mb15 {margin-bottom:15px !important;}
#contents .mb20 {margin-bottom:20px !important;}
#contents .mb25 {margin-bottom:25px !important;}
#contents .mb30 {margin-bottom:30px !important;}
#contents .mb40 {margin-bottom:40px !important;}
#contents .fz10 {font-size:10px !important;}
#contents .fz11 {font-size:11px !important;}
#contents .fz12 {font-size:12px !important;}
#contents .fz14 {font-size:14px !important;}
#contents .fz16 {font-size:16px !important;}
#contents .fwB {font-weight:bold !important;}


/* Link */
#contents a:link {color:#3366CC;}
#contents a:visited {color:#3366CC;}
#contents a:hover {color:#d00;text-decoration:none;}
#contents a:active {color:#d00;}

/* Table */
#contents table {
	border-collapse:collapse;
}
	#contents caption {}
	#contents th,
	}
	#contents td {
		color:#333;
		padding:8px;
	}

/* Note */
#contents .note {font-size:12px;}

/* Clearfix */
#contents .clearfix {
	zoom:100%;
}
#contents .clearfix:after {
	content:"";
	clear:both;
	height:0;
	display:block;
	visibility:hidden;
}

/* TOP */
#contents{
  background-color: #fff;
  }

/* TOP */
#contents.top h2 {
	background-color: #000;
	font-size: 24px;
	padding: 15px 15px 10px;
}
#contents.top th {background-color:#000;}


/* ======== Media Queries 769px ====== */
@media screen and (max-width: 769px) {

	#contents.top h2 {
	font-size: 20px;
	padding: 10px 15px 5px;
	}

/* ======== Media Queries End ====== */
}


#contents {
	color:#333;
	font-size:14px;
	line-height:1.5em;
	padding:0 0 12px;
	background-color:#fff;
}
	#contents .section {
		margin:0 12px 20px;
	}
		#contents .article {
			padding:20px;
			background-color:#fff;
		}


#contents a.btn_yellow {
	color:#6e3a08;
	border:1px solid #6e3a08;
	background: #ffc579;
	background: -moz-linear-gradient(top,  #ffc579 0%, #fb9d23 100%);
	background: -webkit-linear-gradient(top,  #ffc579 0%,#fb9d23 100%);
	background: linear-gradient(to bottom,  #ffc579 0%,#fb9d23 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc579', endColorstr='#fb9d23',GradientType=0 );
	border-radius:8px;
	display:inline-block;
	text-align:center;
	padding:10px 18px;
}


/* =============================================

Page  CSS

================================================ */


/* ■ヘッダー告知 */
.promotionArea{
	border:5px solid #18978c;
	background:#FFFFFF;
}
.promotionArea .title{
	font-size:36px;
	font-weight:bold;
	text-align:center;
	color:#FFFFFF;
	background:#18978c;
	padding:16px 0px 20px 0px;
}
.promotionArea .photo{
	width:480px;
	float:left;
}
.promotionArea .photo img{
	max-width:480px;
}

.promotionArea .text{
	width:420px;
	padding:12px;
	float:right;
}
.promotionArea .text dd{
	padding-bottom:6px;
}
.promotionArea .text dt span{
	color:#DD0000;
}



/* ■タイトル */
#contents.top p.title {
	margin-bottom:0;
}

/* 当日券販売方法について */
#contents.top p.btn.sales-today {
	background-color:#000;
	text-align:center;
	padding-bottom:1.0em;
}
#contents.top p.btn.sales-today a {
	font-size:30px;
	line-height:1.0em;
	display:inline-block;
	text-align:center;
	color:#61400f;
	border:1px solid #ac8a02;
	border-radius:5px;
	padding:10px 36px 20px;
	background: #ffffff;
	background: -moz-linear-gradient(top,  #ffffff 0%, #fce6ae 2%, #f8b707 100%);
	background: -webkit-linear-gradient(top,  #ffffff 0%,#fce6ae 2%,#f8b707 100%);
	background: linear-gradient(to bottom,  #ffffff 0%,#fce6ae 2%,#f8b707 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f8b707',GradientType=0 );
}
#contents.top p.btn.sales-today a:hover {
	opacity:0.9;
}
#contents.top p.btn.sales-today a span {
	font-size:16px;
	line-height:1.4em;
}




/* ======== Media Queries 769px ====== */
@media screen and (max-width: 769px) {

#contents.top p.title {
	margin:10px 10px 0;
}
#contents.top p.btn.sales-today {
	margin:0 10px;
	padding-top:1.0em;
}
#contents.top p.btn.sales-today a {
	font-size:20px;
	line-height:1.0em;
	display:block;
	border-radius:5px;
	padding:5px 10px 10px;
	margin:0 15px;

}

/* 当日券販売方法について */
#contents.top p.btn.sales-today a span {
	font-size:12px;
	line-height:1.4em;
}
	#contents.top ul.Performance {
		display:block;
		margin:0 10px 1.0em;
		background-color:#000;
	}
		#contents.top ul.Performance>li {
			display:block;
			width:auto;
		}
		#contents.top ul.Performance li {
			margin-bottom:7px;
		}
		#contents.top ul.Performance li:last-child {
			margin-bottom:0;
		}
		

	#contents.top ul.Performance dt {
		float:left;
		width:50%;
		text-align:right;
		background-color:#000;
	}
	#contents.top ul.Performance dt+dd {
		width:50%;
		float:right;
		background-color:#000;
	}
	#contents.top ul.Performance dd.period {
		clear:both;
	}

	#contents.top ul.Performance ul.anchorlink li {
		display:inline-block;
		font-size:12px;
		padding-left:10px;
		margin-right:0.5em;
	}
	#contents.top ul.Performance p.btn {
		padding:0 8px;
	}


/* ======== Media Queries End ====== */
}


/* ■メインビジュアル */
#contents #mainimage {
	margin-bottom:0;
	text-align:center;
}

/* パンくず */
#contents p.breadcrumb {
	background-color:#fff;
	margin:0;
	color:#333;
	font-size:12px;
	padding-bottom:0.5em;
	
}


/* ■アンカー */

/* index.html */
#contents ul.anchor {
	display:table;
	width:932px;
	border:1px solid #9dd5fa;
	background-color:#fff;
	margin-bottom:20px;
}
	#contents ul.anchor li {
		display:table-cell;
		vertical-align:middle;
		width:186px;
		border-right:1px solid #9dd5fa;
	}
/*
	#contents ul.anchor li:nth-child(-n+2) {
		width:310px;
		border-bottom:1px solid #9dd5fa;
	}
	#contents ul.anchor li:nth-child(n+4) {
		width:232px;
	}
	#contents ul.anchor li:last-child {
		width:233px;
	}
*/
	#contents ul.anchor li:nth-child(3) {
		font-size:12px;
	}
	#contents ul.anchor li:last-child {
		border-right:none;
		width:184px;
	}
		#contents ul.anchor li a {
			text-align:center;
			padding:20px 10px;
			display:block;
			color:#fff;
			background: #009afc;
			background: -moz-linear-gradient(top,  #009afc 0%, #001757 100%);
			background: -webkit-linear-gradient(top,  #009afc 0%,#001757 100%);
			background: linear-gradient(to bottom,  #009afc 0%,#001757 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009afc', endColorstr='#001757',GradientType=0 );
			}
		#contents ul.anchor li a:hover {
			opacity:0.8;
		}
			#contents ul.anchor li a span {
				background:transparent url("icn_anchor01.png") no-repeat left center;
				padding-left:18px;
			}




	/* 注釈 */
	#contents .precede ul.note {
		text-align:center;
		color:#333;
	}



/* 見出し */
#contents h2 {
	font-size:24px;
	color:#fff;
	line-height:1.2em;
	background-color:#000;
	border-bottom:4px solid #333;
	padding:10px 15px 5px;

/* フェーズ1カラー
	background-color:#b81b2c;
	border-bottom:4px solid #931623;
	padding:10px 15px;
*/
}

#contents h3 {
	font-size:22px;
	color:#489469;
	line-height:1.2em;
	margin-bottom:20px;
}



/* ■開催情報 */
#contents .information {}
	#contents .information p {
		margin-bottom:1.0em;
	}
	#contents .information p.lead {
		font-size:22px;
		color:#489469;
		line-height:1.2em;
		margin-bottom:20px;
	}
	#contents .information p.photo {
		float:right;
	}
	#contents .information .detail {
		float:left;
		margin-bottom:1.0em;
	}

	#contents .information .detail .period {
		font-weight:bold;
		margin-bottom:20px;
		font-size:18px;
		line-height:1.5em;
	}



	/* 注釈 */
	#contents .information ul.note {
		font-size:12px;
		margin-bottom:15px;
		line-height:1.4em;
	}
	#contents .information .detail ul.note em{
		color:#d00;
		font-weight:normal;
	}



	/* 公演スケジュール */
	#contents .information .schedule {
		clear:both;
		margin-bottom:30px;
	}
		#contents .information .schedule h4 {
				font-size:24px;
				color:#489469;
				text-align:left;
				padding-bottom:10px;		
		}


/* ======== Media Queries 769px ====== */
@media screen and (max-width: 769px) {

.pc {display:none;}
.smp {display:inline;}


/* ■ヘッダー告知 */
.promotionArea{
	border:5px solid #18978c;
	background:#FFFFFF;
}
.promotionArea .title{
	font-size:21px;
	line-height:130%;
	font-weight:normal;
	padding:6px 6px 10px 6px;
}
.promotionArea .photo{
	width:auto;
	float:none;
	text-align:center;
}
.promotionArea .photo img{
	max-width:100%;
}
.promotionArea .text{
	width:auto;
	padding:12px;
	float:none;
}
.promotionArea .text dd:last-child{
	padding-bottom:0px;
}

h1.heading01 {
	background-color:#fff;
}

#contents {}

#contents .article {
	padding:10px;
}


/* 見出し */
#contents h2 {
	font-size:20px;
	padding:5px 10px;
	line-height:1.2em;
}

#contents p.breadcrumb {
	margin:0;
	font-size:12px;
	padding:0.5em;
}

#contents #mainimage {
	margin-bottom:0;
	background-color:#000;
}


/* ■アンカー */
#contents ul.anchor {
	display:flex;
	width:auto;
	flex-wrap:wrap;
	border-bottom:none;
}

	#contents ul.anchor li:nth-child(-n+3) {}
	#contents ul.anchor li:nth-child(n+4) {}
	#contents ul.anchor li:last-child {
		width:auto;
	}
	#contents ul.anchor li:nth-child(2n){
		width:50%;
	}
	#contents ul.anchor li:nth-child(2n+1){
		width:50%;
	}
	#contents ul.anchor li:first-child {
		width:100%;
	}
		#contents ul.anchor li a {
			padding:14px 1px;
			display:block;
			background:none;
			border-right:1px solid #9dd5fa;
			}
		#contents ul.anchor li:nth-child(2n+1) a {
			border-right:0;
		}

	#contents ul.anchor li {
		display:block;
		width:50%;
		border-right:none;
		background: #009afc;
		background: -moz-linear-gradient(top,  #009afc 0%, #001757 100%);
		background: -webkit-linear-gradient(top,  #009afc 0%,#001757 100%);
		background: linear-gradient(to bottom,  #009afc 0%,#001757 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009afc', endColorstr='#001757',GradientType=0 );
		border-bottom:1px solid #9dd5fa;
	}
	#contents ul.anchor li:nth-child(3) {
		font-size:12px;
	}




/* ■開催情報 */
#contents .information {}
	#contents .information p.lead {
		font-size:18px;
		margin-bottom:18px;
	}
	#contents .information p.photo {
		display:none;
	}
	#contents .information .detail {
		float:none;
	}

	#contents .information .detail .period {
		margin-bottom:1.0em;
		font-size:14px;
	}

	#contents .information p {
		margin-bottom:1.0em;
	}



/* ■公演 */
#contents .performance {
	margin-bottom:-12px;
}
	#contents .performance .article {
		background-color:transparent;
	}
	#contents .performance ul {
		display:table;
		table-layout:fixed;
		width:100%;
	}
		#contents .performance li {
			display:table-cell;
			width:auto;
		}
		#contents .performance li:last-child {
			width:auto;
		}
		#contents .performance li img {
			max-width:100%;
		}

/* ======== Media Queries End ====== */
}

h1.heading01{
	color:#FFFFFF;
}
p.lead strong.caution{
	color:#c00000;
}
#contents ul li {
	text-indent:-1.0em;
	padding-left:1.0em;
}

/* 当日券販売方法について */
#contents .section.tickets-today {
	margin-top:10px;
	}

#contents .section.tickets-today h2 {
	font-size:30px;
	font-weight:bold;
	border-bottom:none;
	background-color:#fff;
	color:#333;
}



.section.tickets-today p.lead {
	margin-bottom:1.0em;
	font-size:16px;
	text-align:center;
}
.section.tickets-today p.lead a {
	padding:0 0.3em;
	font-weight:bold;
	font-size:1.4em;
}
.section.tickets-today ul.point {
	margin-bottom:2.0em;
}

#contents .section.tickets-today ul.point li.indent {
	text-indent:-7.0em;
	padding-left:7.0em;
}

/* 公演期間、会場 */
.section.tickets-today ul.date {
	font-size:20px;
	line-height:1.5em;
	font-weight:bold;
	text-align:center;
	padding:10px 0;
	background-color:#ffe5e2;
	border-radius:5px;
}
.section.tickets-today ul.date li {
	display:inline-block;
	margin-right:1.0em;
}
.section.tickets-today ul.date li:last-child {
	display:inline-block;
}

/* ①公演前日《WEB販売》 */
.section.sale-web {}
	.section.sale-web p.lead {
		margin-bottom:1.0em;
		font-size:14px;
	}
	.section.sale-web ul li em {
		color:#c00000;
	}
	.section.sale-web p.btn {
		margin:2.0em 0 1.0em;
		text-align:center;
	}
	#contents p.btn a.btn_yellow {
		font-size:30px;
		padding:20px 50px;
	}
	.section.sale-web ul.notes {
		margin-bottom:1.0em;
	}


/* ②公演当日《窓口販売》 */
.section.sale-window {
	margin-bottom:0 !important;
}
	.section.sale-window p.lead {
		margin-bottom:1.0em;
		font-size:18px;
	}
	.section.sale-window ul.notes {
		margin-bottom:1.0em;
	}
	.section.sale-window ul li em {
		color:#c00000;
	}
	.section.sale-window ul.point {
		margin-bottom:1.5em;
	}


	.sale-window dl.guide {
		padding-left:1.0em;
		font-size:18px;
	}
	.sale-window dl.guide dt {
		font-weight:bold;
		display:inline-block;
	}
	.sale-window dl.guide dt:after {

	}
	.sale-window dl.guide dd {
		display:inline-block;
	}
	.sale-window dl.guide dd:before {
		content:" ≫ ";
	}



/* ======== Media Queries 769px ====== */
@media screen and (max-width: 769px) {

#contents h2 {
	font-size:16px;
}

#contents .section.tickets-today h2 {
	font-size:22px;
	padding-top:10px;
}

#contents .section.tickets-today h2.midashi {
	font-size:16px;
	padding-top:20px;
}

.section.tickets-today p.lead {
	margin-bottom:1.0em;
	font-size:14px;
	text-align:left;
}
.section.tickets-today p.lead a {
	padding:0;
	font-weight:bold;
}
.section.tickets-today p.lead a {
	font-size:1.2em;
}

/* 公演期間、会場 */
.section.tickets-today ul.point {
	margin-bottom:1.0em;
}
.section.tickets-today ul.date {
	font-size:14px;
	text-align:left;
	padding:5px 10px;
}
#contents .section.tickets-today ul.date li {
	display:block;
	margin-right:0;
	text-indent:0;
	padding-left:0;
}
.section.tickets-today ul.date li:last-child {
	display:block;
}
#contents .section.tickets-today ul.point li.indent {
	text-indent:0em;
	padding-left:0em;
}

/* ①公演前日《WEB販売》 */
.section.sale-web p.lead {
	font-size:14px;
}
	.section.sale-web p.btn {
		margin:2.0em 0 0;
	}
	#contents p.btn a.btn_yellow {
		font-size:24px;
		padding:15px 10px;
		display:block;
	}

/* ②公演当日《窓口販売》 */
	.section.sale-window p.lead {
		font-size:16px;
	}

	.sale-window dl.guide {
		padding-left:0;
		font-size:16px;
	}
	.sale-window dl.guide {
		text-align:center;
	}
	.sale-window dl.guide dt {
		font-weight:bold;
		display:inline-block;
	}
	.sale-window dl.guide dt:after {
	}
	.sale-window dl.guide dd {
		display:block;
	}
	.sale-window dl.guide dd:before {
		content:"≫ ";
	}


/* ======== Media Queries 769px ====== */
}


/*1223追加 */

div#format div.contentboxwrap {;
	background: #FFF;
}
.contentboxwrap:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}

div.contentbox {
	width: 350px;
	margin: 5px 5px 10px 0;
	float: left;
	zoom: 1;
	}
	
div.contentbox_bottom {
	width: 350px;
	margin: 5px 5px 10px 0;
	float: left;
	zoom: 1;
	border-bottom:1px dotted #cccccc;
	}
	


div.contentbox .snstitle {
width: 335px;
margin: 0px 10px 10px 0;
padding:5px 0 5px 5px;
	float: left;
	zoom: 1;
	background-color:#f5f5f5;
	border-bottom: 1px solid #188982;
	color:#188982;
	}


div.contentbox .snstitle_area {
width: 335px;
margin: 0px 10px 10px 0;
padding:5px 0 5px 5px;
	float: left;
	zoom: 1;
	background-color:#f5f5f5;
	border-bottom: 1px solid #7387C4;
	color: #7387C4;
	}
	
	
	
div.contentbox .snstitle_carapo {
width: 335px;
margin: 0px 10px 10px 0;
padding:5px 0 5px 5px;
	float: left;
	zoom: 1;
	background-color:#f5f5f5;
	border-bottom: 1px solid #C68E46;
	color:#C68E46;
	}
	
	
	
div.contentbox .snstitle_genre {
width: 335px;
margin: 0px 10px 10px 0;
padding:5px 0 5px 5px;
	float: left;
	zoom: 1;
	background-color:#f5f5f5;
	border-bottom: 1px solid #D22932;
	color:#D22932;
	}
	
div.contentbox .snstitle_hmvbooks {
width: 335px;
margin: 0px 10px 10px 0;
padding:5px 0 5px 5px;
	float: left;
	zoom: 1;
	background-color:#f5f5f5;
	border-bottom: 1px solid #333;
	color:#333;
	}

/* 
.contentbox:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
*/

* html .contentbox             { zoom: 1; } /* IE6 */
*:first-child+html .contentbox { zoom: 1; } /* IE7 */


div.contentbox img.gazou {
	width: 100px;
	height: 100px;
	float: left;
	margin:0px;
	margin-bottom:10px;
}

div.contentbox_bottom img.gazou {
	width: 100px;
	height: 100px;
	float: left;
	margin-bottom:10px;
	
}

div.contentbox div.text {
	width: 240px;
	float: right;
	font-size:14px;
	
}

div.contentbox_bottom div.text {
	width: 240px;
	float: right;
	font-size:14px;
	
}
div.contentbox div.text p {
	margin: 0px;
	font-size:14px;
	font-weight:bold;
}

div.contentbox_bottom div.text p {
	margin: 0px;
	font-size:14px;
	font-weight:bold;
}


div.contentbox div.text p.text-s {
	padding:0 10px 0 0;
	font-size:12px;
	font-weight:normal;
}

div.contentbox_bottom div.text p.text-s {
	padding:0 10px 0 0;
	font-size:12px;
	font-weight:normal;
}


#static{
	width:934px;
	padding:0;
	margin:0 auto;
	font-size:75%;
}

#contents p.main{
	font-size:x-small;
}

#contents p{
	margin-bottom:20px;
}
#contents p.main{
	text-align:center;
}

#contents p.main img{
	margin:5px auto;
	display:block;
}
#contents ul.relatedlinks{
	list-style-type:disc!important;
}
#contents ul.relatedlinks li{
	float:left;
	margin-right:1em;
}



/*0112追加 */


@media screen and (min-width:600px){
  /*600px以上で適用する内容*/



div.contentbox {
	width: 350px;
	height:16em;
	overflow:hidden;
	margin: 5px 5px 10px 0;
	float: left;
	zoom: 1;
	}
	
}




