@charset "utf-8";

	
	
/*--------------------------------------------------------------------
全体の設定
--------------------------------------------------------------------*/

*{ margin: 0;padding: 0; box-sizing:border-box;}

ul, ol { list-style : none}
img { vertical-align : middle}



/*--------------------------------------------------------------------
common
cssの初期化
--------------------------------------------------------------------*/
html, body {
	color: #333;
	font-size: 14px;
	line-height:170%;
	margin: 0;
	padding: 0;
}
h1, address, div, blockquote, p, pre, ul, dl, dt, dd, hr {
	color: #333;
	font-weight: normal;
	margin: 0;
	padding: 0;
	border: 0;
}
ol, li{
	margin: 0;
	padding: 0;
	list-style-type: none;
	border: 0;
}
span, em, strong, dfn, code, samp, kbd, var, cite, abbr, acronym, sub,
sup, q, br, ins, del, a, img, object, iframe {
	margin: 0;
	padding: 0;
	border: 0;
}


/* clear
--------------------------------------------------------------------*/
#clear{
	width:0px;
	height:0px;
	clear: both;
}
.clearfix:after{
	display:block;
	clear:both;
	height:0px;
	line-height:0px;
	visibility:hidden;
	content:".";
}
.clearfix{
	zoom:100%;/* IE6 */
}


/* link
--------------------------------------------------------------------*/
a:link{color: #039;}
a:visited{color:#039;}
a:hover{opacity:0.8;}

a:hover img{filter: alpha(opacity=85);  -moz-opacity:0.85;  opacity:0.85;}
a:hover img.no-opacity{filter: alpha(opacity=100);  -moz-opacity:1;  opacity:1;}



html{ font-size : 14px} /*レスポンシブタイプセッティングの指定*/

body{
	background-color:#FFF; 
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	min-width:1000px; border-top:3px solid #2DA023;
	}

	
/* header
--------------------------------------------------------------------*/
#header{
	 position:relative; width:1000px; margin:auto;
	 height: 110px;z-index:2;
}
#header h1.logo{ position:absolute; top:-3px;}
#header h1.logo a:hover,#header h1.logo a:hover img{filter: alpha(opacity=100);  -moz-opacity:1;  opacity:1;}

#header .snavi{ background-color:#2DA023; padding:0; width:450px; float:right;border-bottom-left-radius:5px;border-bottom-right-radius:5px;}
#header .snavi ul li a{ padding:2px 5px; width:25%; text-align:center; float:left; border-right:1px solid #CCC; color:#FFF; font-size:12px; text-decoration:none;}
#header .snavi ul li:last-child a{border:none;}
#header .snavi ul li a:hover{ background-color:#57B34F;}


/* menu
----------------------------------------------- */
#menu{*zoom: 1;list-style-type: none; position:absolute; top:0px; right:0px;}
#menu:after{clear: both;}

ul#menu {
	max-width:880px;float:right; margin-top:40px; 
	}
ul#menu li{
	display: block;position:relative;
	float: left; 
	margin: 0;
	padding: 0;
}
ul#menu li a {
	display: block;
	padding: 20px 0px 10px 0px;
	color: #000; font-size:15px;
	text-align: center; width:100px; margin-left:30px;
	text-decoration: none;  font-weight:bold;
	font-family:"游明朝", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	background-image:url(../images/common/gnavi_bg.png); background-repeat:no-repeat; background-position:center bottom;
}
ul#menu li.gnavi01 a,ul#menu li.gnavi02 a { width:80px;}
ul#menu li.gnavi03 a { width:140px;}
ul#menu li a:hover, ul#menu li a.current{ color:#039;}

#menu li ul li{overflow: hidden;height: 0;transition: .2s; float:none;}
#menu li:hover ul li{overflow: visible; height: 18px; padding:0;height:34px;}
#menu li:hover ul li a,#menu li:hover ul li a{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:normal; font-size:13px; border:none;
	position:absolute; top:5px;left:-20px; width:130px; text-align:center;  padding:5px 0px;
	background-color: rgba(0,0,0,0.6); color:#FFF; background-image:none;
	}
#menu li:hover ul li a:hover{ background-color: rgba(0,51,153,0.8);}

#menu li.mb{ display:none;}


/* レイアウト
----------------------------------------------- */

.container {
	width:980px; margin:auto;
	}
#left {
	width:220px; float:left; margin-top:30px;
	}
#content{
	width:720px; float:right;
	}


/* トップコンテンツ
----------------------------------------------- */

/* イベント */
h3.event{ position: relative;}
h3.event img { position:absolute; right:0px; top:15px;}

#event ul { margin:0px 0px 20px 0px; padding:0;display: flex;flex-wrap: wrap; }
#event ul li{
 width:33.3%; border:1px solid #CCC;padding:20px 15px;vertical-align:top; position:relative;
}
#event ul li:nth-child(2),#event ul li:nth-child(3),#event ul li:nth-child(5),#event ul li:nth-child(6){ border-left:none;}
#event ul li:nth-child(4),#event ul li:nth-child(5),#event ul li:nth-child(6){ border-top:none;}
#event ul li:nth-child(4){ clear:both; display:block;}

#event ul li h3{font-size:14px;color: #690; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
#event ul li .image{ margin:auto;width:180px;height:180px; text-align:center;vertical-align:middle;position:relative;}
#event ul li .image img{
	max-width:100%;max-height:100%;
	position: absolute;
	top: 0;right: 0;bottom: 0;left: 0;margin: auto;}
#event ul li a{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    text-indent:-9999px;
}
#event ul li a:hover{
    background-color:#ccc;
    filter:alpha(opacity=80);
    -moz-opacity: 0.2;
    opacity: 0.2;
}
#event ul li .text{ margin-top:10px;}

ul.news li{ margin-bottom:10px;}


.topMain{
	margin-bottom:20px; border-top:2px solid #ddd;
}
.topMain img{
	width:50%; float:left;
}


/* title
----------------------------------------------- */
#title{ padding:70px 0px;border-top:2px solid #ddd; background:url(../images/common/004.jpg) 50% 10%; background-size:cover; margin-bottom:10px;
}
#title h2{
	font-size:30px; letter-spacing:5px; 
	text-align:center;
	}


/* パンクズ
----------------------------------------------- */
ol.topic-path {
margin: 0;
padding: 0; text-align:right;
}
ol.topic-path li {
padding-left: 3px;
display: inline; font-size:12px; line-height:100%;
}
ol.topic-path li.first {
padding-left: 20px;
background: url(../images/common/icon_home.png) no-repeat left;
}
ol.topic-path li a {
padding-right: 14px;
background: url(../images/common/topic-path-gray.gif) no-repeat right;
}



/* 見出し ------------------------------------------------------------------ */

h2,h3,h4,h5{
	font-family:"游明朝", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	} 
.tlBd{
    margin: 40px 0px 20px 0px;line-height:150%;
    font-size:20px; padding:5px 0px 5px 20px;
    letter-spacing: 2px; background:url(../images/common/tlBd.png) no-repeat; background-position:0px 50%; 
}
.tlBd span{
    font-weight: normal; color:#999; font-family:Arial, Helvetica, sans-serif; font-size:12px;letter-spacing:0px; padding-left:10px;
}
.tlLine{
    margin: 30px 0px 15px 0px;line-height:150%;
    font-size:18px; padding:0px 0px 5px 0px; color: #039;
    letter-spacing: 2px; border-bottom:1px solid #ccc;
}
.tlIcon{
    margin: 20px 0px 10px 0px;
    font-size:16px; padding:0;
	font-family:"游明朝", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
.tlIcon:before {
	color: #039;
    font-family: FontAwesome;
	content: "\f044";
	margin-right:5px; font-weight:normal; font-size:120%;
}
ul.icon li {
    list-style: none;
    margin: 3px 0px;
    position: relative;
    padding: 0px 0px 0px 23px;
	}
ul.icon li:before {
    font-family: FontAwesome;
	position: absolute;
    top: 0;left: 3px;
	}
ul.icon.arrow li:before {
	content: "\f138";color: #2DA023; 
	}
ul.icon.check li:before {
	content: "\f00c";color: #C90; 
	}
ul.icon.circle li:before {
	content: "\f192";color: #039; 
	}
ul.icon.navi li {
	padding: 0px 0px 0px 15px;
	}
ul.icon.navi li:before {
	content: "\f105";color: #999; 
	}
ol.riyou{
	padding:0 0 0 20px;
	margin:0;
}
ol.riyou li{
	padding-left:10px;
	list-style-type:decimal;
}
ul.disc li{margin-left:10px; list-style-type:disc;}

ul.eve li {
	background-image: url(../images/common/arrow.png); background-repeat:no-repeat; 
	display: inline-block;
	background-position:0px 5px;
	margin: 0px 20px 10px 0px;
	padding: 0px 0px 0px 22px;
	}

/* かっこ付き半角数字 */
ol.no2{
	padding:0 0 0 2.5em;
	margin:0;
	counter-reset: li; /*olのリストの数字をリセット*/
}
ol.no2 li{
	list-style-type:none;
	list-style-position:inside;
	counter-increment: cnt2;
}
ol.no2 li:before{
	display: marker;
	content: "( " counter(cnt2) " )";
	display:inline-block;
	margin-left:-2.5em; 
	width: 2.5em; 
}



/* page ------------------------------------------------------------------ */

.box{background-color:#FFF; padding:20px; border-radius:3px; }
.bd{ border:1px solid #ccc; background-color: #FFF;}
.bgGray{ background-color:#f5f5f5;}
.bgBeige{ background-color: #EEEBD9;}
.bgGreen{ background-color: #DAF7D0;}
.bgAqua{ background-color: #eaffff;}
.bgOrange{ background-color: #ffead6;}
.bgPink{ background-color: #ffeaf4;}
.bgLavendar{ background-color: #eaf4ff;}
.bgMint{ background-color: #eaffd6;}


/* お知らせ */
#topicswn .topics_photo {
	padding: 2px;
	border: 1px solid #CCCCCC;
	margin-bottom: 5px;
}
#topicswn .topics_box {
	margin-right: 15px;
	float: left;
	width: 310px;
}

#topicswn .topics_photo {
	padding: 2px;
	border: 1px solid #CCCCCC;
	margin-bottom: 5px;
}

/* 過去の主催公演 */
#post_wn .post_photo {
	padding: 2px;
	border: 1px solid #CCCCCC;
	margin-bottom: 5px;
}
#post_wn .post_box {
	margin-right: 15px;
	float: left;
	width: 410px;
}
#post_wn .tlLine{ font-size:24px; margin-top:0; line-height:130%; }
#post_wn .tlLine span{
	padding:5px 0px 0px 0px; line-height:200%;
	font-size:14px;font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#333;display:block;
	}

/* イベント */
#eventwn ul li.detail{clear:both;margin-bottom:20px;}
#eventwn ul li.detail .image{ float:left; width:300px; text-align:left;margin-bottom:20px;}
#eventwn ul li.detail .image img{max-width:270px;margin-bottom:2px;}
#eventwn ul li.detail .text {margin-bottom:20px;}
#eventwn ul li.detail .tlLine{ font-size:24px; margin-top:0; line-height:130%;}
#eventwn ul li.detail .tlLine span{ display:block; color:#333; font-size:16px;}

.topics_shosai {margin-top: 20px;text-align: right;}
.topics_shosai p{
	color: #630;
}
.topics_shosai p.file:before {
    font-family: FontAwesome;
	content: "\f15c";
	margin-right:8px;
}
.topics_shosai p.link:before {
    font-family: FontAwesome;
	content: "\f08e";
	margin-right:8px;
}

.photo img{box-shadow: 2px 2px 2px 2px lightgray; padding:2px; background-color:#FFF; margin-bottom:10px; }




/* Table ------------------------------------------------------------------ */
.table1  { border-top:1px solid #CCC; border-left:1px solid #CCC;}
.table1 th  {
	background-color: #eee; padding:10px 18px;border-bottom:1px solid #CCC;border-right:1px solid #CCC;}
.table1 td  { padding:10px 12px;border-bottom:1px solid #CCC;border-right:1px solid #CCC; background-color:#FFF;}


/* ボタン ------------------------------------------------------------------ */
/* 影付きボタン 緑 */
a.btn3Green {
	font-size:16px;
	font-weight:bold;
	text-decoration: none;
	display:block;
	text-align:center;
	margin:0px 9px auto;
	padding:15px 10px;
	color: #FFF;
	position: relative;
	background: #76A31A;/*背景色*/
	border-bottom: solid 2px #669900;/*少し濃い目の色に*/
	border-radius: 4px;/*角の丸み*/
	box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
}

a.btn3Green:hover {
	background: #94B84D;/*背景色*/;
	border-bottom: solid 2px #76A31A;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

/* サークルボタン ------------------------------------------------------------------ */
a.btn3CircleA {
	font-size:16px;
	font-weight:bold;
	text-decoration: none;
	display:inline-block;
        width:200px;
        height:80px;
	text-align:center;
        text-valign:middle;
	margin:0px 10px 20px 0px;
	padding:15px 0px 15px 0px;
	color: #FFF;
	position: relative;
	background: #2DA023;/*背景色*/
	border-bottom: solid 2px #669900;/*少し濃い目の色に*/
	border-radius: 4px;/*角の丸み*/
	box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
}

a.btn3CircleB {
	font-size:16px;
	font-weight:bold;
	text-decoration: none;
	display:inline-block;
        width:200px;
        height:80px;
	text-align:center;
        text-valign:middle;
	margin:0px 10px 20px 0px;
	padding:15px 0px 15px 0px;
	color: #FFF;
	position: relative;
	background: #003399;/*背景色*/
	border-bottom: solid 2px #001e43;/*少し濃い目の色に*/
	border-radius: 4px;/*角の丸み*/
	box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
}

a.btn3CircleC {
	font-size:16px;
	font-weight:bold;
	text-decoration: none;
	display:inline-block;
        width:200px;
        height:80px;
	text-align:center;
        text-valign:middle;
	margin:0px 10px 20px 0px;
	padding:15px 0px 15px 0px;
	color: #FFF;
	position: relative;
	background: #5a4498;/*背景色*/
	border-bottom: solid 2px #001e43;/*少し濃い目の色に*/
	border-radius: 4px;/*角の丸み*/
	box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
}

a.btn3CircleD {
	font-size:16px;
	font-weight:bold;
	text-decoration: none;
	display:inline-block;
        width:200px;
        height:80px;
	text-align:center;
        text-valign:middle;
	margin:0px 10px 20px 0px;
	padding:15px 0px 15px 0px;
	color: #FFF;
	position: relative;
	background: #e4007f;/*背景色*/
	border-bottom: solid 2px #941f57;/*少し濃い目の色に*/
	border-radius: 4px;/*角の丸み*/
	box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
}


/* font awesome アイコン
----------------------------------------------- */
.iDownload:before	{ content:"\f019";font-family: FontAwesome; }
.iChevron:before	{ content:"\f138";font-family: FontAwesome;margin-right:5px; }


/* page-top
----------------------------------------------- */
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 20%;
}
#page-top a {
    text-decoration: none;
    background-image:url(../images/common/pagetop.png); background-repeat:no-repeat;
    width: 76px; height:76px; margin-bottom:20px;
    padding: 0px 0px 0px 0px;
    text-align: center;
    display: block;
	text-indent: -9877em;
}

/* ふれあいまつり */
.hureaishosai {line-height:1.5;}

/* footer
----------------------------------------------- */
#footer{
	 padding:40px 0px 30px; margin-top:50px; border-top:2px solid #CCC;
}
#footer a{ color: #666;
}
#footer .inner{
	width:980px; margin:auto; font-size:12px;
	}
#footer .inner a{text-decoration:none;}
#footer .inner .logo{ float: left; width:250px; line-height:150%;}
#footer .inner .logo img{ margin-bottom:15px;}
#footer .inner  ul.navi {
	float:left; margin-left:60px;
	}

#copyright { background-color:#2DA023;color:#fff;font-size:11px; text-align:center;padding:10px;}



/* Font ------------------------------------------------------------------ */
.fzSS  { font-size:  70%;}
.fzS   { font-size:  80%;}
.fzM   { font-size: 100%;}
.fzL   { font-size: 130%;}
.fzLL  { font-size: 180%;}
.fzLLL { font-size: 220%;}

.fcOrange { color: #EFB110;}
.fcRed {color: #900;}
.fcGreen { color: #060;}
.fcBrown { color: #960;}
.fcBlue { color: #039;}
.fcWhite { color: #FFF;}

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

/* Floats ------------------------------------------------------------------ */
.flL    { display: inline; float: left;}
.flR    { display: inline; float: right;}

/* Width ------------------------------------------------------------------ */
.w10    { width:10%;}
.w20    { width:20%;}
.w30    { width:30%;}
.w35    { width:35%;}
.w40    { width:40%;}
.w50    { width:50%;}
.w60    { width:60%;}
.w70    { width:70%;}
.w80    { width:80%;}
.w90    { width:90%;}

/* Margin ------------------------------------------------------------------ */
.mt00 { margin-top: 0px;}
.mt05 { margin-top: 5px;}
.mt10 { margin-top:10px;}
.mt15 { margin-top:15px ;}
.mt20 { margin-top:20px;}
.mt25 { margin-top:25px ;}
.mt30 { margin-top:30px ;}
.mt35 { margin-top:35px ;}
.mt40 { margin-top:40px ;}
.mt45 { margin-top:45px ;}
.mt50 { margin-top:50px ;}
.mr00 { margin-right: 0 ;}
.mr05 { margin-right:5px;}
.mr10 { margin-right:10px;}
.mr15 { margin-right:15px;}
.mr20 { margin-right:20px;}
.mr25 { margin-right:25px;}
.mr30 { margin-right:30px;}
.mr35 { margin-right:35px;}
.mr40 { margin-right:40px ;}
.mr45 { margin-right:45px ;}
.mr50 { margin-right:50px ;}
.mb00 { margin-bottom: 0   ;}
.mb05 { margin-bottom: 5px ;}
.mb10 { margin-bottom:10px ;}
.mb15 { margin-bottom:15px ;}
.mb20 { margin-bottom:20px ;}
.mb25 { margin-bottom:25px ;}
.mb30 { margin-bottom:30px ;}
.mb35 { margin-bottom:35px ;}
.mb40 { margin-bottom:40px ;}
.mb45 { margin-bottom:45px ;}
.mb50 { margin-bottom:50px ;}
.ml00 { margin-left: 0  ;}
.ml05 { margin-left: 5px ;}
.ml10 { margin-left:10px ;}
.ml15 { margin-left:15px ;}
.ml20 { margin-left:20px;}
.ml25 { margin-left:25px;}
.ml30 { margin-left:30px;}
.ml35 { margin-left:35px;}
.ml40 { margin-left:40px;}
.ml45 { margin-left:45px;}
.ml50 { margin-left:50px;}

.mg-auto { margin:auto;}

/* Padding ------------------------------------------------------------------ */
.pd00 { padding:0px;}
.pd05 { padding:5px;}
.pd10 { padding:10px;}
.pd15 { padding:15px;}
.pd20 { padding:20px;}
.pd30 { padding:30px;}




.pchidden { display:none;}
.sphidden { display:block;}