@charset "utf-8";

@media screen and (max-width: 1024px) {
/*****************************************
				Body
*****************************************/
	body {
		width: 100% !important;
		line-height: 1.71;
	}
	.sp_hide { display: none !important; }
	.pc_hide { display: block !important; }
/*****************************************
			Global Setting
*****************************************/
	#social {
		width: 99%;
		margin: 10px 0.5%;
		padding: 0;
		text-align: right;
		float: none;
	}
	.twitter { width: 76px !important; }
	.facebook { width: 126px !important; }
/*****************************************
				Container
*****************************************/
	#container {
		min-width: 100%;
		min-height: inherit;
		overflow: hidden;
		background: none; 
	}
/*****************************************
				Header
*****************************************/
	#header {
		width: 100%;
		min-width: 100%;
		margin: 0;
		position: relative;
		background: #FFF;
	}	
	#headerInner {
		width: 100%;
		padding: 0;
		height: 123px;
	}	
	#logoTitle {
		width: 140px;
		height: 68px;
		letter-spacing: normal;
		padding: 0;
		max-width: inherit;
		margin: 35px 0 0 0;
		float: left;
	}
	#companyLogo {
		display: none;
		}
	#headerContents {
		width: 96%;
		margin: 0;
		padding: 10px 2%;
		position: static;
		display: block;
	}
	#toolBox { display: none; }
	
	@media screen and (max-width: 480px) {
		#btnBack {
			width: 100%;
			text-align: center;
			padding: 0;
		}
		
	}
/*****************************************
			Wrapper
*****************************************/
	#mainTop {
		width: 100%;
		margin: 50px auto;
	}
	#mainBottom {
		max-width: inherit;
		width: 100%;
		margin: 50px auto;
		padding: 50px 0 0 0;
	}
	#mainTop h2,
	#mainBottom h2{
		font-size: 121%;
	}
	.contentsBox {
		width: 96%;
		margin: 0 auto 50px auto;
	}
	#topBtnList {
		list-style: none;
		letter-spacing: -0.4em;
		margin: 0 0 20px 0;
	}
	#topBtnList li {
		width: 23.5%;
		margin: 0 2% 15px 0;
	}
	#topBtnList li:nth-child(3n) {
		margin: 0 2% 15px 0;
	}
	#topBtnList li:nth-child(4n) {
		margin: 0 0 15px 0;
	}
	.btnWide {
		width: 100%;
		padding: 10px 0;
		text-shadow: none;
	}
	#topBtnLink {
		letter-spacing: -0.4em;
		list-style: none;
	}
	#topBtnLink li {
		width: 23.5%;
		margin: 0 2% 15px 0;
		letter-spacing: normal;
		display: inline-block;
	}
	#topBtnLink li img {
		width: 100%;
		height: auto;
	}
	#topBtnLink li:nth-child(4n) {
		margin: 0 0 17px 0;
	}
	@media screen and (max-width: 480px) {
		#topBtnList li {
			width: 32%;
			margin: 0 2% 7px 0;
		}
		#topBtnList li:nth-child(2n) {
			margin: 0 2% 7px 0;
		}
		#topBtnList li:nth-child(3n) {
			margin: 0 0 7px 0 ;
		}		
		#topBtnLink li {
			width: 48%;
			margin: 0 4% 10px 0;
		}
		#topBtnLink li:nth-child(2n) {
			margin: 0 0 10px 0;
		}
	}
/*****************************************
			Menu Box
*****************************************/
	#btn_menuBox {
		background: url(../img/header/btn_menubox.png) 0 0 no-repeat;
		background-size: 50px 50px;
		width: 50px;
		height: 50px !important;
		margin: 44px 0 0 0;
		text-indent: 100%;
		overflow: hidden;
		white-space: nowrap;
		display: block;
		float: right;
	}
	#menuBox {
		display: none;
		background: #F6F6F6;
		margin: 0 1%;
		width: 98%;
		border: solid 2px #004098;
		box-sizing: border-box;
		box-shadow: 0 2px 3px 0 rgba(0,0,0,0.6);
		position: absolute;
		top: 123px;
		left: 0;
		z-index: 10000;
	}
	#menuBox h2 {
		padding: 8px;
		background: url("../img/parts/blue_bg.png") 0 0 repeat;
		border-bottom: solid 1px #004098;
		font-weight: bold;
		color: #FFF;
		text-align: center;
		text-shadow: none;
		position: relative;
		cursor: pointer;
	}
	#menuBox h2 .btn_closeBox {
		display: block !important;
		width: 30px;
		height: 30px;
		background: url(../img/header/btn_close.png) 0 0 no-repeat;
		background-size: 30px 30px;
		text-indent: 100%;
		overflow: hidden;
		white-space: nowrap;
		position: absolute;
		top: 5px;
		right: 5px;
		cursor: pointer;
	}
	#menuBox h3 {
		padding: 8px;
		background: #8A8A8A;
		border: solid 1px #8A8A8A;
		border-bottom: none;
		color: #FFF;
		font-weight: bold;
		text-shadow: none;
	}
	#menuBox ul {
		list-style: none;
		background: #FFF;
		border: solid 1px #004098;
		margin: 10px;
	}
	#menuBox ul li {
		border-bottom: dotted 1px #004098;
	}
	#menuBox ul li:last-child {
		border-bottom: none;
	}
	#menuBox ul li a {
		display: block;
		padding: 8px 16px 8px 8px;
		background: url(../img/parts/list_point02.png) 98% 50% no-repeat;
		background-size: auto 7px;
		text-decoration: none;
		color: #000;
	}
	#gNav { display: none; }
/*****************************************
				Wrapper
*****************************************/
	#wrapper {
		width: 100%;
		min-width: inherit;
		padding: 0;
		background: none;
		background-size: 100% auto;
	}
/*****************************************
				Main
*****************************************/
	#mainContentsInner {
		padding: 15px 0 45px 0;
	}
/*****************************************
			Main Visual Slider
*****************************************/
	#mainVisual {
		min-width: auto !important;
		width: 100% !important;
	}
	#mainVisual .slide img {
		border-radius: 0 !important;
	}
	#mainVisual .bx-prev,
	#mainVisual .bx-next{
		width: 15px !important;
		height: 36px !important;
		top: 50% !important;
		z-index: 5000;
		color: #000;
		margin: -18px 0 0 0;
	}
	#mainVisual .bx-prev {
		background: url(../img/parts/slider_arw_left.png) 0 0 no-repeat !important;
		background-size: 15px auto !important;
		left: 3% !important;
	}
	#mainVisual .bx-next {
		background: url(../img/parts/slider_arw_right.png) 0 0 no-repeat !important;
		background-size: 15px auto !important;
		right: 3% !important;
	}
	#mainVisual .bx-pager {
		bottom: -12px !important;
	}
	#mainVisual .bx-pager-item {
		width: 24px !important;
		height: 4px !important;
		z-index: 8000 !important;
	}
	#mainVisual .bx-pager-link {
		background: url(../img/parts/pager_sp.png) 0 0 no-repeat !important;
		width: 24px !important;
		height: 4px !important;
	}
	#mainVisual .bx-pager-link.active,
	#mainVisual .bx-pager-link:hover { background-position: -24px 0 !important; }
	#mainVisual .bx-controls-auto {
		bottom: 5px;
		right: 2%;
	}
/*****************************************
			Topicpath
*****************************************/
	#topicpath {
		width: 96%;
		margin: 0 auto;
	}
	#topicpath ol {
		width: auto;
		white-space: nowrap;
		overflow-x: scroll;
		-webkit-overflow-scrolling: touch;
		padding: 5px 0;
	}
	#topicpath ol li {
		height: 33px;
		line-height: 33px;
		font-size: 89%;
	}
/*****************************************
				News
*****************************************/
	#newsContents dl,
	#eventContents dl  {
		margin: 0 0 10px 0;
	}
	#newsContents dl dt,
	#eventContents dl dt {
		display: block;
	}
	#newsContents dl dd,
	#eventContents dl dd {
		padding: 5px 0 5px 0;
		display: block;
	}
/*****************************************
			Top Contents
*****************************************/
	#topContents {
	}
	#topContnetsInner {
		width: 96%;
		padding: 0 0 100px 0;
	}
	#btnArea {
		float: none;
		margin: 35px 0 0 0;
		letter-spacing: -0.4em;
	}
	#btnArea li {
		width: 48%;
		margin: 0 4% 0 0;
		display: inline-block;
		letter-spacing: normal;
		vertical-align: top;
	}
	#btnArea li a img {
		width: 100%;
		height: auto;
	}
	#btnArea li a img:hover {
		border-radius: 0;
		background: none;
		filter: alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
	}
	#btnArea li:nth-child(2) {
		margin: 0;
	}
/*****************************************
			Category Title
*****************************************/
	#categoryTitle {
		background-size: 250px auto !important;
		margin: 0 ;
		width: 100% !important;
		/*height: 128px;*/
		overflow: hidden;
		position: relative;
	}
	#categoryTitle .innerTitle {
		/*line-height: 128px;*/
		width: 90%;
		/*height: 70px;*/
		background-size: auto 70px !important;
		padding: 20px 0;
		font-size: 160%;
		letter-spacing: 0em;
	}
/*****************************************
			Local Navigation
*****************************************/
	#lNav {
		margin: 15px 2%;
		z-index: 1000;
		width: auto;
	}
	#lNav ul {
		background: #FFF;
		white-space: nowrap;
		overflow-x: scroll;
		-webkit-overflow-scrolling: touch;
		overflow-scrolling: touch;
	}
	#lNav ul li {
		margin: 0 15px 0 0;
		padding: 3px 0 3px 15px;
		background: url(../img/parts/list_point01.png) 0 50% no-repeat;
	}
	#lNav ul li a:hover {
		color: #C03 !important;
	}
/*****************************************
			Page Title
*****************************************/
	#pageTitle,
	.newsTitle {
		width: 96%;
		padding: 8px 0;
	}
	#pageTitle .innerTitle,
	.newsTitle .innerTitle {
		background-position: 5px 2px;
		font-size: 130%;
	}
/*****************************************
				Contents
*****************************************/	
	#contents,
	.contentsCalendar {
		background: #FFF;
		width: 96%;
		margin: 0 auto;
		padding: 10px 2%;
	}
	#contents img,
	.contentsCalendar img {
		max-width: 100%;
		height: auto;
	}
/*****************************************
			Contents Title
*****************************************/
	#contents h2,
	.contentsCalendar h2 {
		margin: 15px 0 8px 0;
		padding: 5px 5px 5px 20px;
		font-size: 128%;
	}
	#contents h3,
	.contentsCalendar h3 { 
		margin: 15px 0 8px 0;
		font-size: 122%;
	}
	#contents h4,
	.contentsCalendar h4 { 
		margin: 15px 0 8px 0;
		font-size: 108%;
	}
	#contents h5,
	.contentsCalendar h5 { 
		margin: 15px 0 8px 0;
		font-size: 108%;
	}
	#contents h6,
	.contentsCalendar h6 { 
		margin: 15px 0 8px 0;
		font-size: 108%;
	}
/*****************************************
				Option
*****************************************/
	.calendar_page,
	.fileDL,
	.faqCollection,
	.relPage,
	.reference,
	.enquete { width: 96%; }
	.reference .inner .btn_more,
	.faqCollection .inner .btn_more {
		display: block;
		margin: 10px auto;
	}
	.enquete .inner .btn input[type="submit"] { margin: 0 0 12px 0; }
/*****************************************
			Page Information
*****************************************/
	#pageInfo {
		width: 100%;
		height: auto;
		overflow: hidden;
	}
	#pageInfoInner {
		width: 100%;
		float: none;
	}
	#pageInfo ul {
		width: 96%;
		margin: 0 auto;
		background: none;
		float: none;
	}
	#pageInfo ul li {
		padding: 10px 0;
		margin: 5px 0 0 0 ;
		float: none;
	}
	#counter span {
		padding: 0 5px 0 63px;
	}
	#update span {
		padding: 0 5px 0 63px;
	}
	#print { display: none; }
/*****************************************
			Page Top
*****************************************/
	#pageTop {
		margin: 15px auto 0 auto;
		float: none;
	}
/*****************************************
			Social Buttons
*****************************************/
	#social {
		width: 96%;
		padding: 0 2%;
		float: none;
	}
/*****************************************
				Footer
*****************************************/
	#footer { 
		height: auto;
		margin: 0;
	}
	#footerInner { 
		height: auto; 
		padding: 0;
	}
	#footerContents { width: 96%; }
	#footerLogoArea {
		width: 300px;
		margin: 0 auto 20px auto;
	}
	#footerLogo {
		background-size: 100px auto;
		width: 100px;
		height: 81px;
	}
	#cityLogo {
		background-size: 150px auto;
		width: 150px;
		height: 80px;
	}
	#contactus {
		letter-spacing: 1.41;
		width: 100%;
		margin: 0;
		display: block;
		padding: 0;
	}
	#contactus h2 {
		margin: 0 0 10px 0;
	}
	#contactus span {
		display: block;
	}
	#footerAddress {
		display: block;
		margin: 0 0 10px 0;
	}
	#footerTel {
		display: block;
		margin: 0;
	}
	#footerFax {
		display: block;
		margin: 0;
	}
	#footContact {
		margin: 20px auto 10px auto;
		font-size: 100%;
	}
/*****************************************
			   Copy Right
*****************************************/
	#copyright {
		letter-spacing: normal;
		font-size: 71%;
		margin: 0;
		height: 50px;
		line-height: 50px;
	}
/*****************************************
			Calendar List
*****************************************/
	#calList {
		width: 96% !important;
		background: #FFF;
		padding: 10px 2%;
	}
	#calDesc {
		width: 96% !important;
		background: #FFF;
		padding: 10px 2%;
	}
	#btn_calchange { margin: 20px 0 0 0; }
	#calendarAll {
		width: 96% !important;
	}
	#calendar7th {
		width: 96% !important;
	}
	#calendar7th table {
		font-size: 81% !important;
	}
	#calText {
		width: 96% !important;
		box-sizing: border-box;
		margin: 20px auto !important;
	}
/*****************************************
			List Index Question
*****************************************/
	#listIndexQA {
		background: #FFF;
		padding: 10px 2%;
	}
/*****************************************
				Mail Form
*****************************************/
	#mailform dl dt {
		width: 100% !important;
		float: none !important;
	}
	#mailform dl dd {
		width: 100% !important;
		float: none !important;
	}
	#mailform input[type="text"],
	#mailform textarea {
		width: 100% !important;
	}
	#mailform_btn input {
		width: auto !important;
	}
/*****************************************
			Directory News
*****************************************/
	#dirNews {
		width: 96%;
		margin: 0 auto 30px auto;
	}
	#dirNewsList { height: 180px; }
	#dirNews dl { background: none; }
	#dirNews dl dt {
		width: 100%;
		padding: 0;
		float: none;
	}
	#dirNews dl dd {
		width: 100%;
		margin: 0;
	}
	#dir,
	#dirRel {
		width: 96%;
		margin: 0 auto;
	}
	.dirIndex,
	#dirRelInfo {
		width: auto;
		display: block;
		margin: 0 auto 20px auto;
		box-sizing: border-box;
	}
	#dirIndexQA { width: auto; }
	.dirIndex,
	.dirIndexImage {
		width: 100%;
		float: none;
		box-sizing: border-box;
	}	
	.dirIndexImage .dirIndexContents {
		width: 100%;
		padding: 0 2%;
		box-sizing: border-box;
	}
	.dirIndexContents {
		width: 100%;
		padding: 0 2%;
		box-sizing: border-box;
	}
	.dirRelIndex {
		width: 100%;
		float: none;
		box-sizing: border-box;
	}
	#btn_search_QA {
		background-position: 50% 100% !important;
		top: 5px;
		right: 0;
	}
	.dirImageBoxList .dirImageBox .dirImageBoxContents {
		margin: 10px 0 0 0 !important;
	}
	.dirImageBoxList .dirImageBox .dirThumbImage {
		width: 100% !important;
		float: none;
	}
/*****************************************
		Directory Index Q&A
*****************************************/
	#field_search_QA {
		margin: 0;
		padding: 0 1%;
		width: 84%;
		letter-spacing: normal;
	}
	#btn_search_QA {
		width: 12%;
		margin: 0;
		float: right;
		display: block;
		border-radius: 4px;
	}
/*****************************************
			List Index Question
*****************************************/
	#listIndexQA {
		width: 96% !important;
	}
/*****************************************
			Error Document
*****************************************/
	#errorDocumentBox {
		width: 96% !important;
	}
	#errorDocumentBoxInner {
		padding: 15px;
		border: solid 2px #DDD;
		box-sizing: border-box;
	}
/*****************************************
			Google Maps View
*****************************************/
	#mainMap {
		background: #FFF;
		width: 96% !important;
		margin: 0 auto 25px auto !important;
		padding: 5px 2% 10px 2% !important;
	}
	#mapCanvas {
		margin: 10px auto !important;
		width: 98% !important;
		float: none !important;
	}
	#mapNav ul { height: auto !important; }
/*********************s********************
			WYSIWYG Layout
*****************************************/
	/* Float Left Image */
	.cFloatLeftImage {
		margin: 0 0 15px 0;
		overflow: hidden;
	}
	.cFloatLeftImage img {
		margin: 0 auto 10px auto;
		max-width: 100% !important;
	}
	/* Float Right Image */
	.cFloatRightImage {
		overflow: hidden;
	}
	.cFloatRightImage img {
		margin: 0 auto 10px auto;
		max-width: 100% !important;
	}
	/* Vertical Image List */
	.cVerticalImageList img {
		margin: 0 4% 15px 0;
		width: 48%;
	}
	.cVerticalImageList a:nth-child(2n) img,
	.cVerticalImageList img:nth-child(2n) {
		margin-right: 0;
	}
	/* Vertical Image X */
	.cVerticalImageX2,
	.cVerticalImageX3,
	.cVerticalImageX4,
	.cVerticalImageX5,
	.cVerticalImageX6,
	.cVerticalImageX7,
	.cVerticalImageX1Text,
	.cVerticalImageX2Text,
	.cVerticalImageX3Text,
	.cVerticalImageX4Text,
	.cVerticalImageX5Text,
	.cVerticalImageX6Text,
	.cVerticalImageX7Text {
		flex-wrap: wrap;
		margin: 0 0 15px 0;
	}
	.cVerticalImageX1Text .cImageBox {
		flex-basis: 100%;
	}
	.cVerticalImageX2 .cImageBox,
	.cVerticalImageX3 .cImageBox,
	.cVerticalImageX4 .cImageBox,
	.cVerticalImageX5 .cImageBox,
	.cVerticalImageX6 .cImageBox,
	.cVerticalImageX7 .cImageBox,
	.cVerticalImageX2Text .cImageBox,
	.cVerticalImageX3Text .cImageBox,
	.cVerticalImageX4Text .cImageBox,
	.cVerticalImageX5Text .cImageBox,
	.cVerticalImageX6Text .cImageBox,
	.cVerticalImageX7Text .cImageBox {
		margin: 0 0 15px 0;
		width: 48%;
	}
	.cVerticalImageX2 .cImageBox,
	.cVerticalImageX3 .cImageBox:nth-child(n+3),
	.cVerticalImageX4 .cImageBox:nth-child(n+3),
	.cVerticalImageX5 .cImageBox:nth-child(n+5),
	.cVerticalImageX6 .cImageBox:nth-child(n+5),
	.cVerticalImageX7 .cImageBox:nth-child(n+7),
	.cVerticalImageX2Text,
	.cVerticalImageX3Text .cImageBox:nth-child(n+3),
	.cVerticalImageX4Text .cImageBox:nth-child(n+3),
	.cVerticalImageX5Text .cImageBox:nth-child(n+5),
	.cVerticalImageX6Text .cImageBox:nth-child(n+5),
	.cVerticalImageX7Text .cImageBox:nth-child(n+7) {
		margin-bottom: 0;
	}
	.cVerticalImageX2 .cImageBox img,
	.cVerticalImageX3 .cImageBox img,
	.cVerticalImageX4 .cImageBox img,
	.cVerticalImageX5 .cImageBox img,
	.cVerticalImageX6 .cImageBox img,
	.cVerticalImageX7 .cImageBox img,
	.cVerticalImageX1Text .cImageBox img,
	.cVerticalImageX2Text .cImageBox img,
	.cVerticalImageX3Text .cImageBox img,
	.cVerticalImageX4Text .cImageBox img,
	.cVerticalImageX5Text .cImageBox img,
	.cVerticalImageX6Text .cImageBox img,
	.cVerticalImageX7Text .cImageBox img {
		max-width: 100% !important;
	}
	/* Column Layout */
	.cLayoutClm2 {
		margin: 0 0 15px 0;
		overflow: hidden;
		display: block;
	}
	.cLayoutClm2 .clmLeft,
	.cLayoutClm2 .clmRight,
	.cLayoutClm2 .clmLeftWide,
	.cLayoutClm2 .clmRightWide,
	.cLayoutClm2 .clmRightNarrow,
	.cLayoutClm2 .clmLeftNarrow {
		margin: 0 0 8px 0;
		width: 100%;
	}
	.cLayoutClm3 {
		display: block;
		margin: 0 0 15px 0;
		overflow: hidden;
	}
	.cLayoutClm3 .clmLeft,
	.cLayoutClm3 .clmCenter,
	.cLayoutClm3 .clmRight {
		width: 100%;
		margin: 0 0 8px 0;
	}
	/* Text Point */
	.cTextPoint {
		padding: 0 0 0 1em;
		background: url(../img/parts/list_point02.png) 5px 8px no-repeat;
		background-size: 4px auto;
	}
	/* iframe Embed */
	.cIframeWrapper {
		margin: 0 0 15px 0;
	}
	/* Scroll Table */
	.cScrollTable {
		overflow: auto;
		white-space: nowrap;
		-webkit-overflow-scrolling: touch;
	}
	/* Navigation Link */
	.cNavLink {
		margin: 0 0 10px 0;
	}
	.cNavLink a {
		margin: 0 15px 5px 0;
		padding: 0 8px 2px 18px;
		background-size: 12px auto;
		background-position: 2px 6px;
	}
	.cNavLink a:last-child {
		margin-right: 0;
	}

	/* Boder Box */
	.cBorderBox,
	.cBorder2xBox,
	.cBorderDottedBox,
	.cBorderDotted2xBox {
		margin: 5px 0 15px 0;
	}

	.sptext{
		display: block;
	}
	.pctext{
		display: none;
	}
/*****************************************
				BBS
*****************************************/
	#mainBBS {
		width: 100%;
		box-sizing: border-box;
	}
	#bbsList dl {
		width: 100%;
		box-sizing: border-box;
	}
	#bbsList dl dt {
		width: 100%;
	}
	#bbsList dl dd.bbsLastUpdate {
		width: auto;
	}
	#bbsForm input[type="text"],
	#bbsForm input[type="password"],
	#bbsForm textarea {
		width: 100% !important;
		box-sizing: border-box !important;
	}
}

