@charset "UTF-8";
/* CSS Document */
/* loading
================================================== */
.loading {
	width: 100vw;
	height: 100vh;
	transition: all 1s;
	background-color: #fff;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	opacity: 1;
	visibility: visible;
}
.loading.is-active {
	opacity: 0;
	visibility: hidden;
}
.loading-animation {
	width: 100vw;
	height: 100vh;
	transition: all 1s;
	background-color: #cc0000;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
}
.loading-animation.is-active {
	opacity: 1;
	visibility: visible;
}
.logo {
	width: 40%;
	-webkit-animation: logo 0.8s forwards;
	animation: logo 0.8s forwards;
	animation-delay: 0.2s;
}
@media screen and (max-width: 639px) {
	.logo {
		width: 60%;
	}
}
@keyframes byeShutter {
	70% {
		opacity: 1;
	}
	100% {
		display: none;
		opacity: 0;
		z-index: -1;
	}
}
@keyframes logo {
	0% {
		opacity: 1;
	}
	50% {
		transform: rotate(0deg);
	}
	100% {
		transform: scale(0.8);
	}
}
/* slideArea
================================================== */
#slideArea {
	position: relative;
	z-index: 0;
	width: 100%;
}
/* slideBox
================================================== */
#slideBox {
	position: relative;
	z-index: 1;
}
/* ------ スライダー ------ */
@keyframes zoomUp {
	0% {
		transform: scale(1);
	}
	100% {
		transform: scale(1.25);
	}
}
.swiper-slide-active .slide-img, .swiper-slide-duplicate-active .slide-img, .swiper-slide-prev .slide-img {
	animation: zoomUp 10s linear 0s 1 normal both;
}
//imgタグだと下に隙間ができるのでblockに。
.slide-img img {
	display: block;
}
/* conWrapper
================================================== */
#conWrapper {
	position: relative;
	overflow: hidden;
	width: 100%;
	padding-top: 60px;
}
@media screen and (max-width: 639px) {
	#conWrapper {
		padding-top: 80px;
	}
}
/* slideTit
================================================== */
#slideTit {
	position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
	width: 20%;
	z-index: 3;
}
@media screen and (max-width: 639px) {
	#slideTit {
		width: 46%;
	}
}
#credit01 {
	position: absolute;
    right: 10px;
    bottom: 10px;
	z-index: 3;
	font-size: 50%;
	color: #fff;
	line-height: 100%;
}

/* topArea
================================================== */
#topArea {
	position: relative;
}
#topArea h1 {
	position: absolute;
    left: 50%;
    top: 44%;
    transform: translate(-50%,-50%);
	z-index: 3;
	color: #fff;
	text-align: center;
	line-height: 170%;
	font-size: 240%;
	letter-spacing: 0.15em;
	text-shadow: #0e1513 0 0 10px;
	width: 100%;
}
#topArea h1 .txtS {
	border-top: solid 2px #fff;
	font-size: 80%;
	padding-top: 30px;
	line-height: 500%;
}
@media screen and (max-width: 1400px) {
	#topArea h1 {
		font-size: 2.5vw;
	}
	#topArea h1 .txtS {
		padding-top: 2%;
	}
}
@media screen and (max-width: 639px) {
	#topArea h1 {
		font-size: 4.4vw;
	}
	#topArea h1 .txtS {
		border-top: solid 1px #fff;
		padding-top: 3%;
	}
}
#topArea p {
	position: absolute;
    left: 50%;
    top: 77%;
    transform: translate(-50%,-50%);
	z-index: 3;
	color: #fff;
	text-align: center;
	line-height: 170%;
	font-size: 240%;
	letter-spacing: 0.15em;
	text-shadow: #0e1513 0 0 10px;
	width: 100%;
}
@media screen and (max-width: 1400px) {
	#topArea p {
		font-size: 2.5vw;
	}
}
@media screen and (max-width: 639px) {
	#topArea p {
		font-size: 4.4vw;
	}
}
#topArea figure {
	position: relative;
	z-index: 0;
}
/* newsArea
================================================== */
.newsArea {
	padding: 60px 5%;
}
/* newsBlock */
.newsBlock {
	max-width: 1080px;
	margin: 0 auto;
}
.newsTit {
	padding-bottom: 10px;
}
.newsTit h3 {
	background-color: #054045;
	color: #fff;
	display: inline-block;
	padding: 0.5em 1em;
	font-size: 200%;
}
.newsTit p {
	padding-top: 0.5em;
	font-size: 120%;
	font-weight: 500;
}
@media screen and (max-width: 639px) {
	.newsTit h3 {
		font-size: 5vw;
	}
	.newsTit p {
		font-size: 100%;
	}
}
.newsTit h2 {
	padding-top: 15px;
	font-weight: 700;
	line-height: 100%;
	display: flex;
	align-items: center;
	color: #054045;
}
.newsTit h2:after {
	border-top: 10px solid #054045;;
	content: "";
	flex-grow: 1;
	margin-left: 2%;
}
@media screen and (max-width: 639px) {
	.newsTit h2 {
		font-size: 70%;
	}
}
/* bannerArea
================================================== */
.bannerArea {
}
.bannerTxt {
	padding-bottom: 20px;
	font-weight: 500;
}
.banner {
	max-width: 600px;
	margin: 0 auto;
}
/* greetingArea
================================================== */
#greetingArea {
	padding: 0 5%;
	background-color: #F9F8F6;
}
.greetingBlock {
	max-width: 1080px;
	margin: 0 auto;
	padding: 60px 0;
}
.greetingBlock:first-child {
	border-bottom: solid 1px #ccc;
}
@media screen and (max-width: 639px) {
	.greetingBlock:first-child {
		border-bottom: solid 1px #ccc;
		padding: 60px 0 0;
	}
}
.greetingTit h2 {
	padding-bottom: 5px;
	font-size: 120%;
	font-weight: 700;
	line-height: 200%;
}
.greetingTit h3 {
	padding-bottom: 1em;
	font-size: 140%;
	font-weight: 700;
	line-height: 160%;
}
.greetingTit h3 span {
	font-size: 80%;
}
@media screen and (max-width: 639px) {
	.greetingTit h2 {
		font-size: 100%;
	}
	.greetingTit h3 {
		font-size: 110%;
	}
}
.greetingL {
	float: left;
	width: 65%;
}
.greetingR {
	float: right;
	width: 30%;
}
@media screen and (max-width: 639px) {
	.greetingL {
		float: none;
		width: 100%;
	}
	.greetingR {
		float: none;
		width: 100%;
	}
}
.greetingL p {
	padding: 1em 0 0;
	text-align: justify;
}
@media screen and (max-width: 639px) {
	.greetingL p {
		padding: 1em 0;
	}
}
.greetingR .txtS {
	font-size: 80%;
	line-height: 140%;
	padding: 0.5em 0 0;
}
.greetingR .txtS span {
	font-weight: 700;
}
@media screen and (max-width: 639px) {
	.greetingR .txtS {
		border: solid 1px #ccc;
		padding: 1em;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
	}
}
/* tableArea1
================================================== */
#tableArea1 {
	max-width: 1080px;
	margin: 0 auto;
	padding: 60px 5%;
}
@media (max-width: 1100px) {
    .table-scroll {
        overflow-x: scroll;
    }
	.table-scroll::-webkit-scrollbar {
		height: 10px;
	}
	.table-scroll::-webkit-scrollbar-track { 
		margin: 0 2px;
		background: #ccc;
		border-radius: 5px;
	} 
	.table-scroll::-webkit-scrollbar-thumb { 
		border-radius: 5px;
		background: #666;
	}
}
/* table
================================================== */
table {
	border-collapse: collapse !important;
}
table th,
table td {
	padding: 5px;
	font-size: 100%;
	line-height: 160%;
	text-align: center;
	font-weight: 500;
}
@media screen and (max-width: 800px) {
	table th,
	table td {
		font-size: 80%;
	}
}
#table01 sup{
	font-size: 70%;
}
#specArea p{
	padding-top: 10px;
	font-size: 70%;
}
td {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: solid #fff 2px;
	min-width: 70px;
}
@media (max-width: 800px) {
	td {
		min-width: 30px;
	}
}
td span {
	font-size: 80%;
}
td.tableTit {
	font-weight: bold;
	text-align: center;
}
td.tableBg01 {
	background-color: #054045;
	color: #fff;
}
td.tableBg03 {
	background-color: #EBF4EF;
}
/* flexbox
================================================== */
.flexbox {
	display:flex;
	align-items: center;
}
.flexbox .flexbox01 {
	width: 150px;
}
@media (max-width: 800px) {
	.flexbox .flexbox01 {
		width: 80px;
	}
}
.flexbox .flexbox02 {
	width: 160px;
	text-align: left;
	padding-left: 1em;
}
/* top_company
================================================== */
.top_company {
	position: relative;
	z-index: 0;
	padding: 60px 0 100px;
}
.top_company#summary {
	background: #efefef;
}
.top_company#champion {
	background: #064045;
}
.top_company .inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 5%;
	position: relative;
}
.containerR {
	position: relative;
	z-index: 1;
	float: right;
	width: 45%;
	padding-top: 40px;
}
.containerL {
	position: relative;
	z-index: 1;
	float: left;
	width: 50%;
	padding-top: 10%;
}
@media screen and (max-width: 800px) {
	.containerR {
		float: none;
		width: 100%;
		padding-top: 20%;
	}
	.containerL {
		float: none;
		width: 100%;
		padding-top: 90%;
	}
}
.containerL #img01 {
	position: absolute;
	z-index: 0;
	top: 50%;
	right: 0;
	width: 85%;
}
.containerL #img02 {
	position: absolute;
	z-index: 1;
	top: 410%;
	left: 0;
	width: 40%;
}
.containerL #img03 {
	position: absolute;
	z-index: 0;
	top: 320%;
	right: 0;
	width: 55%;
}
.containerL #img04 {
	position: absolute;
	z-index: 0;
	top: 625%;
	right: 0;
	width: 75%;
}
.containerL #credit02 {
	position: absolute;
	z-index: 0;
	top: 595%;
	right: 0;
	font-size: 50%;
	color: #666;
}
@media screen and (max-width: 800px) {
	.containerL #img01 {
		top: 5%;
		right: 0;
		width: 85%;
	}
	.containerL #img02 {
		position: absolute;
		z-index: 1;
		top: 50%;
		left: 0;
		width: 50%;
	}
	.containerL #img03 {
		position: absolute;
		z-index: 0;
		top: 70%;
		right: 10%;
		width: 35%;
	}
	.containerL #img04 {
		display: none;
	}
	.containerL #credit02 {
		position: absolute;
		z-index: 0;
		top: 108%;
		right: 10%;
	}
}
.containerTit h3 {
	font-size: 500%;
	line-height: 100%;
	text-align: center;
}
@media all and (max-width: 1400px) {
	.containerTit h3 {
		font-size: 6vw;
	}
}
@media all and (max-width: 800px) {
	.containerTit h3 {
	}
}
@media all and (max-width: 639px) {
	.containerTit h3 {
		font-size: 230%;
	}
}
.containerTit h2 {
	text-align: center;
	font-weight: 700;
	padding-bottom: 20px;
}
@media all and (max-width: 639px) {
	.containerTit h2 {
		font-weight: 500;
	}
}
.containerTit h4 {
	font-weight: 700;
	font-size: 120%;
	line-height: 130%;
	margin-bottom: 30px;
	padding-top: 10px;
}
@media all and (max-width: 639px) {
	.containerTit h4 {
		font-size: 100%;
	}
}
.containerR .heading {
	font-weight: 500;
	font-size: 170%;
	margin-bottom: 20px;
	line-height: 160%;
	text-align: center;
	color: #064045;
}
@media all and (max-width: 1400px) {
	.containerR .heading {
		font-size: 2vw;
	}
}
@media all and (max-width: 639px) {
	.containerR .heading {
		font-size: 120%;
	}
}
@media all and (max-width: 400px) {
	.containerR .heading {
		font-size: 100%;
	}
}
@media all and (max-width: 300px) {
	.containerR .heading {
		text-align: left;
	}
}
.containerR p {
	padding-bottom: 1em;
}
#summaryList dl {
	padding: 1em 5%;
	border-bottom: solid 1px #ccc;
}
#summaryList dl dt {
	float: left;
	width: 20%;
	font-weight: 500;
	font-size: 80%;
}
#summaryList dl dd {
	float: right;
	width: 75%;
}
@media screen and (max-width: 639px) {
	#summaryList dl {
		padding: 1em 0;
		border: none;
	}
	#summaryList dl dt {
		float: none;
		width: 100%;
		font-weight: 500;
		font-size: 80%;
		line-height: 100%;
		display: flex;
		align-items: center;
		padding-bottom: 1em;
	}
	#summaryList dl dt:after {
		border-top: 1px solid;
		content: "";
		flex-grow: 1;
		margin-left: 2%;
	}
	#summaryList dl dd {
		float: none;
		width: 100%;
	}
}
.point {
	padding-top: 1em;
}
.point h4 {
	padding-bottom: 1em;
	font-size: 80%;
	font-weight: 500;
}
.point li {
	list-style: disc;
	list-style-position: outside;
	margin-left: 1.3em;
	font-size: 80%;
	padding-bottom: 0.5em;
	line-height: 130%;
}
/* sponsor
================================================== */
#sponsor {
	background-color: #054045;
	padding: 60px 5%;
}
#sponsorArea {
	margin: 0 auto;
	max-width: 1280px;
}
#sponsorArea .containerTit h3 {
	color: #fff;
}
@media all and (max-width: 800px) {
	#sponsorArea .containerTit h3 {
		padding-top: 0;
	}
}
#sponsorArea .containerTit h2 {
	color: #fff;
	display: flex;
	align-items: center;
}
#sponsorArea .containerTit h2:before, #sponsorArea .containerTit h2:after {
	content: "";
	height: 1px;
	flex-grow: 1;
	background-color: #fff;
}
#sponsorArea .containerTit h2:before {
	margin-right: 1rem;
}
#sponsorArea .containerTit h2:after {
	margin-left: 1rem;
}
#sponsorArea .containerTit p {
	color: #fff;
	text-align: center;
	padding-bottom: 60px;
	font-size: 120%;
}
@media screen and (max-width: 800px) {
	#sponsorArea .containerTit p {
		text-align: left;
	}
}
@media screen and (max-width: 638px) {
	#sponsorArea .containerTit p {
		font-size: 100%;
	}
}
.sponsorL,
#sponsorM,
#sponsorS {
	width: 100%;
	display: -webkit-box;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-top: 40px;
}
.sponsorBox {
	border: solid 1px #fff;
}
.sponsorL .sponsorBox {
	width: 30%;
	margin-bottom: 5%;
}
.sponsorL::after {
	display: block;
	content: "";
	width: 30%;
}
#sponsorM .sponsorBox {
	width: 23%;
	margin-bottom: 3%;
}
#sponsorM::before{
  content: "";
  display: block;
  width: 23%;
  order: 1;
}
#sponsorM::after {
	display: block;
	content: "";
	width: 23%;
}
#sponsorS .sponsorBox {
	width: 18%;
	margin-bottom: 2.5%;
}
#sponsorS .sponsorBox_empty {
	width: 18%;
}
@media screen and (max-width: 639px) {
	.sponsorL .sponsorBox {
		width: 47%;
		margin-bottom: 5%;
	}
	.sponsorL::after {
		width: 47%;
	}
	#sponsorM .sponsorBox {
		width: 30%;
	}
	#sponsorM::before{
	  width: 30%;
	}
	#sponsorM::after {
		width: 30%;
	}
	#sponsorS .sponsorBox {
		width: 23%;
	}
	#sponsorS .sponsorBox_empty {
		width: 23%;
	}
}