@charset "UTF-8";



/* ------------------------------------------

  top

------------------------------------------ */
/* top
-----------------------------------------------------------  */
@media only screen and (min-width: 780px){

/* link move
----------------------------------------------------------- */
/* top */
#businessCont li a,
#newsCont a,
.btn_gray01,
.btn_blue01 
	{
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	cursor: pointer;
	}


/* top */
#businessCont li a:hover,
#newsCont a:hover,
.btn_gray01:hover,
.btn_blue01:hover 
	{
	filter: alpha(opacity=50);
	-webkit-opacity: 0.5;
	-moz-opacity: 0.5;
	opacity: 0.5;
	}

/* width
-----------------------------------------------------------  */
#header .inner,
#missionCont .inner			{ margin: 0 auto; max-width: 1200px;}
#businessCont .cont,
#newsCont .inner
							{ margin: 0 auto; max-width: 980px;}

#businessCont .list3		{ margin: 0 auto; max-width: 98.97% /* 970px */;}
#newsCont .cont
							{ margin: 0 auto; max-width: 970px;}
#businessCont .list2		{ margin: 0 auto; max-width: 635px;}

/* グレー縦ライン */
#missionCont .inner,
#companyCont .inner,
#newsCont
							{ background: url(../../img/union/img_line_v01.png) repeat-y center top;}

/* mainImg
----------------------------------------------------------- */
#mainImg{ width: 100%; min-height: 696px; /*値はサイトに合わせて*/
			position:relative; background-position: 50% 0; background-repeat: no-repeat; background-size: cover; color: #FFF;}

/* header
----------------------------------------------------------- */
#header				{ }
#header h1			{ float: left; width: 284px; padding-top: 10px;}
#header h1.logo a	{ display: block; width: 284px; height: 60px; background: url(../../img/union/logo_2x.png) no-repeat left top; background-size: contain;}
#header ul			{ float:right; width: 450px; padding-top: 30px;}
#header ul li		{ float: left; padding-right: 30px; font-weight: bold;}
#header ul li:last-child
					{ padding-right: 0px;}
#header ul li a 	{ color: #FFF;}

#mainTxt			{ margin: 175px auto 0 auto; text-align: center; border: #FFF 2px solid; width: 360px; border-radius: 20px; padding: 45px 35px 26px 35px;}
#mainTxt h2			{ line-height: 1; padding-bottom: 24px; border-bottom: #FFF 2px solid; margin-bottom: 24px;}

/* missionCont
----------------------------------------------------------- */
#missionCont 		{ background: url(../../img/union/img_bg01.jpg) repeat-x left top; text-align: center;}
#missionCont .head 	{ padding: 70px 0px 230px 0px; background: url(../../img/union/img_square01.png) no-repeat 93px 207px;}
#missionCont .cont 	{ padding: 0px 0px 84px 0px;}
#missionCont .cont .left
					{ float: left; width: 50%;}
#missionCont .cont .right
					{ float:right; width: 50%; text-align: left;}
#missionCont .cont .left img
				 	{ margin-left: -153px;}
#missionCont .cont .right .box
				 	{ margin: 54px 0px 0px 31px; background-color: #FFF; width: 75%; max-width: 450px; height: 37.3% /*224px*/; padding: 50px 0px 0px 50px; box-sizing: border-box;}
#missionCont h3 	{ font-weight: bold; margin-bottom: 10px;}
#missionCont p		{ line-height: 1.8; padding-bottom: 25px;}
	
/* businessCont
----------------------------------------------------------- */
#businessCont 		{ clear: both; text-align: center; padding-bottom: 100px;
	background-image: url(../../img/top/img_bg_business.jpg), url(../../img/union/img_line_v01.png);
	background-repeat: no-repeat, repeat-y;
	background-position: center 140px, center top;
	}
#businessCont .head			{ padding: 70px 0px 90px 0px;}
#businessCont .head span	{ color: #FFF;}
#businessCont .list3 li a	{ max-width: 30.92%; min-height: 30.92%; float: left; display: block; padding: 28px 20px 25px 20px; margin-bottom: 35px; margin-right: 3.60%; box-sizing: border-box; background-color: #FFF;}
#businessCont .list2 li a	{ max-width: 47.24%; min-height: 47.24%; float: left; display: block; padding: 28px 20px 25px 20px; margin-bottom: 35px; margin-right: 5.51%; box-sizing: border-box; background-color: #FFF;}
#businessCont .list3 li:last-child a,
#businessCont .list2 li:last-child a
							{ margin-right: 0px;}
#businessCont a h3			{ min-height: 138px; border-bottom: #6f6f6f 1px solid; padding: 104px 0px 15px 0px; margin: 0px 20px 20px 20px; box-sizing: border-box; color: #333;}
#businessCont .list01 h3	{ background: url(../../img/top/img_icon_bus01.jpg) no-repeat center top;}
#businessCont .list02 h3	{ background: url(../../img/top/img_icon_bus02.jpg) no-repeat center top;}
#businessCont .list03 h3	{ background: url(../../img/top/img_icon_bus03.jpg) no-repeat center top;}
#businessCont .list04 h3	{ background: url(../../img/top/img_icon_bus04.jpg) no-repeat center top;}
#businessCont .list05 h3	{ background: url(../../img/top/img_icon_bus05.jpg) no-repeat center top;}
#businessCont a p			{ color: #888; padding: 0px 20px 15px 20px; text-align: left;}
#businessCont a div			{ color: #246cba; padding-right: 14px; background: url(../../img/union/img_icon_arrow02.jpg) no-repeat right center; text-align: right;}

/* companyCont
----------------------------------------------------------- */
#companyCont				{ position: relative;}
#companyCont .head			{ padding: 70px 0px 60px 0px; text-align: center; border-bottom: #eee 1px solid;}
#companyCont h3				{ font-weight: bold; line-height: 1; margin-bottom: 35px;}
#companyCont p				{ color: #333; line-height: 1.8;}
#companyCont .square		{ position: absolute; top: 200px; left: 25%; display: block; width: 60px; height: 60px; background: url(../../img/union/img_square01.png) no-repeat left top; z-index: 9999;}

.companyInner				{ margin-top: 138px; background-color: #e3eaf5;}
.companyInner .left			{ float: left; width: 50%; min-height: 527px; background: url(../../img/top/img_company01.jpg) no-repeat right top; background-size: cover;}
.companyInner .right		{ float:right; width: 50%;}
.companyInner .rightinner	{ padding: 140px 0px 0px 100px;}
.companyInner h3 span		{ margin-right: 25px; padding-bottom: 30px; border-bottom: #a0b4d3 3px solid; display: inline-block; position: relative; top: 3px;}	
.companyInner p				{ width: 63.3%; max-width: 380px; padding-bottom: 35px; }
	
.messageInner				{ width: 100%; min-height: 528px; background: url(../../img/top/img_bg_company.jpg) no-repeat center top; background-size: cover;}
.messageInner .left			{ float: left; width: 50%; text-align: right;}
.messageInner .right		{ float:right; width: 50%; min-height: 528px; background: url(../../img/top/img_company02.png) no-repeat left bottom; background-size: contain;}

.messageInner .leftinner	{ padding: 145px 0px 0px 0px; width: 78.33%; max-width: 470px; float: right;}
.messageInner h3 span		{ margin-left: 25px; padding-bottom: 30px; border-bottom: #a0b4d3 3px solid; display: inline-block; position: relative; top: 3px;}	
.messageInner p				{ padding-bottom: 35px; text-align: left;}

/* newsCont
----------------------------------------------------------- */
#newsCont					{ padding: 0px 0px 200px 0px;}
#newsCont .head				{ padding: 150px 0px 40px 0px; text-align: center;}
#newsCont .cont				{ margin: 0px 0px 65px 0px;}
#newsCont .cont a:nth-child(odd)	 { background-color: #f6f8fb; display: block; margin-bottom: 1px;}
#newsCont .cont a:nth-child(even)	 { background-color: #e3eaf5; display: block; margin-bottom: 1px;}
#newsCont a					{ color: #666; letter-spacing: 0.08em;}
#newsCont a dl				{ padding: 12px 20px;}
#newsCont a dt				{ float: left; width: 260px;}
#newsCont a dt span.date	{ width: 120px; display: inline-block;}
#newsCont a dt span.cate	{ padding: 7px 20px; background-color: #FFF;}
#newsCont a dd				{ margin-left: 260px;}
#newsCont .btnbox			{ margin: 0 auto; width: 172px;}
	
/* btn
----------------------------------------------------------- */
.btn_gray01 a				{ display: block; color: #333;}
.btn_gray01 				{ background-color: #FFF; border: #dcdcdc 2px solid; border-radius: 30px; display: inline-block; height: 40px; line-height: 42px;}
.btn_gray01 a span			{ background: url(../../img/union/img_icon_arrow_gray01.png) no-repeat right center; padding: 0px 40px 0px 20px; margin-right: 17px; width: 172px; box-sizing: border-box;}

.btn_blue01 a				{ display: block; color: #333;}
.btn_blue01 				{ border: #a0b4d3 2px solid; border-radius: 30px; display: inline-block; height: 40px; line-height: 42px;}
.btn_blue01 a span			{ background: url(../../img/union/img_icon_arrow_blue01.png) no-repeat right center; padding: 0px 40px 0px 20px; margin-right: 17px; width: 172px; box-sizing: border-box;}

/* font
----------------------------------------------------------- */
/* font-size: 15px; */
#mainTxt h2,
#missionCont h2,
#businessCont h2,
#companyCont h2,
#newsCont h2
					{ font-size: 313.3%; line-height: 1.6;} /* 47px */
#missionCont h3
					{ font-size: 240.0%;} /* 36px */
#businessCont h3
					{ font-size: 133.3%;} /* 36px */
	
#companyCont h3 span 
					{ font-size: 163.6%;} /* 36px 相対 */
#companyCont h3
					{ font-size: 146.6%;} /* 22px */
#mainTxt p
					{ font-size: 106.6%;} /* 16px */
#missionCont p,
#companyCont p,
ul.footernav li,
.address address
					{ font-size:  93.3%;} /* 14px */
#businessCont p,
#newsCont a dt span.cate,
.btn_gray01,
.btn_blue01
					{ font-size:  86.6%;} /* 13px */
#businessCont a div	
					{ font-size:  80.0%;} /* 12px */

#mainTxt h2,
#missionCont h2,
#businessCont h2,
#companyCont h2,
#companyCont h3 span
					{ font-family: 'Oswald', sans-serif; font-weight: normal;}

#businessCont a div	
					{ letter-spacing: -0.02em;}

}

@media only screen and (max-width: 779px){

			/* width
			-----------------------------------------------------------  */
			#header .inner,
			#missionCont .inner			{ margin: 0 auto; max-width: 100%;}
			#businessCont .cont,
			#newsCont .inner
										{ margin: 0 auto; max-width: 100%;}

			#businessCont .list3		{ margin: 0 auto; max-width: 100%;}
			#newsCont .cont
										{ margin: 0 auto; max-width: 100%;}
			#businessCont .list2		{ margin: 0 auto; max-width: 100%;}

			/* グレー縦ライン */
			#missionCont .inner,
			#companyCont .inner,
			#newsCont
										{ background: url(../../img/union/img_line_v01.png) repeat-y center top; background-size: contain;}

			/* mainImg
			----------------------------------------------------------- */
			#mainImg{ width: 100%; height: 300px; /*値はサイトに合わせて*/
						position:relative; background-position: 50% 0; background-repeat: no-repeat; background-size: cover; color: #FFF;}

			/* header
			----------------------------------------------------------- */
			#header				{ }
			#header h1			{ float: left; width: 200px; padding-top: 10px; padding-left: 10px;}
			#header h1.logo a	{ display: block; width: 200px; height: 42px; background: url(../../img/union/logo_2x.png) no-repeat left top; background-size: contain;}

			#mainTxt			{ margin: 0 auto; text-align: center; border: #FFF 2px solid; width: 70%; border-radius: 10px; padding: 10px;
								position: absolute;
								top: 50%;
								left: 50%;
								-webkit-transform: translate(-50%, -50%); /* Safari用 */
								transform: translate(-50%, -50%);
								}
			#mainTxt h2			{ line-height: 1; padding-bottom: 10px; border-bottom: #FFF 2px solid; margin-bottom: 10px;}

			/* missionCont
			----------------------------------------------------------- */
			#missionCont 		{ background: url(../../img/union/img_bg01.jpg) repeat-x left top;  text-align: center;}
			#missionCont .head 	{ padding: 35px 0px 35px 0px; background: url(../../img/union/img_square01.png) no-repeat 25px 70px; background-size: 40px 40px;}
			#missionCont .cont 	{ padding: 0px 0px 0px 0px;}
			#missionCont .cont .left
								{ width: 100%;}
			#missionCont .cont .right
								{ text-align: left;}
			#missionCont .cont .left img
								{ width: 100%;}
			#missionCont .cont .right .box
								{ margin: 15px; background-color: #FFF; padding: 15px; box-sizing: border-box;}
			#missionCont h3 	{ font-weight: bold; margin-bottom: 10px;}
			#missionCont p		{ line-height: 1.8; padding-bottom: 25px;}

			/* businessCont
			----------------------------------------------------------- */
			#businessCont 		{ clear: both; text-align: center; padding-bottom: 40px;
				background-image: url(../../img/top/img_bg_business.jpg), url(../../img/union/img_line_v01.png);
				background-repeat: no-repeat, repeat-y;
				background-position: center 72px, center top;
				background-size: cover, contain;
				}
			#businessCont .head			{ padding: 35px 0px 35px 0px;}
			#businessCont .head span	{ color: #FFF;}
			#businessCont .list3 li a	{ max-width: 80%; margin: 0 auto; display: block; padding: 4% 2%; margin-bottom: 5%; box-sizing: border-box; background-color: #FFF;}
			#businessCont .list2 li a	{ max-width: 80%; margin: 0 auto; display: block; padding: 4% 2%; margin-bottom: 5%; box-sizing: border-box; background-color: #FFF;}
	
			#businessCont a h3			{ border-bottom: #6f6f6f 1px solid; padding: 60px 0px 15px 0px; margin: 0px 20px 20px 20px; box-sizing: border-box; color: #333;}
			#businessCont .list01 h3	{ background: url(../../img/top/img_icon_bus01.jpg) no-repeat center top; background-size: 50px;}
			#businessCont .list02 h3	{ background: url(../../img/top/img_icon_bus02.jpg) no-repeat center top; background-size: 50px;}
			#businessCont .list03 h3	{ background: url(../../img/top/img_icon_bus03.jpg) no-repeat center top; background-size: 50px;}
			#businessCont .list04 h3	{ background: url(../../img/top/img_icon_bus04.jpg) no-repeat center top; background-size: 50px;}
			#businessCont .list05 h3	{ background: url(../../img/top/img_icon_bus05.jpg) no-repeat center top; background-size: 50px;}
			#businessCont a p			{ color: #888; padding: 0px 20px 15px 20px; text-align: left;}
			#businessCont a div			{ color: #246cba; padding-right: 14px; background: url(../../img/union/img_icon_arrow02.jpg) no-repeat right center; text-align: right; margin-right: 20px;}

			/* companyCont
			----------------------------------------------------------- */
			#companyCont				{ position: relative;}
			#companyCont .head			{ padding: 35px 0px 35px 0px; text-align: center; border-bottom: #eee 1px solid;}
			#companyCont h3				{ font-weight: bold; line-height: 1; margin-bottom: 20px;}
			#companyCont p				{ color: #333; line-height: 1.8;}
			#companyCont .square		{ position: absolute; top: 70px; right: 10%; display: block; width: 60px; height: 60px; background: url(../../img/union/img_square01.png) no-repeat left top; background-size: 40px 40px; z-index: 9999;}

			.companyInner				{ margin-top: 50px; background-color: #e3eaf5;}
			.companyInner .left			{ width: 100%; min-height: 200px; height: 50%; background: url(../../img/top/img_company01.jpg) no-repeat right top; background-size: cover;}
			.companyInner .right		{ }
			.companyInner .rightinner	{ margin: 15px; padding: 15px; box-sizing: border-box;}
			.companyInner h3 span		{ margin-right: 25px; padding-bottom: 10px; border-bottom: #a0b4d3 3px solid; display: inline-block; position: relative; top: 3px;}	
			.companyInner p				{ padding-bottom: 25px;}

			.messageInner				{ width: 100%; background: url(../../img/top/img_bg_company.jpg) no-repeat center top; background-size: cover;}
			.messageInner .left			{ width: 100%; }
			.messageInner .right		{ /*width: 100%; min-height: 200px; background: url(../../img/top/img_company02.png) no-repeat left bottom; background-size: contain;*/}

			.messageInner .leftinner	{ margin: 15px; padding: 15px; box-sizing: border-box;}
			.messageInner h3			{ float: right;}
			.messageInner h3 span		{ margin-left: 25px; padding-bottom: 10px; border-bottom: #a0b4d3 3px solid; display: inline-block; position: relative; top: 3px;}	
			.messageInner p				{ padding-bottom: 25px; clear: both;}

			/* newsCont
			----------------------------------------------------------- */
			#newsCont					{ padding: 0px 0px 35px 0px;}
			#newsCont .head				{ padding: 35px 0px 35px 0px; text-align: center;}
			#newsCont .cont				{ margin: 0px 0px 35px 0px;}
			#newsCont .cont a:nth-child(odd)	 { background-color: #f6f8fb; display: block; margin-bottom: 1px;}
			#newsCont .cont a:nth-child(even)	 { background-color: #e3eaf5; display: block; margin-bottom: 1px;}
			#newsCont a					{ color: #666; letter-spacing: 0.08em;}
			#newsCont a dl				{ padding: 12px 20px;}
			#newsCont a dt				{ }
			#newsCont a dt span.date	{ width: 120px; display: inline-block;}
			#newsCont a dt span.cate	{ padding: 5px 20px; background-color: #FFF; position: relative; top: -4px;}
			#newsCont a dd				{ }
			#newsCont .btnbox			{ margin: 0 auto; width: 172px;}

			/* btn
			----------------------------------------------------------- */
			.btn_gray01 a				{ display: block; color: #333;}
			.btn_gray01 				{ background-color: #FFF; border: #dcdcdc 2px solid; border-radius: 30px; display: inline-block; height: 40px; line-height: 42px;}
			.btn_gray01 a span			{ background: url(../../img/union/img_icon_arrow_gray01.png) no-repeat right center; padding: 0px 40px 0px 20px; margin-right: 17px; width: 172px; box-sizing: border-box;}

			.btn_blue01 a				{ display: block; color: #333;}
			.btn_blue01 				{ border: #a0b4d3 2px solid; border-radius: 30px; display: inline-block; height: 40px; line-height: 42px;}
			.btn_blue01 a span			{ background: url(../../img/union/img_icon_arrow_blue01.png) no-repeat right center; padding: 0px 40px 0px 20px; margin-right: 17px; width: 172px; box-sizing: border-box;}

			/* font
			----------------------------------------------------------- */
			/* font-size: 15px; */
			#mainTxt h2,
			#missionCont h2,
			#businessCont h2,
			#companyCont h2,
			#newsCont h2
								{ font-size: 2.6rem;} /* 47px */
			#missionCont h3
								{ font-size: 2.2rem;} /* 36px */
			#businessCont h3
								{ font-size: 1.8rem;} /* 36px */

			#companyCont h3 span 
								{ font-size: 2.2rem;} /* 36px 相対 */
			#companyCont h3
								{ font-size: 1.8rem;} /* 22px */
			#mainTxt p
								{ font-size: 1.2rem;} /* 16px */
			#missionCont p,
			#companyCont p,
			ul.footernav li		{ font-size: 1.4rem;} /* 14px */
			.address address
								{ font-size: 1.2rem;} /* 14px */
			#businessCont p,
			#newsCont a dt span.cate,
			.btn_gray01,
			.btn_blue01
								{ font-size: 1.3rem;} /* 13px */
			#businessCont a div	
								{ font-size: 1.3rem;} /* 12px */

			#mainTxt h2,
			#missionCont h2,
			#businessCont h2,
			#companyCont h2,
			#companyCont h3 span
								{ font-family: 'Oswald', sans-serif; font-weight: normal;}

			#businessCont a div	
								{ letter-spacing: -0.02em;}
	
}