@charset "utf-8";
/* ******************************************************************
 *	File name		: base.css
 *	Summary			: css base
 * ******************************************************************
 */
/* ----------------------------------------------------------------- */
/*	base                                                             */
/* ----------------------------------------------------------------- */
/*

#1C499E rgba(28,73,158,0.5)

*/

/*-----------------------------------
  body
-----------------------------------*/
*{

}
body{
	position:relative;
	width:100%;
	height:100%;
	line-height:145%;
	background:#FFF;
	color:#222;
	}
	#wrapper{
		position:relative;
		width:100%;
		text-align:center;
		background:#FFF;
}
/* --- responsive --- */
@media only screen and (max-width:767px){
	#wrapper{
		padding-top:60px;
		overflow:hidden;
	}
}

/*-----------------------------------
  header
-----------------------------------*/

header{
	display:block;
	position:relative;
	width:100%;
	height:124px;
	padding:62px;
	background:#166790;
	text-align:center;
	z-index:255;
	}
	header p{
		position:absolute;
		top:30px;
		left:0px;
		width:100%;
		height:32px;
		margin:0px !important;
		padding:0px !important;
		font-size:0.84rem;
		text-align:center;
		color:#FFF;
		z-index:351;
	}
	#head_contents{
		position:relative;
		left:50%;
		width:868px;
		max-width:100%;
		height:105px;
		margin:0 0 0 -434px;
		text-align:center;
		background:#FFF;
		border-bottom:6px solid #1C499E;
		-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
		-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
		box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
		z-index:50;
		transition-duration:0.5s;
	}
	#head_contents h1{
		display:inline-block;
		position:absolute;
		top:11px;
		left:44px;
		width:125px;
		height:80px;
		z-index:10;
}

header #categoy_nav{
	display:-webkit-flex;
	display:flex;
	justify-content:center;
	align-items:center;
	position:absolute;
	top:25px;
	right:40px;
	width:207px;
	height:55px;
	font-size:0.9rem;
	background:#1C499E;
	color:#FFF;
	cursor:pointer;
	transition-duration:0.5s;
	}
	header #categoy_nav:hover{
		opacity:0.8;
}

/* main_nav */
header #main_nav{
	display:none;
	position:absolute;
	top:105px;
	left:0px;
	width:100%;
	background:#1C499E;
	-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
	overflow-y:scroll;
	z-index:255;
	}
	header #main_nav::-webkit-scrollbar {
		width: 7px;
		margin:-150px 0;
	}
	header #main_nav::-webkit-scrollbar-thumb {
		background: linear-gradient(0deg,#999,#999);
		border-radius: 3px;
	}
	header #main_nav::-webkit-scrollbar-track {
		background: rgba(100,100,100, .5);
	}

	header #main_nav *{
		color:#FFF;
	}
	header #main_nav #nav_title{
		position:relative;
		text-align:center;
		padding:35px 0 0;
	}
	header #main_nav ul{
		display:block;
		position:relative;
		width:100%;
		padding:15px 130px 50px;
		-webkit-overflow-scrolling:touch;
		list-style:none;
		z-index:10;
	}
	header #main_nav li{
		position:relative;
		width:100%;
		height:auto;
		text-align:center;
		transition-duration:0.5s;
		border-bottom:1px solid rgba(255,255,255,0.8);
		}
		header #main_nav li#mn_top{
			display:none;
	}
	header #main_nav li a{
		display:block;
		width:100%;
		height:100%;
		padding:15px 0;
		font-size:1.0rem;
		text-decoration:none;
		transition-duration:0.5s;
		}
		header #main_nav li a:hover{
			background:rgba(255,255,255,0.15);
}

#main_nav_cover{
	display:none;
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.8);
	z-index:40;
}

/* --- responsive --- */
@media only screen and (max-width:1012px){/*868+62+62+20*/
	#head_contents{
		left:0px;
		width:100%;
		margin:0px;
	}
}
@media only screen and (max-width:767px){
	header{
		position:fixed;
		top:0px;
		left:0px;
		width:100%;
		height:60px;
		padding:25px 15px 0;
		}
		header p{
			top:0px;
			height:25px;
			padding:2px 10px !important;
			font-size:0.6rem;
		}
		#head_contents{
			height:60px;
		}
		#head_contents h1{
			left:15px;
			width:62.5px;
			height:40px;
	}

	header #categoy_nav{
		display:block;
		top:0px;
		right:0px;
		width:70px;
		height:60px;
		padding-top:38px;
		font-size:0.60rem;
		text-align:center;
		background:none;
		color:#1C499E;
		cursor:pointer;
		transition-duration:0.5s;
		line-height:1;
		}
		header #categoy_nav:before{
			content:" ";
			display:block;
			position:absolute;
			top:12px;
			right:18px;
			width:30px;
			height:6px;
			border-top:2px solid rgba(28,73,158,1);
			border-bottom:2px solid #1C499E;
			transition-duration:0.5s;
			line-height:1;
		}
		header #categoy_nav:after{
			content:" ";
			display:block;
			position:absolute;
			top:28px;
			right:18px;
			width:30px;
			height:0px;
			border-bottom:2px solid #1C499E;
			transition-duration:0.5s;
			line-height:1;
		}
		/* x にする */
		header.active #categoy_nav:before{
			top:19px;
			right:22px;
			height:6px;
			border-bottom:2px solid rgba(28,73,158,0);
			transform:rotate(45deg);
		}
		header.active #categoy_nav:after{
			top:20px;
			right:20px;
			transform:rotate(-45deg);
	}

	/* main_nav */
	header #main_nav{
		top:60px;
		}
		header #main_nav #nav_title{
			padding:20px 0 0;
		}
		header #main_nav ul{
			padding:15px 10px 20px;
		}
		header #main_nav li{
			position:relative;
			width:100%;
			height:auto;
		}
		header #main_nav li a{
			padding:10px 0;
			font-size:0.87rem;
	}
}

/* -----------------------------------------------------------------------------------------
  h_slide
-----------------------------------------------------------------------------------------*/

header.h_slide #head_contents{
	position: fixed !important;
	top:0px;
	left:0px;
	width:100%;
	height:105px;
	margin:0px;
	background:rgba(255,255,255,0.95);
	-moz-box-shadow:0px 0px 3px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow:0px 0px 3px 3px rgba(0,0,0,0.2);
	box-shadow:0px 0px 3px 3px rgba(0,0,0,0.2);
}

/*-----------------------------------------------------------------------------------------
  contents_body main_contents
-----------------------------------------------------------------------------------------*/

#pnkz{
	margin:13px 0;
	text-align:left;
	}
	#pnkz a{
		color:#0060B1;
		text-decoration:none;
	}
	#pnkz a:hover{
		text-decoration:underline !important;
}

main{
	display:block;
	position:relative;
	margin:0px !important;
	text-align:left;
}
main section{
	position:relative;
	width:100%;
	margin:0 auto;
	text-align:center;
	}
	main section *{
		z-index:1;
}
main section .contents{
	position:relative;
	width:790px;
	max-width:100%;
	margin:0 auto;
}


/* --- responsive --- */
@media only screen and (max-width:767px){
	main section{
		width:100%;
	}
}

/*---------------------
 contents
---------------------*/

#pageback{
	position:fixed;
	right:20px;
	bottom:-100px;
	width:50px;
	height:50px;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	background:#FFFFFF;
	border:5px solid rgba(28,73,158,1);
	opacity:0.5;
	z-index:101;
	transition-duration:0.5s;
	}
	#pageback:hover{
		opacity:1;
	}
	#pageback:before{
		content:" ";
		position:absolute;
		top:5px;
		left:5px;
		width: 0;
		height: 0;
		margin-top: -16px;
		border:16px solid transparent;
		border-bottom:16px solid rgba(28,73,158,1);
	}
	#pageback:after{
		content:" ";
		position:absolute;
		top:20px;
		left:14px;
		width:13px;
		height:15px;
		background:rgba(28,73,158,1);
		z-index:0;
	}
	#pageback a{
		display:block;
		position:absolute;
		left:-5px;
		top:-5px;
		width:50px;
		height:50px;
		padding:0px;
		font-size:0.8em;
		text-indent:-9999px;
		-moz-border-radius:50%;
		-webkit-border-radius:50%;
		border-radius:50%;
		z-index:1;
		text-decoration:none;
}
#pageback.bottomfix{
	position:absolute;
	bottom:120px;
	transition-duration:0.5s;
}
/* --- responsive --- */
@media only screen and (max-width:767px){
	#pagetop{
		display:none;
	}
}

/*---------------------
  footer
---------------------*/

footer{
	display:block;
	position:relative;
	width:100%;
	min-height:330px;
	text-align:center;
	background:url(../../image/base/footer_bg.png) no-repeat center 0 #FFF;
	z-index:0;
	}
	footer #ft_contents{
		display:-webkit-flex;
		display:flex;
		-webkit-box-pack:justify;
		-ms-flex-pack:justify;
		justify-content:space-between;
		flex-wrap:wrap;
		width:767px;
		height:330px;
		margin:0 auto;
		padding:39px 0 0 0;
		text-align:center;
	}
	footer #ft_contents strong{
		display:block;
		position:relative;
		width:100%;
		height:80px;
		margin:0 auto 10px;
		text-align:center;
		}
		footer #ft_contents > strong img{
			position:relative;
			left:-5px;
			width:126px;
			height:80px;
			margin:0 auto;
	}
	footer #ft_contents > div{
		position:relative;
		width:49%;
		padding-left:20px;
		text-align:left;
	}
	footer #ft_contents > div p{
		position:relative;
		margin:0 0 10px;
		font-size:0.84rem;
		line-height:1.5;
		}
		footer #ft_contents > div p b{
			font-size:1.2rem;
		}
		footer #ft_contents > div p a{
			color:#1C499E;
		}
		footer #ft_contents > div p#ft_tel{
			display:inline-block;
			position:relative;
			min-height:30px;
			padding:0 0 0 27px;
			font-size:0.9rem;
			background:url(../../image/base/ft_tel.png) no-repeat 0 0;
			}
			footer #ft_contents > div p#ft_tel b{
				font-weight:bold;
				font-size:1.1rem;
				color:#1C499E;
			}
			footer #ft_contents > div .banner{
				display: inline-block;
				width: 230px;
				margin: 0 0 12px;
				-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
				-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
				box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
}

footer p#copyright{
	clear:both;
	position:relative;
	margin:0px;
	padding:7px 20px;
	font-size:0.8rem;
	text-align:center;
	background:#1C499E;
	color:#FFF;
}

/* --- responsive --- */
@media only screen and (max-width:767px){
	footer{
		width:100%;
		min-height:330px;
		text-align:center;
		background:#D0DCDB;
		z-index:0;
		}
		footer #ft_contents{
			width:100%;
			height:auto;
			margin:0 auto;
			padding:20px 15px 0;
			text-align:center;
		}
		footer #ft_contents strong{
			margin:0 auto 20px;
		}
		footer #ft_contents > div{
			width:100%;
			margin:0 0 15px;
			padding-left:0px;
			text-align:center;
	}

	footer p#copyright{
		font-size:0.7rem;
	}
}
