@charset "utf-8";
body {
	font-family: 'Noto Sans JP', sans-serif, 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック';
	line-height: 1.8;
}
.mincho {
	font-family: 'Noto Serif JP', serif;
}
#header {
	background: url(../images/sky.jpg) no-repeat;
	background-size: cover;
	height: 540px;
}
#header h1{
	font-weight: 600;
	letter-spacing: 10px;
	color: #FFF;
	font-size: 2.2rem;
	text-shadow: 0px 0px 3px #0d628d;
	padding:90px 0 60px;
}
#header h1:before {
	content: "";
	display: inline-block;
	width: 50px;
	height: 50px;
	background: url(../images/icon_ribbon_w.png) no-repeat left center;
	background-size: contain;
	vertical-align: middle;
}
#header h1 span{
	font-size:16px;
	margin-top:10px;
	display: block;
	text-align: center;
	letter-spacing: 2px;
}
#header .lead{
	letter-spacing: 10px;
	color: #e0ebaf;
	font-weight: 400;
	text-shadow: 0px 0px 3px #0d628d;
	font-size: 1.8rem;
	margin-bottom:50px;
}
#navi {
	background: #108fbd !important;
}
#navi a{
	color: #FFF;
}
#navi a.disabled{
	opacity: 0.3;
}
#navi li.active a{
	color: #FFF;
	border-bottom:solid 2px #FFF;
}
#navi li.disabled a,
#navi li:first-child.active a {
	border-bottom:solid 0px #FFF !important;
}
#menu-logo {
	position: absolute;
	font-weight: 600;
	font-size: 0.8em;
	transition: all 0.5s ease;
	letter-spacing: 2px;
	opacity: 0;
}
body.hdview #menu-logo {
	opacity: 1;
}
h2 {
	color: #108fbd;
	margin-bottom: 1.4rem;
}
#contents>h2 {
	margin-top: 3rem;
}
#contents>h2:not(:first-child) {
	margin-top: 5rem;
}
h3 {
	background: #108fbd;
	border-radius: 8px 0 0 8px;
	color: #fff;
	display: inline-block;
	height: 38px;
	line-height: 1.4rem;
	font-size:1.4rem;
	padding: 5px 1em 5px 10px;
	position: relative;
	margin-bottom: 1.4rem;
	margin-top:2rem;
}
h3::before {
	border: 19px solid transparent;
	border-left-color: #108fbd;
	border-right-width: 0;
	content: '';
	display: block;
	height: 0;
	position: absolute;
	right: -19px;
	top: 0;
	width: 0;
}
h3::after {
	background: #108fbd;
	border-radius: 8px 0 0 8px;
	content: '';
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 10px;
}
section#contents {
	padding:0 20px 0px;
	max-width: 1200px;
	margin: 0 auto;
}
.banner {
	max-width: 540px;
	margin:0 auto;
	border-radius: 10px;
	background:rgba(255,255,255,0.5);
}
.news-list {
	list-style-type: none;
	padding-left: 0;
}
.message {
	background: #d5f2fb;
	width: auto;
}
#pagetop{
	width: 40px;
	height: 40px;
	position: fixed;
	right: 10px;
	bottom: 10px;
}
#pagetop a{
	opacity: .6;
	background: #108fbd;
	position: relative;
	display: block;
	width: 40px;
	height: 40px;
	text-decoration: none;
	cursor: pointer;
}
#pagetop a:hover{
	opacity: 1;
}
#pagetop a::after{
	content: '▲';
	font-size: 14px;
	font-weight: bold;
	color: #fff;
	position: absolute;
	top: 10px;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto;
	text-align: center;
}
#footer {
	padding:0px 0 200px;
}
.copyright {
	background: url(../images/icon_ribbon.png) no-repeat center 50px;
	background-size: 20px;
	padding-top:120px;
}
.table .thead-light th {
	background-color: #d5f2fb;;
	text-align: center;
}
.point5 {
	padding-left:0;
}
.point5 li{
	padding-left:25px;
	list-style-type: none;
	background: url(../images/icon_ribbon.png) no-repeat center left;
	background-size:auto 50%;
	font-size:1.3rem;
	margin:.4rem 0 ;
	padding-bottom:.4rem;
	border-bottom:dotted 1px #108fbd;
}
.join .card{
	background: #d5f2fb;
}
.join .card-body{
}
.join h4 {
	color: #108fbd;
	font-size: 1.3rem;
	margin: .5rem 0 1.5rem;
}

.links {
	min-height: 15em;
}

section#contact {
	padding: 0 0 50px;
	min-height: 20em;
}
section#contact h2{
	color: #000;
	font-size: 1.4rem;
	margin-bottom: 2rem;
	padding-top: 1rem;
}


@media all and (-ms-high-contrast: none) {
	.sticky-top {
			position: fixed;
			width: 100%;
			z-index:300;
			height: 62px;
	}
	#menu-logo {
		left: 16px;
	top: 11px;
	}
	.nav-link ,
	.navbar-nav,
	.nav-item, 
	#navbarNav {
		height: 44px;
	}
	#header {
		height: 600px;
	}
	#header h1 {
		padding: 150px 0 60px;
	}
}

@media (max-width: 767px) {
	body {
		line-height: 1.6;
	}
	#header {
		height: 260px;
	}
	#header h1{
		font-weight: 600;
		letter-spacing: 3px;
		font-size: .9rem;
		padding:40px 0 20px;
	}
	#header h1:before {
		width: 20px;
		height: 20px;
	}
	#header h1 span{
		font-size:10px;
		font-weight: normal;
		margin-top:5px;
		letter-spacing: 0px;
	}
	#header .lead{
		letter-spacing: 3px;
		font-size: .8rem;
		margin-bottom:30px;
	}
	.banner {
		max-width: 310px;
	}
	.message p {
		font-size:.9rem;
	}
	.message p.sign {
		font-size:.7rem;
	}
	.message .h2 {
		font-size:1.1rem;
	}
	#menu-logo {
		font-size:.8em;
	}
	section#contents {
		padding:0 20px 100px;
	}
	h2 {
		font-size:1.2em;
	}
	#contents>h2 {
		margin-top: 2rem;
	}
	#contents>h2:not(:first-child) {
		margin-top: 5rem;
	}
	h3 {
		font-size:1em;
	}
	h3.long {
		width: calc(100% - 2em);
	}
	h3.long {
		height:56px;
	}
	h3.long::before {
		border: 28px solid transparent;
		border-left-color: #108fbd;
	border-right-width: 0;
		right: -28px;
	}
	.point5 li{
		background-size:auto 22px;
		font-size:1.2rem;
		margin:.3rem 0 ;
	}
	.table {
		font-size:.8em;
	}
	#footer {
		padding:50px 0 200px;
	}
	.copyright {
		font-size:9px;
	}
	.join h4 {
	font-size: 1.2rem;
	}
}
@media (min-width: 768px) {
	.navbar-expand-lg .navbar-nav .nav-link{
		padding-left:1.2rem;
		padding-right:1.2rem;
	}
}
@media (min-width: 992px) and (max-width: 1080px){
	.justify-content-center {
	-ms-flex-pack: end !important;
	justify-content: flex-end !important;
	}
}
@media (max-width: 991px) {
	#menu-logo {
		position: static;
	}
}