@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap");

#block-mizuno-theme-content a:hover {
	opacity: 0.75;
}

/* ----------------------------------------
intro
---------------------------------------- */
.intro-area .text-01 p {
	line-height: 2.0;
}
.intro-area .text-02 p {
	line-height: 2.2;
}
.intro-area .text-03 p {
	line-height: 2.0;
	letter-spacing: 0.08em;
}

@media only screen and (max-width: 767px) {
	.intro-area .text-02 p {
		line-height: 1.9;
	}
	.intro-area .text-03 p {
		line-height: 1.5;
		letter-spacing: 0.1em;
	}
}


/* ----------------------------------------
other
---------------------------------------- */
.c-flex-justify {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.c-flex-justify.reverse {
	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
}

._center {
	text-align: center !important;
}

._left {
	text-align: left !important;
}

._right {
	text-align: right !important;
}

@media only screen and (max-width: 767px) {
	._center_sp {
		text-align: center !important;
	}

	._left_sp {
		text-align: left !important;
	}
}
._pc {
	display: block !important;
}
@media (max-width: 767px) {
	._pc {
		display: none !important;
	}
}

._sp {
	display: none !important;
}
@media (max-width: 767px) {
	._sp {
		display: block !important;
	}
}

.u-grid--5 {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 30px;
}

.u-grid--4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
}

.u-grid--3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 15px;
}

.u-grid--2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}

.u-grid--1 {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 20px;
}

@media (max-width: 1210px) {
	.u-grid--2--sp {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 15px;
	}
}

@media (max-width: 767px) {
	.u-grid--1--sp {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 15px;
	}
}

.og-container {
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 15px;
}
@media (max-width: 767px) {
	.og-container {
		padding: 0 20px;
	}
}

/*animation*/
.sa {
	opacity: 0;
}

.sa-firstview {
	opacity: 0;
	position: relative;
	animation: sa-firstview 1.6s ease forwards;
}

.sa-fade01 {
	opacity: 0;
	animation: slideIn 3s cubic-bezier(0.25, 1, 0.5, 1) 1.5s forwards;
}

.sa-fade02 {
	opacity: 0;
	animation: meteor 2.5s ease-in-out 0.5s forwards;
}

.sa-fade03 {
	opacity: 0;
	animation: meteor02 2.5s ease-in-out 0.5s forwards;
}

.sa-fade04 {
	opacity: 0;
	animation: slideIn 3s cubic-bezier(0.25, 1, 0.5, 1) 2s forwards;
}

@keyframes sa-firstview {
	0% {
		opacity: 0;
		transform: translate(0, 0);
	}
	100% {
		opacity: 1;
		transform: translate(0, 0);
	}
}
.sa.show {
	animation: slideIn 1.5s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
}

@keyframes meteor {
	0% {
		transform: translate(100vw, -60vw) scale(0);
		opacity: 0;
	}
	10% {
		opacity: 0;
	}
	100% {
		transform: translate(0, 0) scale(1);
		opacity: 1;
	}
}
@keyframes meteor02 {
	0% {
		transform: translate(80vw, -50vw) scale(0);
		opacity: 0;
	}
	80% {
		opacity: 0;
	}
	100% {
		transform: translate(0, 0) scale(1);
		opacity: 1;
	}
}
@keyframes slideIn {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}
@keyframes slideIn02 {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}
@keyframes slideOut {
	0% {
		opacity: 1 !important;
	}
	100% {
		opacity: 0 !important;
	}
}
.sa--lr {
	-webkit-transform: translate(-100px, 0);
	transform: translate(-100px, 0);
}

.sa--rl {
	-webkit-transform: translate(100px, 0);
	transform: translate(100px, 0);
}

.sa--up {
	-webkit-transform: translate(0, 100px);
	transform: translate(0, 100px);
}

.sa--down {
	-webkit-transform: translate(0, -100px);
	transform: translate(0, -100px);
}

.sa--scaleUp {
	-webkit-transform: scale(0.5);
	transform: scale(0.5);
	opacity: 1;
}

.sa--scaleDown {
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
}

.sa--rotateL {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}

.sa--rotateR {
	-webkit-transform: rotate(-180deg);
	transform: rotate(-180deg);
}



.s01 {
	padding: 9.8vw 0 6.7vw;
}
@media (max-width: 767px) {
	.s01 {
		background-position: left 20% center !important;
	}
}
.s01 .mz-block {
	margin-bottom: 0 !important;
}
.s01 h2 span {
	/*font-family: "Noto Serif JP", serif;*/
	color: #fff;
	font-size: 2.8rem;
	font-weight: 600;
	line-height: 1.9;
}
@media (max-width: 767px) {
	.s01 h2 span {
		font-size: 1.7rem;
	}
}

.s01 h2{
	position: relative;
	z-index: 3;
}

.s01 .main-img{
	text-align: center;
	margin-top: -6vw;
}

.s01 .main-img img{
	width: inherit !important;
	margin-top: -2vw;
}

.s01 .ex-text {
	margin-top: -4vw;
}
.s01 .ex-text p {
	/*font-family: "Noto Serif JP", serif;*/
	color: #fff;
	text-align: right;
	font-size: 4.8rem;
	line-height: 1.5;
}
@media (max-width: 767px) {
	.s01 .ex-text p {
		font-size: 2.4rem;
	}
}
.s01 .ex-text p span {
	font-size: 1.4rem;
	display: block;
	text-align: right;
}
@media (max-width: 767px) {
	.s01 .ex-text p span {
		font-size: 1.2rem;
	}
}

.s02 {
	padding: 7.8vw 0;
}
@media (max-width: 767px) {
	.s02 {
		padding: 9.8vw 0;
	}
}
.s02 .mz-block {
	margin-bottom: 0 !important;
}
.s02 h2 {
	color: #fff;
	font-size: 2.8rem;
	font-weight: 700;
	margin: 0 0 15px;
}
@media (max-width: 767px) {
	.s02 h2 {
		font-size: 1.8rem;
		margin: 0 0 10px;
	}
}
@media (max-width: 767px) {
	.s02 .text {
		margin-bottom: 30px;
	}
}
.s02 .text p {
	color: #fff;
	font-size: 1.6rem;
	font-weight: normal;
}
@media (max-width: 767px) {
	.s02 .text p {
		font-size: 1.3rem;
	}
}

.s03 {
	padding: 9.8vw 0 0;
}
.s03 .mz-block {
	margin-bottom: 0 !important;
}
.s03 h2 {
	text-align: center;
	font-family: "Noto Serif JP", serif;
	color: #265482 !important;
	font-weight: 600;
	font-size: 4.8rem !important;
	letter-spacing: 0.2em !important;
}
@media (max-width: 767px) {
	.s03 h2 {
		font-size: 2.4rem !important;
	}
}
.s03 .ex-text {
	text-align: center;
	color: #265482 !important;
	margin-bottom: 110px;
}
@media (max-width: 767px) {
	.s03 .ex-text {
		margin-bottom: 50px;
	}
}

.s4 {
	position: relative;
	padding: 10.4vw 0;
}
.s4 .mz-block {
	margin-bottom: 0 !important;
}
.s4 p {
	font-family: "Noto Serif JP", serif;
	color: #fff;
	font-size: 1.14vw;
	font-weight: 500;
	line-height: 3.18;
}
@media (max-width: 767px) {
	.s4 p {
		font-size: 1.4rem;
		line-height: 2;
	}
}

.s05 {
	position: relative;
	padding: 4.1vw 0 4.6vw;
}
@media (max-width: 767px) {
	.s05 {
		padding: 9.8vw 0;
		background-position: right -50vw center !important;
	}
}
.s05 .mz-block {
	margin-bottom: 0 !important;
}
.s05 h2 {
	color: #fff !important;
	font-size: 1.04vw !important;
	font-weight: 700 !important;
	line-height: 1 !important;
}
@media (max-width: 767px) {
	.s05 h2 {
		font-size: 1.4rem !important;
	}
}
.s05 h2 span {
	font-family: "N oto Serif JP", serif;
	color: #fff !important;
	font-weight: 700 !important;
	font-size: 2.5vw !important;
	display: block;
}
@media (max-width: 767px) {
	.s05 h2 span {
		font-size: 2.6rem !important;
	}
}
.s05 .detail-btn {
	margin-top: 40px;
}
@media (max-width: 767px) {
	.s05 .detail-btn {
		margin-top: 20px;
	}
}
.s05 .detail-btn a {
	padding: 25px;
	display: inline-block;
	max-width: 340px;
	width: 100%;
	color: #fff;
	font-weight: 500;
	background: #1c1c1c;
	border: 1px solid #fff;
	text-align: center;
	text-decoration: none;
}
@media (max-width: 767px) {
	.s05 .detail-btn a {
		padding: 15px;
	}
}
.s05 .detail-btn a:hover {
	background: transparent;
}