@charset "UTF-8";
 
@import url('https://use.fontawesome.com/releases/v6.1.1/css/all.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;600&family=Noto+Sans+JP:wght@400;700&family=Roboto:wght@400;700&display=swap');

/* all */
* {
margin: 0;
padding: 0;
word-break: normal;
}

BODY{
margin:0;
padding:0;
background:#FFF;
color:#333;
font-size: 100.0%;	/* 16pxベース */
line-height:1.5;
letter-spacing:1px;
text-align: center;
font-family:'Roboto', 'Noto Sans JP', sans-serif;
-webkit-text-size-adjust: 100%;	/* iPhone版Safari対策 */
}



* html body {	 /* for IE6 */ 
font-size: 100.0%;	/* 16pxベース */
}
*:first-child+html body { /* for IE7 */
font-size: 100.0%;	/* 16pxベース */
}
html.android H3,
html.android H4,
html.android *{	/* Android はフォント指定OFF */
/* font-family: sans-serif !important; */ 
}
html.android .fa-brands,
.fa-brands{
font-family: "Font Awesome 5 Brands" !important;
}
html.android .fa-solid,
.fa-solid{
font-family: "Font Awesome 5 Free" !important;
}


/*------ フォントサイズ ------
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;
}

.tablet_sp,
.tablet,
.sp{
display:none;
}
.block_pc{	/* 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;
	}
}



.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;
transition: background 0.5s ease, color 0.3s ease, border-color 0.3s ease;
-webkit-transition: background 0.5s ease, color 0.3s ease, border-color 0.3s ease;
-moz-transition: background 0.5s ease, color 0.3s ease, border-color 0.3s ease;
-o-transition: background 0.5s ease, color 0.3s ease, border-color 0.3s ease;
}
.content A:not([class]){
color:#009;
text-decoration:underline;
}
.content A:not([class]):VISITED{
color:#666;
}
A:HOVER{
color:#942343;	/* Garnet */
}
.content A:not([class]):HOVER{
color:#942343;	/* Garnet */
text-decoration:none;
}


/*------ 外部リンクアイコン 疑似要素使用不可 ------*/
.fa-arrow-up-right-from-square{
margin-left:0.25em;
}
/*------
<SPAN class="fa-solid fa-arrow-up-right-from-square"></SPAN>
------*/


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


/*------------------------------------------------
H2
------------------------------------------------*/
#content_header{
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 75%;
background-image:url(img/h2bg.jpg);
background-color:#16160E;	/* メインブラック */
color:#FFF;
}

#content_header H2{
margin:0 auto;
padding:4.0em 2% 3.25em 2%;
line-height:1.3;
font-size:300%;	/* 48px */
letter-spacing:0.1em;
text-shadow: 0px 0px 2px #000;
font-family:'Times New Roman', 'Noto Serif JP', serif;
font-weight:300;
background-color:rgba(0,0,0,0.6);
}
#content_header H2.longname{
padding:3.45em 2% 2.5em 2%;
}
#content_header H2 .small,
#content_header H2 .extrasmall{
letter-spacing:0.05em;
line-height:1.2;
display:inline-block;
}
#content_header.smallheader H2{	/* イメージ背景画像エリア縮小 */
padding:2.0em 2% 1.25em 2%;
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#content_header H2{
	padding:3.0em 1% 2.25em 1%;
	font-size:8vw;
	}
	#content_header H2.longname{
	padding:2.0em 1% 1.25em 1%;
	}
	#content_header.smallheader H2{
	padding:1.5em 1% 0.9em 1%;
	}
}

	@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#content_header H2.longname>SPAN{
	margin-bottom:0.5em;
	}
}



/*------ コンテンツ毎のヘッダー画像設定 ------*/
#event #content_header{							/* イベント「大ホール」 */
background-image:url(img/h2bg_event.jpg);
}
#outline #content_header{						/* 施設概要「やぐら広場」 */
background-image:url(img/h2bg_outline.jpg);
}
#access #content_header{						/* アクセスsmall「外観北側（デフォ）」 */
}

#organizer #content_header{						/* 主催者「会議室」 */
background-image:url(img/h2bg_organizer.jpg);
background-position:center 50%;
}
#contact #content_header{						/* お問い合わせsmall「外観北側（デフォ）上部」 */
background-position:center 30%;
}
#information #content_header{					/* お知らせsmall「やぐら広場」下部  */
background-image:url(img/h2bg_outline.jpg);
background-position:center 100%;
}


#guide #content_header{						/* 指定管理者、ポリシー等small「西側」 */
background-image:url(img/h2bg_guide.jpg);
}



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

}


/*------------------------------------------------
   H3
------------------------------------------------*/
H3{
font-size:187.5%;	/* 30px */
font-family:'Times New Roman', 'Noto Serif JP', serif;
font-weight:300;
line-height:1.3;
}

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



/*------------------------------------------------
   H4
------------------------------------------------*/
/*------ H4基本設定 ------*/
H4{
margin-bottom:1.0em;
font-size:137.5%;	/* 22px */
font-family:'Times New Roman', 'Noto Serif JP', serif;
font-weight:normal;
line-height:1.3;
}
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{
font-family:'Times New Roman', 'Noto Serif JP', serif;
font-weight:400;
line-height:1.3;
background:url(img/spacer.gif) no-repeat;
}
ARTICLE H5{
font-size:125.0%;	/* 20px */
}

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

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

/*------------------------------------------------
   H6
------------------------------------------------*/
/*------ H6基本設定 ------*/
ARTICLE H6{
margin:1.5em auto 0 auto;
font-weight:normal;
font-size:112.5%;	/* 18px */
line-height:1.3;
background:url(img/spacer.gif) no-repeat;
}

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



/*--------------------------------------------------------------------
  インデント
--------------------------------------------------------------------*/
.indent2em{
margin-left:2em;
display:block;
line-height:1.5;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.indent2em{
	margin-left:0;
	line-height:1.3;
	}

}

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

/*------ 1枚 ------*/
.photo IMG{
display:block;
}
/*------ 複数 ------*/
.photos IMG{
display:inline-block !important;
vertical-align:middle;
}
.photos IMG:nth-child(n+2){	/* 2個目以降 */
margin-left:10px;
}


@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	.photos BR{
	display:none;
	}
	.photos IMG:nth-child(n+2){	/* 2個目以降 */
	margin-left:10px !important;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.photos IMG:nth-child(n+2){	/* 2個目以降 */
	margin-left:auto;
	display:block;
	}
}


/*------------------------------------------------
  キャプション付き
------------------------------------------------*/
.caption{
text-align:center;
}
.caption IMG{
padding:0 0 0.5em 0;
display:block;
vertical-align:bottom;
overflow:hidden;
line-height:0;
}
.caption .label{
font-size:87.5%;	/* 14px */
background:#666;
color:#FFF;
}

/*------------------------------------------------
  注釈付き（例：こちらはイメージです。）
------------------------------------------------*/
.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);	/* メインブラック 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;
	}
}


/*--------------------------------------------------------------------
  フォントサイズ・色
---------------------------------------------------------------------*/
.font_m{
font-family: "Georgia", 'Noto Serif JP', "メイリオ", Meiryo, sans-serif;
}

/*------------------------------------------------
   文字サイズ
------------------------------------------------*/
.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;
}

SUP,SUB{
font-size:62.5%;	/* 10px */
}

/*------------------------------------------------
   強調下線
------------------------------------------------*/
.borderbottom{
padding:0.1em;
border-bottom-width:1px;
border-bottom-style:solid;
}
.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;
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.line::before,
	.line::after{
	width:10px;
	}
}

/*------------------------------------------------
   文字色
------------------------------------------------*/
.red{
color:#E60011;	/* ロゴ色 */
}
.blue{
color:#39C;
}
.green{
color:#2B743F; /* ロゴ緑 */
}
.orange{
color:#F4700C; /* ロゴオレンジ */
}
.white{
color:#FFF;
}


/*--------------------------------------------------------------------
  リストスタイル
---------------------------------------------------------------------*/
UL{
padding:0;
list-style:none;
}
LI{
background:url(img/spacer.gif) no-repeat;	/* Android4.0対策 */
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}

ARTICLE UL{
margin:1.2em 0;
}
ARTICLE UL>LI{
line-height:1.3;
text-align: left;
text-justify: none;
}
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.3em auto 0.3em 2.0em;
list-style-type: disc;
}


/*------------------------------------------------
  横並びリスト
------------------------------------------------*/
UL.inline{
display:block;
letter-spacing:-1em;	/* 横並びの隙間対策 */
text-align: left;
text-justify: none;
}
.ios UL.inline{
letter-spacing:0;
}

UL.inline.table{
display:table;
}
UL.inline>LI{
padding-right:1.25em;
display:inline-block;
*display: inline;		/* IE7対策 */
*zoom: 1;  				/* IE7対策 */
vertical-align:middle;
letter-spacing:1px;	/* 横並びの隙間対策 letter-spacing 復活 */

}




/*------------------------------------------------
  番号付きリスト
------------------------------------------------*/
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;
padding-left:2.2em;
text-indent: -2.1em;
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;
content: "(" counter(cnt) ") ";
}
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;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
LI>DL{	/* ネストする時は上余白を少な目に */
margin-top:0.6em;
}
DT,
DD{
margin:0;
padding:0;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
DT+DT,
DD+DT{	/* 2番目以降のタイトル行だけ上余白を設ける */
margin-top:1.5em;
}

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




/*------------------------------------------------
  注釈 ※ リスト　・ 例） リスト 共通
------------------------------------------------*/
UL.kome>LI,
LI.kome{
margin:0.3em auto 0.3em 0;
padding-left:1.4em !important;
text-indent:-1.4em !important;
}
LI UL.ex,
LI UL.kome{
margin-left:-0.65em;
}
UL.ex>LI>SPAN:first-child,
LI.ex>SPAN:first-child,
UL.kome>LI>SPAN:first-child,
LI.kome>SPAN:first-child{
margin-right:0.32em;
display:inline-block;
text-indent:0;
}
UL.kome>LI>SPAN:first-child,
LI.kome>SPAN:first-child{
color:#C00;
}

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


/*------------------------------------------------
  例） リスト
------------------------------------------------*/
UL.ex>LI,
LI.ex{
margin:0.3em auto 0.3em 0;
padding-left:2.4em !important;
text-indent:-2.4em !important;
}



/*------------------------------------------------
  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;
}
UL.list>LI.pdf,
UL.list>LI.word,
UL.list>LI.excel{
margin:0;
list-style-type: none;
}

.pdf A,
.word A,
.excel A{
vertical-align:top;	/* IE7対策 */
}

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

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

/*------ 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;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}

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:1px solid #CCC;
}
TABLE.data_table THEAD TH{
background:#EEE9E6;	/* Beige Cameo */
}
TABLE.data_table TBODY TH{
background:rgba(238,233,230,0.25);	/* Beige Cameo 25% */
}


@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	TABLE.data_table{
	width:100%;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	TABLE.data_table{
	width:100%;
	}
}

TABLE.data_table CAPTION{
text-align:right;
}
.data_table TH{
padding:0.3em;
border:1px solid #CCC;
text-align:center;
font-weight:normal;
}
.data_table TD{
padding:0.6em 0.3em;
border:1px solid #CCC;
}



/*------------------------------------------------
  スマホ表示時にセルをスライドさせるタイプの表
------------------------------------------------*/
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.float_table{
	border-top:none;
	border-right:none;
	}
	.float_table TH,
	.float_table TD{
	padding-right:3%;
	padding-left:3%;
	float:left;
	width:94% !important;
	}
	.float_table TH{
	line-height:1.2;
	border-top:1px solid #E6BFAB;	/* AshRose */
	border-right:1px solid #E6BFAB;	/* AshRose */
	border-bottom:none;
	border-left:none;
	background:#FFE4E1;	/* MistyRose */
	}
	.float_table TD{
	border-top:none;
	border-right:1px solid #E6BFAB;	/* AshRose */
	border-bottom:none;
	border-left:none;
	background:#FFF;
	}
	.data_table.float_table TR:nth-child(odd){	/* 奇数行に着色 */
	background:none;
	}
}


/*------------------------------------------------
  スマホ表示時にセルをスライドさせるタイプの表(WIDE)
------------------------------------------------*/

.float_table_wide SPAN.t_label{
display:none;
}


@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.data_table.float_table_wide{
	border-top:none;
	border-right:none;
	border-left:none;
	}

	.float_table_wide THEAD{
	display:none;
	}
	.float_table_wide TBODY TD{
	padding:0 10px 10px 10px;
	display:block;
	border-top:none;
	border-bottom:none;
	}
	.float_table_wide TH SPAN.t_label{
	margin-right:1em;
	display:inline-block;
	font-size:87.5%;
	}
	.float_table_wide TD SPAN.t_label{
	margin:0 -10px 10px -10px;
	padding:5px 10px;
	display:block;
	border-top:1px solid #999;
	background:#DCDCDC;
	}
	.float_table_wide TD~TD SPAN.t_label{
	border-top:none;
	}
}


/*------------------------------------------------
  横長の表にスクロールバー設置
------------------------------------------------*/
/*------ scrollmessage表示の親要素（基点） ------*/
.scroll_table_box{
position:relative;
z-index:1;
}
/*------ 横スクロールさせる表の親要素 ------*/
.scroll_table{
overflow-x:auto;
position:relative;
}


/*-----------------------------------------------
  スワイプメッセージ
------------------------------------------------*/
/*------ ボックス全体 ------*/
.scrollmessage {
position:absolute;
top:0;
left:0;
line-height:1.2;
text-align:center;
width:100%;
z-index:2;
}
/*------ 表示する中身 ------*/
.scrollmessage div.swipe {
padding:1em 0;
background:rgba(0,0,0,0.6);
color:#FFF;
height: auto;
a overflow-y: hidden;
z-index:3;
cursor: pointer;
text-align:center;
}

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



/*------------------------------------------------
  テーブルレイアウト
------------------------------------------------*/
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;
	}
}




/*--------------------------------------------------------------------
  「トップページ」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  トップページ スライド欄
------------------------------------------------*/
#slide_box{
position: relative;
/* min-width: 980px; */
background:#000;
}

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

.slide LI{
margin:0 auto;
padding:0;
text-align:center !important;
width:100% !important;
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{
margin:0 auto;
width: 100%;
height:auto;
position:relative;
z-index:1;
vertical-align:top;
display:block;
}



/* 初期値は中・中 */
.slide LI H2{
position:absolute;
font-family: 'Times New Roman','Noto Serif JP', serif;
font-weight:400;
font-size:3.5vw;
letter-spacing:0.1em;
/* word-break: normal; */
white-space:nowrap;
transform:translate(-50%,-50%);
left:50%;
top:50%;
z-index:2;
}

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

位置指定の組み合わせ
左上 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-weight:300;
font-size:80.0%;
display:inline-block;
}
.slide LI H2 SPAN.extrasmall{
font-weight:300;
font-size:60.0%;
display:inline-block;
}
.slide LI H2>SPAN.extrasmall,
.slide LI H2 A>SPAN.extrasmall{
display:block;
}

/*------ 2枚目MitoriO ------*/
.slide LI#slide02 H2{
font-size:3.0vw;
}
#slide02 .small{
margin-top:0.5em;
}
#slide02 H2 IMG{
margin:0.5em;
display:inline-block;
vertical-align:middle;
}

.slide LI#slide02 H2.centerbottom{
bottom:3%;
}
.slide LI#slide02 H2.centertop{
top:5%;
}

/*------ 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) {	/* スマホ横以下用 */
	#slide_box{
	min-width:0;
	min-width:auto;
	}
	.slide LI#slide02 H2,
	.slide LI H2{
	font-size:5vw;
	}
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	#slide_box,
	UL.slide,
	.slide LI{
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#slide_box,
	UL.slide,
	.slide LI{
	}
	.slide LI H2{
	padding:0.5em;
	transform:translate(0,0) !important;
	background:rgba(0,0,0,0.3);
	left:0 !important;
	right:0 !important;
	bottom:0 !important;
	top:auto !important;
	}
	.slide LI#slide02 H2{
	top:0 !important;
	bottom:auto !important;
	}
	.slide LI#slide02 H2>IMG{
	width:40%;
	}

}


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

/*------ 各パーツ ------*/
.top_pr>*{
margin-right:auto;
margin-left:auto;
text-align: center;
}
.top_pr>H3,
.top_pr>ARTICLE,
.top_pr>P{
width : -webkit-calc(100% - 25px) ;
width : calc(100% - 25px);
max-width:1150px;
}


.top_pr H3{
font-size:100.0%;	/* 16px */
}
.top_pr H3 .eng{
display:block;
font-size:225.0%;	/* 36px */
}

.top_pr .link_large{
font-size:100%;	/* 16px */
}

.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:768px) {	/* スマホ横以下用 */
	.top_pr{
	padding:50px 0;
	}
	.top_pr>H3,
	.top_pr>P,
	.top_pr .item{
	width:90% !important;
	max-width:auto;
	max-width:initial;
	}
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
}

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



/*-----------------------------------------------
  トップページお知らせ欄 ワイドタイプ
------------------------------------------------*/
#news{
background:rgba(238,233,230,0.75);	/* Beige Cameo 75% */
}
#news>H3,
#news>ARTICLE,
#news>P{
width : -webkit-calc(100% - 25px) ;
width : calc(100% - 25px);
max-width:1150px;
box-sizing: border-box;
-webkit-box-sizing: boder-box;
-moz-box-sizing: border-box;
}

#news H3{
margin:0 auto;
color:#000;
}
#news ARTICLE{
margin:1.5em auto 0 auto;
padding:0.5em 1.0em;
text-align:left;
line-height:1.3;
border-bottom:1px solid #CCC;
font-family:'Noto Serif JP', serif;
}
#news H3+ARTICLE{
border-top:1px solid #CCC;
}

#news ARTICLE+ARTICLE{
margin-top:0;
}
#news .date{
padding:0.3em 0 0.3em 3.0em;
display:block;
text-align:left;
font-size:93.75%;	/* 15px */
position:relative;
float:left;
width:8.0em;
}
#news .new{
padding:0.1em 0.5em;
display:inline-block;
font-size:66.7%;	/* 10px */
line-height:1.2;
white-space:nowrap;
background:#942343;	/* Garnet */
color:#FFF;
position:absolute;
left:0;
top:0.85em;
}
#news .contents{
margin:0;
padding:0.3em 0 0.2em 0;
}
#news ARTICLE>:not(.date){	/* H4以外にPなどで文章を載せる時 */
float:right;
text-align:left;
width : -webkit-calc(100% - 10.85em);
width : calc(100% - 10.85em);
}
#news ARTICLE>H4:not(.date){
font-size:100.0%;	/* 16px */
font-weight:400;
}

#news H4+*{
margin:0.3em auto 0 auto;
}
#news H4+*~*{
margin-top:1em;
}
#news>P{
margin:1.8em auto 0 auto;
text-align:center;
}
#news ARTICLE P A{
text-decoration:underline;
}
#news ARTICLE A.link_large:hover,
#news ARTICLE A.link_small:hover{
text-decoration:none;
}

A.linkunderline{
text-decoration:underline;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#news ARTICLE>.date,
	#news ARTICLE>:not(.date){
	width:auto;
	float:none;
	}
	#news ARTICLE>H4:not(.date){
	width:auto;
	}
	#news .date{
	padding:0.3em 0;
	display:table;
	}
	#news .new{
	margin-left:1.0em;
	left:100%;
	}
}

/*-----------------------------------------------
  #site_information
  トップページお知らせ欄内 緊急or重大告知エリア
  
  #site_information2
  トップページイベント欄下のパンフレットダウンロード
------------------------------------------------*/
[id^="site_information"]{
margin:5.0em auto -5.0em auto;
padding:3.0em 0;
text-align:center;
}
[id^="site_information"] .banner{
min-width:600px;
}
[id^="site_information"] .banner>LI{
margin:1.5em auto;
}

[id^="site_information"] .banner>LI>A{
padding:1.5em 0;
}

[id^="site_information"] .banner>LI>A.whitebg:hover{
background:#942343;	/* Garnet */
color:#FFF;
}
[id^="site_information"] .banner>LI>A>SPAN{
margin:0 auto;
padding:0.5em 0.2em;
display:table;
font-size:125.0%;	/* 20px */
font-weight:600;
line-height:1.2;
}
[id^="site_information"] .banner>LI>A>SPAN.pdf{
padding-left:50px;
background:url(img/pdf_mono.png) no-repeat 0 0.3em;
}

/*------ 水戸市民会館について ------*/
LI#banner_guide{
background-image:url(img/h2bg.jpg);
}
LI#banner_guide>A{
color:#FFF;
background-color:rgba(0,0,0,0.3);
}
LI#banner_guide>A:hover{
background-color:rgba(0,0,0,0.1);
}

#site_information .banner>LI#banner_guide>A>SPAN{
padding:2.5em 0.2em;
display:block;
}

/*------ 水戸市民会館パンフレットダウンロード ------*/
#site_information2.photobg{
position:relative;
background-image:url(img/bg01.jpg);
}
#site_information2 UL{
position:relative;
z-index:3;
}

#site_information2>DIV{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,10,0.6);
z-index:2;
}



/*------ 矢印 → を設置するとき ------*/
#site_information .banner .arrow{
margin:0.25em 0 0 0.5em;
position:static;
display:inline-block;
border-color:#FFF;
border-width:2px;
vertical-align:top;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	[id^="site_information"]{
	margin:5.0em auto -3.2em auto;
	}

	[id^="site_information"] .banner{
	min-width:auto;
	min-width:initial;
	width:90%;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	[id^="site_information"] .banner>LI>A{
	padding:0.25em 0;
	}

	[id^="site_information"] .banner>LI>A>SPAN.pdf{
	padding:0.5em 0.2em 0.5em 40px;
	text-align:left;
	}

}


/*------------------------------------------------
  トップページ イベント欄
------------------------------------------------*/
#home #event{
border-bottom:3px solid #D2B48C;	/* Tan */
}
#home #event .flexbox{
margin:3.0em auto;
padding:0 10px;
max-width:1200px;
box-sizing: border-box;
-webkit-box-sizing: boder-box;
-moz-box-sizing: border-box;
}
#home #event .flexbox ARTICLE{
margin:5px;
background:#EEE9E6;	/* Beige Cameo */
font-size:93.75%;	/* 15px */
}

.imagebox{
margin:0 -1.0em 1.0em -1.0em;
overflow:hidden;
height:300px;
position:relative;
background:#16160E;	/* メインブラック */
}
.imagebox IMG{
max-width:initial;
display:block;
position:absolute;
transition: opacity 0.5s ease;
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
}

.imagebox.noimage{	/* 画像準備中 */
background:#999;
}
.imagebox.noimage SPAN{	/* 画像準備中 NO IMAGE */
position:absolute;
transform:translate(-50%,-50%);
top:50%;
left:50%;
color:#CCC;
font-weight:bold;
font-size:125.0%;	/* 20px */
text-align:center;
display:block;
padding:4.0em 0;
}

[class^="empty"]{
position:relative;
}
[class^="empty"] .imagebox.noimage{	/* 空白イベント */
background:rgba(210,180,140,0.15);	/* Tan 15% */
}
[class^="empty"]>SPAN{	/* 空白イベント */
padding:0.5em;
text-align:center;
background:#D2B48C;	/* Tan */
position:absolute;
top:45%;
left:5%;
width:83%;
transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
-webkit-transform: rotate(-10deg);
font-weight:bold;
font-size:125.0%;	/* 20px */
opacity:0.5;
}


/*------ 横長画像 ------*/
.imagebox.y IMG{
transform:translate(-50%, -50%);
width:200%;
top:50%;
left:50%;
}
.imagebox.y.l IMG{	/* 左側を見せる（右を切る） */
left:85%;
}
.imagebox.y.r IMG{	/* 右側を見せる（左を切る） */
left:15%;
}

/*------ 縦長画像 ------*/
.imagebox.t IMG{
width:100%;
top:-10%;
left:0;
}

.imagebox.t.b IMG{	/* 下側を見せる（上を切る） */
top:auto;
bottom:0;
}



#home #event .flexbox ARTICLE H4{
margin:0.5em auto;
font-size:120.0%;	/* 18px */
}
#home #event .flexbox ARTICLE H4 .type{	/* 「こけら落とし公演」など */
margin-left:-0.2em;
margin-bottom:0.3em;
padding:0.3em 0.3em 0.2em 0.3em;
display:table;
font-size:83.3%;	/* 15px */
border-top:1px solid;
border-bottom:1px solid;
}
#home #event .flexbox ARTICLE H4 .type.small{
padding:0.5em 0.3em 0.4em 0.3em;
font-size:72.2%;	/* 13px */
}

#home #event .flexbox ARTICLE UL{
margin:0 auto;
}
#home #event .flexbox ARTICLE UL LI{
display:inline-block;
}
#home #event .flexbox ARTICLE UL LI.cast,
#home #event .flexbox ARTICLE UL LI.place,
#home #event .flexbox ARTICLE UL LI.program,
#home #event .flexbox ARTICLE UL LI.link{
display:block;
}
#home #event .flexbox ARTICLE UL LI .label,
#home #event .flexbox ARTICLE UL LI .text{
vertical-align:top;
}


#home #event .flexbox ARTICLE UL LI.cast{
margin-bottom:0.5em;
}

#home #event .flexbox ARTICLE UL LI>SPAN{
display:inline-block;
vertical-align:middle;
}
#event .label{
margin-top:0.5em;
border:1px solid #000;
font-size:87.5%;	/* 14px */
}
#event .link .label{
background:#000;
color:#FFF;
}

#event .text{
padding:0.5em 0 0 0.5em;
display:inline-block;
}


#home #event .flexbox ARTICLE .arrow{
right: 0.75em;
bottom: 0.75em;
}
#home #event .flexbox ARTICLE{/* ワイドPC用 40px=(5px+5px)*4 */
width : -webkit-calc((100% - 40px) / 4) ;
width : calc((100% - 40px) / 4);
}

@media all and (-ms-high-contrast:none){	/* IE対策 */
	#home #event .flexbox ARTICLE{
	width:22%;
	}
}


@media only screen and (min-width:769px) and (max-width:999px) {	/* 狭いPC用 */
	#home #event .flexbox ARTICLE{	/* 30px=(5px+5px)*3 */
	width : -webkit-calc((100% - 30px) / 3) ;
	width : calc((100% - 30px) / 3);
	}
	#home #event .flexbox ARTICLE.empty3,
	#home #event .flexbox ARTICLE.empty4{	/* 空白イベント */
	display:none;
	}
	
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	#home #event .flexbox ARTICLE{	/* 20px=(5px+5px)*2 */
	width : -webkit-calc((100% - 20px) / 2) ;
	width : calc((100% - 20px) / 2);
	}
	#home #event .flexbox ARTICLE.empty3{
	display:none;
	}
	#home #event .flexbox ARTICLE.empty4{	/* 空白イベント */
	}
}
@media only screen and (min-width:541px) and (max-width:768px) and (-ms-high-contrast:none){	/* IE対策 */
	#home #event .flexbox ARTICLE{
	width:49%;
	}
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#home #event .flexbox ARTICLE{
	width : 100%;
	}
	#home #event .flexbox ARTICLE[class^="empty"]{	/* 空白イベント */
	display:none;
	}
	.imagebox{
	height:auto;
	position:static;
	}
	.imagebox IMG{
	width:100% !important;
	transform:translate(0,0) !important;
	position:static;
	}
	.imagebox.noimage SPAN{
	transform:translate(0,0);
	position:static;
	}

}




/*------------------------------------------------
  フッター リンクバナー欄（トップページのみ）
------------------------------------------------*/
#footer_banner{
padding:3.0em 0;
border-top:1px solid #16160E;	/* メインブラック */
}
#footer_banner LI{
padding:1.0em 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.5;	/* Safari,Opera,Chrome */
filter:alpha(opacity=50); 	/* IE8,IE7 */
-ms-filter:"alpha(opacity=50)";	/* IE8 */
-moz-opacity: 0.5;	/* FireFox */
}
#footer_banner IMG{
margin:auto;
display:block;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#footer_banner LI{
	width:90%;
	}
}




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

/*--------------------------------------------------------------------
  「施設概要」固有の設定
---------------------------------------------------------------------*/
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#outline .content{
	text-align:left;
	}
	P .min1200{
	display:none;
	}

}
/*------------------------------------------------
  フロアマップ
------------------------------------------------*/
UL.item.part5#floormap_item{
}
UL.item.part5#floormap_item>LI{
margin-left:-8%;
width:25.9%;
text-align:center;
}
UL.item.part5#floormap_item>LI#floormap1f{
margin-left:0;
padding-top:12.0em;
}
#floormap2f{
padding-top:9.0em;
}
#floormap3f{
padding-top:6.0em;
}
#floormap3f-4f{
padding-top:3.0em;
}
#floormap4f{
padding-top:0;
}

#floormap_item A{
display:block;
border:1px solid #16160E; /* メインブラック */
color:#000;
background:rgba(238,233,230,0.8);
text-decoration:none;
}

/*------ フロアマップ背景 ------*/
#floormap_item .floormap_layer{
background-size:80% auto;
-webkit-background-size:80% auto;
-moz-background-size:80% auto;
-o-background-size:80% auto;
-ms-background-size:80% auto;
background-repeat:no-repeat;
background-position:center;
background-color:#FFF;
display:block;
width:100%;
height:280px;	/* 4ｔうｔう */
height:200px;
}
#floormap_item .floormap_layer,
#floormap_item A{
opacity:0.8;	/* Safari,Opera,Chrome */
filter:alpha(opacity=80); 	/* IE8,IE7 */
-ms-filter:"alpha(opacity=80)";	/* IE8 */
-moz-opacity: 0.8;	/* FireFox */
zoom:1;
transition: opacity 0.5s ease;
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
}
#floormap_item A:hover SPAN.floormap_layer,
#floormap_item.gallery-popup A:hover{
opacity:1.0;	/* Safari,Opera,Chrome */
z-index:1;
}

/*------ フロアマップ画像 ------*/
#floormapB1f .floormap_layer{
background-image:url(outline/img/floormapB1f.png);
}
#floormap1f .floormap_layer{
background-image:url(outline/img/floormap1f.png);
}
#floormap2f .floormap_layer{
background-image:url(outline/img/floormap2f.png);
}
#floormap3f .floormap_layer{
background-image:url(outline/img/floormap3f.png);
}
#floormap3f-4f .floormap_layer{
background-image:url(outline/img/floormap3f-4f.png);
}
#floormap4f .floormap_layer{
background-image:url(outline/img/floormap4f.png);
}



/*------ フロアマップ階数 ------*/
#floormap_item .floormap_text{
padding:1.0em;
display:block;
background:rgba(255,255,255,0.8);
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 A:hover SPAN.floormap_text{
background:rgba(255,255,255,1.0);
}

#floormap_item .arrow{
margin:0.2em auto auto 0.5em;
position:static;
display:inline-block;
vertical-align:top;
}


@media only screen and (max-width:930px) {	/* 幅の狭いPC以下用 */
	UL.item.part5#floormap_item>LI#floormap1f{
	margin-left:0;
	padding-top:0;
	}
	#floormap2f,
	#floormap3f,
	#floormap3f-4f{ 
	margin-left:0;
	padding-top:0;
	}
}
@media only screen and (min-width:541px) and (max-width:930px) {	/* 幅の狭いPC～スマホ横用 */
	UL.item.part5#floormap_item>LI{
	margin-bottom:0;
	margin-left:0.8em;
	width : -webkit-calc( ( 100% - 0.8em ) / 2 ) ;
	width : calc( ( 100% - 0.8em ) / 2 );
	}
	.ios UL.item.part5#floormap_item>LI{
	width : -webkit-calc( ( 99% - 0.8em ) / 2 ) ;
	width : calc( ( 99% - 0.8em ) / 2 );
	}

	UL.item.part5#floormap_item>LI:nth-child(odd){	/* 奇数 */
	margin-left:0;
	}
	UL.item.part5#floormap_item>LI:nth-child(n+3){	/* 3個目以降 */
	margin-top:0.8em;
	}
	#floormap_item .floormap_layer{
	height : -webkit-calc( 100vw / 2.8 ) ;
	height : calc( 100vw / 2.8 );
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	UL.item.part5#floormap_item>LI{
	margin-left:auto;
	width:auto;
	display:block;
	}
	#floormap_item .floormap_layer{
	background-size:90% auto;
	-webkit-background-size:90% auto;
	-moz-background-size:90% auto;
	-o-background-size:90% auto;
	-ms-background-size:90% auto;
	height : -webkit-calc( 100vw / 2.8 ) ;
	height : calc( 100vw / 1.5 );
	}
}




/*------------------------------------------------
  施設名
------------------------------------------------*/
#outline H3 .small.floor{
margin:0.5em auto;
font-size:46.7%;	/* 14px */
display:table;
font-family:'Roboto', 'Noto Sans JP', sans-serif;
}

/*------------------------------------------------
  詳細データ .dl_table
------------------------------------------------*/
#outline P+.dl_table{
margin-top:5.0em;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#outline H3{
	font-size:187.5%;	/* 30px */
	}
	#outline .photo+H4,
	#outline P+.dl_table{
	margin-top:1.5em;
	}
}
/*------------------------------------------------
  日常利用 .photobg
------------------------------------------------*/
#dailyuse{
background-image:url(img/h2bg.jpg);
}
#dailyuse SECTION{
padding:10em 1em 8em 1em;
}


/*--------------------------------------------------------------------
  「イベント」固有の設定
---------------------------------------------------------------------*/
/*-----------------------------------------------
  4か月のタブ切り替え
------------------------------------------------*/
/*------ タブ切り替え全体のスタイル ------*/
.tabs.content{
max-width:auto;
max-width:initial;
}

/*------ タブのスタイル ------*/
.tab_item{
padding:0.8em 0;
width: 25.0%;
border-bottom: 3px solid #D2B48C;	/* Tan */
color:#000;
display: block;
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;
}


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


/*------ 選択されているタブのコンテンツのみを表示 ------*/
#month0:checked ~ #month0_item,	/* 今月 */
#month1:checked ~ #month1_item,	/* 来月 */
#month2:checked ~ #month2_item,	/* 再来月 */
#month3:checked ~ #month3_item,	/* 再々来月 */
#month4:checked ~ #month4_item,	/* 再々来月の翌月 */
#month5:checked ~ #month5_item,	/* 再々来月の翌月 */
#month6:checked ~ #month6_item,	/* 再々来月の翌々月 */
#month7:checked ~ #month7_item,	/* 再々来月の翌々月 */
#month8:checked ~ #month8_item,	/* 再々来月の翌々月 */
#month9:checked ~ #month9_item,	/* 再々来月の翌々月 */
#month10:checked ~ #month10_item,	/* 再々来月の翌々月 */
#month11:checked ~ #month11_item{	/* 再々来月の翌々月 */
display: block;
}

/*選択されているタブのスタイルを変える ------*/
.tabs input:checked + .tab_item {
background:#D2B48C;	/* Tan */
}
.tabs input:not(:checked) + .tab_item:hover{
background:rgba(210,180,140,0.80);	/* Tan 80% */
color:#000;
}

.tabs input:not(:checked) + .tab_item {
background:#EEE9E6;	/* Beige Cameo */
color:#666;
}

/*------ タブ切り替えの中身のスタイル ------*/
.tab_content {
display: none;
clear: both;
overflow: hidden;
border-bottom:2px solid #D2B48C;	/* Tan */
}
.tab_content H3{
padding:2.0em 0;
border-bottom:2px solid #D2B48C;	/* Tan */
}

/*------------------------------------------------
  上部の見出し 狭いPC以下は非表示
------------------------------------------------*/
.event_headline{
margin:0 auto;
padding:0;
display:table;
width:100%;
border-bottom:1px solid #D2B48C;	/* Tan */
background:rgba(238,233,230,0.20);	/* Beige Cameo 20% */
}
.event_headline>LI{
padding:1.0em 0.5em;
display:table-cell;
text-align:center;
}
.event_headline>LI+LI{
border-left:1px solid #EEE9E6;	/* Beige Cameo */
}

@media only screen and (max-width:930px) {	/* 幅の狭いPC以下用 */
	.event_headline{
	display:none;
	}
}

/*------------------------------------------------
  各イベント内容 flexbox
------------------------------------------------*/
#calendar DL{
margin:0 auto;
display:table;
width:100%;
border-top:1px solid #D2B48C;	/* Tan */
border-bottom:1px solid #D2B48C;	/* Tan */
line-height:1.3;
}
#calendar DL:nth-child(even){
background:rgba(238,233,230,0.10);	/* Beige Cameo 10% */
}
#calendar DT,
#calendar DD{
margin:0;
padding:1.0em 0.5em 0.5em 0.5em;
display:inline-block;
vertical-align:top;
}
#calendar DT{
width:25%;
background:rgba(238,233,230,0.40);	/* Beige Cameo 40% */
}
#calendar DD{
width:75%;
text-align:left;
border-top:1px solid #EEE9E6;	/* Beige Cameo */
border-left:1px solid #EEE9E6;	/* Beige Cameo */
}
#calendar DD:nth-of-type(1){
border-top:none;
}

#calendar DD+DT{
border-top:1px solid #EEE9E6;	/* Beige Cameo */
}

#calendar DD LI{
vertical-align:text-bottom;
}
#calendar DD LI.block{
display:block;
}

#calendar DD .link{
margin-top:0.5em;
display:block;
}
@media only screen and (min-width:999px) {/* ワイドPC用 */
	.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:43%;
	}
	.event_headline>LI:nth-child(3),
	#calendar DD:nth-of-type(3),	/* 会場 */
	.event_headline>LI:nth-child(4),
	#calendar DD:nth-of-type(4){	/* チケット等 */
	width:12%;
	}
	.event_headline>LI:nth-child(5),
	#calendar DD:nth-of-type(5){	/* お問い合わせ先 */
	width:13%;
	}
}
@media only screen and (min-width:931px) {	/* PC以上用 */
	#calendar DL{
	border-bottom:none;
	}


	#calendar DT{
	display:none;
	}
	#calendar DD{
	display:table-cell;
	border-top:none;
	}
	#calendar DD:nth-of-type(1){
	border-left:none;
	}

	.event_headline>LI:nth-child(1),
	#calendar DD:nth-of-type(1){	/* 開催日 */
	width:15%;
	}
	.event_headline>LI:nth-child(2),
	#calendar DD:nth-of-type(2){	/* 催事名 */
	width:35%;
	}
	.event_headline>LI:nth-child(3),
	#calendar DD:nth-of-type(3),	/* 会場 */
	.event_headline>LI:nth-child(4),
	#calendar DD:nth-of-type(4){	/* チケット等 */
	width:15%;
	}
	.event_headline>LI:nth-child(5),
	#calendar DD:nth-of-type(5){	/* お問い合わせ先 */
	width:20%;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.tab_content{
	border-bottom:none;
	}
	#calendar DL{
	margin:2.0em 0 !important;
	border-top:none;
	border-bottom:1px solid #D2B48C;	/* Tan */
	}
	#calendar DL:nth-child(even){
	background:#FFF;
	}
	#calendar DT,
	#calendar DD{
	display:block;
	width:100%;
	}
	#calendar DT:nth-of-type(n+3),
	#calendar DD:nth-of-type(n+3){	/* 会場・チケット・お問い合わせ */
	border-right:1px solid #D2B48C;	/* Tan */
	border-left:1px solid #D2B48C;	/* Tan */
	}
	#calendar DT:nth-of-type(3){	/* 会場 */
	border-top:1px solid #D2B48C;	/* Tan */
	}
	#calendar DT{
	padding:0.2em 0.5em 0.1em 0.5em;
	text-align:left;
	}
	#calendar DT:nth-of-type(1),	/* 開催日 */
	#calendar DT:nth-of-type(2){	/* 催事名 */
	display:none;
	}

	#calendar DD{
	padding:0.5em 0.5em 0.4em 0.5em;
	}
	#calendar DD:nth-of-type(1),	/* 開催日 */
	#calendar DD:nth-of-type(2){	/* 催事名 */
	border-top:none;
	border-left:none;	/* Beige Cameo */
	}
	#calendar DD:nth-of-type(1){	/* 開催日 */
	display:table;
	width:auto;
	border-bottom:1px solid #000;
	}
	#calendar DD LI{
	padding-right:0;
	display:block;
	vertical-align:text-bottom;
	}

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



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

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

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

/*--------------------------------------------------------------------
  「」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  
------------------------------------------------*/

/*--------------------------------------------------------------------
  「アクセス」固有の設定
---------------------------------------------------------------------*/
#access H5 .fa-solid,
#access H6 .fa-solid,
#access DT .fa-solid{
margin-right:0.5em;
}

#access_googlemap{
vertical-align:bottom;
}

/*------------------------------------------------
  お車をご利用の方
------------------------------------------------*/
#car_layout{
margin:2.0em auto auto auto;
text-align:center;
width:100%;
}
#car_layout>LI{
padding:0 1.0%;
width:45%;
vertical-align:top;
}
#car_list{
}
#parking_list{
text-align:center;
}

/*------ 車でのルート ------*/
#car_list>UL{
margin:0 auto;
}
#car_list LI{
margin:0 auto;
text-align:center;
position:relative;
}
#car_list LI.spot{
padding:1.0em 0;
background:#595455;	/* グレー */
color:#FFF;
z-index:2;
}
#car_list LI.route{
padding:2.0em 0;
}

#car_list .road,
#car_list .time{
margin:0.5em;
display:inline-block;
vertical-align:middle;
white-space:nowrap;
width:9.0em;
background:#FFF;
position:relative;
z-index:3;
}
#car_list .route SPAN.arrow{
display:block;
border-left:3px solid #D2B48C;	/* Tan */;
border-right:none;
border-bottom: 3px solid #D2B48C;
transform: skewX(0);
transform: skewY(-40deg);
position: absolute;
left: 50%;
top: -5px;
width:5px;
height:100%;
z-index:1;
}


/*------ 高速道路3ルート ------*/
#car_list_area{
margin-bottom:-5px;
display:table;
table-layout:fixed;
width:100%;
border-collapse: separate;
border-spacing:2px 0;
}
#car_list_area>LI{
display:table-cell;
}

#car_list_area .road,
#car_list_area .time{
margin:0.5em;
display:inline-block;
vertical-align:middle;
white-space:auto;
width:auto;
background:#FFF;
position:relative;
z-index:3;
}
#car_list_area .road .small{
display:block;
}


/*------ 駐車場のご案内 ------*/
#parking_list .check{
margin:1.0em auto 0 auto;
padding:2.0em;
}
#parking_list .fa-bicycle{
margin-left:0.5em;
}
#parking_list H6 .borderbottom{
padding-bottom:0.3em;
display:block;
}
#parking_list H6~H6{
margin-top:1.5em;
}

#parking_list .check P{
margin-bottom:0;
padding:0.75em;
text-align:left;
}
#parking_list .check>H6+UL{
margin-top:1.0em;
}


@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#car_layout>LI{
	width:auto;
	}
	#parking_list{
	margin-top:5.0em;
	}
	#parking_list .check{
	margin:0.5em auto 0 auto;
	}
}
@media only screen and (max-width:320px) {	/* スマホS縦用 */
	#car_list_area{
	font-size:5vw;
	}

}

/*------------------------------------------------
  公共交通機関
------------------------------------------------*/
#traffic_layout{
margin:2.0em auto auto auto;
text-align:center;
}
#traffic_layout>LI{
padding:0 3.0%;
vertical-align:top;
}
#traffic_list01{
text-align:center;
}


#traffic_guide{
text-align:center;
}
#traffic_guide LI{
padding:1.25em;
vertical-align:top;
text-align:center;
}
#traffic_guide LI H5+H6{
margin-top:0.7em;
}
#traffic_guide LI P{
margin-top:0.3em;
margin-bottom:0;
}


@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#map P.sp{
	margin-top:0;
	}
	#map_item{	/* 地図にスクロールバー */
	overflow:auto;
	}
	#map_item IMG{
	margin-right:-65%;
 	margin-left:-55%;
	width:220%;
	display:block;
	max-width:auto;
	max-width:initial;
	}
	#parking_list .check{
	padding:1.0em;
	}
	#parking_list .check P{
	padding:0.75em 0.5em;
	}
	#traffic_layout>LI{
	padding:0;
	}

	#traffic_guide LI{
	padding:1.25em 0;
	}

}

/*--------------------------------------------------------------------
  「主催者の方へ」固有の設定
---------------------------------------------------------------------*/
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#organizer .content{
	margin-top:1.0em;
	border-top:1px solid #000;
	text-align: left;
	text-justify: none;
	}
	#organizer .content UL.table{
	margin-left:0;
	}

}


/*------------------------------------------------
 ガイドブック
------------------------------------------------*/
/*------ 第1章 ------*/
ARTICLE[id^="guidebook"]{
border-top:1px solid #000;
}


/*------ 直下の段落 ------*/
[id^="guidebook"]  H3{
margin-right:auto;
margin-left:auto;
text-align:left;
width : -webkit-calc(100% - 25px) ;
width : calc(100% - 25px);
max-width:1150px;
font-size:162.5%;	/* 26px */
}

[id^="guidebook"]>SECTION>P{
padding-left:1.25em;
}

[id^="guidebook"]  H5{
font-family:'Roboto', 'Noto Sans JP', sans-serif;
font-size:112.5%;	/* 18px */
}

/*------ リスト ------*/
.guidebook_list{
margin-left:1.0em;
}
.guidebook_list DT,
.guidebook_list DD{
display:block;
}
.guidebook_list DT{
margin:0 auto 0.5em auto;
}
.guidebook_list DD{
margin:0 auto 0.5em 1.0em;
}

.guidebook_list DD+DT,
.guidebook_list DD+DD{
margin-top:1.5em;
}

DT[class^="em"]{
display:inline-block;
vertical-align:top;
}
DT[class^="em"]+DD{
margin:0 auto 0.5em auto;
display:inline-block;
 vertical-align:top;
}
DT[class^="em"].last+DD{
padding-left:0.7em;
}



DT.em10{
width:10.0em;
}
DT.em10+DD{
margin-left:0;
width : -webkit-calc(100% - 11.0em) ;
width : calc(100% - 11.0em);
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	DT[class^="em"],
	DT[class^="em"]+DD{
	display:block;
	width:100%;
	}
	DT[class^="em"]{
	margin-bottom:0;
	}
	DT[class^="em"]+DD,
	DT[class^="em"].last+DD{
	padding-left:1.5em;
	}
}

.guidebook_list DD>*:first-child{
margin-top:0;
}
.guidebook_list UL.list>LI{
text-indent:0;
}

/*------ ブラウザ幅650px＝表幅576px以下でスクロールメッセージ表示 ------*/
@media only screen and (min-width:650px) {
	#fee TABLE.data_table,
	.guidebook_list TABLE.data_table{
	width:100%;
	}
	#organizer SECTION:not(#fee01) .scrollmessage{
	display:none;
	}
}

/*------ ブラウザ幅982px＝表幅940px以下でスクロールメッセージ表示 ------*/
@media only screen and (min-width:982px) {
	#organizer #fee01 .scrollmessage{
	display:none;
	}
}

#organizer .data_table{
margin-top:0.5em;
text-align: left;
text-justify: auto;
}
#organizer .data_table.text_aligncenter{
text-align: center;
}


#organizer .scroll_table_box .data_table{
min-width:576px;
}
#organizer #fee01 .scroll_table_box .data_table{
min-width:940px;
}

#organizer .data_table TH.text_alignleft{
text-align:left;
}

/* 2-8 関係機関への届出等 */
#guidebook02-08 TR>TD:nth-child(3){	/* TEL 改行なし */
white-space:nowrap;
}
.nowrap{
white-space:nowrap;
}


/* 別紙スケジュール表 */
#guidebook99-02,
#guidebook99-03{
letter-spacing:0;
}
#guidebook99-02 TD{
width:9.4%;
}
#guidebook99-03 TD{
width:7.5%;
}

/*------ 料金表 ------*/
.day~TD{	/* 曜日区分以降は金額なので右寄せ */
text-align:right;
white-space:nowrap;
}
#fee01-01{
font-size:98%;
}
#fee01-01 TD.tate,
#fee01-01 TH.tate,
#fee01-01 TBODY TH{
padding-right:0.5em;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
text-orientation: upright;
}
.day{
white-space:nowrap;
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#fee TABLE.data_table{
	width:auto !important;
	min-width:auto;
	min-width:initial;
	}
	#fee TABLE.data_table *{
	white-space:nowrap;
	}

}

/*------------------------------------------------
  よくあるお問い合わせ（来場者・主催者共通）
------------------------------------------------*/
.faq_list{
margin:1.5em auto auto auto;
display:table;
}
.faq_list DT,
.faq_list DD{
margin:1.0em 0;
padding-left:1.9em;
text-indent:-1.9em;
text-align:left;
}
.faq_list DD+DT{
margin-top:2.5em;
}

.faq_list DD .number{
background:#FFF;
color:#000;
font-weight:700;
}


/*--------------------------------------------------------------------
  「お問い合わせ」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  よくあるお問い合わせへのリンク振り分けバナー
------------------------------------------------*/
.banner#faq_list{
border-collapse: separate;
border-spacing:25px 1.0em;	/* 前の数字：横方向　後ろの数字 縦方向 */
}
.banner#faq_list A{
padding-top:1.5em;
padding-bottom:1.5em;
}

.banner#faq_list A .fa-solid{
margin:auto 0.25em auto -0.5em;
font-size:125.0%;	/* 20px */
vertical-align:middle;
}
@media only screen and (max-width:900px) {	/* 幅の狭いPC以下用 */
	.banner.wide#faq_list LI{
	margin:auto auto 1.0em auto;
	display:block;
	}
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.banner#faq_list A .fa-solid{
	display:block;
	margin:auto auto 0.25em auto;
	margin-right:auto;
	margin-bottom:0.25em;
	}

}


/*--------------------------------------------------------------------
  「お知らせ」固有の設定
---------------------------------------------------------------------*/
#information H3 .date{
margin-top:0.5em;
padding:0.5em 0.25em;
border-top:1px solid #000;
display:block;
text-align:right;
font-size:53.3%;	/* 16px */
font-family:'Roboto', 'Noto Sans JP', sans-serif;
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#information H3{
	font-size:125.0%;	/* 20px */
	line-height:1.1;
	}

	#information H3 .date{
	font-size:80.0%;	/* 16px */
	}
}

/*--------------------------------------------------------------------
  「水戸市民会館について」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  基本理念
------------------------------------------------*/
.motto{
margin-right:auto;
margin-left:auto;
padding:0.4em;
display:table;
font-size:150.0%;	/* 24px */
border:1px solid #D2B48C;	/* Tan */
background:rgba(210,180,140,0.15);	/* Tan 15% */
}
.motto_inner{
padding:2.0em;
display:block;
border:2px solid #D2B48C;	/* Tan */
background:#FFF;
}
@media only screen and (max-width:900px) {	/* 幅の狭いPC以下用 */
	.motto{
	padding:0.2em;
	}
	.motto_inner{
	padding:1.0em;
	}
}

@media only screen and (min-width:541px) and (max-width:900px) {	/* 幅の狭いPC～スマホ横用 */
	.motto{
	font-size:3.5vw;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.motto{
	font-size:4.8vw;
	}
}

/*------------------------------------------------
  基本方針
------------------------------------------------*/
#policy_item{
margin:3.0em auto 0 auto;
}
#policy_item>LI{
padding-top:3.0em;
}

#policy_item LI LI{
margin-top:1.0em;
padding-right:1.0em;
}

@media only screen and (max-width:900px) {	/* 幅の狭いPC以下用 */

	#policy_item>LI{
	margin-right:0;
	margin-left:0;
	padding-top:0;
	display:block;
	width:auto;
	}

}

/*------------------------------------------------
  運営目標 .photobg
------------------------------------------------*/
BODY:not(#home) ARTICLE#goal{
padding:0;
background-image:url(img/h2bg.jpg);
}
#goal SECTION{
padding:6em 1em 4em 1em;
}
#goal_item{
margin-right:auto;
margin-bottom:3.0em;
margin-left:auto;
padding:0 0.2em 1.0em 0.2em;
display:table;
font-size:175.0%;	/* 28px */
border-bottom:2px solid rgba(255,255,255,0.5);
}

@media only screen and (min-width:541px) and (max-width:900px) {	/* 幅の狭いPC～スマホ横用 */
	#goal_item{
	font-size:3.0vw;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#goal SECTION{
	padding:3em 1em 1.5em 1em;
	}

	#goal_item{
	font-size:4.5vw;
	}
}


/*------------------------------------------------
  よくあるお問い合わせ（来場者）
------------------------------------------------*/
#guide #faq H3 .borderbottom{
margin-bottom:0.5em;
}


/*------------------------------------------------
  MitoriO
------------------------------------------------*/
/*------ 構成する3施設 ------*/
#about_mitorio3_item{
text-align:center;
}
#about_mitorio3_item LI{
padding:0;
text-align:center;
}
#about_mitorio3_item LI A{
margin:0.5em 2.0em;
padding-top:4.5em;
padding-bottom:4.5em;
display:table;
line-height:1.5em;
width:10.5em;
background:rgba(238,233,230,0.75);	/* Beige Cameo 75% */
}

#about_mitorio3{
margin-top:5.0em;
height:600px;
background-image:url(img/slide/top02.jpg);
}

@media only screen and (max-width:980px) {	/* 幅の狭いPC以下用 */
	#about .content{
	text-align:left;
	}
	#about .content P>BR{
	display:none;
	}

}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#about_mitorio3{
	height:400px;
	background-size:140% auto;
	-webkit-background-size:140% auto;
	-moz-background-size:140% auto;
	-o-background-size:140% auto;
	-ms-background-size:140% auto;
	background-attachment:scroll;

	}


}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#about_mitorio3_item LI{
	margin:-0.25em 0.25em;
	}
	#about_mitorio3_item LI A{
	margin:0 auto;
	padding-top : -webkit-calc(( 38vw - 1.5em ) / 2) ;
	padding-top : calc(( 38vw - 1.5em ) / 2);
	padding-bottom : -webkit-calc(( 38vw - 1.5em ) / 2) ;
	padding-bottom : calc(( 38vw - 1.5em ) / 2);
	display:table;
	width:38vw;
	font-size:4.5vw;
	}
	#about_mitorio3_item01{
	display:block;
	}

}

/*------------------------------------------------
  
------------------------------------------------*/
/*--------------------------------------------------------------------
  「」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  
------------------------------------------------*/
/*--------------------------------------------------------------------
  「」固有の設定
---------------------------------------------------------------------*/
/*------------------------------------------------
  
------------------------------------------------*/



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





/*--------------------------------------------------------------------
  「サイトマップ」固有の設定
--------------------------------------------------------------------*/

/*--------------------------------------------------------------------
  「一時的に非表示」
--------------------------------------------------------------------*/
/*------------------------------------------------
 Access:周辺駐車場MAP
 Contact:よくある質問 H4、UL
------------------------------------------------*/
.cmtout{
display:none !important;
}
/*------------------------------------------------
 ARTICLE等　IDの末尾に_cmtout
------------------------------------------------*/
*[ID$="_cmtout"]{
display:none !important;
}

/*------------------------------------------------
 コンテンツメニュー・フッターサイトマップのID指定
-------------------------------------------------*/
[ID$="_kids-gallery"],

[ID$="_guidefaq"],
[ID$="_equipment_fee"],
[ID$="_reservation"],
[ID$="_download"],
[ID$="_faq"]{
display:none !important;
}


/*--------------------------------------------------------------------
  「コンテンツ」固有の設定
--------------------------------------------------------------------*/


/*------------------------------------------------
  バナー
  .wide はページ幅
------------------------------------------------*/
.banner.wide{
display:table;
table-layout:fixed;
width:100%;
}
.banner.wide LI{
display:table-cell;
}
.banner{
margin-right:auto;
margin-left:auto;
display:table;
}
.banner LI A{
display:block;
text-decoration:none !important;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.banner.wide,
	.banner.wide LI{
	margin:auto auto 1.0em auto;
	display:block;
	}

}



/*------------------------------------------------
  親要素の範囲にリンクエリアAを拡張
------------------------------------------------*/
.overlink{
}
.overlink>*,
.overlink{
position:relative;
transition: background 0.5s ease, color 0.5s ease;
-webkit-transition: background 0.5s ease, color 0.5s ease;
-moz-transition: background 0.5s ease, color 0.5s ease;
-o-transition: background 0.5s ease, color 0.5s ease;
}
.overlink A.more{
position:absolute;
width:100%;
height:100%;
top:0;
bottom:0;
left:0;
right:0;
display:block;
}

/*-----------------------------------------------
  疑似要素NGの時の矢印
------------------------------------------------*/
.arrow{
display:block;
width: 1.0em;
height: 0.4em;
border-bottom: 1px solid #000;
border-right: 1px solid #000;
transform: skewX(40deg);
position: absolute;
right: 0.75em;
bottom: 0.75em;
transition: border-color 0.3s;
}


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

.gallery-popup A:hover{
opacity:0.8;	/* Safari,Opera,Chrome */
filter:alpha(opacity=80); 	/* IE8,IE7 */
-ms-filter:"alpha(opacity=80)";	/* IE8 */
-moz-opacity: 0.8;	/* FireFox */
zoom:1;
}


/* 
====== 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 5 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)
------------------------------------------------*/
.effect-fade {
opacity : 0;
transition : all 1500ms;
}
.effect-move {
opacity : 0;
transform : translate(0, 30px);
transition : all 1500ms;
}

.effect-fade.effect-scroll {
opacity : 1;
}
.effect-move.effect-scroll {
opacity : 1;
transform : translate(0, 0);
}




/*-----------------------------------------------
  文字じわっと表示　じわじわ(with JavaScript)
------------------------------------------------*/
.blur{
	animation-delay:1000ms;	/* 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{
display:inline-block;
}
.block{
margin-right:auto;
margin-left:auto;
display:block;
}
.table{
margin-right:auto;
margin-left:auto;
display:table;
width:auto;
}

/*------------------------------------------------
  準備中表示
------------------------------------------------*/
.underconstruction{
margin:2em auto;
padding:200px 25px 100px 25px;
background-image:url(img/comingsoon.png);
background-position:center 80px;
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;
	}
}


.nowprinting{	/* <SPAN class="nowprinting"></SPAN> */
margin-right:auto;
margin-left:auto;
display:block;
display:table;
width:70%;
height:40vh;
min-height:160px;
background:#F0F8FF url(img/nowprinting.png) no-repeat center;	/* AliceBlue */
}
.nowprinting IMG{
padding-bottom:0;
}
.caption .nowprinting{
margin-bottom:5px;
}
.nowprinting+IMG[src*="jpg"]{
display:none !important;	/* 一時的に画像を非表示 */
}


/*------------------------------------------------
  署名
------------------------------------------------*/
.signature{
text-align:right;
font-size:112.5%;	/* 18px */
}


/*------------------------------------------------
  区切りのスラッシュ / 表示
------------------------------------------------*/
.slash::before{
margin-right:0.5em;
margin-left:0.5em;
display:inline-block;
content:"/";
}
.dot::before{
display:inline-block;
content:"・";
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.slash::before,
	.dot::before{
	display:block;
	content:"";
	}
}



/*------------------------------------------------
  アイテム横並び
------------------------------------------------*/
UL.item{
margin:1.5em auto;
padding:0;
/* display:table; */
width:auto;
text-align:center;
letter-spacing:-1em;	/* 横並びの隙間対策 */
}
.ios UL.item{
letter-spacing:0;
}

.top_pr UL.item>LI,
ARTICLE UL.item>LI,
SECTION UL.item>LI{
margin-top:0;
margin-bottom:0;
padding:0;
background:none;
display:inline-block;
*display: inline;		/* IE7対策 */
*zoom: 1;  				/* IE7対策 */
vertical-align:top;
letter-spacing:1px;	/* 横並びの隙間対策 文字間隔復活 */
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}



/*------ 2列 ------*/
UL.item.part2>LI{
margin-left:2%;
width:48.5%;
text-align:center;
}
UL.item.margin>LI{
margin-left:4%;
width:47.5%;
}

UL.item.part2>LI:nth-child(odd){	/* 奇数 */
margin-left:0;
}

UL.item.part2>LI:nth-child(n+3){	/* 3個目以降 */
margin-top:1.5em;
}
UL.item.part2.margin>LI:nth-child(n+3){	/* 3個目以降 */
margin-top:4.0em;
}

/*------ 3列 ------*/
UL.item.part3>LI{
margin-left:2%;
width:32.0%;
}
UL.item.part3>LI:nth-child(3n+1){	/* 1、4、7番目… */
margin-left:0;
}
UL.item.part3>LI:nth-child(n+4){	/* 4個目以降 */
margin-top:1.5em;
}
/*------ 4列 ------*/
UL.item.part4>LI{
margin-left:2%;
width:23.5%;
}
UL.item.part4>LI:nth-child(4n+1){	/* 1、5、9番目… */
margin-left:0;
}
UL.item.part4>LI:nth-child(n+5){	/* 5個目以降 */
margin-top:1.5em;
}
/*------ 5列 ------*/
UL.item.part5>LI{
margin-left:2%;
width:18.4%;
}
UL.item.part5>LI:nth-child(5n+1){	/* 1、6、11番目… */
margin-left:0;
}
UL.item.part5>LI:nth-child(n+6){	/* 6個目以降 */
margin-top:1.5em;
}



/*------ 2列 ------*/
UL.item.part2.tab2>LI{	/* タブレット時に2列を保つ場合 */
margin-right:1.9%;
margin-left:1.9%;
width:46%;
}





@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	UL.item:not(.tab2)>LI{
	margin:0 0 1.5em 0;
	padding:1px 0;
	width:100%;
	}
	UL.item.part2.margin>LI{
	margin:0 0 4.0em 0;
	}
	UL.item.part2.margin>LI:nth-child(n+3){	/* 3個目以降 */
	margin-top:0;
	}

	UL.item>LI IMG{
	width:auto;
	}

}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	UL.item.tab2>LI{
	margin-left:2%;
	width:49.0%;
	text-align:center;
	}
	UL.item.part3.tab2>LI:nth-child(3n+1){	/* 1、4、7番目… */
	margin-left:2%;
	}
	UL.item.part3.tab2>LI:nth-child(odd){	/* 奇数 */
	margin-left:0 !important;
	}
	UL.item.tab2>LI:nth-child(n+3){	/* 3個目以降 */
	margin-top:20px;
	}

}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	UL.item.tab2>LI{
	margin:0;
	width:100% !important;
	}
	UL.item.tab2>LI:nth-child(n+2){	/* 2個目以降 */
	margin-top:20px;
	}

	UL.item IMG{
	margin-right:auto;
	margin-left:auto;
	display:block;
	}
}	


/*------------------------------------------------
  左右振り分け 任意の幅
------------------------------------------------*/
.layoutbox{
}
.layoutbox>*:nth-child(1){
float:left;
}
.layoutbox>*:nth-child(2){
float:right;
}

/*------ 4:6 ------*/
.layoutbox .w40p{
width : -webkit-calc(40% - 25px) ;
width : calc(40% - 25px);
}
.layoutbox .w60p{
width : -webkit-calc(60% - 25px) ;
width : calc(60% - 25px);
}

/*------ 4.5:5.5 ------*/
.layoutbox .w45p{
width : -webkit-calc(45% - 25px) ;
width : calc(45% - 25px);
}
.layoutbox .w55p{
width : -webkit-calc(55% - 25px) ;
width : calc(55% - 25px);
}

/*------ 5:5 ------*/
.layoutbox .w50p{
width : -webkit-calc(50% - 25px) ;
width : calc(50% - 25px);
}





@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.layoutbox>*:nth-child(1),
	.layoutbox>*:nth-child(2){
	float:none;
	width:100%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	}
}



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



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


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


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



/*------------------------------------------------
  フロー
------------------------------------------------*/
.content .flow{
padding:0;
}
.content .flow>LI{
margin:0;
padding:0;
background:none;
vertical-align:middle;
text-align:left;
}
.content .flow>LI+LI::before{	/* ↓ 矢印 */
margin-left:0.6em;
content:"\f063";
font-family: "Font Awesome 5 Free";
font-weight : 900;
display:block;
font-size:250.0%;	/* 40px */
line-height:1;
color:#C7DC68;
}
.flow LI>DIV{
padding:0.8em;
background:rgba(199,220,104,0.3);	/* #C7DC68 若苗色 */
}
.flow .number{
margin:0 0.2em 0 0;
display:inline-block;
font-weight:bold;
font-family: 'Noto Serif JP', serif;
font-size:250.0%;	/* 40px */
vertical-align:middle;
}

.flow LI>DIV STRONG{
margin-left:0.5em;
font-size:125.0%;	/* 20px */
vertical-align:middle;
font-weight:normal;
}
.flow .textdata{
margin-left:1.2em;
padding-left:1.0em;
border-left:2px solid #FFF;
display:inline-block;
vertical-align:middle;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.flow LI>DIV{
	padding:0;
	}

	.flow .number{
	margin:0 0.2em 0 0;
	font-size:200.0%;	/* 32px */
	}
	.flow STRONG{	
	}

	.flow .textdata{
	margin:0;
	padding:0.8em;
	border-left:none;
	display:block;
	background:rgba(199,220,104,0.3);	/* #C7DC68 若苗色 */
	line-height:1.3;
	}

}



/*------------------------------------------------
  2列の表のようなDLリスト
------------------------------------------------*/
.dl_table{
margin:auto;
display:table !important;
border-bottom:2px solid #1a1a1a;
min-width:1000px;
}
.dl_table DT{
margin:1px 0 0 0;
padding:0.75em 0.5em 0.7em 0.5em;
clear:left;
float:left;
display:inline;
width:9em;	/* 10em */
text-align:center;
}

.dl_table DD{
border-top:1px solid #1a1a1a;
margin:0;
padding:0.75em 1em 0.7em 11em;
background:url(img/spacer.gif) no-repeat;	/* Android4.0対策 */
text-align:left;
}


/*------ ネスト ------*/
.dl_table .dl_table{
margin:-0.6em 0;
margin:-0.6em -1.0em -0.6em 0;
border-bottom:none;
display:block;
width : -webkit-calc(100% + 1.0em) ;
width : calc(100% + 1.0em);
min-width:auto;
min-width:initial;
}
.dl_table .dl_table DT{
padding:0.55em 0.5em 0.5em 0.5em;
}
.dl_table .dl_table DD{
padding:0.55em 1em 0.5em 11em;
}
.dl_table .dl_table DD:first-of-type{
border-top:none;
}

/*------ 項目名が長いとき ------*/
.dl_table.longname>DT{
width:15em;	/* 16em */
}
.dl_table.longname>DD{
padding-left:17em;
}





@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.longname>DT,
	.dl_table DT,
	.dl_table .dl_table DT{
	width:100%;
	float:none;
	display:block;
	text-align:left;
	border-top:1px solid #DCDCDC;
	}
	.dl_table DT{
	padding-top:1.25em;
	}
	.dl_table .dl_table DT{
	padding:0.15em 0.2em 0.1em 0.2em;
	display:table;
	width:auto;
	border-top:none;
	border-bottom:1px solid #666;
	}


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






/*------------------------------------------------
   リンクボタン（共通）
------------------------------------------------*/
.link_small,
.link_large{
color:#000;
background:transparent;
border:1px solid #000;
zoom: 1;
outline: none;
text-align:center;
display:inline-block;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
line-height:1.2;
}
.link_large.wide{
display:block;
}
.link_large.after,
.link_small.after{	/* 矢印を置く場合 */
padding-right:0.7em;
position:relative;
}

.link_large.after.arrow,
.link_small.after.arrow{	/* 矢印を置く場合 */
padding-right:2.0em;
position:relative;
}
.link_large .arrow{
bottom: 45%;
}

.link_small:hover,
.link_large:hover{
color:#FFF;
background:#595455;	/* グレー */
border-color:#595455;	/* グレー */
}
.link_large:hover .arrow{
border-color:#FFF;
}

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

/*------ ファイルサイズ添え書き ------*/
.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;
	}
	.link_large.after{	/* 矢印を置く場合 */
	padding-right:0.5em;
	}
	.link_large .arrow{
	width: 0.8em;
	height: 0.4em;
	right: 0.3em;
	bottom: 0.25em;
	}


}

/*------ PDFタイプ ------*/

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

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

/*------------------------------------------------
   リンクボタン（大）
------------------------------------------------*/
.link_large,
.link_large:visited{
margin:auto;
padding:0.6em 0.5em 0.5em 0.5em;
font-size:112.5%;	/* 18px */
}
.link_large SPAN.far,
.link_large SPAN.fas{
margin:-0.15em 0.5em 0 0;
font-size:120.0%;	/* 24px */
vertical-align:middle;
}



@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.link_large{
	display:block;
	width:90%;
	}
	.link_large.wide{
	width:100%;
	}
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	.link_large{
	max-width:400px;
	}
	.link_large.wide{
	max-width:auto;
	max-width:initial;
	}
}


/*------------------------------------------------
  斜め
------------------------------------------------*/
/*------ 右上がり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 #D2B48C;	/* Tan */
}
.color{
background:#EEE9E6;	/* Beige Cameo */
}
.check,
.color{
padding:1em 2em;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}

DIV.color,
DIV.check{
margin-top:1.8em;
margin-bottom:1.8em;
}

.color>*,
.check>*{
margin-top:0;
margin-bottom:0;
}
.color.island,
.check.island{
margin-right:auto;	/* インデントリセット */
margin-left:auto;	/* インデントリセット */
display: table;
min-width:600px;
}



/*------ 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 5 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;
	}
}


.radius{
border-radius:0.5em;
-webkit-border-radius:0.5em;
-moz-border-radius:0.5em;
}
.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) and (max-width:980px) {
	BODY{
/*	min-width: 980px; */
	}
}


MAIN{
border-bottom:3px solid #D2B48C;	/* Tan */
}

@media only screen and (min-width:769px) {	/* PC用 */
	MAIN{
	min-height:70vh;
	}
}

BODY:not(#home) ARTICLE{
padding:5.0em 0;
}




/*------------------------------------------------
  SECTION
------------------------------------------------*/
.content{
margin-right:auto;
margin-left:auto;
padding-top:0.5em;
padding-bottom:0.5em;
width : -webkit-calc(100% - 25px) ;
width : calc(100% - 25px);
max-width:1150px;
}
.content.text{
text-align: justify;
text-justify: inter-ideograph;
}
H3+.content>*: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;
}

/*------ 背景色 ------*/
.whitebg{
background-color:#FFF;
}
.graybg{
background-color:#595455;	/* グレー */
}
.blackbg{
background-color:#16160E;	/* メインブラック */
}
.blackbg60{
background-color:rgba(0,0,0,0.6);
}

@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;
	}

}

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

}

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


/*--------------------------------------------------------------------
  ヘッダー
--------------------------------------------------------------------*/
#header{
padding:10px 0;
background:#16160E;	/* メインブラック */
color:#FFF;
width:100%;
}
#header A{
color:#FFF;
}
#header A:hover{
color:#D2B48C;	/* Tan */
}

#header_inner{
margin-right:auto;
margin-left:auto;
width : -webkit-calc(100% - 25px) ;
width : calc(100% - 25px);
max-width:1200px;
display:table;
}
#header_navigation{
display:table-cell;
text-align:right;
vertical-align:middle;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#header_inner{
	width : -webkit-calc(100% - 10px) ;
	width : calc(100% - 10px);
	}
	#header_navigation{
	display:block;
	text-align:center;
	}
}



#header.fixed{	/* ヘッダー上部固定用 */
position:fixed !important;
top:0;
left:0;
z-index:1000;
filter:alpha(opacity=97); /*IE*/
-moz-opacity:0.97; /*FF*/
opacity:0.97;
-moz-box-shadow: 1px 0 10px -5px #9D896C;	/* 空五倍子色 */
-webkit-box-shadow: 1px 0 10px -5px #9D896C;	/* 空五倍子色 */
box-shadow: 1px 0 10px -5px #9D896C;	/* 空五倍子色 */
}

/*------------------------------------------------
  ヘッダーロゴ 
------------------------------------------------*/
#header H1{
margin:0;
display:table-cell;
vertical-align:middle;
}
A.logo{
margin:0;
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_s.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:160px;
height:50px;
}
#header H1 A{	/* 上記 A.logo */
}

.logo SPAN{
display:none;
}
#header H1 A:hover{
color:#FFF;
opacity:0.7;	/* Safari,Opera,Chrome */
filter:alpha(opacity=70); 	/* IE8,IE7 */
-ms-filter:"alpha(opacity=70)";	/* IE8 */
-moz-opacity: 0.7;	/* FireFox */
}

@media only screen and (min-width:999px) {/* ワイドPC用 */
	#header H1 A{
	background-image:url(img/logo.png);
	width:300px;
	}
}


@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.fixed{	/* ヘッダー上部固定用を解除（現在ヘッダー上部固定を使用中） */
	position:static;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#header H1{
	margin-top:-5px;
	margin-left:8px;
	display:block;
	width : -webkit-calc(100% - 65px) ;
	width : calc(100% - 65px);
	max-width:160px;
	}
	#header H1 A{
	width:100%;
	height:60px;
	}

}
@media only screen and (max-width:300px) {	/* スマホS縦用 */
	#header .logo .jp{
	font-size: -webkit-calc((100vw - 65px) / 8 );
	font-size: calc((100vw - 65px) / 8 );
	}
	#header .logo .eng{
	font-size: -webkit-calc((100vw - 65px) / 20 );
	font-size: calc((100vw - 65px) / 20 );
	}
}





/*--------------------------------------------------------------------
  プライマリーナビゲーションメニュー(PrimaryMenu)
--------------------------------------------------------------------*/
#primarymenu{
padding:6px 0 20px 0;
}
#primarymenu *{
line-height:1.2;
}
#primarymenu>LI{
display:inline-block;
vertical-align:middle;
}
@media only screen and (min-width:541px) and (max-width:999px) {	/* 幅の狭いPC～スマホ横用 */
	#primarymenu{
	padding:0 60px 0 0;
	}
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#primarymenu>LI{
	display:block;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#primarymenu{
	padding:20px 0 10px 0;
	}
}

/*------------------------------------------------
  ヘッダーTEL
------------------------------------------------*/
#header_tel{
}
#header_tel A{
font-size:150.0%;	/* 24px */
letter-spacing:3px;
font-family: 'Noto Serif JP', serif;
font-weight:300;
}


/*------------------------------------------------
  言語切り替え・fontchanger 共通
------------------------------------------------*/
#primarymenu>LI>UL{
margin:0;
letter-spacing:-1em;
}
#primarymenu>LI>UL{
letter-spacing:0;
}

#primarymenu>LI>UL>LI{
letter-spacing:1px;
}
#primarymenu>LI:not(#header_tel) *{
display:inline-block;
vertical-align:middle;
}



/*------------------------------------------------
  言語切り替え
------------------------------------------------*/
#header_language{
margin:auto 0 auto 50px;
font-size:87.5%;	/* 14px */
}
#header_language .icon{	/* 地球アイコン */
color:#D2B48C;	/* Tan */
}
#header_language UL LI+LI{
margin-left:0.7em;
padding-left:0.6em;
border-left:1px solid #595455;	/* グレー */
}
#header_language A{
padding:0.2em;
}
#header_language .active A,
#header_language .active A:hover{
color:#CCC;
}
#primarymenu>LI#header_language SPAN.short{	/* JP | EN */
display:none;
}

@media only screen and (min-width:769px) and (max-width:999px) {	/* 幅の狭いPC用 */
	#primarymenu>LI#header_language SPAN.full{	/* Japanese | English */
	display:none;
	}
	#primarymenu>LI#header_language SPAN.short{	/* JP | EN */
	display:block;
	}
	#header_language{
	margin:auto 20px;
	}
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	#header_language{
	margin:auto 0 auto 20px;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#header_language{
	margin:20px auto 0 auto;
	}
	#primarymenu>LI#header_language SPAN.short{
	display:none;
	}
}



/*------------------------------------------------
  Fontchanger PCのみ
------------------------------------------------*/
#fontchanger{
margin:auto 0 auto 50px;
font-size:87.5%;	/* 14px */
}

#fontchanger LI{
cursor:pointer;
text-align:center;
}
#fontchanger LI#small{
padding:2px 4px;
}
#fontchanger LI#medium{
padding:2px 4px;
}
#fontchanger LI#large{
padding:2px 2px;
}

#fontchanger LI SPAN{
background:#FFF;
border:1px solid #FFF;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
@media only screen and (min-width:769px) and (max-width:999px) {	/* 幅の狭いPC用 */
	#primarymenu>LI#fontchanger>UL{
	display:block;
	text-align:center;
	}

}


#fontchanger LI#small SPAN{
width:6px;
height:6px;
}
#fontchanger LI#medium SPAN{
width:10px;
height:10px;
}
#fontchanger LI#large SPAN{
width:15px;
height:15px;
}
#fontchanger LI:hover SPAN{
border-color:#D2B48C;	/* Tan */
background:#D2B48C;	/* Tan */
}
#fontchanger LI.active:hover SPAN,
#fontchanger LI.active SPAN{
border-color:#FFF;
background:#16160E;	/* メインブラック */
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#primarymenu>LI#fontchanger{
	display:none;
	}
}



/*------------------------------------------------
  Homeボタン
------------------------------------------------*/
DIV#sp_home{
display:none;
z-index:101;
}

@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	DIV#sp_home{
	width:60px;
	height:60px;
	position:absolute;
	top:5px;
	right:250px;
	display:block;
	}
	DIV#sp_home A{
	width:60px;
	height:60px;
	display: block;
	background:url(img/sp_nav.png) no-repeat 0 0;
	background-size:auto 60px !important;
	-webkit-background-size:auto 60px;
	-moz-background-size:auto 60px;
	-o-background-size:auto 60px;
	-ms-background-size:auto 60px;
	}

	DIV#sp_home A SPAN{
	display:none;
	}


}


@media only screen and (max-width:540px) {	/* スマホ縦用 */
	DIV#sp_home{
	width:60px;
	height:60px;
	position:absolute;
	top:5px;
	left:10px;
	display:block;
	}
	DIV#sp_home A{
	width:60px;
	height:60px;
	display: block;
	background:url(img/sp_nav.png) no-repeat 0 0;
	background-size:auto 60px !important;
	-webkit-background-size:auto 60px;
	-moz-background-size:auto 60px;
	-o-background-size:auto 60px;
	-ms-background-size:auto 60px;
	}

	DIV#sp_home A SPAN{
	display:none;
	}

}


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

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


/*------------------------------------------------
  PCメインメニュー第一階層
------------------------------------------------*/
UL#globalmenu{
margin:0 auto;
padding:0;
display:table;
letter-spacing:-1em;
line-height:1.2;
text-align:center;
}
.ios UL#globalmenu{
letter-spacing:0;
}

UL#globalmenu>LI{
margin:0;
padding:0;
display:inline-block;
letter-spacing:1px;
z-index:23;
vertical-align:middle;
}
UL#globalmenu>LI>A{
padding:0.5em 1.0em;
}
UL#globalmenu>LI#g_menu04>A{	/* 利用者の方へ（主催者の方へ） */
padding:0 0.45em;
line-height:1.1;
}
UL#globalmenu>LI#g_menu04 SPAN{
display:block;
}


UL#globalmenu>LI.active>A{
color:#D2B48C;	/* Tan */
}


@media only screen and (min-width:769px) {	/* PC以上用 */
	UL#globalmenu LI+LI{
	border-left:1px solid #595455;	/* グレー */
	}
}



/*------ 幅の狭いPC以下用 ------*/
@media only screen and (max-width:999px) {
	
	/* ------ スマホ：メインメニューアウトライン ------ */

	#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:5px;
	right:0;
	width: 60px;
	height: 60px;
	text-align: left;
	text-indent: -9999px;
	background:url(img/sp_nav.png) no-repeat -60px 0px;
	background-size:auto 60px !important;
	-webkit-background-size:auto 60px;
	-moz-background-size:auto 60px;
	-o-background-size:auto 60px;
	-ms-background-size:auto 60px;
	cursor:pointer;
	}
	#global_navi > SPAN.open{
	background:url(img/sp_nav_close.png) no-repeat 0 0;
	}

	/*------------------------------------------------
	  スマホ：メインメニュー第一階層
	------------------------------------------------*/
	UL#globalmenu{
	margin:0 auto;
	width:100%;
	display: none;
	position: absolute;
	top:70px;
	right:0;
	left:0;
	filter:alpha(opacity=97); /*IE*/
	-moz-opacity:0.97; /*FF*/
	opacity:0.97;
	background:#16160E;	/* メインブラック */
	z-index:110;	/* IE7以下でプルダウンメニューが隠れるための対策 */
	border-collapse: collapse;
	border-spacing:0 0;
	}
	UL#globalmenu.open{
	padding:0.5em 0;
	display:block;
	width:100%;
	}
	UL#globalmenu>LI>A{
	padding:0.8em 1.0em;
	}
	UL#globalmenu>LI#g_menu04>A{	/* 利用者の方へ（主催者の方へ） */
	padding:0.3em 0.8em;
	}

}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	UL#globalmenu.open{
	padding:0.5em 0 1.0em 0;
	border-top:1px solid #595455;	/* グレー */
	}
	UL#globalmenu>LI{
	margin:0.5em 0.2em 0 0.2em;
	}
	UL#globalmenu>LI#g_menu04>A{
	padding:0.85em 1.0em;
	}
	UL#globalmenu>LI#g_menu04 SPAN{
	display:inline-block;
	}

	UL#globalmenu>LI#g_menu05{
	}
	#g_menu05 A{	/* お問い合わせボタン */
	border:1px solid #CCC;
	}
	#g_menu05 A:hover{
	color:#FFF;
	background:#942343;	/* Garnet */
	}

	.parent>A::after{
	margin-left:1.0em;
	margin-right:-2.0em;
	content:"\f078";
	display:inline-block;
	font-family: "Font Awesome 5 Free";
	font-weight : 900;
	font-size:60%;
	}

}



/*------------------------------------------------
  コンテンツメニュー
------------------------------------------------*/
/*------ コンテンツメニュー ------*/
.contentmenu.inline{
margin:0 auto;
padding:0.5em 0;
text-align:center;
background-color:rgba(0,0,0,0.6);
line-height:1.2;
font-size:87.5%;	/* 14px */
}

@media only screen and (min-width:1150px) {/* ワイドPC用 */
	.contentmenu.inline{
	padding:0.5em -webkit-calc( (102% - 1200px) / 2 );
	padding:0.5em calc( (102% - 1200px) / 2 );
	}

}


.contentmenu.inline LI{
margin:0.3em;
padding:0;
border:1px solid rgba(255,255,255,0.3);
}
.contentmenu.inline LI.active{
border-color:#D2B48C;	/* Tan */

}

.contentmenu.inline LI+LI{
border-left:1px solid rgba(255,255,255,0.3);
}

.contentmenu.inline A{
padding:0.5em 1.0em;
color:#FFF;
display:block;
}
.contentmenu.inline .active A{
background:rgba(0,0,0,0.8);
color:#D2B48C;	/* Tan */
}

.contentmenu.inline A:hover{
color:#D2B48C;	/* Tan */
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.contentmenu.inline{
	font-size:100.0%;	/* 16px */
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.contentmenu.inline{
	border-top:1px solid rgba(255,255,255,0.3);
	border-bottom:1px solid rgba(255,255,255,0.3);
	}
	.contentmenu.inline LI,
	.contentmenu.inline LI+LI{
	margin:0;
	border:none;
	}
}


/*--------------------------------------------------------------------
  パンくず・アンカー
--------------------------------------------------------------------*/
#pkl{
padding:0.5em 0;
background-color:rgba(0,0,0,0.8);
font-size:87.5%;	/* 14px */
color:#FFF;
}
#pkl A,
#pkl A:visited{
padding:0.5em 0.25em;
color:#FFF;
display:block;
}
#pkl A:hover{
color:#D2B48C;	/* Tan */
}

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


/*------------------------------------------------
  アンカー 
------------------------------------------------*/
#pt{
margin:0;
z-index:100;
position: fixed;
bottom:8px;
right:12px;
width: 40px;
height: 40px;
}
#pt A{
margin:0 auto;
display: block;
width: 40px;
height: 40px;
background:url(img/pt.png) 0 0 no-repeat;
zoom: 1;
text-indent: -9999px;
outline: none;
font-size: 1px;
overflow: hidden;
}
#pt A:hover{
background:url(img/pt_hover.png) 0 0 no-repeat;
}



/*--------------------------------------------------------------------
  フッター
--------------------------------------------------------------------*/
FOOTER{
margin:0 auto;
padding:0;
background:#16160E;	/* メインブラック */
color:#FFF;
}
BODY:not(#home)>FOOTER{
border-top:1px solid #16160E;	/* メインブラック */
}


FOOTER *{
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
FOOTER,
FOOTER A,
FOOTER A:visited{
color:#FFF;
}
FOOTER A:hover{
color:#D2B48C;	/* Tan */
}


/*------------------------------------------------
  footer 情報欄
-------------------------------------------------*/
#footer_information{
padding:3.0em 0 2.8em 0;
background:#595455;	/* グレー */
}
#footer_information>*{
margin:0 auto;
width : -webkit-calc(100% - 30px) ;
width : calc(100% - 30px);
max-width:1150px;
text-align:left;
}


/*------ H5名称 ------*/
FOOTER H5{
margin:0 auto;
font-family:'Noto Sans JP', sans-serif;
}
FOOTER H5 A.logo{
margin-top:0.75em;
}
FOOTER H5 A:hover{
filter:alpha(opacity=70); /*IE*/
-moz-opacity:0.70; /*FF*/
opacity:0.70;
color:#FFF;
}
FOOTER H5 A{
}
FOOTER .logo .jp{
font-size:162.5%;	/* 26px */
}
FOOTER .logo .eng{
margin-right:-0.28em;
letter-spacing:0.28em;
font-size:75.0%;	/* 12px */
}

FOOTER H5 .preproom{	/* ★開館準備室★ */
margin:1.0em 0 -1.0em 0;
padding-bottom:0.2em;
display:table;
border-bottom:1px solid #999;
}


/*------------------------------------------------
  footer 住所欄+SNSメニュー
-------------------------------------------------*/
#footer_address_sns{
margin:1.5em auto 0 auto;
display:table;
}
#footer_address_sns>LI{
display:table-cell;
vertical-align:bottom;

}

/*------ フッター 連絡先欄（TEL） ------*/
#footer_address{
margin:0;
font-size:87.5%;	/* 14px */
}
#footer_address>LI{
margin:0.1em auto;
}
#footer_zip{	/* 〒 */
display:inline-block;
margin-right:1.0em;
}

#footer_tel,
#footer_fax,
#footer_mail{
padding-right:2.0em;
display:inline-block;
}


/*------------------------------------------------
  Footer SNSmenu
-------------------------------------------------*/
#footer_snsmenu{
margin:0.5em 0 0 0;
display:table;
text-align:left;
width:auto;

display:none;	/* URL未定につき非表示 */
}
#footer_snsmenu LI{
display:table-cell;
}
#footer_snsmenu LI A{
padding:0.3em 0.7em;
display:block;
font-size:125.0%;	/* 20px */
text-align:center;
}
@media only screen and (min-width:900px) {/* ワイドPC用 */
	#footer_snsmenu{
	margin:0 0 0 auto;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#footer_snsmenu{
	margin:1.0em auto 0 auto;
	}
}


/*------ お客様の声（トップページのみ） ------*/
#banner_voice{
margin-top:1.0em;
width:auto;
text-align:left;
display:none;			/* 開設当初は非表示 */
}
#banner_voice A{
display:inline-table;
transition: opacity 0.5s ease;
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
}


#banner_voice IMG{
display:table-cell;
vertical-align:middle;
min-width:40px;
}
@media only screen and (min-width:900px) {/* ワイドPC用 */
	#banner_voice IMG{
	padding-left:15px;
	}

}


#banner_voice SPAN{
padding-left:15px;
font-size:75.0%;	/* 12px */
display:table-cell;
vertical-align:middle;
white-space:nowrap;
color:#F5F5F5;
}
#banner_voice A:hover{
a background:#16160E;	/* メインブラック */
color:#FFF;
filter:alpha(opacity=70); /*IE*/
-moz-opacity:0.70; /*FF*/
opacity:0.70;
}


@media only screen and (max-width:900px) {	/* 幅の狭いPC以下用 */
	#footer_information>*{
	padding:0;
	}
	#footer_address_sns,
	#footer_address_sns>LI{
	display:block;
	}
	#banner_voice{
	margin-top:1.0em;
	text-align:left;
	}

}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#footer_information>*{
	text-align:center;
	}
	FOOTER H5 A.logo{
	margin-left:auto;
	margin-right:auto;
	}
	FOOTER H5 .preproom{	/* ★開館準備室★ */
	margin:1.0em auto -1.0em auto;
	}

	#footer_zip{	/* 〒 */
	display:block;
	margin-right:0;
	}
	#footer_address>LI{
	margin:0.5em auto;
	padding-right:0;
	display:block;
	}

	#banner_voice IMG,
	#banner_voice SPAN{
	margin:3px auto;
	display:block;
	text-align:center;
	}


}


/*------------------------------------------------
  Footer Sitemap
-------------------------------------------------*/
#footer_sitemap{
margin:3.0em auto 5.0em auto;
text-align:left;
display:table;
width : -webkit-calc(100% - 25px) ;
width : calc(100% - 25px);
max-width:1150px;
border-collapse: separate;
border-spacing:2px 0;	/* 前の数字：横方向　後ろの数字 縦方向 */
}
/*------ 第1階層（親） ------*/
#footer_sitemap>LI{
display:table-cell;
}
#footer_sitemap_left{
width:30%}
#footer_sitemap_center{
width:35%;
}
#footer_sitemap_center>A{
margin-left:25px;
}
#footer_sitemap>LI#footer_sitemap_center>UL{
margin-left:25px;
padding-right:50px;
}
#footer_sitemap_right{
}

#footer_sitemap>LI>A{
margin-top:1.0em;
padding:0.3em 0;
display:table;
border-collapse:collapse;
}

/*------ 第2階層（子） ------*/
#footer_sitemap>LI>UL{
margin:0.5em auto auto auto;
}
#footer_sitemap>LI>UL>LI{
padding:0.1em 0 0.1em 1.0em;
display:inline-block;
font-size:87.5%;	/* 14px */
line-height:1.2;
}
#footer_sitemap>LI>UL>LI>A{
padding:0.5em;
display:inline-block;
}

@media only screen and (max-width:900px) {	/* 幅の狭いPC以下用 */
	#footer_sitemap{
	display:block;
	width:98%;
	}

	#footer_sitemap>LI{
	margin:1.0em 0 0 0;
	display:block;
	width:auto;
	}
	#footer_sitemap>LI>A{
	margin-right:0.5em;
	padding:0.3em 0.5em;
	display:inline-block;
	}

	#footer_sitemap_center>A{
	margin-left:0;
	}
	#footer_sitemap>LI#footer_sitemap_center>UL{
	margin-left:0;
	padding-right:0;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#footer_sitemap>LI>A{
	margin:0.5em auto 0 auto;
	padding:0.5em;
	display:block;
	}
	#footer_sitemap>LI>UL{
	margin:0 auto auto auto;
	}
	#footer_sitemap>LI>UL>LI>A{
	padding:0.8em;
	}

}



/*------------------------------------------------
  フッターメニュー+著作権
------------------------------------------------*/
#footer_menu_copyright{
margin:auto;
max-width:1180px;
width:100%;
display:table;
}

/*------------------------------------------------
  フッターメニュー
------------------------------------------------*/
#footer_menu{
margin:auto;
padding:10px 0;
font-size:87.5%;	/* 14px */
display:table-cell;
text-align:left;
vertical-align:bottom;
}
#footer_menu>LI{
margin:5px 0;
display:block;
float:left;
}
#footer_menu>LI:nth-child(4){
clear:left;
}

#footer_menu>LI>A{
padding:0.3em 1.0em;
display:block;
border-left:1px solid #595455;	/* グレー */
line-height:1.2;
}

#footer_menu>LI:nth-child(1)>A,
#footer_menu>LI:nth-child(4)>A{
margin-left:0;
border-left:none;
}



/*------------------------------------------------
  著作権
------------------------------------------------*/
#copyright{
margin:0 auto;
padding:10px 60px 15px 10px;
font-size:68.75%;	/* 11px */
text-align:right;
display:table-cell;
vertical-align:bottom;
}

@media only screen and (max-width:900px) {	/* 幅の狭いPC以下用 */
	#footer_menu_copyright,
	#footer_menu,
	#copyright{
	display:block;
	text-align:left;
	width:100%;
	}
	#footer_menu_copyright{
	margin-top:-2.0em;
	}

	#footer_menu{
	padding-top:0.5em;
	border-top:1px solid #595455;	/* グレー */
	display:table;
	}
	#footer_menu>LI{
	margin:0;
	}

	#footer_menu>LI:nth-child(1)>A,
	#footer_menu>LI:nth-child(4)>A{
	margin-left:3px;
	}
	#footer_menu>LI>A{
	padding:1.0em 0.8em;
	border-left:none;
	}
	#copyright{
	padding:20px 15px;
	}

}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#footer_menu{
	padding:0;
	border-top:none;	/* グレー */	
	border-bottom:1px solid #595455;	/* グレー */
	font-size:100.0%;	/* 16px */
	}
	#footer_menu>LI{
	margin:0;
	float:none;
	}
	#footer_menu>LI>A{
	display:block;
	border-top:1px solid #595455;	/* グレー */
	border-left:none;
	}

	#copyright{
	padding:20px 80px 20px 15px;
	}

}

/*--------------------------------------------------------------------
  flexbox
--------------------------------------------------------------------*/
/* flexbox レイアウトをレスポンシブで可変 */
#calendar DL,
.index_item .flexbox,
UL.flexbox{
margin:auto;
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;	/* 子要素の高さを揃える */
}
.index_item ARTICLE{
margin:0;
padding:0 1.0em 2.0em 1.0em;
text-align:left;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
align-items: center;
}


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


/* Win版IE7とMac版IE5対策 */
DL.dl_table,
#news ARTICLE,
.layoutbox{
	display: inline-table;
min-height:1%;  /* for IE 7*/
}


/* Win版IE5および6対策 */
/* Hides from IE-mac \*/
* html DL.dl_table,
* html #news ARTICLE,
* html .layoutbox{
	height: 1%;
}
DL.dl_table,
#news ARTICLE,
.layoutbox{
	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 */