@charset "utf-8";
/* CSS Document */
/*==============================*/
/* タブメニュー */
/*==============================*/
.container { 
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	padding: 30px 0 40px 0;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #d2ffee 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #ffffff 0%,#d2ffee 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #ffffff 0%,#d2ffee 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d2ffee',GradientType=0 ); /* IE6-9 */
}
.container .bx-prev, .container .bx-next{ display: none;}

/* ======= PC =======*/
@media (min-width: 1025px) {
	.container .slide_all { width: 1000px; margin: 0 auto; height: 480px; position: relative; }
	.container .slide_wrap { width: 3000px; position: absolute; left: 50%; margin-left: -1500px; }
	.container .slide_body { width: 100%;}
	.container .slide { width: 1000px; line-height: 480px; text-align: center; position: relative;}
	.container .bx-wrapper .bx-pager{ margin-left: 25px; }
	.container .bx-wrapper .bx-viewport { box-shadow: none; border: none; }
	.container .bx-prev { position: absolute; left: 50%; margin-left: -490px; }
	.container .bx-next { position: absolute; right: 50%; margin-right: -535px; }
	.bx-controls { position: absolute; bottom: -15px;  left: 50%; margin-left: -51%; z-index: 9;width: 100%; }
}

/* ======= TB =======*/
@media screen and (min-width: 768px) and (max-width: 1024px){
	.container .slide_all { height: 30%; }
	.container .slide {  line-height: 30%; text-align: center; position: relative;}
	.bx-controls { position: absolute; bottom: -20px;  left: 50%; margin-left: -51%; z-index: 9;width: 100%; }
}

/* ======= SP =======*/
@media (max-width: 767px){
	.container .slide_all { width: 100%; height: 420px; }
	.container .slide { line-height: 420px; text-align: center; position: relative;}
	.container .slide img{ width: auto; height: 400px; margin:0 auto; display:block; }
	.container { 
		padding: 40px 10px 30px 10px;
		background: #ffffff; /* Old browsers */
		background: -moz-linear-gradient(top,  #ffffff 0%, #d4ffee 43%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #ffffff 0%,#d4ffee 43%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #ffffff 0%,#d4ffee 43%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d4ffee',GradientType=0 ); /* IE6-9 */
	}
	.bx-controls { position: absolute; bottom: -8px;  left: 50%; margin-left: -51%; z-index: 9;width: 100%; }
}
	

/*==============================*/
/* エッセイ */
/*==============================*/
div.wrauWeb{
	max-width: 920px;
	margin: 0 auto;
	padding: 28px 24px 24px 0px;
	background: #FAF7F7 url("/common/img/share/bg_texture.png");
	border: 1px solid #E4E4E4;
	border-radius: 8px;
}


/*-- 日付
------------------------- */
div.wrauWeb div.wrauWeb-title{
	display: flex; display: -webkit-flex;
	align-items: center; -webkit-align-items: center;
	margin-bottom: 16px;
	padding-left: 24px;
	border-left: 6px solid #F2BB2A;
}

/*--  -- */
div.wrauWeb div.wrauWeb-title h2{
	color: #F2BB2A;
	font-size: 26px;
	font-weight: 600;
	font-family: "Noto Sans Japanese";
	line-height: 1.618em;
}
div.wrauWeb div.wrauWeb-title h2 span{
	position: relative; top: -4px;
	display: inline-block;
	margin-left: 8px;
	color: #000;
	font-size: 16px;
	font-weight: 600;
	line-height: 1em;
}
div.wrauWeb div.wrauWeb-title h2 span small{
	display: block;
	font-size: 12px;
	line-height: 1em;
}

/*--  -- */
div.wrauWeb div.wrauWeb-title h3{
	position: relative;
	margin-left: 16px;
	padding-left: 14px;
	color: #737373;
	font-size: 19px;
	font-weight: 500;
	font-family: "Noto Sans Japanese";
	letter-spacing: -0.03em;
}
div.wrauWeb div.wrauWeb-title h3::before{
	position: absolute; top: 50%; left: 0;
	content: "";
	width: 1px;
	height: 28px;
	background: #B3B3B3;
	transform: rotate(20deg);
	margin-top: -13px;
}

	/* ======= SP =======*/
	@media (max-width: 767px){
		div.wrauWeb div.wrauWeb-title{
			flex-direction: column; -webkit-flex-direction: column;
			align-items: flex-start; -webkit-align-items: flex-start;
			margin-bottom: 18px;
			padding-left: 16px;
			border-left: 5px solid #F2BB2A;
		}

		/*--  -- */
		div.wrauWeb div.wrauWeb-title h2{
			color: #F2BB2A;
			font-size: 26px;
			line-height: 1.618em;
		}
		div.wrauWeb div.wrauWeb-title h2 span{
			position: relative; top: -4px;
			display: inline-block;
			margin-left: 8px;
			color: #000;
			font-size: 16px;
			font-weight: 600;
			line-height: 1em;
		}
		div.wrauWeb div.wrauWeb-title h2 span small{
			display: block;
			font-size: 12px;
			line-height: 1em;
		}

		/*--  -- */
		div.wrauWeb div.wrauWeb-title h3{
			margin-left: 0px;
			padding-left: 0px;
			font-size: 16px;
			line-height: 1.3em;
		}
		div.wrauWeb div.wrauWeb-title h3::before{ display: none;}
	}


/*-- 日付
------------------------- */
div.wrauWeb div.wrauWeb-content{ padding-left: 32px;}
div.wrauWeb div.wrauWeb-content article{
	padding: 16px 24px 16px 16px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 4px 4px 6px -3px rgba(153,153,153,0.7);
}
div.wrauWeb div.wrauWeb-content dl{
	position: relative;
	display: flex; display: -webkit-flex;
	align-items: center; -webkit-align-items: center;
	padding-right: 120px;
}
div.wrauWeb div.wrauWeb-content dl dt{
	order: 2;
	margin-left: 16px;
	font-size: 19px;
	font-weight: 500;
	line-height: 1.3em;
	font-family: "Noto Sans Japanese";
	letter-spacing: -0.02em;
}
div.wrauWeb div.wrauWeb-content dl dt small{
	display: block;
	color: #787878;
	line-height: 1.3em;
	letter-spacing: -0.01em;
	font-size: 16px;
	font-family: 'Roboto', sans-serif;
	
}

div.wrauWeb div.wrauWeb-content dl dd:nth-child(2){ order: 1;}
div.wrauWeb div.wrauWeb-content dl dd:nth-child(2) img{
	border: 1px solid #E4E4E4;
	border-radius: 6px;
}
div.wrauWeb div.wrauWeb-content dl dd:nth-child(3){order: 3;}
div.wrauWeb div.wrauWeb-content dl dd:nth-child(3) a{
	display: block;
	padding: 7px 0 6px 0;
	width: 96px;
	border: 1px solid #DEDEDE;
	font-size: 13px;
	text-align: center;
	line-height: 1.3em;
	border-radius: 3px;
}
div.wrauWeb div.wrauWeb-content dl dd:nth-child(3) a:hover{
	background: #2A8B8B;
	color: #fff;
}


	/* ======= SP以上 =======*/
	@media (min-width: 768px){
		div.wrauWeb div.wrauWeb-content dl dd:nth-child(3){
			position: absolute; top: 50%; right: 0;
			margin-top: -15px;
		}
	}
	/* ======= SP =======*/
	@media (max-width: 767px){
		div.wrauWeb div.wrauWeb-content{ padding-left: 24px;}
		div.wrauWeb div.wrauWeb-content article{
			padding: 20px;
		}
		div.wrauWeb div.wrauWeb-content dl{
			align-items: flex-start; -webkit-align-items: flex-start;
			flex-direction: column; -webkit-flex-direction: column;
			padding-right: 0px;
		}
		div.wrauWeb div.wrauWeb-content dl dt{
			margin-left: 0px;
			margin-bottom: 10px;
			font-size: 18px;
		}
		div.wrauWeb div.wrauWeb-content dl dt small{
			font-size: 15px;
		}

		div.wrauWeb div.wrauWeb-content dl dd:nth-child(2){ display: none;}
		div.wrauWeb div.wrauWeb-content dl dd:nth-child(3) a:hover{
			background: #2A8B8B;
			color: #fff;
		}
	}



/*==============================*/
/* タブメニュー */
/*==============================*/
.performanceDay_top{ position: relative;min-height: 85px;}
.performanceDay_top:before{
	position: absolute; top: 0px; left: 0;
	content: "";
	margin-left: calc(50% - 50vw) ;
	width: 99.4vw;
	height: 100%;
	display: block;
	background: #6BBB3D url("/common/img/share/bg_texture.png");
	z-index: 9;
}

ul.tab{
	position: relative;
	padding-bottom: 50px;
	background: #ecf5c8 url("/common/img/share/bg_texture.png");
	margin-top: -85px;
	padding-top: 130px;
	overflow-x: auto;
	overflow-y:inherit;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
}
ul.tab li{
	display: inline-block;
	width: 18.4%;
	margin: 0 10px;
}


/*-- 日付
------------------------- */
ul.tab li{ position: relative;}
ul.tab li:before{
	position: absolute; top: -130px; left: 50%;
	width: 100px;
	padding-top: 15px;
	margin-left: -50px;
	border-top: 8px solid #4a8b00;
	font-size: 30px;
	font-family:  "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	line-height: 1.1em;
	text-align: center;
	color: #fff;
	z-index: 90;
}
ul.tab li:nth-child(1):before{ content: "10/7";}
ul.tab li:nth-child(2):before{ content: "10/14";}
ul.tab li:nth-child(3):before{ content: "10/19";}
ul.tab li:nth-child(4):before{ content: "10/21";}
ul.tab li:nth-child(5):before{ content: "10/30";}
ul.tab li:nth-child(6):before{ content: "11/6";}
ul.tab li:nth-child(7):before{ content: "11/18";}
ul.tab li:nth-child(8):before{ content: "11/25";}
ul.tab li:nth-child(9):before{ content: "11/25";}
ul.tab li:nth-child(10):before{ content: "11/26";}
ul.tab li:nth-child(11):before{ content: "11/26";}
ul.tab li:nth-child(12):before{ content: "11/27";}
ul.tab li:nth-child(13):before{ content: "11/27";}
ul.tab li:nth-child(14):before{ content: "12/9";}
ul.tab li:nth-child(15):before{ content: "12/13";}
ul.tab li:nth-child(16):before{ content: "12/15";}
ul.tab li:nth-child(17):before{ content: "12/17";}
ul.tab li:nth-child(18):before{ content: "12/21";}
ul.tab li:nth-child(19):before{ content: "12/21";}
ul.tab li:nth-child(20):before{ content: "1/11";}
ul.tab li:nth-child(21):before{ content: "1/27";}
ul.tab li:nth-child(22):before{ content: "2/7";}
ul.tab li:nth-child(23):before{ content: "4/7";}

/*-- 曜日
------------------------- */
ul.tab li:after{
	position: absolute; top: -82px; left: 50%;
	width: 30px;
	margin-left: -15px;
	font-size: 12px;
	font-family: "Sawarabi Mincho";
	color: #fff;
	z-index: 90;
}
ul.tab li:nth-child(1):after{ content: "TUE";}
ul.tab li:nth-child(2):after{ content: "TUE";}
ul.tab li:nth-child(3):after{ content: "SUN";}
ul.tab li:nth-child(4):after{ content: "TUE";}
ul.tab li:nth-child(5):after{ content: "TUE";}
ul.tab li:nth-child(6):after{ content: "THU";}
ul.tab li:nth-child(7):after{ content: "TUE";}
ul.tab li:nth-child(8):after{ content: "TUE";}
ul.tab li:nth-child(9):after{ content: "TUE";}
ul.tab li:nth-child(10):after{ content: "WED";}
ul.tab li:nth-child(11):after{ content: "WED";}
ul.tab li:nth-child(12):after{ content: "THU";}
ul.tab li:nth-child(13):after{ content: "THU";}
ul.tab li:nth-child(14):after{ content: "TUE";}
ul.tab li:nth-child(15):after{ content: "SAT";}
ul.tab li:nth-child(16):after{ content: "MON";}
ul.tab li:nth-child(17):after{ content: "WED";}
ul.tab li:nth-child(18):after{ content: "SUN";}
ul.tab li:nth-child(19):after{ content: "SUN";}
ul.tab li:nth-child(20):after{ content: "SUN";}
ul.tab li:nth-child(21):after{ content: "TUE";}
ul.tab li:nth-child(22):after{ content: "SAT";}
ul.tab li:nth-child(23):after{ content: "TUE";}

/*-- 矢印
------------------------- */
ul.tab li a{ display: block; width: 100%;  position: relative;}
ul.tab li.active a:before{
	position: absolute; bottom: -50px;; left: 50%;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 30px 30px 30px;
	border-color: transparent transparent #4C4C4C transparent;
	margin-left: -30px;
}

.tab_menu .area{ display: none;}
#performance01,
#performance02,
#performance03,
#performance04,
#performance05,
#performance06,
#performance07,
#performance08,
#performance09{ display:none;}

	/* ======= SP =======*/
	@media (max-width: 767px){
		ul.tab li{
			width: 60%;
			margin: 0 10px;
		}
		
		/*-- 日付
		------------------------- */
		ul.tab li:before{  font-size: 25px; }
	}


/*==============================*/
/* タブコンテンツ */
/*==============================*/
.tabContent{
	background:#4C4C4C;
	padding-top: 40px;
	padding-bottom: 50px;
	color: #fff;
}
.top_performanceBox{
	position: relative;
	display: flex; display: -webkit-flex; /* Safari */
	justify-content: space-between; -webkit-justify-content: space-between; /* Safari */
	align-items: center; -webkit-align-items: center; /* Safari */
}

/*-- 詳細
------------------------- */
.top_performanceBox > dl{
	width: calc(calc(calc(100% - 166px) / 2) - 1.5%); 
}

.top_performanceBox > dl dt{
	padding: 16px 0 8px 0;
	margin-bottom: 16px;
	border-bottom: 1px solid #E5E5E5;
	display: flex; display: -webkit-flex; /* Safari */
	justify-content: space-between; -webkit-justify-content: space-between; /* Safari */
	align-items: flex-start; -webkit-align-items: flex-start; /* Safari */
}
.top_performanceBox > dl dt p.performanceBox_day{
	width: calc(84px - 1.5%);
	text-align: center;
	font-size: 28px;
	font-family:  "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	line-height: 0.9em;
}
.top_performanceBox > dl dt p.performanceBox_day small{
	display: block;
	font-size: 12px;
	font-family: "Sawarabi Mincho";
}
.top_performanceBox > dl dt h3{
	width: calc(calc(100% - 84px) - 1.5%);
	padding-bottom: 10px;
	font-size: 18px;
	font-family: "Noto Sans Japanese";
	line-height: 1.3em;
}
.top_performanceBox > dl dt h3 small{
	display: block;
	font-size: 13px;
	line-height: 1em;
	font-weight: 100;
}

/* 共通設定 */
.top_performanceBox > dl dd p{ line-height: 1.3em;}
/* 日程 */
.top_performanceBox > dl dd p.time{
	margin-bottom: 7px;
	font-size: 17px;
	font-weight: 500;
	font-family: "Noto Sans Japanese";
}
/* 会場 */
.top_performanceBox > dl dd p.venue{
	margin-bottom: 16px;
	padding-left: 3em; text-indent: -3em;
}
/* 出演者 */
.top_performanceBox > dl dd p.performer{
	margin-bottom: 4px;
	padding-left: 4em; text-indent: -4em;
}
/* チケット */
.top_performanceBox > dl dd p.ticket{
	padding-left: 5em; text-indent: -5em;
}

/* お問い合わせ */
.top_performanceBox dl dd ul.contactLink{
	position: absolute; top: 0; left: 540px; /* 対：top_performanceBox */
	width: 200px;
}
.top_performanceBox dl dd ul.contactLink > li{ margin-bottom: 8px; }
.top_performanceBox dl dd ul.contactLink > li:nth-child(3n) { margin-right: 0; }
.top_performanceBox dl dd ul.contactLink > li a{
	display: block;
	width: 100%;
	padding: 8px 0 6px 0;
	background: #2a8b8b;
	color: #fff;
	line-height: 1.3em;
	text-align: center;
	border-radius: 5px;
}
.top_performanceBox dl dd ul.contactLink li.telBtn label{
	display: block;
	width: 100%;
	cursor: pointer; 
	padding: 8px 0 6px 0;
	background: #2a8b8b;
	border-radius: 5px;
	line-height: 31px;
	text-align: center;
	color: #fff;
	margin: 0;
}
.top_performanceBox dl dd ul.contactLink li a small{
	display: block;
	font-size: 10px;
	line-height: 1.1em;
}

/*-- 電話コンテンツ
------------------------- */
.top_performanceBox dl dd div.telContent > div:not(:last-child){ margin-bottom: 25px;}
.top_performanceBox dl dd div.telContent p.telContent_title{
    position: relative;
    margin-bottom: 11px;
    padding-bottom: 5px;
    border-bottom: 1px dashed #ccc;
    padding-left: 20px;
    color: #2A8B8B;
    font-size: 16px;
    font-weight: 400;
    font-family: "Noto Sans Japanese";
}
.top_performanceBox dl dd div.telContent p.telContent_title:before{
    position: absolute; top: 0; left: 0;
    content: "■";
}
.top_performanceBox dl dd div.telContent ul{
    padding-left: 20px;
}
.top_performanceBox dl dd div.telContent ul li:not(:last-child){ margin-bottom: 6px;}
.top_performanceBox dl dd div.telContent ul li a{
    display: block;
    line-height: 1.3em;
}
.top_performanceBox dl dd div.telContent ul li a i{
    position: relative; top: -3px;
    margin-right: 8px;
    color: #ccc;
}
.top_performanceBox dl dd div.telContent ul li.telContent_url a i{
    position: relative; top: -1px;
}

/*-- 延期情報
------------------------- */
.top_performanceBox .cautionBox{margin-top: 16px;}

	/* ======= TB以下 =======*/
	@media(max-width: 1024px){
		.top_performanceBox{ flex-direction: column; -webkit-flex-direction: column;}
		
		/*-- 詳細
		------------------------- */
		.top_performanceBox > dl{
			width: 100%;
			margin-bottom: 25px;
		}

		/*-- お問い合わせ
		------------------------- */
		.top_performanceBox > div{
			width: 100%;
			margin-bottom: 25px;
		}
		.top_performanceBox > div h3{ padding: 2px 0 1px 0;}
		.top_performanceBox > div dl:not(:last-child){ margin-bottom: 10px;}
		.top_performanceBox > div dl dt{ width: 190px; font-size: 14px; }
		.top_performanceBox > div dl dd{ width: calc(calc(100% - 190px) - 1.5%); font-size: 14px;}

		/*-- ボタン
		------------------------- */
		.top_performanceBox .top_performanceBox_btn{ width: 100%;}
	}

	/* ======= TB =======*/
	@media screen and (min-width: 768px) and (max-width: 1024px){
		.top_performanceBox{padding: 0 50px;}
		
		/*-- ボタン
		------------------------- */
		.top_performanceBox .top_performanceBox_btn{ width: 50%; margin-top: 30px;}
	}

	/* ======= SP =======*/
	@media (max-width: 767px){
		.top_performanceBox{
			position:static;
		}
		.top_performanceBox dl dd > div{ margin-bottom: 16px; }
		.top_performanceBox dl dd ul.contactLink{
			position:static;
			width: 200px;
		}
	}


/*==============================*/
/* TOP　インフォメーション*/
/*==============================*/
.topInformation{
    padding: 24px;
    background: #FFFEF3;
    border: 1px solid #ccc;
}
.topInformation h2{
    border-bottom: 1px solid #ccc;
    padding-bottom: 4px;
    margin-bottom: 16px;
    font-size: 20px;
	font-weight: 400;
	font-family: "Noto Sans Japanese";
}
.topInformation dl dt{
	margin-bottom: 4px;
	color: #2E5F92;
    font-size: 16px;
	font-weight: 400;
	line-height: 1.2em;
	font-family: "Noto Sans Japanese";
}
.topInformation dl dt small{ display: block; }
.topInformation dl dd { font-size: 13px; }
.topInformation dl dd *{ font-size: 13px; }
.topInformation dl dd > p{ line-height: 1.618em; font-size: 13px; }

.topInformation > p br{ line-height: inherit; }
.topInformation > p{ line-height: 1.618em;}
.topInformation > p span{ line-height: 1.5em; }

.topInformation dl dd ul{
	overflow-y: scroll;
	max-height: 176px;
	padding: 24px;
	border: 1px solid #ccc;
	border-radius: 8px;
	background: #fff;
}

/* ======= SP =======*/
@media (max-width: 767px){
    .topInformation{
        margin-top: 64px;
        padding: 20px;
    }
    .topInformation h2{
        border-bottom: 1px solid #ccc;
        padding-bottom: 4px;
        margin-bottom: 16px;
        font-size: 18px;
    }
    .topInformation dl dt{ font-size: 17px;}
    .topInformation dl:nth-child(1) dt{ margin-bottom: 8px;}
    .topInformation dl:nth-child(2) dt{ margin-bottom: 4px;}
}