@charset "utf-8";

* {
	margin: 0;
	padding: 0;
	font-family: 'Arial',YuGothic,'Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ ゴシック',sans-serif;
	/*font-family: "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/
	/*font-family: "Noto Sans JP", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, "メイリオ", "Osaka", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;	/*フォント種類（ゴシック）*/}

body * {box-sizing: border-box;}
html, body {
/*	height: 100%; */
	font-size: 16px;
}

body {
	margin: 0;
	padding: 0;
	background-color: #f0f8ff;
/*	color: #000;*/
}

/*table {
	border: 1px solid #ccc;
	padding: 5px;
}*/

header {
	height: 60px;
	width: 100%;
	padding: 0px 15px;
	background-color: #f0f8ff; /*transparent;	/*ヘッダーの背景は透明*/
	position: fixed;
	top: 0;
	z-index: 10;
	display: flex;
	/*border: 1px solid #0f0;*/
}

.logo {
	font-size: 18px;
}

main {
	position: relative;
	margin: 65px 5px;
	/*border: 1px solid #f00;*/
}

footer {
/*	position: absolute;
	bottom: 0; */
	width: 100%;
	margin-top: 30px;
	margin-bottom: 10px;
	text-align: center;
	font-size: 12px;
	color: #ccc;										/*文字の色を変更*/
	/*border: 1px solid #0f0;*/
}

/*画像全般の設定*/
img {
	border: none;
	max-width: 100%;
	vertical-align: middle;
}

nav {
	margin: 0 0 0 auto;
}

h1{
	font-size: 20px;					/* 画面幅900px以上の設定にも指定あり */
	margin: 20px 20px;
/*	border: 1px solid #0f0; */
}

h2{
	font-size: 20px;
	padding: 0 10px;
	margin: 10px 0;
	background-color: #8fcaff;
	border-radius: 10px;							/*横線の両端の角に丸みを持たせる*/
}

h3{
	width: 15%;
	text-align: center;
	font-size: 18px;
	margin-left: 10px;
	background-color: #8fcaff;
	border-radius: 10px;							/*横線の両端の角に丸みを持たせる*/
	border: 3px double #eee;
}
section {
	margin-bottom: 20px;
/*	border: 1px dotted #0f0; */
}

dl dt {
	font-weight: bold;
	font-size: 120%;
}
dl dd{
	text-indent: 20px;
}
dl dt {
	margin-top: 10px;
	margin-bottom: 5px;
}

ol {
	margin: 0 30px;
/*	list-style-position: inside;*/
	/*border: 1px dashed #f0f; */
}

.contents {
	margin: 0px 20px 20px 20px;
	padding: 0 10px;
/*	border: 1px solid #000; */
}

.div_haken {
	height: 130px;
	overflow: auto;
	margin: 0 15px 0 0;
/*	border: 1px dashed #0f0; */
}

.div_haken2 {
	text-align: center;
	font-size: 17px;
	font-weight: bold;
	margin: 10px 10px;
	padding: 5px;
	background-color: #8fcaff;
	border-radius: 10px;							/*横線の両端の角に丸みを持たせる*/
	border: 3px double #eee;	
}

.div_haken3 {
	text-align: center;
	font-size: 17px;
	font-weight: bold;
	margin-top: 20px;
}

.li_haken {
	margin-bottom: 15px;
	/*border: 1px dotted #ff0; */
}

p{
	/*border: 1px dashed #0ff;*/
}

.img_left {
	float: left;
	margin-right: 10px;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {zoom: 1;}

.list_none{
	list-style: none;
}

.ol_haken {
	margin-left: 30%;
	margin-right: 15px;
}

.ul_qa1{
	list-style: 'Ｑ.';
	margin: 0 30px 10px 30px;
	
}
.ul_qa2{
	list-style: 'Ａ.';
	margin: 0 30px;
}

.li_qa1 {
	margin: 0 15px 15px 0;
	font-weight: bold;
}

.li_qa2 {
	margin: 0 15px 15px 0;
	padding-bottom: 15px;
	border-bottom: 1px dotted #8fcaff;
}

.p_cl {
	margin: 10px 20px 15px 20px;
}

.h3_cl {
	width: fit-content;
	padding: 0 5px;
}

.fm {
	padding: 10px 10px;
	border: 2px solid #000;
	border-radius: 10px;							/*横線の両端の角に丸みを持たせる*/
}

.fm_item {
	margin-bottom: 8px
}

.fm_rdbtn {
	margin-right: 8px
}

.fm_btnitem {
	margin: 15px 0 5px 0;
}

.fm_btn {
	width: 80px;
	padding: 5px;
	margin-left: 20px;
	font-size: 15px;
	border: 1px solid #000;
	border-radius: 30px;							/*横線の両端の角に丸みを持たせる*/
	background-color: #8fcaff;

}

.fm_ad{
	width: 25em;
}

.fm_txa{
	width: 25em;
}

.fm_bc_k {
	background-color: #eee;
	border: 1px solid #000;
	font-size: 15px; 
}

.contact_msg {
	margin-left: 10px;
}

.err_head {
	font-size: 22px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 20px;
}	

.err_body {
	text-align: center;
}

/*------------------------- ハンバーガーメニューの設定 開始 */
#ham_menu {
	background-color: transparent;	/*透明の背景*/
	position: relative;							/*ハンバーガーの横線の位置を決めるための基準*/
	cursor: pointer;								/*リンクを示すカーソルを表示（指差しマーク）*/
	margin: 0 0 0 auto;							/*左側に余白を作り、ハンバーガーメニューを右端に配置*/
	height: 40px;										/*ヘッダーの高さと同じ60px*/
	width: 40px;										/*高さと同じ幅*/
	margin-top: 10px;
}

#ham_menu span {
	position: absolute;							/*親要素である#ham_menuを基準に位置を指定*/
	left: 5px;											/*#ham_menu内の左がら15pxに横線を配置（幅が60pxなので右からも15px）*/
	width: 30px;										/*横線の幅が30px*/
	height: 4px;										/*横線の高さが4px*/
	background-color: #111;					/*横線を文字色と同じ*/
	border-radius: 8px;							/*横線の両端の角に丸みを持たせる*/
	transition: ease 0.3s;					/*変化の時間（easeは初期値）*/
	flex-direction: column;					/*子要素（３本バー）部分。flexはデフォルトで横並びになるので、それを縦並びに変更。*/
	display: block;
}

#ham_menu span:nth-of-type(1) {
	top: 6px;
}
#ham_menu span:nth-of-type(2) {
	top: 18px;
}
#ham_menu span:nth-of-type(3) {
	bottom: 6px;
}

#ham_menu.ham span:nth-of-type(1) {
	transform: rotate(45deg);				/*反時計回りに45度回転*/
	top: 18px;
}

#ham_menu.ham span:nth-of-type(2) {
	opacity: 0;
}

#ham_menu.ham span:nth-of-type(3) {
	transform: rotate(-45deg);			/*時計回りに45度回転*/
	top: 18px;
}

/*ul {
	flex-direction: column;					/*ulのflexboxを縦並びにする*/  
/*}*/

header a {
	color: #111;										/*文字の色を変更*/
	text-decoration: none;
	display: block;
	line-height: 30px;
	padding: 5px 20px;
}

/*×印が出ている状態の3本バーの背景色*/
#ham_menu.ham {
	background: rgba(34, 49, 52, 0.9);
}
/*×印が出ている状態の3本バーの色*/
#ham_menu.ham span {
	background-color: #fff;					/* 白色 */
}
/*------------------------- ハンバーガーメニューの設定 終了 */


/*------------------------- メニューバーの初期設定 開始 */
/*メニューをデフォルトで非表示*/
#menubar {display: none;}
#menubar ul {list-style: none;margin: 0;padding: 0;}
#menubar a {display: block;text-decoration: none;}

/*上で非表示にしたメニューを表示させる為の設定*/
.large-screen #menubar {display: block;}
.small-screen #menubar.display-block {
	display: block;
	top: 60px;
	left: 0px;
	position: absolute;
	width: 100%;
	background-color: rgba(34, 49, 52, 0.9);
}

/*3本バーをデフォルトで非表示*/
#ham_menu.display-none {display: none;}

/*ドロップダウンをデフォルトで非表示*/
.ddmenu_parent ul {display: none;}

/*ドロップダウンの親メニューのカーソル表示を変更*/
/*a.ddmenu {cursor: default;} */

/*ddmenuを指定しているメニューにアイコンをつける設定*/
a.ddmenu::before {
	content: "▼";									/*アイコンの指定*/
	margin-right: 0.2em;						/*アイコンとテキストとの間に空けるスペース*/
}


/*------------------------- 大きな端末用のメニューブロック設定 */
/*メニューブロック全体の設定*/
.large-screen nav#menubar >  ul {
	display: flex;									/*横並びにする*/
	flex-direction: row;
}

/*メニュー１個あたりの設定*/
.large-screen #menubar li a {
	border-radius: 40px;						/*角を丸くする指定。適当に大きければOKです。*/
	padding: 0.1em 0.7em;						/*上下、左右へのメニュー内の余白*/
}

/*マウスオン時の背景色*/
.large-screen #menubar li a:hover {
	background: #8fcaff;
}

/*------------------------- 小さな端末用のメニューブロック設定 */
.small-screen #menubar.display-block a{
 	border-top: solid 0.5px rgba(255, 255, 255, 0.6);	/*リストの境目に白線 */
}

/*マウスオン時の背景色と文字色*/
.small-screen #menubar li a:hover {
	background: #8fcaff;
	color: #111;
}

/*小さな端末のメニューの文字色*/
.small-screen #menubar, .small-screen #menubar a {
	color: #fff;
}
/*------------------------- メニューバーの初期設定 終了 */


/*------------------------- 画面幅900px以上の設定 開始 */
@media (min-width: 900px) {

/*	html, body {
		font-size: 16px;
	}
*/

	/*ハンバーガーメニューを非表示*/
	#ham_menu {
		display: none;
	}

	/*ヘッダーのグローバルメニューを表示*/
	#menubar {
		display: block;
	}

	h1{
		font-size: 25px;
	}

	.fm_ad{
		width: 30em;
	}

	.fm_txa{
		width: 30em;
	}

}
/*------------------------- 画面幅900px以上の設定 終了 */