@charset "UTF-8";
/*
 * cmn_layout.css
 *
 */


/* !HTML5 elements
---------------------------------------------------------- */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section
{ display: block;}

/* !Reseting
---------------------------------------------------------- */
body {
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3" , "Hiragino Kaku Gothic ProN" , 'メイリオ' ,Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic" , Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: 500;
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
	line-height: 2;
	color: #333;
}

@media screen and (max-width:1039px){
body {
	font-size: 14px;
}
}

body, div, pre, p, blockquote, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, th, td, figure, figcaption
{ margin: 0; padding: 0;}

input, textarea
{ margin: 0; font-size: 100%;}

label
{ cursor: pointer;}

table
{ border-collapse: collapse; border-spacing: 0; font-size: 100%;}

fieldset, img
{ border: 0;}

img
{ max-width: 100%; height: auto; vertical-align: top;}

address, caption, cite, code, dfn, em, th, var
{ font-style: normal; font-weight: normal;}

ol, ul
{ list-style: none;}

caption, th
{ text-align: left;}

h1, h2, h3, h4, h5, h6
{ font-size: 100%; font-weight: normal;}

q:after, q:before
{ content:'';}

a
{ cursor: pointer; }

a, input
{ outline: none; }

input, textarea
{ border-radius: 0; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3" , "Hiragino Kaku Gothic ProN" , 'メイリオ' ,Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic" , Verdana, Arial, Helvetica, sans-serif; }

input[type="button"],input[type="submit"],input[type="reset"]
{ -webkit-appearance: none; background: none; border: none; padding: 0; cursor: pointer;}

abbr, acronym
{ border: 0;}
*
{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}
/* !Clearfix
---------------------------------------------------------- */
.clearfix,
#contents,
.section
{
	display: block;
	min-height: 1%;
}
.clearfix:after,
#contents:after,
.section:after
{
	clear: both;
	content:".";
	display: block;
	height: 0;
	visibility: hidden;
}
* html .clearfix,
* html #contents,
* html .section
{
	height: 1%;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}
/* !Layout
---------------------------------------------------------- */
html { overflow-y: scroll;}
body { text-align: left;}
@media print {
	html,
	html body { *zoom: 0.65;}
}
/* !header
---------------------------------------------------------- */
#headerTop {
	width:100%;
	height:60px;
	background:#F2F2F2;
}
	#headerTop ul {
		width:auto;
		padding-top:13px;
		float:right;
		margin-right:50px;
	}
		#headerTop ul li {
			float:left;
			margin-right:8px;
		}
		#headerTop ul li:last-child {
			margin-right:0;
		}
			#headerTop ul li a {
				display:block;
				height:34px;
				color:#FFF;
				font-size:15px;
				font-weight:bold;
				line-height:34px;
				padding:0 0.8em;
				background:#0073C4;
				border-radius:4px;
				transition: all 0.6s ease;
			}
				#headerTop ul li a:hover,
				#headerTop ul li a.current {
					background:#429E3B;
				}

#headerWrap {
	width:100%;
	height:70px;
	margin:0 auto;
	background:#FFF;
	/*box-shadow: 0px 3px 3px rgba(0,0,0,0.06);*/
	z-index:90;
}
#header {
	background: rgba(255,255,255,1);
	width: 25%;
	height:70px;
	z-index: 100;
	float:left;
}
	#header h1#headerLogo a,
	#header p#headerLogo a {
		display:block;
		width:142px;
		height:36px;
		margin:17px 0 0 50px;
	}
	#header h1#headerLogo a img,
	#header p#headerLogo a img {
		display:block;
		width:142px;
		height:36px;
	}
	#header img.hapLogo3 {
		display:none;
	}

#sidebar {
	width: 75%;
	height: 70px;
	color: #333;
	background: rgba(255,255,255,1);
	text-align: center;
	z-index: 300;
	float:right;
	position:relative;
	right:50px;
}

#global-nav ul {
	width:auto;
	list-style: none;
	float:right;
	padding-top:13px;
}
	#global-nav ul li {
		display:block;
		float:left;
		margin:0 17px 0 0;
	}
		#global-nav ul li.last {
			margin-right:0;
		}
			#global-nav ul li.hMenu {
				display:none;
			}
			#global-nav ul li.norm a {
				display:block;
				height:44px;
				line-height:44px;
				font-weight:700;
				text-decoration: none;
				color: #333;
				display: block;
				position: relative;
				padding-right:17px;
				transition: all 0.6s ease;
			}
			#global-nav ul li.last a {
				padding-right:0;
			}
				#global-nav ul li.norm a:after {
					position:absolute;
					content:"";
					width:1px;
					height:16px;
					background:#C4C4C4;
					top:14px;
					right:0;
				}
				#global-nav ul li.last a:after {
					display:none;
				}
				#global-nav ul li.norm a:hover {
					color:#0073C4;
				}
				#global-nav ul li.norm a.current {
					color:#0073C4;
				}

.is-fixed {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
}

a#panel-btn {
	display: none;
}

@media screen and (max-width:1099px){
	#global-nav ul li {
		margin:0 14px 0 0;
	}
			#global-nav ul li.norm a {
				padding-right:14px;
			}
			#global-nav ul li.last a {
				padding-right:0;
			}
}

@media screen and (max-width:1039px){
#headerTop {
	display:none;
}

#headerWrap {
	height:60px;
}
#header {
	width: 100%;
	height:60px;
	position:fixed;
}
	#header h1#headerLogo a,
	#header p#headerLogo a {
		width:142px;
		height:36px;
		margin:12px 0 0 30px;
	}
	#header h1#headerLogo a img,
	#header p#headerLogo a img {
		width:142px;
		height:36px;
	}

#sidebar {
		/*display: none;*/
		padding-top: 120px;
		position: fixed;
		right: -100%;
		top: 0;
		height: 100%;
		width: 100%;
		background: rgba(240,240,240,1);
		-webkit-transition: .35s ease-in-out;
		transition: .35s ease-in-out;
	}
#global-nav ul {
	position:inherit;
	width:100%;
	height:auto;
}
	#global-nav ul li {
		width:100%;
		max-width:400px;
		float:none;
		margin:0 auto;
	}
	#global-nav ul li.last {
		margin-right:auto;
	}
	#global-nav ul li.norm a {
		width:100%;
		padding: 0;
		height:44px;
		line-height:44px;
		text-align:center;
		font-size:16px;
		color:#333;
		letter-spacing:0.1em;
		margin-bottom:10px;
	}
		#global-nav ul li.norm a:hover {
			color:#333;
		}
		#global-nav ul li.norm a.current {
			color:#0073C4;
		}
		#global-nav ul li.norm a:after {
			display:none;
		}
	#global-nav ul li.hMenu {
		display:block;
		margin-top:20px;
	}
		#global-nav ul li.hMenu a {
			display:block;
			width:100%;
			height:44px;
			line-height:44px;
			text-align:center;
			font-size:16px;
			font-weight:bold;
			color:#FFF;
			letter-spacing:0.1em;
			background:#0073C4;
			border-radius:4px;
		}

	/* nav open */
	.open {
		overflow: hidden;
	}
	.open #overlay {
		display: block;
	}
	.open #sidebar  {
		-webkit-transform: translate3d(-100%,0,0);
		transform: translate3d(-100%,0,0);
	}


a#panel-btn {
width: 40px;
height: 40px;
display: block;
float:right;
position:fixed;
top:10px;
right:20px;
z-index:400;
}

#panel-btn{
  display: inline-block;
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #429E3B;
}
#panel-btn:hover{
  background: #429E3B;
}
#panel-btn-icon{
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 2px;
  margin: -1px 0 0 -10px;
  background: #FFF;
  transition: .2s;
}
#panel-btn-icon:before, #panel-btn-icon:after{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 20px;
  height: 2px;
  background:#FFF;
  transition: .3s;
}
#panel-btn-icon:before{
  margin-top: -6px;
}
#panel-btn-icon:after{
  margin-top: 4px;
}
#panel-btn .close{
  background: transparent;
}
#panel-btn .close:before, #panel-btn .close:after{
  margin-top: 0;
}
#panel-btn .close:before{
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
#panel-btn .close:after{
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

	/* z-index */
	#sidebar {
		z-index: 300;
	}
	#panel-btn {
		z-index: 400;
	}
}

@media screen and (max-width:767px){
	#header img.hapLogo3 {
		display:block;
		position:absolute;
		width:72px;
		top:3px;
		left:194px;
	}
	#sidebar {
		/*display: none;*/
		padding-top: 50px;
		position: fixed;
		right: -100%;
		top: 0;
		height: 100%;
		width: 100%;
	}
	#global-nav ul li {
		width:80%;
		max-width:400px;
		margin:0 auto;
	}
	#global-nav ul li.norm a {
		font-size:14px;
		margin-bottom:3px;
	}
	#global-nav ul li.hMenu {
		margin-top:10px;
	}
		#global-nav ul li.hMenu a {
			font-size:14px;
		}
}

@media screen and (max-width:360px){
	#sidebar {
		padding-top: 30px;
	}
	#global-nav ul li.norm a {
		margin-bottom:0px;
	}
}
/* !pageTop
---------------------------------------------------------- */
.pagetop {
	display: none;
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index:10;
}
	.pagetop a:link,
	.pagetop a:visited{
		display: block;
		width: 50px;
		height: 50px;
		background-color: #429E3B;
		text-align: center;
		color: #fff;
		font-size: 20px;
		text-decoration: none;
		line-height: 46px;
		border-radius:50%;
		transition: all 0.2s ease;
	}

	.pagetop a:hover{
		color:#FFF;
		line-height: 40px;
	}

@media screen and (max-width:1039px){
.pagetop {
	bottom: 20px;
	right: 20px;
}
	.pagetop a:link,
	.pagetop a:visited{
		display: block;
		width: 50px;
		height: 50px;
		background-color: #429E3B;
		text-align: center;
		color: #fff;
		font-size: 20px;
		text-decoration: none;
		line-height: 46px;
		transition: none;
	}
}

@media screen and (max-width:767px){
.pagetop {
	bottom: 40px;
	right: 10px;
}
}

/* !footer
---------------------------------------------------------- */
#footer {
	width: 100%;
	background:#FFF;
	overflow:hidden;
}
#footerTop {
	width:100%;
	height:60px;
	background:#0073C4;
}
	#footerTop ul.footerLinks {
		text-align:center;
	}
		#footerTop ul.footerLinks li {
			display:inline;
			font-size:12px;
			font-weight:bold;
			line-height:60px;
			margin-right:18px;
		}
			#footerTop ul.footerLinks li:last-child {
				margin-right:0;
			}
			#footerTop ul.footerLinks li a {
				color:#FFF;
				transition: all 0.5s ease;
			}
				#footerTop ul.footerLinks li a:hover {
					opacity:.6;
				}
#footerBtm {
	width:auto;
	padding:30px 20px 40px 20px;
}
	#footerBtm ul.footerLinks2 {
		text-align:center;
		margin-bottom:30px;
	}
		#footerBtm ul.footerLinks2 li {
			display:inline;
			font-size:14px;
			font-weight:bold;
			margin-right:25px;
		}
			#footerBtm ul.footerLinks2 li.pdf {
				position:relative;
				padding-left:20px;
			}
			#footerBtm ul.footerLinks2 li.pdf:before {
				position:absolute;
				display:inline-block;
				font-family: "FontAwesome";
				font-weight:normal;
				content:"\f1c1";
				top:-6px;
				left:0;
			}
			#footerBtm ul.footerLinks2 li:last-child {
				margin-right:0;
			}
			#footerBtm ul.footerLinks2 li a {
				transition: all 0.5s ease;
			}
				#footerBtm ul.footerLinks2 li a:hover {
					opacity:.6;
				}
	#footerBtm p.footerLogo a {
		display:block;
		width:142px;
		height:36px;
		margin:0 auto 20px auto;
	}
		#footerBtm p.footerLogo a img {
			display:block;
			width:142px;
			height:36px;
		}
		#footerBtm p.add {
			font-size:14px;
			text-align:center;
			margin-bottom:5px;
		}
		#footerBtm p.tel {
			font-weight:700;
			font-size:20px;
			color:#333;
			text-align:center;
			letter-spacing:0.08em;
			margin-bottom:30px;
		}
			#footerBtm p.tel i.fa {
				display:inline-block;
				margin-right:0.4em;
				font-size:26px;
				vertical-align:middle;
			}
			#footerBtm p.tel a {
				color:#333;
			}
		#footer p.copyright {
			font-size:12px;
			text-align:center;
			color:#666;
			letter-spacing:0.06em;
		}

@media screen and (max-width:1039px){
	#footerTop {
		width:100%;
		height:auto;
		background:none;
	}
	#footerTop ul.footerLinks {
		text-align:center;
	}
		#footerTop ul.footerLinks li {
			display:block;
			margin-right:0;
		}
			#footerBtm ul.footerLinks2 li.pdf {
				position:relative;
				padding-left:0;
			}
			#footerBtm ul.footerLinks2 li.pdf:before {
				display:none;
			}
			#footerTop ul.footerLinks li a {
				display:block;
				height:48px;
				line-height:48px;
				color:#FFF;
				transition: none;
				background:#0073C4;
				border-bottom:1px solid #338FD0;
			}
				#footerTop ul.footerLinks li a:hover {
					opacity:1;
				}
#footerBtm {
	width:auto;
	padding:0;
	margin-bottom:25px;
}
	#footerBtm ul.footerLinks2 {
		text-align:center;
		margin-bottom:40px;
	}
		#footerBtm ul.footerLinks2 li {
			display:block;
			margin-right:0;
		}
			#footerBtm ul.footerLinks2 li:first-child {

			}
			#footerBtm ul.footerLinks2 li a {
				display:block;
				height:48px;
				line-height:48px;
				color:#333;
				transition: none;
				background:#ECECEC;
				border-bottom:1px solid #DEDEDE;
			}
				#footerBtm ul.footerLinks2 li a:hover {
					opacity:1;
				}
	#footerBtm ul.group {
		margin-bottom:30px;
	}
		#footerBtm ul.group li {
			display:block;
			margin:0 0 10px 0;
		}
			#footerBtm ul.group li:last-child {
				margin:0;
			}
	#footerBtm p.footerLogo a {
		width:130px;
		height:33px;
	}
		#footerBtm p.footerLogo a img {
			width:130px;
			height:33px;
		}
		#footerBtm p.add {

		}
		#footerBtm p.tel {
			font-size:18px;
			margin-bottom:25px;
		}
			#footerBtm p.tel i.fa {
				font-size:22px;
			}
		#footer p.copyright {
			color:#666;
		}
}

@media screen and (max-width:767px){
	#footerBtm ul.footerLinks2 {
		margin-bottom:40px;
	}
}
