﻿@charset "UTF-8";
 
@import url('https://use.fontawesome.com/releases/v7.1.0/css/all.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');


/* all */
* {
margin: 0;
padding: 0;
word-break: normal;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}

:focus-visible {	/* タブキー移動で今いる場所に青いフォーカス枠を表示 */
outline: 1px solid #1A73E8;
outline-offset: 1px;
}

BODY{
margin:0;
padding:0;
background:#FFF;
color:#000;
font-size: 100.0%;	/* 16pxベース */
line-height:1.5;
letter-spacing:1px;
text-align: center;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;

-webkit-text-size-adjust: 100%;	/* iPhone版Safari対策 */
}
@media only screen and (max-width:1200px) {	/* 幅の狭いPC以下用 */
	BODY.menuopen{
	overflow:hidden;
	}
}

* html body {	 /* for IE6 */ 
font-size: 100.0%;	/* 16pxベース */
}
*:first-child+html body { /* for IE7 */
font-size: 100.0%;	/* 16pxベース */
}


/*------ フォントサイズ ------
font-size:62.5%;	10px
font-size:75.0%;	12px
font-size:87.5%;	14px
font-size:100.0%;	16px
font-size:112.5%;	18px
font-size:125.0%;	20px
font-size:137.5%;	22px
font-size:150.0%;	24px
font-size:162.5%;	26px
font-size:175.0%;	28px
font-size:187.5%;	30px
font-size:200.0%;	32px
font-size:212.5%;	34px
font-size:225.0%;	36px
font-size:237.5%;	38px
font-size:250.0%;	40px
-----------------------------*/


IMG{
max-width: 100%;
/* image-rendering: -webkit-optimize-contrast; */
}
IMG,
A IMG{
border:none;
}

P{
margin-top:1.8em;
margin-bottom:1.8em;
background:url(img/spacer.gif) no-repeat;	/* Android4.0対策 */
}


/*--------------------------------------------------------------------
  「レスポンシブ」固有
--------------------------------------------------------------------*/
@media only screen and (min-width:1200px) {/* ワイドPC用 */
	.min1200{
	display:none;
	}
}

.pc,
.pc_tablet{
display:inline-block;
}

.narrow_pc,
.tablet_sp,
.tablet,
.sp{
display:none;
}
.block_pc{	/* PCの時だけ改行する */
display:block;
}

@media only screen and (min-width:769px) and (max-width:980px) {	/* 幅の狭いPC用 */
	.narrow_pc{
	display:block;
	}

}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	IMG{
	width:auto;
	height:auto;
	max-width: 100%;
	}
	.block_tablet_sp{	/* タブレット・スマホの時だけ改行する */
	display:block;
	}
	.block_pc{	/* PCの時だけ改行する */
	display:inline-block;
	}
}

@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	.pc,
	.sp{
	display:none !important;
	}
	.tablet_sp,
	.pc_tablet,
	.tablet{
	display:inline-block !important;
	}
	.block_tablet{	/* タブレット・スマホ横の時だけ改行する */
	display:block;
	}
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	*{
	word-break: break-all;
	}
	.pc_tablet,
	.pc,
	.tablet{
	display:none !important;
	}
	.tablet_sp,
	.sp{
	display:inline-block !important;
	}
	.block_sp{	/* スマホ縦の時だけ改行する */
	display:block !important;
	}
}



.pc_none{
display:none;
}



/*--------------------------------------------------------------------
  「スマホ（横）」「タブレット」固有の設定
--------------------------------------------------------------------*/
@media only screen and (min-width:541px) and (max-width:768px) {
	.pc_none{
	display:inherit;
	}
	.tablet_none{
	display:none;
	}
}


/*--------------------------------------------------------------------
  「スマホ（縦）」固有の設定
--------------------------------------------------------------------*/
@media only screen and (max-width:540px) {
	.pc_none{
	display:inherit;
	}
	.sp_none{
	display:none;
	}
}




/*--------------------------------------------------------------------
リンクテキスト
---------------------------------------------------------------------*/
A{
text-decoration:none;
color:#333;
word-break: break-all;
transition: background 0.5s ease, color 0.3s ease, border-color 0.3s ease, opacity 0.5s ease;
-webkit-transition: background 0.5s ease, color 0.3s ease, border-color 0.3s ease, opacity 0.5s ease;
-moz-transition: background 0.5s ease, color 0.3s ease, border-color 0.3s ease, opacity 0.5s ease;
-o-transition: background 0.5s ease, color 0.3s ease, border-color 0.3s ease, opacity 0.5s ease;
cursor:pointer;
}
.content A:not([class]){
color:#333;
border-bottom-width:1px;
border-bottom-style:solid;
}
.content A:not([class]):VISITED{
color:#666;
}
A:HOVER{
opacity:0.7;
}
.content A:has(IMG){
border-bottom:none !important;
}


.content A:not([class]):hover{
color:#1E50A2;	/* 瑠璃色 */
border-color:transparent;
opacity:1.0;
}


/*------ 外部リンクアイコン 疑似要素使用不可 ------*/

/*------
<I class="fa-solid fa-arrow-up-right-from-square"></I>
------*/


.fa-arrow-up-right-from-square{
margin-left:0.15em;
margin-right:0.15em;
line-height:1;
}

.contentmenu A:has(.fa-arrow-up-right-from-square),
A.link_large:has(.fa-arrow-up-right-from-square){
padding-right:1.3em;
position:relative;
}
.contentmenu A .fa-arrow-up-right-from-square,
A.link_large .fa-arrow-up-right-from-square{
margin:0 !important;
position:absolute;
right:2px;
bottom:4px;
}


/*--------------------------------------------------------------------
見出し 
---------------------------------------------------------------------*/
H1,H2,H3,H4,H5,H6{
margin:0;
padding:0;
font-size:100.0%;	/* 16px */
border:none;
background:none;
font-weight:500;
line-height:1.3;
}


/*------------------------------------------------
H2
------------------------------------------------*/
#content_header{
position:relative;
}
#content_header H2{
padding:5vw 0 0 0;
background-repeat:no-repeat;
background-size:cover;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
-ms-background-size:cover;
background-position:center 15%;
background-image:url(img/image00.webp);	/*「森のホール+松戸市民劇場 外観（デフォ）」*/
background-color:#333;
font-size:min(12.0vw,300.0%);	/* 48px */
text-shadow: 0 0 0.1em #000;
color:#FFF;
line-height:1.0;
position:relative;
}
#content_header.index H2{	/* 画像サイズ大きめ表示 */
padding-top:25vw;
}
#content_header H2 .filter{
background:
-moz-linear-gradient(to top, rgba(0,0,0,0.6) 0, transparent 50%);
background:
webkit-linear-gradient(to top, rgba(0,0,0,0.6) 0, transparent 50%);
background:
linear-gradient(to top, rgba(0,0,0,0.6) 0, transparent 50%);
}

#content_header.small_header H2{	/* 画像なし */
padding-top:2vw;
background:rgba(90,84,75,0.3);	/* #5A544B 海松茶*/
text-shadow:none;
color:#000;
font-size:min(12.0vw,250.0%);	/* 40px */
}

#content_header.small_header H2 .filter{	/* 画像なし */
display:none;
}


#h2{
margin:0 auto;
padding:2.0vw 0.5em 3.0vw 0.5em;
display:block;
z-index:2;
position:relative;
border-left-style:solid;
border-left-width:2px;
width : -webkit-calc(100% - 30px) ;
width : calc(100% - 30px);
max-width:1150px;
text-align:left;
}

#h2 .small,
#h2 .extrasmall{
letter-spacing:0.05em;
display:inline-block;
}
.archives #content_header{	/* イベントアーカイブは彩度を落とす */
filter: saturate(25%);
}

#h2>*{
margin:auto;
display:block;
}
#h2 .eng{
letter-spacing:0.15em;
}
#h2 .jp{
margin:0.5em auto 0 auto;
display:block;
letter-spacing:0.1em;
font-size:50.0%;	/* 24px */
}
#h2 .child{
margin:0.25em auto 0 auto;
display:block;
letter-spacing:0.1em;
font-size:75.0%;	/* 36px */
}

#h2:has(.child) .eng{
font-size:50.0%;	/* 24px */
}
#h2:has(.child) .jp{
font-size:33.3%;	/* 16px */
}


@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#content_header:not(.index) H2 .filter{
	background:rgba(0,0,0,0.5);
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
}
@media only screen and (max-width:320px) {	/* スマホS縦用 */
}


/*------ コンテンツ毎のヘッダー画像設定 ------*/
BODY[id$="_hall21"] #content_header H2{				/* 森のホール「外観（デフォ）」*/
background-image:url(img/image01.webp);	
background-position:center 30%;
}
BODY[id$="_theater"] #content_header H2{			/* 松戸市民劇場「外観」 */
background-image:url(img/image02.webp);
background-position:center 15%;
}
BODY#event #content_header H2{			/* 森のホール「大ホール」 */
background-image:url(img/image03.webp);
background-position:center center;
}



/*------ ページ全体の注釈、脚注 ------*/
.notice{
font-size:87.5%;	/* 14px */
}
.notice UL,
.notice P{
margin:0.2em 0 0.2em auto;
padding:0 0.5em;
display:table;
}
.notice UL LI{
margin-right:0 !important;
margin-left:auto !important;
display:table;
text-align:left;
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.notice UL{
	margin-top:0.5em;
	}
	.notice UL>LI{
	margin-top:0;
	margin-bottom:0;
	}
	

}


/*------------------------------------------------
   H3
------------------------------------------------*/
H3{
font-size:min(12.0vw,187.5%);	/* 30px */
font-weight:600;
}
MAIN H3{
}
MAIN>ARTICLE>H3{
margin-right:auto;
margin-left:auto;
padding-top:1.5em;
width : -webkit-calc(100% - 50px) ;
width : calc(100% - 50px);
max-width:1150px;
}
MAIN>ARTICLE>H3 .extrasmall{
font-size:53.3%;	/* 16px */
}
MAIN>ARTICLE>H3 .extrasmall.block{
margin-bottom:0.5em;
}
MAIN>ARTICLE>H3 .small{
font-size:80.0%;	/* 24px */
}

H3:has(>.eng){
font-size:100.0%;	/* 16px */
}
H3 .eng{
margin-bottom:0.2em;
display:block;
font-size:min(12.0vw,225.0%);	/* 36px */
letter-spacing:0.1em;
}



/*------ 他要素隣接時 ------*/
*+H3,
H3~H3{
margin-top:5em;
}
H3+*{
margin-top:2em;
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	H3{
	font-size:150.0%;	/* 24px */
	}
	H3.longname{
	font-size:6vw;
	}

}



/*------------------------------------------------
   H4
------------------------------------------------*/
/*------ H4基本設定 ------*/
H4{
margin-bottom:1.0em;
font-size:137.5%;	/* 22px */
}
ARTICLE *+H4,
ARTICLE H4~H4{
margin-top:4em;
}


/*------ 他要素隣接時 ------*/
ARTICLE H4+*{
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	H4{
	font-size:125.0%;	/* 20px */
	}
}



/*------------------------------------------------
   H5
------------------------------------------------*/
/*------ H5基本設定 ------*/
H5{
}
ARTICLE H5{
font-size:112.5%;	/* 18px */
}

/*------ 他要素隣接時 ------*/
ARTICLE H4+H5{
margin-top:0.5em !important;
}
ARTICLE H5+*{
margin-top:0.5em !important;
}

ARTICLE *+H5{
margin-top:3.0em;	/* 各要素と隣接時には上余白を多めに */
}

/*------------------------------------------------
   H6
------------------------------------------------*/
/*------ H6基本設定 ------*/
ARTICLE H6{
margin:1.5em auto 0 auto;
font-weight:700;
font-size:100.0%;	/* 16px */
line-height:1.3;
}

/*------ 他要素隣接時 ------*/
H5+H6{
}
H6+*{
margin-top:1.0em;
}
*+H6{
margin-top:1.5em;	/* 各要素と隣接時には上余白を多めに */
}



/*--------------------------------------------------------------------
  画像レイアウト枠
--------------------------------------------------------------------*/
/*------ 1枚・複数共通 ------*/
.photo{
margin-top:3.0em;
text-align:center;
}
.photo IMG{
margin:0 auto;
display:block;
}


/*------------------------------------------------
  キャプション付き
------------------------------------------------*/
.caption A:has(IMG),
.caption IMG{
margin-bottom:0.5em;
display:block;
}
.caption A>IMG{
margin-bottom:0;
}


/*------------------------------------------------
  注釈付き（例：こちらはイメージです。）
------------------------------------------------*/
.imagephoto{
margin-right:auto;
margin-left:auto;
display:table;
position:relative;
}
.imagephoto IMG{
margin:auto;
position:relative;
display:block;
z-index:1;
}
.imagephoto SPAN{
position:absolute;
z-index:2;
right:0.2em;
bottom:0.5em;
font-size:75.0%;	/* 12px */
text-shadow: 0 0 0.2em #FFF;
}
.imagephoto SPAN.white{
text-shadow: 0 0 0.1em #000;
}
.imagephoto SPAN.blackbg{
padding:0.1em 0.25em 0.1em 0.3em;
right:0;
bottom:0;
background:rgba(22,22,14,0.4);	/* DarkGray 40% */
}



/*--------------------------------------------------------------------
左寄せ・右寄せ
---------------------------------------------------------------------*/
.text_alignleft{
text-align:left;
}
.text_aligncenter{
text-align:center;
}
.text_alignright{
text-align:right;
}
/*------ 縦書き -------*/
.tate{	
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
text-orientation: upright;
}


/*------------------------------------------------
画像の左寄せ・右寄せ
------------------------------------------------*/
.aligncenter{
display: block;
margin-left: auto;
margin-right: auto;
}
.alignright{
float:right;
}
.alignleft{
float:left;
}
.clear{
clear:both;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#content .alignleft,
	#content .alignright{
	margin-right:auto;
	margin-left:auto;
	display:block;
	float:none;
	}
}


/*--------------------------------------------------------------------
  フォントサイズ・色
---------------------------------------------------------------------*/

/*------------------------------------------------
   文字サイズ
------------------------------------------------*/
.extrasmall{
font-size:75.0%;	/* 12px */
}
.small{
font-size:87.5%;	/* 14px */
}
.large{
font-size:125.0%;	/* 20px */
}
.extralarge{
font-size:162.5%;	/* 26px */
}

.normal{
font-weight:normal;
}
.bold{
font-weight:bold;
}

SUP,SUB{
font-size:62.5%;	/* 10px */
}
RUBY.under{	/* ルビを下に配置 */
ruby-position: under;
}
RUBY RT{
font-size:60.0%;
}

.lh12{
line-height:1.2;
}
.lh15{
line-height:1.5;
}
.em5{
width:5.0em;
display:inline-block;
vertical-align:middle;
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.em5{
	width:auto;
	}
}


/*------------------------------------------------
   強調下線
------------------------------------------------*/
.borderbottom{
padding:0.1em;
border-bottom-width:1px;
border-bottom-style:solid;
}
.borderbottom.margin{	/* 改行する場合 */
margin:0 0 0.5em 0;
display:table;
}

.double{
border-bottom:4px double #F30;
}

.underline{
display:inline;
background: -prefix-linear-gradient(	/* Webkit系 */
bottom,
rgba(204,255,0,1),
rgba(204,255,0,1) 34%,
rgba(204,255,0,0) 35%),
url(img/spacer.gif);
background: linear-gradient(	/* 蛍光イエロー 12.1、IE 10、Fx 16 以降 */
to top,
rgba(204,255,0,1),
rgba(204,255,0,1) 34%,
rgba(204,255,0,0) 35%),
url(img/spacer.gif);
/ border-bottom:5px solid #CF0;	/* IE7対策 */
}
html.android .underline{
/* Android は下線 */
border-bottom:5px solid #CF0;
}

/*------------------------------------------------
   前後の線
------------------------------------------------*/
.line::before,
.line::after{
margin:-0.2em 10px 0 10px;
content:"";
display:inline-block;
width:50px;
height:1px;
vertical-align:middle;
border-bottom-width:1px;
border-bottom-style:solid;
}

/*------------------------------------------------
   右側に横線
   <H4 class="flexbox center line_right"><SPAN class="text">テキスト</SPAN><SPAN class="blackbg"></SPAN></H4>
------------------------------------------------*/
.line_right.flexbox .text{
}
.line_right.flexbox .text+*{
margin-left:0.5em;
flex-grow: 1;
height:1px;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.line::before,
	.line::after{
	width:10px;
	}
}

/*------------------------------------------------
   文字色 AAA
------------------------------------------------*/
.red{
color:#AA242B;	/* AAA赤 */
}
.blue{
color:#1E50A2;	/* 瑠璃色 */
}
.green{
color:#00552E;	/* 深緑 */
}
.olive{
color:#553;	/* Olive++ */
}
.brown{
color:#6F4B3E; /* 焦げ茶 */
}


.white A,
.white A:visited,
.white{
color:#FFF;
}
.beige A,
.beige{
color:#EEE7E0;	/* Ecru */
}
.gray,
.gray A{
color:#999 !important;
}

/*------------------------------------------------
   フォント
------------------------------------------------*/
.font_m{
font-family: 'Zen Old Mincho', serif;
}
.font_r{
font-family: 'Zen Maru Gothic', serif;
}


/*--------------------------------------------------------------------
  リストスタイル
---------------------------------------------------------------------*/
UL{
padding:0;
list-style:none;
}
LI{
}

ARTICLE UL{
margin:1.2em 0;
}
ARTICLE UL>LI{
line-height:1.3;
}
ARTICLE LI LI{
margin-top:0.2em;
margin-bottom:0.2em;
}


/*------------------------------------------------
  ネスト時
------------------------------------------------*/
LI UL,
DD UL,
TD UL{
margin-top:0;
margin-bottom:0.3em;
}

/*------------------------------------------------
  箇条書きリスト
------------------------------------------------*/
UL.list>LI,
UL>LI.list{
margin:0.5em auto 0.5em 1.5em;
list-style-type: disc;
}


/*------------------------------------------------
  横並びリスト
------------------------------------------------*/
UL.inline-block-li.list>LI{
margin-left:0;
}
UL.inline-block-li>LI{
margin-top:0.2em;
margin-bottom:0.2em;
padding:0 0.6em 0 0;
display:inline-block;
}
/*------ リンクボタンがある時 ------*/
UL.inline-block-li>LI:has(.link_large){
margin-top:0.5em;
margin-bottom:0.5em;
padding:0 0.3em;
}

/*------ padding-left 0.3emを相殺する時 ------*/
UL.inline-block-li.marginleft-{
margin-left:-0.3em;
}
*:has(>UL.inline-block-li.marginleft-){	/* その親要素 */
overflow:hidden;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	UL.inline-block-li.marginleft-{
	margin-left:auto;
	}
	UL.inline-block-li.table:has(>LI .link_large),
	UL.inline-block-li>LI:has(.link_large){
	padding:0;
	display:block;
	}

}
UL.inline-block-li.list>LI{
padding-left:0.9em;
padding-right:0.6em;
display:inline-block;
text-indent:0.8em;
}
UL.inline-bloc-lik.list>LI *{
text-indent:0;
}

UL.inline-block-li.padding0{
padding-left:0.25em;
}

UL.inline-block-li.padding0>LI{
padding:0;
margin:0 0 0 -0.25em;
}



DL.list DT::before,
MAIN UL.inline-block-li.list>LI::before{
margin:-0.2em 0.4em auto -1.5em;
display:inline-block;
content:"";
border:1px solid #000;
background:#000;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
width:4px;
height:4px;
vertical-align:middle;
}
DL.list DT::before{
margin:-0.2em 0.4em auto 0.1em;
}
DL.list DD{
margin-top:0.2em;
margin-left:0.8em;
}



/*------------------------------------------------
  番号付きリスト
------------------------------------------------*/
OL{
margin:1.2em 0;
}


/*------ ネスト時 ------*/
LI OL,
DD OL,
TD OL{
margin-top:0;
margin-bottom:0.3em;
}
OL>LI{
margin:0.5em auto 0.5em 2.0em;
list-style-type : decimal;
line-height:1.3;
}

/*------ 丸数字・両側に()カッコ ------*/
OL.maru>LI,
DL.kakko>DT,
OL.kakko>LI{
margin-left:-0.5em;
padding-left:3.5em;
text-indent: -3.5em;
list-style-type:none;
list-style-position:inside;
counter-increment: cnt;
}
OL.maru>LI{
padding-left:1.8em;
text-indent: -1.3em;
}
DL.kakko>DT:before,
OL.kakko>LI:before{
/* display: marker; */
display: inline-block;
content: "（" counter(cnt) "）";
width:3.5em;
text-indent:0;
text-align:right;
}
OL.maru>LI:before{
margin:-0.2em 0.2em 0 0;
padding:0.15em 0 0.05em 0;
display: marker;
content: counter(cnt);
width:1.2em;
line-height:1.0em;
letter-spacing:0;
text-align:center;
display:inline-block;
text-indent:0;
font-size:87.5%;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border:1px solid #000;
vertical-align:middle;
}

OL.kakko>LI>UL{
margin-left:-1.0em;
}

/*------ カウンターリセット 1から再付番 ------*/
.number-reset {
counter-reset: cnt;
}

/*------ カウンターリセット 3番から付番 ------*/
.number-reset3 {
counter-reset: cnt 2;
}




/*------------------------------------------------
  説明付きリスト
------------------------------------------------*/
DL{
margin:1.2em 0;
padding:0;
}
LI>DL{	/* ネストする時は上余白を少な目に */
margin-top:0.6em;
}
DT,
DD{
margin:0;
padding:0;
}
DT+DT,
DD+DT{	/* 2番目以降のタイトル行だけ上余白を設ける */
margin-top:1.5em;
}

LI>DL DT+DT,
LI>DL DD+DT{	/* ネストする時は上余白を少な目に */
margin-top:1em;
}




/*------------------------------------------------
  注釈 ※ リスト
------------------------------------------------*/
DIV.scroll_table_box+UL.kome{
margin-top:0;
}
.item P+UL.kome{
margin-top:0.5em;
}


UL.kome>LI,
LI.kome{
margin:0.3em auto;
padding-left:1.2em !important;
text-indent:-1.2em !important;
text-align:left;
}
UL.kome>LI *,
LI.kome *{
text-indent:0;
}
DD UL.kome,
LI UL.kome{
margin-left:-0.65em;
margin-left:-0.2em;
}
UL.kome>LI>SPAN:first-child,
LI.kome>SPAN:first-child{
margin-right:0.2em;
display:inline-block;
text-indent:0;
}
UL.kome>LI>SPAN:first-child,
LI.kome>SPAN:first-child{
color:#AA242B;	/* AAA赤 */
}

UL.list>LI.kome{
margin:0.3em auto 0.3em 0;
list-style-type: none;
}



/*------------------------------------------------
  PDF・Word・Excelリスト
------------------------------------------------*/
/*------ 共通 ------*/
UL.pdf LI,
UL.word LI,
UL.excel LI,
LI.pdf,
LI.word,
LI.excel{
margin:0;
padding:0.4em 0 0.4em 40px;
background-repeat:no-repeat;
background-position:0 0.1em;
list-style:none;
min-height:36px;
text-align:left;
}
UL.list>LI.pdf,
UL.list>LI.word,
UL.list>LI.excel{
margin:0;
list-style-type: none;
}


/*------ PDFリスト ------*/
#download A.pdf,
UL.pdf LI,
LI.pdf{
background-image:url(img/pdf.png);
}

/*------ Wordリスト ------*/
#download A.word,
UL.word LI,
LI.word{
background-image:url(img/word.png);
}

/*------ Excelリスト ------*/
#download A.excel,
UL.excel LI,
LI.excel{
background-image:url(img/excel.png);
}


/*------ PDFリスト（小） ------*/
A.pdf_s,
UL.pdf_s>LI,
LI.pdf_s{
padding-left:20px;
list-style:none;
background-image:url(img/pdf.png);
background-repeat:no-repeat;
background-position:0 0.2em;
background-size:16px 16px;
-webkit-background-size:16px 16px;
-moz-background-size:16px 16px;
-o-background-size:16px 16px;
-ms-background-size:16px 16px;
}
A.pdf_s{
display:inline-block;
}



/*--------------------------------------------------------------------
  表
---------------------------------------------------------------------*/
TABLE{
margin-top:1.5em;
margin-bottom:1.5em;
font-size:100%;
line-height:1.3;
}

TH{
text-align:center;
font-size:100%;
}
TD{
font-size:100%;
background:url(img/spacer.gif) no-repeat;	/* Android4.0対策 */
}
TH>*,
TD>*{
margin-top:0;
margin-bottom:0;
}
TH>*~*,
TD>*~*{
margin-top:5px;
}

/*------------------------------------------------
  罫線を表示するタイプの表
------------------------------------------------*/
TABLE.data_table{
border-collapse:collapse;
border-top:2px solid #666;
border-bottom:2px solid #666;
line-height:1.2;
width:100%;
}
TABLE.data_table CAPTION{
padding:0.25em 0;
text-align:right;
}
.data_table TH{
border-top:1px solid #666;
text-align:center;
font-weight:normal;
}
TABLE.data_table THEAD TH{
padding:0.5em 0.75em;
background:rgba(90,84,75,0.45);	/* #5A544B 海松茶*/
}
TABLE.data_table:has( TBODY TH ) THEAD TH:first-child{
background:rgba(90,84,75,0.6);	/* #5A544B 海松茶*/
}


TABLE.data_table THEAD TR TH:nth-child(1){
/* border-right:1px solid #666; */
}
TABLE.data_table TBODY TH{
padding:0.75em;
/* border-right:1px solid #666; */
background-color:rgba(90,84,75,0.25);	/* #5A544B 海松茶*/
}
TABLE.data_table THEAD TH.th2{
border-right:1px solid #666;
}
TABLE.data_table TBODY TH.th2{
background-color:rgba(90,84,75,0.15);	/* #5A544B 海松茶*/
}

TABLE.data_table TD{
padding:0.75em;
border-top:1px solid #666;
}
TABLE.data_table THEAD TR TH+TH,
TABLE.data_table TBODY TD+TD{
/* border-left:1px solid rgba(90,84,75,0.3);	 #5A544B 海松茶*/
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.data_table TBODY TH,
	.data_table TD{
	padding:0.5em 0.2em;
	}
}

/*------------------------------------------------
  スマホ表示時にセルをスライドさせるタイプの表
------------------------------------------------*/
TABLE.float_table{
}

@media only screen and (min-width:541px) and (max-width:768px) {
	TABLE.float_table{
	width:100%;
	}
}
.float_table TH{
}
.float_table TD{
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	TABLE.data_table.float_table{
	border-top:1px solid #666;
	border-right:none;
	line-height:1.2;
	}
	.data_table.float_table TH,
	.data_table.float_table TD{
	float:left;
	width:100%;
	}
	.data_table.float_table TH{
	padding:0.3em 2.0vw;
	border-top:1px solid #666;
	}
	.data_table.float_table TD{
	padding:0.5em 2.0vw 1.0em 2.0vw;
	border:none !important;
	}
}



/*------------------------------------------------
  横長の表にスクロールバー設置
------------------------------------------------*/
/*------ scrollmessage表示の親要素（基点） ------*/
.scroll_table_box{
margin-top:1.0em;
position:relative;
z-index:1;
}



/*------ 横スクロールさせる表の親要素 ------*/
.scroll_table{
overflow-x:auto;
position:relative;
}

/*------ 横スクロールバーの装飾 ------*/
.scroll_table::-webkit-scrollbar{
width: 1.0em;
height:1.0em;
}
.scroll_table::-webkit-scrollbar-track{
background:#F5F5F5;
border: solid 0.3em #FFF;
border-radius: 10px;
}
.scroll_table::-webkit-scrollbar-thumb{
background: #CCC;
border-radius: 10px;
box-shadow: inset 0 0 0 2px #CCC;
}



.scroll_table_box TABLE{
margin-top:0;
width:100%;
}

@media only screen and (max-width:769px) {	/* スマホ横以下用 */
	.scroll_table_box TABLE{
/*	min-width:722px; */
	min-width:900px;
	}
}


/*-----------------------------------------------
  スワイプメッセージ
------------------------------------------------*/
/*------ ボックス全体 ------*/
.scrollmessage {
padding:1em 0;
position:absolute;
top:0;
left:0;
line-height:1.2;
width:100%;
z-index:2;
color:#FFF;
background:rgba(0,0,0,0.8);
cursor: pointer;
text-align:center;
display:none;
}
BODY[id$="_hall21"] .scrollmessage {
background:rgba(85,85,51,0.8);	/* #553 darkolivebg org */
}
BODY[id$="_theater"] .scrollmessage {
background:rgba(111,75,62,0.8);	/* #6F4B3E 焦げ茶 */
}

/*------ アイコンを大きく ------*/
.scrollmessage .fa-solid{
margin:0.2em;
font-size:200%;
}

/*------ ブラウザ幅769px以下でスクロールメッセージ表示 ------*/
@media only screen and (max-width:769px) {
	.scrollmessage{
	display:block;
	}
}


/*------ ブラウザ幅900px＝表幅858px以下でスクロールメッセージ表示 ------*/
@media only screen and (max-width:900px) {
	[id^="fee"] .scroll_table_box.wide .scrollmessage{
	display:block;
	}
}


/*------------------------------------------------
  テーブルレイアウト
------------------------------------------------*/
DIV.island,
TABLE.island,
UL.island,
OL.island,
DL.island{
margin-right:auto !important;	/* インデントリセット */
margin-left:auto !important;	/* インデントリセット */
display: table;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	DIV.island,
	TABLE.island,
	UL.island,
	OL.island,
	DL.island{
	margin-right:0 !important;
	margin-left:0 !important;
	}
}




/*--------------------------------------------------------------------
  「トップページ」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  トップページ メインビジュアル欄
------------------------------------------------*/
#mainvisual{
background-image:url(img/mainvisual.webp);
aspect-ratio: 2 / 1;
text-shadow: 0 0 0.1em #000;
font-weight:500;
}
#mainvisual .text{
z-index:2;
font-size:min(3.8vw,125.0%);	/* 20px */
width:90vw;
}
#mainvisual .text>SPAN{
padding:0.5em 0;
display:block;
}

#mainvisual .text .extralarge{
font-size:200.0%;	/* 40px */
}


/*------------------------------------------------
  トップページ スライド欄
------------------------------------------------*/
#mainvisual,
#slide_box{
position: relative;
background-color:#000;
z-index:1;
}


/*------スライド本体 ------*/
UL.slide{
margin:0;
width:100%;
background:#000;
}

.slide LI{
color:#FFF;
background:#000;
text-align:center ;
width:100%;
position:relative;
background-repeat:no-repeat;
background-position:center;
background-size:cover;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
-ms-background-size:cover;
text-shadow: 0px 0px 2px #000;
}
.slide LI>IMG{
width: 100%;
height:auto;
position:relative;
z-index:1;
vertical-align:top;
display:block;
}



/* 初期値は中・中 */
.slide LI H2{
font-size:min(3.8vw,125.0%);	/* 20px */
white-space:nowrap;
position:absolute;
transform:translate(-50%,-50%);
left:50%;
top:50%;
z-index:2000000;
}
.slide LI H2 .extralarge{
font-size:200.0%;	/* 40px */
}


/*--------------------
位置指定なし は 中中

位置指定の組み合わせ
左上 left top
左中 left middle
左下 left bottom

右上 right top
右中 right middle
右下 right bottom
----------------------*/
.slide LI H2.centertop{
transform:translate(-50%,0);
top:10%;
left:50%;
}
.slide LI H2.centerbottom{
transform:translate(-50%,0);
top:auto;
bottom:20%;
left:50%;
}


/* 左・中・右 */
.slide LI H2.left{
transform:translateY(0);
left:3%;
}
.slide LI H2.center{
transform:translateX(-50%);
left:50%;
}
.slide LI H2.right{
transform:translateY(0);
left:auto;
right:3%;
}
/* 上・中・下 */
.slide LI H2.top{
transform:translateX(0);
top:10%;
}
.slide LI H2.middle{
transform:translateY(-50%);
top:50%;
}
.slide LI H2.bottom{
transform:translateX(0);
top:auto;
bottom:20%;
}


.slide LI H2 A{
color:#FFF;
display:block;
word-break: normal;
}
.slide LI H2 A:hover{
}
/*------ 文字サイズ ------*/
.slide LI H2 SPAN.large,
.slide LI H2 SPAN.extralarge{
margin:0.5em auto 0 auto;
display:block;
}
.slide LI H2 SPAN.small{
font-size:80.0%;
}


/*------ 2枚目以降のスライドが見えてしまう対策 ------*/
UL.slide LI>IMG,
UL.slide LI H2{
display:none;
}
.bx-viewport UL.slide LI>IMG,
.bx-viewport UL.slide LI H2{
display: block;
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	.slide LI H2{
a	font-size:162.5%;	/* 26px */
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.slide LI H2{
a	padding:0.5em;
a	transform:translate(0,0) !important;
a	background:rgba(0,0,0,0.3);
a	left:0 !important;
a	right:0 !important;
a	bottom:0 !important;
a	top:auto !important;
a	font-size:4.75vw;
a	letter-spacing:1px;
	}
}


/*-----------------------------------------------
  トップページ「PR欄」
------------------------------------------------*/
.top_pr{
margin:0;
position:relative;
}

#download *+H3::before,
MAIN>ARTICLE+ARTICLE::before,
.top_pr::before{
position:absolute;
transform : translateX(-50%);
top:-2px;
left:50%;
margin:0 auto;
content:"";
background:#000;
width:100px;
height:2px;
display:block;
}


/*------ 各パーツ ------*/
.top_pr>*{
margin-right:auto;
margin-left:auto;
text-align: center;
width : -webkit-calc(100% - 50px) ;
width : calc(100% - 50px);
}
.top_pr:not(#news)>*{
max-width:1150px;
}
.top_pr H3{
margin-bottom:2.0em;
font-size:100.0%;	/* 16px */
}


.top_pr H3 A{
position:absolute;
right:0;
bottom:-0.75em;
}

.top_pr .item{
max-width:1150px;
}

.top_pr .item{
padding:0;
}
.top_pr .item LI{
padding:0;
text-align:center;
}



@media only screen and (max-width:540px) {	/* スマホ縦用 */
	H3.longname .eng{
	font-size:250.0%;	/* 40px */
	}
	.top_pr P{
	text-align:left;
	}
	.top_pr.lv1{
	padding-top:3.0em;
	padding-bottom:3.0em;
	}

}
@media only screen and (max-width:320px) {	/* スマホS縦用 */
	.top_pr H3.longname .eng{
	font-size:12.0vw;
	}
}

/*-----------------------------------------------
  トップページクイックアクセス欄 .flexbox
------------------------------------------------*/
#top_guide{
padding-bottom:6.0em;
}
#top_guide ARTICLE H3{
font-size:min(12.0vw,125.0%);	/* 20px */
}
.flexbox.index .image{
margin-bottom:1.5em;
}


/*-----------------------------------------------
  トップページお知らせ欄 ワイドタイプ
------------------------------------------------*/
#news{
}
.top_pr#news>*{
max-width:950px;
}
#news ARTICLE{
margin:0 auto;
padding:1.0em;
text-align:left;
line-height:1.3;
border-bottom:1px solid #DCDCDC;
}
#news ARTICLE:first-of-type{
border-top:1px solid #DCDCDC;
}
#news ARTICLE A:hover{
color:#066;
color:#1E50A2;	/* 瑠璃色 */
}

/*------ 日付欄 ------*/
#news .date{
padding:0.4em 0 0 2.5em;
display:inline-block;
text-align:left;
font-size:87.5%;	/* 14px */
position:relative;
width:9.0em;
font-weight:500;
}
/*------ NEW！表示 日付欄内に記述 ------*/
#news .new{
display:inline-block;
font-size:64.3%;	/* 9px */
line-height:1.2;
white-space:nowrap;
color:#900;
position:absolute;
left:-1.0em;
top:0.95em;
font-weight:900;
letter-spacing:0;
}

/*------ Topicsカテゴリー ------
	class="category info"
	class="category event"
	class="category important"
--------------------------------*/
#news .category{
margin:0.5em auto 0.1em auto;
margin:0.5em 2.0em 0.1em 1.0em;

padding:0.175em 0 0 0;
display:inline-block;
width:5.5em;
font-size:75.0%;	/* 12px */
text-align:center;
color:#FFF;
background-color:#241A08; /* 憲法黒茶 */
font-family: "Roboto","Noto sans JP", sans-serif;
}
#news .category.important{
background-color:#900;
}

/*------ Topics本文欄 ------*/
#news .contents{
margin:0;
padding:0.3em 0 0.2em 0;
flex:1;
font-weight:400;
}
#news ARTICLE>H4:not(.date):not(#news .category){
font-size:100.0%;	/* 16px */
}
#news H4+*{
margin:0.3em auto 0 auto;
}
#news H4+*~*{
margin-top:1em;
}
#news H4 A:hover{
}
#news>P{
margin-top:3.0em;
}
UL.inline-block-li.sns_link>LI,
.footer_information .sns_link LI{
padding-right:0.6em;
padding-left:0.6em;
vertical-align:middle;
}
.sns_link.icon.display_ib [class^="fa"]{
margin-right:0 !important;
}
.sns_link A>SPAN{
overflow: hidden;	/* -9999 */
text-indent: 100%;	/* -9999 */
white-space: nowrap;	/* -9999 */
display:block;
width:1px;
height:0;
}


@media only screen and (max-width:768px) {	/* スマホ横以下用 */

	#news .date{
	margin-left:0;
	padding-left:0;
	width:6.2em;
	}
	#news .new{
	left:0;
	right:auto;
	top:-1.0em;
	}

	#news .contents{
	margin-top:0.3em;
	width:100%;
	flex: auto;
	}

}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#news>DIV{
	padding:0.5em 0.5em;
	}
	#news ARTICLE{
	padding:1.0em 0.5em;
	}

	#news .sns_link LI:first-child{
	display:block;
	margin-bottom:1.0em;
	}

}


/*-----------------------------------------------
  #site_information
  トップページお知らせ欄内 緊急or重大告知エリア
------------------------------------------------*/
[id^="site_information"]{
padding:3.0em 0;
text-align:center;
}
[id^="site_information"]>*{
margin-right:auto;
margin-left:auto;
width : -webkit-calc(100% - 50px) ;
width : calc(100% - 50px);
max-width:1150px;
}
[id^="site_information"] .banner>LI{
margin:1.5em auto;
max-width:900px;
}
[id^="site_information"] .banner>LI>A{
padding:1.5em 0;
border-width:1px;
border-style:solid;
width:100%;
}
[id^="site_information"] .banner>LI>A>SPAN{
margin:0 auto;
padding:0.5em 0.2em;
display:table;
font-size:125.0%;	/* 20px */
font-weight:700;
line-height:1.2;
}
[id^="site_information"] .banner>LI>A>SPAN.pdf{
padding-left:50px;
background:url(img/pdf.png) no-repeat 0.2em 0.3em;
}
[id^="site_information"]>P{
text-align:left;
display:table;
width:auto;
}



@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	[id^="site_information"] .banner{
	min-width:initial;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	[id^="site_information"] .banner>LI>A{
	padding:0.25em 0;
	text-align:left;
	}
	[id^="site_information"] .banner>LI>A>SPAN.pdf{
	padding-left:43px;
	}
}



/*------------------------------------------------
  トップページ イベント欄
  イベントスケジュール共通
------------------------------------------------*/
#event .bx-wrapper{
opacity:1.0;	/* effect-fade除外 */
}
#event .bx-viewport{
height:auto !important;
}

#home #event #event_item{
margin:3.0em auto;
/* max-width:1150px; カルーセル時は不要 */
}
#event #event_item ARTICLE{
padding:0 0 2.5em 0;	/* 下部に詳細リンクスペース */
position:relative;
text-align:left;
transition: opacity 0.5s ease;
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
}
#event #event_item ARTICLE>*,
#event #event_item ARTICLE LI:not(.status){
opacity:1.0 !important;	/* effect-fade除外 */
}
#home #event .bx-wrapper{
max-width:1000px !important;
}

/*------ イベントNEW ----------

  <ARTICLE><SPAN>NEW</SPAN>

-------------------------------*/
#event #event_item ARTICLE>SPAN{
padding:0 0.5em;
position:absolute;
bottom:100%;
left:0;
background:#E6B422; /* 黄金 */
z-index:10;
font-size:75.0%;	/* 12px */
}
BODY#event #event_item{
width:100%;
}



/*------ イベント開催施設カテゴリー ------*/
#event UL.type{
margin:0;
position:relative;
}
#event H3.type{
position:relative;
}
#event .type>LI{
line-height:1.2;
}
#event .category{
margin-top:5px;
padding:0.1em 0.1em 0.1em 0.5em;
display:inline-block;
font-size:87.5%;	/* 14px */
line-height:1.0em;
border-left-width:1.25em;
border-left-width:1.4em;
border-left-style:solid;
}
#event .category.hall21{
border-left-color:#808000 /* Olive */
}
#event .category.theater{
border-left-color:#A16D5D; /* 焦茶 */
}
BODY#event .category{
border-width:5px;
}

@media only screen and (min-width:541px) and (max-width:900px) {	/* スマホ横用 */
	#event .category{
	border-width:5px;
	}
}

#event .status{
padding:2px 0.25em;
text-align:center;
position:absolute;
top:1px;
right:1px;
font-weight:700;
opacity:0.95;
color:#FFF;
}
#event #events .status{
margin-bottom:0.3em;
position:static;
display:table;
font-size:83.3%;	/* 20px */
}

/*------ 受付中 ! or 好評発売中 ! .now ------*/
#events H3.now .status,
#event .type.now .status{
background:#D3381C;	/* 緋色 */
}

/*------ もうすぐ受付 .soon ------*/
#event .type.soon .status{
background-color:#006655;	/* AAA緑 */
border:1px solid #FFF;
}

/*------ 満員御礼 .close ------*/
#events H3.close .status,
#event .type.close .status{
background:#333;
border:1px solid #666;
}
/*------ 中止 ! .cancel ------*/
#events H3.cancel .status,
#event .type.cancel .status{
background:#FFF;
color:#D3381C;	/* 緋色 */
}
#event .type.cancel .imagebox{
background:#000;
}
#event .type.cancel .imagebox>IMG{
opacity:0.5;
}

/*------ 取り消し線 ------*/
.fin{
display:inline-block;
text-decoration: line-through #C00 double;
color:#666;
}
.fin A{
color:#666 !important;
pointer-events: none;	/* リンクしない */
}



/*------ イベント画像 横600:縦848 ------*/
.imagebox{
position:relative;
background:#DCDCDC;
}

.imagebox IMG{
width:100%;
height: auto;
aspect-ratio: 75 / 106;	/* 600×848 */
/* object-fit: cover;  フィットさせる */
object-fit: contain; /* 余白を設ける */
display:block;
}

/*------ イベント画像が無い時（PickUp、詳細ポスター共通） ------*/
.imagebox.noimage{
background:rgba(90,84,75,0.1);	/* #5A544B 海松茶*/
aspect-ratio: 75 / 106;	/* 600×848 */
}
.imagebox.noimage SPAN{
/* <SPAN>画像準備中</SPAN>
   <SPAN>Now Printing</SPAN>
   <SPAN>NO IMAGE</SPAN>など
 */
padding:4.0em 0;
display:block;
position:absolute;
transform:translate(-50%,-50%);
top:50%;
left:50%;
color:#666;
font-weight:bold;
font-size:125.0%;	/* 20px */
text-align:center;
white-space:nowrap;
}

/*------ イベントタイトル ------*/
#event #event_item ARTICLE H4{
margin:0;
padding:1.0em 0 0.5em 0;
font-size:100.0%;	/* 16px */
color:#000;
}


/*------ 詳細リンク ------*/
#event #event_item ARTICLE .morelink{
position:absolute;
width:100%;
height:100%;
top:0;
bottom:0;
left:0;
right:0;
display:block;
background:rgba(255,255,255,0.0);
z-index:2;
transition: background 0.5s ease;
-webkit-transition: background 0.5s ease;
-moz-transition: background 0.5s ease;
-o-transition: background 0.5s ease;
}
#event #event_item ARTICLE .morelink:hover{
background:rgba(255,255,255,0.5);
}

#event #event_item ARTICLE .morelink SPAN{
text-align:right;
position:absolute;
right:0;
bottom:0.4em;
display:none;
}

#home #event #event_menu{
margin-top:10.0em;
}

#events P+UL.kome.nomargin_top{
margin-top:-1.5em;
}

@media only screen and (min-width:541px) {	/* PC用 */
	#home #event .link_large{
	width:15.0em;
	}
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#home #event #event_menu{
	margin-top:6.0em;
	}

	#event .imagebox IMG{
	aspect-ratio: auto;
	}
	#event .imagebox.noimage{
	aspect-ratio: 3 / 2;
	}

}





/*------ アーカイブ ------*/
#event.archives #event_item .flexbox ARTICLE{
margin-left:1.5em;
}
@media only screen and (min-width:901px) {	/* 幅の広いPC以上用 */
	#event.archives #event_item .flexbox ARTICLE:nth-child(4n+1){
	margin-left:0;
	}
}
@media only screen and (min-width:769px) and (max-width:900px) {	/* 幅の狭いPC用 */
	#event.archives #event_item .flexbox ARTICLE:nth-child(3n+1){
	margin-left:0;
	}
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	#event.archives #event_item .flexbox ARTICLE:nth-child(2n+1){
	margin-left:0;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#event.archives #event_item .flexbox ARTICLE{
	margin-left:0;
	}

}


/*------------------------------------------------
  フッター リンクバナー欄（トップページのみ）
------------------------------------------------*/
#footer_banner{
padding:3.0em 10px;
}
#footer_banner LI{
margin:0.5em 0.25em;
padding:0;
display:inline-block;
vertical-align:middle;
background:#FFF;
}
#footer_banner A{
display:block;
transition: opacity 0.5s ease;
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
}
#footer_banner A:hover{
opacity:0.7;
}
#footer_banner IMG{
margin:auto;
display:block;
}



/*--------------------------------------------------------------------
  「イベント」固有の設定
---------------------------------------------------------------------*/
/*------ タブ切り替え全体のスタイル ------*/
.tabs.content{
}

/*------ タブのスタイル ------*/
.tab_item{
padding:0.8em 1vw;
width: 25.0%;
border-bottom: 3px solid #000;
display: block;
display: table;
float: left;
text-align: center;
transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
cursor:pointer;
line-height:1.2;
min-height:4.0em;
font-size:min(3.7vw,100.0%);	/* 16px */
}
.tab_item SPAN.tab_label{
display: table-cell;
vertical-align:middle;
line-height:1.1;
}

.lineup01,
.lineup02{
font-size:112.5%;	/* 18px */
}

/*------ ラジオボタンを全て消す ------*/
input[name="tab"] {
  display: none;
}


/*------ 選択されているタブのコンテンツのみを表示 ------*/
#lineup:checked ~ #lineup_item,	/* 公演ラインナップ */
#month0:checked ~ #month0_item,	/* 今月 */
#month1:checked ~ #month1_item,	/* 来月 */
#month2:checked ~ #month2_item{	/* 再来月 */
display: block;
}

/*選択されているタブのスタイルを変える ------*/
.tabs input:checked + .tab_item {
background:#000;
color:#FFF;
font-weight: 700;
}
.tabs input:not(:checked) + .tab_item:hover{
background:rgba(90,84,75,0.2);	/* #5A544B 海松茶*/
}

.tabs input:not(:checked) + .tab_item {
background:rgba(90,84,75,0.0);	/* #5A544B 海松茶*/
}

/*------ タブ切り替えの中身のスタイル ------*/
.tab_content {
display: none;
clear: both;
overflow: hidden;
border-bottom:2px solid #666;
min-height: 500px;	/* タブごとにタブコンテンツの高さが大きく異なる際のページ揺れ防止 */

}
.tabs.content .text{
margin-right:0;
}

.tab_content H3{
padding:1.5em 0;
}
.tab_content#lineup_item H3{
padding:1.5em 0 0 0;
}

.tab_content>SECTION{
padding:0;
}




/*------------------------------------------------
  上部の見出し ワイドPCのみ
------------------------------------------------*/
.event_headline{
display:none;
}
@media only screen and (min-width:981px) {	/* PC用 */
	.event_headline{
	margin:0 auto;
	padding:0;
	display:table;
	width:100%;
	border-top:2px solid #666;
	border-bottom:1px solid #666;
	background:rgba(90,84,75,0.3);	/* #5A544B 海松茶*/
	}
	.event_headline>LI{
	padding:0.5em;
	display:table-cell;
	text-align:center;
	}
	.event_headline>LI+LI,
	#calendar DD:nth-of-type(n+2){
	border-left:1px solid #666;
	}
}

/*------------------------------------------------
  イベントカレンダー（共通）
------------------------------------------------*/
#calendar DL{
margin:0;
border-top:1px solid #666;
width:100%;
}
#calendar DT{
}
#calendar DD:nth-of-type(n+2){
padding:0.75em;
}


/*------ 開催日時 ------*/
.calendar_day>LI{
padding:0.75em;
}
.calendar_day{
margin:0;
}
.calendar_day>LI+LI{
border-top:1px solid #CCC;
}
#calendar DD .date{
display:inline-block;
}
#calendar DD .day{
padding:0 0.5em 0.5em 0;
font-weight:500;
font-size:150.0%;	/* 24px */
}

/*------ 複数公演名（昼の部、夜の部など） ------*/
.multi{
display:inline-block;
}
.multi .type{
padding-top:0.25em;
padding-right:0.25em;
display:inline-block;
}

/*------ 開演・開場 ------*/
.start_time{
padding-top:0.25em;
padding-left:1.1em;
display:inline-block;
}
.open_time{
padding-top:0.25em;
display:inline-block;
}

/*------ チケット等・お問い合わせ ------*/
#calendar DD H5{
}
.calendar_ticket_contact{
margin-left:0;
display:table;
}
.calendar_ticket_contact>*{
display:table-cell;
}
.calendar_ticket_contact+*{
margin-top:0.5em;
}
.calendar_ticket_contact H5{
font-size:100.0%;	/* 16px */
border-right:1px solid #666;
white-space:nowrap;
width:8.0em;
}
.calendar_ticket_contact .text{
padding-left:0.5em;
}

BODY:not(#home) ARTICLE#calendar{
padding-bottom:0;
}
#calendar+#return.content{	/* INDEXに戻る */
padding:3.0em 0;
border-top:none;
}



@media only screen and (min-width:981px) {	/* PC用 */
	/*------------------------------------------------
	  イベントカレンダー（ワイドPC）
	------------------------------------------------*/
	#calendar DL{
	display:table;
	border-collapse: collapse;
	}

	#calendar DT{
	display:none;
	}
	#calendar DD{
	display:table-cell;
	border-top:none;
	vertical-align:top;
	}
	.event_headline>LI:nth-child(1),	/* 開催日時ラベル */
	#calendar DD:nth-of-type(1){	/* 開催日時データ */
	width:20%;
	}
	.event_headline>LI:nth-child(2),	/* イベント名ラベル */
	#calendar DD:nth-of-type(2){	/* イベント名データ */
	width:68%;
	}
	.event_headline>LI:nth-child(3),	/* 会場ラベル */
	#calendar DD:nth-of-type(3){	/* 会場データ */
	width:12%;
	}
	/*------ 開催日時 ------*/
	.calendar_day>LI{
	display:block;
	}
	#calendar DD .date{
	display:block;
	}

	/*------ 複数公演名（昼の部、夜の部など） ------*/
	.multi{
	display:block;
	}
	/*------ 開演・開場 ------*/
	.start_time{
	margin-left:-1.0em;
	margin-right:1.0em;
	}
	.open_time{
	margin-left:-1.0em;
	}
}
@media only screen and (max-width:980px) {	/* 幅の狭いPC以下用 */
	#calendar DT,
	#calendar DD{
	margin:0;
	}
	#calendar DT{
	background:rgba(90,84,75,0.3);	/* #5A544B 海松茶*/
	}
	.multi{
	display:inline-block;
	}
	.multi .start_time{
	padding-left:0;
	}

}
@media only screen and (min-width:541px) and (max-width:980px) {	/* 幅の狭いPC～スマホ横用 */
	.tab_item{
	min-height:5.5em;
	}

	#calendar DL{
	display : -webkit-box;     /* old Android */
	display : -webkit-flex;    /* Safari etc. */
	display : -ms-flexbox;     /* IE10        */
	display : flex;
	-webkit-flex-wrap: wrap;          /* Safari etc. */
	-ms-flex-wrap    : wrap;          /* IE10        */
	flex-wrap        : wrap;
	align-items: stretch;	/* 子要素の高さを揃える */
	justify-content:center;	/* 左右中央揃え（センタリング） */
	}
	#calendar DT,
	#calendar DD{
	border-top:1px solid #666;
	}
	#calendar DT:nth-of-type(n+2),
	#calendar DD:nth-of-type(n+2){
	border-top:1px solid #999;
	}
	#calendar DT{
	padding:0.75em;
	width:8.0em;
	}
	#calendar DD{
	width : -webkit-calc(100% - 8.0em);
	width : calc(100% - 8.0em);
	}
	/*------ 複数公演名（昼の部、夜の部など）がある時は日付で改行 ------*/
	#calendar LI:has(.multi) .date{
	display:block;
	}
	.multi{
	padding-right:1.1em;
	}

}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.lineup01.inline-block,
	.lineup02.inline-block{
	display:block;
	}
	.lineup02{
	font-size:100%;
	}

	#calendar DD:nth-of-type(2) H4{
	margin:0;
	}

	/*------ チケット等・お問い合わせ ------*/
	#calendar DD H5{
	}
	.calendar_ticket_contact{
	display:block;
	}
	.calendar_ticket_contact+*{
	margin-top:1.0em;
	}
	.calendar_ticket_contact H5{
	border-right:none;
	border-top:1px solid #CCC;
	width:auto;
	display:block;
	}
	.calendar_ticket_contact .text{
	padding:0 0 0 0.75em;
	display:block;
	}
	/*------ 複数公演名（昼の部、夜の部など） ------*/
	.multi.longname .type,
	.multi .type.longname{
	display:block;
	}
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	#calendar DD:nth-of-type(2){
	padding:0.75em 0;
	}
	#calendar DD:nth-of-type(2) H4{
	padding:0 0.5em 0.5em 0.5em;
	}
	.calendar_ticket_contact H5{
	padding:0.75em 0.75em 0 0.75em;
	}
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.tab_item{
	min-height:5.5em;
	}

	#calendar DL:nth-of-type(1){
	border-top-width:2px;
	}
	#calendar DT:nth-of-type(1),	/* 開催日時ラベル */
	#calendar DT:nth-of-type(2){	/* イベント名ラベル */
	display:none;
	}

	/*------ 開催日時 ------*/
	#calendar DD:nth-of-type(1){	/* 開催日時データ */
	padding:0.5em 0 0.25em 0;
	}
	.calendar_day>LI{
	padding:0.5em 0 0 0;
	}
	.calendar_day>LI+LI{
	border-top:none;
	}
	#calendar DD .date{
	display:block;
	}
	/*------ 複数公演名（昼の部、夜の部など） ------*/
	.multi{
	display:block;
	}
	/*------ 開演・開場 ------*/
	.start_time{
	padding-left:0;
	}
	.start_time+.start_time{
	padding-left:0.5em;
	}

	/*------ イベント名 ------*/
	#calendar DD:nth-of-type(2){	/* イベント名データ */
	padding:0;
	}
	#calendar DD:nth-of-type(2) H4{
	padding:0.5em 0 1.0em 0;
	}

	/*------ チケット・お問い合わせ ------*/
	.calendar_ticket_contact+*{
	margin-top:0;
	}
	.calendar_ticket_contact H5{	/* チケット・お問い合わせラベル */
	padding:0.25em 0.5em;
	background:rgba(90,84,75,0.3);	/* #5A544B 海松茶*/
	}
	.calendar_ticket_contact .text{	/* チケット・お問い合わせデータ */
	padding:0 0.5em 0.5em 0.5em;
	}
	#calendar DT:nth-of-type(3){	/* 会場ラベル */
	padding:0.18em 0.5em;
	}

	#calendar DD:nth-of-type(3){	/* 会場データ */
	margin-bottom:1.5em;
	padding:0.5em;
	}

}





/*------------------------------------------------
  「イベント」詳細ページ
  ポスター大：上	SECTION#eyecatch.poster_l
  ポスター小：左	SECTION#eyecatch.poster

  SECTION#eyecatch
   ├ DIV#poster
   └ DIV#maindata
     ├ DL
     └ DIV#notes
------------------------------------------------*/

/*------ 共通 ------*/
#eyecatch+SECTION{
margin-top:1.5em;
}
#events H3{
margin-right:auto;
margin-left:auto;
padding:0;
text-align:left;
font-size:150.0%;	/* 24px */
width : -webkit-calc(100% - 50px) ;
width : calc(100% - 50px);
max-width:1150px;
}
#eyecatch DL{
margin-top:0;
margin-bottom:0;
min-width:initial;
}
#eyecatch DD UL{
margin-bottom:0;
}
#events UL.item>LI{
margin:1.5em auto 0 auto;
}


/*------ メインデータ（開催日時・会場・主催・その他）------*/
#maindata{
}
#maindata DD{
min-height:2.5em;	/* スマホ時に空欄でも高さを維持 */
}
#maindata DD UL.check{
margin:0.2em auto;
padding:0.5em;
}
#maindata DD UL.check LI{
margin-left:0.5em;
}


/*------ 付記（主催・注記など） ------*/
#notes{
padding:1.0em 0.5em 0 0.5em;
width:100%;
text-align:left;
}
/*------ ポスター大：上 ------*/
.poster_l>*:nth-child(1),	/* 上 #poster_l */
.poster_l>*:nth-child(2){	/* 下 #maindata */
width:100%;
}
.poster_l #poster>IMG{
margin:auto auto 0.5em auto;
display:block;
}
.poster_l #maindata{
padding-top:1.0em;
}

.photographer{	/* 著作権、撮影者名など */
margin:0 0 0 auto;
padding:0 0.2em;
display:table;
font-size:87.5%;	/* 14px */
text-align:left;
line-height:1.2;
}
/*------ 公演ラインナップ・トップページPickupでの著作権、撮影者名表示 ------*/
LI.imagebox:has(.photographer){
position:relative;
}
LI.imagebox>.photographer{
position:absolute;
bottom:0;
right:0;
background:rgba(0,0,0,0.8);
font-size:75.0%;	/* 12px */
color:#FFF;
line-height:1.5;
}

#events H5{
margin-top:1.0em;
}

#poster .imagebox.noimage{	/* ポスター欄　イベント画像無い時 */
margin:auto;
display:block;
width:100%;
max-width:750px;
min-height:160px;
aspect-ratio: 3 / 2;
position:relative;
}

/*------ イベントお問い合わせ先 ------*/
UL.inline-block-li.event_organizer{
margin-left:-0.5em;
}
UL.inline-block-li.event_organizer>LI{
padding:0 0.5em;
}
*:has(>UL.inline-block-li.event_organizer){	/* その親要素 */
overflow:hidden;
}


@media only screen and (min-width:901px) {	/* 幅の広いPC以上用 */
	#maindata DL{
	border:1px solid #B4ADA9;	/* Beige Gray */
	}
	.poster_l #maindata {
		DL{
		width:50%;
		}
		 DL+DL{
		margin-top:0;
		border-left:none;
		}
	}
}
@media only screen and (max-width:900px) {	/* 幅の狭いPC以下用 */
	.poster_l #maindata DL+DL{
	border-top:none;
	}
}
/*------ ポスター小：左 ------*/
.poster>*:nth-child(1), 	/* 左 #poster */
#events SECTION.profile>*:nth-child(1){	/* 左 画像 */
width:40%;
}
.poster>*:nth-child(2),	/* 右 #maindata */
#events SECTION.profile>*:nth-child(2){	/* 右 プロフィール */
padding-top:1.0em;
width:56%;
min-width:initial;
}
.poster #maindata DL{
width:100%;
}
.poster #maindata DL+DL{
border-top:none;
}


@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.poster>*:nth-child(1), 
	#events SECTION.profile>*:nth-child(1),
	.poster>*:nth-child(2), 
	#events SECTION.profile>*+DIV{
	width:100%;
	}
}

/*--------------------------------------------------------------------
  「チケット情報」固有の設定
---------------------------------------------------------------------*/
#ticket_guide_item LI{
padding:2.0em 0.5em;
text-align:center;
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#ticket_guide_item{
	padding:0;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#ticket_website{
	font-size:100%;
	}

}

/*--------------------------------------------------------------------
  「施設案内」固有の設定
---------------------------------------------------------------------*/
@media only screen and (min-width:769px) {	/* PC用 */
	.row-reverse{
	flex-direction: row-reverse;
	}
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */

}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
}


/*------------------------------------------------
  フロアマップ
------------------------------------------------*/
#floormap_item [id^="map"]{	/* map4f～mapb2f 6層 */
width:100%;
}
#floormap_item [id^="map"] + [id^="map"] {	/* フロアマップ層重ね分 */
margin-top:-8.0vw;
}

#floormap_item [id^="map"] *{
vertical-align:middle;
}


/*------ 左側フロアマップ欄 ------*/
#floormap_item [id^="map"] .image{
margin:auto;
width:50%;
vertical-align:middle;
transform:skewX(-30deg) scaleY(0.5);
transition:transform 0.5s ease;
-webkit-transition:transform 0.5s ease;
-moz-transition:transform 0.5s ease;
-o-transition:transform 0.5s ease;
position:relative;
}
#floormap_item [id^="map"]:hover .image{
transform:skewX(0) scaleY(1.0);
z-index:10;
}

#floormap_item [id^="map"] .image A:hover{
opacity:1.0;
}
#floormap_item [id^="map"] .image IMG{
border:1px solid transparent;
transition:border-color 0.5s ease;
-webkit-transition:border-color 0.5s ease;
-moz-transition:border-color 0.5s ease;
-o-transition:border-color 0.5s ease;
filter: grayscale(20%);
width:100%;
}
#floormap_item [id^="map"]:hover .image IMG{
border-color:#000;
opacity:1.0;
}
BODY[id$="hall21"] #floormap_item [id^="map"]:hover .image IMG{	/* 森のホール */
border-color:#553;	/* Darkolive org */
}
#floormap_item [id^="map"]:hover .image IMG{
}

@media only screen and (min-width:769px) {	/* PC用 */
	#floormap_item [id^="map"] .image IMG{
	filter: grayscale(50%);
	opacity:0.8;
	}
	#floormap_item [id^="map"]:hover .image IMG{
	filter: grayscale(20%);
	}

	BODY[id$="theater"] #floormap_item IMG{	/* 市民劇場 */
	max-height:500px;
	}

}


/*------ 右側施設名欄 ------*/
#floormap_item [id^="map"] UL{
margin:1.5em 0 1.5em -1px;
padding:1.0em 1.0em 1.0em 7.0em;
text-indent:-5.2em;
text-align:left;
transition: background 0.5s ease;
-webkit-transition: background 0.5s ease;
-moz-transition: background 0.5s ease;
-o-transition: background 0.5s ease;
}

#floormap_item [id^="map"]:hover UL{
background:#000;
color:#FFF;
}
BODY[id$="hall21"] #floormap_item [id^="map"]:hover UL{	/* 森のホール */
background:#553;	/* Darkolive org */
}


#floormap_item [id^="map"]:hover UL A{
color:#FFF;
}
#floormap_item [id^="map"] LI{
text-indent:0;
vertical-align:middle;
}
#floormap_item [id^="map"] LI H4{
margin:0 0.3em 0 0;
width:2.7em;
text-align:center;
border-right-style:solid;
border-right-width:1px;
}


@media only screen and (min-width:1201px) {	/* 幅の広いPC以上用 */
	#floormap_item [id^="map"] + [id^="map"] {	/* フロアマップ層重ね分 */
	margin-top:-6.0em;
	}
}



@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#floormap_item [id^="map"] + [id^="map"] {	/* フロアマップ層重ね分解除 */
	margin-top:2.0vw;
	padding-top:2.0vw;
	border-top:1px solid #CCC;
	}
	#floormap_item [id^="map"]>*{
	display:block;
	}
	#floormap_item  [id^="map"] .image{
	width:100%;
	transform:skewX(0) scaleY(1.0);
	}

	#floormap_item [id^="map"] UL{
	margin:0;
	padding-left:6.0em;
	}


	BODY[id$="theater"] #floormap_item .gallery-popup A{	/* モバイル時はモーダル不可 */
	cursor: default;
	pointer-events: auto;
	}
	BODY[id$="theater"] #floormap_item .gallery-popup A:hover{	/* モバイル時はモーダル不可 */
	opacity:1.0;
	}


}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#floormap_item [id^="map"] UL{
	padding-left:1.0em;
	}
	#floormap_item [id^="map"] LI:has(H4){
	margin-top:-1.0em;
	margin-left:-1.0em;
	display:block;
	}
	#floormap_item [id^="map"] LI H4{
	padding-top:0.5em;
	padding-bottom:0.5em;
	border-bottom-style:solid;
	border-bottom-width:1px;
	}
}



/*------------------------------------------------
  施設一覧 INDEX
------------------------------------------------*/
#facilities_list_small H4{
font-size:112.5%;	/* 18px */
}

#facilities_theater [id^="facilities_list"] .imagebox.noimage{
margin-bottom: 1.5em;
aspect-ratio: 16 / 13;	/* 519×422 */
}

[id^="facilities_list"] IMG{
width:100%;
}

/*------------------------------------------------
  施設一覧>関連施設ギャラリー
------------------------------------------------*/
#outline UL.item{
margin-bottom:0;
}
#outline UL.item+UL.item{
margin-top:0;
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#outline UL.item+UL.item{
	margin-top:-1.5em;
	}
}

/*------------------------------------------------
  座席表
------------------------------------------------*/
/*------ 通常時とオーケストラピット使用時の列幅を等幅にしたい ------*/
.data_table.th-tdx2 THEAD TR>*:nth-child(2),
.data_table.th-tdx2 THEAD TR>*:nth-child(3){
width:40%;
}
@media only screen and (min-width:769px) {	/* PC用 */
	#seatcharting_item IMG{
	margin:auto;
	max-width:900px;
	}
	#seatcharting_item.flexbox IMG{
	width:100%;
	max-width:367px;
	}
}

/*------------------------------------------------
  館内インフォメーション
------------------------------------------------*/
#facilities_guide .image IMG{
margin:auto;
display:block;
}
#facilities_guide .imagebox.noimage{
margin:auto;
/* width:60%; */
aspect-ratio: 3 / 2;	/* 600×400 */
}
#facilities_guide .data_table:has(+.data_table){	/* 表コピー・プリント */
margin-bottom:0;
border-bottom:none;
}
#facilities_guide .data_table+.data_table{	/* 表FAX */
margin-top:0;
}

#copy-machine TABLE TH{
width:45%;
}

@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	#facilities_guide .layoutbox .image IMG{
	width:100%;
	}
}



/*------------------------------------------------
  座席表
------------------------------------------------*/
#seatingchart{
margin-top:3.0em;
}
#seatingchart_item{
}
#seatingchart_item>LI{
text-align:center;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
#seatingchart_guide{
width:60%;
}
#seatingchart_guide DIV{
margin:0 auto;
}

#seatingchart_image{
padding:20px;
background:#FFF;
width : -webkit-calc(40% - 30px) ;
width : calc(40% - 30px);
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#seatingchart{
	margin-top:3.0em;
	}
	#seatingchart_guide,
	#seatingchart_image{
	width:100%;
	}
}


#seatingchart_image A{
margin:0 auto;
display:block;
}
#seatingchart_image IMG{
margin:0 auto 1.0em auto;
}


/*--------------------------------------------------------------------
  「ご利用案内」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  施設利用料金
------------------------------------------------*/
ARTICLE[id^="fee"] .data_table{
width:100%;
}

ARTICLE[id^="fee"] .scroll_table .data_table{
min-width:858px;
}
ARTICLE[id^="fee"] .data_table TBODY TH{
text-align:left;
}
ARTICLE[id^="fee"] .data_table THEAD TR>TH:nth-child(n+3),
ARTICLE[id^="fee"] .data_table TD+TD{
border-left:1px solid rgba(102,102,102,0.5);
}

/*------ 楽屋利用料金（TDは全て料金） ------*/
.all-fee TD{
text-align:right;
}

BODY[id$="_hall21"] .all-fee TBODY TR>TH:nth-child(1){	/* 左見出しセルの幅 */
width:25%;
}
BODY[id$="_theater"] .all-fee TBODY TR>TH:nth-child(1){	/* 左見出しセルの幅 */
width:10%;
}

/*------ 付帯設備利用料金表（品名/単位/区分/利用料） ------*/
BODY[id$="_hall21"] .c3-fee TBODY TR>TH:nth-child(1){	/* 左見出しセルの幅 */
width:50%;
}

BODY[id$="_hall21"] .c3-fee TBODY TR>TD:nth-of-type(1),	/* 単位 */
.c3-fee TBODY TR>TD:nth-of-type(2){	/* 区分 */
text-align:center;
}
.c3-fee TBODY TR>TD:nth-last-of-type(1){	/* 利用料 */
text-align:right;
}
/*------ 料金表内のOLリスト ------*/
.nomargin_top{
margin-top:0;
}
.nomargin_bottom{
margin-bottom:0;
}


/*------ セット料金表 ------*/
.color.fee_set{
margin-top:3.0em;
}
.fee_set SPAN.unit{	/* 単位 */
right:0;
top:-1.8em;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#fee TABLE.data_table{
	width:auto !important;
	min-width:initial;
	}
	#fee TABLE.data_table *{
	white-space:nowrap;
	}

}


/*--------------------------------------------------------------------
  「アクセス」「English」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  分岐INDEX
------------------------------------------------*/
#branch H3{
padding-right:4.0em;	/* 詳細ボタン設置分 */
font-size:min(12.0vw,125.0%);	/* 20px */
}
#branch H3 .link_small{
padding:0.5em;
left:auto;
right:0;
}

#branch .googlemap{
margin-top:1.5em;
}


/*------------------------------------------------
  決済方法 ブランドロゴ
------------------------------------------------*/

/*------------------------------------------------
  各種交通機関でのアクセス方法
<I class="fa-solid fa-car"></I>
<I class="fa-solid fa-taxi"></I>
<I class="fa-solid fa-train"></I>
<I class="fa-solid fa-bus"></I>
------------------------------------------------*/

/*------------------------------------------------
  駐車料金
------------------------------------------------*/

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#access_guide>DIV+DIV{
	padding-top:3.0em;
	border-top:1px solid #000;
	}
	#pay_brands IMG{
	max-width:11vw;
	max-height:11vw;
	}
	.googlemap{
	height:66.7vw;
	}
}



/*--------------------------------------------------------------------
  「主催者の方へ」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  ダウンロード
------------------------------------------------*/
#download>*+H3, H3~H3{
margin-top:2.0em;
position:relative;
}

UL.download_item{
}
UL.download_item>LI{
text-align:left;
}

.download_item A.pdf,
.download_item A.word,
.download_item A.excel{
padding:0.8em 0.5em 0.8em 45px;
background-repeat:no-repeat;
background-position:5px 0.45em;
list-style:none;
min-height:32px;
display:block;
border:1px solid #000;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
}



/*--------------------------------------------------------------------
  「よくある質問」固有の設定
--------------------------------------------------------------------*/
/*------------------------------------------------
  DLリスト 自動ナンバリング + 丸数字
------------------------------------------------*/
UL.autonumbering>LI+LI{
margin-top:1.0em;
}

UL.autonumbering>LI,
DL.autonumbering>DT{
padding:0.5em 0 0.5em 3.0em;
counter-increment: cnt;
list-style-type:none;
position:relative;
}
UL.autonumbering>LI::before,
DL.autonumbering>DD::before,
DL.autonumbering>DT::before{
padding:0.35em 0;
display: marker;
text-align:center;
letter-spacing:0;
position:absolute;
left:0;
top:0;
width:2.2em;
line-height:1.5;
font-weight:700;
border-style:solid;
border-width:1px;
}
UL.autonumbering>LI::before{
content: counter(cnt);
}

DL.autonumbering>DT::before{
content: "Q"counter(cnt);
}
DL.autonumbering>DD::before{
margin-right:0.5em;
content: "A"counter(cnt);
background:#E6B422; /* 黄金 */
}
DL.faq,
DL.faq>*{
box-sizing: content-box;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
}
DL.faq.autonumbering>DD>*{
margin-bottom:1.0em;
}
DL.faq.autonumbering>DD>UL,
DL.faq.autonumbering>DD>OL{
margin-top:1.0em;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
DL.faq.autonumbering>DD LI{
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}



@media only screen and (max-width:768px) {	/* スマホ横以下用 */
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	UL.autonumbering>LI{
	padding:2.7em 0 0.5em 0.5em;
	}

	DL.faq.autonumbering{
	margin-left:-10px;
	margin-right:-10px;
	}
	DL.faq.autonumbering>DD{
	margin:0 0.5em 0 2.5em;
	}


}

/*------------------------------------------------
  アコーディオン JavaScriptと併用
------------------------------------------------*/
DL.faq.autonumbering.accordion>DT{
margin-bottom:0.5em;
padding-right:2.0em;
cursor:pointer;
transition : border 0.5s;
transition: opacity 0.5s ease;
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
}
DL.faq.autonumbering.accordion>DT:hover{
opacity:0.6;
}

DL.faq.autonumbering.accordion>DD+DT{
margin-top:1.0em;
}

DL.faq.autonumbering.accordion>DT::after{
position:absolute;
right:0.5em;
font-family: "Font Awesome 7 Free";
font-weight : 900;
content:"\f107";
}
DL.faq.autonumbering.accordion>DT.open::after{
transform: scaleY(-1);	/* 上下反転 */
}
DL.faq.autonumbering.accordion>DD{
margin-top:1.0em;
margin-bottom:2.0em;
padding:0.5em 0 2.0em 3.0em;
display:none;
position:relative;
border-bottom:1px solid #000;
}



/*--------------------------------------------------------------------
  「チケット・友の会」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  申込フロー .flow.autonumbering
------------------------------------------------*/
H5+.flow.autonumbering{
padding-top:1.0em;
}


.ticket_membership_contact .link_small{
margin:0.5em 0;
display:table;
}
.ticket_membership_contact LI+LI{
margin-top:0.5em;
}


@media only screen and (min-width:981px) ,
 only screen and (min-width:541px) and (max-width:768px) {	/* 幅の広いPC用 */
	.ticket_membership_contact LI:has(.link_small){
	position:relative;
	padding-right:7.5em;	/* アクセスボタンの幅 */
	}
	.ticket_membership_contact .link_small{
	margin:0;
	position:absolute;
	right:0;
	bottom:0;
	}
}





/*--------------------------------------------------------------------
  「お問い合わせ」固有の設定
---------------------------------------------------------------------*/
#contact H3+SECTION{
margin-top:0.5em;
}
#contact MAIN H4,
#contact MAIN P{
margin-bottom:0;
}
#contact MAIN *+H4{
margin-top:1.0em;
}
#contact MAIN H4+*,
#contact MAIN P+UL{
margin-top:0.5em;
}

#artonestop H3{
margin-bottom:0.5em;
}

/*--------------------------------------------------------------------
  guide/  BODY#guide
  指定管理者～個人情報保護方針
---------------------------------------------------------------------*/
#contact MAIN H3,
#guide MAIN H3{
font-size:137.5%;	/* 22px */
text-align:left;
}
#contact MAIN H3~H3,
#guide MAIN H3~H3{
margin-top:3.0em;
}
#contact SECTION *:first-child,
#guide SECTION *:first-child{
margin-top:0;
}
#contact MAIN H4,
#guide MAIN H4{
font-size:112.5%;	/* 18px */
}




/*--------------------------------------------------------------------
  「お知らせ」固有の設定
---------------------------------------------------------------------*/
#information ARTICLE>H3{
padding:0.3em 0;
font-size:150.0%;	/* 24px */
text-align:left;
border-bottom-style:solid;
border-bottom-width:1px;
position:relative;
}

#information H3 .date{
padding:0.5em 0.1em;
display:block;
font-size:66.7%;	/* 16px */
text-align:right;
font-weight:400;
color:#000;
position:absolute;
left:0;
top:100%;
}

#information H4{
margin-bottom:0;
font-size:125.0%;	/* 20px */
}
#information *+H4{
margin-top:2.0em;
}
#information *+H5{
margin-top:1.5em;
}

#information H5{
font-size:100.0%;
}

#information H4+H5{
margin-top:0;
}
#information P{
margin-bottom:0.5em;
}


#information UL.kome{
margin-top:0;
}

/*------------------------------------------------
  重要なお知らせ
------------------------------------------------*/
#information ARTICLE.important{
margin:3.0em auto;
padding-top:1.0em;
padding-bottom:1.0em;
width : -webkit-calc(100% - 50px) ;
width : calc(100% - 50px);
max-width:1150px;
background-color:rgba(238,231,224,0.5);	/* Ecru */
}
#information ARTICLE.important H3{
color:#AA242B;	/* AAA赤 */
}



@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#information ARTICLE>H3{
	border-top-style:solid;
	border-top-width:1px;
	}

}

/*--------------------------------------------------------------------
  「English」固有の設定
--------------------------------------------------------------------*/
BODY[id^="english"] MAIN *{
word-break:normal;
}

BODY[id^="english"] .content UL.kome>LI>SPAN:first-child,
BODY[id^="english"] .content LI.kome>SPAN:first-child{	/* ※印 ではなく *印を使うため */
padding-right:0.25em;
padding-left:0.25em;
}
BODY[id^="english"] #contact .content>H4~*{
margin-top:0.5em;
margin-bottom:0.5em;
}


@media only screen and (max-width:540px) {	/* スマホ縦用 */
	BODY[id^="english"] #contact .content>H4~*{
	text-align:left;
	}
}

/*--------------------------------------------------------------------
  「サイトマップ」固有の設定
--------------------------------------------------------------------*/
#sitemap_item SECTION>UL>LI+LI{
margin-top:2.0em;
}
#sitemap_item UL{
padding-left:1.0em;
}
#sitemap_item UL UL{
font-size:98%;
}

#sitemap_item SECTION>UL>LI>UL:not(.inline-block-li)>LI+LI{
margin-top:1.0em;
}
#sitemap_item SECTION>UL>LI LI{
margin-top:0.5em;
}
#sitemap_item SECTION>UL>LI LI:has(UL){
display:block;
}

/*------ 公式SNS ------*/
#sitemap_item H3{
margin-bottom:-1.0em;
padding-bottom:0;
font-size:112.5%;	/* 18px */
}



/*--------------------------------------------------------------------
  「コンテンツ」固有の設定
--------------------------------------------------------------------*/
/*------------------------------------------------
  動画
------------------------------------------------*/
.video{
width: 100% !important;
height:auto !important;
}


/*------------------------------------------------
  バナー
  .wide はページ幅
------------------------------------------------*/
.banner A{
display:inline-block;
text-decoration:none !important;
}

.type_banner.banner{
padding-top:2.0em;
padding-bottom:2.0em;
}

.type_banner.banner A{
padding:1.5em 2.0em;
min-height:3.0em;
line-height:1.2;
position:relative;
z-index:1;
overflow:hidden;
}


/*------------------------------------------------
  親要素の範囲にリンクエリアAを拡張
------------------------------------------------*/
.overlink{
}
.overlink>*,
.overlink{
position:relative;
transition: background 0.5s ease, color 0.5s ease, opacity 0.5s ease;
-webkit-transition: background 0.5s ease, color 0.5s ease, opacity 0.5s ease;
-moz-transition: background 0.5s ease, color 0.5s ease, opacity 0.5s ease;
-o-transition: background 0.5s ease, color 0.5s ease, opacity 0.5s ease;
}
.overlink A.more{
position:absolute;
width:100%;
height:100%;
top:0;
bottom:0;
left:0;
right:0;
display:block;
}
.overlink A.more SPAN{
display:none;
}
.overlink *{
transition: filter 0.5s ease, transform 0.3s, opacity 0.5s ease;
-webkit-transition: filter 0.5s ease, transform 0.3s, opacity 0.5s ease;
-moz-transition: filter 0.5s ease, transform 0.3s, opacity 0.5s ease;
-o-transition: filter 0.5s ease, transform 0.3s, opacity 0.5s ease;
}
.overlink:hover .text{
opacity:0.7;
}
.overlink .image{
overflow:hidden;
display:block;
}
.overlink .image IMG{
/* filter: brightness(90%); */
display:block;
}
.overlink:hover .image IMG{
filter: brightness(110%);
transform: scale(1.1);
}

/*-----------------------------------------------
  疑似要素NGの時の矢印
------------------------------------------------*/

/*-----------------------------
\f105
<I class="fa-solid fa-angle-right after arrow extrasmall"></I>
------------------------------*/
*:has(>.arrow.after){
padding-right:2.0em;
position:relative;
}
.arrow.after{
position:absolute;
transform : translateY(-50%);
top:50%;
right:0;
}


A.arrow{
/*
padding-right:2.5em !important;
position:relative;
*/
}


/*------------------------------------------------
  IFRAME表示（Magnific-Popup-master）
------------------------------------------------*/
/*------------------------------------------------
  インライン表示（Magnific-Popup-master）
------------------------------------------------*/
/*------------------------------------------------
  ギャラリー表示（Magnific-Popup-master）
------------------------------------------------*/
.gallery-popup A:has(IMG){
margin-right:auto;
margin-left:auto;
position:relative;
/* display:block; */
display:table;
outline:none;
text-decoration:none;
cursor: url(img/magnify_plus.cur), pointer;	/* カーソルを虫眼鏡に */
}
.gallery-popup A IMG{
margin:auto;
}

/* 
====== Zoom effect ======
*/
.mfp-zoom-in {
  /* start state */
  /* animate in */
  /* animate out */
}
.mfp-zoom-in .mfp-with-anim {
  opacity: 0;
  transition: all 0.5s ease-in-out;	/* 初期値0.3 */
  transform: scale(1.0);	/* 初期値0.8 */
}
.mfp-zoom-in.mfp-bg {
  opacity: 0;
  transition: all 0.3s ease-out;
}
.mfp-zoom-in.mfp-ready .mfp-with-anim {
  opacity: 1;
  transform: scale(1);
}
.mfp-zoom-in.mfp-ready.mfp-bg {
  opacity: 0.8;
}
.mfp-zoom-in.mfp-removing .mfp-with-anim {
  transform: scale(0.8);
  opacity: 0;
}
.mfp-zoom-in.mfp-removing.mfp-bg {
  opacity: 0;
}


/*------ 虫眼鏡アイコン ------*/
A.zoom,
.zoom A{
position:relative;
}
A.zoom::after,
.zoom A::after{
position:absolute;
bottom:0;
right:0;
line-height:1;
font-family: "Font Awesome 7 Free";
content:"\f00e";
font-weight:bold;
font-size:20px;
color:rgba(255,255,255,0.8);
text-shadow: 1px 1px 1px #000, -1px -1px 1px #000;
}

/*-----------------------------------------------
  ふわっと表示　じわじわ(with JavaScript)
------------------------------------------------*/
SECTION>*,ARTICLE>*,P,ARTICLE LI,ARTICLE DL>*,
.effect-fade{
opacity : 0;
transition : opacity 1500ms;
}

SECTION>*.effect-scroll,ARTICLE>*.effect-scroll,P.effect-scroll,ARTICLE LI.effect-scroll,
ARTICLE DL>*.effect-scroll,
.effect-fade.effect-scroll {
opacity : 1.0;
}

.effect-move{
opacity : 0;
transform : translate(0, 10vh);
transition : opacity 2500ms, transform 1500ms;
}
.effect-move.effect-scroll {
opacity : 1;
transform : translate(0, 0);
}



/*-----------------------------------------------
  文字じわっと表示　じわじわ(with JavaScript)
------------------------------------------------*/
.blur{
	animation-delay:800ms;	/* bxSliderの speed値とほぼ同じに */
	animation-name:blurAnime;
	animation-duration:1500ms;
	animation-fill-mode:forwards;
}

@keyframes blurAnime{
  from {
	filter: blur(10px);
/*	transform: scale(1.02); */
	opacity: 0;
  }

  to {
	filter: blur(0);
/*	transform: scale(1); */
	opacity: 1;
  }
}
 
.blurTrigger{
    opacity: 0;
}


/*------------------------------------------------
  レイアウト
------------------------------------------------*/
.inline-block{
display:inline-block;
}
.block{
margin-right:auto;
margin-left:auto;
display:block;
}
.island,
.table-table-cell,
.table{
margin-right:auto;
margin-left:auto;
display:table;
width:auto;
}
.table-table-cell>*{
display:table-cell;
}
.table.left{
margin-left:0;
}

.nowrap{
white-space:nowrap;
}


.relative{
position:relative;
}
.absolute{
position:absolute;
}
.x50y50{
transform : translate(-50%, -50%);
top:50%;
left:50%;
}
.x0y50{
transform : translateY(-50%);
top:50%;
left:0;
}
.x50y0{
transform : translateX(-50%);
top:0;
left:50%;
}

.valign_middle>*{
vertical-align:middle;
}
.valign_top>*{
vertical-align:top;
}


/*------------------------------------------------
  準備中表示
------------------------------------------------*/
.underconstruction{
margin:2em auto;
padding:120px 25px 20px 25px;
background-image:url(img/comingsoon.png);
background-position:center top;
background-repeat:no-repeat;
text-align:center;
width:90%;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.underconstruction{
	padding:50px 0;
	background-position:center;
	width:auto;
	}
}



/*------------------------------------------------
  署名
------------------------------------------------*/
.signature{
margin-right:0;
margin-left:auto;
display:table;
}


/*------------------------------------------------
  区切りのスラッシュ / 表示
------------------------------------------------*/
.double_dash,
.slash,
.dot{
display:inline-block;
}
.slash,
.slash_tablet{
padding:0 0.5em;
}
.double_dash{
padding:0 0.3em 0.2em 0.2em;
letter-spacing:-0.05em;
vertical-align:middle;
line-height:1;
}


@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.slash_tablet,
	.dot_tablet{
	margin-bottom:-0.3em;
	padding:0;
	overflow: hidden;	/* -9999 */
	text-indent: 100%;	/* -9999 */
	white-space: nowrap;	/* -9999 */
	display:block;
	width:1px;
	height:0;
	}
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.slash,
	.dot{
	padding:0;
	display:block;
	}
	.slash{
	overflow: hidden;	/* -9999 */
	text-indent: 100%;	/* -9999 */
	white-space: nowrap;	/* -9999 */
	width:1px;
	height:0;
	}
	.dot{
	height:0.5em;
	line-height:0.5;
	}

}

/*------------------------------------------------
   行頭アイコン
------------------------------------------------*/
.content .icon A,
.content .icon A:hover{
text-decoration:none;
}
.icon A:hover{
opacity:0.7;
}


/*------ リンクが無い場合に使用可 ------*/
.icon.display_ib [class^="fa"]:nth-of-type(1){
margin-right:0.5em;
}
.icon.display_b [class^="fa"]:nth-of-type(1){
margin:auto auto 0.5em auto;
display:table;
}

/*------ FA・画像背景 共通 サイズ指定・位置指定 ------*/
/*------ 行頭に配置 ------*/
.display_ib IMG,
.display_ib [class^="fa"]:nth-of-type(1) {
display:inline-block;
margin:auto 0.5em auto auto;
}
.display_ib IMG,
.display_ib SPAN{
line-height:1;
display:inline-block;
vertical-align:middle;
}

/*------ 上に配置 ------*/
.display_b  [class^="fa"]:nth-of-type(1){
margin:auto auto 0.3em auto;
display:block;
}

/*------ Font Awesome タイプ ------*/
.type_fa.myserf [class^="fa"]:nth-of-type(1),
.type_fa  [class^="fa"]:nth-of-type(1){
text-align:center;
vertical-align:middle;
letter-spacing:0;
text-indent:0;
line-height:1;
}
.icon.type_fa.size_s [class^="fa"]:nth-of-type(1){
font-size:125.0%;	/* 20px */
}
.icon.type_fa.size_sm [class^="fa"]:nth-of-type(1){
font-size:150.0%;	/* 24px */
}
.icon.type_fa.size_m [class^="fa"]:nth-of-type(1){
font-size:175.0%;	/* 28px */
}
.icon.type_image.size_m IMG{
width:90px;
}

.icon.type_fa.size_l [class^="fa"]:nth-of-type(1){
font-size:225.0%;	/* 36px */
}
.icon.type_image.size_l IMG{
width:120px;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.icon.display_ib [class^="fa"]:nth-of-type(1),
	.icon.display_ib IMG{
	margin:auto auto 0.5em auto;
	display:block;
	}
}

/*------------------------------------------------
  アイテム横並び .flexbox.layoutbox
------------------------------------------------*/
.layoutbox>*.w20p,
.layoutbox>*.w80p+*{
width : -webkit-calc(20% - 0.75em);
width : calc(20% - 0.75em);
}
.layoutbox>*.w20p+*,
.layoutbox>*.w80p{
width : -webkit-calc(80% - 0.75em);
width : calc(80% - 0.75em);
}
.layoutbox>*.w30p,
.layoutbox>*.w70p+*{
width : -webkit-calc(30% - 0.75em);
width : calc(30% - 0.75em);
}
.layoutbox>*.w30p+*,
.layoutbox>*.w70p{
width : -webkit-calc(70% - 0.75em);
width : calc(70% - 0.75em);
}
.layoutbox>*.w40p,
.layoutbox>*.w60p+*{
width : -webkit-calc(40% - 0.75em);
width : calc(40% - 0.75em);
}
.layoutbox>*.w40p+*,
.layoutbox>*.w60p{
width : -webkit-calc(60% - 0.75em);
width : calc(60% - 0.75em);
}
.layoutbox>*.w50p+*,
.layoutbox>*.w50p{
width : -webkit-calc(50% - 0.75em);
width : calc(50% - 0.75em);
}
MAIN .layoutbox>*>*:first-child{
margin-top:0;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.layoutbox>*,
	.layoutbox>*+*{
	width:100% !important;
	height:auto;
	}
	.layoutbox>*+*{
	margin-top:1.5em;
	}
}



/*------------------------------------------------
  アイテム横並び .flexbox
------------------------------------------------*/
.item{
}
.item.space-between{
}
.item.space-around{
padding:0 0.75em;
}


.item>*{
margin:0.75em 0;
padding:0;
text-indent:0;
}
.item.margin>*{	/* .part2,.part3 */
margin:1.5em 0;
}

.item.padding>*{
padding:1.0em;
}
.item>LI::before{
display:none !important;
}

.item>*>*{
margin-bottom:0;
}
.item>*>*:first-child{
margin-top:0;
}

/*------ 2列 ------*/
.item.part2>*{	/* □1.5□ */
width : -webkit-calc( (100% - 1.5em) / 2 );
width : calc( (100% - 1.5em) / 2 );
}
.item.part2.margin>*{	/* □3.0□ */
width : -webkit-calc( (100% - 3.0em) / 2 );
width : calc( (100% - 3.0em) / 2 );
}

/*------ 3列 ------*/
.item.part3>*{	/* □1.5□1.5□ */
width : -webkit-calc( (100% - 3.0em) / 3 );
width : calc( (100% - 3.0em) / 3 );
}
.item.part3.margin>*{	/* □3.0□3.0□ */
width : -webkit-calc( (100% - 6.0em) / 3 );
width : calc( (100% - 6.0em) / 3 );
}
.item.part3::after{	/* ダミーカラム */
content:"";
display: block;
width : -webkit-calc( (100% - 3.0em) / 3 );
width : calc( (100% - 3.0em) / 3 );
}

.item.part3.margin::after{	/* ダミーカラム */
content:"";
display: block;
width : -webkit-calc( (100% - 6.0em) / 3 );
width : calc( (100% - 6.0em) / 3 );
}

/*------ 4列 ------*/
.item.part4>*{	/* □1.5□1.5□1.5□ */
width : -webkit-calc( (100% - 4.5em) / 4 );
width : calc( (100% - 4.5em) / 4 );
}
.item.part4.space-around>*{	/* 0.75□1.5□1.5□1.5□0.75 */
width : -webkit-calc( (100% - 6.0em) / 4 );
width : calc( (100% - 6.0em) / 4 );
}
.item.part4::after{	/* ダミーカラム */
content:"";
display: block;
width : -webkit-calc( (100% - 4.5em) / 4 );
width : calc( (100% - 4.5em) / 4 );
}

/*------ 5列 ------*/
.item.part5>*{	/* □1.5□1.5□1.5□1.5□ */
width : -webkit-calc( (100% - 6.0em) / 5 );
width : calc( (100% - 6.0em) / 5 );
}
.item.part5.space-around>*{	/* 0.75□1.5□1.5□1.5□1.5□0.75 */
width : -webkit-calc( (100% - 7.5em) / 5 );
width : calc( (100% - 7.5em) / 5 );
}
.item.part5::after{	/* ダミーカラム */
content:"";
display: block;
width : -webkit-calc( (100% - 6.0em) / 5 );
width : calc( (100% - 6.0em) / 5 );
}




@media only screen and (min-width:769px) and (max-width:900px) {	/* 幅の狭いPC用 */
	.item.part2.over900>*{	/* □1.5□1.5□ */
	width:100%;
	}


	.item.part4:not(.tab2)>*{	/* □1.5□1.5□ */
	width : -webkit-calc( (100% - 3.0em) / 3 );
	width : calc( (100% - 3.0em) / 3 );
	}
	.item.part4:not(.tab2).space-around>LI{	/* 0.75□1.5□1.5□0.75 */
	width : -webkit-calc( (100% - 4.5em) / 3 );
	width : calc( (100% - 4.5em) / 3 );
	}
	.item.part4::after{	/* ダミーカラム */
	content:"";
	display: block;
	width : -webkit-calc( (100% - 3.0em) / 3 );
	width : calc( (100% - 3.0em) / 3 );
	}
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.item.part3:not(.tab2)>*,
	.item.part2:not(.tab2)>*{
	width:100%;
	}
	.space-between,
	.space-around{
	justify-content:justify-content:center;
	}
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	.item.part4>*,
	.item.tab2>*{	/* □1.5□ */
	width : -webkit-calc( (100% - 1.5em) / 2 );
	width : calc( (100% - 1.5em) / 2 );
	}
	.item.part4.space-around>LI{	/* 0.75□1.5□0.75 */
	width : -webkit-calc( (100% - 3.0em) / 2 );
	width : calc( (100% - 3.0em) / 2 );
	}

	.item.tab2.margin>*{	/* □3.0□ */
	width : -webkit-calc( (100% - 3.0em) / 2 );
	width : calc( (100% - 3.0em) / 2 );
	}
}


@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	.item.part5>*{	/* □1.5□1.5□1.5□ */
	width : -webkit-calc( (100% - 3.0em) / 3 );
	width : calc( (100% - 3.0em) / 3 );
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.item.part5::after,
	.item.part4::after,
	.item.part3::after{	/* ダミーカラム非表示 */
	display:none !important;
	}
	.item[class*="part"].tab2>*,
	.item[class*="part"]>*{
	width:100% !important;
	}
	.item.part5>*{	/* □1.5□1.5□1.5□ */
	width : -webkit-calc( (100% - 1.5em) / 2 ) !important;
	width : calc( (100% - 1.5em) / 2 ) !important;
	}
}




/*------------------------------------------------
  電話番号自動リンク(with JavaScript)
------------------------------------------------*/
A.tellink {
pointer-events: none;	/* PCの時はリンクしない */
cursor: default;
text-decoration:none !important;
display:inline-block;
color:#000;
}
A.tellink.tel {
pointer-events: auto;
}
.content A.tellink{
display:inline-block;
}

/*------------------------------------------------
  リンクしない・表示しない
------------------------------------------------*/
.display-none{	/* 未使用・非表示 */
display:none !important;
}
A.link-none{
pointer-events: none;
cursor: default;
filter: brightness(80%) grayscale(100%);
}
A.link-none.link_large:not([class*="bg"]){
background:#666;
}

A[href*="archives"]{	/* 開設当初はイベントアーカイブリンクを非表示 */
display:none !important;
}
A[href*="ppppp"],
#g_menu05 .mago{	/* 開設当初は空車情報を非表示 */
display:none !important;
}


/*------------------------------------------------
  上部サブメニュー
------------------------------------------------*/


/*------------------------------------------------
  丸数字
------------------------------------------------*/
.number{
padding-bottom:0.05em;
display:inline-block;
background:#000;
color:#FFF;
width:1.5em;
line-height:1.4em;
text-align:center;
text-indent:0;
border:1px solid #000;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
letter-spacing:0;
}
H4:has(.number),
H5:has(.number){
padding-left:1.8em;
text-indent:-1.8em;
}
H4 .number,
H5 .number{
margin-right:0.3em;
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	H4:has(.number),
	H5:has(.number){
	margin-left:-2%;
	}
}


/*------------------------------------------------
  ラベル
------------------------------------------------*/
.label{
padding:0 0.5em;
display: inline-block;
line-height:1.5;
text-indent:0;
}
.em8{
width:8.0em;
}
.em10{
width:10.0em;
}


/*------------------------------------------------
  フロー .flow.autonumbering
------------------------------------------------*/
.flow.autonumbering .title{
padding:0 0 0.5em 0;
font-size:112.5%;	/* 18px */
}


/*------------------------------------------------
  2列の表のようなDLリスト
------------------------------------------------*/
.dl_table{
margin:auto;
border-top:2px solid #666;
border-bottom:2px solid #666;
min-width:600px;

}
.dl_table>DT,
.dl_table>DD{
margin:0;
padding:0.5em;
border-top:1px solid #666;
}
.dl_table *{
opacity:1.0;	/* スクロールエフェクト除外 */
}

.dl_table>DT{
width:10em;
text-align:center;
background:rgba(90,84,75,0.3);	/* #5A544B 海松茶*/
}

.dl_table>DD{
width : -webkit-calc(100% - 10em) ;
width : calc(100% - 10em);
text-align:left;
}
.dl_table>DT:first-of-type,
.dl_table>DD:first-of-type{
border-top:none;
}


/*------ ネスト ------*/
.dl_table .dl_table{
margin:-0.5em;
border:none;

}
.dl_table .dl_table>DT,
.dl_table .dl_table>DD{
padding:0.5em 1.0em;
}
.dl_table .dl_table>DT{
background:rgba(90,84,75,0.15);	/* #5A544B 海松茶*/
color:#000;
}

.dl_table .dl_table>DT:first-of-type,
.dl_table .dl_table>DD:first-of-type{
border-top:none;
}

.dl_table .dl_table>DD{
word-spacing:0.5em;
line-height:1.5;
}

.dl_table .dl_table>DD>UL{
margin:0 -1.0em;
width:auto;
}
.dl_table .dl_table>DD>UL:not(.kome)>LI{
padding-left:1.0em !important;
}
.dl_table .dl_table>DD>UL>LI+LI{
margin-top:0.5em;
padding:0.5em 0 0 0;
border-top:1px solid #CCC;
}
.dl_table .dl_table DD UL.kome{
margin-left:0;
}

.dl_table .dl_table+ UL.kome{
margin:0.5em -0.5em 0 -0.5em;
padding-top:0.5em;
padding-right:0.5em;
border-top:1px solid #CCC;
}

.dl_table>DD>UL.sublist LI+LI,
.dl_table>DD>UL.sublist +.kome{
margin-top:0.5em;
}
.dl_table .label{
text-align:center;
}


@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.dl_table .label{
	margin-bottom:0.25em;
	display:block;
	text-align:left;
	}
}



/*------ 項目名が長いとき ------*/
.dl_table.longname>DT{
width:15em;
}
.dl_table.longname>DD{
width : -webkit-calc(100% - 15em) ;
width : calc(100% - 15em);
}





@media only screen and (max-width:900px) {	/* 幅の狭いPC以下用 */
	.dl_table{
	width:100%;
	min-width:auto;
	min-width:initial;
	}
	.dl_table .dl_table{
	margin:0 auto;
	width:100%;
	}

	.dl_table DT BR{
	display:none;
	}
	.dl_table>DT{
	padding:0.5em;
	text-align:left;
	display:block;
	width:100% !important;
	border:none;
	border-top:2px solid #666;
	}
	.dl_table .dl_table{
	margin:-0.5em -0.5em 0 -0.5em;
	width:auto;
	}
	.dl_table .dl_table DT{
	padding:0.3em 0.5em;
	border-top:none;
	}
	.dl_table .dl_table DD+DT{
	margin-top:0.5em;
	}


	.dl_table.longname>DD,
	.dl_table>DD{
	padding:0.5em;
	width:100%;
	border-top:none;
	}
}
	@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.dl_table .dl_table DD{
	padding:0.25em 0 0.2em 0.2em;
	}
	.dl_table .dl_table>DD>UL{
	margin:0 0 0 -0.2em;
	}

}




/*------------------------------------------------
   リンクボタン（共通）
------------------------------------------------*/
[class^="link_"]{
zoom: 1;
/* outline: none; */
text-align:center;
font-weight:500;
display:inline-block;
line-height:1.2;
}
[class^="link_"]:not(.outline){
color:#FFF;
background:#000;
}
[class^="link_"].darkolivebg{
background:#553;
}
[class^="link_"].terracottabg{
background:#6F4B3E; /* 焦げ茶 */
}


[class^="link_"] SPAN,
[class^="link_"] I{
vertical-align:middle;
}
[class^="link_"]:not(.outline):hover{
color:#FFF;
opacity:0.7;
}
[class^="link_"].white{
color:#FFF !important;
}


.link_large.before [class^="fa-"]:nth-of-type(1),
.link_small.before [class^="fa-"]:nth-of-type(1){	/* 行頭にアイコン */
padding-left:0.5em;
margin-right:0.5em;
}
.link_large.before.wide [class^="fa-"]{
margin-left:-1.2em !important;
}
.link_large.after [class^="fa-"]:not( [class^="fa-"]:nth-of-type(1) ),
.link_small.after [class^="fa-"]:not( [class^="fa-"]:nth-of-type(1) ){	/* 行末にアイコン */
a margin-left:0.5em;
}

/*------ 行末に右向き矢印 ------

<A href="hogehoge.html" class="link_large outline after">
  <SPAN>TITLE</SPAN>
  <I class="fa-solid fa-angle-right"></I>
</A>

------------------------------*/

[class^="link_"] [class*="-right"]{	/* 行末に右向き矢印 */
margin-right:-0.25em;
margin-left:1.0em;
line-height:1.0;
font-size:75%;
}
[class^="link_"]:has([class*="-right"])>*{
vertical-align:middle;
display:inline-block;
}
.link_small [class*="-right"]{	/* 行末に右向き矢印 */
margin-top:-0.35em;
}

/*------ アウトライン ------*/
*[class^="link_"].outline,
A[class^="link_"].outline:visited{
background:transparent;
border-width:1px;
border-style:solid;
}
*[class^="link_"].outline:hover{
background:#000;
color:#FFF;
}
.blackbg *[class^="link_"].outline:hover{
background-color:#433D3c; /* 檳榔子染 */
}



/*------ PDFタイプ ------*/
*[class^="link_"].pdf{
padding-left:50px;
padding-right:35px;
}
*[class^="link_"].pdf{
background-image:url(img/pdf.png);
background-repeat:no-repeat;
background-position:20px 0.55em;
background-position:20px 0.8em;
background-size:24px auto;
-webkit-background-size:24px auto;
-moz-background-size:24px auto;
-o-background-size:24px auto;
-ms-background-size:24px auto;
position:relative;
}
/*------ ファイルサイズ添え書き ------*/
.filesize{
display:inline-block;
vertical-align:middle;
font-size:75.0%;	/* 12px */
line-height:1.1;
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.filesize{
	display:block;
	position:absolute;
	bottom:-1.5em;
	right:1.0em;
	color:#000;
	}
}

/*------------------------------------------------
   リンクボタン（小）
------------------------------------------------*/
.link_small,
.link_small:visited{
padding:0.15em 0.5em;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	A.link_small{
	padding:0.5em;
	}
}

/*------------------------------------------------
   リンクボタン（大）
------------------------------------------------*/
.link_large,
.link_large:visited{
margin:auto;
padding:1.0em;
min-width:10.0em;
}

.link_large.wide{
min-width:20.0em;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.link_large{
	padding:1.0em 0.5em;
	display:block;
	width:100%;
	}
	.link_large.wide{
	min-width:initial;
	}
}
@media only screen and (max-width:320px) {	/* スマホS縦用 */
	.link_large.longname{
	padding:calc( 4.8vw / 0.75 ) 0.5em ;
	font-size:4.8vw;
	}
}


/*------------------------------------------------
  斜め
------------------------------------------------*/
/*------ 右上がり3° ------*/
.naname{
transform: rotate(-3deg);
-webkit-transform: rotate(-3deg);
-moz-transform: rotate(-3deg);
-o-transform: rotate(-3deg);
-ms-transform: rotate(-3deg);

}
/*------ 右下がり3° ------*/
.naname-{
transform: rotate(3deg);
-webkit-transform: rotate(3deg);
-moz-transform: rotate(3deg);
-o-transform: rotate(3deg);
-ms-transform: rotate(3deg);
}



/*------------------------------------------------
   強調枠囲み
------------------------------------------------*/
/*------------------------------------------------
  お問い合わせ枠
------------------------------------------------*/
.check{
border:1px solid rgba(90,84,75,0.5);	/* #5A544B 海松茶*/
}
.color{
background-color:rgba(238,231,224,0.5);	/* Ecru */
}
.check,
.color{
padding:1.0em 2.0em;
}
SECTION.check,
SECTION.color{
padding:2.0em;
}
SECTION.check H4.table:first-of-type{
margin-top:-2.1em;
padding:0 0.5em;
opacity:1.0;
}
*:not(.flexbox)>DIV.color,
*:not(.flexbox)>DIV.check{
margin-top:1.8em;
margin-bottom:1.8em;
}

.color>*,
.check>*{
margin-top:0;
margin-bottom:0.3em;
}
.color>H4,
.color>H5,
.check>H4,
.check>H5{
margin-bottom:1.0em;
}

.color>*:not(H4)+H5,
.check>*:not(H4)+H5{
margin-top:2.5em !important;
}


.color.island,
.check.island{
margin-right:auto;	/* インデントリセット */
margin-left:auto;	/* インデントリセット */
display: table;
}



/*------ TEL・Mail ------*/
.check LI.tel,
.check LI.fax,
.check LI.mail{
padding-left:0;
background:#FFF;
}
.check LI.tel{
font-size:125.0%;	/* 20px */
}
.check LI.tel::before,
.check LI.fax::before,
.mail::before{
margin-right:0.5em;
display:inline-block;
font-family: "Font Awesome 7 Free";
font-weight:bold;
vertical-align:middle;
}
.check LI.tel::before{
content:"\f095";
}
.check LI.fax::before{
content:"\f1ac";
font-size:125.0%;	/* 20px */
}
.mail::before{
margin-top:-0.2em;
margin-right:0.3em;
content:"\f0e0";
font-size:100%;
}



@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.color,
	.color.island,
	.check,
	.check.island{
	margin-right:0;	/* インデントリセット */
	margin-left:0;	/* インデントリセット */
	min-width:auto;
	min-width:initial;
	display: block;
	width:auto;
	}
}


@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.color,
	.check{
	padding:10px;
	}
	SECTION.check{
	padding:1.0em 10px 10px 10px;
	}
	SECTION.check H4.table:first-of-type{
	margin-top:-1.5em;
	}
	#facilities SECTION.check H4.table:first-of-type{
	margin-top:-2.1em;
	}
}


.radius{
border-radius:0.5em;
-webkit-border-radius:0.5em;
-moz-border-radius:0.5em;
}
.radius1em{
border-radius:1em;
-webkit-border-radius:1em;
-moz-border-radius:1em;
}
.link_large.radius2em,
.link_small.radius2em,
.radius2em{
border-radius:2em;
-webkit-border-radius:2em;
-moz-border-radius:2em;
}
.radius50{
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
}

/*--------------------------------------------------------------------
  共通レイアウト枠
--------------------------------------------------------------------*/

@media only screen and (min-width:769px) {	/* PC用 */
	MAIN{
	min-height:70vh;
	}
}
BODY:not(#home) MAIN{
padding:0 0 3.0em 0;
}
BODY:not(#home) ARTICLE{
padding:3.0em 0 5.0em 0;
position:relative;
}

#header+*{
margin-top:50px;
}

@media only screen and (min-width:1201px) {	/* 幅の広いPC以上用 */
	#header+*{
	margin-top:70px;
	}
}



@media only screen and (min-width:769px) and (max-width:1200px) {
}


@media only screen and (max-width:540px) {	/* スマホ縦用 */
	BODY:not(#home) ARTICLE{
	padding:3.0em 0;
	}
}


.lv1{
padding:6em 0;
}
.lv2{
padding:3em 0;
}
.lv3{
padding:1em 0;
}


/*------------------------------------------------
  SECTION
------------------------------------------------*/
BODY:not(#home) ARTICLE#lead{
padding-top:0;
}
BODY:not(#home) ARTICLE#lead>H3:first-of-type{
padding-top:1.5em;
}

.lead{
padding-bottom:2.5em;
font-size:112.5%;	/* 18px */
font-weight:500;
position:relative;
line-height:1.8;
text-align:center;
}
.lead::after{
position:absolute;
transform : translateX(-50%);
left:50%;
bottom:0;
margin:auto;
content:"";
display:table;
background:#000;
height:2px;
width:100px;
}
.lead.noafter{
padding-bottom:0;
}
.lead.noafter::after{
display:none;
}

BODY[id$="hall21"] #download *+H3::before,
BODY[id$="hall21"] MAIN>ARTICLE+ARTICLE::before,
BODY[id$="hall21"] .lead::after{
background:#A1A46D; /* 柳茶 */
}
BODY[id$="theater"] #download *+H3::before,
BODY[id$="theater"] MAIN>ARTICLE+ARTICLE::before,
BODY[id$="teather"] .lead::after{
background:#A16D5D; /* 宗伝唐茶 */
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.lead{
	text-align:left;
	}
}

.lead+*{
margin-top:3.0em;
}

.content{
margin-right:auto;
margin-left:auto;
padding-top:0.5em;
padding-bottom:0.5em;
width : -webkit-calc(100% - 50px) ;
width : calc(100% - 50px);
max-width:1150px;
}
.content.text{
text-align: left;
}
.content.text UL.inline-block-li:not(.banner){
text-align: left;
}

H3+.content:not(.flexbox)>*:first-child{
margin-top:1.0em;
}
SECTION+SECTION{
margin-top:5.0em;
}

.photobg{
background-image:url(img/spacer.gif);
background-repeat:no-repeat;
background-position:center;
background-size:cover;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
-ms-background-size:cover;
}
.photobg.fixed{
background-attachment:fixed;
}
.ios .photobg.fixed{
background-attachment:scroll;
}
.filter{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background-color:rgba(0,0,0,0.5);
z-index:1;
}
.title>SECTION{
padding:10em 1em 8em 1em;
}


/*------ 背景色 ------*/
.whitebg{
background-color:#FFF;
}
.blackbg{
background-color:#000;
}
.terracottabg{
background-color:#6F4B3E; /* 焦げ茶 */
}
.brownbg{
background-color:#3F312B; /* 赤墨 */
}

/*------ 青系AA ------*/
.bluebg{
background-color:#00608D;	/* Madonna blue */
}

/*------ 緑系AAA ------*/
.greenbg{
background-color:#2F4F4F;	/* DarkSlateGray */
}
.darkolivebg{
background-color:#553;	/* Olive++ */
}
.darkgreenbg{
background-color:#033;
}

/*------ 緑系AA ------*/
.lightgreenbg{
background-color:#43676B;	/* 御召茶 */
}


/*------ 赤系 ------*/
.darkredbg{
background-color:#6C272D;	/* Bordeaux */
}

/*------ その他の色 ------*/
.beigebg{
background-color:rgba(238,231,224,0.5);	/* Ecru */
}
.palegreenbg{
background-color:#80ABA9;	/* 水浅葱 */
}
.yellowgreenbg{
background-color:#A1A46D;	/* 柳茶 */
}

.yellowbg{
background-color:#e6b422;	/* 山吹茶 */
}
.graybg{
background-color:rgba(90,84,75,0.1);	/* #5A544B 海松茶*/
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	ARTICLE{
	padding:3em 0;
	max-width:auto;
	max-width:initial;
	min-width:auto;
	min-width:initial;
	}
	BODY:not(#home) ARTICLE>*{
	max-width:auto;
	max-width:initial;
	min-width:auto;
	min-width:initial;
	}
	.lead P{
		text-align:left;
}
	.lead P BR{
	display:none;
	text-align:left;
	}

}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.content.text{
	text-align: left;
	}

}

/*--------------------------------------------------------------------
  右側メニュー欄 
--------------------------------------------------------------------*/
/*------------------------------------------------
  右側サブメニュー欄 
------------------------------------------------*/
/*------------------------------------------------
  右側バナー欄 
------------------------------------------------*/


/*--------------------------------------------------------------------
  ヘッダー
--------------------------------------------------------------------*/
#header{
background:rgba(255,255,255,0.98);
color:#000;
width:100%;
position:fixed;
top:0;
left:0;
z-index:1000;
display:table;
letter-spacing:0.05vw;
}
@media only screen and (max-width:1200px) {	/* 幅の狭いPC以下用 */
	BODY.menuopen #header{
	border-bottom:1px solid #000;
	}
}
#header.scroll{
box-shadow: 0 2px 2px 0 rgba(0,0,0,0.1); 
}
#header.scroll:has(.open){
box-shadow:none; 
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
#header{
letter-spacing:1px;
}
}


/*------------------------------------------------
  ヘッダーロゴ 
------------------------------------------------*/
#header H1{
margin:0;
display:table-cell;
vertical-align:middle;
position:relative;
z-index:10;
max-width:260px;
}
A.logo{
margin:5px 10px;
display:table;
transition: opacity 0.5s ease;
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
overflow:hidden;
background-image:url(img/logo.png);
background-repeat:no-repeat;
background-position:left center;
background-size:contain;
-webkit-background-size:contain;
-moz-background-size:contain;
-o-background-size:contain;
-ms-background-size:contain;
width:100%;
max-width:240px;
height:40px;
}
#header H1 A{	/* 上記 A.logo */
}

.logo SPAN{
display:none;
}
.logo.white,
.white .logo{
background-image:url(img/logo_w.png);
}

#header H1 A:hover{
color:#FFF;
opacity:0.7;
}
@media only screen and (min-width:1201px) {	/* 幅の広いPC以上用 */
	#header H1{
	max-width:310px;
	}
	#header H1 A.logo{
	margin:12px 10px 18px 10px;
	background-image:url(img/logo.png);
	width:290px;
	max-width:initial;
	}
}
@media only screen and (min-width:1501px) {	/* 幅の広いPC以上用 */
	#header H1 A.logo{
	margin-left:20px;
	}
}

@media only screen and (max-width:1200px) {	/* 幅の狭いPC以下用 */
	#header H1{
	display:block;
	width : -webkit-calc(100% - 55px) ;
	width : calc(100% - 55px);
	}

	#header H1 A.logo{
	margin:3px 0 7px 1vw;
	}
}



/*--------------------------------------------------------------------
  プライマリーナビゲーションメニュー(PrimaryMenu)
--------------------------------------------------------------------*/

/*------------------------------------------------
  本文へ
------------------------------------------------*/
#skiplink{
top:60px;
right:0.75em;
}
A#skip{
padding:0.5em 1.5em 0.5em 0.5em;
font-size:87.5%;	/* 14px */
display:block;
background:rgba(255,255,255,0.95);
white-space:nowrap;
z-index:2;
color:#000;
}
#home A#skip{
background:rgba(0,0,0,0.5);
color:#FFF;
}
#skip .arrow.after{
right:0.5em;
}
#header.scroll #skiplink{
display:none;
}

/*------ 本文 ------*/
#maintext{
display:block;
overflow: hidden;
width:0;
height:0;
clip:rect(0,0,0,0);
}

@media only screen and (min-width:1201px) {	/* 幅の広いPC以上用 */
	#skiplink{
	top:80px;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#skiplink{
	display:none;
	}
}

/*------------------------------------------------
  ヘッダーTEL
------------------------------------------------*/

/*------------------------------------------------
  ヘッダー SNSメニュー
------------------------------------------------*/

/*------------------------------------------------
  言語切り替え
------------------------------------------------*/


/*------------------------------------------------
  Fontchanger PCのみ
------------------------------------------------*/

/*------------------------------------------------
  サイト内検索
------------------------------------------------*/

/*--------------------------------------------------------------------
  グローバルナビゲーションメニュー(menubar)
--------------------------------------------------------------------*/
#global_navi{
margin:0 auto;
display:block;
position:relative;
z-index:100;
font-weight:500;
}

/*------------------------------------------------
  全体 
------------------------------------------------*/
#global_navi > SPAN{
display: none;
}

/*------------------------------------------------
  第一階層
------------------------------------------------*/
#global_navi{
margin:0;
position:absolute;
top:0;
right:0;
width:100%;
height:5px;
background:none;
}
#global_navi > SPAN{
display:block;
padding:0;
position:absolute;
top:0;
right:0;
width: 50px;
height: 50px;
text-align: left;
text-indent: 100%;	/* text-indent: -9999px; */
overflow: hidden;	/* text-indent: -9999px; */
white-space: nowrap;	/* text-indent: -9999px; */
background-image:url(img/sp_nav.png);
background-repeat:no-repeat;
background-position:-50px 0;
background-size:auto 50px;
cursor:pointer;
transition: opacity 0.5s ease;
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
}
#global_navi > SPAN:hover{
opacity:0.6;
}

#global_navi > SPAN.open{
background-position:-100px 0;
/* right:15px;	 スクロールバー幅 */
}

UL#globalmenu{
margin:0;
width:100%;
/* display: none; */
position: absolute;
/* top:50px; */
top:-300vh;
right:0;
left:0;
opacity:0;
height:0;
background-color:#FFF;
z-index:110;
transition: opacity 0.3s ease, height 0.3s ease;
-webkit-transition: opacity 0.3s ease, height 0.3s ease;
-moz-transition: opacity 0.3s ease, height 0.3s ease;
-o-transition: opacity 0.3s ease, height 0.3s ease;
}
UL#globalmenu.open{
padding:0;
display:block;
top:51px;
width:100%;
height : -webkit-calc(100vh - 50px);
height : calc(100vh - 50px);
overflow-y: scroll;	/* 展開時に縦スクロール */
opacity:1.0;
background-color:rgba(255,255,255,0.98);
}
UL#globalmenu>LI A{
color:#000;
}
UL#globalmenu>LI A:hover{
opacity:0.7;
}

UL#globalmenu>LI{
display:block;
text-align:left;
background-color:rgba(90,84,75,0.1);	/* #5A544B 海松茶*/
border-bottom:1px solid #000;
}
UL#globalmenu>LI>A{
padding:0.8em 1.0em 0.8em 0.5em;
background:transparent;
display: block;
}
UL#globalmenu>LI:not(.open-children)>A:hover{
background:#E6B422; /* 黄金 */
}
UL#globalmenu>LI.active>A,
UL#globalmenu>LI.active>A:hover,
UL#globalmenu>LI.parent.active>A,
UL#globalmenu>LI.parent.active>A:hover,
UL#globalmenu>LI.parent.active.open-children>.children{
background:#FFF;
}
UL#globalmenu>LI.parent.active>A:hover{
opacity:1.0;
color:#666;
}

UL#globalmenu>LI .fa-angle-right,
UL#globalmenu>LI .fa-plus,
UL#globalmenu>LI .fa-minus{
display:none;
}

UL#globalmenu>LI>A>.small{	/* 森のホール21 */
display:inline-block;
}


/*------------------------------------------------
  階層
------------------------------------------------*/
DIV.children{
padding:1px 0;
display:none;
}

DIV.children H2{
display:none;
}
/*------------------------------------------------
  第二階層
------------------------------------------------*/
UL.child{
padding-left:1.0em;
flex:1;
}
UL.child>LI{
margin:0 0.5em;
text-align:left;
vertical-align:top;
}
UL.child>LI>A{
padding:0.5em;
display:inline-block;
}

UL.child>LI:not(:has(.mago)){
display:inline-block;
}


/*------------------------------------------------
  第三階層
------------------------------------------------*/
UL.mago{
margin-left:0.65em;
padding:0 0 1.0em 0;
}
UL.mago>LI{
margin:0 0.5em;
display:inline-block;
font-size:93.75%;	/* 15px */
}
UL.mago>LI>A{
padding:0.25em 0.5em;
display:block;
}

@media only screen and (min-width:1201px) {	/* 幅の広いPC以上用 */
	#global_navi{
	margin:0;
	position:static;
	width:auto;
	height:auto;
	display:table-cell;
	vertical-align:bottom;
	}
	#global_navi > SPAN{
	display:none;
	}
	UL#globalmenu.open,
	UL#globalmenu{
	margin:auto 0 auto auto;
	width:auto;
	height:auto;
	display:table;
	position: static;
	opacity:1.0;
	background-color:transparent;
	line-height:1.2;
	text-align:center;
	border-collapse: collapse;
	border-spacing:0 0;
	font-size:93.75%;	/* 15px */
/*	overflow:hidden; */
	}
	UL#globalmenu>LI{
	display:table-cell;
	z-index:23;
	vertical-align:top;
	background-color:transparent;
	border-bottom:none;
	}
	UL#globalmenu>LI.active,
	UL#globalmenu>LI:hover{
	background:transparent;
	}

	UL#globalmenu>LI>A{
	padding:1.0em 0.75em;
	border-bottom:2px solid transparent;
	}
	UL#globalmenu>LI.parent.active.open>A,
	UL#globalmenu>LI.active>A{
	border-color:#000;
	background:transparent;
	}

	UL#globalmenu>LI.parent.open>A,
	UL#globalmenu>LI>A:hover{
	border-color:#E6B422; /* 黄金 */
	background:transparent;
	}
	UL#globalmenu>LI:not(.open-children)>A:hover{
	background:transparent;
	}

	UL#globalmenu>LI>A>.small{	/* 森のホール21 */
	margin-top:-0.2em;
	margin-bottom:-1.0em;
	display:block;
	font-size:75.0%;
	}
	/*------------------------------------------------
	  PC階層
	------------------------------------------------*/
	DIV.children{
	padding:2.0em 2%;
	visibility:hidden;
	opacity:0;
	position: absolute;
	z-index:99;
	top: 100%;
	left:0;
	width:100%;
	text-align:left;
	font-size:106.7%;	/* 16px */
	background-color:#FFF;
	transition: top 0.5s ease, opacity 0.5s ease;
	-webkit-transition: top 0.5s ease, opacity 0.5s ease;
	-moz-transition: top 0.5s ease, opacity 0.5s ease;
	-o-transition: top 0.5s ease, opacity 0.5s ease;
	display : -webkit-box;     /* old Android */
	display : -webkit-flex;    /* Safari etc. */
	display : flex;
	-webkit-flex-wrap: wrap;          /* Safari etc. */
	flex-wrap        : wrap;
	align-items: flex-start;	/* 子要素の高さを揃えず上に付ける */
	box-shadow: 0 2px 2px 0 rgba(0,0,0,0.1); 
	}
	.scroll DIV.children{
	background-color:rgba(255,255,255,0.98);
	}




	/*------------------------------------------------
	  PC第二階層
	------------------------------------------------*/
	UL#globalmenu>LI.parent>A{
	position:relative;
	z-index:101;
	}
	UL#globalmenu>LI.parent>A:hover::after,
	UL#globalmenu>LI.parent.open>A::after{
	content:"";
	display:block;
	text-align:center;
	position:absolute;
	top:-webkit-calc(100% + 2px);
	top:calc(100% + 2px);
	left:50%;
	height:-webkit-calc(2.0em + 2px);
	height:calc(2.0em + 2px);
	width:1px;
	background:#000;
	}
	UL#globalmenu>LI.parent.active>A,
	UL#globalmenu>LI.parent.active>A:hover{
	background:transparent
	}
	.children A,
	.children A:visited{
	color:#000;
	display:inline-block;
	}
	.children A:hover{
	opacity:0.7;
	}

	#globalmenu>LI:hover>DIV.children{
	visibility:visible;
	opacity:1.0;
	display:flex !important;
	}


	/*------ コンテンツ名表示 ------*/
	DIV.children H2{
	padding:1.0em 1.0em 0 1.0em;
	font-size:150.0%;	/* 24px */
	width:30%;
	text-align:center;
	display:inline-block;
	}
	DIV.children H2 IMG{
	margin:0.5em auto;
	display:block;
	width:90%;
	max-width:320px;
	}


	/*------ 子メニュー ------*/
	UL.child{
	padding:1.0em 0;
	display:block;
	width:70%;
	border:1px solid #000;
	}
	UL.child>LI{
	margin:0;
	}
	UL.child>LI>A{
	padding:1.0em;
	}
	UL.child>LI:not(:has(.mago)){
	display:block;
	}

	/*------------------------------------------------
	  PC第三階層
	------------------------------------------------*/
	UL.mago{
	margin-left:1.0em;
	}
	UL.mago>LI>A{
	padding:0.5em;
	}


	@media only screen and (max-height:450px) {	/* 高さの狭いPC用 */
		BODY:has(.parent.open){
		overflow:hidden;
		}
		UL#globalmenu:has(.parent.open){
		/* margin-right:15px !important;	 スクロールバー幅 */
		}
		UL#globalmenu>LI.parent>A:hover::after,
		UL#globalmenu>LI.parent.open>A::after{
		display:none;
		}

		DIV.children{
		height : -webkit-calc(100vh - 70px);
		height : calc(100vh - 70px);
		overflow-y: scroll;	/* 展開時に縦スクロール */
		}
	}




}

@media only screen and (min-width:769px) and (max-width:1200px) {	/* 幅の狭いPC用 */
	#globalmenu.open DIV.children{
	visibility:visible;
	opacity:1.0;
	display:flex !important;
	}
	#globalmenu.open>LI.parent.active>DIV.children{
	background:#FFF;
	}

}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	UL#globalmenu.open{
	top:51px;
	}
	UL#globalmenu>LI{
	position:relative;
	}
	UL#globalmenu>LI>A{
	position:relative;
	z-index:3;
	}
	UL#globalmenu>LI.parent>A{
	position:static;
	}
	/*------------------------------------------------------------------------
	サブメニュー無し <A>タグの内側
	<I class="fa-solid fa-angle-right"></I></A></LI>
	
	サブメニュー有り <A>タグの外側
	</A><I class="fa-solid fa-plus"></I><I class="fa-solid fa-minus"></I></LI>
	-------------------------------------------------------------------------*/
	/*------ 「>」「+/-」共通 ------*/
	UL#globalmenu>LI .fa-angle-right,
	UL#globalmenu>LI .fa-plus,
	UL#globalmenu>LI .fa-minus{
	position:absolute;
	top:0.4em;
	right:0;
	display:inline-block;
	line-height:2.7em;
	width:2.0em;
	z-index:20;
	transition: opacity 0.5s ease;
	-webkit-transition: opacity 0.5s ease;
	-moz-transition: opacity 0.5s ease;
	-o-transition: opacity 0.5s ease;
	cursor:pointer;
	font-size:87.5%;
	}
	UL#globalmenu>LI.parent>.fa-solid.fa-plus,	/* サブメニュー展開前「+」 */
	UL#globalmenu>LI.parent.open-children>.fa-solid.fa-minus{	/* サブメニュー展開時「-」 */
	opacity:1.0;	/* 表示 */
	z-index:2;		/* ひとつ上層 */
	}
	UL#globalmenu>LI.parent.open-children>.fa-solid.fa-plus,	/* サブメニュー展開時「+」 */
	UL#globalmenu>LI.parent>.fa-solid.fa-minus{	/* サブメニュー展開前「-」 */
	opacity:0;		/* 非表示 */
	z-index:1;		/* ひとつ下層 */
	}
	UL#globalmenu>LI.parent>.fa-plus:hover,
	UL#globalmenu>LI.parent.open-children>.fa-minus:hover{
	opacity:0.5;
	}
	
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */

	UL#globalmenu.open{
	height : -webkit-calc(100vh - 50px);
	height : calc(100vh - 50px);
	}
}



/*------------------------------------------------
  コンテンツメニュー共通
------------------------------------------------*/
.contentmenu{
padding:3.0em 0;
}
.contentmenu2{
padding:1.5em 0;
border-bottom-style:solid;
border-bottom-width:1px;
}
BODY[id$="hall21"] .contentmenu2{
border-bottom-color:#553;	/* Olive++ */
}
BODY[id$="theater"] .contentmenu2{
border-bottom-color:#6F4B3E; /* 焦げ茶 */
}

[class^="contentmenu"] UL{
margin:0 auto;
display:flex;
flex-wrap:wrap;
justify-content:center;	/* 左右中央揃え（センタリング） */
row-gap:10px;
column-gap:10px;
width : -webkit-calc(100% - 30px) ;
width : calc(100% - 30px);
max-width:1150px;
}
[class^="contentmenu"] LI{
margin:0;
display:flex;
}
[class^="contentmenu"] UL>LI>A{
padding:0.5em 0.2em;
border:1px solid #FFF;
width:100%;
display: flex;
justify-content: center; /* 水平方向の中央揃え */
align-items: center;     /* 垂直方向の中央揃え */
flex-direction: column;
}

BODY[id$="hall21"] .contentmenu2 UL>LI>A{
color:#553;	/* Olive++ */
border-color:#553;	/* Olive++ */
background:#FFF;
}
BODY[id$="theater"] .contentmenu2 UL>LI>A{
color:#6F4B3E; /* 焦げ茶 */
border-color:#6F4B3E; /* 焦げ茶 */
background:#FFF;
}


/*------------------------------------------------
  コンテンツメニュー（ページ上部・下部共通）
------------------------------------------------*/
[id^="content_"]>.contentmenu{
padding:15px 0;
}
[id^="content_"]>.contentmenu A:hover{
background:rgba(255,255,255,0.2);
}
[id^="content_"]>.contentmenu LI.active A:hover,
[id^="content_"]>.contentmenu LI.active A{
background:#FFF;
color:#000;
}
[id^="content_"]>.contentmenu.darkolivebg LI.active A:hover,
[id^="content_"]>.contentmenu.darkolivebg LI.active A{
color:#553;
}
[id^="content_"]>.contentmenu.terracottabg LI.active A:hover,
[id^="content_"]>.contentmenu.terracottabg LI.active A{
color:#6F4B3E;
}


/*------------------------------------------------
  コンテンツメニュー（ページ上部）
------------------------------------------------*/
#content_header>.contentmenu:not([class*="bg"] ){
background-color:#2B2B2B; /* 黒（デフォルト） */
}

@media only screen and (min-width:1201px) {	/* 幅の広いPC用 */
	#content_header>.contentmenu .longname{
	font-size:87.5%;	/* 14px */
	}
}
/*------------------------------------------------
  コンテンツメニュー（ページ下部）
------------------------------------------------*/
#return.content{	/* INDEXに戻る */
padding:3.0em 0;
border-top:1px solid #000;
}
.archives #return.content{	/* アーカイブからINDEXに戻る */
margin-top:2.5em;
}

#content_footer{
margin-bottom:-3.0em;
padding:6.0em 0;
background-color:#2B2B2B; /* 黒（デフォルト） */
}
#content_footer H3{
padding:0 15px;
}

#content_footer .contentmenu{
padding:0;
}

@media only screen and (min-width:1201px) {	/* 幅の広いPC用 */
	[id^="content_"]>.contentmenu{
	padding:3.0em 0;
	}
	[id^="content_"]>[class^="contentmenu"] LI{
	flex: 1;
	}
}


@media only screen and (min-width:769px) and (max-width:1200px) {	/* 幅の狭いPC～スマホ横用 */
	[id^="content_"]>[class^="contentmenu"] UL>LI{
	width: calc( ( 100% - 20px ) / 3 );
	}
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#content_footer{
	padding:10.0vw 0;
	}
}

@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	[id^="content_"]>[class^="contentmenu"] UL>LI{
	width: calc( ( 100% - 10px ) / 2 );
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */

	[id^="content_"]>[class^="contentmenu"] UL>LI{
	width: -webkit-calc( ( 100% - 1.0vw ) / 2 );
	width: calc( ( 100% - 1.0vw ) / 2 );
	}
	[id^="content_"]>[class^="contentmenu"] UL>LI.longname,
	#content_footer>[class^="contentmenu"] UL>LI{
	width: 100%;
	}

	[class^="contentmenu"] UL{
	row-gap:1.0vw;
	column-gap:1.0vw;
	}
	[class^="contentmenu"] UL>LI>A{
	padding:0.75em 0.3em;
	}
	#content_header>[class^="contentmenu"] UL>LI>A{
	font-size:min(4.0vw,100.0%);	/* 16px */
	}

}


/*------------------------------------------------
  ページ送り（お知らせ・イベントアーカイブ）
------------------------------------------------*/
MAIN>NAV{
margin:auto;
width : -webkit-calc(100% - 50px);
width : calc(100% - 50px);
}
.pager UL{
padding:0 12px;
border-collapse: separate;
border-spacing:3px 10px;
}
.pager LI{
display:table-cell;
}
.pager LI:not(:has(A)){
padding:1.0em 0.5em;
opacity:0.5;	/* リンクが無い場合は淡色表示 */
}

.pager A{	/* 最新（index.html）へ */
padding:1.0em;
background:#000;
color:#FFF;
border:1px solid #000;
display:block;
}


.pager A:has( [class^="fa"]){
background:#FFF;
color:#000;
}
.pager A:hover{
}
.pager .next A,
.pager .prev A{
padding:1.0em 0.5em;
}
.pager LI:not(:has(A)){
background:#DCDCDC;
border:1px solid #999;
}

.pager .next [class^="fa"]{	/* 次へ */
margin-left:0.2em;
margin-right:-0.4em;
}
.pager .prev [class^="fa"]{	/* 前へ */
margin-right:0.2em;
margin-left:-0.4em;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.pager .link_large{	/* 最新（index.html）へ */
	width:auto;
	}
	.pager [class^="fa"]{
	display:none;
	}
}



/*--------------------------------------------------------------------
  パンくず・アンカー
--------------------------------------------------------------------*/
#pkl{
padding:0.5em 0;
font-size:87.5%;	/* 14px */
font-family: "Roboto","Noto sans JP", sans-serif;
background:#000;
color:#CCC;
}
#pkl A,
#pkl A:visited{
padding:0.25em;
display:block;
color:#FFF;
border-bottom:1px solid transparent;
}
#pkl A:hover{
border-bottom-color:inherit;
}

#pkl>UL{
margin:auto;
display:block;
width : -webkit-calc(100% - 20px) ;
width : calc(100% - 20px);
max-width:1150px;
text-align:left;
}
#pkl>UL LI{
display:inline-block;
}


/*------------------------------------------------
  アンカー 
------------------------------------------------*/
#pt{
margin:0;
z-index:100;
position: fixed;
bottom:5px;
right:5px;
width: 40px;
height: 40px;
}
#pt A{
margin:0 auto;
display: block;
width: 40px;
height: 40px;
background:rgba(0,0,0,0.5) url(img/pt.png) 0 0 no-repeat;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
zoom: 1;
}
#pt A:hover{
}
#pt A SPAN{
display:none;
}


/*--------------------------------------------------------------------
  フッター
--------------------------------------------------------------------*/
FOOTER{
margin:0 auto;
padding:0;
}

FOOTER *{
}
FOOTER A:not(.link_large):hover{
opacity:0.7;
}


/*------------------------------------------------
  footer 情報欄
-------------------------------------------------*/
#footer_information{
margin:0 auto;
padding-bottom:3.0em;
width : -webkit-calc(100% - 50px) ;
width : calc(100% - 50px);
max-width:950px;
z-index:2;
position:relative;
text-align:left;
}
/*------ H2名称 ------*/
#footer_information H2{
margin-top:3.0em;
width:10em;
font-size:100.0%;	/* 16px */
}
#footer_information H2 A:hover{
opacity:0.70;
}


/*------------------------------------------------
  footer 住所欄
-------------------------------------------------*/
#footer_information UL.footer_address{
margin-top:0.5em;
width : -webkit-calc(100% - 13em);
width : calc(100% - 13em);
font-size:87.5%;	/* 14px */
}

/*------ フッター 連絡先欄（TEL） ------*/
.footer_address{
}
.footer_address>LI{
margin:0.25em auto;
display:inline-block;
}
.footer_zip{	/* 〒 */
margin-right:0.5em;
}
.footer_address>LI.footer_zip_address{
display:block;
}
.footer_telfax>SPAN.footer_tel~SPAN.footer_tel{	/* チケットセンターTEL */
margin-top:0.25em;
display:block;
}


.footer_tel A{
color:#000;
}

.footer_address>[class^="footer_timetable"]{
padding-left:6.5em;
text-indent:-6.5em;
display:block;
}
.footer_address>LI.footer_timetable01{
margin-top:1.0em;
margin-bottom:0.5em;
}
[class^="footer_timetable"] .label{
padding:0;
width:6.5em;
}
.footer_contact .link_large{
margin-top:0.5em;
display:block;
font-size:114.3%;	/* 16px */
}

/*------------------------------------------------
  フッターメニュー
------------------------------------------------*/
#footer_menu{
margin:auto;
padding:1.5em 0;
display:block;
text-align: center;
width : -webkit-calc(100% - 30px) ;
width : calc(100% - 30px);
border-bottom:1px solid #000;
}
BODY#home #footer_menu{
border-top:1px solid #000;
}
#footer_menu>LI{
margin:5px 0;
display:inline-block;
vertical-align:middle;
font-size:87.5%;	/* 14px */
}

#footer_menu>LI>A{
padding:0.3em 1.0em;
display:block;
line-height:1.2;
}

#footer_menu>LI:nth-child(1)>A{
margin-left:0;
}
#footer_menu .sns_link{
margin-top:0;
margin-bottom:0;
font-size:114.3%;	/* 16px */
}
#footer_menu .sns_link LI{
margin:0;
}

@media only screen and (min-width:769px) {	/* PC用 */
	#footer_information{
	padding-bottom:5.0em;
	}
	#footer_information H2{
	margin-top:5.0em;
	}
	#footer_information UL.footer_address{
	margin-top:5.4em;
	}
	.footer_contact .link_large{
	padding:0.5em;
	}
	#footer_menu .sns_link{
	margin-left:3.0em;
	}

}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#footer_menu>LI:has(.sns_link){
	margin-top:2.0em;
	display:block;
	}
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#footer_information *+H2{
	padding-top:2.0em;
	border-top:1px solid #000;
	}

	.footer_zip{	/* 〒 */
	display:block;
	margin-right:0;
	}
	.footer_zip_address{
	padding-right:0;
	}
	.footer_address>LI{
	display:block;
	}
	.footer_telfax SPAN{
	padding:0.25em 0;
	display:block;
	}
	.footer_telfax SPAN.footer_slash{
	display:none;
	}
	.footer_address>.footer_contact{
	margin-top:1.5em;
	}

}

@media only screen and (max-width:320px) {	/* スマホS縦用 */
	.footer_address>[class^="footer_timetable"]{
	padding-left:0;
	text-indent:0;
	}
	.footer_address>LI.footer_timetable01{
	margin-bottom:0.5em;
	padding-top:1.0em;
	border-top:1px solid #CCC;
	}

	[class^="footer_timetable"] .label{
	display:table;
	width:auto;
	}

}

/*------------------------------------------------
  フッター管理者バナー+著作権
------------------------------------------------*/
#footer_banner_copyright{
margin:auto;
padding:1.5em 60px;
width:100%;
position:relative;
z-index:1;
}


/*------ お客様の声・HybridConventionTM トップページのみ------*/
#footer_clbanner{
margin:auto;
padding-top:2.0em;
padding-bottom:2.0em;
display:table;
}
#footer_clbanner>LI{
margin:0.5em;
display:inline-block;
vertical-align:middle;
width:298px;
height:76px;
background:#FFF;
}
A#banner_voice{
padding:0 5px 0 65px;
background:rgba(90,84,75,0.1) URL(img/banner_voice.png) no-repeat 10px center;	/* #5A544B 海松茶*/
font-size:75.0%;	/* 12px */
display:table;
color:#000;
width:100%;
height:100%;
min-height:70px;
}
A#banner_voice SPAN{
display:table-cell;
vertical-align:middle;
text-align:left;;
}

#footer_clbanner>LI IMG{
display:block;
}




/*------------------------------------------------
  著作権
------------------------------------------------*/
#copyright{
font-size:68.75%;	/* 11px */
vertical-align:middle;
}
BODY#home #copyright{
margin-top:;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#footer_banner_copyright{
	padding:1.0em 0;
	}
	#footer_clbanner>LI{
	height:auto;
	width:90%;
	max-width:298px;
	}
	#copyright{
	padding:0 50px 0 15px;
	text-align:left;
	}

}

/*-----------------------------------------------
  flexbox レイアウトをレスポンシブで可変
------------------------------------------------*/
BODY .flexbox{
display : -webkit-box;     /* old Android */
display : -webkit-flex;    /* Safari etc. */
display : -ms-flexbox;     /* IE10        */
display : flex;
-webkit-flex-wrap: wrap;          /* Safari etc. */
-ms-flex-wrap    : wrap;          /* IE10        */
flex-wrap        : wrap;
align-items: stretch;	/* 子要素の高さを揃える */
justify-content:center;	/* 左右中央揃え（センタリング） */
}
.flexbox.space-between{
justify-content: space-between;
}
.flexbox.space-around{
justify-content: space-around;
}
.flexbox.start{
justify-content:flex-start;	/* 左揃え（初期値） */
}
.flexbox.end{
justify-content:flex-end;	/* 右揃え */
}
.flexbox.startalign{
align-items: flex-start;	/* 子要素の高さを揃えず上に付ける */
}
.flexbox.center{
align-items: center;	/* 子要素の高さを揃えず天地中央に置く */
}




/*--------------------------------------------------------------------
  clearfix
--------------------------------------------------------------------*/
/*------ 親要素にまとめて回り込み解除 ------*/
#hogehoge::after{
    content: ""; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}


/* Win版IE7とMac版IE5対策 */
#hogehoge{
	display: inline-table;
	min-height:1%;  /* for IE 7*/
}


/* Win版IE5および6対策 */
/* Hides from IE-mac \*/
* html #hogehoge{
	height: 1%;
}
#hogehoge{
	display: block;
}
/* End hide from IE-mac */



/*------ 個別に回り込み解除（clearfix） ------*/
.clearfix::after {
    content: ""; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {
	display: inline-table;
}

/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */