/* *************************************************************************** */
/* * メニューの表示・非表示・無効                                            * */
/* *************************************************************************** */
.menu-on{
	/* 表示 */
}

.menu-off{
	/* 非表示 */
	display:none;
}

.menu-disabled{
	disabled:disabled;
}

/* *************************************************************************** */
/* * ヘッダー(共通)                                                          * */
/* *************************************************************************** */
/*
 * ナビゲーションバーの高さ
 */
.navbar .navbar-nav .open .dropdown-menu > li > a,
.dropdown-menu>li>a{
	font-size:small;
}
.common-header{
	margin-bottom:1.0em;
}

.common-header .navbar .navbar-nav .open .dropdown-menu,
.common-header .navbar-header{
	height:60px;
	min-height:60px;
	max-height:60px;
	margin:0 5px;
}

.common-header .navbar .navbar-nav .open .dropdown-menu > li > a,
.common-header .navbar-nav > li > a {
	margin-bottom:0.1em;
	padding-top:0;
	padding-bottom:0;
	line-height:1.8em;
}

/* ナビゲーションバー */
.navbar {
	background-color: #FFFFFF;
	border-color: #FFFFFF;
	min-height:60px;
	max-height:60px;
	margin-bottom:0;
}
.navbar .navbar-nav>.active>a:hover{
	background-color: #C7DFFF;
}

/* ナビゲーションバーのロゴ部分 */
.navbar .navbar-brand {
	color: #999999;
}
.navbar .navbar-brand:hover {
	color: #808080;
}

/* ナビゲーションバーのリンク */
.navbar .navbar-nav .open .dropdown-menu > li > a,
.navbar .navbar-nav>li>a {
	color: #4536A8;
}

.navbar .navbar-nav .open .dropdown-menu > li > a:focus,
.navbar .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar .navbar-nav>li>a:hover,
.navbar .navbar-nav>li>a:focus {
	color: #2C87A8;
	background-color: #C7DFFF;
}

.navbar .navbar-nav>.active>a,
.navbar .navbar-nav>.open>a,
.navbar .navbar-nav>.open>a:hover,
.navbar .navbar-nav>.open>a:focus {
	color: #FFFFFF;
	background-color: #080808;
}
.navbar .navbar-nav>.active>a:hover,
.navbar .navbar-nav>.active>a:focus {
	color: #FFFFFF;
}

/* トグル・メニュー */
.navbar-toggle{
	margin-top:12px;
}

#header-nav-image-link{
	padding:0;
	margin-bottom:0;
	width:180px;
	height:60px;
}

/* ナビゲーションバーに表示するロゴ */
#header-nav-image{
	height:50px;
	max-width:170px;
	padding:0;
	margin:5px;
}

/* ようこそメッセージなどの表示域：bootstrapの設定を上書き */
.navbar-text{
	float: none;							/* ２行表示したいので、floatしない */
	margin:0.5em 1.2em 0.2em 170px; 		/* 左のマージンは、ロゴ・アイコン分なので、header-nav-imageの幅と調整する */
	min-width:16em;
	max-width:30em; 						/* 名前が長い場合を想定：breakpointごとに設定を変える */
}

/* リンク部分：下線の表示 */
#header-nav-username{
	border-bottom: 1px solid midnightblue;
}

/* 「ようこそ」、「さん」の位置調整 */
.header-welcome-msg{
	display:inline-block;
	vertical-align:top;
}

/* スマホ用表示欄 */
#header-nav-sparea{
	display:none;
}

#header-nav-username_sp{
	border-bottom: 1px solid midnightblue;
}

/* *************************************************************************** */
/* * ヘッダー(デバイス毎)                                                    * */
/* *************************************************************************** */
/* スマートフォン(ポートレイト) : -tn- */
@media (max-width: 559px) {
	/* ナビゲーションバーの左右のマージンを削除 */
	.common-header{
		margin-bottom:1.5em;
	}

	.common-header .navbar .navbar-nav .open .dropdown-menu,
	.common-header .navbar-header{
		margin:0;
	}

	/* ナビゲーションバーは折りたたまれている */
	.common-header .navbar .navbar-nav .open .dropdown-menu > li > a,
	.common-header .navbar .navbar-nav > li > a{
		margin-top:0.4em;
	}

	/* メニューの背景色 */
	#nav-menu-login{
		background-color: ghostWhite;
	}

	/* メニュー内のテキスト(会員名など)は非表示 */
	.navbar-text{
		display:none;
	}

	/* スマホ専用の表示域 */
	#header-nav-sparea{
		display:block;
		width:560px;					/* 画面の幅いっぱいに設定 */
		height:1.8em;					/* 高さは1行分だけ：2行表示の場合の調整はJavaScriptで行う */
		margin-top:0;
		margin-left:-20px;				/* 左のマージン分も背景色で塗るため */
		padding-left:20px;				/* マージン分ずらす */
		background-color:ghostWhite;
	}

	/* 利用者名 */
	#header-nav-username_sp{
		display: inline-block;
		margin-right:0.5em;
		max-width:9em;
		height:1.2em;

		white-space:nowrap;
		overflow:hidden;				/* "overflow" の値は "visible" 以外のものを指定する */
		-o-text-overflow: ellipsis; 	/* Opera 9-10 */
		text-overflow:    ellipsis; 	/* IE, WebKit (Safari, Chrome), Firefox 7, Opera 11 */
	}

	#nav-menu-any{
		background-color: ghostWhite;
	}
}

/* *************************************************************************** */
/* スマートフォン : -xs- */
@media (min-width: 560px) and (max-width: 767px) {
	/* ナビゲーションバーの左右のマージンを削除 */
	.common-header .navbar-header{
		margin:0;
	}

	/* ナビゲーションバーは折りたたまれている */
	.common-header .navbar .navbar-nav > li > a{
		margin-top:0.4em;
	}

	#nav-menu-login{
		background-color: ghostWhite;
	}

	/* ようこそメッセージなど */
	.navbar-text{
		margin-top: 0.2em;
		max-width:20em; 			/* 名前が長い場合を想定：breakpointごとに設定を変える */
	}

	.navbar-text > span{
		margin-right: 0.5em;
	}

	/* 利用者名 */
	#header-nav-username{
		display: inline-block;
		margin-right:0.5em;
		max-width:12em;
		height:1.2em;

		white-space:nowrap;
		overflow:hidden;				/* "overflow" の値は "visible" 以外のものを指定する */
		-o-text-overflow: ellipsis; 	/* Opera 9-10 */
		text-overflow:    ellipsis; 	/* IE, WebKit (Safari, Chrome), Firefox 7, Opera 11 */
	}

	#nav-menu-any{
		background-color: ghostWhite;
	}
}

/* *************************************************************************** */
/* タブレット : -sm- */
@media (min-width: 768px) and (max-width: 991px) {
	#nav-menu-login > ul > li > a{
		margin-top:0.4em;
	}

	/* 利用者名 */
	#header-nav-username{
		display: inline-block;
		margin-right:0.5em;
		max-width:14em;
		height:1.2em;

		white-space:nowrap;
		overflow:hidden;				/* "overflow" の値は "visible" 以外のものを指定する */
		-o-text-overflow: ellipsis; 	/* Opera 9-10 */
		text-overflow:    ellipsis; 	/* IE, WebKit (Safari, Chrome), Firefox 7, Opera 11 */
	}

	#header-nav-main{
		float: right !important;
		margin-right: -15px;
	}

	#nav-menu-any > ul > li > a{
		margin-top:2.4em;
	}
}

/* *************************************************************************** */
/* PC : -md- */
@media (min-width: 992px) and (max-width: 1199px) {
	/* ナビゲーションバーは1段で表示：ログイン中は利用者名を表示 */
	.common-header .navbar .navbar-nav > li > a{
		margin-top:2.5em;
	}

	/* 利用者名 */
	#header-nav-username{
		display: inline-block;
		margin-right:0.5em;
		max-width:14em;
		height:1.2em;

		white-space:nowrap;
		overflow:hidden;				/* "overflow" の値は "visible" 以外のものを指定する */
		-o-text-overflow: ellipsis; 	/* Opera 9-10 */
		text-overflow:    ellipsis; 	/* IE, WebKit (Safari, Chrome), Firefox 7, Opera 11 */
	}

	#header-nav-main{
		right: 0;
		left: auto;
	}
}

/* *************************************************************************** */
/* PC(大画面) : -lg- */
@media (min-width: 1200px) {
	/* ナビゲーションバーは1段で表示：ログイン中は利用者名を表示 */
	.common-header .navbar .navbar-nav > li > a{
		margin-top:2.6em;
	}

	.navbar-text{
		margin-top:0.7em;
	}

	/* 利用者名 */
	#header-nav-username{
		display: inline-block;
		margin-right:0.5em;
		height:1.2em;
	}
}

/* *************************************************************************** */
/* * ヘッダー(チケットで使ってたCSSで今回は未使用)                           * */
/* *************************************************************************** */
/* ポイント表示欄 */
.header-nav-point{
	float: right;
	color: #ff0000;
	margin-right: 1.2em;
}

