@charset "UTF-8";



/* ------------------------------------------

  global

------------------------------------------ */
* {
	margin: 0px;
	padding: 0px;
	}
html {
	font-size: 62.5%;
	height: 100%;

    -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
}

body {font-size: 10px; font-size: 1.0rem;}
body {
	text-align: center;
	font-family:"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN",-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,メイリオ,Meiryo,sans-serif;
	}

/* img
-----------------------------------------------------------  */
img {
	padding: 0px;
	margin: 0px;
	border: none;
	vertical-align: bottom;
	display: block;
	max-width: 100%;
	max-height: 100%;
	}

/* text link
----------------------------------------------------------- */
a:link,
a:visited,
a:active {
	color: #115fad;
	text-decoration: none;
	}

a:hover {
	color: #999;
	text-decoration: underline;
	}


/* clearfix
----------------------------------------------------------- */
/* clearfix */
.cf:before,
.cf:after{
    display: table; 
    content: '';
}

.cf:after{
    clear: both;
}

/* h
----------------------------------------------------------- */
h1,h2,h3,h4,h5,h6 {
	margin: 0px;
	padding: 0px;
	}

/* ul li
----------------------------------------------------------- */
li { list-style: none;}


/* em
----------------------------------------------------------- */
em {font-style: normal;}


/* bold
----------------------------------------------------------- */
.bold { font-weight: bold;}
.center { text-align: center; }
.inline { display: inline!important; }
strong, .bold { font-weight: bold; }
.txLeft { text-align: left; }
.txRight { text-align: right; }
.mb20 { margin-bottom: 20px!important; }
.mb30 { margin-bottom: 30px!important; }
.mt20 { margin-top: 20px!important; }
.mt30 { margin-top: 30px!important; }
.mt40 { margin-top: 40px!important; }
.mt50 { margin-top: 50px!important; }
.mt60 { margin-top: 60px!important; }
.mt70 { margin-top: 70px!important; }
.mt150 { margin-top: 150px!important; }

/* text-indent
----------------------------------------------------------- */
#hBottom h1.logo a,
#hBottom p.logo a,
#totop a,
.footerLogo
										{ overflow: hidden; text-indent: 100%; white-space: nowrap;}


/* PC タブレット用スタイル */
@media (min-width: 768px) {

/* link move
----------------------------------------------------------- */
#hTop ul li	a,
#hBottom ul	li a,
#topBaneer a,
#footer a
	{
	transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	cursor: pointer;
	}

#hTop ul li	a:hover,
#hBottom ul	li a:hover,
#topBaneer a:hover,
#footer a:hover
	{
	filter: alpha(opacity=50);
	-webkit-opacity: 0.5;
	-moz-opacity: 0.5;
	opacity: 0.5;
	}


/* width
-----------------------------------------------------------  */
.inner,
#totop
										{ margin: 0 auto; width: 97%;}

/* container
----------------------------------------------------------- */
#container {
	font-size: 14px; font-size: 1.4rem;
	line-height: 1.8;
	/*color: #333;*/
	color: #333c4e;
	letter-spacing: 0.05em;
	text-align: left;
	overflow: hidden;
	}


/* header
----------------------------------------------------------- */
#topBaneer { float: left; }
#topBaneer a { display: block; padding: 8px 12px; background-color:#115fad; color: #FFF; font-weight: bold; margin-top:5px; margin-left:4px; }
#topBaneer a:hover{ text-decoration: none; }

#hTop									{ background-color: #fff; border-bottom: #ccc 1px solid; padding-right: 20px;}	
#hTop ul								{ float: right; border-right: #ccc 1px solid;}	
#hTop ul li								{ float: left; border-left: #ccc 1px solid; height: 50px; line-height: 50px;}	
#hTop ul li	a 							{ display: inline-block; padding: 0px 20px; color: #333c4e;}
#hTop ul li	a:hover 					{ text-decoration: none;}
#hTop ul li:last-child a 				{ padding: 10px;}

#hBottom 								{ padding: 27px 20px 0px 20px; min-height: 98px; box-sizing: border-box;}
#hBottom h1.logo a,
#hBottom p.logo a 						{ display: block; float: left; width: 310px; height: 44px; background: url(../../img/union/logo.png) no-repeat left top;}
#hBottom .menu-container .menu ul.gM					{ float: right; width: 605px; margin: 10px 0 0 0; background: url(../../img/union/line_v_gray.jpg) no-repeat right 7px; box-sizing: border-box;}
#hBottom .menu-container .menu ul.gM > li a				{ float: left; padding: 0px 30px; color: #333c4e; box-sizing: border-box; height: auto;}
#hBottom .menu-container .menu ul.gM > li a:hover 		{ text-decoration: none;}
#hBottom .menu-container .menu ul.gM li.menu-dropdown-icon > a { background: url(../../img/union/line_v_gray.jpg) no-repeat left 7px; height: 61px;}

.menu-mobile 							{ display: none;}
.menu > ul > li > ul 					{ display: none; width: 100%; padding: 20px; position: absolute; z-index: 99; left: 0; margin: 0; list-style: none; box-sizing: border-box;}
ul.normal-sub 							{ position: absolute !important; top: 149px !important; left: 0 !important; margin: 0 auto; width: 100% !important; background-color: rgba(17, 95, 173, 0.8); padding: 10px 20px; z-index: 9998 !important;}
ul.normal-sub span 						{ display: block; margin: 0 auto; width: 1240px !important;}
ul.normal-sub span li.title 			{ display: block; color: #fff; border-bottom: #ccc 1px solid; margin-bottom: 20px; padding: 0 0 10px 5px; box-sizing: border-box;}
ul.normal-sub li a 						{ color: #fff !important; padding: 10px 30px 10px 30px !important; width: 25%; box-sizing: border-box; background: url(../../img/union/icon_white_m.png) no-repeat 5px center !important;}
	
#searchBlock  							{ position: absolute; top: 50px; z-index: 9999 !important;}
#searchBlock 							{ display: block; width: 100%; background-color: rgba(17, 95, 173, 0.8); text-align: center;}
#searchBlock .inner 					{ padding: 50px 0; margin-bottom: 50px;}
#searchBlock p 							{ color: #fff;}	

#searchBlock .searchBox 				{ margin: 0 auto; width: 550px;}
#searchBlock .searchBox input 			{ float: left; height: 50px; width: 500px; padding: 5px;  box-sizing: border-box; border-radius: 0;}
#searchBlock button 					{ float: left; background-color: transparent; border: 0; height: 50px; width: 50px;}
#searchBlock button#search-btn 			{ background-color: #115fad; padding: 0 8px; cursor: pointer;}
#searchBlock button#search-btn:hover 	{ background-color: #111; padding: 0 8px; cursor: pointer;}


/* footer
----------------------------------------------------------- */
#footer 								{ background-color: #f1f1f1;}
#footer .inner02 							{ padding: 47px 20px 0 20px; box-sizing: border-box;}

.footerLogo 							{ display: block; width: 310px; height: 44px; background: url(../../img/union/logo.png) no-repeat left top; margin-bottom: 44px; box-sizing: border-box;}
.footerNavTop,
.footerNavTop a,
.footerNavBottom a 						{ color: #333c4e;}
	
.footerNavTop 							{ border-bottom: #333c4e 1px solid; padding-bottom: 34px; margin-bottom: 22px;}
.footerNavTop dl:nth-of-type(1) 		{ float: left; width: 185px;}
.footerNavTop dl:nth-of-type(2)  		{ float: left; width: 200px;}
.footerNavTop dl:nth-of-type(3)  		{ float: left; width: 200px;}
.footerNavTop dl:nth-of-type(4)  		{ float: left; width: 130px;}

.footerNavTop dl dt 					{ font-weight: bold; padding-bottom: 25px;}
.footerNavTop dl:nth-of-type(4) dt 		{ padding-bottom: 0px;}

.footerNavBottom 						{ padding-bottom: 30px;}
.footerNavBottom ul 					{ float: left; width: auto;}
.footerNavBottom ul li 					{ float: left; padding-right: 30px;}
.footerNavBottom ul li:last-child 		{ padding-right: 0px;}
.footerNavBottom p.copy 				{ float: right;}


/* totop ページの先頭へ戻る
----------------------------------------------------------- */
#totop a 								{ display: block; float: right; margin-right: 15px; margin-top: -26px; width: 54px; height: 54px; background: url(../../img/union/totop.png) no-repeat left top;
										-webkit-transition: all 0.3s ease;
										-moz-transition: all 0.3s ease;
										transition: all 0.3s ease;
										}

#totop a:hover 							{ filter: alpha(opacity=50);
										-webkit-opacity: 0.5;
										-moz-opacity: 0.5;
										opacity: 0.5;
										}


/* font
----------------------------------------------------------- */
/* basic font-size: 14px; */
#searchBlock p
										{ font-size: 30px;}	
ul.normal-sub li.title
										{ font-size: 24px !important;}
#searchBlock .searchBox input
										{ font-size: 20px !important;}
ul.normal-sub li a
										{ font-size: 16px !important;}
#hBottom ul	li	
										{ font-size: 15px;}
#hTop,
.footerNavTop dt
										{ font-size: 13px;}	
.footerNavTop dd
										{ font-size: 12px;}	

}


/* タブレット用スタイル */
@media (min-width: 768px) and (max-width: 1024px) {

/* width
-----------------------------------------------------------  */
.inner,
#totop
										{ margin: 0 auto; width: 740px;}


/* header
----------------------------------------------------------- */
#hBottom 								{ padding: 27px 20px 0px 20px; min-height: 90px; box-sizing: border-box;}
#hBottom h1.logo a,
#hBottom p.logo a 						{ display: block; float: left; width: 250px; height: 35px; background: url(../../img/union/logo.png) no-repeat left top; background-size: cover;}
#hBottom .menu-container .menu ul.gM					{ float: right; width: 415px; margin: 5px 0 0 0; background: url(../../img/union/line_v_gray.jpg) no-repeat right 7px; box-sizing: border-box;}
#hBottom .menu-container .menu ul.gM > li a				{ float: left; padding: 0 15px; color: #333c4e; box-sizing: border-box; height: 58px;}

.menu-mobile 							{ display: none;}
.menu > ul > li > ul 					{ display: none; width: 100%; padding: 20px; position: absolute; z-index: 99; left: 0; margin: 0; list-style: none; box-sizing: border-box;}
ul.normal-sub 							{ position: absolute !important; top: 141px !important; left: 0 !important; margin: 0 auto; width: 100% !important; background-color: rgba(17, 95, 173, 0.8); padding: 10px 20px; z-index: 9998 !important;}
ul.normal-sub span 						{ display: block; margin: 0 auto; width: 100% !important;}
ul.normal-sub span li.title 			{ display: block; color: #fff; border-bottom: #ccc 1px solid; margin-bottom: 20px; padding: 0 0 10px 5px; box-sizing: border-box;}
ul.normal-sub li a 						{ color: #fff !important; padding: 10px 3% 10px 3% !important; width: 33.33%; box-sizing: border-box; background: url(../../img/union/icon_white_m.png) no-repeat 5px center !important;}
	

/* footer
----------------------------------------------------------- */
.footerNavTop dl:nth-of-type(1) 		{ float: left; width: 165px;}
.footerNavTop dl:nth-of-type(2)  		{ float: left; width: 200px;}
.footerNavTop dl:nth-of-type(3)  		{ float: left; width: 165px;}
.footerNavTop dl:nth-of-type(4)  		{ float: left; width: 110px;}

.footerNavBottom ul 					{ float: left; width: 50%;}
.footerNavBottom ul li 					{ float: left; padding-right: 15px;}
	

/* font
----------------------------------------------------------- */
/* basic font-size: 14px; */
#hBottom ul	li	
										{ font-size: 13px;}

.footerNavBottom ul li,
.footerNavBottom p.copy
										{ font-size: 12px;}	
	
	
}
	
/* スマホ用スタイル */
@media screen and (max-width: 767px){

			/* width
			-----------------------------------------------------------  */
			.inner,
			#totop
													{ margin: 0 auto; width: 96%;}

			/* container
			----------------------------------------------------------- */
			#container {
				font-size: 14px; font-size: 1.4rem;
				line-height: 1.8;
				color: #333;
				letter-spacing: 0.05em;
				text-align: left;
				overflow: hidden;
				}


			/* header
			----------------------------------------------------------- */
			#topBaneer { float: none; position: fixed; bottom: 0; z-index: 2; }
			#topBaneer a { display: block; padding: 8px 12px; background-color:#115fad; color: #FFF; font-weight: bold; margin-top:0; margin-left:0; }
			#topBaneer a:hover{ text-decoration: none; }

			#hTop									{ background-color: #fff; border-bottom: #ccc 1px solid; padding-right: 20px;}	
			#hTop ul								{ float: left; border-right: #ccc 1px solid;}	
			#hTop ul li								{ float: left; border-left: #ccc 1px solid; height: 50px; line-height: 50px;}	
			#hTop ul li	a 							{ display: inline-block; padding: 0px 20px; color: #333c4e;}
			#hTop ul li	a:hover 					{ text-decoration: none;}
			#hTop ul li:last-child a 				{ padding: 10px;}

			#hBottom 								{ padding: 27px 20px; min-height: 90px; box-sizing: border-box;}
			#hBottom h1.logo a,
			#hBottom p.logo a 						{ display: block; margin: 0 auto; width: 250px; height: 35px; background: url(../../img/union/logo.png) no-repeat left top; background-size: cover;}
 
			a.menu-mobile,
			ul.normal-sub span li.title 					{ display: none;}
	

			#searchBlock  							{ position: absolute; top: 50px; z-index: 9999;}
			#searchBlock 							{ display: block; width: 100%; background-color: rgba(17, 95, 173, 0.8); text-align: center;}
			#searchBlock .inner 					{ padding: 50px 0; margin-bottom: 50px;}
			#searchBlock p 							{ color: #fff;}	

			#searchBlock .searchBox 				{ margin: 0 auto; width: 300px;}
			#searchBlock .searchBox input 			{ float: left; height: 50px; width: 250px; padding: 5px; box-sizing: border-box; border-radius: 0;}
			#searchBlock button 					{ float: left; background-color: transparent; border: 0; height: 50px; width: 50px;}
			#searchBlock button#search-btn 			{ background-color: #115fad; padding: 0 8px; cursor: pointer;}
			#searchBlock button#search-btn:hover 	{ background-color: #111; padding: 0 8px; cursor: pointer;}


			/* footer
			----------------------------------------------------------- */
			#footer 								{ background-color: #f1f1f1;}
			#footer .inner02 						{ padding: 30px 10px 0 10px; box-sizing: border-box;}

			.footerLogo 							{ display: block; width: 200px; height: 28px; margin: 0 auto; background: url(../../img/union/logo.png) no-repeat left top; margin-bottom: 20px; box-sizing: border-box; background-size: cover;}
			.footerNavTop,
			.footerNavTop a,
			.footerNavBottom a 						{ color: #333c4e;}

			.footerNavTop 							{ border-bottom: #333c4e 1px solid; margin-bottom: 22px;}

			.footerNavTop dl 						{ float: left; width: 50%; min-height: 200px;}

			.footerNavTop dl dt 					{ font-weight: bold; padding-bottom: 10px;}
			.footerNavTop dl:nth-of-type(4) dt 		{ padding-bottom: 0px;}

			.footerNavBottom 						{ padding-bottom: 30px;}
			.footerNavBottom ul 					{ text-align: center; line-height: 1.4; margin-bottom: 20px;}
			.footerNavBottom ul li 					{ display: inline; padding: 0 5px;}

			.footerNavBottom p.copy 				{ text-align: center; line-height: 1.3;}


			/* totop ページの先頭へ戻る
			----------------------------------------------------------- */
			#totop a 								{ display: block; float: right; margin-right: 15px; margin-top: -20px; width: 40px; height: 40px; background: url(../../img/union/totop.png) no-repeat left top; background-size: cover;
													-webkit-transition: all 0.3s ease;
													-moz-transition: all 0.3s ease;
													transition: all 0.3s ease;
													}

			#totop a:hover 							{ filter: alpha(opacity=50);
													-webkit-opacity: 0.5;
													-moz-opacity: 0.5;
													opacity: 0.5;
													}


			/* font
			----------------------------------------------------------- */
			/* basic font-size: 14px; */
			#searchBlock p
													{ font-size: 3.0rem;}	
			ul.normal-sub li.title
													{ font-size: 2.4rem !important;}
			#searchBlock .searchBox input
													{ font-size: 1.6rem !important;}
			#hBottom ul	li	
													{ font-size: 1.5rem;}
			#hTop,
			.footerNavTop dt
													{ font-size: 1.4rem;}	
			.footerNavTop dd,
			.footerNavBottom ul li 
													{ font-size: 1.2rem;}	
			.footerNavBottom p.copy
													{ font-size: 1.1rem;}	

}
