/*メニュー
---------------------------------------------------------------------------*/
/*メニュー全体を囲むブロック*/
#menubar {
	text-align: center;		/*文字をセンタリング*/
	font-size: 120%;		/*文字サイズ*/
	margin-bottom: 0px;		/*下に空けるスペース*/
}
/*メニュー１個あたりの設定*/
#menubar li {
	display: inline-block;	/*横並びにする設定*/
	margin: 3px 3px;
}
#menubar li  {
	font-weight: bold;/*太字に*/
	text-decoration: none;/*下線消す*/
	background: skyblue;/*背景を水色に*/
	color:white;/*文字を白に*/
	padding:0px 5px;/*内側の余白*/
	border-radius: 20px;/*角を丸くする*/
	font-family: 'Avenir','Arial';/*フォントをいい感じに*/
	line-height: 1.6;
	margin-bottom: 5px;
	cursor: pointer;
}

/*マウスオン時の設定*/
#menubar .hovered {
	background: cyan;/*背景色をシルバーに*/
	text-decoration: none;/*下線を消す*/
}

#menubar .menu_selected {
	background: dodgerblue;
	color:white;/*文字を白に*/
	padding:3px 5px;/*内側の余白*/
	border-radius: 20px;/*角を丸くする*/
	font-weight: bold;/*太字に*/
	font-family: 'Avenir','Arial';/*フォントをいい感じに*/


}
/*メニューブロック*/
#menubar-s {
	display: block;
	position: absolute;
	width: 95%;
	border-top: 1px solid #fff;	/*上の線の幅、線種、色*/
	animation-name: menu1;		/*上のkeyframesの名前*/
	animation-duration: 0.5S;	/*アニメーションの実行時間。0.5秒。*/
	animation-fill-mode: both;	/*アニメーションの完了後、最後のキーフレームを維持する*/
	-webkit-animation-fill-mode: both;
	-moz-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	top:62px;
}
#menubar-s input {
	width: 95%;
	border-style: none;
	text-decoration: none;
	padding: 5px 5px;	/*上下、左右へのメニュー内の余白*/
	color: #fff;		/*文字色*/
	font-size: 20px;	/*文字サイズ*/
	border-bottom: 1px solid #fff;	/*下の線の幅、線種、色*/
	background: rgba(0,0,0,0.8);	/*背景色*/
	text-align: center;
	cursor: pointer;
}
#menubar-s .nest{
	background:forestgreen !important;
	padding: 3px 0px 3px 10px !important;
	font-size: 18px !important;
	width: 85% !important;;
    margin-left: 10% !important;
	text-align: left !important;
}


.menubar-s-violet{
	background:forestgreen;
}

/*メニュー１個あたりの設定*/
#submenu_span li a {
	display: block;text-decoration: none;
	padding: 15px 30px;	/*上下、左右へのメニュー内の余白*/
	color: #fff;		/*文字色*/
	font-size: 20px;	/*文字サイズ*/
	border-bottom: 1px solid #fff;	/*下の線の幅、線種、色*/
	background: rgba(0,0,0,0.8);	/*背景色*/
}

/*メニューブロック*/
#submenu_span {
	display: block;
	position: relative;
	z-index: 9;
	border-top: 1px solid #fff;	/*上の線の幅、線種、色*/
	animation-name: menu1;		/*上のkeyframesの名前*/
	animation-duration: 0.5S;	/*アニメーションの実行時間。0.5秒。*/
	animation-fill-mode: both;	/*アニメーションの完了後、最後のキーフレームを維持する*/
	-webkit-animation-fill-mode: both;
	-moz-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	top:0px;
	text-align: center;
}
#submenu_span input {
	border-style: none;
	text-decoration: none;
	padding: 9px;	/*上下、左右へのメニュー内の余白*/
	color: #fff;		/*文字色*/
	font-size: 18px;	/*文字サイズ*/
	border-bottom: 1px solid #fff;	/*下の線の幅、線種、色*/
	background:	gray;
	text-align: center;
	cursor: pointer;
	height: 45px;
    vertical-align: middle;
}

#submenu_span input:hover {
	box-shadow: 0 0 0 0.25rem rgba(130,138,145,.5);
}
/*メニュー１個あたりの設定*/
#menubar-s li a {
	display: block;text-decoration: none;
	padding: 15px 30px;	/*上下、左右へのメニュー内の余白*/
	color: #fff;		/*文字色*/
	font-size: 20px;	/*文字サイズ*/
	border-bottom: 1px solid #fff;	/*下の線の幅、線種、色*/
	background: rgba(0,0,0,0.8);	/*背景色*/
}

*３本バーアイコン設定
---------------------------------------------------------------------------*/


/*３本バーブロック*/
#menubar_hdr {
	display: block;
	cursor: pointer;
}
/*アイコン共通設定*/
#menubar_hdr.close,
#menubar_hdr.open {
	z-index: 10;
	position: fixed;
	top: 10px;
	right: 7%;
	width: 50px;	/*幅*/
	height: 50px;	/*高さ*/
	border-radius: 50%;
	cursor: pointer;
}
/*三本バーアイコン*/
#menubar_hdr.close {
	background: #23b3e9 url("../images/icon_menu_close.png") no-repeat center;
	background-size: contain;
}
/*閉じるアイコン#de1313*/
#menubar_hdr.open {
	background: #23b3e9 url("../images/icon_menu_3bars.png") no-repeat center;
	background-size: contain;
}

#loginID {
	display: none;
	position: fixed;
	top: 58px;
	right: 5px;
	font-weight: bold;
}

/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
/*通常時のボタンは非表示*/
body .nav-fix-pos-pagetop a {
	display: none;
}
/*fixmenu_pagetop.jsで設定している設定値になったら出現するボタンスタイル*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a {
	display: block;text-decoration: none;text-align: center;z-index: 100;position: fixed;animation-name: scroll;animation-duration: 1s;animation-fill-mode: forwards;
	width: 50px;		/*ボタンの幅*/
	line-height: 50px;	/*ボタンの高さ*/
	bottom: 50px;		/*ウィンドウの下から20pxの場所に配置*/
	right: 10%;			/*ウィンドウの右から10%の場所に配置*/
	border-radius: 50%;	/*角丸指定。50%にすると円形になる。四角形がいいならこの１行削除。*/
	background: #23b3e9 url("../images/icon_pagetop.png") no-repeat center;
	background-size: contain;

}

/*メインメニュー
---------------------------------------------------------------------------*/
/*アニメーションのフレーム設定。全100コマアニメーションだと思って下さい。*/
@keyframes menu1 {
	0% {opacity: 0;}
	100% {opacity: 0.8;}
	}
	@-webkit-keyframes menu1 {
	0% {opacity: 0;}
	100% {opacity: 0.8;}
	}
	@-moz-keyframes menu1 {
	0% {opacity: 0;}
	100% {opacity: 0.8;}
	}
	@-ms-keyframes menu1 {
	0% {opacity: 0;}
	100% {opacity: 0.8;}
	}