/* ******************************************************************
 *	File name		: base.css
 *	Summary			: css base
 * ******************************************************************
 */
/*

#397C8F
rgb(57,124,143)

*/

/* -----------------------------------------------------------------
   base
----------------------------------------------------------------- */

body{
	position:relative;
	width:100%;
	height:100%;
	line-height:145%;
	color:#222;
	}
	#wrapper{
		position:relative;
		width:100%;
}

/* --- responsive --- */
@media print {
	body{
		margin:0;
		width:1100px;
	}
}

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

header{
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	height:120px;
	margin:0 0 40px;
	z-index:50;
	background:#F5A747;
	}
	header::after{
		content:" ";
		position:absolute;
		bottom:0px;
		left:0px;
		width:100%;
		height:50px;
		z-index:0;
	}
	#head_contents{
		position:relative;
		width:1000px;
		max-width:100%;
		height:100%;
		margin:0 auto;
		padding:0px 0 0 0;
		text-align:center;
		z-index:1;
	}
	header h1{
		display:-webkit-flex;
		display:flex;
		justify-content:center;
		align-items:center;
		position:absolute;
		top:17px;
		left:20px;
		z-index:2;
		transition-duration:0.5s;
		}
		header h1 a{
			width:100%;
			height:auto;
			font-family:'Noto Sans', 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
			font-weight:bold;
			font-size:1.9rem;
			text-decoration:none;
			color:#000;
		}
		header h1 a:hover{
			text-decoration:none;
		}
		header h1 img{
			width:200px;
}

/* nav */
header nav{
	position:absolute;
	bottom:-30px;
	left:0px;
	width:100%;
	height:55px;
	transition-duration:1.0s;
	z-index:1000;
}
header nav ul{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	position:relative;
	width:1000px;
	max-width:calc(100% - 2px);
	height:100%;
	margin:0 auto;
	padding:0 40px;
	list-style:none;
	background:#389AD6;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	}
	header nav ul li{
		position:relative;
		width:100%;
		height:100%;
		text-align:center;
		color:#000;
		transition-duration:0.5s;
		}
		header nav ul li::before,
		header nav ul li::after{
			content:" ";
			position:absolute;
			top:calc(50% - 7px);
			width:1px;
			height:15px;
			background:#FFF;
			z-index:0;
		}
		header nav ul li::before{
			left:0px;
		}
		header nav ul li::after{
			right:-1px;
	}
	header nav ul li a{
		display:-webkit-flex;
		display:flex;
		justify-content:center;
		align-items:center;
		position:relative;
		width:calc(100% - 14px);
		height:100%;
		padding:0px;
		margin:0 auto;
		font-weight:bold;
		font-size:1.0rem;
		text-decoration:none;
		text-align:left;
		color:#FFF;
		z-index:10;
		transition-duration:0.5s;
	}
	header nav ul li.active a,
	header nav ul li a:hover{
		text-decoration:none;
		background:rgba(0,0,0,0.2);
	}

/* other li */
header nav ul li#nav_top{
	display:none;
}

/* mn_contact mn_lang */
header nav ul li#mn_contact,
header nav ul li#mn_link{
	position:absolute;
	top:-90px;
	width:84px;
	height:auto;
	}
	header nav ul li#mn_contact{
		right:100px;
	}
	header nav ul li#mn_link{
		right:0px;
	}
	header nav ul li#mn_contact::before,
	header nav ul li#mn_link::before,
	header nav ul li#mn_contact::after,
	header nav ul li#mn_link::after{
		display:none;
	}
	header nav ul li#mn_contact a,
	header nav ul li#mn_link a{
		display:inline-block;
		height:auto;
		padding:0 0 5px;
		font-weight:500;
		font-size:0.90rem;
		text-align:center;
		border-bottom:1px solid #FFF;
		color:#000;
		}
		header nav ul li#mn_contact a:hover,
		header nav ul li#mn_link a:hover{
			text-decoration:none;
			background:rgba(0,0,0,0.1);
}

/* --- responsive --- */
@media screen and (max-width:1000px){
}

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

header.h_slide{
		position: fixed !important;
		top:0px;
		left:0px;
		width:100%;
		height:70px;
		-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);
		background:#F5A747;
	}
	header.h_slide #head_contents{
	}
	header.h_slide h1{
		top:5px !important;
		left:0px !important;
		width:260px;
		height:60px;
	}
	header.h_slide h1 + p{/*
		display:block;
		position:absolute;
		top:10px;
		left:220px;
		width:calc(100% - 220px);
		font-size:0.6rem;
		text-align:left;
		color:#FFF;
		line-height:1.3;
		z-index:2;*/
		display:none;
	}
	header.h_slide h1 + p br{
		display:none;
}
header.h_slide nav{
	position:absolute;
	top:15px;
	left:auto;
	right:20px;
	width:auto;
	max-width:calc(100% - 290px);
	height:40px;
	}
	header.h_slide nav ul{
		justify-content:flex-end;
		position:relative;
		width:100%;
		margin:0 auto;
		padding:0 20px;
		list-style:none;
	}
	header.h_slide nav li{
		position:relative;
		width:auto;
		height:100%;
	}
	header.h_slide nav li a{
		width:auto;
		min-width:80px;
		padding:0 7px;
		font-size:0.84rem;
	}
	header.h_slide nav ul li:nth-child(5) a{
		padding:0 10px;
		letter-spacing:0px;
}

/* mn_contact mn_lang */
header.h_slide nav ul li#mn_link,
header.h_slide nav ul li#mn_contact{
	position:relative;
	width:auto;
	height:100%;
	top:auto;
	right:auto;
	background:none;
	}
	header.h_slide nav ul li#mn_link::before,
	header.h_slide nav ul li#mn_link::after,
	header.h_slide nav ul li#mn_contact::before,
	header.h_slide nav ul li#mn_contact::after{
		display:block;
	}
	header.h_slide nav ul li#mn_link a,
	header.h_slide nav ul li#mn_contact a{
		display:-webkit-flex;
		display:flex;
		justify-content:center;
		align-items:center;
		position:relative;
		width:auto;
		min-width:80px;
		height:100%;
		padding:0 7px;
		font-weight:bold;
		font-size:0.84rem;
		border-bottom:none;
		color:#FFF;
	}
	header.h_slide nav ul li#mn_link a::after,
	header.h_slide nav ul li#mn_contact a::after{
		display:none;
	}
	header.h_slide nav ul li#mn_link a:hover,
	header.h_slide nav ul li#mn_contact a:hover{
		color:#FFF;
		background:rgba(0,0,0,0.4);
}

/* --- responsive --- */
@media only screen and (max-width:1200px){
	header.h_slide nav li a{
		font-size:0.77rem !important;
	}
}


/* -----------------------------------------------------------------
   nav icon
----------------------------------------------------------------- */

#nav_icon{
	display:none;
	position:fixed;
	top:12px;
	right:20px;
	width:36px;
	height:36px;
	background:rgba(0,0,0,0.2);
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	cursor:pointer;
	z-index:1000;
	}
	#nav_icon::before,
	#nav_icon::after{
		content:" ";
		position:absolute;
		left:4px;
		width:29px;
		height:4px;
		background:#FFF;
		transition-duration:0.5s;
	}
	#nav_icon::before{
		top:7px;
	}
	#nav_icon::after{
		top:25px;
	}
	#nav_icon span{
		position:absolute;
		top:16px;
		left:4px;
		width:29px;
		height:4px;
		background:#FFF;
		transition-duration:0.5s;
}

/* sp open menu */
.open_menu #nav_icon::before,
.open_menu #nav_icon::after{
		left:4px;
	}
	.open_menu #nav_icon::before{
		top:16px;
		transform:rotate(-135deg) !important;
	}
	.open_menu #nav_icon::after{
		top:16px;
		transform:rotate(135deg) !important;
	}
	.open_menu #nav_icon span{
		left:50%;
		width:0px;
}

/* -----------------------------------------------------------------
   SP MENU
----------------------------------------------------------------- */
/* --- responsive --- */
@media only screen and (max-width:1000px){
	header{
		position:fixed;
		height:60px;
/*		background:#FFF;*/
		background:#F5A747;
		overflow:hidden;
		z-index:999;
	}
	header #head_contents{
		height:60px;
		background:#F5A747;
		-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);
	}
	header h1{
		display:block;
		position:absolute;
		top:18px;
		left:10px;
		width:200px;
		height:30px;
		text-align:center;
		z-index:2;
	}
	header #main_nav{
		position:fixed;
		top:60px;
		bottom:auto;
		left:auto;
		right:-100%;
		width:100%;
		height:calc(100% - 60px);
		background:rgba(255,255,255,0.95);
		border-top:1px solid #555;
		border-left:30px solid #555;
		transition-duration:0.5s;
		overflow-y:scroll;
		z-index:999;
		}
		header.open_menu #main_nav{
			right:0px;
	}
	header #main_nav::before{
		content:"MENU";
		display:-webkit-flex;
		display:flex;
		justify-content:flex-start;
		align-items:center;
		position:fixed;
		left:-30px;
		top:100px;/* 30 + 50 */
		width:300px;
		height:30px;
		padding-bottom:2px;
		text-indent:-50px;
		color:rgba(255,255,255,0.5);
		transform:rotate(90deg) !important;
		transform-origin:0 100%;
		transition-duration:0.5s;
		line-height:1;
		z-index:999;
		}
		header.open_menu #main_nav::before{
			left:0px;
	}
	header nav{
		position:relative;
		height:auto;
		padding:20px;
	}
	header nav > ul{
		display:block;
		height:auto !important;
		padding:20px 20px 20px;
		background:#F5A747;
	}
	header nav > ul > li{
		position:relative !important;
		top:0px !important;
		left:auto !important;
		right:auto !important;
		width:100% !important;
		height:40px !important;
		min-height:40px !important;
		margin:0 0 5px !important;
		text-align:center;
		color:#000;
		transition-duration:0.5s;
		background:rgba(0,0,0,0.7) !important;
		-moz-border-radius:6px !important;
		-webkit-border-radius:6px !important;
		border-radius:6px !important;
		overflow:hidden;
	}
	header nav > ul > li:has(ul){
		height:auto !important;
		padding-top:7px;
	}
	header nav > ul > li::before,
	header nav > ul > li::after{
		display:none;
	}
	header nav ul li#nav_top{
		display:block;
	}
	header nav > ul > li.active,
	header nav > ul > li:hover{
		background:#2EA7E0;
	}
	header nav ul li a{
		display:-webkit-flex !important;
		display:flex !important;
		justify-content:center !important;
		align-items:center !important;
		position:relative !important;
		width:100% !important;
		height:100% !important;
		padding:0px !important;
		font-weight:normal !important;
		font-size:0.95rem !important;
		text-decoration:none;
		text-align:left;
		color:#FFF !important;
		border:none !important;
		z-index:10;
		}
	header nav ul li a::before{
		display:none;
	}

/* ul ul */
header nav > ul > li > ul{
	position:relative;
	top:0px;
	left:0px;
	width:calc(100% - 40px);
	}
	header nav > ul > li > ul > li{
		height:auto !important;
		margin:7px 0 7px;
		border-bottom:none !important;
		-moz-border-radius:6px !important;
		-webkit-border-radius:6px !important;
		border-radius:6px !important;
		}
		header nav > ul > li > ul > li > a{
			padding:2px 7px !important;
			font-weight:normal !important;
			font-size:0.80rem !important;
}

header nav > ul > li > ul > li{
	height:30px;
	border-bottom:1px solid rgba(255,255,255,0.5);
}

#nav_icon{
	display:block;
}
#sns_icon{
	display:none;
}
}
/* -----------------------------------------------------------------
   main
----------------------------------------------------------------- */

main{
	display:block;
	position:relative;
	margin-top:0px;
	padding:0px;
	width:100%;
	z-index:1;
}
#main_contents{
	position:relative;
}

section{
	position:relative;
	width:1000px;
	max-width:100%;
	margin:0 auto;
}
.contents{
	position:relative;
	width:1000px;
	max-width:100%;
	margin:0 auto 40px;
}

/* --- responsive --- */
@media screen and (max-width:1000px){
	#main_contents{
		padding:0 20px;
	}
}

/* -----------------------------------------------------------------
   footer
----------------------------------------------------------------- */

footer{
	position:relative;
	width:100%;
	padding:10px 20px 50px;
	background:#397C8F;
	text-align:center;
	overflow:hidden;
	background:#F5A747;
	z-index:500;
	}
	footer p{
		position:relative;
		width:1000px;
		max-width:100%;
		margin:0 auto;
		font-size:0.84rem;
		text-align:center;
		color:#FFF;
		z-index:10;
}

/* --- responsive --- */
@media screen and (max-width:1000px){
	footer p{
		font-size:0.70rem;
	}
}

/* -----------------------------------------------------------------
   pagetop
----------------------------------------------------------------- */

#pagetop{
	position:fixed;
	right:20px;
	bottom:25px;
	width:50px;
	height:50px;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	background:rgba(100,100,100,1);
	opacity:0.5;
	z-index:999;
	}
	#pagetop:before,
	#pagetop:after{
		content:" ";
		position:absolute;
	}
	#pagetop:before{
		top:8px;
		left:10px;
		width: 0;
		height: 0;
		margin-top: -15px;
		border:15px solid transparent;
		border-bottom:15px solid rgba(255,255,255,1);
	}
	#pagetop:after{
		top:23px;
		left:19px;
		width:13px;
		height:18px;
		background:rgba(255,255,255,1);
		z-index:0;
	}
	#pagetop span{
		display:none;
		position:absolute;
		top:-25px;
		height:22px;
		right:0px;
		width:80px;
		font-size:10px;
		background:rgba(255,255,255,1);
		border:1px solid #000;
		border-radius:5px;
		-webkit-border-radius:5px;
		-moz-border-radius:5px;
		color:#000;
		line-height:20px;
		}
		#pagetop span:before,
		#pagetop span:after{
			content:" ";
			position:absolute;
		}
		#pagetop span:before{
			bottom:-12px;
			right:8px;
			width:0;
			height:0;
			border:5px solid transparent;
			border-top:7px solid rgba(0,0,0,1);
		}
		#pagetop span:after{
			bottom:-11px;
			right:8px;
			width:0;
			height:0;
			border:5px solid transparent;
			border-top:7px solid rgba(255,255,255,1);
	}
	/* hover */
	#pagetop:hover{
		opacity:1;
	}
	
	#pagetop a{
		display:block;
		position:absolute;
		left:0px;
		top:0px;
		width:100%;
		height:100%;
		color:#0061B1;
		border-radius:6px;
		-webkit-border-radius:6px;
		-moz-border-radius:6px;
		z-index:1;
}
@media print{
	#pagetop{
		display:none;
	}
}

/* -----------------------------------------------------------------
   end_contact
----------------------------------------------------------------- */

#end_contact{
	position:relative;
	width:100%;
	margin-bottom:0px;
	padding:20px 0;
	text-align:center;
	overflow:hidden;
	background:#FEF0DE;
	z-index:500;
}
#end_links{
	position:relative;
	width:100%;
	margin-bottom:0px;
	padding:20px 0;
	text-align:center;
	overflow:hidden;
	background:#D3E2F4;
	z-index:500;
}

#end_contact h2,
#end_links h2{
	position:relative;
	width:140px;
	margin:0 auto 30px;
	padding:0 0 7px;
	font-size:1.30rem;
	letter-spacing:0.2rem;
	border-bottom:1px solid #000;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	color:#000;
	}
	#end_contact h2{
		border-bottom:1px solid #F5A747;
	}
	#end_links h2{
		border-bottom:1px solid #5FACDE;
}
#end_contact h2::before,
#end_contact h2::after,
#end_links h2::before,
#end_links h2::after{
	content:" ";
	position:absolute;
	bottom:-9px;
	width:1px;
	height:50px;
	background:#000;
	}
	#end_contact h2::before,
	#end_contact h2::after{
		background:#F5A747;
	}
	#end_links h2::before,
	#end_links h2::after{
		background:#5FACDE;
	}
	#end_contact h2::before,
	#end_links h2::before{
		left:-21px;
		transform:rotate(-55deg);
	}
	#end_contact h2::after,
	#end_links h2::after{
		right:-21px;
		transform:rotate(55deg);
}

#end_contact p:has(b){
	margin:0 auto 15px;
	}
	#end_contact p b{
		font-weight:500;
		font-size:1.3rem;
	}
	#end_contact #for_contact{
		display:inline-block;
		position:relative;
		margin:0 0 3px;
		padding:3px 10px;
		font-size:0.9rem;
		background:#F5A747;
		color:#FFF;
	}
	#end_contact p span{
		display:inline-block;
		font-weight:bold;
		color:#F5A747;
		}
		#end_contact p span:first-child{
			margin:0 30px 0 0;
}

#end_links ul{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
	width:860px;
	max-width:100%;
	margin:0 auto;
	}
	#end_links ul li{
		width:252px;
		margin:0 0 15px;
		transition-duration:0.5s;
	}
	#end_links ul li:hover{
		opacity:0.7;
}

/* --- responsive --- */
@media screen and (max-width:900px){
	#end_contact{
		width:100%;
		padding:20px 20px;
	}
	#end_links{
		width:100%;
		padding:20px 20px;
	}

	#end_contact h2,
	#end_links h2{
		margin:0 auto 15px;
	}

	#end_contact p span:first-child{
		margin:0 0px 0 0;
	}

	#end_links ul li{
		margin:0 auto 15px;
	}
}