@charset "utf8";

/* IconFont
-------------------------------------------------- */
@font-face {
	font-family: 'shiki_menu';
	src:  url('/shared/fonts/shiki_menu.eot?ufqzl3');
	src:  url('/shared/fonts/shiki_menu.eot?ufqzl3#iefix') format('embedded-opentype'),
	url('/shared/fonts/shiki_menu.ttf?ufqzl3') format('truetype'),
	url('/shared/fonts/shiki_menu.woff?ufqzl3') format('woff'),
	url('/shared/fonts/shiki_menu.svg?ufqzl3#shiki_menu') format('svg');
	font-weight: normal;
	font-style: normal;
}
[class^="menuIcon-"], [class*=" menuIcon-"] {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'shiki_menu' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.menuIcon-accordion1_L:before {
	content: "\e921";
}
.menuIcon-accordion2_L:before {
	content: "\e922";
}
.menuIcon-arrow_L:before {
	content: "\e923";
}
.menuIcon-minus_L:before {
	content: "\e924";
}
.menuIcon-namelink_L:before {
	content: "\e925";
}
.menuIcon-plus_L:before {
	content: "\e926";
}
.menuIcon-accordion1:before {
	content: "\e900";
}
.menuIcon-accordion2:before {
	content: "\e901";
}
.menuIcon-arrow:before {
	content: "\e902";
}
.menuIcon-camera:before {
	content: "\e903";
}
.menuIcon-character:before {
	content: "\e904";
}
.menuIcon-close:before {
	content: "\e905";
}
.menuIcon-crown:before {
	content: "\e906";
}
.menuIcon-event:before {
	content: "\e907";
}
.menuIcon-gallery:before {
	content: "\e908";
}
.menuIcon-hammer:before {
	content: "\e909";
}
.menuIcon-harp:before {
	content: "\e90a";
}
.menuIcon-home:before {
	content: "\e90b";
}
.menuIcon-info:before {
	content: "\e90c";
}
.menuIcon-menu:before {
	content: "\e90d";
}
.menuIcon-minus:before {
	content: "\e90e";
}
.menuIcon-namelink:before {
	content: "\e90f";
}
.menuIcon-news:before {
	content: "\e910";
}
.menuIcon-note:before {
	content: "\e911";
}
.menuIcon-onpu:before {
	content: "\e912";
}
.menuIcon-pen:before {
	content: "\e913";
}
.menuIcon-phone:before {
	content: "\e914";
}
.menuIcon-phonetitle:before {
	content: "\e915";
}
.menuIcon-plus:before {
	content: "\e916";
}
.menuIcon-price:before {
	content: "\e917";
}
.menuIcon-pricetitle:before {
	content: "\e918";
}
.menuIcon-schedule:before {
	content: "\e919";
}
.menuIcon-scheduletitle:before {
	content: "\e91a";
}
.menuIcon-seat:before {
	content: "\e91b";
}
.menuIcon-stagelist:before {
	content: "\e91c";
}
.menuIcon-stagemenu:before {
	content: "\e91d";
}
.menuIcon-story:before {
	content: "\e91e";
}
.menuIcon-ticket:before {
	content: "\e91f";
}
.menuIcon-voice:before {
	content: "\e920";
}
.textBold {
	font-weight: bold;
}
.textRed {
	color: #c3303c;
}
body {
	color: #333;
}
a:hover {
	text-decoration: none;
}
/* breadcrumb
-------------------------------------------------- */
.breadcrumb {
	padding-left: 13px;
	padding-top: 10px;
}
.breadcrumbList {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.breadcrumbListItems {
	line-height: 1;
}
a.breadcrumbLink {
	display: inline-block;
	color: #333;
	font-size: 14px;
}
a.breadcrumbLink:hover {
	color: #c3303c;
}
.breadcrumbLinkCurrent {
	pointer-events: none;
}
a.breadcrumbLinkCurrent:hover {
	color: inherit;
}
.breadcrumbListItems:first-child .breadcrumbLink::before {
	content: '';
	width: 16px;
	height: 13px;
	padding-right: 5px;
	background-image: url( '/theatres/images/ico_home_sp.png' );
	background-size: contain;
	background-repeat: no-repeat;
	display: inline-block;
}
.breadcrumbListItems + .breadcrumbListItems::before {
	content: '＞';
	font-size: 14px;
	display: inline-block;
	padding: 0 8px;
	color: #333;
}
@media screen and (max-width: 959px){
	.breadcrumb {
		position: relative;
		padding: 0 0 0 8px;
		background-color: #eee;
	}
	.breadcrumbListItems {
		position: relative;
		height: 26px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}
	a.breadcrumbLink {
		color: #333;
		font-size: 10px;
	}
	.breadcrumbListItems:first-child .breadcrumbLink::before {
		width: 12px;
		height: 10.5px;
		padding-right: 10px;
		background-image: url( '/theatres/images/ico_home_sp.png' );
		background-size: contain;
	}
	.breadcrumbListItems:first-child .breadcrumbLink .linkText{
		display: none;
	}
	.breadcrumbListItems + .breadcrumbListItems {
		padding-right: 11px;
	}
	.breadcrumbListItems + .breadcrumbListItems .breadcrumbLink {
		margin-left: 22px;
	}
	.breadcrumbListItems + .breadcrumbListItems::before {
		content: '';
		border-top: 13px solid transparent;
		border-bottom: 13px solid transparent;
		border-left: 13px solid #fff;
		position: absolute;
		left: 0;
		top: 0;
	}
	.breadcrumbListItems + .breadcrumbListItems::after {
		content: '';
		border-top: 13px solid transparent;
		border-bottom: 13px solid transparent;
		border-left: 13px solid #eee;
		position: absolute;
		left: -2px;
		top: 0;
		z-index: 1;
	}
}
.mainSection {
	display: block;
	position: relative;
}
.popupBox .popup {
	display: none;
}
.mainTitle {
	color: #000;
	font-family: 'Hannari';
	text-align: center;
	line-height: 1;
}
.mainLead {
	color: #333;
	text-align: center;
	line-height: 1;
}
.sectionTitle {
	color: #000;
	font-family: 'Hannari';
	text-align: center;
	line-height: 1;
}
.theaterInfoBox {
	background-color: #eeeeee;
	border-radius: 4px;
	text-align: center;
}
.theaterInfoTitle {
	color: #fff;
	display: inline-block;
	line-height: 1;
}
#tokyo .theaterInfoTitle {
	background-color: #c3303c;
}
#yokohama .theaterInfoTitle {
	background-color: #50b9cc;
}
#maihama .theaterInfoTitle {
	background-color: #0050aa;
}
#sapporo .theaterInfoTitle {
	background-color: #d16290;
}
#nagoya .theaterInfoTitle {
	background-color: #769d31;
}
#kyoto .theaterInfoTitle {
	background-color: #cf5010;
}
#oosaka .theaterInfoTitle {
	background-color: #6a64c2;
}
#shidsuoka .theaterInfoTitle {
	background-color: #9d43b3;
}
#sendai .theaterInfoTitle {
	background-color: #3a99bb;
}
#hiroshima .theaterInfoTitle {
	background-color: #bd9d00;
}
#fukuoka .theaterInfoTitle {
	background-color: #cb8241;
}
.theaterListItems {
	background-color: #fff;
	position: relative;
}
.theaterListItems:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius:4px;
}
.theaterListItems:last-child {
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}
.theaterListItems:after{
	content: "";
	background: url(/theatres/images/arrow_right.png) no-repeat center / contain;
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
}
.theaterListItems > a {
	display: block;
	text-align: left;
}
.theaterListTitle {
	color: #333333;
	line-height: 1;
	display: inline-block;
}
a:hover .theaterListTitle {
	color: #c3303c;
}
.theaterType {
	color: #c3303c;
	border: 1px solid #c3303c;
	line-height: 1;
}
.theaterListItems .adress {
	color: #333333;
	line-height: 1;
	margin: 0;
}
.notesBox {
	border: 1px solid #c3303c;
	border-radius: 4px;
}
.notesBoxText {
	color: #333333;
	margin: 0;
	text-align: left;
	text-indent: -1em;
    padding-left: 1em;
	line-height: 2;
}
/* PC
---------------- */
@media screen and (min-width: 959px){
.isSp {
	display: none;
}
.keyVisual {
	max-width: 1000px;
	margin: 0 auto;
}
.mainTitle {
	font-size: 60px;
	margin: 40px 0 55px;
}
.mainLead {
	font-size: 16px;
	margin-bottom: 55px;
}
.sectionTitle {
	font-size: 52px;
	margin:60px 0 20px;
}
/* map */
.map{
	max-width: 1000px;
	height: 435px;
	border-radius: 4px;
	margin: 0 auto;
	position: relative;
	background: #daf0fa url(/theatres/images/image-map_pc.png) no-repeat center 25px/ 48%;
}
.map .mapList {
	list-style-type: none
}
.map .mapListItems {
	width: 108px;
	height: 42px;
	font-size: 16px;
	color: #ffffff;
	position: absolute;
}
.map .mapListItems a{
	text-decoration: none;
	color: inherit;
	display: block;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding-left: 10px;
	box-sizing: border-box;
	border-radius: 4px;
	position: relative;
}
.map .mapListItems a:after{
    content: "\e925";
    font-family: 'shiki_menu';
    position: absolute;
    font-size: 10px;
    top: 0;
    right: 11px;
    bottom: 0;
    margin: auto;
    width: 12px;
    height: 13px;
}
.area01 {
	top: 35px;
	left: 513px;
}
.area01 a{
	background-color: #d16290;
}
.area01 a:hover {
	background-color: #df91b2;
}
.area02 {
	top: 207px;
	left: 632px;
}
.area02 a{
	background-color: #3a99bb;
}
.area02 a:hover {
	background-color: #75b8d0;
}
.area03 {
	top: 267px;
	left: 632px;
}
.area03 a{
	background-color: #c3303c;
}
.area03 a:hover {
	background-color: #d56f77;
}
.area04 {
	top: 366px;
	left: 632px;
}
.area04 a{
	background-color: #50b9cc;
}
.area04 a:hover {
	background-color: #85cedb;
}
.area05 {
	top: 357px;
	left: 492px;
}
.area05 a{
	background-color: #9d43b3;
}
.area05 a:hover {
	background-color: #bb7cca;
}
.area06 {
	top: 357px;
	left: 376px;
}
.area06 a{
	background-color: #769d31;
}
.area06 a:hover {
	background-color: #9fbb6f;
}
.area07 {
	top: 177px;
	left: 423px;
}
.area07 a{
	background-color: #cf5010;
}
.area07 a:hover {
	background-color: #dd8558;
}
.area08 {
	top: 177px;
	left: 307px;
}
.area08 a{
	background-color: #6a64c2;
}
.area08 a:hover {
	background-color: #9793d4;
}
.area09 {
	top: 227px;
	left: 260px;
}
.area09 a{
	background-color: #bd9d00;
}
.area09 a:hover {
	background-color: #d1bb4d;
}
.area10 {
	top: 357px;
	left: 260px;
}
.area10 a{
	background-color: #cb8241;
}
.area10 a:hover {
	background-color: #dba87a;
}
.area11 {
	top: 316px;
	left: 632px;
}
.area11 a{
	background-color: #0050aa;
}
.area11 a:hover {
	background-color: #1b71d2;
}

/* section */
.theaterInfo {
	max-width: 1040px;
	padding: 0 20px;
	margin: 0 auto;
}
.theaterInfoBoxWrap {
	padding-top: 60px;
}
.theaterInfoBox {
	padding: 60px 40px 40px;
	text-align: center;
}
.theaterInfoTitle {
	font-size: 34px;
	padding: 11px 51px;
	border-radius: 28px;
	margin-bottom: 50px;
}
.theaterListItems > a {
	padding: 50px 0 50px 40px;
}
.theaterListItems:after{
	right: 40px;
	width: 12px;
	height: 22px;
}
.theaterListTitle {
	font-size: 24px;
}
.theaterType {
	font-size: 16px;
	padding: 4px 16px;
	margin-left: 20px;
	display: inline-block;
  vertical-align: text-bottom;
}
.theaterListItems .adress {
	font-size: 16px;
	padding: 40px 0 0;
}
.theaterListItems + .theaterListItems {
	margin-top: 2px;
}
.notesBox {
	margin-top: 40px;
	padding: 30px 40px;
}
.notesBoxText {
	font-size: 16px;
}
}

/* IE用ハック*/
@media all and (min-width: 959px) and (-ms-high-contrast: none){
  .theaterInfoTitle{
    padding: 17px 51px 6px;
  }
}
/* SP
---------------- */
@media screen and (max-width: 959px){
	.popupBoxBody > .popupPageTop {
		bottom: 30px;
	}
	.isPc {
		display: none;
	}
	body {
		margin: 0;
		padding: 0;
	}
	.keyVisual {
		width: 100%;
		margin: 0 auto;
	}
	.mainTitle {
		font-size: 29px;
		margin: 40px 0 35px;
	}
	.mainLead {
	    font-size: 10px;
	    line-height: 2;
	    padding: 0 3%;
	    text-align: left;
	    max-width: 400px;
	    margin: 0 auto 25px;
	}
	.sectionTitle {
		font-size: 26px;
		margin: 40px 0 10px;
	}
	.map{
    	max-width: 640px;
    	height: auto;
    	margin: 0 auto;
	}
	.map img {
		width: 100%;
		height: auto;
		max-width: 640px;
		max-height: 555px;
	}
	.theaterInfo {
		width: 100%;
		padding: 0 3%;
	}
	.theaterInfoBoxWrap {
		padding-top: 30px;
	}
	.theaterInfoBox {
		padding: 30px 10px 20px;
	}
	.theaterInfoTitle {
		font-size: 19px;
		padding: 5.5px 27.5px 7px;
		border-radius: 15.5px;
		margin-bottom: 25px;
	}
	.theaterListItems > a{
		padding: 30px 20px 25px 15px;
	}
	.theaterListItems:after{
		right: 10px;
		width: 8px;
		height: 14.5px;
	}
	.theaterListTitle {
		font-size: 14px;
		line-height: 1.5;
	}
	.theaterType {
		display: block;
		font-size: 12px;
		padding: 3px 13px;
		margin-top: 8px;
		width: 76px;
	}
	.theaterListItems .adress {
		font-size: 10px;
		margin: 12px 0 0;
		line-height: 2;
	}
	.theaterListItems + .theaterListItems {
		margin-top: 1px;
	}
	.notesBox {
		margin-top: 20px;
		padding: 15px 20px;
	}
	.notesBoxText {
		font-size: 10px;
		line-height: 2;
	}
}
