@charset "shift_jis";

@media screen and (max-width: 640px) {


/*スマホ非表示*/
.pcview {
		display: none;
	}
	

body {
	width: 100%;
	margin: 0px;
	color: #666666;	/*全体の文字色*/
}

img {
max-width: 100%;

}


html{
	overflow-y:scroll;
	}


h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form{

	margin: 0px;

	padding: 0px;

}

ul{

	list-style-type: none;

}

input,textarea,select {

}

form {

	margin: 0px;

}

table {

	border-collapse:collapse;


	border-spacing: 0;

}

/*ヘッダー（ロゴなどが入ったブロック）

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

#header {

	text-align: left;



	width: 100%;

}

/*ロゴ画像設定*/

#header #logo {
	width: 100%;	

}

/*h1見出しタグ設定*/

#header h1 {


	color: #999;		/*文字色*/

	text-align: center;

}

#header h1 a {


	color: #999;	/*文字色*/

}

#header h2 {
	
	width: 100%;	
	padding: 10% 0;
	text-align: center;
	
}

#header h3 {

}

/*メインメニュー

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

ul#menu {

	 width: 100%;
	 	float: none;


}

ul#menu li {
	width: 100%;
	float: none;


}

ul#menu li.last {
	width: 100%;
	float: none;


}

ul#menu img {
	width: 100%;
	float: none;


}





/*メインコンテンツ

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

#main {

	flex: 1;	/*メインコンテンツを右(right)に回り込み*/

	width: 100%;	/*メインコンテンツ幅*/

}

/*トップページのみの設定*/

#top #main {


}

/*h2タグ設定*/

#main h2 {
	text-align:center;
	line-height: 40px;
	color: #FFFFFF;		/*文字色*/
	height: 40px;

	background: url(../images/bg3.gif) no-repeat;	/*背景画像の読み込み、背景画像をリピートしない(no-repeat)*/
	width: 100%;


}
/*h3タグ設定*/

#main strong {

	font-size: 100%;	/*文字サイズ*/

	color: red;		/*文字色*/
	
	
}
/*段落タグの余白設定*/

#main p {
	width:100%;
	display:inline-block;


}

#main p.img {
	width:100%;
	display:inline-block;

}

.topimage {
	width: 50%;
	float:left;
		margin-top:10px;
}

.topimage img {
	width: 100%;

}

.topimage p{
	text-align:center;
	
	bottom: 0px;
	color: #000;
	margin-bottom:10px;
	background: #dddddd;

}
.topimage a {
	font-size:0.8em;
	text-decoration: none;
}
.topimage a:hover p{
	text-decoration: underline;
}



/*リンク（全般）設定

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

a {

	color: #666666;

}

a:hover {


}


/*コンテナー（HPを囲むブロック）

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

#container {

	width: 100%;

}


/*コンテンツ

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

#contents {

	width: 100%;

}




/*サブコンテンツ

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

#sub {

	float: left;	/*サブコンテンツを左(left)に回り込み*/

	width: 100%;	/*サブコンテンツ幅*/

	text-align:center;

}

/*h3タグ設定*/

#sub h3 {

	font-size: 100%;

	color: #ffffff;	/*文字色*/

	border-bottom: 4px solid #DE638C;	/*下部の線の幅、線種、色の設定*/

	background: #C5C5C5 url(../images/bg1.gif) repeat-x bottom;	/*背景色、背景画像の読み込み＆X軸(横軸)にリピート＆下部に配置*/
	margin-top:10px;
}

/*段落タグの余白設定*/

#sub p {


}



/*サブメニュー

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

ul.submenu {



}

ul.submenu li a {
	display: block;
	width: 100%;	/*左から、上下、左右への余白*/
	text-decoration: none;
	border-bottom: 1px solid #c9c9c9;	/*下側の線の幅、線種、色*/
	color: #666666;	/*文字色*/
	background: #F2F2F2 url(../images/bg2.gif) repeat-x bottom;	/*背景色、背景画像の読み込み＆X軸にリピートする(repeat-x)＆下部に配置(bottom)*/
	padding-bottom: 6px;
	padding-top: 6px;

}

ul.submenu li a:hover {


}



/*トップページ内「更新情報・お知らせ」ブロック

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

#main .new {

	overflow: auto;

	height: 150px;

	width: 710px;

	padding-left: 10px;

}

#main .new dl {

	clear: left;

	width: 690px;

	border-bottom: 1px solid #cccccc;	/*お知らせごとの境界線の幅、線種、色*/

	overflow: hidden;

}

#main .new dt {

	font-weight: bold;	/*日付を太字に*/

	float: left;

	width: 100px;

}

#main .new dd {

	float: left;

	width: 590px;

}

#main .new dd img {

	vertical-align: middle;

}

*html #main .new dd img {

	margin-top:0.5em;

	vertical-align: baseline;

}



/*フッター

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

#footer {

	clear: both;

	width: 100%;

	text-align: right;	/*文字を右寄せ*/

	padding-top: 10px;

	padding-bottom: 10px;

}

#footer a {

	text-decoration: none;

}



/*よくあるご質問ページ設定

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

/*Q（質問）*/

dl.faq dt {

	background: url(../images/faq_q.gif) no-repeat left top;	/*Qアイコンの読み込み*/

	padding-left: 25px;

	font-weight: bold;	/*文字を太字に*/

	color: #DE638C;		/*文字色*/

}

/*A（回答）*/

dl.faq dd {

	background: url(../images/faq_a.gif) no-repeat left top;	/*Aアイコンの読み込み*/

	padding-left: 25px;

	border-bottom: 1px solid #c9c9c9;	/*回答の下の線の幅、線種、色*/

}



/*テーブル１

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

.ta1,
.ta1 td,
.ta1 th {
  border-collapse: collapse;
  text-align: center;
	width:100%;
	  box-sizing: border-box;
}

.ta1 th {
  background: #DE638C;
  color: #fff;
  padding: 4px 12px;
  display: block;
  width: 100%
}

.ta1 td {
  background: #ffffff;
  padding: 4px 12px;
  display: block;
  width: 100%;
}






/*テーブル（サブコンテンツ内の予定表）

/*テーブル２

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

.ta2,
.ta2 td,
.ta2 th {
	width:100%;
  border-collapse: collapse;
  text-align: center;
  	  box-sizing: border-box;
}

.ta2 th {
  background: #DE638C;
  color: #fff;
  padding: 4px 12px;
  display: block;
  width: 100%
}

.ta2 td {
  background: #ffffff;
  padding: 4px 12px;
  display: block;
  width: 100%;
}

/*テーブル３（沿革写真用）

---------------------------------------------------------------------------*/
.ta3 {

	width: 100%;
	border:none;
	box-sizing: border-box;
	

}

.ta3, .ta1 td, .ta21 th{
	line-height: 2;
	text-align: center;
}

/*テーブル内の右側*/

.ta3 td {
	padding: 10px;
	}
	
	
/*テーブル４（施設紹介）

---------------------------------------------------------------------------*/
.ta4,
.ta4 td,
.ta4 th {
	width:100%;
  border-collapse: collapse;
  text-align: center;
  	  box-sizing: border-box;
}

.ta4 th {
  background: #DE638C;
  color: #fff;
  padding: 4px 12px;
  display: block;
  width: 100%
}

.ta4 td {
  background: #ffffff;
  padding: 4px 12px;
  display: block;
  width: 100%;
}

.ta4 th.clname{
	  background: #555555;
	  margin-top:5%;
}
	
/*テーブル5（趣味ひとり言）

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

.ta5 {
	width: 100%;

}

.ta5, .ta5 td, .ta5 th{

	border: 1px solid #c9c9c9;	/*テーブルの枠線の幅、線種、色*/

	line-height: 2;

}

/*テーブル内の右側*/

.ta5 td{
	width: 100%;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 5px;

}

/*テーブル内の左側の見出し部分*/

.ta5 th{

	width: 100%;

	padding: 10px;

	text-align: center;

	background-color: #E5E5E5;	/*背景色*/

}

/*テーブル１行目に入った見出し部分*/

.ta5 th.tamidashi{

	width: auto;

	text-align: left;

	color: #FFFFFF;			/*文字色*/

	background: #65b3d1;	/*背景色*/

}


/*テーブル6（施設紹介）

---------------------------------------------------------------------------*/
.ta6 th,
.ta6 tr,
.ta6 td {
  display: block;
}

.ta6 th {
  padding: 3px 6px;
  display: none;
}

.ta6 td {
  padding: 3px 6px;
}

.ta6 .clname {
  background-color: skyblue;
  color: white;
  font-weight: bold;
}

.ta6 .price {
  font-weight: bold;
}

.ta6 {
  border: 1px solid silver;
}



/*テーブル（サブコンテンツ内の予定表）---------------------------------------------------------------------------*/

.cal {

	width:100%;

}

.cal, .cal td, .cal th{

	border: 1px solid #c9c9c9;	/*テーブルの枠線の幅、線種、色*/

	line-height: 2;

	text-align: center;

}

/*曜日*/

.cal th{

	background-color: #E5E5E5;	/*背景色*/

}

.cal .sat{

	color: #09F;	/*「土」の文字色*/

}

.cal .sun{

	color: #C33;	/*「日」の文字色*/

}



/*その他---------------------------------------------------------------------------*/

#main img.tempotop{
	width:100%;
}

#main h2.message{
	background:none;
	color:#444444;
	height:auto;
	width:100%;
  position: relative;
  padding: 1.5rem 2rem;
  border: 3px solid #d8d8d8;
  border-radius: 10px;
  background: #f9f9f9;
  box-sizing: border-box;
  margin-bottom:10px;
  margin-top:10px;
}

#main h2.message:before {
  position: absolute;
  bottom: -14px;
  left: 1em;
  width: 0;
  height: 0;
  content: '';
  border-width: 14px 12px 0 12px;
  border-style: solid;
  border-color: #d8d8d8 transparent transparent transparent;
  box-sizing: border-box;
}

#main h2.message:after {
  position: absolute;
  bottom: -10px;
  left: 1em;
  width: 0;
  height: 0;
  content: '';
  border-width: 14px 12px 0 12px;
  border-style: solid;
  border-color: #f9f9f9 transparent transparent transparent;
  box-sizing: border-box;
}


.look {

	background-color: #E9E9E9;

}

.mb1em {

	margin-bottom: 1em;

}

.pt0 {
	text-align:center;

	padding-top: 0 !important;
	margin-top:10px;
	width:100%;

}

.pt0 img{
	width:100%;

}


.mini {

	font-size: 10px;

}

.fr {
	float: right;
	padding-bottom: 10px;


}

.fl {
	float: left;
	padding-bottom: 10px;

}



.clear {

	clear: both;

}

ul.disc {

	padding: 0em 25px 1em;

	list-style: disc;

}

.color1 {

	color: #DE638C;

}

.pr {

	font-size: 10px;

}

.btn {

	font-size: 13px;

}

.wl {

	width:100%;

}

.ws {

	width:100%;

}

.c {

	text-align: center;

}

.subtitle {
	font-size:10px;
}


}