@charset "UTF-8";
.pcShow {
	display: block;
}

.pc_inl_Show {
	display: inline;
}

.spnShow {
	display: none;
}

.spn_inl_Show {
	display: none;
}


@media handheld, only screen and (max-width: 767px) {

	*{
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}

	.floatL {
		float: none;
	}

	.pcShow {
		display: none;
	}

	.pc_inl_Show {
		display: none;
	}

	.spnShow {
		display: block;
	}

	.spn_inl_Show {
		display: inline;
	}

/*---------- ヘッダー ----------*/
	#header {
		width: 100%;
		/*height: 70px;*/
		height: auto;
		margin: 0 auto;
		padding-top: 0px;
/*		display: box;
		display: -webkit-box;
	    display: -moz-box;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-direction: row;
		-moz-flex-direction: row;
		-ms-flex-direction: row;
		-o-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: space-between;
		-moz-justify-content: space-between;
		-ms-justify-content: space-between;
		-o-justify-content: space-between;
		justify-content: space-between;*/
	}

	#header_logo {
		width: 70%;
		max-height: 50px;
		max-width: 500px;
		height: auto;
		float: none;
		margin: 0px auto 0px;
		/*margin-top: 0px;*/
	}

	#header_logo h1 {
		text-align: center;
		max-height: 50px;
		margin: 10px auto 0px;
	}

	#header_logo h1 a img{
		width: 100%;
		height: auto;
	}

	#link {
		display: none;
	}

	#tel {
		display: none;
	}

.pageTop {
	position: fixed;
		bottom: 20px;
		right: 20px;
		z-index: 1000;
	color: #fff;
	text-align: center;
	line-height: 50px;
	cursor: pointer;
	width: 50px;
	height: 50px;
	background-color: rgba(52,69,149,0.8);
	-webkit-border-radius: 50px;/* for Safari and Chrome */
	-moz-border-radius: 50px; /* for Firefox */
	-o-border-radius: 50px; /* for opera */
	border-radius: 50px;
}
	/*-----  スマホ gnav -----*/


	.spnNavi {
		width: 100%;
		position: relative;
	}

	.spnNaviTrg {
		width: 100%;
		height: 50px;
		line-height: 50px;
		text-align: center;
		color: #fff;
		margin: 10px auto 0px;
		background-color: #344595;
		cursor: pointer;
	}

	.spn_nav_wap {
	    position: absolute;
	    top: 50px;
	    left: 0;
	    z-index: 1000;
	    width: 100%;
	    background-color: rgba(0,0,0,0.8);
	}

	.spn_nav {

	}

	.spn_nav li {

	}

	.spn_nav li a {
		display: block;
		width: 100%;
		margin: 0px auto;
		color: #fff;
		padding: 7px 0px;
		text-align: center;
		text-decoration: none;
		border-bottom: dotted 1px #ccc;
	}

	.spn_nav li a:hover {
	    background-color: rgba(0,0,0,0.3);
	}

	.spNaviClose {
		color: #fff;
		text-align: center;
		cursor: pointer;
		padding: 7px 0px;
	}



	/*---------- ボディ枠 ----------*/
	#wrapper {
		width: 100%;
		margin: 0 auto;
		/*background-color: #0000ff;*/
	}

	.body_top {
		background-image: none;
		padding-top: 0px;
	}

	.body_bg {
		background-image: none;
	}

	.body_bottom {
		background-image: none;
	}

	.orderWrap {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-direction: row;
		-moz-flex-direction: row;
		-ms-flex-direction: row;
		-o-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;	
	}

	.containerParent {
		width: 100%;
		float: none;
	}

	/*メインイメージ*/
	#home_main_image{
		width: 100%;
		height:auto;
		padding: 0px;
		margin-bottom: 10px;
	}


	/*＝＝＝ローカルナビ＝＝＝*/
	#lnaviWap {
		width: 100%;
		margin-bottom: 35px;
	}

	#lnaviWap .h4Box {
		color: #ff0303;
		font-size: 13px;
		border-bottom: 1px solid #ff0303;
		margin-bottom: 10px;
	}

	#lnaviWap .link {
		font-size: 13px;
		color: #4a4a4a;
		margin-left: 0px;
	}



/*---------- 左ブロック ----------*/
	#leftBlock {
		width: 96%;
		margin: 0px auto;
		order: 2;
	}

	#mainNav {
		display: none;
	}

	#left_bunner_top {
		width: 60%;
		max-width: 300px;
		margin: 20px auto 5px;
		text-align: center;
	}

	.left_bunner {
		width: 60%;
		max-width: 300px;
		margin: 15px auto;
		text-align: center;
	}

	/*天気予報*/
	.new_weather {
		width: 100%;
		height: auto;
		border: solid 1px #969696;
		padding: 10px;
		margin: 15px auto;
	}

	.w_place {	}

	.theDayTitle {
		text-align: center;
	}

	.visualWap {
		width: 50%;
		float: left;
	}

	.nowTime {
		font-size: 14px;
	}

	.todayIcon {
		max-width: 80px;
		margin: 0px auto;
	}

	/*今日info*/
	.todayInfo{
		width: 50%;
		font-size: 13px;
		border-left: solid 1px #566ed4;
	}

	.infLine {
		display: table;
	}

	.infT {
		display: table-cell;
		width: 30%;
		text-align: center;
		margin: 0px;
	}

	.infD {
		display: table-cell;
		width: 70%;
		padding-left: 5px;
	}

	/*天気週間*/
	.wTableWap table {
		width: 100%;
		height: auto;
		margin: 10px auto;
	}


/*---------- コンテナ ----------*/

	/*コンテナ内共通設定*/
	.container {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		width: 96%;
		margin: 0px auto;
		order: 1;
	}

	img {
		width: 100%;
		height: auto;
	}

	.container h3{
		width: 100%;
		font-size: 15px;
		height: auto;
		background-image :none;
		color: #016a61;
		border-left: solid 3px #016a61;
		border-bottom: solid 1px #979797;
		padding: 3px 0px 3px 5px;
		background: #ffffff;
		background: -moz-linear-gradient( #fdfdfd 0%, #fdfdfd 48%, #e5e4e4 51%, #ffffff 100%);
		background: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), color-stop(48%, #fdfdfd), color-stop(51%, #e5e4e4), to(#ffffff));
		background: -webkit-linear-gradient( #fdfdfd 0%, #fdfdfd 48%, #e5e4e4 51%, #ffffff 100%);
		background: -o-linear-gradient( #fdfdfd 0%, #fdfdfd 48%, #e5e4e4 51%, #ffffff 100%);
		background: linear-gradient( #fdfdfd 0%, #fdfdfd 48%, #e5e4e4 51%, #ffffff 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#fdfdfd, endColorstr=#ffffff,GradientType=1 );
	}


/*ニュース*/
	.information {
		width: 100%;
		overflow: hidden;
	}
/*
	.information::after {
		display: block;
		font-size: 12px;
		color: #025cf1;
		text-decoration: underline;
		content: '▶もっとご案内を見る';
		text-align: right;
		cursor: pointer;
	}*/

	.moreInfo {
		font-size: 12px;
		color: #025cf1;
		text-decoration: underline;
		text-align: right;
		cursor: pointer;
	}

	.information .newsLine{
		display: none;
	}

	.information .newsLine:first-child{
		display: block;
	}

	.information .newsLine:nth-child(2){
		display: block;
	}

	.information .newsLine:nth-child(3){
		display: block;
	}

	.newsLine {
		width: 100%;
		margin-left: 0px;
		margin-bottom: 5px;
		font-size: 13px;
		padding-left: 10px;
		border-bottom: 1px solid #566ed4;
	}

	.newsDate {
		color: #566ed4;
		width: 90px;
		margin-right: 16px;
	}

	.newTxt {
		color: #6a6a6a;
		width: 100%;
	}



	/*画像とテキスト*/
	.infoLine {
		width: 100%;
		margin-bottom: 15px;
	}

	.infoLine .imgBox {
		float: none;
		width: 80%;
		max-width: 300px;
		text-align: none;
		margin: 0px auto 10px;
	}

	.infoLine .imgBox img{
		width: 100%;
		height: auto;
		border: 1px solid #30458c;
	}

	.infoLine .txtBox {
		float: none;
		width: 100%;
		margin: 0px auto 10px;
	}

	.institutionLine .p_font {
		width: 100%;
		margin: 0px auto 10px;
	}

	.institutionLine .p_font p{
		width: 100%;
		margin: 0px auto;
	}


/*Topページtable*/
	.top_table {
		width: 100%;
		font-size: 13px;
		margin-top: 5px;
	}

	.top_table table {
		width: 100%;
		margin: 0px auto 10px;
		border-top: 1px solid #c6c6c6;
		border-left: 1px solid #c6c6c6;
	}


	.contents .h4Box {
		color: #ff0303;
		font-size: 13px;
		border-bottom: 1px solid #ff0303;
		margin-bottom: 10px;
	}

	/*tableの記述*/
	.contents_table {
		width: 100%;
		font-size: 13px;
		color: #4a4a4a;
		margin-bottom: 30px;
	}

	.contents_table table {
		width: 100%;
	}

	.contents_table th {
		display: block;
		width: 100%;
		font-weight: 300;
		color: #ff0303;
		vertical-align:top;
		text-align: left;
		padding: 3px 0px;
		border-bottom: 1px solid #969696;
	}

	.contents_table td {
		display: list-item;
		padding: 3px;
		border-bottom: 1px solid #969696;
		list-style: none;
	}



/*施設案内*

.in_guide {
	margin-bottom: 5px;
	font-size: 13px;
	color: #4a4a4a;
}

.in_guide  dt{
	width: 15px;
}

.in_guide  dd{
	width: 461px;
}


/*施設利用料*

.ryoukinTableWap {
	margin-bottom: 10px;
}

.tableKind {
	margin-bottom: 5px;
	margin-left: 20px;
}

.tableSammary {
	font-size: 14px;
	margin-left: 20px;
	color: #03778c;
}

.ryoukin_tableS {
	width: 280px;
	font-size: 12px;
	color: #4a4a4a;
}

.ryoukin_tableS table {
	width: 280px;
	margin-bottom: 15px;
	border-top: 1px solid #969696;
	border-left: 1px solid #969696;
}

.ryoukin_tableS th {
	font-weight: 400;
	padding: 5px;
	border-right: 1px solid #969696;
	border-bottom: 1px solid #969696;
}

.ryoukin_tableS td {
	padding: 5px;
	text-align:center;
	border-right: 1px solid #969696;
	border-bottom: 1px solid #969696;
}
*/
	.ryoukin_table {
		width: 100%;
		font-size: 12px;
		color: #4a4a4a;
		overflow: scroll;
	}

	.ryoukin_table table {
		
		width: 100%;
		margin-bottom: 15px;
		border-top: 1px solid #969696;
		border-left: 1px solid #969696;
	}

	.ryoukin_table .size_s {
		width: 15%;
	}

	.ryoukin_table th {
		font-weight: 400;
		padding: 5px 3px;
		border-right: 1px solid #969696;
		border-bottom: 1px solid #969696;
	}

	.ryoukin_table td {
		padding: 5px;
		text-align:center;
		border-right: 1px solid #969696;
		border-bottom: 1px solid #969696;
	}

	.cautionList {
		font-size: 13px;
		padding-left: 20px;
		width: 100%!important;
	}

	.cautionList li {
		margin-bottom: 3px;
		list-style-type: inherit;
		list-style: none;
	}

	.contentsList{
		font-size: 13px;
		padding-left: 20px;
		width: 100%!important;
	}

	.contentsList li{
		margin-bottom: 3px;
		list-style-type: none;
	}



/*---------- 右ブロック ----------*/
	#rightBlock {
		width: 96%;
		margin: 0px auto;
		order: 3;
		float: none;
	}

	.caption_right {
		width: 100%;
		height: auto;

		background-image : none;
		color: #ffffff;
		padding-top: 0px;
		text-align: center;
		background: #30458c;
		background: -moz-linear-gradient( #7994d1 0%, #30458c 100%);
		background: -webkit-gradient(linear, left top, left bottom, from(#7994d1), to(#30458c));
		background: -webkit-linear-gradient( #7994d1 0%, #30458c 100%);
		background: -o-linear-gradient( #7994d1 0%, #30458c 100%);
		background: linear-gradient( #7994d1 0%, #30458c 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#7994d1, endColorstr=#30458c,GradientType=1 );
	}

	.caption_right h3{
		padding: 15px 0px 10px 0px;
	}

	#rightBlock .box{
		width: 100%;
		height: auto;
	}

	#rightBlock .box table {
		width: 100%;
		padding: 5px 15px;
		margin-left: 0px;
	}

	#rightBlock #access {
		float: none;
		width: 100%;
		text-align: center;
		padding-right: 0px;
		margin: 10px auto;
	}

	.contact_bt {
		display: block;
		width: 100%;

	}

	.contact_bt .nav li a {
		color: #03788c;
		border: solid 1px #03788c;
		width: 60%;
		height: auto;
		float: none;
		margin: 0px auto 20px;
		padding: 15px 20px;
		text-align: center;
		cursor: pointer;
		display: block;
		background-image: none;
		background: #fdfdfd;
		background: -moz-linear-gradient( #fdfdfd 0%, #fdfdfd 48%, #e5e3e4 51%, #fdfdfd 100%);
		background: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), color-stop(48%, #fdfdfd), color-stop(51%, #e5e3e4), to(#fdfdfd));
		background: -webkit-linear-gradient( #fdfdfd 0%, #fdfdfd 48%, #e5e3e4 51%, #fdfdfd 100%);
		background: -o-linear-gradient( #fdfdfd 0%, #fdfdfd 48%, #e5e3e4 51%, #fdfdfd 100%);
		background: linear-gradient( #fdfdfd 0%, #fdfdfd 48%, #e5e3e4 51%, #fdfdfd 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#fdfdfd, endColorstr=#fdfdfd,GradientType=1 );
	}

	.contact_bt .nav li a:hover {
		color: #ff0302;
		border: solid 1px #ff0302;
		background-image: none;
	}


	.box p {
		text-align: center;
	}

	.map_qr {
		width: 60%;
		max-width: 73px;
		height: auto;
		padding: 0px;
		text-align: center;
		margin: 0px auto 20px;
	}




/*5施設へのアクセス*
.caption_right_2 {
	display: block;
	width: 163px;
	height: 28px;
	margin-top: 20px;
	background-image : url("../img/caption_right.jpg");
	background-repeat: no-repeat;
	color: #ffffff;
	padding-top: 6px;
	padding-left: 17px;
	margin-bottom: 5px;
}


/*マップのアコーディオン*
.access_qr .accordion {
	width: 180px;
	height: 34px;
	margin: 3px 0;
}


.access_btn a {
	display: block;
	width: 160px;
	height: 20px;
	background-image: url("../img/etc_shop.jpg");
	padding: 7px 0px 7px 20px;
	text-decoration: none;
	color: #566ed4;
	margin-bottom: 5px;
}

.access_btn a:hover {
	background-position: 0 -34px;
	color: #e64c9c;
}

.access_qr .accordion .icon {
	width: 160px;
	height: 20px;
	padding: 7px 0px;
	padding-left: 20px;
	color: #566ed4;
	cursor: pointer;
	background-image: url("../img/etc_shop.jpg");
}

.access_qr .hover .icon {
	background-position: 0 -34px;
	color: #e64c9c;
}

.access_qr .accordion .on {
	background-position: 0 -34px;
	color: #e64c9c;
}

.access_qr .accordion_in {
	width: 180px;
}

.access_qr .accordion_in li {
}

.access_qr .accordion_in a {
	color: #025cf1;
	text-decoration: none;
}

.access_qr .accordion_in a:hover {
	color: #f68cf5;
	text-decoration: none;
}

.access_qr .boc {

}


#ManageComp {
	width: 180px;
	height: 28px;
	background-color: #566ed4;
	color: #ffffff;
	margin-top: 20px;
	padding-top: 6px;
	text-align: center;
}

.boxMC {
	width: 178px;
	line-height: 120%;
	border: solid 1px #566ed4;
}

.skLogo {
	width: 165px;
	margin: 3px auto;
}

.shinkoT {
	width: 168px;
	font-size: 13px;
	color: #6e6e6e;
	margin-top: 10px;
	margin-left: 13px;
	margin-bottom: 13px;
}

.shinkoT li {
	list-style: none;
}

.shinkoS {
	width: 168px;
	font-size: 13px;
	color: #6e6e6e;
	margin-top: 5px;
	margin-left: 13px;
	margin-bottom: 10px;
	padding-top: 10px;
}

.shinkoS li {
	list-style: none;
}

.liMargin {
	margin-bottom: 5px;
}

.borderLine {
	width: 160px;
	margin-left: 9px;
	border-top: 1px solid #6e6e6e;
}
*/


/*---------- フッター ----------*/
	#footer {
		width: 100%;
		height: auto;
		margin: 10px auto;
	}

	address {
		font-size: 11px;
		font-style: normal;
		color: #4a4a4a;
		margin-left: 25px;
		float: none;
		text-align: center;
		margin: 0px auto;
	}

	#footer {
		border-top: solid 1px #566ed4;
		padding-top: 10px;
	}


	#footer .link {
		font-size: 11px;
		color: #4a4a4a;
		margin-right: 0px;
		float: none;
		text-align: center;
		margin: 0px auto;
	}

/*---------- トピックス ----------*/
	.topicsLine {
	    width: 100%;
	    margin-left: 0px;
	    margin-bottom: 0px;
	    font-size: 13px;
	    padding-left: 0px;
	    border-bottom: 1px solid #3331aa;
	}

/*---------- お問い合わせ ----------*/
	.container h4 {
		height: auto;
		width: 100%;
		background-image: none;
		margin-bottom: 0px;
		padding-top: 0px;
		padding-left: 15px;
		margin-left: 0px;
		color: #009999;
	}



	#formBody table {
		width: 100%;
		font-size: 13px;
	}

	#formBody th {
		display: block;
		padding: 10px;
		text-align: left;
		font-weight: normal;
		width: 100%;
		color: #6E6E6E;

	}

	#formBody td {
		display: list-item;
		width: 100%;
		padding: 0px 0px 10px 0px;
		color: #6E6E6E;
	}

	#formBody td input {
		width: 100%;
		border: solid 1px #f2f2f2;
		padding: 5px;
	}

	#formBody td textarea {
		width: 100%;
		border: solid 1px #f2f2f2;
		padding: 5px;
	}
/*---------- アクセス ----------*/

	.map_iframe {
		width: 100%;
		position: relative;
		padding-bottom: 56.25%;
		padding-top: 30px;
		height: 0;
		overflow: hidden;
	}
	 
	.map_iframe iframe,
	.map_iframe object,
	.map_iframe embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}


	.map_frame {
		width: 100%;
		position: relative;
		padding-bottom: 56.25%;
		padding-top: 30px;
		height: 0;
		overflow: hidden;
	}
	 
	.map_frame iframe,
	.map_frame object,
	.map_frame embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	.pBox_2 {
		width: 100%;
		padding: 0px 20px 30px;
		line-height: 1.3;
	}

    .box a {
        font-size: 12px;
        padding-right: 10px;
        float: none;
    }

	/*FBレスポンシブ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
	.facebook-wrapper {
	    max-width: 500px;
	    margin: 0 auto;
	}
	.facebook-wrapper > .fb-page {
	    width: 100%;
	}
	.facebook-wrapper > .fb-page > span,
	.facebook-wrapper iframe {
	    width: 100% !important;
	}

	/*---------- 404 ----------*/
	#error404 {
		width: 95%;
		min-height: calc(100vh - 330px);
	}

	#error404 h3 {
		font-size: 7vw;
	}

	#error404 h4 {
		font-size: 4.3vw;
	}

}