﻿@charset "UTF-8";
/* CSS Document */



/************************************************************************************
smaller than 640px
*************************************************************************************/
@media screen and (max-width: 640px) {

html {
	-webkit-text-size-adjust: 100%;
}

body {
	width: 99%;
}


#contents {
	width:100%;

}

#header {
	
	display: none;
}



#mainmenu {
	display:none;
}

#sp-heder {
	display: block;
}



.controlarea {
	background: #5b7bb2;
	margin-top: 0px;
	width: 100%;
	height: 35px;
}

h2 {
	width: 94%;
}







/* =======================================
2段目
======================================= */
/*左部*/
/*スライド*/

.sliderBox {
	float: none;
	width: 99%;
	order: 0;
	

}




.rightBox {
	float: none;
	width: 99%;
	margin: 0 auto;
	
	

}

.Box_right {
	order: 10;
}


/* =======================================
検索一覧
======================================= */

#tab-box {
	float: none;
	margin-top: 20px;
	order: 1;
}







#tab-box ul {
width:100%;

}
#tab-box ul li {
	width: 32%;
}

#tab-box ul li img {
	width: 100%;
	height:auto;
}


#tab-box div {
width:88%;
}





#tab-box div.MM2 {
width: 88%;
}

#tab-box div.MM2 p {
	width: 100%;
}


#tab-box div.MM2 p span.icon {
	float: none;
	width: 100%;
}

#tab-box div.MM2 p span.palmm2 {
	float: none;
	width: 100%;
}

#tab-box div.MM3 {
width: 88%;
}



/* =======================================
トピックス
======================================= */

.topicsarea {
	float: none;
	width: 99%;
	order: 2;
}

.topicsarea h2 {
	width: 97%;
}


.swiper-container {
	width: 98%;

}

.topicscontents .topiphoto {
	float: none;
	margin-left: 30px;
	width: 80%;
	text-align:center;
	
}

.topicscontents .topitxt {
	float: none;
	/*width: 90%; del */
	height:auto;
	line-height: 1.5;
	margin-right: 25px; /* update */
	margin-left: 35px; /* add */
}

/* add */
.newstit {
	padding:0;
	margin:0 10px;
}
.newstit a {
	padding:0;
	margin:0;
}


/* =======================================
facebook
======================================= */
.facebook {
	width: 99%;
	order: 4;

}


.facebook div.facebooktit {
	width: 100%;

}

.facebook img {
	width: 100%;
	height:auto;
}

.facebook div {
	max-width: 100%;
}

/* =======================================
イベントcalendar 
======================================= */
.calendar {
	width: 99%;
	order: 3;

}



/* =======================================
生涯学習センターのご案内
======================================= */


.annai {
	width: 99%;
	text-align: center;
}


.annaitit img {
	max-width: 99%;
}

.annai .annaiBT {
	float: none;
	width: 100%;
	text-align: center;
}




/* =======================================
バナー
======================================= */


.bannerarea {
	width: 100%;
}

.bannerarea div {
	float: none;
	width: 100%;
	text-align: center;
}

.bannerarea div img {
	max-width: 100%;
}


/* =======================================
バナー1
======================================= */


.bannerarea1 {}


.bannerarea1 div {
	float: none;
	width: 98%;
	text-align:center;
}






/*ボタン3*/
.rightBoxBOT {
	width: 99%;
	text-align: center;
}

.rightBoxBOT div.Btcenter {
	width: 99%;
	margin: 0 auto;
	text-align: center;
}

.rightBoxBOT div.Btcenter div {
	float: none;
}




.eventcalendar {
	max-width: 100%;
	overflow-x: scroll;

}


/* =======================================
イベント
======================================= */

.calendarBt {
	float:right;
	margin: 20px 10px 10px 0;
}

/*pagenavi */
.pagenavioshirase {
	width: 95%;
}


.EVitiran_nai {
	width:99%;

}

.EVitiran_hiniti {
	width: 99%;
	float: none;

}


.EVitiran_sho {
	float: none;
	width: 99%;
	
}
/* =======================================
お知らせ
======================================= */

.itiran_nai {
	width:99%
	
}



.output_areaL {
	width: 99%;
	float: none;
	
	
}

.output_areaR {
	width: 99%;
	float: none;
	
}


/* =======================================
施設利用案内
======================================= */


.boxarea {
  width:100%;
		
	
}


.boxarea ul.boxblock {
    width:100%;
		

}

.boxarea  ul.boxblock li {
   width:100%;
}



.kanrenjyohou {
	width: 98%;
}

.kanrenjyohou .day {
	width: 100%;
	float: none;

}

.kanrenjyohou .nai {
	width: 100%;
	float: none;
	padding: 0 5px;
}



/* =======================================
footer
======================================= */
#footer {
	width: 99%;
	height: auto;
	
}

#footer .main {
	width: 100%;

	
}

/* =======================================
順序
======================================= */

.resodr{
	display: flex;           /* flexコンテナ化 */
   flex-direction: column; /* 縦向きに配置 */
}



/* 追加 */
/* =======================================
アンケート
======================================= */
.otoiwaseform {
	width:98%;
}

.otoiwase_midasi {
	float:left;
	width: 99%;
}

.otoiwase_koumoku {
	width: 99%;
	float:left;
}

.otoiwase_koumoku input.inputtype {
	width: 95%;
}

.otoiwase_koumoku textarea {
	width: 95%;
}



/* table横スクロール */
.output_area table {
	/*max-width: 100%;*/
	overflow-x: scroll;
	overflow: auto;
	display:block;
	max-width: 100%;
	white-space: nowrap;
}
/* tableにスクロールバーを表示 */
.output_area table::-webkit-scrollbar {
	height: 5px;
}
.output_area table::-webkit-scrollbar-track {
	background: #F1F1F1;
}
.output_area table::-webkit-scrollbar-thumb {
	background: #BCBCBC;
}


/* 追加 */
.output_area img {
	width: 95%;
	height: auto;
}

.output_area iframe {
	width: 95%;
}

.itiran_sho {
	width: 95%; /* add */
}





}


