@charset "utf-8";
/* ******************************************************************
 *	File name		: base.css
 *	Summary			: css base
 * ******************************************************************
 */
/* ----------------------------------------------------------------- */
/*	base                                                             */
/* ----------------------------------------------------------------- */
/*

orange
#2C436F rgba(44,67,111,0.5)

*/

/*-----------------------------------
  body
-----------------------------------*/
body{
	position:relative;
	width:100%;
	height:100%;
	line-height:145%;
	background:#2C436F;
	color:#FFF;
	}
	body:after{
		content:" ";
		display:block;
		position:absolute;
		top:0px;
		left:0px;
		width:100%;
		height:550px;
		padding:0 0 0 55px;
		background:url(../../image/base/bg_set.png) no-repeat center -80px;
		z-index:3;
		opacity:1;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	/* --- responsive --- */
	@media only screen and (max-width:767px){
		body:after{
			top:60px;
			background:url(../../image/base/bg_set.png) no-repeat center 0px;
			background-size:contain;
		}
	}

	#wrapper{
		position:relative;
		width:100%;
		text-align:center;
		background:#FFF;
		color:#222;
		overflow:hidden;
		line-height:145%;
	}
	#wrapper:before{
		content:" ";
		position:absolute;
		top:0px;
		left:50%;
		width:1920px;
		height:100%;
		margin:0 0 0 -960px;
		background:url(../../image/base/bg.jpg) no-repeat center top #FFF;
		background-size:cover;
		z-index:0;
	}
	#wrapper:after{
		content:" ";
		position:absolute;
		bottom:0px;
		left:0px;
		width:100%;
		height:380px;
		background:linear-gradient(-180deg, rgba(142,208,234,0), rgba(142,208,234,0.5));
		z-index:1;
}
/* --- responsive --- */
@media only screen and (max-width:767px){
	#wrapper{
		padding-top:90px;
	}
	#wrapper:before{
		top:-100px;
		left:50%;
		width:768px;
		margin:0 0 0 -384px;
		background:url(../../image/base/bg.jpg) no-repeat center top #FFF;
		background-size:contain;
		z-index:0;
	}
}
@media only screen and (min-width:1920px){
	#wrapper:before{
		width:100%;
		left:0px;
		margin:0px;
	}
}

/*-----------------------------------
  header
-----------------------------------*/

header *{
	transition-duration:0.5s;
}
header{
	display:block;
	position:relative;
	width:100%;
	height:180px;
	z-index:100;
}
#head_contents{
	position:relative;
	width:1000px;
	height:100%;
	margin:0 auto;
	padding:0 10px;
	text-align:center;
	z-index:11;
	transition-duration:0s;
	}
	#head_contents h1{
		display:block;
		position:absolute;
		top:6px;
		left:12px;
		width:510px;
		height:80px;
		z-index:10;
}

/* main_nav */
header #main_nav{
	position:absolute;
	top:110px;
	left:10px;
	width:calc(100% - 20px);
	height:60px;
	margin:0 auto;
	list-style:none;
	z-index:20;
	}
	header #main_nav > ul{
		display:-webkit-flex;
		display:flex;
		-webkit-box-pack:justify;
		-ms-flex-pack:justify;
		justify-content:space-between;
		flex-wrap:wrap;
		list-style:none;
		position:relative;
		height:60px;
		-webkit-overflow-scrolling:touch;
	}
	header #main_nav > ul > li {
		position:relative;
		width:16%;
		height:100%;
		text-align:center;
		background:rgba(255,255,255,0.8);
		-moz-box-shadow: 0px 0px 5px rgba(0,137,180,0.6);
		-webkit-box-shadow: 0px 0px 5px rgba(0,137,180,0.6);
		box-shadow: 0px 0px 5px rgba(0,137,180,0.6);
		}
		header #main_nav li#mn_top{
			display:none;
		}
		header #main_nav > ul > li:nth-child(2){width:19%;}
		header #main_nav > ul > li:nth-child(3){width:26%;}
		header #main_nav > ul > li:nth-child(4){width:26%;}
		header #main_nav > ul > li:nth-child(5){width:26%;}

	header #main_nav > ul > li > a{
		display:-webkit-flex;
		display:flex;
		justify-content:center;
		align-items:center;
		position:relative;
		width:100%;
		height:100%;
		padding:5px;
		font-weight:600;
		font-family: 'Noto Serif JP', serif;
		font-size:0.95rem;
		text-align:center;
		text-decoration:none;
		line-height:1.25;
		color:#000;
	}
	header #main_nav > ul > li.active a,
	header #main_nav > ul > li:hover a{
		text-decoration:none;
		background:#2C436F;
		color:#FFF;
	}
	header #main_nav > ul > li.sub_nav ul{
		position:relative;
		list-style:none;
		height:auto !important;
	}
	header #main_nav > ul > li.sub_nav ul li{
		position:relative;
		height:0px;
		overflow:hidden;
		background:#000;
		border:none !important;
		}
		header #main_nav > ul > li.sub_nav:hover ul li{
			height:50px;
			color:#FFF;
	}
	header #main_nav > ul > li.sub_nav ul li a{
		display:-webkit-flex;
		display:flex;
		justify-content:flex-start;
		align-items:center;
		position:relative;
		width:100%;
		height:100%;
		padding:0px 5px 0px 50px;
		font-weight:500;
		font-size:0.80rem;
		text-align:left;
		text-decoration:none;
		line-height:1.25;
		border-top:1px solid rgba(255,255,255,0.2);
		color:#FFF;
		}
		header #main_nav > ul > li.sub_nav ul li a:hover{
			background:#1B2945;
	}
	header #main_nav > ul > li.sub_nav ul li a span{
		display:inline-block;
		position:absolute;
		top:10px;
		left:10px;
		width:30px;
		height:30px;
		padding:5px;
		background:rgba(255,255,255,0.9);
		-moz-border-radius:4px;
		-webkit-border-radius:4px;
		border-radius:4px;
}

/* link mn_langurage */
header #main_nav li#mn_link,
header #main_nav li#mn_langurage{
	position:absolute;
	top:-110px;
	}
	header #main_nav li#mn_link a,
	header #main_nav li#mn_langurage a{
		padding:10px 0 0 0;
		font-weight:bold;
		font-family:'Noto Sans', 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
		font-size:0.8rem;
		color:#FFF;
	}
	header #main_nav li#mn_link a:hover,
	header #main_nav li#mn_langurage a:hover{
		background:#2BB9E7;
}
/* link */
header #main_nav li#mn_link{
	right:95px;
	width:67px;
	height:40px;
	background:#0089B4;
}
/* mn_langurage */
header #main_nav li#mn_langurage{
	right:0px;
	width:85px;
	height:40px;
	background:#2C436F;
	-moz-border-radius:0 0 20px 0;
	-webkit-border-radius:0 0 20px 0;
	border-radius:0 0 20px 0;
	}
	header #main_nav li#mn_langurage a{
		-moz-border-radius:0 0 20px 0;
		-webkit-border-radius:0 0 20px 0;
		border-radius:0 0 20px 0;
}

/* --- responsive --- */
@media only screen and (max-width:767px){
	header{
		display:none;
	}
}

/* -----------------------------------------------------------------
   h_slide
----------------------------------------------------------------- */

header.h_slide{
	}
	header.h_slide #head_contents{
		position: fixed !important;
		top:0px;
		left:0px;
		width:100%;
		height:70px;
		background:#E9ECF0;
		background:rgba(227,231,236,0.9);
		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);
	}
	header.h_slide h1{
		top:10px !important;
		left:10px !important;
		width:320px !important;
		height:50px !important;
}
header.h_slide #main_nav{
	position:absolute;
	top:10px;
	left:350px;
	width:calc(100% - 360px);
	height:50px;
	}
	header.h_slide #main_nav ul{
		height:50px;
	}
	header.h_slide #main_nav li {
		background:rgba(255,255,255,0.8);
		border:1px solid rgba(44,67,111,0.3);
		-moz-box-shadow:none;
		-webkit-box-shadow:none;
		box-shadow:none;
	}
	header.h_slide #main_nav li a{
		font-size:0.8rem;
	}
	/* link mn_langurage */
	header.h_slide #main_nav li#mn_link,
	header.h_slide #main_nav li#mn_langurage{
		display:none;
}

/* --- responsive --- */
@media only screen and (max-width:1100px){
	header.h_slide #main_nav li a{
		font-size:0.7rem;
	}
}
@media only screen and (max-width:1030px){
	header.h_slide h1{
		top:15px !important;
		width:256px !important;
		height:40px !important;
	}
	header.h_slide #main_nav{
		left:280px;
		width:calc(100% - 290px);
		height:50px;
	}
}
@media only screen and (max-width:960px){
	header.h_slide #main_nav li a{
		line-height:1.25;
	}
	header.h_slide #main_nav li a br{
		display:none;
	}
}
/*-----------------------------------------------------------------------------------------
  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;
	z-index:10;
}
/* --- responsive --- */
@media only screen and (max-width:767px){
	main{
		padding: 0 10px;
	}
}

#main_contents{
	position:relative;
	min-height:350px;
	z-index:10;
}
/*-----------------------------------
  side_nav
-----------------------------------*/
#side_nav{}

/*---------------------
 contents
---------------------*/

#pageback{
	position:fixed;
	right:20px;
	bottom:-100px;
	width:50px;
	height:50px;
	-moz-border-radius:50%;
	-webkit-border-radius:50%;
	border-radius:50%;
	background:#FFFFFF;
	border:5px solid rgba(44,67,111,1);
	opacity:0.5;
	z-index:101;
	transition-duration:0.5s;
	}
	#pageback:hover{
		opacity:1;
	}
	#pageback:before{
		content:" ";
		position:absolute;
		top:5px;
		left:6px;
		width: 0;
		height: 0;
		margin-top: -15px;
		border:15px solid transparent;
		border-bottom:15px solid rgba(44,67,111,1);
	}
	#pageback:after{
		content:" ";
		position:absolute;
		top:20px;
		left:15px;
		width:13px;
		height:15px;
		background:rgba(44,67,111,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:1020px;
	max-width:100%;
	margin:0 auto;
	padding:20px 10px 40px;
	text-align:center;
	background:#2C436F;
	color:#FFF;
	}
	footer p#copyright{
		display:inline-block;
		position:absolute;
		top:20px;
		left:10px;
		margin:0px;
		font-family: 'Noto Serif JP', serif;
		font-weight:normal;
		font-size:0.75rem;
		text-align:left;
		color:#FFF;
	}
	footer address{
		display:block;
		width:100%;
		text-align:right;
		}
		footer address p{
			margin:0 0 10px;
			font-weight:normal !important;
			font-size:0.85rem;
			line-height:1.5;
}
/* --- responsive --- */
@media only screen and (max-width:767px){
	footer{
		width:100%;
		padding:20px;
	}
	footer address{
		margin:0 0 20px;
		text-align:center;
		}
		footer address p{
			text-align:center;
			font-size:0.75rem;
	}
	footer p#copyright{
		position:relative;
		top:0px;
		left:0px;
		text-align:center;
		font-size:0.7rem;
	}
}