/* English SIC: pages/mizu.css; extracted from the original English styles. */
@media only screen and (max-width: 767px) {
.m__mizu .m__hero__text-box { padding-bottom:65px }
}
.m__mizu__mission { position:relative }
.m__mizu .l__right-column > .l__section > .m__hero__text-box:first-child .title > h2.section-title_mincho { margin-top:0 }
.m__mizu .l__right-column > .l__section:last-child { margin-bottom:0 }
@media print,screen and (min-width: 768px) {
.m__mizu__mission .m__hero__text-box { margin-bottom:60px }
}
@media only screen and (max-width: 767px) {
.m__mizu__mission .m__hero__text-box { padding-bottom:40px }
}
.m__mizu__mission .description { padding-bottom:470px;font-size:1.8rem;font-weight:500 }
@media only screen and (max-width: 767px) {
.m__mizu__mission .description { padding-bottom:300px }
}
.m__mizu__mission .img-box .img01 { position:absolute;right:-160px;top:285px }
@media only screen and (max-width: 767px) {
.m__mizu__mission .img-box .img01 { right:-40px;top:-123px;width:156px;height:auto }
}
@media only screen and (max-width: 380px) {
.m__mizu__mission .img-box .img01 { right:-14vw }
}
.m__mizu__mission .img-box .img02 { position:absolute;right:-50px;top:655px }
@media only screen and (max-width: 767px) {
.m__mizu__mission .img-box .img02 { right:-55px;top:auto;bottom:100px;width:144px;height:auto }
}
.m__mizu__mission .img-box .img03 { position:absolute;right:55px;bottom:0 }
@media only screen and (max-width: 767px) {
.m__mizu__mission .img-box .img03 { right:auto;left:-45px;bottom:0;width:240px;height:auto }
}
@media print,screen and (min-width: 768px) {
.m__mizu__mission .description { width:550px }
}

/* Related links: ported from the legacy SIC mizu page. */
.m__mizu #anchor4 .m__link__related-link-list {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
}

.m__mizu #anchor4 .m__link__related-link-list .related-link {
	width: 384px;
}

.m__mizu #anchor4 .m__link__related-link-list .link {
	background: #e9eaf0;
	border: 1px solid #e9eaf0;
	border-radius: 24px;
	display: flex;
	flex-direction: column;
	gap: 24px;
	height: 100%;
	justify-content: space-between;
	padding: 40px 35px;
	text-decoration: none;
	transition: .3s;
}

.m__mizu #anchor4 .m__link__related-link-list .title {
	color: var(--sic-color-primary);
	display: flex;
	font-family: var(--sic-font-zen);
	font-size: 2.4rem;
	justify-content: space-between;
	line-height: 1.35;
}

.m__mizu #anchor4 .m__link__related-link-list .arrow {
	background-color: var(--sic-color-primary);
	border-radius: 25px;
	display: block;
	flex-shrink: 0;
	height: 24px;
	margin: 5px 0 0 20px;
	position: relative;
	transition: background-color .2s ease-in;
	width: 36px;
}

.m__mizu #anchor4 .m__link__related-link-list .arrow span {
	height: 8px;
	left: 50%;
	overflow: hidden;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 16px;
}

.m__mizu #anchor4 .m__link__related-link-list .arrow span::before,
.m__mizu #anchor4 .m__link__related-link-list .arrow span::after {
	animation-duration: .2s;
	animation-fill-mode: forwards;
	content: "";
	display: inline-block;
	height: 8px;
	left: 0;
	position: absolute;
	top: 0;
	width: 16px;
}

.m__mizu #anchor4 .m__link__related-link-list .arrow span::before {
	background: url(../img/common/icon_arrow.svg) no-repeat center / contain;
}

.m__mizu #anchor4 .m__link__related-link-list .arrow span::after {
	background: url(../img/common/icon_arrow_blue.svg) no-repeat center / contain;
	transform: translateX(-100%);
}

.m__mizu #anchor4 .m__link__related-link-list .description {
	color: var(--sic-color-text);
	font-size: 1.6rem;
}

@media print, screen and (min-width: 768px) and (max-width: 1163px) {
	.m__mizu #anchor4 .m__link__related-link-list .related-link {
		width: calc(50% - 12px);
	}
}

@media only screen and (max-width: 767px) {
	.m__mizu #anchor4 .m__link__related-link-list .related-link {
		width: 100%;
	}
}

@media print, screen and (min-width: 768px) {
	.m__mizu #anchor4 .m__link__related-link-list .link:hover {
		background: #fff;
		border-color: var(--sic-color-primary);
	}

	.m__mizu #anchor4 .m__link__related-link-list .link:hover .title {
		color: var(--sic-color-primary);
	}

	.m__mizu #anchor4 .m__link__related-link-list .link:hover .arrow {
		background: #bfc0d3;
	}

	.m__mizu #anchor4 .m__link__related-link-list .link:hover .arrow span::before {
		animation-delay: .2s;
		animation-name: arrowWhiteX;
	}

	.m__mizu #anchor4 .m__link__related-link-list .link:hover .arrow span::after {
		animation-delay: .2s;
		animation-name: arrowBlueX;
	}

	.m__mizu #anchor4 .m__link__related-link-list .link:not(:hover) .arrow span::before {
		animation-name: arrowWhiteXBack;
		transition-delay: .3s;
	}

	.m__mizu #anchor4 .m__link__related-link-list .link:not(:hover) .arrow span::after {
		animation-name: arrowBlueXBack;
		transition-delay: .3s;
	}
}