@charset "UTF-8";
/* topContent */
#topContent {
	position: relative;
	z-index: 3;
	background-color: #fff;
	padding: 0;
}
/* contentArea */
.contentArea {
	position: relative;
}
@media screen and (max-width: 600px) {
	.contentArea {
		margin-bottom: 10%;
	}
}
.contentBlock {
	position: relative;
	z-index: 1;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 5%;
}
/* topLeadArea */
#topLeadArea {
	position: relative;
	z-index: 3;
	background-color: #fff;
	padding: 6% 6% 0;
	margin-top: 2%;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
@media screen and (max-width: 600px) {
	#topLeadArea {
		margin-top: 6%;
	}
}
/* activitiesArea */
.activitiesArea {
	padding: 4% 0;
	max-width: 1600px;
	margin: 0 auto;
}
@media screen and (max-width: 800px) {
	.activitiesArea {
		padding: 0 0 8%;
	}
}
/* activitiesTit */
.activitiesTit {
	position: absolute;
	z-index: 1;
	padding-top: 2%;
}
@media screen and (max-width: 800px) {
	.activitiesTit {
		position: relative;
		padding-top: 0;
		border-bottom: solid 1px;
	}
}
.activitiesTitL {
	padding-left: 5%;
	width: 50%;
	max-width: 700px;
}
@media screen and (max-width: 800px) {
	.activitiesTitL {
		padding-left: 0;
		width: 90%;
		margin: 0 auto;
	}
}
.activitiesTit p {
	width: 30%;
}
@media screen and (max-width: 1100px) {
	.activitiesTit p {
		width: 30%;
	}
}
@media screen and (max-width: 800px) {
	.activitiesTit p {
		width: 25%;
		float: left;
	}
}
.activitiesTxt {
	padding-top: 3%;
}
@media screen and (max-width: 800px) {
	.activitiesTxt {
		padding-top: 0;
		float: right;
		width: 73%;
	}
}
.activitiesTit h2 {
	font-size: 300%;
	background-color: #fff;
	display: inline;
	line-height: 110%;
	padding: 0 5%;
	margin: 0;
}
@media screen and (max-width: 1100px) {
	.activitiesTit h2 {
		font-size: 200%;
	}
}
@media screen and (max-width: 800px) {
	.activitiesTit h2 {
		font-size: 140%;
		background: none;
		display: inherit;
		line-height: 130%;
		padding: 10% 0 4%;
	}
}
.activitiesTit h3 {
	margin: 0;
	background-color: #fff;
	line-height: 140%;
	padding: 0 5%;
	display: inline;
}
@media screen and (max-width: 1000px) {
	.activitiesTit h3 {
		font-size: 100%;
	}
}
@media screen and (max-width: 800px) {
	.activitiesTit h3 {
		font-size: 90%;
		padding: 0;
		line-height: 120%;
	}
}
/* imgArea */
.imgArea {
	position: relative;
	z-index: 0;
	width: 75%;
	margin-left: 25%;
}
@media screen and (max-width: 800px) {
	.imgArea {
		width: 100%;
		margin-left: 0;
		padding-top: 4%;
	}
}
/* imgTit */
.imgTit {
	position: relative;
	z-index: 0;
}
.imgTit .imgTxt {
	position: absolute;
	width: 70%;
	top: 3%;
	left: 15%;
}
@media screen and (max-width: 800px) {
	.imgTit .imgTxt {
		width: 90%;
		top: 12%;
		left: 5%;
	}
}
.imgTit .imgTxt p {
	text-align: center;
	color: #fff;
	background-color: #e60012;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
}
/* subImgArea */
#subImgArea {
	width: 90%;
	margin: 0 auto;
	padding: 2% 0 0;
}
.subImgBox {
	float: left;
	width: 32%;
	margin-left: 2%;
	position: relative;
}
.subImgBox:first-child {
	margin-left: 0;
}
@media screen and (max-width: 800px) {
	.subImgBox {
		float: none;
		width: 86%;
		margin: 0 auto;
		padding-top: 4%;
	}
	.subImgBox:first-child {
		margin: 0 auto;
	}
}
.subImgBox .subImgTxt {
	position: absolute;
	width: 70%;
	top: 3%;
	left: 15%;
}
@media screen and (max-width: 800px) {
	.subImgBox .subImgTxt {
		width: 90%;
		top: 10%;
		left: 5%;
	}
}
.subImgBox .subImgTxt p {
	text-align: center;
	color: #fff;
	background-color: #e60012;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
}




/* slideArea */
#slideArea {
	position: relative;
	z-index: 0;
	width: 75%;
	margin-left: 25%;
}
@media screen and (max-width: 800px) {
	#slideArea {
		width: 100%;
		margin-left: 0;
		padding-top: 4%;
	}
}
.item {
	padding-right: 10%;
	position: relative;
}
@media screen and (max-width: 800px) {
	.item {
		padding-right: 0;
		position: relative;
	}
}
.item .itemTxt {
	position: absolute;
	width: 70%;
	top: 3%;
	left: 10%;
}
@media screen and (max-width: 800px) {
	.item .itemTxt {
		width: 90%;
		left: 5%;
	}
}
.item .itemTxt p {
	text-align: center;
	color: #fff;
	background-color: #e60012;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
}
.owl-theme .owl-nav {
	margin-top: 3% !important;
	width: 100%;
	top: 0;
	left: 0;
}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
	width: 10%;
	margin: 0 0 0 40%;
	height: 100%;
	background: 0 0;
	color: inherit;
	padding: 0 !important;
	font: inherit;
	background-color: #efefef !important;
}
.owl-carousel .owl-nav button.owl-next:first-child, .owl-carousel .owl-nav button.owl-prev:first-child, .owl-carousel button.owl-dot:first-child {
	margin: 0 40% 0 0;
}
/* activitiesP */
.activitiesP {
	max-width: 1200px;
	margin: 0 auto;
	padding: 3% 11% 2%;
	text-align: justify;
}
@media screen and (max-width: 600px) {
	.activitiesP {
		padding-bottom: 0;
	}
}
/* titAreaL */
.titAreaL {
	width: 100%;
}
@media screen and (max-width: 600px) {
	.titAreaL {
		width: 100%;
	}
}
.titAreaL h2 {
	font-size: 260%;
	line-height: 140%;
	padding-top: 3%;
	margin: 0;
	color: #fff;
}
.titAreaL h2 span {
	font-size: 200%;
}
@media screen and (max-width: 900px) {
	.titAreaL h2 {
		font-size: 200%;
	}
}
@media screen and (max-width: 600px) {
	.titAreaL h2 {
		font-size: 160%;
		padding-top: 6%;
	}
}
.titAreaL h1 {
	text-align: justify;
	margin: 0;
	font-size: 120%;
	color: #fff;
	font-weight: normal;
}
/* bg_barL*/
/* bg_bar_block01*/
.bg_bar_blockL01 {
	display: block;
	float: left;
	height: 100%;
}
@keyframes expand {
	from {
		width: 100%;
	}
	to {
		width: 100%;
	}
}
/* bg_barL_grad01 */
.bg_barL_grad01 {
	position: absolute;
	z-index: 0;
	top: 0;
	left: 0;
	width: 100%;
	height: 90%;
	opacity: 0;
}
@media screen and (max-width: 600px) {
	.bg_barL_grad01 {
		height: 90%;
	}
}
/* bg_bar_animeL */
.bg_bar_animeL {
	width: 100%;
	/* animation: expand 1.5s ease forwards; */
	opacity: 1;
	transition: 0.5s;
}
.bg_barL {
	width: 100%; 
	background-color: #005FA5;
	/* background: linear-gradient(45deg, #DA666B, #D85A74); */
	/* background: linear-gradient(45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab); */
	background-size: 1000% 1000%;
	/* animation: gradient 5s ease infinite; */
}
@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
@media screen and (max-width: 600px) {
	.bg_barL {
		width: 100%;
	}
}
/* bottomArea */
.bottomArea {
	margin-bottom: 4%;
}
@media screen and (max-width: 600px) {
	#bottomArea {
		margin-bottom: 10%;
	}
}
/* newsTitBox */
#newsTitBox {
	padding: 3% 2% 0;
}
@media screen and (max-width: 600px) {
	#newsTitBox {
		padding: 0 1.5% 0;
	}
}
#newsTitBox h2 {
	margin: 0;
}
#newsTitBox h2 a {
	color: #0068b7;
}
#newsTitBox h2 a:hover {
	color: #23d5ab;
	transition: 0.3s;
}
.newsTitS {
	padding-bottom: 1%;
}
.newsTitS span {
	padding-left: 0.5%;
}
/* topBtn */
.topBtn {
	float: left;
	margin: 1.6%;
	width: 29.9%;
}
@media screen and (max-width: 800px) {
	.topBtn {
		float: none;
		margin: 2.5%;
		width: 95%;
	}
}
/* .topBtn .linkBox */
.topBtn .linkBox {
	position: relative;
	z-index: 10;
	overflow: hidden;
	text-align: center;
}
.topBtn .linkBox a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-indent: -999px;
	z-index: 11;
}
.topBtn .zoomBox {
	display: block;
	transition-duration: 0.3s; /*変化に掛かる時間*/
}
.topBtn .zoomBox:hover {
	transition-duration: 0.3s; /*変化に掛かる時間*/
}
.topBtn .zoomBox:hover {
	background-color: #0068b7;
	color: #fff;
}
.topBtn .linkBox h3 {
	font-size: 100%;
	font-weight: normal;
	line-height: 100%;
	margin: 0;
	padding: 6% 0 6%;
	display: flex;
	align-items: center;
}
.topBtn .linkBox h3:before, .topBtn .linkBox h3:after {
	border-top: 1px solid;
	content: "";
	flex-grow: 1;
}
.topBtn .linkBox h3:before {
	margin: 0 4%;
}
.topBtn .linkBox h3:after {
	margin: 0 4%;
}
/* bg-w */
.bg-w {
	opacity: 0;
	background-color: #fff;
}
.bg-wOn {
	opacity: 1;
	transition: 2s;
}
/* shikaku */
.shikaku {
	opacity: 0;
}
.square{
	opacity: 1;
	border: 1px solid #ddd;
}
@keyframes square_anim {
	00% {
		background-size:
			1px 0, 0 1px, 1px 0, 0 1px;
	}
	25% {
		background-size:
			1px 100%, 0 1px, 1px 0, 0 1px;
	}
	50% {
		background-size:
			1px 100%, 100% 1px, 1px 0, 0 1px;
	}
	75% {
		background-size:
			1px 100%, 100% 1px, 1px 100%, 0 1px;
	}
	100% {
		background-size:
			1px 100%, 100% 1px, 1px 100%, 100% 1px;
	}
}