@charset "utf-8";
/* CSS Document */

/*******************************************************************/
/*                                                            BASE */
/*******************************************************************/
	
	/*	reset
	---------------------------------------------------------------*/
	* { padding: 0px; margin: 0px; }

	/* padding　強制クリア */
	.padding_reset {
		padding: 0px !important;
	}
	
	/* margin　強制クリア */
	.margin_reset {
		margin: 0px !important;
	}

	/*	img
	---------------------------------------------------------------*/
	img { border: none; }

	/*	select
	---------------------------------------------------------------*/
	select { height: 25px; }

	/*	label
	---------------------------------------------------------------*/
	label { font-weight: normal; }

	/*	cf
	---------------------------------------------------------------*/
	.cf:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
		}
	.cf { display: inline-block; }
	/* Hides from IE-mac \*/ 
	* html .cf { height: 1%; }
	.cf { display: block; }
	/* End hide from IE-mac */
	
	/*	link
	---------------------------------------------------------------*/
	a:link,
	a:visited,
	a:active {
		color: #0000FF;
		text-decoration: underline;
		}
		
	a:hover {
		color: #f00;
		text-decoration: none;
		}
		
	/*	color
	---------------------------------------------------------------*/
	.black { color: #000000; }
	.white { color: #fff; }
	.red { color: #f00; }
	.blue { color: #0000FF; }
	.green { color: #008800; }
		
	/*	font size
	---------------------------------------------------------------*/
	.tiny { font-size: 60%; }
	.smaller { font-size: 80%; } /*Bootstrapのクラスと名前が被るのでerを付ける*/
	.large { font-size: 125%; }
		
	/*	align
	---------------------------------------------------------------*/
	.center { text-align: center; }
	.left { text-align: left; }
	.right { text-align: right; }

	/*	transform
	---------------------------------------------------------------*/
	#main .uppercase { text-transform: uppercase; }

	/*	font weight
	---------------------------------------------------------------*/
	#main .bold { font-weight: bold; }
	#main .normal { font-weight: normal; }

	/*	text decoration
	---------------------------------------------------------------*/
	#main .underline { text-decoration: underline; }

	/*	ime-mode
	---------------------------------------------------------------*/
	#main .ime-active { ime-mode: active; }
	#main .ime-disabled { ime-mode: disabled; }
	#main .ime-inactive { ime-mode: inactive; }
		
	/*	background (!important 他の色よりも優先されます）
	---------------------------------------------------------------*/
	#main .bg_white { background-color: #FFFFFF !important; }
	#main .bg_gray { background-color: #EEEEEE !important; }
	#main .bg_eea { background-color: #eeeeaa !important; }

	/*	space : margin
	---------------------------------------------------------------*/
	#main .mb0 { margin-bottom: 0px; }
	#main .mb10 { margin-bottom: 10px; }
	#main .mb15 { margin-bottom: 15px; }
	#main .mb20 { margin-bottom: 20px; }
	#main .mt20 { margin-top: 20px; }
	#main .mb30 { margin-bottom: 30px; }
	#main .mb40 { margin-bottom: 40px; }
	#main .mb50 { margin-bottom: 50px; }
	#main .mb60 { margin-bottom: 60px; }
	#main .mb70 { margin-bottom: 70px; }
	#main .mb80 { margin-bottom: 80px; }
	#main .mb90 { margin-bottom: 90px; }
	#main .mb100 { margin-bottom: 100px; }




/*******************************************************************/
/* bootstrap上書き　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 */
/*******************************************************************/

	/*	container
	------------------------------------------------------------------*/
	.container{
		max-width: 100%;
		padding: 0px;
	}
		/*768px～991pxはどうしようか、とりあえず768px*/
		@media screen and (min-width: 768px) {
			.container {
				width: 768px;
			}
		}
		/*背景画像(影)のサイズのため、992px以上のブラウザは990px固定*/
		@media screen and (min-width: 992px) {
			.container {
				width: 970px;
			}
		}

	/*	row
	------------------------------------------------------------------*/
	.row {
		margin: 0px;
	}


	/*	col-md-*
	------------------------------------------------------------------*/
	.col-md-3, .col-md-9 {
		margin-left: 0px;
		margin-right: 0px;
		padding: 0px;
	}

	/*	col-sm-*
	------------------------------------------------------------------*/
	.col-sm-4, .col-sm-8 {
		margin-left: 0px;
		margin-right: 0px;
		padding: 0px;
	}

/*******************************************************************/



/*******************************************************************/
/*                                                                 */
/*******************************************************************/
/*	body
===================================================================*/
body {
	background: #FFFFFF;
	font-size: 12px;
	line-height: 1.5em;
	color: #111;
	}
	/*768px以上のブラウザは背景画像(影)を表示するために背景を変更*/
	@media screen and (min-width: 768px) {
		body {
			background: #E7E7E7;
		}
	}

/*	wrap
===================================================================*/
#wrap {
	text-align: left;
	padding: 0px;
	}
	/*768px以上のブラウザは背景画像を表示する*/
	@media screen and (min-width: 768px) {
		#wrap {
			background: url(../../img/union/bg.jpg) repeat-y center top;
		}
	}

/*	inner
===================================================================*/
#inner {
	padding: 0px;
	}
	/*992px以上のブラウザは下部の背景画像(影)を表示する*/
	@media screen and (min-width: 992px) {
		#inner {
			background: url(../../img/union/bg_bottom.jpg) no-repeat center bottom;
			padding: 0px 0px 0px 5px;
		}
	}	
	/*	IE6	*/
	* html #inner { width: 970px; }


/* noscript(javascript off)
------------------------------------------------------------ */
#noscript {
	display: block;
	position: relative;
	top: 10px;
	left: 15px;
	width: 930px;
	z-index: 10;
}

#noscript p {
	border: 1px solid #FF0000;
	background-color: #FFFFFF;
	padding: 10px;
	color: #FF0000;
	font-weight: bold;
	text-align: center;
}

@media screen and (max-width: 991px) {	
	#noscript {
		width: 740px;
	}
}

@media screen and (max-width: 767px) {	
	#noscript {
		width: 100%;
		top: 0px;
		left: 0px;
		
	}

	#noscript p {
		margin: 10px 10px 0px 10px;
	}
}

/*	header
---------------------------------------------------------------*/
#header {
		height: 90px;
		margin-bottom: 15px;
		background: url(../../img/union/header_bg.jpg) no-repeat 0px 0px;
	}

	/*992px以上のブラウザは影の分、内側に表示する*/
	@media screen and (min-width: 992px) {
		#header {
			margin-left: 5px;
			margin-right: 5px;
		}
	}
	
	#header #logo {
		padding: 3px 0px 0px 10px;
		}

		/*	ヘッダートグルボタン
		---------------------------------------------------------------*/
		#header #logo #spMenu {
			display: none;
		}
		
		#header #logo a {
			padding: 0px;
			background: url(../../img/union/logo.gif) no-repeat 0px 5px;
			background-size: contain;
			width: 190px;
			height: 71px;
			text-indent: -9999px;
			display: block;
		}

		/*767px以下の場合は、ロゴの位置をずらす*/
		@media screen and (max-width: 767px) {	
			#header #logo {
				padding: 20px 0px 0px 10px;
			}
			#header #logo a {
				position: relative;
				top: -15px;
			}
		}

/*	contents
---------------------------------------------------------------*/
#contents {
	padding: 0px 15px;
	height: auto !important;
	}
	/*767px以下のブラウザは余白を小さくする*/
	@media screen and (max-width: 767px) {
		#contents {
			padding: 0px 10px;
		}
	}
	/*992px以上のブラウザは影の分、内側に表示する*/
	@media screen and (min-width: 992px) {
		#contents {
			margin-left: 5px;
			margin-right: 10px;
		}
	}

	/*	main
	-----------------------------------------------------------*/
	#contents #main {
		margin-bottom: 25px;
		padding-bottom: 50px;
		min-height: 410px;
		position: relative;
	}

	/*	h1
	-------------------------------------------------------*/
	#main h1 {
		font-size: 220%;
		font-weight: bold;
		color: #003072;
		border-bottom: 2px dotted #BEBEBE;
		margin-top: 0px;
		padding: 10px 0px 20px 0px;
		line-height: 110%;
		}
		/*768px以上のブラウザは背景画像を表示する*/
		@media screen and (min-width: 768px) {
			#main h1 {
				background: url(../../img/union/ttl_bg.gif) no-repeat 0px 0px;
				padding-top: 40px;
				padding-left: 10px;
			}
		}

			
	/*	breadcrumb
	-------------------------------------------------------*/
	#contents #main p#breadcrumb {
		background: url(../../img/union/icon_breadcrumb.gif) no-repeat 0px 4px;
		padding-left: 15px;
		margin-bottom: 15px;
		}
				
	/*	side
	-----------------------------------------------------------*/
	#contents #side {
		width: 198px;
		}
		
		/*	menu01
		-------------------------------------------------------*/
		#side dl.menu01 {
			margin-bottom: 10px;
			}
			
			#side dl.menu01 dt {
				background: url(../../img/union/menu_ttl01.gif) no-repeat 0px 0px;
				height: 22px;
				color: #fff;
				padding-left: 24px;
				line-height: 22px;
				}
				
			#side dl.menu01 dd {
				background: #E8ECE8 url(../../img/union/menu_bg02.gif) no-repeat 0px 0px;
				border-left: 1px solid #3064C8;
				border-right: 1px solid #3064C8;
				border-bottom: 1px solid #3064C8;
				padding: 2px 5px 2px 36px;
				}
				
			#side dl.menu01 dd.hr {
				background: #fff url(../../img/union/menu_bg01.gif) no-repeat 0px 0px;
				}
				
				#side dl.menu01 dd a {
						text-decoration: none;
						color: #000;
						}
						
					#side dl.menu01 dd a:hover {
						text-decoration: underline;
						color: #336699;
						}
							
		/*	menu02
		-------------------------------------------------------*/
		#side dl.menu02 {
			margin-bottom: 10px;
			}
			
			#side dl.menu02 dt {
				background: url(../../img/union/menu_ttl02.gif) no-repeat 0px 0px;
				height: 22px;
				color: #fff;
				padding-left: 24px;
				line-height: 22px;
				}
				
			#side dl.menu02 dd {
				background: #E8ECE8 url(../../img/union/menu_bg02.gif) no-repeat 0px 0px;
				border-left: 1px solid #3064C8;
				border-right: 1px solid #3064C8;
				border-bottom: 1px solid #3064C8;
				padding: 2px 5px 2px 36px;
				}
				
					#side dl.menu02 dd a {
						text-decoration: none;
						color: #000;
						}
						
					#side dl.menu02 dd a:hover {
						text-decoration: underline;
						color: #336699;
						}
						
		/*	logout
		-------------------------------------------------------*/
		#side .logout a {
			background: url(../../img/union/btn_logout.gif) no-repeat 0px 0px;
			width: 198px;
			height: 34px;
			text-align: center;
			font-weight: bold;
			line-height: 34px;
			display: block;
			color: #fff;
			text-decoration: none;
			margin-bottom: 40px;
			}
			
			#side .logout a:hover { background-position: 0px -34px; }

				
/*	footer
---------------------------------------------------------------*/
#footer {
	background: #000;
	color: #fff;
	text-align: center;
	padding: 5px 0px;
	}
	/*992px以上のブラウザは背景画像(影)のため右余白追加*/
	/*うまく入れ子にならないので、無理やりフッターを少し上部へ移動させる*/
	@media screen and (min-width: 992px) {
		#footer {
			margin-left: 5px;
			margin-right: 10px;
			position: relative;
			top: -9px;
		}
	}

	@media screen and (max-width: 767px) {
		#footer {
			font-size: 90%;
		}
	}