@charset "utf-8";

/*===================================================================
 CSS Import
===================================================================*/
@import url(./ress.css);

/*===================================================================
 Common
===================================================================*/
* { color: #333333; font-family: 'UD Reimin Medium','UD Shin Go NT Medium',sans-serif; font-size: 16px;}
html { width: 100%; }
body { width: 100%; background-color: #ffffff; }
a { color: #006e6d; text-decoration: none; }
div { position: relative; }
img { display: block; width: 100%; height: auto; }
p { line-height: 190%; }


.fBold { font-weight: bold; }
.fMincho { font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif; }
.cRed { color: #6d0000; }
.cGreen { color: #289650; }
.cBlue { color: #00196d; }
.fSmall { font-size: 0.8rem; }

/* COMMON */
html { width: 100%; }
a:hover { cursor: pointer; opacity: 0.7; text-decoration: none; }
.BoxBG {
	width: 100%;
	margin-top: 4rem;
	background: linear-gradient(180deg, #E9F4ED, #ffffff 10%);
	border-top: 1px #ffffff solid;
}
.BoxBG02 {
	width:100%;
	background-color:#E9F4ED;
	padding: 3rem 0;
}

/* HOME */
.homeNewsBody {
	width: 80%;
	max-width: 1000px;
	padding: 1.5rem 0;
	background: radial-gradient(#ffffff, #58ccffb3);
	border-radius: 999px;
	position: absolute;
	bottom: -45px;
	left: 50%;
	transform: translateX(-50%);
}
.homeNewsList > a {
	margin: auto;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}
.homeNewsList > a > div:nth-of-type(1) {
	width: 30%;
}
.homeNewsList > a > div:nth-of-type(1) p {
	color: #06699C;
	font-size: 1.3rem;
}
.homeNewsList > a > div:nth-of-type(2) {
	width: 70%;
	padding-left: 1rem;
}
.homeMenuBox {
	width: 100%;
	margin-top: 60px;
}
.homeMenu {
	margin: auto;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}
.homeMenu > a {
	position: relative;
	width: calc((100% / 3) - 70px);
	border: #2A6884 1px solid;
	padding: 1.5rem;
}
.homeMenu > a::after,
.homeMenu > a::before {
	content: "";
	position: absolute;
	width: calc(100% - 20px);
	height: calc(100% - 20px);
	border: solid 1px #7FCFF3;
}
.homeMenu > a::after {
	bottom: 5px;
	right: 5px;
}
.homeMenu > a::before {
	top: 5px;
	left: 5px;
}
.homeMenu a p {
	position: relative;	
	text-align: center;
	color: #05253D;
	font-size: 1.5rem;
	font-family: 'Noto Sans JP', sans-serif;
	text-decoration: none;
	line-height: 1.3;
}
.homeMenu > a:nth-of-type(3) {
	border-right: 1px solid #006e6d;
}
.homeMenu > a:hover {
	cursor: pointer;
	text-decoration: none;
	background-color: #DEF2FC;
}
.homeMenu div div {
	margin: 0.5rem auto 0;
}
.homeMenu img {
	left: 45%;
	width: 1.5rem;
	height: auto;
	margin: 0 auto;
}
.homeNewsBox {
	display: flex;
	justify-content: center;
	margin: 5rem auto;
}
.homeNewsBox > div {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.homeNewsBox > div:first-of-type {
	position: relative;
	background: #06699C;
	height: 160px;
}
.homeNewsBox > div:first-of-type::after {
	content: "";
	position: absolute;
	top: 0;
	right: -160px;
	border-left: 80px solid;
	border-top: 80px solid transparent;
	border-right: 80px solid transparent;
	border-bottom: 80px solid transparent;
	z-index: 1;
	color: #06699C;
}
.homeNewsBox > div:last-of-type {
	background: #DEF2FC;
	border: solid 1px #06699C;
	margin-left: 50px;
	padding: 0 3rem 0;
}
.homeNewsBox h1.Title {
	padding: 0 3rem 0;
	font-size: 2rem;
	font-weight: bold;
	color: #fff;
	line-height: 100%;
	text-align: center;
}
.homeNewsBox > p.Content {
	padding: 0 4rem;
}
.homeNewsBox > p.Content:nth-of-type(1) {
	font-size: 1.5rem;
	font-weight: bold;
}
.homeNewsBox > p.Content:nth-of-type(2) {
	font-weight: bold;
	font-size: 1.2rem;
}
.GreetingBox {
	background: url("../img/bg.png");
	margin: 6rem auto 10rem;
	padding: 6rem 0;
}
.GreetingBox > div {
	background: #fff;
	padding: 2.5rem;
}
.GreetingBox > div > h1.Title,
.HistoryBox > div > h1.Title,
.MemberBox > div > div > h1.Title {
	position: relative;
	font-size: 2.5rem;
	font-weight: bold;
	font-family: 'Noto Sans JP', sans-serif;
	color: #06699C;
	text-align: center;
	line-height: 150%;
	letter-spacing:0.5rem;
}
.GreetingBox > div > h1.Title::before {
	content: "GREETING";
}
.HistoryBox > div > h1.Title::before {
	content: "HISTORY";
}
.MemberBox > div > div> h1.Title::before {
	content: "MEMBER";
}
.GreetingBox > div > h1.Title::before,
.HistoryBox > div > h1.Title::before,
.MemberBox > div > div> h1.Title::before {
	position: absolute;
	font-size: 7rem;
	text-align: center;
	opacity: .15;
	top: -3rem;
	left: 50%;
	transform: translateX(-50%);
}

.GreetingBox > div > p.Content {
	margin: auto;
	margin-top: 2rem;
}
.GreetingBox > div > p.Content2 {
	margin: auto;
	margin-top: 2rem;
	text-align: right;
}
.GreetingBox > div > p.Content2 > span {
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 150%;
}
.HistoryBox {
	margin: auto;
	margin-top: 4rem;
}
.HistoryBox table {
	width: 80%;
	max-width: 1200px;
	margin: 3rem auto 0;
	border-collapse: separate;
	border-spacing: 0;
	background: #fff;
	box-shadow: 0 10px 30px rgba(0,0,0,.08);
	padding: 1rem;
}
.HistoryBox table thead {
	background: #06699C;	
}
.HistoryBox table thead th {
	color: #fff;
}
.HistoryBox table th {
	font-size: 1rem;
}
.HistoryBox table tbody td:first-child {
	text-align: center;
	background: #DCF3FF;
	width: 4rem;
}
.HistoryBox table tbody tr:not(:last-child) td {
	border-bottom: 1px solid #06699C;
}
.HistoryBox h1.Title {
	font-size: 2.5rem;
	font-weight: bold;
	font-family: 'Noto Sans JP', sans-serif;
	color: #289650;
	line-height: 150%;
	letter-spacing: 0.5rem;
}
.MemberBox {
	background: url("../img/bg.png");
	margin: 9rem 0;
	padding: 6rem 0;
}
.MemberBox > div {
	background: #fff;
	padding: 2.5rem 0;
}
.MemberBox table {
	width: 80%;
	border-collapse: separate;
	border-spacing: 1rem;
	background: #fff;
	box-shadow: 0 10px 30px rgba(0,0,0,.08);
	max-width: 1200px;
	margin: 3rem auto 0;
	padding: 1rem;
}
.MemberBox table th {
	font-size: clamp(1.00rem, calc(0.39vw + 0.91rem), 1.20rem);
	color: #fff;
	font-weight: bold;
	background: #0b6b9f;
	text-align: center;
	vertical-align: middle;
	border-bottom: 4px solid #fff;
}
.MemberBox table tr:nth-of-type(2) > td,
.MemberBox table tr:nth-of-type(10) > td {
	border-top: 1px solid #06699C;
}
.MemberBox table th,
.MemberBox table td {
	padding: 10px;
}
.MemberBox > div:nth-of-type(2) > p {
	padding: 0.5rem 0;
	border-bottom: 1px #289650 solid;
	display: flex;
	flex-wrap: nowrap;
}
.MemberBox > div:nth-of-type(2) > p > span:nth-of-type(1) {
	width: 3.8rem;
	color: #289650;
	font-weight: bold;
}
.MemberBox > div:nth-of-type(2) > p > span:nth-of-type(2) {
	width: calc(100% - 3.8rem);
	padding-left: 1rem;
}

/* HEADER */
.header {
	width: 100%;
	height: 70vh;
	background-image: url(./../img/homeImg01.png);
	background-size: cover;
}
.headerTitle {
	position: absolute;
	top: 15vh;
	right: 0;
	left: 0;
	text-decoration: none;
	padding: 0 1.5rem;
}
.headerTitle > p {
	color: #ffffff;
	text-shadow: 3px 3px 5px darkslategray, -3px 3px 5px darkslategray, -3px -3px 5px darkslategray, 3px -3px 5px darkslategray;
}
.headerTitle > p:nth-of-type(1) {
	font-size: clamp(2.00rem, calc(1.94vw + 1.55rem), 3.00rem);
	font-weight: bold;
	line-height: 150%;
	font-family: 'Noto Sans JP', sans-serif;
}
.headerTitle > p:nth-of-type(2) {
	font-size: clamp(1.00rem, calc(0.97vw + 0.77rem), 1.50rem);
	font-weight: bold;
}

/* FOOTER */
.footerBanner{
	clear: both;
	margin: 8rem auto 2rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.footerBanner > a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: calc((100% / 4) - 10px);
	height: 90px;
	border: 1px #cccccc solid;
	margin-bottom: 1rem;
	color: #000000;
	text-align: center;
	text-decoration: none;
	position: relative;
	font-weight: bold;
}
/*.footerBanner > a > p {
	position: absolute;
	top: 50%;
	right: 0;
	left: 0;
	transform: translate(0, -50%);
	line-height: 150%;
}*/
.footerBanner > a:nth-of-type(1) {
	background-image: url(./../img/img_btn01.jpg);
	background-size: cover;
}
.footerBanner > a:nth-of-type(1) > p > span {
	display: block;
	font-size: 1.3rem;
	line-height: 120%;
}
.footerBanner > a:nth-of-type(2) {
	background-image: url(./../img/img_btn04.jpg);
	background-size: cover;
}
.footerBanner > a:nth-of-type(2) img {
	width: 97%;
	margin: 0 auto 5px;
}
.footerBanner > a:nth-of-type(2) > p {
	font-size: 0.9rem;
	line-height: 1;
}
.footerBanner > a:nth-of-type(2) > p span {
	font-size: 0.9rem;	
}
.footerBanner > a:nth-of-type(3) {
	background-image: url(./../img/img_btn03.jpg);
	background-size: cover;
}
.footerBanner > a:last-child {
	margin-right: 0;
}
.footerBanner > a:hover {
	cursor: pointer;
	text-decoration: none;
}
.footerBanner::after {
	content: "";
	display: block;
	width: 300px;
}
.footer {
	background-color: #06699C;
	padding: 1rem 0 5rem;
}
.footer > div {
	margin: auto;
	margin-top: 2rem;
}
.footer > div > p {
	line-height: 100%;
	color: #fff;
	padding-top: 1rem;
}
.footer > div > p:first-of-type {
	font-size: 1.5rem;
}
.inquiry {
	position: relative;
	padding: 2rem 0 0 1.5rem;
}
.inquiry::before {
	content: "";
	position: absolute;
	width: 20px;
	height: 85%;
	background: #fff;
	left: -.5rem
}
.inquiry p span {
	color: #fff;
}
.inquiry p {
	line-height: 1.5;
	color: #fff;
}
.btnPgTop {
	position: fixed;
	bottom: 2rem;
	right: 2rem;
    width: 4rem; 
    z-index: 9999;
}
.btnPgTop > a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 5rem;
	height: 5rem;
	background: #06699C;
	border: 1px solid #fff;
	border-radius: 10px;
}
.btnPgTop > a svg {
	width: 60%;
}
.btnPgTop > a > img:hover {
	cursor: pointer;
	opacity: 0.7;
}

@media screen and (max-width: 1200px) {
	.footerBanner > a {
		width: calc(50% - 1rem);
	}
}
@media screen and (max-width: 960px) {
	.MemberBox > div,
	.HistoryBox > div,
	.HistoryBox table,
	.MemberBox table {
		width: 100%;
	}
	.homeNewsBox {
		width: 100%;
	}
	.homeNewsBox h1.Title {
		padding: 2rem 1rem 1rem;
	}
	.homeNewsBox > p.Content {
		padding: 0 1rem;
	}
}
@media screen and (max-width: 640px) {
	.HistoryBox table tbody td:first-child {
		width: 1rem;
	}
	.footerBanner {
		margin-bottom: 5rem;
	}
	.footerBanner > a {
		width: 100%;
	}
	.inquiry {
		width: 100%;
	}
}