@charset "utf-8";
/*=========================================================
   基本スタイルシート
   ※トップイメージ画像
   現在の場所表示用
   見出し要素 h1 h2
   隙間調整
   footer調整
   《色指定》
   文字カラー： #333333;
   ＦＣＪカラー： #008FD4
   スゴイぞカラー： #2891F6
=========================================================*/

/*====================================
   基本スタイルシート
====================================*/
body {
	font-family: "メイリオ", Meiryo, sans-serif;
	font-size: 32px;
	color: #333333;
	font-weight:normal;
	letter-spacing: 0.01em;
	line-height: 1.5em;
	width:100%;
	margin:0 auto;
	background-color: #FFFFFF;
	min-width: 350px; /* 最小画面サイズ */
	-webkit-text-size-adjust: 100%;
	position: relative;
}

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

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

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

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

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


a {
	text-decoration:none;
	color:#323232;
	transition:opacity 0.2s linear;
	-webkit-transition:opacity 0.2s linear;
	-moz-transition:opacity 0.2s linear;
	}

a:hover {
	opacity:0.6;
	filter:alpha(opacity=60);
	-moz-opacity:0.6;
	}




/*==============================================
  ※メニューの高さとトップイメージとの隙間調整
  メニューの高さ分、画像を下げる
==============================================*/
.imgspaceheight {
	width: 1px;
	height: 185px;
	border: 0px solid #0ff;
}

@media screen and (max-width: 3630px) {
	.imgspaceheight {
		height: 175px;
	}
}

@media screen and (max-width: 3420px) {
	.imgspaceheight {
		height: 165px;
	}
}

@media screen and (max-width: 3200px) {
	.imgspaceheight {
		height: 155px;
	}
}

@media screen and (max-width: 2990px) {
	.imgspaceheight {
		height: 145px;
	}
}

@media screen and (max-width: 2780px) {
	.imgspaceheight {
		height: 135px;
	}
}

@media screen and (max-width: 2570px) {
	.imgspaceheight {
		height: 125px;
	}
}

@media screen and (max-width: 2360px) {
	.imgspaceheight {
		height: 115px;
	}
}

@media screen and (max-width: 2150px) {
	.imgspaceheight {
		height: 105px;
	}
}

@media screen and (max-width: 1940px) {
	.imgspaceheight {
		height: 90px;
	}
}

@media screen and (max-width: 1730px) {
	.imgspaceheight {
		height: 85px;
	}
}

@media screen and (max-width: 1520px) {
	.imgspaceheight {
		height: 78px;
	}
}

@media screen and (max-width: 1460px) {
	.imgspaceheight {
		height: 73px;
	}
}

@media screen and (max-width: 1310px) {
	.imgspaceheight {
		height: 70px;
	}
}

@media screen and (max-width: 700px) {
	.imgspaceheight {
		height: 60px;
	}
}

@media screen and (max-width: 550px) {
	.imgspaceheight {
		height: 55px;
	}
}




/*====================================
    ※トップイメージ画像
    主な解像度
    4K (3840x2160):
    WQHD (2560x1440):
    フルHD (1920x1080):
====================================*/
#top-img {
	width: 100%;
/*	height: 240px;*/
	height: 5.6em;
	margin: 0px auto;
	padding: 0px;
	position: relative;
	border-bottom-right-radius: 300px;
	background-color: #2891F6;
}

/*@media screen and (max-width: 3000px) {
	#top-img {
		height: 195px;
	}
}

@media screen and (max-width: 2560px) {
	#top-img {
		height: 159px;
	}
}*　　　　　/

@media screen and (max-width: 1920px) {
	#top-img {
		height: 5.6em;
	}
}

/*@media screen and (max-width: 1720px) {
	#top-img {
		height: 80px;
	}
}

@media screen and (max-width: 950px) {
	#top-img {
		height: 100px;
	}
}

@media screen and (max-width: 700px) {
	#top-img {
		height: 80px;
	}
}*/




/*====================================
    ※サブページ タイトル表示
====================================*/
.subpagetitle {
	position: absolute;
	top:60%;
	left:50%;
	transform: translate(-50%,-65%);
/*	width: 80%;*/
	width: 57.4%;
	padding:0;
	margin:0;
	font-size: 72px;
	font-weight: 900;
	text-align: left;
	letter-spacing: 0.2em;
	line-height: 1.3em;
	color: #FFFFFF; /* #545555 #008FD4 */
	border: 0px solid #F00;
}

@media screen and (max-width: 3700px) {
	.subpagetitle {
		font-size: 69px;
	}
}

@media screen and (max-width: 3200px) {
	.subpagetitle {
		font-size: 60px;
	}
}

@media screen and (max-width: 2560px) {
	.subpagetitle {
		font-size: 48px;
		line-height: 1.1em;
	}
}

@media screen and (max-width: 1920px) {
	.subpagetitle {
		width: 1100px;
		font-size: 36px;
		transform: translate(-50%,-50%);
	}
}

@media screen and (max-width: 1294px) {
	.subpagetitle {
		width: 85%;
		font-size: 32px;
		line-height: 1.1em;
	}
}

@media screen and (max-width: 650px) {
	.subpagetitle {
		width: 90%;
		font-size: 26px;
		letter-spacing: 0px;
		line-height: 1.1em;
	}
}

@media screen and (max-width: 450px) {
	.subpagetitle {
		left:48%;
		font-size: 18px;
		letter-spacing: 0px;
		line-height: 1.0em;
	}
}




/*=========================================================
   　現在の場所表示用
=========================================================*/
.current-location {
	width: 100%;
	padding: 3px 0px 0px 0px;
	margin: 0px auto;
	text-align: left;
	background-color: #FFFFFF;
	border: 0px solid #F00;
}

.current-location a {
	text-decoration: none;
}




/*=========================================================
   基本ＢＯＸ設定
=========================================================*/
.kihonbox {
	width: 57.4%;
	padding: 1em;
	margin: 0.5em auto;
	text-align: justify;
	background-color: #FFFFFF;
	border: 0px solid #F00;
}

@media screen and (max-width: 1920px) {
	.kihonbox {
		width: 1100px;
	}
}

@media screen and (max-width: 1294px) {
	.kihonbox {
		width: 85%;
	}
}

@media screen and (max-width: 500px) {
	.kihonbox {
		width: 92%;
	}
}

.kihonbox img {
	width: 100%;
	padding: 1em;
	margin: 0.5em auto;
	text-align: center;
	background-color: #FFFFFF;
	border: 0px solid #0F0;
}



/*=========================================================
　　見出し要素 h1 h2
=========================================================*/
h1 {
	width: 100%;
	margin: 16px auto;
	padding: 16px 0px 10px 0px;
	text-align: center;
	font-size: 64px;
	line-height: 1.2em; /* 行間調整 */
	color: #008FD4;
	border-top: 5px solid #008FD4;
	border-bottom: 5px solid #008FD4;
}

@media screen and (max-width: 3200px) {
	h1 {
		font-size: 53px;
	}
}

@media screen and (max-width: 2560px) {
	h1 {
		font-size: 43px;
		border-top: 4px solid #008FD4;
		border-bottom: 4px solid #008FD4;
	}
}

@media screen and (max-width: 1920px) {
	h1 {
		font-size: 32px;
		border-top: 3px solid #008FD4;
		border-bottom: 3px solid #008FD4;
	}
}

@media screen and (max-width: 1110px) {
	h1 {
		font-size: 28px;
	}
}

@media screen and (max-width: 750px) {
	h1 {
		font-size: 20px;
	}
}

.koumoku {
	width: 100%;
	margin: 16px auto;
	padding: 16px 0px 10px 0px;
	text-align: center;
	font-size: 64px;
	font-weight: 900;
	line-height: 1.2em; /* 行間調整 */
	color: #008FD4;
	border-top: 5px solid #008FD4;
	border-bottom: 5px solid #008FD4;
}

@media screen and (max-width: 3200px) {
	.koumoku {
		font-size: 53px;
	}
}

@media screen and (max-width: 2560px) {
	.koumoku {
		font-size: 43px;
		border-top: 4px solid #008FD4;
		border-bottom: 4px solid #008FD4;
	}
}

@media screen and (max-width: 1920px) {
	.koumoku {
		font-size: 32px;
		border-top: 3px solid #008FD4;
		border-bottom: 3px solid #008FD4;
	}
}

@media screen and (max-width: 1110px) {
	.koumoku {
		font-size: 28px;
	}
}

@media screen and (max-width: 750px) {
	.koumoku {
		font-size: 20px;
	}
}



/*=========================================================
   ＰＦＡＳＢＯＸ設定
=========================================================*/
.pfas-box {
	width: 57.4%;
	padding: 1em;
	margin: 0.5em auto;
	text-align: justify;
	display: flex;
	flex-direction: row;/*横並びに設定*/
	background-color: #FFFFFF;
	border: 0px solid #F00;
}

@media screen and (max-width: 1920px) {
	.pfas-box {
		width: 1100px;
	}
}

@media screen and (max-width: 1294px) {
	.pfas-box {
		width: 85%;
	}
}

@media screen and (max-width: 750px) {
	.pfas-box {
		width: 92%;
		flex-direction: column;/*横並びに設定*/
	}
}

.pfas-box img {
	width: 95%;
	padding-right: 0em;
	margin: 0em auto;
	text-align: center;
	background-color: #FFFFFF;
	border: 0px solid #0F0;
}

@media screen and (max-width: 750px) {
	.pfas-box img {
		width: 92%;
		padding-bottom: 2em;
		margin: 0em auto;
	}
}



/*=========================================================
　　区切りライン
=========================================================*/
.kugiri-line {
	width: 100%;
	margin: 16px auto;
	padding: 16px 0px 10px 0px;
	text-align: center;
	background-color: #FFFFFF;
	border-top: 5px solid #008FD4;
}

@media screen and (max-width: 2560px) {
	.kugiri-line {
		border-top: 4px solid #008FD4;
	}
}

@media screen and (max-width: 1920px) {
	.kugiri-line {
		border-top: 3px solid #008FD4;
	}
}



/*====================================
　　隙間調整
====================================*/
.space05 {
	width: 100%;
	margin-top: 5px;
}

.space10 {
	width: 100%;
	margin-top: 10px;
}

.space20 {
	width: 100%;
	margin-top: 20px;
}

.space30 {
	width: 100%;
	margin-top: 30px;
}

.space40 {
	width: 100%;
	margin-top: 40px;
}

.space50 {
	width: 100%;
	margin-top: 50px;
}



/*====================================
　　footer
====================================*/

footer {
	background-color: #2891F6;
	padding: 20px 0px;
	position: relative;
}

footer .site-info {
	color: #FFFFFF;
	letter-spacing: 0px;
	line-height: 24px;
	text-align: center;
	font-size: 28px;
	margin: 0;
}

@media screen and (max-width: 3200px) {
	footer .site-info {
		font-size: 23px;
	}
}

@media screen and (max-width: 2560px) {
	footer .site-info {
		font-size: 18px;
	}
}

@media screen and (max-width: 1920px) {
	footer .site-info {
		font-size: 14px;
	}
}

@media screen and (max-width: 1024px) {
	footer .site-info {
		font-size: 12px;
	}
}


footer .site-info a {
	color: #FFFFFF;
	text-decoration: none;
	transition-duration: 0.3s;
}

footer .site-info a:hover {
	opacity: .9;
}