@charset"utf-8";

/*============================================
全般的なスタイル
============================================*/
body {
	max-width:100%;
	min-width:360px;		/*ページ全体の横幅*/
	background-color:#ffffff;	/*ページ全体の背景色*/
	background-image:none;		/*ウェブページ全体の背景画像を無しにする*/
	font-size:95%;			/* フォントサイズを95%にする */
}

div#pagebody {
	max-width:100%;
	min-width:360px;
	margin:0px auto; 		/*内容全体をセンタリング*/
	background-image:none;		/*コンテンツ全体の背景画像を無しにする*/
	background-repeat:no-repeat;	/*背景画像を繰り返さない*/
}



/*============================================
ヘッダ
============================================*/

.hwrapper{					/*モニター全体に広げるヘッダー*/
	min-width:360px;
	height:auto;
					
				
}

.header{					/*ヘッダー内に画像やテキストを置く枠*/
	max-width:450px;
	min-width:360px;			
	background-image:none;			/*ロゴ背景画像を無しにする*/
  	margin: auto;
  	padding: 5px;

}

.header h1{					/*画像が表示されない場合のテキストの調整*/
	
	font-size:50%;				/*フォントのサイズ*/
		
}



.header h1 a img{				/*ロゴ画像*/
	
	width:100%;
	height:auto;


}


/*============================================
メインメニュー
============================================*/

ul#menu {					/*menuというid名を付けられているul要素をスタイル適用の対象にする*/
	max-width:100%;	
	min-width:360px;			/*メインメニュー部分の幅と高さ*/
	height:37px;
	margin:0px 2px;			/*上下マージン(外側余白)0px、左右マージン20px　(1000px-960px)÷2=20px */
	
	display: grid;				/*リスト項目をグリッド表示（格子）にする*/
  	grid-template-columns: 1fr 1fr 1fr 1fr 1fr; /* liの数だけ1frを記載 */
	gap: 0;					/*グリッド間の余白をなくす*/

	font-size: 10px;			/*文字サイズ*/
	background-color:#ffffff;		/*背景色*/
	
						/*position:static; メインメニュー位置固定解除したいとき設定する */
}



#menu li a {					/*menuというid名が付けられた要素の下にあるli a要素にスタイルを適用*/
	background-color:#ffffff;		/*背景色*/
	color:#4167e1;				/*文字色*/			

	width:72px; height:17px;		/*幅と高さ 360÷5=72 */
	padding:20px 0px 0px 0px;		/*上パディング（内側余白） 上・右・下・左*/

	background-image:none; 			/*背景画像をなくす*/
	
	
}

#menu li a:hover {
	background-color:#ffffff;		/*リンクにマウスが乗ったら背景色を変更する #000080→＃000066*/
	background-image:none; 			/*リンクにマウスが乗ったら背景画像を変更する（画像が表示されない環境に備え上に背景色も設定しておく）*/
}


/*============================================
ヘッダ画像
============================================*/

#img_index {
	max-width:100%;
	min-width:360px;
	height:auto;				/*トップページのヘッダ画像の表示サイズを指定*/
	margin:2px 2px 5px 2px;			/*マージン*/
}

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

#img_subpage {
	max-width:100%;
	min-width:360px;
	height:auto;		/*トップページ以外のヘッダ画像の表示サイズを指定*/
	margin:2px 2px 5px 2px;			/*マージン*/
}

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



/*============================================
サブメニュー
============================================*/


div#submenu {
	width:100%;
	min-width:360px;		/*幅と高さ*/				
	height:auto;
	margin:2px 2px 5px 2px;		/*マージン*/
	float:none;			/*フロートしない*/
}


h2 {
	width:97%;			/*幅と高さ*/				
	height:auto;
	padding:8px 0px 8px 10px;	/*パディング*/
	font-size:13px;			/*フォントサイズ*/
	background-image:none;		 /*背景画像を無しにする*/
	background-repeat:no-repeat;	/*背景画像を繰り返さない*/
	background: linear-gradient(to right, #9966cc, #cc99ff);
 	background: -moz-linear-gradient(left, #9966cc, #cc99ff);
  	background: -webkit-linear-gradient(left, #9966cc, #cc99ff);
	color:#ffffff;			/*文字色*/
	clear:both;			/*フロートをクリアする*/
}

div#submenu ul li a {
	display:block;			/*リンク部分をブロック表示にする*/
	width:97%; height:auto;	/*幅と高さ*/
	padding:8px 0px 1px 10px;	/*パディング*/
					/*text-decoration:none;リンクの下線を無くすとき設定*/
	border-bottom:1px dotted gray;	/*リンク領域の下部にボーダーを付ける*/
	background-image:none;		/*リンク領域に背景画像を無しにする*/
	background-repeat:no-repeat;	/*背景画像を繰り返さない*/
	background-color:#f7efff;	/*背景色*/
	color:#000000;			/*文字色*/
	font-size:85%;			/*フォントサイズ*/
}

/*============================================
インフォメーション
============================================*/
div#info {
	max-width:100%;
	min-width:360px;
	height:auto;			/*高さ・幅の指定*/
	float:none;			/*フロートしない*/
	padding:0px 2px 0px 2px;	/*パディング（内側余白）*/
}
h3 {
	font-size:13px;			/*文字サイズ*/
	width:100％;			/*幅の指定*/
	height:auto;			
	margin:10px 0px 0px 0px;	/*マージン*/
	padding:9px 0px 9px 10px;	/*パディング*/
	background-image:none;		/*リンク領域に背景画像を無しにする*/
	background-repeat:no-repeat;	/*背景画像を繰り返さない*/
	background: linear-gradient(to right, #4169e1, #6495ed);
 	background: -moz-linear-gradient(left, #4169e1, #6495ed);
  	background: -webkit-linear-gradient(left, #4169e1, #6495ed);	
	color:#ffffff;			/*文字色*/
	border-radius:0px;		/*角丸にしない*/
}

p {
	width:95%;			/*幅の指定*/
	margin:6px;			/*マージン*/
					/*インデント幅text-indent:1em;*/
}
.infoimg_index {

	display:block;			/*ブロック表示にする*/
	width:120px; height:164px;	/*画像の表示サイズを指定*/
	margin:20px 5px 10px 5px;	/*マージン*/
	float:left;			/*画像を左寄せにする*/
}


.box{

	margin:15px auto;		/*中央寄せにする*/
	float:none;			/*フロートしない*/
}

.font_back{

	font-size:15px;			/*文字サイズ*/
}

.pdt_index {

	display: block;			/*画像をブロック要素にする*/
	margin:	10px auto;		/*中央寄せにする*/
	float:none;			/*フロートしない*/
}



.infoimg_subpage {			/*現在未使用*/
	display:block;			/*ブロック表示にする*/
	width:300px; height:225px;	/*画像の表示サイズを指定*/
	margin:0px 0px 20px 0px;	/*マージン*/
	float:none;			/*フロートしない*/
}

.infoimg_tel {				/*現在未使用*/
	display:block;			/*ブロック表示にする*/
	width:300px; height:60px;	/*画像の表示サイズを指定*/
	margin:0px 0px 20px 0px;	/*マージン*/
}




hr {
	clear:both;			/*フロート配置をクリアする*/
	width:100%;			/*幅の指定*/
	margin:10px 0px;		/*マージン*/
	border:1px dotted #cccccc;	/*内容の区切りをグレーの点線表示にする*/
}

:root{
	scroll-padding: 37px;			/*リンク位置がメニューバーに重ならないようにする*/
	scroll-behavior: smooth;
}